/* Atlas Innovations — Design-Token-Quelle (Single Source of Truth).
   Semantische Tokens; Komponenten referenzieren ausschließlich diese.
   Light ist Default, Dark folgt der Systemeinstellung des Besuchers. */

:root {
  /* Farbe */
  --color-bg: #F3F6F5;          /* Messweiß, kühl */
  --color-surface: #FFFFFF;
  --color-ink: #17221F;
  --color-muted: #54655F;
  --color-line: #D8E1DE;
  --color-accent: #0C6B60;      /* Petrol */
  --color-accent-strong: #095248;
  --color-accent-ink: #FFFFFF;
  --color-accent-soft: #E2EFEC;
  --color-signal: #96591F;      /* Messing — nur Festpreis/Einstieg */
  --color-signal-soft: #F5ECE1;
  --color-scrim: rgba(23, 34, 31, 0.5);

  /* Typografie */
  --font-display: "Avenir Next", "Segoe UI Variable Display", "Segoe UI",
    system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-body: var(--font-display);
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Segoe UI Mono",
    Consolas, "Liberation Mono", monospace;

  --text-hero: clamp(2.1rem, 5.2vw, 3.1rem);
  --text-h1: clamp(1.85rem, 4vw, 2.4rem);
  --text-h2: 1.45rem;
  --text-h3: 1.08rem;
  --text-body: 1.0625rem;   /* 17px */
  --text-small: 0.9rem;
  --text-label: 0.7rem;

  --leading-tight: 1.18;
  --leading-body: 1.65;
  --tracking-display: -0.02em;
  --tracking-label: 0.13em;

  /* Raum */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 104px;

  --width-page: 1040px;
  --width-prose: 62ch;

  /* Form */
  --radius-s: 4px;
  --radius-m: 8px;
  --shadow-raise: 0 1px 2px rgba(23, 34, 31, 0.06), 0 8px 24px rgba(23, 34, 31, 0.07);

  /* Bewegung */
  --duration-quick: 150ms;
  --duration-reveal: 450ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #0D1412;
    --color-surface: #141D1A;
    --color-ink: #E3EBE8;
    --color-muted: #8FA19C;
    --color-line: #24312D;
    --color-accent: #4FB9AB;
    --color-accent-strong: #6FCDC0;
    --color-accent-ink: #0A1512;
    --color-accent-soft: #16302B;
    --color-signal: #D49A5C;
    --color-signal-soft: #2A1F13;
    --color-scrim: rgba(0, 0, 0, 0.6);
    --shadow-raise: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.35);
  }
}