/* AI Værk — tokens.css: Design-Variablen und Fonts. Lade-Reihenfolge: 1/5 */

/* AI Værk — Relaunch stylesheet.
   Warm near-white editorial system. Switzer = brand voice, Onest = editorial voice.
   Sans only. No all-caps. Color lives in restrained pastel plates and the aurora. */

/* ── Fonts ─────────────────────────────────────────────── */
@font-face {
  font-family: "Switzer";
  src: url("/assets/fonts/switzer.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Onest";
  src: url("/assets/fonts/onest.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

/* Kein graues Tap-Highlight auf iOS/Android — die Komponenten haben
   eigene Auswahl-/Active-Zustaende. */
html {
  -webkit-tap-highlight-color: transparent;
}

/* ── Tokens ────────────────────────────────────────────── */
:root {
  --paper: #faf8f4;
  --paper-deep: #f2efe8;
  --card: #f4f1ea;
  --ink: #211e1a;
  --ink-soft: #3a362f;
  --stone: #7c766b;
  --stone-faint: #b3ac9f;
  --hairline: #e7e2d8;
  --hairline-strong: #d9d3c6;
  --accent: #2e5a78;
  --accent-soft: #e1eaf1;
  --cherry: #a4243b;
  --dark: #191713;

  /* Hero stays deliberately two-hued; the footer draws from the full aurora. */
  --glacier-deep: oklch(0.46 0.08 235);
  --glacier-blue: oklch(0.78 0.13 235);
  --glacier-ice: oklch(0.91 0.07 225);
  --glacier-mist: oklch(0.96 0.03 220);
  --aurora-pink: oklch(0.78 0.14 345);
  --aurora-rose: oklch(0.9 0.065 345);
  --aurora-violet: oklch(0.53 0.17 295);

  --sage: #dbe7d4;
  --slate: #d3e0e6;
  --sand: #ece3cf;
  --clay: #eddbce;
  --lilac: #e3daf2;

  --sage-line: #bccfb2;
  --slate-line: #b2c8d2;
  --sand-line: #d5c8a6;
  --clay-line: #d9bda7;
  --lilac-line: #c6b8dd;

  --lime: #d9f28e;
  --peach: #ffcfa8;
  --sky: #bfe2ff;
  --mint: #c9ecc9;

  /* Compact hero trail: vivid enough to read, soft enough to remain ambient. */
  --trail-lime: oklch(0.9 0.14 120);
  --trail-pink: oklch(0.84 0.14 350);
  --trail-sky: oklch(0.87 0.1 220);
  --trail-peach: oklch(0.88 0.12 60);
  --trail-lilac: oklch(0.83 0.12 300);
  --trail-yellow: oklch(0.92 0.13 95);
  --trail-mint: oklch(0.88 0.11 160);

  --font-brand: "Switzer", system-ui, sans-serif;
  --font-body: "Onest", system-ui, sans-serif;

  --shell: 1200px;
  --gutter: clamp(20px, 4vw, 48px);
  --radius: 12px;
  --shadow-card: 0 8px 24px rgba(33, 30, 26, 0.07);
  --shadow-float: 0 10px 30px rgba(33, 30, 26, 0.08);
  --ease: cubic-bezier(0.33, 1, 0.4, 1);
  --ease-exit: cubic-bezier(0.55, 0, 1, 0.45);
}