/* Accident Claim Facts — design tokens. "Plain and practical": white paper, petrol brand, one amber highlight,
   Source Serif 4 for headings, Public Sans for text. Every component in site.css uses these tokens only. */

@font-face {
  font-family: "Source Serif 4";
  src: url(../fonts/source-serif-4.woff2) format("woff2");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: url(../fonts/public-sans.woff2) format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
/* Metric-matched fallbacks so the swap to the web fonts barely moves the layout. */
@font-face {
  font-family: "Source Serif Fallback";
  src: local("Georgia"), local("Times New Roman"), local("Liberation Serif"), local("Tinos");
  size-adjust: 118%;
  ascent-override: 87.8%;
  descent-override: 28.4%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Public Sans Fallback";
  src: local("Arial"), local("Liberation Sans"), local("Helvetica"), local("Arimo");
  size-adjust: 102.6%;
  ascent-override: 92.6%;
  descent-override: 21.9%;
  line-gap-override: 0%;
}

:root {
  /* colour */
  --c-paper: #ffffff;
  --c-soft: #f4f5f7;          /* panels, table zebra */
  --c-soft-2: #eceef2;
  --c-ink: #15181e;           /* headings, strong text: 18.4:1 */
  --c-text: #2a2f37;          /* body: 13.9:1 */
  --c-muted: #555c69;         /* secondary text: 6.9:1 */
  --c-brand: #0d4f5c;         /* petrol: header strip, buttons, active states, 9.1:1 */
  --c-brand-dark: #082f38;
  --c-brand-soft: #e6f0f1;
  --c-link: #0a5c86;          /* links: 7.0:1 */
  --c-amber: #f2c94c;         /* the one highlight: key boxes, focus, road dashes */
  --c-amber-soft: #fff6d6;
  --c-amber-ink: #6b4e00;     /* amber-family text, 7.5:1 */
  --c-ok: #17663a;            /* "go" buttons */
  --c-warn: #9a3412;
  --c-warn-soft: #fdf0e9;
  --c-bar: #9b1c1c;           /* contributory negligence chip */
  --c-bar-soft: #fdecec;
  --c-line: #d7dce2;
  --c-line-strong: #a9b0bb;
  --c-on-brand: #ffffff;
  --c-on-brand-muted: #c9dade;

  /* type */
  --f-serif: "Source Serif 4", "Source Serif Fallback", Georgia, "Times New Roman", serif;
  --f-sans: "Public Sans", "Public Sans Fallback", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --t-xs: 0.8125rem;                                    /* 13 */
  --t-sm: 0.9375rem;                                    /* 15 */
  --t-base: clamp(1.0625rem, 1rem + 0.25vw, 1.125rem);  /* 17–18 */
  --t-md: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);    /* 18–20 */
  --t-lg: clamp(1.25rem, 1.12rem + 0.5vw, 1.4375rem);   /* 20–23 */
  --t-xl: clamp(1.5rem, 1.3rem + 0.85vw, 1.875rem);     /* 24–30 */
  --t-2xl: clamp(1.75rem, 1.45rem + 1.3vw, 2.375rem);   /* 28–38 */
  --t-3xl: clamp(2.125rem, 1.6rem + 2.2vw, 3.375rem);   /* 34–54 */
  --lh-body: 1.65;
  --lh-head: 1.15;
  --measure: 70ch;
  --tracking-caps: 0.1em;

  /* space: 8 px scale */
  --s-half: 4px;
  --s-1: 8px;
  --s-2: 16px;
  --s-3: 24px;
  --s-4: 32px;
  --s-5: 40px;
  --s-6: 48px;
  --s-8: 64px;
  --s-10: 80px;
  --s-12: 96px;
  --gutter: 16px;

  /* layout */
  --wrap: 1200px;
  --wrap-wide: 1320px;
  --col-toc: 232px;
  --col-main: 720px;
  --col-note: 220px;

  /* shape: 4 px corners, hairlines, no decorative shadows */
  --r: 4px;
  --hair: 1px solid var(--c-line);
  --hair-strong: 2px solid var(--c-ink);
  --shadow-pop: 0 18px 50px -18px rgba(8, 47, 56, 0.45);

  /* motion: short and quiet */
  --d-micro: 150ms;
  --d-fade: 240ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

@media (min-width: 640px) { :root { --gutter: 24px; } }

@media (prefers-reduced-motion: reduce) {
  :root { --d-micro: 1ms; --d-fade: 1ms; }
}
