/* ══════════════════════════════════════════════════════════════
   TOKENS — the single place to retune the entire look.
   Change a value here and it propagates across every page.
   ══════════════════════════════════════════════════════════════ */

:root {
  /* ── Brand ─────────────────────────────────────────────────
     --amber is sampled directly from logo/weblogo1.png (#FCB118)
     so the accent and the mark are the exact same colour.        */
  --amber:        #FCB118;
  --amber-lift:   #FFC64A;   /* hover / highlight */
  --amber-deep:   #C98A0C;   /* pressed / borders */
  /* Bright amber only reaches 1.8:1 on the cream sections and the deep
     tone only 2.6:1. This bronze clears 3:1 for large text, and reads
     richer on cream than the bright tone does anyway. */
  --amber-paper:  #A8720A;
  --amber-glow:   rgba(252, 177, 24, 0.14);
  --amber-line:   rgba(252, 177, 24, 0.28);

  /* ── Surfaces (dark) ──────────────────────────────────────── */
  --ink:          #0A0A0B;   /* page ground */
  --ink-raise:    #121214;   /* cards */
  --ink-raise-2:  #1A1A1E;   /* nested / hover */
  --ink-sunk:     #070708;   /* footer, wells */

  /* ── Surfaces (light editorial break) ─────────────────────── */
  --paper:        #F2EFE9;
  --paper-raise:  #FFFFFF;
  --paper-line:   rgba(10, 10, 11, 0.10);

  /* ── Text ─────────────────────────────────────────────────── */
  --bone:         #F4F1EC;
  --bone-2:       rgba(244, 241, 236, 0.68);
  /* 0.42 looked right but only reached 3.8:1, and this tone carries the
     small uppercase labels (stats, footer headings, breadcrumbs). */
  --bone-3:       rgba(244, 241, 236, 0.58);
  --on-paper:     #16161A;
  --on-paper-2:   rgba(22, 22, 26, 0.66);

  /* ── Lines ────────────────────────────────────────────────── */
  --line:         rgba(244, 241, 236, 0.10);
  --line-strong:  rgba(244, 241, 236, 0.20);

  /* ── Type ─────────────────────────────────────────────────── */
  --font-display: 'Instrument Serif', 'Times New Roman', Georgia, serif;
  --font-sans:    'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Fluid display scale — clamp(min, preferred, max) */
  --t-hero:   clamp(3.2rem, 8.5vw, 7.5rem);
  --t-d1:     clamp(2.6rem, 5.5vw, 4.75rem);
  --t-d2:     clamp(2rem,   3.8vw, 3.25rem);
  --t-d3:     clamp(1.5rem, 2.4vw, 2rem);
  --t-lead:   clamp(1.0625rem, 1.35vw, 1.3125rem);
  --t-body:   1rem;
  --t-sm:     0.9375rem;
  --t-xs:     0.8125rem;
  --t-label:  0.6875rem;      /* uppercase eyebrow */

  --track-tight:  -0.03em;
  --track-label:   0.18em;

  /* ── Rhythm ───────────────────────────────────────────────── */
  --shell:       1320px;      /* max content width */
  --text-col:    64ch;        /* max prose measure */
  --gutter:      clamp(1.25rem, 5vw, 4.5rem);
  --section-y:   clamp(5rem, 11vw, 10.5rem);
  --nav-h:       84px;
  --nav-h-tight: 66px;        /* after scroll */

  /* ── Depth ────────────────────────────────────────────────── */
  --shadow-sm: 0 2px 8px rgba(0,0,0,.30);
  --shadow-md: 0 18px 44px rgba(0,0,0,.42);
  --shadow-lg: 0 40px 90px rgba(0,0,0,.55);

  --r-sm: 3px;
  --r-md: 6px;
  --r-lg: 12px;

  /* ── Motion ───────────────────────────────────────────────── */
  --ease:      cubic-bezier(.22, .61, .36, 1);
  --ease-out:  cubic-bezier(.16, 1, .3, 1);
  --dur-fast:  180ms;
  --dur:       320ms;
  --dur-slow:  720ms;

  --z-nav:  900;
  --z-menu: 950;
  --z-top:  1000;
}

/* Anyone who has asked their OS to reduce motion gets a static site. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
