/* ==========================================================================
   Design-Tokens
   ========================================================================== */

/* Titelschrift: Fraunces (weiche Variante) als Gratis-Alternative zu Roxborough CF */

:root {
  color-scheme: light;

  /* Farben */
  --ivory: #F5F0E8;           /* Haupthintergrund */
  --sand: #D8C9B5;            /* Akzente, Linien, Platzhalter */
  --sand-soft: #E7DCCD;       /* abgeleitet: helle Sandfläche für Sektionen und Menü */
  --sky: #A8BFCA;
  --blue-deep: #344F60;
  --blue-ink: #263D4B;        /* abgeleitet: Text auf hellem Grund */

  --veil: 38 61 75;           /* RGB von --blue-ink, für Verläufe über Video */
  --line-light: rgb(245 240 232 / 0.38);
  --line-dark: rgb(52 79 96 / 0.16);
  --text-muted: rgb(38 61 75 / 0.68);

  /* Menüfläche (Dropdown, Header beim Scrollen, mobiles Menü) */
  --nav-bg: var(--sand-soft);
  --nav-fg: var(--blue-ink);
  --nav-muted: rgb(38 61 75 / 0.55);
  --nav-line: var(--line-dark);

  /* Typografie */
  --font-display: "Fraunces", "Times New Roman", serif;
  --display-weight: 340;
  --display-fvs: "SOFT" 100, "WONK" 0;
  --font-body: "Montserrat", "Helvetica Neue", Arial, sans-serif;

  --text-eyebrow: 0.75rem;
  --text-nav: 0.8125rem;
  --tracking-wide: 0.22em;
  --tracking-nav: 0.08em;
  --text-body: 1.0625rem;
  --text-lead: clamp(1.25rem, 1.9vw, 1.625rem);
  --text-h2: clamp(2.5rem, 5.4vw, 5rem);
  --text-h3: clamp(1.625rem, 2.4vw, 2.25rem);

  /* Raster */
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
  --header-h: 5.5rem;
  --header-h-compact: 4.25rem;
  --section-y: clamp(6rem, 14vw, 12rem);
  --max-w: 84rem;

  /* Briefumschlag über dem Brief */
  --env-w: min(30rem, 34vw);
  --env-h: calc(var(--env-w) * 2 / 3);

  /* Bewegung */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-soft: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 200ms;
  --dur-base: 380ms;
  --dur-slow: 1200ms;
}

@media (max-width: 900px) {
  :root { --env-w: 72vw; }
}

@media (max-width: 960px) {
  :root {
    --header-h: 4.5rem;
    --header-h-compact: 4rem;
  }
}
