/* lyndacare-shell.css
 *
 * WHAT THIS FILE IS.
 * The design export drew every page inside a 1280px column, centred with
 * margin:0 auto. peopletechrevolution.com does not do that. Its interior
 * pages run full bleed: .ptrcx-shell is padding-inline clamp(20px,4vw,240px)
 * with max-width 6000px, and above 761px the inline padding becomes
 * --ptr-page-gutter: clamp(24px,4vw,160px). The 6000px figure is a ceiling
 * for very wide displays, not a reading measure. The reading measure comes
 * from pairing copy with media, never from capping the copy column.
 *
 * That difference is not cosmetic. It is the operator's 2026-09-05 desktop
 * ruling, and ptr-website-html's own layout gate reports capped, centred copy
 * as two named errors: "Text not left aligned" and "Detached copy".
 *
 * WHY AN OVERRIDE LAYER AND NOT A REWRITE.
 * Every LyndaCare page is authored with inline styles, so the cap lives in 43
 * separate style attributes. Rewriting nine pages of inline markup to adopt
 * PTR's class system would put every line of copy and every card at risk for
 * a layout result this file achieves in one place. The inner columns keep
 * their own max-width, which is what produces the reading measure, so only
 * the SECTION cap is lifted. A blanket override of every descendant was tried
 * first and collapsed the two column hero, which is why the rule below stops
 * at the section.
 *
 * Loaded after desktop-rules-preview.css, which carries the PTR tokens.
 */

:root {
  --ptr-page-gutter: clamp(24px, 4vw, 160px);
}

/* THE SHELL. Sections run the full measure with a page gutter, the same shape
   as .ptrcx-shell. !important because the cap is an inline style attribute
   and nothing else can reach it. */
main > section {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: var(--ptr-page-gutter) !important;
  padding-right: var(--ptr-page-gutter) !important;
}

/* A full bleed band keeps its own edge to edge background and takes the
   gutter on its inner wrapper instead. */
main > section[data-lc-bleed] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
main > section[data-lc-bleed] > * {
  padding-left: var(--ptr-page-gutter);
  padding-right: var(--ptr-page-gutter);
}

/* THE TYPE LADDER, from peopletechrevolution.com's own clamp scale.
   Display type there reaches 96px and carries -0.03em; the export stopped at
   70px. Raising it is most of what makes a page read as PTR rather than as a
   generic product site. Scoped to main so the header, the menu and the footer
   keep the geometry their own components define. */
main h1 {
  font-size: clamp(42px, 6.6vw, 96px) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.03em !important;
  text-wrap: balance;
}
main h2 {
  font-size: clamp(34px, 4.6vw, 56px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.03em !important;
  text-wrap: balance;
}
main h3 {
  letter-spacing: -0.02em;
  text-wrap: balance;
}
main p {
  text-wrap: pretty;
}

/* Copy stays left aligned at every width. The layout gate checks the computed
   value, so a centred paragraph is a failure and not a preference. */
main p,
main h1,
main h2,
main h3,
main li {
  text-align: left;
}

/* Below the PTR band breakpoint the gutter collapses to the phone value, so a
   narrow screen spends its width on words rather than on margin. */
@media (max-width: 760px) {
  :root { --ptr-page-gutter: 20px; }
  main h1 { font-size: clamp(34px, 9vw, 46px) !important; }
  main h2 { font-size: clamp(26px, 7vw, 34px) !important; }
}
