/* ==========================================================================
   Design tokens — Richard Michael
   Every blue in this file was sampled from Assets/hero-portrait.jpg by
   scripts/build-hero-assets.py. The gold is the logo's accent square.
   Nothing here is eyeballed.
   ========================================================================== */

:root {
  /* ---- Ink & paper -------------------------------------------------- */
  --ink: #131417;
  --ink-2: #1b1d22;
  --ink-3: #24272e;
  --paper: #f7f5f1;
  --paper-2: #efece5;
  --paper-3: #e2ded4;

  /* ---- The field ----------------------------------------------------
     Sampled from the portrait's backdrop. --field-halo is the stage light
     that already exists behind him in the photograph.                    */
  --field-high: #0084b2;
  --field-halo: #0191bd;
  --field: #007aa8;
  --field-low: #006da1;
  --field-deep: #01537f;
  --field-deeper: #013d60;
  --field-abyss: #01293f;
  --field-night: #011a29;

  /* ---- Gold — the single accent -------------------------------------- */
  --gold: #d4af37;
  --gold-lift: #e9c964;
  --gold-deep: #9a7d1c;

  /* ---- Semantic ------------------------------------------------------ */
  --on-dark: #f7f5f1;
  --on-dark-2: rgba(247, 245, 241, 0.72);
  --on-dark-3: rgba(247, 245, 241, 0.48);
  --on-paper: #131417;
  --on-paper-2: rgba(19, 20, 23, 0.66);
  --on-paper-3: rgba(19, 20, 23, 0.42);
  --hairline-dark: rgba(247, 245, 241, 0.16);
  --hairline-light: rgba(19, 20, 23, 0.12);

  /* ---- Type ---------------------------------------------------------- */
  --font-display: "General Sans", "Neue Montreal", "Inter", system-ui, sans-serif;
  --font-body: "General Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-editorial: "Boska", "Canela", Georgia, "Times New Roman", serif;

  --t-eyebrow: clamp(0.6875rem, 0.18vw + 0.64rem, 0.8125rem);
  --t-hero: clamp(3.25rem, 9.2vw, 9.5rem);
  --t-display: clamp(2.5rem, 5.4vw, 5rem);
  --t-h2: clamp(2rem, 3.6vw, 3.5rem);
  --t-h3: clamp(1.25rem, 1.3vw + 0.9rem, 1.875rem);
  --t-lead: clamp(1.0625rem, 0.45vw + 0.95rem, 1.3125rem);
  --t-body: clamp(0.9375rem, 0.2vw + 0.9rem, 1.0625rem);
  --t-small: 0.875rem;
  --t-micro: 0.75rem;

  /* ---- Space (8px base) ---------------------------------------------- */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;
  --s-5: 20px;  --s-6: 24px;  --s-8: 32px;  --s-10: 40px;
  --s-12: 48px; --s-16: 64px; --s-20: 80px; --s-24: 96px;
  --s-32: 128px; --s-40: 160px; --s-48: 192px;

  --section-y: clamp(80px, 11vw, 176px);
  --gutter: clamp(20px, 4.4vw, 72px);
  --measure: 1480px;
  --measure-text: 62ch;

  /* ---- Motion --------------------------------------------------------
     Critically damped by default. Bounce is reserved for gesture-driven
     moments only (the hero tilt), per the motion brief.                  */
  --ease-quiet: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.32, 0.36, 1);
  --d-1: 160ms;
  --d-2: 280ms;
  --d-3: 480ms;
  --d-4: 760ms;
  --d-5: 1200ms;

  /* ---- Form ----------------------------------------------------------- */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  --shadow-1: 0 1px 2px rgba(1, 26, 41, 0.10), 0 6px 18px rgba(1, 26, 41, 0.08);
  --shadow-2: 0 2px 6px rgba(1, 26, 41, 0.12), 0 18px 44px rgba(1, 26, 41, 0.16);
  --shadow-3: 0 8px 20px rgba(1, 26, 41, 0.18), 0 40px 90px rgba(1, 26, 41, 0.28);
}
