/* KÜSTENLOT — Design-Tokens
   Einzige Stelle für Farben, Typografie, Abstände und Breiten.
   Änderungen an der Marke passieren hier, nicht in site.css. */

:root {
  /* Farben — bestätigte Markenpalette, nicht erweitern */
  --marine: #0D2238;
  --kueste: #47657A;
  --gold: #C8B173;
  --sand: #EADCC2;
  --paper: #F7F4EF;

  /* Abgeleitete Linien und Flächen (nur Transparenzen der Palette) */
  --line: rgba(13, 34, 56, 0.16);
  --line-strong: rgba(13, 34, 56, 0.28);
  --line-gold: rgba(200, 177, 115, 0.55);
  --line-on-marine: rgba(200, 177, 115, 0.28);

  /* Typografie
     PREVIEW: Webschrift ist noch nicht entschieden. Bis dahin System-Sans.
     Austausch später ausschließlich über --font-sans. */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue",
    "Nimbus Sans", Arial, "Noto Sans", sans-serif;

  --step-hero: clamp(2.8rem, 6vw, 5rem);
  --step-h2: clamp(2rem, 4vw, 3.4rem);
  --step-h3: clamp(1.25rem, 2vw, 1.5rem);
  --step-body: 1.075rem;
  --step-lead: clamp(1.15rem, 1.6vw, 1.3rem);
  --step-small: 0.95rem;
  --step-micro: 0.82rem;

  --lh-tight: 1.12;
  --lh-heading: 1.2;
  --lh-body: 1.62;

  --track-wordmark: 0.135em;
  --track-descriptor: 0.23em;

  /* Raster */
  --content: 1200px;
  --measure: 68ch;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);

  /* Abstände */
  --space-2xs: 0.375rem;
  --space-xs: 0.75rem;
  --space-s: 1.25rem;
  --space-m: 2rem;
  --space-l: 3rem;
  --space-xl: clamp(3.5rem, 7vw, 6rem);
  --section: clamp(5rem, 10vw, 9rem);

  /* Interaktion */
  --tap: 44px;
  --focus: var(--marine);
  --focus-width: 2px;
  --focus-offset: 3px;
  --radius: 2px;
}