/* Zephra site type scale and hero spacing: one source of truth for every page. Loaded last in on hand-built and generated pages. The #main prefix keeps these rules above page-level overrides, so change sizes here rather than in page styles. */ :root{ --zt-h1:clamp(32px,3.9vw,54px); --zt-h2:clamp(28px,2.9vw,42px); --zt-hero-lead:clamp(17px,1.3vw,19px); --zt-lead:clamp(16px,1.2vw,18px); --zt-proof:13px; } /* Page H1: one per page, in the hero */ #main h1{font-size:var(--zt-h1);font-weight:600;line-height:1.06;letter-spacing:-.034em} /* Section headings. Article and legal headings, and headings inside product panels or the booking calendar, keep their own smaller sizes. */ #main h2:not(.prose h2):not(.legal h2):not(.diagnose h2):not(.booking-calendar h2){ font-size:var(--zt-h2);font-weight:600;line-height:1.1;letter-spacing:-.028em} /* Lead paragraphs: the hero lead sits beside the H1; section leads are one step smaller */ #main h1 ~ :is(.lead,.hero-sub){font-size:var(--zt-hero-lead);line-height:1.55} #main .lead:not(h1 ~ .lead){font-size:var(--zt-lead);line-height:1.58} /* Eyebrows */ #main :is(.kicker,.hero-eyebrow){font-size:12px;letter-spacing:.15em} /* Proof line under CTAs: readable sentence case with a check mark per item */ #main :is(.reassure,.hero-note,.fp-reassure){ display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px; font-family:var(--sans);font-size:var(--zt-proof);font-weight:400;line-height:1.5; letter-spacing:0;text-transform:none} #main :is(.reassure,.hero-note,.fp-reassure) > :is(span,li){display:inline-flex;align-items:center;gap:0} #main :is(.reassure,.hero-note,.fp-reassure) > :is(span,li)::before{ content:"\2713";width:auto;height:auto;border-radius:0;background:none; margin-right:7px;font-weight:600;color:var(--teal-deep)} #main :is(.dark,.phero,.hero,.fp-hero,.cp-hero,.cta-band,[data-nav="dark"]) :is(.reassure,.hero-note,.fp-reassure) > :is(span,li)::before{color:var(--teal)} /* Hero top spacing: height-based, as on generated pages, so short laptop screens keep the CTA in view */ #main :is(.phero,.fp-hero){padding-top:calc(var(--nav-h) + clamp(36px,6vh,76px))}