/* Heritage Village design tokens.
   Generated by site/bin/sync-tokens from design-system/typography/typography.css.
   Do not edit here; edit the design system and run the script. */

:root {

  /* Type families ------------------------------------------------- */
  --font-serif: "Merriweather", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-sans:  "Merriweather Sans", "Helvetica Neue", Inter, Arial, sans-serif;

  /* Brand palette ------------------------------------------------- */
  --graphite:      #333333;
  --blue-slate:    #58646f;
  --rosy-taupe:    #ba8f8c;
  --alabaster:     #e0e0e0;
  --parchment:     #f7f3f0;
  --teal:          #14b8a6;

  /* Brand marks: the logo's own greens (D-36). For the logo and rare
     accents only; never for body UI, text, or interactive cues. ------ */
  --brand-forest:  #516559;              /* trunks, lettering, oval ring */
  --brand-sage:    #8c9872;              /* leaves */
  --brand-water:   #7f9c9a;              /* the pond under the trees */

  /* Derived, tinted toward parchment for cohesion ----------------- */
  --paper:         #f7f3f0;
  --paper-deep:    #efe9e4;              /* warmer fold of parchment */
  --paper-edge:    #e9e2dc;
  --ink:           #2a2522;              /* graphite, slightly warmed */
  --ink-body:      #3a3431;
  --ink-muted:     #5a5752;              /* blue-slate, warmed */
  --ink-quiet:     #8a857f;
  --rule:          #d8d1c9;              /* alabaster warmed toward paper */
  --rule-strong:   #a9a29a;
  --accent-warm:   #b08783;              /* rosy-taupe, slightly deeper */
  --accent-warm-deep: #855a56;           /* rosy-taupe for small words: form errors, required marks; 5.3 to 1 on paper, 4.9 on paper-deep (D-233) */
  --alert-tint:    #decdca;              /* the notice band: rosy-taupe at 35% on paper; ink 9.9 to 1, link 4.7 (D-178) */
  --link:          #9a3347;              /* garnet for link words: 6.5 to 1 on paper, 5.6 on paper-edge (D-148; was #855a56, D-145) */
  --accent-cool:   #0f9488;              /* teal, deeper for small marks */

  --invert-paper:  #1e1b19;              /* near-graphite, warmer */
  --invert-ink:    #f1ece6;

  /* Type scale (fluid for display, fixed for UI) ------------------ */
  --step-overline:    0.6875rem;              /* 11 */
  --step-caption:     0.78125rem;             /* 12.5 */
  --step-small:       0.875rem;               /* 14 */
  --step-menu:        0.9375rem;              /* 15: the residents menu at a laptop width; the six items fit one line at 1280 */
  --step-body:        1.0625rem;              /* 17 */
  --step-lede:        clamp(1.25rem, 1.6vw, 1.5rem);     /* 20 → 24 */
  --step-h4:          1.375rem;               /* 22 */
  --step-h3:          clamp(1.625rem, 2.2vw, 2rem);      /* 26 → 32 */
  --step-h2:          clamp(2rem, 3vw, 2.75rem);         /* 32 → 44 */
  --step-h1:          clamp(2.75rem, 5.5vw, 4.25rem);    /* 44 → 68 */
  --step-display:     clamp(3.25rem, 9vw, 8rem);         /* 52 → 128 */
  --step-display-xl:  clamp(3.5rem, 13.5vw, 13.75rem);   /* 56 → 220 */

  /* Leading ------------------------------------------------------- */
  --lh-tight:   1.05;
  --lh-snug:    1.18;
  --lh-normal:  1.55;
  --lh-body:    1.7;
  --lh-loose:   1.85;

  /* Tracking ------------------------------------------------------ */
  --tr-tighter: -0.035em;
  --tr-tight:   -0.02em;
  --tr-snug:    -0.01em;
  --tr-normal:  0;
  --tr-wide:    0.08em;
  --tr-wider:   0.18em;

  /* Measure ------------------------------------------------------- */
  --measure:       68ch;
  --measure-wide:  78ch;
  --measure-narrow: 52ch;

  /* Spacing (4pt scale) ------------------------------------------- */
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 144px;
  --space-6xl: 192px;

  /* Page frame ---------------------------------------------------- */
  --frame-x: clamp(1.25rem, 5vw, 5rem);
  --frame-max: 1280px;
  --hairline: 1px;

}
