/* ==========================================================================
   COSTELLO — DESIGN TOKENS  v1.0 (proposed, 2026-10-01)
   Source of truth for every Costello client page. Values marked
   [obs] are observed in the snapshot and kept; [ref] refined from an
   observed value; [new] proposed. LG Studio review-shell values are NOT here.
   ========================================================================== */

/* ---------- Font faces (files already shipped in the snapshot) ---------- */
@font-face{font-family:"Cormorant Garamond";src:url("fonts/cormorant-latin.woff2") format("woff2");
  font-weight:300 700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";src:url("fonts/cormorant-italic-latin.woff2") format("woff2");
  font-weight:300 700;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* "Costello Sans" = Inter variable, "Costello Mono" = JetBrains Mono variable [obs] */
@font-face{font-family:"Costello Sans";src:url("fonts/costello-sans.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Costello Mono";src:url("fonts/costello-mono.woff2") format("woff2");font-weight:400 500;font-display:swap}
/* [new] Metric-matched fallback so a late/failed Cormorant load does not change
   line breaks much. Liberation/Times measured 2.5% narrower-than-Cormorant ratio
   0.975 on site headlines; Georgia is NOT measured here -> excluded from the stack. */
@font-face{font-family:"Costello Serif Fallback";src:local("Times New Roman"),local("Liberation Serif"),local("Times");
  size-adjust:97.5%;ascent-override:92.4%;descent-override:28.7%;line-gap-override:0%}

.costello-system{
  /* ---------- Colour: materials ---------- */
  --c-canvas:      #F7F3EC;  /* [obs] default reading surface. Replaces #F5F1E9 body value. */
  --c-canvas-alt:  #EFE9DE;  /* [obs] second light material. Replaces #E9E3D8 (fails signal-text). */
  --c-paper:       #FCFBF8;  /* [obs] held objects only: cards, plates, forms, panels */
  --c-navy:        #17283B;  /* [obs] statement chapter, footer, primary button */
  --c-navy-deep:   #0F1C2B;  /* [obs] button hover / pressed */
  --c-navy-raised: #22384C;  /* [obs] plate mat on navy */

  /* ---------- Colour: ink ---------- */
  --c-ink:         #17283B;  /* [ref] one ink value; retires #1C2A3A duplicate */
  --c-ink-muted:   #485460;  /* [obs] ≥6.06:1 on every light material */
  --c-on-navy:     #F7F3EC;  /* [obs] 13.53:1 */
  --c-on-navy-muted:#B8BABA; /* [ref] = cream @72% over navy, 7.68:1 (was rgba .7–.72) */

  /* ---------- Colour: signal (orange) — three roles, one hue family ---------- */
  --c-signal:         #C66736; /* [obs] GRAPHIC ONLY: cords, dots, numerals ≥24px, focus ring, active marks. ≥3:1 on all four materials */
  --c-signal-text:    #A45129; /* [obs] small orange TEXT on light (eyebrow, sequence). 5.01 canvas / 4.59 alt / 5.36 paper */
  --c-signal-on-navy: #D98556; /* [obs] small orange TEXT and marks on navy. 5.30:1 */
  /* Retired: #F16D22 (Home parallel lines, 2.73:1), #F0B28E, #E9E3D8 */

  /* ---------- Colour: rules & fields ---------- */
  --c-rule:          rgb(23 40 59 / 18%); /* [obs] neutral hairline on light */
  --c-rule-strong:   #17283B;             /* [obs] 1px heading rule / list top / form top */
  --c-rule-on-navy:  rgb(247 243 236 / 22%);
  --c-field-border:  #6E7681;  /* [new] 4.44:1 on paper (was #9D9D98, 2.72:1 — fails 1.4.11) */
  --c-field-bg:      #FFFFFF;
  --c-error:         #91391C;  /* [obs] 6.19–7.23:1 on light */
  --c-success:       #2F5D46;  /* [new] 6.84:1 on canvas; intake completion only */
  --c-focus:         var(--c-signal);

  /* ---------- Type families ---------- */
  --ff-serif: "Cormorant Garamond","Costello Serif Fallback","Times New Roman",serif;
  --ff-sans:  "Costello Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ff-mono:  "Costello Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;

  /* ---------- Type scale: fluid 360px → 1440px (rem so text-zoom scales) ---------- */
  /* Display roles. Line-height floors are MEASURED: in this Cormorant build
     p-descender (275) + b-ascender (725) = 1.000em. See Headline Lab. */
  --fs-display:   clamp(2.625rem, 1.917rem + 3.148vw, 4.75rem);  /* 42 → 76  Home hero only */
  --fs-title:     clamp(2.5rem,   1.958rem + 2.407vw, 4.125rem); /* 40 → 66  page H1 (all other pages) */
  --fs-chapter:   clamp(2.125rem, 1.667rem + 2.037vw, 3.5rem);   /* 34 → 56  chapter H2 */
  --fs-section:   clamp(1.875rem, 1.583rem + 1.296vw, 2.75rem);  /* 30 → 44  minor H2, closing, profile rows */
  --fs-card:      clamp(1.5rem,   1.417rem + 0.370vw, 1.75rem);  /* 24 → 28  H3 card / list item */
  --fs-name:      clamp(1.375rem, 1.333rem + 0.185vw, 1.5rem);   /* 22 → 24  person name in card */
  --lh-display:   1.06;   /* [new] gap ≥0.06em p/b; ≥0.051em worst lowercase (j over f) */
  --lh-display-sm:1.08;   /* [new] ≤600px optical spacing */
  --lh-heading:   1.1;
  --lh-card:      1.18;
  --lh-floor:     1.04;   /* [new] absolute minimum for any Cormorant multi-line text */
  --ls-display:   -0.015em; /* [ref] observed -.01 to -.02 */
  --fw-serif:     500;      /* [ref] single display weight; retires About's 300 */

  --fs-lede:      clamp(1.125rem, 1.083rem + 0.185vw, 1.25rem);  /* 18 → 20 */
  --fs-body:      clamp(1rem, 0.979rem + 0.093vw, 1.0625rem);    /* 16 → 17 [obs] */
  --fs-small:     0.9375rem;  /* 15 */
  --fs-ui:        0.875rem;   /* 14 buttons, nav */
  --fs-mono:      0.75rem;    /* 12 eyebrow [obs] */
  --fs-mono-sm:   0.6875rem;  /* 11 caption / metadata — absolute floor for any text */
  --lh-body:      1.7;
  --lh-lede:      1.6;
  --lh-ui:        1.4;
  --ls-mono:      0.14em;
  --measure:      66ch;   /* [obs] body */
  --measure-lede: 56ch;
  --measure-note: 60ch;

  /* ---------- Space (4px base) ---------- */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px;
  --s-7:40px; --s-8:48px; --s-9:64px; --s-10:80px; --s-11:96px; --s-12:128px;
  --section-y:       clamp(3.5rem, 2.667rem + 3.704vw, 6rem);    /* 56 → 96 chapter padding */
  --section-y-tight: clamp(3rem,   2.5rem + 2.222vw, 4.5rem);    /* 48 → 72 reference/utility */
  --opening-top:     clamp(3rem,   2rem + 4.444vw, 6rem);        /* 48 → 96 below header */
  --stack-heading:   clamp(1.25rem, 1.083rem + 0.741vw, 1.75rem); /* 20 → 28 eyebrow→H, H→body */

  /* ---------- Layout ---------- */
  --content-max: 1360px;  /* INNER content maximum (text/edge of plates). Backgrounds are full-bleed. */
  --gutter: 24px;         /* 360–799 */
  --col-gap: clamp(1.5rem, 0.333rem + 5.185vw, 5rem);  /* 24 → 80 [obs 80 desktop] */
  --header-h: 88px;       /* [obs] desktop */
  --header-h-sm: 64px;    /* [new] all pages ≤900px (Home's compact bar pattern) */

  /* ---------- Lines, radii, depth ---------- */
  --bw-hair: 1px; --bw-strong: 2px;
  --radius: 0;            /* [obs] square everywhere; 50% reserved for dots */
  --plate-pad: 12px;      /* [obs] image mat */
  --shadow: none;

  /* ---------- Focus ---------- */
  --focus-w: 3px; --focus-offset: 4px;  /* [obs] 3px #C66736, offset reduced 5→4 */

  /* ---------- Motion ---------- */
  --dur-fast: 160ms; --dur-base: 240ms; --dur-tone: 350ms;
  --ease: cubic-bezier(.22,.7,.18,1);
}
@media (max-width:399.98px){ .costello-system{ --gutter:20px; } }
@media (min-width:800px){ .costello-system{ --gutter:40px; } }
@media (max-width:600px){ .costello-system{ --lh-display:var(--lh-display-sm); } }
@media (prefers-reduced-motion:reduce){ .costello-system{ --dur-fast:0ms; --dur-base:0ms; --dur-tone:0ms; } }

/* Shared editorial roles calibrated to the selected About composition. */
.costello-system{
 --lh-display:1.08;--lh-display-sm:1.1;--lh-heading:1.12;--ls-display:-.008em;
 --fs-eyebrow:11.5px;--fw-eyebrow:500;--lh-eyebrow:1.5;--ls-eyebrow:.16em;
 --lh-ui:1.4;--fw-ui:500;
}
@media(max-width:900px){.costello-system{--fs-eyebrow:10.5px;--ls-eyebrow:.13em}}