/* Design tokens — jcsonocaba.com (Jockey Club de Sorocaba).
 *
 * Source: approved mockup mockups/jcsonocaba.com/a-reta-de-areia.html (A «Reta de Areia»,
 * Kinetic restrained), approved 2026-09-28. Values moved as they are; names by role.
 * Merged duplicates: none needed. Everything marked «added» is not in the mockup.
 */
:root {
  /* ── Colour: from the mockup ─────────────────────────────────────────── */
  --color-bg: #F3EFE7;            /* cal — page background */
  --color-surface: #FFFFFF;
  --color-surface-2: #FAF8F3;     /* card footers (mockup .pareo__foot) */
  --color-ink: #16181B;           /* grafite — text */
  --color-ink-2: #4A4D52;         /* secondary text, 7.6:1 on bg */
  --color-line: #D9D2C4;
  --color-line-strong: #A79E8E;   /* ticks, non-text only */
  --color-brand: #C2502A;         /* areia — fills, rules, non-text */
  --color-brand-text: #A5401F;    /* areia on light, AA */
  --color-brand-deep: #86331A;    /* hover */
  --color-on-brand: #FFFFFF;
  --color-signal: #FFD23F;        /* ONLY live / record markers */
  --color-on-signal: #16181B;
  --color-on-ink-2: #D8D3C9;      /* small text on graphite */

  /* aliases used by the template core (forms, overlays) */
  --color-text: var(--color-ink);
  --color-muted: var(--color-ink-2);
  --color-border: var(--color-line);

  /* ── Colour: added ───────────────────────────────────────────────────── */
  --color-brand-hover: var(--color-brand-deep);
  --color-brand-active: color-mix(in srgb, var(--color-brand-deep) 85%, black);
  --color-hover-tint: rgba(22, 24, 27, .06);
  --color-row-hover: #FBF9F5;
  --color-error: #B3261E;
  --color-error-bg: #FBEDEB;
  --color-success: #1F6B3A;
  --color-success-bg: #EAF4EC;
  --color-scrim: rgba(22, 24, 27, .62);
  --focus-ring: 0 0 0 3px color-mix(in srgb, var(--color-brand) 45%, transparent);

  /* ── Typography: from the mockup ─────────────────────────────────────── */
  --font-display: "Anybody", "Arial Narrow", system-ui, sans-serif;
  --font-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
  --fs-h1: clamp(2.35rem, 1.2rem + 3vw, 3.75rem);
  --fs-h2: clamp(2rem, 1.3rem + 2.4vw, 3.5rem);
  --fs-h3: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
  --fs-lead: 1.1875rem;
  --fs-body: 1.0625rem;
  --fs-small: .9375rem;
  --fs-label: .8125rem;
  /* width axis of Anybody: wide = speed (headlines), narrow = data labels */
  --stretch-wide: 125%;
  --stretch-head: 112%;
  --stretch-label: 70%;
  --stretch-plate: 52%;
  --lh-tight: 1.05;
  --lh-base: 1.55;

  /* ── Space, shape, depth: from the mockup ────────────────────────────── */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;
  --radius-s: 2px;
  --radius-m: 4px;
  --radius-pill: 999px;
  --shadow-pill: 0 6px 18px -10px rgba(22, 24, 27, .45);
  --shadow-card: 0 14px 30px -24px rgba(22, 24, 27, .5);

  /* ── Container ───────────────────────────────────────────────────────── */
  --container: 1440px;
  --gutter: clamp(16px, 3.2vw, 48px);
  --container-pad: var(--gutter);
  --lane-col: 168px;               /* rail column with the lane plate */
  --measure: 68ch;                  /* added: long-read text width */

  /* ── Signature: the straight (régua da reta) ─────────────────────────── */
  --track-len: 503;                 /* metres, longest official distance */

  /* ── Motion (mockup ease; durations added) ───────────────────────────── */
  --ease: cubic-bezier(.2, .7, .1, 1);
  --ease-in: cubic-bezier(.5, 0, .8, .3);
  --dur-fast: 140ms;
  --dur-base: 200ms;
  --dur-slow: 300ms;

  /* ── Layers (added) ──────────────────────────────────────────────────── */
  --z-header: 50;
  --z-overlay: 100;
  --z-banner: 150;
  --z-modal: 200;
}

/* Breakpoints (from the mockup's media queries; cannot be custom properties):
   ≤1180 — reunião strip 3 cols, runner owner column hidden, records stacked
   ≤900  — hero plate below photo, lanes single column
   ≤640  — phone layout; mobile reference width 390 (kit.config.json)
   ≤389  — fixes for narrow phones only                                      */