/* Modus design tokens — verbatim from /design/style-guide.md (extracted from live site).
   Do not hand-edit values here without updating the style guide. */

:root {
  /* Brand */
  --color-primary:            #006ec1;
  --color-primary-hover:      #0a5fa3;
  --color-primary-foreground: #f7f7f7;

  /* Dark mode */
  --color-bg:             #181818;
  --color-fg:             #f7f7f7;
  --color-card:           #131313;
  --color-card-subtle:    #272727;
  --color-text-secondary: #ffffffb3;
  --color-text-tertiary:  #ffffff80;
  --color-border:         #ffffff14;

  /* Light mode */
  --color-muted:          #f3f8fb;
  --color-muted-fg:       #948d86;
  --color-ink:            #131313;
  --color-border-light:   #13131314;
  --color-black:          #000000;

  /* Type */
  --font-display: "ABC Gramercy", Georgia, serif;                 /* headings (serif) */
  --font-sans: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; /* body/UI (grotesque) */
  --font-expressive: "Space Grotesk", ui-sans-serif, system-ui, sans-serif; /* oversized stat numerals */

  --fs-display: clamp(3rem, 9vw, 6.5rem);
  --fs-h1:      clamp(2.5rem, 7vw, 4rem);
  --fs-h2:      clamp(2rem, 5vw, 3rem);
  --fs-h3:      clamp(1.5rem, 3vw, 2rem);
  --fs-h4:      1.5rem;
  --fs-lg:      1.125rem;
  --fs-base:    1rem;
  --fs-sm:      0.8125rem;
  --fs-xs:      0.6875rem;

  /* Grid & spacing */
  --grid-columns: 12;
  --grid-gutter: 16px;
  --grid-margin: 32px;
  --grid-max-width: 1440px;
  --content-max: 720px;

  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px;
  --space-24: 96px; --space-32: 128px;

  --radius-sm: 4px;
  --radius-md: 12px;
  --radius-lg: 24px;

  --transition: 250ms ease-out;
}

@media (max-width: 767px) {
  :root { --grid-margin: 20px; }
}