/* JDLC design tokens. "Sandstone", v1, frozen 2026-09-30.
   Warm limestone paper, eucalypt green for depth, logo orange for the primary action only.
   Direction A ("Ute", dark) was shown and not chosen: design/references/direction-a/.
   These variables are the only allowed values for JDLC pages. */

:root {
  /* Brand (from logo.svg) */
  --orange: #EF8753;          /* logo orange: on --deep only (5.3:1), never on paper as text */
  --leaf: #377C47;
  --leaf-deep: #276E3D;       /* italics, eyebrows on paper (4.9:1 on --bg-2) */
  --leaf-light: #9CC9A4;      /* eyebrows on --deep (7.3:1) */

  /* Accent: primary action only. Logo orange darkened for AA with white ink (4.9:1). */
  --accent: #B8521F;
  --accent-strong: #9E431A;
  --accent-ink: #FFFFFF;
  --shadow-accent: 0 10px 28px -12px rgba(184, 82, 31, 0.55);

  /* Paper surfaces */
  --bg: #F4EFE6;              /* limestone paper */
  --bg-2: #EBE4D6;            /* sandstone, alternating section */
  --surface: #FBF8F2;         /* cards, inputs */
  --line: #D9D0BE;
  --line-strong: #BDB29C;     /* input borders */
  --text: #1C2A1F;            /* eucalypt ink, 13:1 */
  --text-muted: #56604F;      /* 5.2:1 on --bg-2 */
  --text-faint: #5F6557;      /* small labels, 4.8:1 on --bg-2 */

  /* Deep band (about, quote, footer) */
  --deep: #1F3325;            /* eucalypt */
  --deep-2: #17261B;
  --on-deep: #F4EFE6;         /* 11.8:1 */
  --on-deep-muted: #BFC6B6;   /* 7.7:1 */
  --line-deep: rgba(244, 239, 230, 0.16);
  --scrim: linear-gradient(180deg, rgba(23, 38, 27, 0) 30%, rgba(23, 38, 27, 0.78) 100%);

  /* Focus */
  --focus: 0 0 0 3px var(--bg), 0 0 0 5px var(--leaf-deep);

  /* Type: Fraunces (display, opsz 144, weight 500) + Inter (body) */
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --display-weight: 500;
  --step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.9rem);
  --step-0: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --step-1: clamp(1.2rem, 1.1rem + 0.45vw, 1.45rem);
  --step-2: clamp(1.44rem, 1.25rem + 0.9vw, 1.95rem);
  --step-3: clamp(1.73rem, 1.4rem + 1.6vw, 2.6rem);
  --step-4: clamp(2.2rem, 1.5rem + 3.2vw, 4rem);
  --step-5: clamp(2.6rem, 1.4rem + 5vw, 5.75rem);
  --leading-tight: 1.02;
  --leading-body: 1.6;
  --tracking-tight: -0.025em;
  --tracking-wide: 0.14em;

  /* Space */
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: clamp(1rem, 0.8rem + 1vw, 1.5rem);
  --space-lg: clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
  --space-xl: clamp(2.5rem, 2rem + 2.5vw, 4rem);
  --space-2xl: clamp(4rem, 3rem + 4vw, 6rem);
  --space-3xl: clamp(5rem, 3.5rem + 6vw, 9rem);
  --container: 1240px;
  --container-narrow: 760px;

  /* Shape */
  --radius-sm: 4px;
  --radius: 6px;
  --radius-lg: 12px;
  --radius-full: 999px;
  --shadow: 0 30px 60px -30px rgba(28, 42, 31, 0.35);
  --shadow-sm: 0 8px 24px -12px rgba(28, 42, 31, 0.3);

  /* Motion: one curve, one duration family */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.7s;
  --dur-slow: 1.3s;          /* image wipes, hero unmask */
  --stagger: 55ms;           /* per-word delay in headline entrances */
}