/* ===== 1 · Tokens (Prototyp v46) ===== */
/* =====================================================================
   ROS REAL – Design-Tokens aus dem freigegebenen Prototyp v46 (22.09.2026).
   Ersetzt den kompletten :root-Block in theme-src/assets/css/main.css.
   Quelle: 03_Design/05_Exports & Handoff/Prototyp_v46_final/assets/magazin.css (:root)
   Keine weiteren Hex-Werte im Theme. Ausnahmen stehen unten und sind benannt.
   ===================================================================== */
:root {
  /* ---------- Farben (die ganze Palette) ---------- */
  --papier:      #FBFBF9;  /* Seitengrund */
  --papier-tief: #F3F2EE;  /* Seitenleisten, Formularflächen, „Foto folgt“ */
  --stein:       #ECE8E1;  /* Übergang vor und nach dunklen Flächen, Laufleisten-Spur */
  --linie:       #E3E1DC;  /* Trennlinien, Rahmen */
  --tinte:       #1D1C1A;  /* Text */
  --grau:        #5F5B54;  /* Nebentext, Etiketten */
  --blau:        #16203A;  /* Nachtblau: Akzent, Knöpfe, Links, Fuß, Kopf der Landing */
  --kartengrund: #232E4B;  /* Grund der Karten */
  --fehler:      #8A2B2B;  /* Fehlermeldungen in Formularen */
  --auswahl:     #EFE2C9;  /* ::selection */

  /* Benannte Ausnahme, offen zur Entscheidung (Thomas): Daumen der Bildlaufleiste.
     Im Prototyp #BDB8AF; bis zur Entscheidung als eigener Token, nirgends sonst verwenden. */
  --balken:      #BDB8AF;

  /* Die Nachtblau-Abstufungen der Karte (#1D263D … #354671) gehören NUR in den
     Kartenstil (MapLibre-JSON), nie ins CSS. Quelle: assets/magazin-kartenstil.js */

  /* ---------- Schriften ---------- */
  --serif: 'EB Garamond', Georgia, serif;
  --sans:  'Instrument Sans', 'RR Hochzahl', system-ui, sans-serif;
  /* Schnitte: nur 400 (und 400 kursiv bei der Serif). Kein 500/600 im Screendesign,
     keine fetten Überschriften. Schriftdateien liegen seit Auftrag AN lokal. */

  /* ---------- Schriftskala: 6 Serif-Stufen, 4 Sans-Stufen ---------- */
  --g1: clamp(48px, 13vw, 200px);  /* Riesentitel Landing, Kapitelbilder */
  --g2: clamp(44px, 6vw, 88px);    /* Seitentitel (h1) */
  --g3: clamp(32px, 3.4vw, 64px);  /* Abschnitts- und Übersichtstitel */
  --g4: clamp(26px, 2.4vw, 38px);  /* Kacheltitel, Zwischentitel, Kennzahlen, Dialogtitel */
  --g5: clamp(19px, 1.5vw, 25px);  /* Serif-Fließtext, Einleitungen, Preiszeile */
  --g6: 17px;                      /* kleine Serif-Beschriftungen */
  --t1: 16px;  /* Grundtext, ALLE Formularfelder (iOS zoomt unter 16 px), Knöpfe */
  --t2: 15px;  /* Listenzeilen, Dialogzeilen, Filterwerte */
  --t3: 14px;  /* Navigation, Fuß, Sprachumschalter, Filterknöpfe */
  --t4: 12px;  /* kleine Beschriftungen – Untergrenze für alles Lesbare */
  /* Ausnahmen außerhalb der Skala:
     --nam / --nam-m  Objektname .riese, je Objekt aus der Namenslänge berechnet (nowrap)
     11px             nur der Kartennachweis (© OpenStreetMap …) */

  /* ---------- Zeilenhöhen ---------- */
  --zh-titel: 1.05;   /* alle großen Serif-Titel (v44) */
  --zh-text:  1.6;    /* Fließtext */
  --unterstrich-abstand: 2px; /* Textlinien nah an der Schrift, unabhängig von der Klickfläche. */

  /* ---------- Abstände ---------- */
  --rand:  clamp(20px, 4.4vw, 72px);   /* Seitenrand links/rechts */
  --abs:   clamp(64px, 8vw, 120px);    /* zwischen Abschnitten */
  --block: clamp(32px, 3.4vw, 48px);   /* zwischen Blöcken */
  --el:    clamp(16px, 1.6vw, 24px);   /* zwischen Elementen */

  /* ---------- Bewegung ---------- */
  --lang: .8s cubic-bezier(.16, .84, .26, 1);  /* große Bewegungen, Einblenden */
  /* Seitenübergang U1: <main> blendet hinaus 140 ms, herein 220 ms, ease. */
}

/* Form: keine runden Ecken (Ausnahme: runde Marker/Kreise 50 %), keine Verläufe
   (Ausnahme: Kopf und Fuß der Landing blenden aus dem Kartengrund), keine Schatten
   (Ausnahme: schwebende Elemente über der Karte: 0 10px 36px rgba(22,32,58,.36)). */
::selection { background: var(--auswahl); color: var(--tinte); }
:focus-visible { outline: 2px solid var(--blau); outline-offset: 2px; }
* { scrollbar-width: thin; scrollbar-color: var(--balken) var(--stein); }

/* ===== 2 · Basis ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--papier); color: var(--tinte); font: 400 var(--t1)/var(--zh-text) var(--sans); }
img, svg, video { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }

/* Safari kennt scrollbar-width/scrollbar-color noch nicht: schmal, Daumen in --balken, Spur in --stein, ohne runde Ecken. */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--stein); }
::-webkit-scrollbar-thumb { background: var(--balken); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===== 3 · Schrift ===== */
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; line-height: var(--zh-titel); margin: 0; }
h1 { font-size: var(--g2); }
h2 { font-size: var(--g3); }
h3 { font-size: var(--g4); }
h4 { font-size: var(--g5); }
p { margin: 0 0 1em; }
.serif { font-family: var(--serif); }
.kursiv { font-style: italic; }
.klein { font: 400 var(--t4)/1.6 var(--sans); text-transform: uppercase; letter-spacing: .13em; color: var(--grau); }
.einleitung { font-family: var(--serif); font-size: clamp(21px, 1.74vw, 25px); line-height: 1.56; }
.flow { font: 400 var(--g5)/1.72 var(--serif); }

/* ===== 4 · Links ===== */
a { color: inherit; text-decoration: none; }
a:hover, a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: var(--unterstrich-abstand); }
.ulink { color: var(--blau); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: var(--unterstrich-abstand); }

/* ===== 5 · Knöpfe ===== */
.knopf {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 24px;
  border: 0;
  border-radius: 0;
  background: var(--blau);
  color: var(--papier);
  font: 400 var(--t2)/1.2 var(--sans);
  letter-spacing: .02em;
  text-decoration: none;
}
.knopf:hover { opacity: .9; }
/* Gesamttest 23.09.: display:inline-flex hob [hidden] auf (z. B. „Weiter“ im Suchauftrag-Schritt 3 blieb sichtbar und tat nichts). */
.knopf[hidden] { display: none !important; }
.knopf[disabled], .knopf[aria-disabled="true"] { opacity: .4; cursor: not-allowed; }
.knopf--zweit {
  background: none;
  color: var(--tinte);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: var(--unterstrich-abstand);
}

/* ===== 6 · Trefferflächen ===== */
.tf { position: relative; }
.tf::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(44px, 100% + 16px);
  height: 44px;
  transform: translate(-50%, -50%);
}

/* ===== 7 · Hilfsklassen ===== */
/* Audit 23.09.: alle Werte hart – sonst zog z. B. „.inquiry__case legend { width:100% }“ die Fläche auf volle Breite. */
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }
.skip-link {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 999;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  background: var(--blau);
  color: var(--papier);
  font-size: var(--t1);
  transform: translateY(-100%);
}
.skip-link:focus { transform: none; }
.rand { padding-inline: var(--rand); }
.abs { padding-block: var(--abs); }

/* ===== K2 – Messrunde 2 Nr 54 (Claude, 22.09.): Textlinks im Inhalt unterstrichen wie
   Prototyp .ulink (1 px, knapp unter der Schrift). Bedienelemente mit eigener Linie ausgenommen. ===== */
main a.tf:not(.knopf):not(.weg):not(.alleweg):not(.agent):not(.page-numbers) {
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: var(--unterstrich-abstand);
}

/* K2 Paket 4 – Messrunde 2 Nr 129: Fließtext der Inhaltsseiten wie Prototyp (--fs-text 19–20 px),
   nicht mit dem Serif-Token bis 25 px mitwachsen. Seitentitel wie Prototyp 46–88 px. */
.flow { font-size: clamp(19px, 1.45vw, 20px); }
.seite h1.name,
.wrap h1.name { font-size: clamp(46px, 6.1vw, 88px); }