/* Caronic Vorab-Seite (caronic.ai): nur Ergänzungen zu site.css/chat.css (lädt nach beiden), Werte aus den Tokens dort.
   Quelle: deploy/vorab/vorab.css, kopiert nach site/assets/css/vorab.css durch vorab_bauen.py. */

/* Kopf: nur das Wortlogo mit Tachonadel (Inhaber 21.10.2026), auf jeder Breite. 40 px hoch, Schutzraum 0,5 × H = 20 px
   über --nav-h (80 px). Unter 480 px tauscht site.css nur .nav-logo-wort gegen das Icon; das Vorab-Logo trägt die Klasse nicht. */
.vorab-kopf .nav-bar{justify-content:flex-start}

/* Fuß: eine Zeile, © links, Rechtliches rechts; bricht schmal sauber um */
.vorab-fuss{padding:var(--s-8) 0}
.vorab-fuss .foot-bottom{margin-top:0;padding-top:0;border-top:0;align-items:center}
.vorab-fuss .foot-bottom p{margin:0}
.vorab-recht{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-6);list-style:none;margin:0;padding:0}
.vorab-recht a{display:inline-flex;align-items:center;min-height:24px;color:var(--c-navy);text-decoration:none;border-radius:var(--r-xs)}
.vorab-recht a:hover{text-decoration:underline;text-underline-offset:3px}
.vorab-recht a[aria-current="page"]{font-weight:600}

/* Token nur für die Vorab-Seite (Inhaber 21.10.2026): Endton der H1-Hervorhebung „Tachonadel“; auf dem Hero-Grund #FEFBFA 4,06 : 1 (berechnet).
   Gleicher Wert wie der bisher literal gesetzte Endton des Knopf-Verlaufs in site.css. */
:root{--c-orange-tief:#D2541C}

/* ---------- H1 Variante C „Tachonadel“ (Inhaber 21.10.2026) – nur Vorab-Seite, überschreibt den Verlauf aus site.css ----------
   Endzustand Orange → Orange tief (60 %) → Orange-Ink, jede Stufe ≥ 3 : 1 auf dem Hero-Grund. Eine Ebene doppelt so breit wie das Wort:
   linke Hälfte der Verlauf, rechte Hälfte Navy, harte Kante bei 50 %. Beim Laden zieht die Kante einmal von links nach rechts durch
   (nur background-position, 1,2 s, ease-out, ab 0,25 s); vorher steht das Wort in Navy. Kein Loop, kein JS.
   prefers-reduced-motion: sofort der Endzustand. Kontrastmodus: CanvasText (Regel unten, wiederholt, weil diese Datei nach site.css lädt).
   Rückfall ohne Textverlauf oder oklab: Vollton Orange tief, nie unsichtbarer Text. */
.hero h1 .hl{background:none;color:var(--c-orange-tief);-webkit-text-fill-color:var(--c-orange-tief)}
@supports ((-webkit-background-clip:text) or (background-clip:text)) and (background-image:linear-gradient(in oklab 90deg,#000,#fff)){
.hero h1 .hl{
  background:linear-gradient(in oklab 90deg,var(--c-orange) 0%,var(--c-orange-tief) 30%,var(--c-orange-ink) 50%,var(--c-navy) 50%,var(--c-navy) 100%) 0 0 / 200% 100% no-repeat;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent
}
}
@media (prefers-reduced-motion:no-preference){
  .hero h1 .hl{animation:hl-nadel 1.2s cubic-bezier(.22,.8,.3,1) .25s backwards}   /* backwards: Navy schon vor dem Start; danach gilt die Grundregel (Endzustand) */
}
@keyframes hl-nadel{from{background-position:100% 0}to{background-position:0 0}}
@media (forced-colors:active){
  .hero h1 .hl{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText;animation:none}
}

/* ---------- Pause stoppt die Tipp-Punkte (Mila K1, WCAG 2.2.2) ----------
   Die animation-Kurzschreibweise in chat.css (.chat.is-anim .chat-tippt.ist-da i, 0,4,1) setzt den play-state zurück; dieser Selektor (0,5,1) gewinnt. */
.chat.is-anim.is-pause .chat-tippt.ist-da i{animation-play-state:paused}

/* ---------- Fokus nicht unter dem festen Kopf (Mila H1, WCAG 2.4.11) ---------- */
html{scroll-padding-top:calc(var(--nav-h) + 16px)}
section[id],article[id],li[id]{scroll-margin-top:8px}   /* addiert sich zu scroll-padding-top: Sprungziele landen wie in site.css bei Kopf + 24 px */
