/* ============================================================================
   PSC — Design-Tokens (EINZIGE Quelle für Farben, Schriften, Maße)
   ============================================================================
   Struktur 1:1 von okava-website-v2/css/tokens.css übernommen, Werte auf die
   PSC-Markenfarben umgestellt (Logo-Blau + Logo-Grün, siehe
   assets/images/psc-logo.svg). Reihenfolge der Stylesheets in
   templates/layout.php:

       fonts.css  →  tokens.css  →  style.css  →  components.css

   Wer eine Farbe, eine Schrift, einen Abstand oder einen Schatten ändern
   will, ändert sie hier — nirgends sonst. Die Variablennamen (--terra,
   --olive, --espresso, …) sind bewusst wie in der Vorlage benannt, damit
   components.css unverändert aus okava-website-v2 übernommen werden konnte;
   inhaltlich stehen sie hier für PSC-Blau bzw. PSC-Grün, nicht für Erdtöne.
   ========================================================================= */

:root{
  /* ---------- Palette: kühles Corporate-Blau + Logo-Grün als Akzent ----- */
  --cream:      #f3f5f8;   /* Standard-Seitengrund                        */
  --cream-2:    #e8ecf2;   /* zweiter Flächenton, für abwechselnde Panels  */
  --paper:      #ffffff;   /* Karten und erhabene Flächen                 */
  --sand:       #cbd8e6;   /* Bildplatzhalter, Schrift auf Dunkel          */
  --stone:      #aebdcf;   /* Trennlinien auf Sand                        */
  --ink:        #0f2438;   /* Überschriften, Grundfarbe Text              */
  --ink-soft:   #3c5165;   /* Fließtext                                   */
  --ink-faint:  #5c7086;   /* Meta-Angaben, Labels — dunkler als die Vorlage,
                               damit 13px-Text WCAG AA (4.5:1) auf --cream
                               UND --paper erreicht (Original #71869a lag nur
                               bei ~3.7–3.9:1)                              */
  --espresso:   #0b2138;   /* dunkle Panels (Logo-Blau, dunkel)           */
  --espresso-2: #102c46;   /* dunkle Panels, zweite Stufe                 */
  --terra:      #12549e;   /* EINZIGE Akzentfarbe — PSC-Logo-Blau         */
  --terra-deep: #0c3d78;   /* Akzent, Hover                               */
  --olive:      #5f7f22;   /* sparsame zweite Signalfarbe (Eyebrows) — abgedunkeltes Logo-Grün, lesbar auf Hell */
  --gold:       #afcd51;   /* sparsam, Status/Badges — reines Logo-Grün   */
  --line:       rgba(15,36,56,.14);
  --line-2:     rgba(15,36,56,.08);
  --line-cream: rgba(243,245,248,.22);

  /* ---------- Schatten ------------------------------------------------ */
  --shadow-sm: 0 1px 2px rgba(15,30,45,.06), 0 6px 22px -10px rgba(15,30,45,.20);
  --shadow-lg: 0 30px 70px -34px rgba(10,22,35,.45);

  /* ---------- Schrift: genau zwei Familien ----------------------------- */
  --serif: "Questrial", "Segoe UI", sans-serif;   /* Logo + Headlines */
  --sans:  "Exo 2", "Segoe UI", -apple-system, sans-serif;  /* Fließtext */
  --mono:  var(--sans);

  /* ---------- Maße ---------------------------------------------------- */
  --st-maxw: 1240px;                    /* normale Inhaltsbreite          */
  --st-wide: 1480px;                    /* breite Inhaltsbreite           */
  --gutter:  clamp(20px, 5vw, 84px);    /* seitlicher Innenabstand        */
  --radius:  3px;                       /* keine runden Ecken außer Icons */

  /* ---------- Schriftgrößen: genau drei Stufen ------------------------- */
  /* Auf der ganzen Seite gibt es nur diese drei Größen — keine weiteren
     Zwischenstufen. Alles, was größenmäßig eine Überschrift, Fließtext
     oder ein Hinweis/Label ist, referenziert eines dieser drei Tokens. */
  --fs-heading: clamp(22px, 2.8vw, 34px);  /* alle Überschriften (h1–h4, Hero, Nav, Footer-Logo) */
  --fs-body:    16px;                       /* aller Fließtext                                    */
  --fs-hint:    13px;                       /* Hinweise, Labels, Meta, Buttons, Footer-Kleingedrucktes */

  /* Aliase für unbenutzten Baustein-Altcode aus okava-website-v2 (Preiskarten,
     Zimmerkarten-Detailzeilen, Download-Hinweise) — bewusst kein eigenes
     drittes/viertes Größensystem, nur eine Rückwärtskompatibilität, falls
     dieser tote Code je aktiviert wird. */
  --fs-body-sm: var(--fs-body);
  --fs-body-xs: var(--fs-hint);

  /* ---------- Layout ---------------------------------------------------- */
  --container-max: var(--st-maxw);
  --header-height: 84px;

  /* ---------- Übergänge -------------------------------------------------- */
  --transition-fast: 180ms cubic-bezier(.2,.7,.2,1);
  --transition-base: 420ms cubic-bezier(.2,.7,.2,1);
  --transition-slow: 900ms cubic-bezier(.2,.7,.2,1);
}