/* Heritage Collision Experts: design tokens.
   One file to change colors, type, spacing. Values come from DESIGN-BRIEF.md. */
:root {
  /* Grounds and ink */
  --paper: #F4F6F9;
  --paper-2: #E9EDF2;
  --paper-3: #DDE3EB;
  --navy: #14213D;
  --navy-2: #1C2B4B;
  --navy-3: #24365C;
  --ink: #10182B;
  --ink-soft: #4B5569;
  --bone: #F4F6F9;
  --bone-soft: #A9B3C4;
  --line: rgba(16, 24, 43, 0.12);
  --line-dark: rgba(244, 246, 249, 0.14);

  /* Accent: one hue, two stops (light ground / dark ground) */
  --orange: #E8632E;
  --orange-hover: #D5561F;
  --orange-dark: #F27A45;
  --orange-dark-hover: #F58C5F;
  /* Buttons: deep enough for white text at 4.5:1. Decorative orange above stays brighter. */
  --accent: #C94B1B;
  --accent-hover: #B44217;
  --accent-ink: #FFFFFF;

  /* Type */
  --font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-text: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --t-xs: 0.8125rem;
  --t-sm: 0.9375rem;
  --t-md: 1.0625rem;
  --t-lg: 1.25rem;
  --t-xl: clamp(1.5rem, 1.2rem + 1.2vw, 1.9rem);
  --t-2xl: clamp(1.75rem, 1.3rem + 1.8vw, 2.3rem);
  --t-3xl: clamp(2rem, 1.4rem + 2.6vw, 3rem);
  --t-4xl: clamp(2.2rem, 1.5rem + 3.6vw, 3.6rem);
  --lh-tight: 1.04;
  --lh-snug: 1.18;
  --lh-body: 1.6;
  --track-tight: -0.02em;
  --track-normal: -0.005em;
  --measure: 62ch;

  /* Spacing, 4px base */
  --s-1: 0.25rem; --s-2: 0.5rem; --s-3: 0.75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem; --s-7: 3rem; --s-8: 4rem; --s-9: 6rem; --s-10: 8rem;
  --section: clamp(4rem, 3rem + 5vw, 8rem);
  --section-tight: clamp(2.5rem, 2rem + 3vw, 5rem);
  --gutter: clamp(1.25rem, 0.5rem + 3vw, 3rem);
  --wrap: 1200px;
  --wrap-narrow: 840px;

  /* Shape and depth */
  --radius: 0.75rem;
  --radius-sm: 0.5rem;
  --edge: inset 0 1px 0 rgba(255, 255, 255, 0.6);
  --edge-dark: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --e1: 0 1px 2px rgba(20, 33, 61, 0.06), 0 2px 8px rgba(20, 33, 61, 0.06);
  --e2: 0 4px 12px rgba(20, 33, 61, 0.08), 0 12px 32px rgba(20, 33, 61, 0.10);
  --e3: 0 12px 28px rgba(20, 33, 61, 0.14), 0 32px 64px rgba(20, 33, 61, 0.16);

  /* Motion */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --dur-ui: 160ms;
  --dur-in: 620ms;

  /* Chrome */
  --nav-h: 72px;
  --nav-h-small: 60px;
}
