/* Shared Hero adapter: Quillo (family: professional). CONTRACT.md §2/§3.
   Copied from ~/.claude/skills/quillo/tokens.css (:root, .t-h1, .t-lead, .t-label),
   quillo.css (.site-head, .site-head--light, .hero, .hero__title, .hero__lead, .eyebrow, .btn--*, .awards,
   .vr-hero-b/.vr-hero-d, the ≤640px .t-h1 size) and pages/index.html + pages/variants.html (hero-a..d markup).
   Quillo natively defines --bg --surface --surface-2 --text --text-2 --muted --line --on-dark --accent --on-accent
   --font --font-display --r-sm --r --r-lg --r-pill --container --gutter: not re-declared. */
:root {
  /* (a) aliases for contract tokens Quillo lacks */
  --ink-bg: var(--dark);                /* espresso: testimonials card, compare column, footer */
  --accent-ink: var(--accent-2-ink);    /* copper as small text on light (4.5:1); marigold itself is never text on linen */
  --star: var(--accent-2);              /* .vr-rating svg / review stars: copper */
  --font-label: var(--mono);            /* .t-label / .eyebrow are Geist Mono */

  /* (b) voice: .t-h1 = Lora 400 66px / 1.1 / -2px (42px / -1.2px on phones); no italic em (emphasis is the two-tone --muted span) */
  --display-size: 66px; --display-size-sm: 42px;
  --display-weight: 400; --display-lh: 1.1;
  --display-tracking: -.03em;           /* = -2px at 66px, -1.26px at 42px (Quillo: -2px / -1.2px) */
  --display-em: normal;
  --lead-size: 18px; --body-weight: 400;   /* .t-lead: Manrope 18/400 */
  --label-size: 14px; --label-tracking: .04em; --label-transform: uppercase; --label-weight: 400;   /* .t-label; .eyebrow adds an 8px dot */

  /* (c) shape + nav */
  --r-hero: var(--r);                   /* 12px: .vr-hero-b__photo, .vr-hero-d__photo, .ab-hero__photo */
  --nav-offset: 84px;                   /* .site-head__in height: in-flow ink header on linen pages (72px ≤ 900px) */
  --hero-tuck: 0px;                     /* a borrowed hero keeps the in-flow ink header; only Quillo's own .hero carries .site-head--light over the photo */
  --hero-pad-top: 48px;                 /* .vr-hero-b { padding-block: 48px 0 } (hero-d 64px, about 94px) */
}