/* Generated from unitro-relaunch_chatty_v2.html for WordPress theme variant: chatty-v2. */
/* ============================================================
   UNITRO Relaunch - Suchzentrale zuerst, Liquid-Glass-Akzente
   Markenfarben: Dunkelgrün #0D3D00 · Warmweiß #E4D3BE
   ============================================================ */
:root{
  color-scheme: only light;      /* Dark Mode: Markenfarben bleiben, keine Auto-Abdunklung */
  accent-color: #0D3D00;
  --gruen:        #0D3D00;
  --gruen-tief:   #082B00;
  --beige:        #E4D3BE;
  --papier:       #F2E9DB;
  --creme:        #FAF5EB;
  --linie:        rgba(13,61,0,.16);
  --linie-dunkel: rgba(228,211,190,.16);
  --text:         #133509;

  --f-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --f-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --r-s:12px; --r-m:18px; --r-l:26px;
  --wrap:1160px;
  --schatten:0 18px 40px -18px rgba(8,43,0,.35);

  /* Liquid Glass - Warmweiß-Interpretation */
  --glas-hell:   linear-gradient(150deg, rgba(255,252,246,.82), rgba(234,220,199,.55));
  --glas-dunkel: linear-gradient(150deg, rgba(228,211,190,.22), rgba(228,211,190,.09));
  --glas-kante:  rgba(255,255,255,.55);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--f-body); font-size:17px; line-height:1.65;
  color:var(--text); background:var(--creme);
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
/* UNITRO mobile overflow/zoom guard: verhindert seitliches Wegzoomen/Schieben auf iOS */
html, body{ max-width:100%; overflow-x:hidden; }
body{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }

a{ color:inherit; }
::selection{ background:var(--gruen); color:var(--beige); }
.wrap{ width:min(var(--wrap), calc(100% - 48px)); margin-inline:auto; }
@media (max-width:640px){ .wrap{ width:calc(100% - 36px); } }

.eyebrow{
  font-family:var(--f-mono); font-size:.72rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase;
}
h1,h2,h3{ font-stretch:118%; letter-spacing:-.01em; }
h2.titel{ font-size:clamp(1.9rem,3.6vw,2.7rem); font-weight:800; line-height:1.12; color:var(--gruen); margin-top:10px; }
h2.titel em, h1 em{ font-style:italic; font-weight:700; }
.untertitel{ max-width:58ch; margin-top:14px; color:rgba(19,53,9,.78); }

:focus-visible{ outline:3px solid var(--gruen); outline-offset:3px; border-radius:4px; }
.hero :focus-visible, .board :focus-visible, footer :focus-visible{ outline-color:var(--beige); }

.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--f-mono); font-size:.8rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; text-decoration:none;
  padding:15px 26px; border-radius:var(--r-s); border:1.5px solid transparent;
  cursor:pointer; transition:transform .18s ease, box-shadow .18s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0) scale(.98); }
.btn--voll{ background:var(--beige); color:var(--gruen); }
.btn--voll:hover{ box-shadow:0 10px 24px -10px rgba(0,0,0,.45); }
.btn--rahmen{ border-color:rgba(228,211,190,.55); color:var(--beige); background:transparent; }
.btn--rahmen:hover{ border-color:var(--beige); }
.btn--gruen{ background:var(--gruen); color:var(--beige); }
.btn--gruen:hover{ box-shadow:var(--schatten); }

/* --- Gleis-Trenner ------------------------------------------- */
.gleis{
  height:30px; width:100%;
  background:
    repeating-linear-gradient(90deg, currentColor 0 12px, transparent 12px 44px),
    linear-gradient(currentColor, currentColor) 0 5px / 100% 3px no-repeat,
    linear-gradient(currentColor, currentColor) 0 22px / 100% 3px no-repeat;
  opacity:.22; color:var(--beige);
}

/* ============================================================
   Kopfzeile - bewusst dezent, damit die Suche darunter wirkt
   ============================================================ */
.kopf{
  position:sticky; top:0; z-index:60;
  background:rgba(250,245,235,.88); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--linie);
}
.kopf__inner{ display:flex; align-items:center; justify-content:space-between; height:70px; }
.kopf__logo img{ height:40px; width:auto; }
.kopf__nav{ display:flex; gap:30px; }
.kopf__nav a{
  font-family:var(--f-mono); font-size:.72rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; text-decoration:none;
  color:var(--gruen); padding:6px 0; position:relative;
}
.kopf__nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0;
  height:2px; background:var(--gruen); transition:right .2s ease;
}
.kopf__nav a:hover::after{ right:0; }
.burger{ display:none; background:none; border:0; cursor:pointer; padding:10px; }
.burger span{ display:block; width:24px; height:2.5px; background:var(--gruen); margin:5px 0; border-radius:2px; transition:.2s; }
@media (max-width:860px){
  .kopf__nav{
    position:absolute; top:70px; left:0; right:0;
    flex-direction:column; gap:0;
    background:var(--creme); border-bottom:1px solid var(--linie);
    max-height:0; overflow:hidden; transition:max-height .25s ease;
  }
  .kopf__nav.offen{ max-height:340px; }
  .kopf__nav a{ padding:15px 22px; border-top:1px solid var(--linie); }
  .kopf__nav a::after{ display:none; }
  .burger{ display:block; }
  .burger.offen span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
  .burger.offen span:nth-child(2){ opacity:0; }
  .burger.offen span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }
}

/* ============================================================
   HERO = SUCHZENTRALE (Herzstück der Seite)
   ============================================================ */
.hero{ position:relative; z-index:20; background:var(--gruen); color:var(--beige); overflow:visible; }
.hero::before{                       /* warme Lichtinseln für Glas-Tiefe */
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(46% 60% at 18% 18%, rgba(228,211,190,.14), transparent 70%),
    radial-gradient(42% 55% at 86% 78%, rgba(226,183,100,.12), transparent 70%),
    radial-gradient(30% 40% at 62% 10%, rgba(228,211,190,.08), transparent 70%);
}
/* --- Optionaler Video-Banner (wie auf der aktuellen Website) -----
   Aktivierung: der Hero-Section die Klasse "hero--video" geben und
   die MP4-URL im Video-Element eintragen (Kommentar im HTML).
   Der grüne Verlauf darüber garantiert, dass Suche und Text lesbar
   bleiben - und lädt das Video nicht, bleibt einfach der grüne
   Markenhintergrund stehen (kein Loch, kein Fehlerbild). */
.hero__video{ display:none; }
.hero--video .hero__video{ display:block; position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero--video .hero__video video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.hero--video .hero__video::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,36,0,.58) 0%, rgba(8,36,0,.46) 55%, rgba(8,36,0,.66) 100%);
}
/* mobil scheint das Reel noch etwas stärker durch */
@media (max-width:680px){
  .hero--video .hero__video::after{
    background:linear-gradient(180deg, rgba(8,36,0,.5) 0%, rgba(8,36,0,.38) 55%, rgba(8,36,0,.6) 100%);
  }
}

/* Safari/iPadOS-Fallback ohne natives Play-Symbol.
   Das Video steht nicht mehr im initialen HTML. JavaScript erzeugt es nur
   für einen echten Abspielversuch. Währenddessen liegt das lokale Poster
   als vollständig deckende Ebene darüber. Scheitert Autoplay, wird das
   Videoelement wieder entfernt und nur der eigene Startknopf angezeigt. */
.hero--video .hero__video{ background:var(--gruen-tief); }
.hero--video .hero__video-host{
  position:absolute; inset:0; z-index:1; overflow:hidden;
}
.hero--video .hero__video-host video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; pointer-events:none; -webkit-appearance:none;
  transition:opacity .28s ease;
}
.hero--video .hero__video-host video::-webkit-media-controls,
.hero--video .hero__video-host video::-webkit-media-controls-panel,
.hero--video .hero__video-host video::-webkit-media-controls-play-button,
.hero--video .hero__video-host video::-webkit-media-controls-start-playback-button,
.hero--video .hero__video-host video::-webkit-media-controls-overlay-play-button{
  display:none !important; -webkit-appearance:none !important; opacity:0 !important;
}
.hero--video .hero__video-fallback{
  position:absolute; inset:-3%; z-index:3;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  transform:scale(1.035);
  animation:unitro-hero-poster-bewegung 16s ease-in-out infinite alternate;
  opacity:1; visibility:visible; pointer-events:none;
  transition:opacity .28s ease, visibility 0s linear .28s;
}
.hero--video .hero__video.is-playing .hero__video-host video{ opacity:1; }
.hero--video .hero__video.is-playing .hero__video-fallback{
  opacity:0; visibility:hidden;
}
.hero--video .hero__video::after{ z-index:4; pointer-events:none; }
@keyframes unitro-hero-poster-bewegung{
  from{ transform:scale(1.035) translate3d(-.45%, -.25%, 0); }
  to{ transform:scale(1.085) translate3d(.55%, .35%, 0); }
}
.hero__video-start{
  position:absolute; right:max(18px, env(safe-area-inset-right));
  bottom:max(16px, env(safe-area-inset-bottom)); z-index:4;
  display:inline-flex; align-items:center; gap:9px;
  min-height:44px; padding:10px 15px; border:1px solid rgba(250,245,235,.5);
  border-radius:999px; background:rgba(8,43,0,.88); color:#F8F1E6;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:0 12px 28px rgba(0,0,0,.28); cursor:pointer;
  font:700 .78rem/1 var(--f-sans); letter-spacing:.02em;
}
.hero__video-start[hidden]{ display:none !important; }
.hero__video-start:hover{ background:rgba(8,43,0,.97); transform:translateY(-1px); }
.hero__video-start:focus-visible{ outline:3px solid rgba(250,245,235,.9); outline-offset:3px; }
.hero__video-start:disabled{ opacity:.7; cursor:wait; }
.hero__video-start-icon{
  width:0; height:0; border-top:6px solid transparent; border-bottom:6px solid transparent;
  border-left:10px solid currentColor; margin-left:2px;
}
@media (max-width:680px){
  .hero__video-start{ right:12px; bottom:10px; min-height:40px; padding:9px 12px; font-size:.72rem; }
}
@media (prefers-reduced-motion: reduce){
  .hero--video .hero__video-fallback{ animation:none; transform:none; }
}

.hero__inner{
  position:relative; z-index:1; padding:96px 0 92px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
}
.sr-only{                              /* nur für Screenreader/SEO sichtbar */
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.hero__intro{
  margin:34px auto 0; max-width:62ch; font-size:1.05rem; color:rgba(228,211,190,.88);
  text-shadow:0 1px 14px rgba(6,28,0,.55);      /* lesbar auch über hellem Reel */
}
.hero__intro strong{ color:var(--beige); font-weight:700; }

/* --- Die zwei Such-Karten (Liquid Glass) ---------------------- */
/* --- Die Suchleiste: "Wo | Was | willst du studieren?" ---------
   Querformat: alles in EINER Leiste. Hochformat (schmal): Wo/Was
   als Pillen oben, Eingabefeld mit Lupe darunter (laut Entwurf). */
.suchleiste{
  position:relative; max-width:760px; width:100%;
  margin:0 auto; text-align:left;             /* zentriert im Hero */
}
@media (max-width:820px){                     /* mobil: kompakter nach oben */
  .hero__inner{ padding:34px 0 56px; }
}
.suchleiste__bar{
  position:relative; display:flex; align-items:center; gap:12px;
  padding:10px 10px 10px 14px; border-radius:999px;
  background:var(--glas-dunkel);
  -webkit-backdrop-filter:blur(16px) saturate(1.35);
  backdrop-filter:blur(16px) saturate(1.35);
  border:1px solid rgba(228,211,190,.32); border-top-color:rgba(255,255,255,.38);
  box-shadow:0 26px 56px -26px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.suchleiste:focus-within, .suchleiste.suche-offen{ z-index:120; }
.suchleiste__bar:hover, .suchleiste:focus-within .suchleiste__bar{
  transform:translateY(-2px);
  border-color:rgba(228,211,190,.45);
  box-shadow:0 30px 62px -28px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.26);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .suchleiste__bar{ background:rgba(20,60,8,.92); }
}
.suchleiste__glanz{                    /* Lichtreflex, wischt bei aktiver Eingabe durch */
  position:absolute; inset:0; border-radius:inherit; overflow:hidden; pointer-events:none;
}
.suchleiste__glanz::before{
  content:""; position:absolute; top:-40%; bottom:-40%; left:-70%; width:45%;
  background:linear-gradient(105deg, transparent, rgba(255,251,240,.09), transparent);
  transform:skewX(-18deg);
}
.suchleiste:focus-within .suchleiste__glanz::before{ animation:glanz 1.2s ease; }
@keyframes glanz{ to{ left:130%; } }

.suchleiste__modus{ display:flex; gap:8px; flex:none; }
.modus{
  font:inherit; font-size:1.02rem; font-weight:700; color:var(--beige);
  background:transparent; border:1.5px solid rgba(228,211,190,.45);
  border-radius:999px; padding:11px 26px; cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.modus:hover{ background:rgba(228,211,190,.12); }
.modus[aria-pressed="true"]{ background:var(--beige); color:var(--gruen); border-color:var(--beige); }
.suchleiste__feld{ flex:1; min-width:0; display:flex; align-items:center; gap:10px; }
.suchleiste input{
  flex:1; min-width:0; height:48px; padding:0 4px;
  font:inherit; font-size:1.02rem; color:#F0E5D4;
  background:transparent; border:0;
}
.suchleiste input::placeholder{ color:rgba(228,211,190,.55); font-style:italic; }
.suchleiste input:focus{ outline:none; }
.suchleiste__lupe{
  flex:none; width:48px; height:48px; border-radius:50%; border:0; cursor:pointer;
  background:var(--beige); color:var(--gruen); display:grid; place-items:center;
  transition:transform .18s ease, box-shadow .18s ease;
}
.suchleiste__lupe svg{ width:21px; height:21px; }
.suchleiste__lupe:hover{ transform:scale(1.05); box-shadow:0 8px 20px -8px rgba(0,0,0,.5); }
.suchleiste__lupe:active{ transform:scale(.94); }

@keyframes fahren{
  0%{ left:0; opacity:0; }
  12%{ opacity:.6; }
  88%{ opacity:.6; }
  100%{ left:calc(100% - 16px); opacity:0; }
}

/* Hochformat / schmal: ZWEI Karten wie im Team-Screenshot ------- */
.suchfeld{ display:none; }
@media (max-width:680px) and (orientation: portrait){
  .suchleiste{ display:none; }
  .suchfeld{
    display:grid; grid-template-columns:1fr; gap:18px;
    width:100%; margin-top:6px; text-align:left;
  }
  .suchkarte{
    position:relative; padding:24px 22px 26px; border-radius:var(--r-l);
    background:var(--glas-dunkel);
    -webkit-backdrop-filter:blur(16px) saturate(1.35);
    backdrop-filter:blur(16px) saturate(1.35);
    border:1px solid rgba(228,211,190,.32); border-top-color:rgba(255,255,255,.38);
    box-shadow:0 26px 56px -26px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.22);
  }
  .suchkarte:focus-within, .suchkarte.suche-offen{ z-index:120; }
  .suchkarte h2{ font-size:1.4rem; font-weight:800; color:#F0E5D4; margin:0 0 14px; }
  .suchkarte__reihe{ display:flex; gap:10px; }
  .suchkarte input{
    flex:1; min-width:0; height:54px; padding:0 16px;
    font-family:var(--f-mono); font-size:.95rem; color:#F0E5D4;
    background:rgba(8,43,0,.42); border:1.5px solid rgba(228,211,190,.3);
    border-radius:14px; transition:border-color .15s ease;
  }
  .suchkarte input::placeholder{ color:rgba(228,211,190,.5); }
  .suchkarte input:focus{ outline:none; border-color:var(--beige); }
  .suchkarte .suchleiste__lupe{ width:54px; height:54px; border-radius:14px; }
  .suchkarte .vorschlaege{ left:18px; right:18px; top:calc(100% - 14px); }
  .suchkarte__gleis{
    position:relative; margin-top:18px; height:14px;
    border-bottom:2px dashed rgba(228,211,190,.3);
  }
  .suchkarte__gleis img{ position:absolute; bottom:1px; left:0; height:14px; width:auto; opacity:0; }
  .suchkarte:focus-within .suchkarte__gleis img{ animation:fahren 1.8s ease forwards; }
  @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .suchkarte{ background:rgba(20,60,8,.92); }
  }
}

/* --- Vorschlagsliste ------------------------------------------ */
.vorschlaege{
  position:absolute; left:10px; right:10px; top:calc(100% - 12px); z-index:200;
  list-style:none; overflow:hidden; display:none;
  background:rgba(8,43,0,.97);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(228,211,190,.35); border-radius:16px;
  box-shadow:0 26px 56px -20px rgba(0,0,0,.65);
}
.vorschlaege.offen{ display:block; }
.vorschlaege li{ border-top:1px solid var(--linie-dunkel); }
.vorschlaege li:first-child{ border-top:0; }
.vorschlaege a{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:13px 18px; text-decoration:none;
}
.vorschlaege a:hover, .vorschlaege li.aktiv a{ background:rgba(228,211,190,.12); }
.vorschlaege .name{ font-size:.95rem; font-weight:600; color:#F0E5D4; }
.vorschlaege .meta{
  font-family:var(--f-mono); font-size:.64rem; letter-spacing:.12em;
  text-transform:uppercase; color:rgba(228,211,190,.6); white-space:nowrap;
}
.vorschlaege .meta.live{ color:var(--beige); }


/* Kleine Handys im Querformat: eine kompakte Suchleiste behalten */
@media (max-width:680px) and (orientation: landscape){
  .hero__inner{ padding:28px 0 42px; }
  .suchleiste{ display:block; }
  .suchfeld{ display:none; }
  .suchleiste__bar{ gap:8px; padding:8px 8px 8px 10px; }
  .suchleiste__modus{ gap:6px; }
  .modus{ font-size:.9rem; padding:9px 14px; }
  .suchleiste input{ height:42px; font-size:.95rem; }
  .suchleiste__lupe{ width:42px; height:42px; }
  .hero__intro{ margin-top:22px; font-size:.98rem; }
}

/* Reduzierte Bewegung: alle Animationen abschalten */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}

/* ============================================================
   MISSION - "Warum wir das machen" mit 35 %-Weckruf
   ============================================================ */
.mission{ position:relative; background:var(--papier); padding:96px 0 84px; overflow:hidden; }
.mission .blob{                       /* weiche Farbinseln, damit Glas-Tickets wirken */
  position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none;
}
.mission .blob--1{ width:420px; height:420px; left:-120px; top:60px; background:rgba(13,61,0,.14); }
.mission .blob--2{ width:380px; height:380px; right:-100px; bottom:40px; background:rgba(226,183,100,.2); }
.mission__inner{ position:relative; z-index:1; }

.mission__grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:56px; align-items:center; margin-top:44px; }
@media (max-width:900px){ .mission__grid{ grid-template-columns:1fr; gap:36px; } }

/* Die 35 %-Anzeige: wie eine Bahnsteig-Tafel */
.weckruf{
  position:relative; background:var(--gruen-tief); color:var(--beige);
  border-radius:var(--r-l); padding:42px 40px 38px;
  box-shadow:var(--schatten); overflow:hidden;
}
.weckruf::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background:radial-gradient(60% 50% at 20% 0%, rgba(228,211,190,.12), transparent 70%);
}
.weckruf .eyebrow{ color:rgba(228,211,190,.6); display:flex; align-items:center; gap:10px; }
.weckruf .eyebrow img{ height:22px; width:auto; opacity:.9; }
.weckruf__zahl{
  font-family:var(--f-mono); font-weight:700; letter-spacing:-.03em;
  font-size:clamp(4.2rem,9vw,6.4rem); line-height:1; margin:16px 0 12px; color:#F0E5D4;
}
.weckruf p{ font-size:1.02rem; color:rgba(228,211,190,.85); max-width:40ch; }
.weckruf p strong{ color:#F0E5D4; }
.weckruf sup a{ color:inherit; text-decoration:none; }
.weckruf__balken{                     /* 35 % visualisiert: gefüllter Anteil */
  margin-top:26px; height:14px; border-radius:99px;
  background:rgba(228,211,190,.18); overflow:hidden;
}
.weckruf__balken span{
  display:block; height:100%; width:35%; border-radius:inherit;
  background:linear-gradient(90deg, var(--beige), #f3e6d2);
}

.mission__story p{ margin-bottom:16px; color:rgba(19,53,9,.85); }
.mission__story strong{ color:var(--gruen); }
.mission__story .leitzitat{
  margin:22px 0 0; font-size:1.25rem; font-weight:700; font-style:italic;
  color:var(--gruen); border-left:3px solid var(--gruen); padding-left:18px;
}

/* --- Glas-Tickets: So helfen wir ------------------------------ */
.tickets{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px; }
@media (max-width:960px){ .tickets{ grid-template-columns:1fr; max-width:560px; } }
.ticket{
  position:relative; border-radius:var(--r-m); overflow:hidden;
  background:var(--glas-hell);
  -webkit-backdrop-filter:blur(14px) saturate(1.25);
  backdrop-filter:blur(14px) saturate(1.25);
  border:1px solid var(--glas-kante);
  box-shadow:0 20px 44px -22px rgba(8,43,0,.4), inset 0 1px 0 rgba(255,255,255,.6);
  transition:transform .22s cubic-bezier(.34,1.4,.5,1), box-shadow .22s ease;
}
.ticket:hover{ transform:translateY(-4px); box-shadow:0 28px 54px -24px rgba(8,43,0,.45), inset 0 1px 0 rgba(255,255,255,.7); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .ticket{ background:var(--creme); }
}
.ticket::before, .ticket::after{      /* Lochung wie beim Fahrschein */
  content:""; position:absolute; top:60px; width:20px; height:20px;
  border-radius:50%; background:var(--papier); border:1px solid var(--glas-kante);
}
.ticket::before{ left:-11px; } .ticket::after{ right:-11px; }
.ticket__stub{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 26px; border-bottom:2px dashed rgba(13,61,0,.22);
}
.ticket__stub .eyebrow{ color:var(--gruen); }
.ticket__stub svg{ width:20px; height:20px; opacity:.55; }
.ticket__body{ padding:22px 26px 26px; }
.ticket__body h3{ font-size:1.2rem; font-weight:800; color:var(--gruen); margin-bottom:8px; }
.ticket__body p{ font-size:.95rem; color:rgba(19,53,9,.8); }

.quelle{
  margin-top:40px; padding-top:18px; border-top:1px solid var(--linie);
  font-family:var(--f-mono); font-size:.7rem; letter-spacing:.04em;
  color:rgba(19,53,9,.55); max-width:72ch;
}
.quelle a{ color:rgba(19,53,9,.75); text-underline-offset:3px; }
.quelle a:hover{ color:var(--gruen); }

/* --- Weiche: Überleitung zur nächsten Station ------------------ */
.weiche{ background:var(--papier); text-align:center; padding:0 0 8px; }
.weiche p{
  font-size:1.15rem; font-style:italic; font-weight:600; color:var(--gruen);
}
.weiche__strecke{
  width:3px; height:64px; margin:18px auto 0;
  background:repeating-linear-gradient(180deg, var(--gruen) 0 9px, transparent 9px 16px);
  opacity:.45;
}

/* ============================================================
   NÄCHSTER HALT - Video-Bühne + Abfahrtstafel (Ergebnisbereich)
   ============================================================ */
.halt{ background:var(--papier); padding:56px 0 104px; }
.halt__kopfbereich{ max-width:760px; }
.halt__punkt{
  display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%;
  background:var(--beige); border:7px solid var(--gruen); margin-bottom:16px;
}
.kontextleiste{
  display:none; margin-top:22px; padding:14px 20px; border-radius:14px;
  background:var(--glas-hell);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--glas-kante);
  font-family:var(--f-mono); font-size:.78rem; letter-spacing:.06em; color:var(--gruen);
  align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
}
.kontextleiste.offen{ display:flex; }
.kontextleiste a{
  font-weight:600; color:var(--gruen); text-decoration:none;
  border-bottom:1.5px solid rgba(13,61,0,.4); padding-bottom:1px;
}
.kontextleiste a:hover{ border-color:var(--gruen); }

/* Bühne: das große Video */
.buehne{
  display:grid; grid-template-columns:1.45fr 1fr; margin-top:40px;
  border-radius:var(--r-l); overflow:hidden;
  background:var(--glas-hell);
  -webkit-backdrop-filter:blur(14px) saturate(1.25);
  backdrop-filter:blur(14px) saturate(1.25);
  border:1px solid var(--glas-kante);
  box-shadow:0 26px 56px -26px rgba(8,43,0,.45), inset 0 1px 0 rgba(255,255,255,.55);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .buehne{ background:var(--creme); }
}
@media (max-width:900px){ .buehne{ grid-template-columns:1fr; } }
.buehne__thumb{
  position:relative; aspect-ratio:16/9; border:0; padding:0; cursor:pointer;
  background:var(--gruen-tief); display:block; width:100%;
}
.buehne__thumb img{ width:100%; height:100%; object-fit:cover; }
.buehne__thumb .ersatz{ position:absolute; inset:0; display:none; place-items:center; background:var(--gruen-tief); }
.buehne__thumb .ersatz img{ width:110px; height:auto; opacity:.5; object-fit:contain; }
.play{
  position:absolute; inset:0; margin:auto; width:72px; height:72px; border-radius:50%;
  background:rgba(250,245,235,.94); display:grid; place-items:center;
  box-shadow:0 10px 26px rgba(0,0,0,.4); transition:transform .2s ease;
}
.play::after{
  content:""; margin-left:5px;
  border-left:21px solid var(--gruen); border-top:13px solid transparent; border-bottom:13px solid transparent;
}
.buehne__thumb:hover .play{ transform:scale(1.08); }
.live-chip{
  position:absolute; top:16px; left:16px;
  background:var(--beige); color:var(--gruen); border-radius:7px;
  font-family:var(--f-mono); font-size:.62rem; font-weight:700; letter-spacing:.16em;
  padding:6px 11px; text-transform:uppercase;
}
.buehne__info{ padding:38px 40px; display:flex; flex-direction:column; justify-content:center; }
@media (max-width:640px){ .buehne__info{ padding:26px 22px 32px; } }
.buehne__info .eyebrow{ color:rgba(13,61,0,.55); }
.buehne__info h3{ font-size:clamp(1.4rem,2.2vw,1.8rem); font-weight:800; line-height:1.2; color:var(--gruen); margin-top:10px; }
.buehne__uni{ margin-top:6px; font-weight:600; color:rgba(19,53,9,.75); }
.buehne__info p.text{ margin-top:14px; font-size:.97rem; color:rgba(19,53,9,.8); }
.buehne__aktionen{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin-top:26px; }
.link-leise{
  font-family:var(--f-mono); font-size:.78rem; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gruen); text-decoration:none;
  border-bottom:1.5px solid rgba(13,61,0,.35); padding-bottom:2px;
}
.link-leise:hover{ border-color:var(--gruen); }

/* weitere Videos (Raster, sobald mehrere online sind) */
.weitere{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; margin-top:26px; }
.video-karte{
  background:var(--glas-hell);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--glas-kante); border-radius:var(--r-m);
  overflow:hidden; cursor:pointer; text-align:left; padding:0; font:inherit; color:inherit;
  transition:transform .2s cubic-bezier(.34,1.4,.5,1), box-shadow .2s ease;
}
.video-karte:hover{ transform:translateY(-4px); box-shadow:var(--schatten); }
.video-karte__thumb{ position:relative; aspect-ratio:16/9; background:var(--gruen-tief); }
.video-karte__thumb img{ width:100%; height:100%; object-fit:cover; }
.video-karte__thumb .play{ width:54px; height:54px; }
.video-karte__thumb .play::after{ border-left-width:16px; border-top-width:10px; border-bottom-width:10px; }
.video-karte__body{ padding:18px 22px 22px; }
.video-karte__body .eyebrow{ color:rgba(13,61,0,.5); font-size:.64rem; }
.video-karte__body h4{ font-size:1.12rem; font-weight:800; color:var(--gruen); margin-top:5px; }
.video-karte__body p{ font-size:.9rem; color:rgba(19,53,9,.72); margin-top:2px; }

.leer{
  display:none; margin-top:36px; padding:44px 30px; text-align:center;
  border:2px dashed rgba(13,61,0,.3); border-radius:var(--r-m); color:rgba(19,53,9,.78);
}
.leer strong{ color:var(--gruen); }

/* Abfahrtstafel */
.board{
  margin-top:56px; background:var(--gruen-tief); color:var(--beige);
  border-radius:var(--r-l); padding:36px 38px 28px; box-shadow:var(--schatten);
}
@media (max-width:640px){ .board{ padding:26px 20px 18px; } }
.board__kopf{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
.board__kopf .eyebrow{ color:rgba(228,211,190,.6); }
.board__kopf h3{ font-size:1.4rem; font-weight:800; margin-top:4px; }
.board__kopf img{ height:42px; width:auto; opacity:.9; }
.board table{ width:100%; border-collapse:collapse; }
.board th{
  font-family:var(--f-mono); font-size:.62rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:rgba(228,211,190,.5);
  text-align:left; padding:10px 12px; border-bottom:1px solid var(--linie-dunkel);
}
.board td{
  padding:14px 12px; border-bottom:1px solid var(--linie-dunkel);
  font-family:var(--f-mono); font-size:.85rem; letter-spacing:.03em; vertical-align:middle;
}
.board tr:last-child td{ border-bottom:0; }
.board a{ text-decoration:none; }
.board .fach a{ font-weight:600; color:#F0E5D4; border-bottom:1px solid rgba(228,211,190,.35); padding-bottom:1px; }
.board .fach a:hover{ border-color:var(--beige); color:var(--beige); }
.board .uni-name{ color:rgba(228,211,190,.72); }
.punkt{ width:8px; height:8px; border-radius:50%; background:var(--beige); flex:none; animation:pulsieren 2.2s ease-in-out infinite; }
@keyframes pulsieren{ 0%,100%{opacity:1;} 50%{opacity:.4;} }
.status{
  display:inline-flex; align-items:center; gap:8px;
  border:1.5px dashed rgba(228,211,190,.45); border-radius:6px;
  padding:5px 11px; font-size:.64rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(228,211,190,.85); white-space:nowrap;
}
.board__fuss{
  margin-top:18px; font-family:var(--f-mono); font-size:.74rem;
  color:rgba(228,211,190,.65); letter-spacing:.05em;
}
.board__fuss a{ color:var(--beige); text-underline-offset:3px; }
@media (max-width:720px){
  .board thead{ display:none; }
  .board tr{ display:grid; grid-template-columns:1fr; gap:3px; padding:14px 0; border-bottom:1px solid var(--linie-dunkel); }
  .board td{ border:0; padding:1px 0; }
  .board td.zelle-status{ margin-top:7px; }
}

/* ============================================================
   Kontakt (bewusst ganz unten - Interaktion als Abschluss)
   ============================================================ */
.kontakt{ background:var(--creme); padding:96px 0 104px; }
.kontakt__grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:60px; margin-top:44px; }
@media (max-width:880px){ .kontakt__grid{ grid-template-columns:1fr; gap:38px; } }
.kontakt__wege li{ list-style:none; padding:18px 0; border-top:1px solid var(--linie); }
.kontakt__wege li:last-child{ border-bottom:1px solid var(--linie); }
.kontakt__wege h3{ font-size:1.05rem; font-weight:800; color:var(--gruen); }
.kontakt__wege p{ font-size:.94rem; color:rgba(19,53,9,.75); margin-top:2px; }
.kontakt__mail{ display:inline-block; margin-top:26px; font-family:var(--f-mono); font-size:.9rem; color:var(--gruen); font-weight:600; }

.formular{
  background:var(--glas-hell);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid var(--glas-kante); border-radius:var(--r-l); padding:34px;
  box-shadow:0 22px 48px -24px rgba(8,43,0,.35), inset 0 1px 0 rgba(255,255,255,.55);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .formular{ background:var(--papier); }
}
@media (max-width:640px){ .formular{ padding:24px 18px; } }
@media (max-width:640px){
  /* Forminator mobil symmetrisch halten und iOS-Autozoom vermeiden */
  .kontakt .wrap{ width:calc(100% - 36px); max-width:100%; }
  .kontakt__grid, .kontakt__wege, .formular{ width:100%; max-width:100%; min-width:0; }
  .formular{ margin-left:auto; margin-right:auto; overflow:visible; }
  .formular--forminator input,
  .formular--forminator select,
  .formular--forminator textarea,
  .formular--forminator .select2-selection__rendered,
  .formular--forminator .select2-search__field{ font-size:16px !important; }
}

.feld{ margin-bottom:18px; }
.feld label{
  display:block; margin-bottom:8px;
  font-family:var(--f-mono); font-size:.7rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gruen);
}
.feld input, .feld select, .feld textarea{
  width:100%; padding:14px 16px; font:inherit; font-size:.95rem; color:var(--text);
  background:rgba(255,253,248,.85); border:1.5px solid rgba(13,61,0,.28); border-radius:var(--r-s);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.feld textarea{ min-height:130px; resize:vertical; }
.feld input:focus, .feld select:focus, .feld textarea:focus{
  outline:none; border-color:var(--gruen); box-shadow:0 0 0 3px rgba(13,61,0,.12);
}
.formular .btn{ width:100%; justify-content:center; }
.formular__hinweis{ margin-top:14px; font-size:.8rem; color:rgba(19,53,9,.6); text-align:center; }

.kontakt__mailbox{
  margin-top:28px; border-top:1px solid var(--linie); max-width:640px;
}
.kontakt__mailzeile{
  display:grid; grid-template-columns:28px 1fr; gap:12px; align-items:start;
  padding:17px 0; border-bottom:1px solid var(--linie);
  text-decoration:none; color:var(--gruen);
}
.kontakt__mailpfeil{
  font-family:var(--f-mono); font-size:1.1rem; line-height:1.25; font-weight:700;
  color:rgba(13,61,0,.72); transform:translateY(1px); transition:transform .18s ease, color .18s ease;
}
.kontakt__mailtext span{
  display:block; font-family:var(--f-mono); font-size:.66rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:rgba(13,61,0,.58);
}
.kontakt__mailtext strong{
  display:block; margin-top:4px; font-family:var(--f-mono); font-size:.9rem; line-height:1.35;
  color:var(--gruen); text-decoration:underline; text-underline-offset:3px; word-break:break-word;
}
.kontakt__mailzeile:hover .kontakt__mailpfeil{ transform:translate(4px,1px); color:var(--gruen); }
.kontakt__mailzeile:hover .kontakt__mailtext strong{ text-decoration-thickness:2px; }

/* Forminator optisch an das alte Glas-Kontaktformular angleichen */
.formular--forminator .forminator-ui,
.formular--forminator .forminator-custom-form{
  width:100% !important; max-width:100% !important; min-width:0 !important;
  margin:0 !important; padding:0 !important;
}
.formular--forminator{ width:100%; max-width:100%; min-width:0; overflow:visible; }
.formular--forminator, .formular--forminator *{ box-sizing:border-box !important; }
.formular--forminator .forminator-row{
  width:100% !important; max-width:100% !important; min-width:0 !important;
  margin:0 0 18px !important; padding:0 !important; display:block !important;
}
.formular--forminator .forminator-col,
.formular--forminator .forminator-col-12,
.formular--forminator .forminator-col-md-12{
  width:100% !important; max-width:100% !important; min-width:0 !important;
  margin:0 !important; padding:0 !important; float:none !important;
}
.formular--forminator .forminator-row-last{ margin-bottom:0 !important; }
.formular--forminator .forminator-field{ margin:0 !important; }
.formular--forminator .forminator-label,
.formular--forminator label{
  display:block !important; margin:0 0 8px !important;
  font-family:var(--f-mono) !important; font-size:.7rem !important; font-weight:600 !important;
  letter-spacing:.16em !important; text-transform:uppercase !important; color:var(--gruen) !important;
}
.formular--forminator .forminator-input,
.formular--forminator .forminator-textarea,
.formular--forminator .forminator-select,
.formular--forminator select,
.formular--forminator input[type="text"],
.formular--forminator input[type="email"],
.formular--forminator textarea{
  width:100% !important; max-width:100% !important; min-width:0 !important; padding:14px 16px !important; min-height:auto !important;
  font-family:var(--f-body) !important; font-size:16px !important; line-height:1.45 !important; color:var(--text) !important;
  background:rgba(255,253,248,.85) !important; border:1.5px solid rgba(13,61,0,.28) !important;
  border-radius:var(--r-s) !important; box-shadow:none !important;
}
.formular--forminator .forminator-textarea,
.formular--forminator textarea{ min-height:130px !important; resize:vertical !important; }
.formular--forminator .forminator-input:focus,
.formular--forminator .forminator-textarea:focus,
.formular--forminator select:focus,
.formular--forminator input:focus,
.formular--forminator textarea:focus{
  outline:none !important; border-color:var(--gruen) !important; box-shadow:0 0 0 3px rgba(13,61,0,.12) !important;
}
.formular--forminator .select2-container .select2-selection,
.formular--forminator .forminator-select2 + .forminator-select .selection .select2-selection{
  min-height:50px !important; border:1.5px solid rgba(13,61,0,.28) !important;
  border-radius:var(--r-s) !important; background:rgba(255,253,248,.85) !important;
}
.formular--forminator .select2-container .select2-selection__rendered{ padding:10px 16px !important; color:var(--text) !important; }

/* Forminator Select: nur eine sichtbare Box, keine verschachtelte Doppelbox */
.formular--forminator .forminator-select{
  padding:0 !important; min-height:0 !important; border:0 !important;
  background:transparent !important; box-shadow:none !important;
}
.formular--forminator .select2-container{ width:100% !important; max-width:100% !important; min-width:0 !important; display:block !important; }
.formular--forminator .select2-container .select2-selection,
.formular--forminator .forminator-select2 + .forminator-select .selection .select2-selection{
  min-height:54px !important; height:54px !important; display:flex !important; align-items:center !important;
  padding:0 !important; border:1.5px solid rgba(13,61,0,.28) !important;
  border-radius:var(--r-s) !important; background:rgba(255,253,248,.85) !important;
  box-shadow:none !important;
}
.formular--forminator .select2-container .select2-selection__rendered{
  width:100% !important; padding:0 48px 0 16px !important;
  font-size:16px !important; line-height:52px !important; color:var(--text) !important;
}
.formular--forminator .select2-container .select2-selection__arrow{
  height:52px !important; width:44px !important; top:1px !important; right:4px !important;
}
.formular--forminator .select2-container--open .select2-selection,
.formular--forminator .select2-container .select2-selection:focus{
  border-color:var(--gruen) !important; box-shadow:0 0 0 3px rgba(13,61,0,.12) !important;
}
/* Select2 Dropdown/Suchfeld darf auf iOS keinen Autozoom und keinen Horizontal-Overflow auslösen */
.formular--forminator .select2-search__field,
.select2-container .select2-search__field{
  font-size:16px !important; max-width:100% !important; box-sizing:border-box !important;
}
.select2-container, .select2-dropdown{ box-sizing:border-box !important; max-width:calc(100vw - 24px) !important; }

.formular--forminator .forminator-checkbox,
.formular--forminator .forminator-consent{ color:rgba(19,53,9,.72) !important; font-size:.88rem !important; }
.formular--forminator .forminator-description,
.formular--forminator .forminator-error-message{
  margin-top:7px !important; font-size:.78rem !important; line-height:1.4 !important;
}
.formular--forminator .forminator-error-message{ color:#8a2d1c !important; }
.formular--forminator .forminator-response-message{
  margin:0 0 18px !important; padding:14px 16px !important; border-radius:var(--r-s) !important;
  background:rgba(13,61,0,.08) !important; color:var(--gruen) !important; border:1px solid rgba(13,61,0,.16) !important;
}
.formular--forminator .forminator-button-submit,
.formular--forminator button[type="submit"]{
  width:100% !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:10px !important;
  font-family:var(--f-mono) !important; font-size:.8rem !important; font-weight:600 !important;
  letter-spacing:.14em !important; text-transform:uppercase !important; text-decoration:none !important;
  padding:15px 26px !important; border-radius:var(--r-s) !important; border:1.5px solid transparent !important;
  background:var(--gruen) !important; color:var(--beige) !important; cursor:pointer !important;
  box-shadow:none !important; transition:transform .18s ease, box-shadow .18s ease !important;
}
.formular--forminator .forminator-button-submit:hover,
.formular--forminator button[type="submit"]:hover{ transform:translateY(-2px) !important; box-shadow:var(--schatten) !important; }


/* ============================================================
   Fußzeile & Video-Overlay
   ============================================================ */
footer{ background:var(--gruen); color:var(--beige); }
.fuss__oben{ display:flex; justify-content:space-between; gap:44px; flex-wrap:wrap; padding:60px 0 44px; }
.fuss__logo img{ height:54px; width:auto; }
.fuss__logo p{ margin-top:16px; max-width:34ch; font-size:.9rem; color:rgba(228,211,190,.7); }
.fuss__nav{ display:flex; gap:60px; flex-wrap:wrap; }
.fuss__nav h4{
  font-family:var(--f-mono); font-size:.66rem; font-weight:500; letter-spacing:.22em;
  text-transform:uppercase; color:rgba(228,211,190,.55); margin-bottom:14px;
}
.fuss__nav a{ display:block; text-decoration:none; font-size:.94rem; padding:5px 0; color:rgba(228,211,190,.9); }
.fuss__nav a:hover{ color:#fff; text-decoration:underline; text-underline-offset:4px; }
.sozial{ display:flex; gap:14px; margin-top:4px; }
.sozial a{
  width:42px; height:42px; border-radius:50%; display:grid; place-items:center;
  border:1.5px solid rgba(228,211,190,.4); color:var(--beige);
  transition:background .15s ease, color .15s ease;
}
.sozial a:hover{ background:var(--beige); color:var(--gruen); }
.sozial svg{ width:19px; height:19px; fill:currentColor; }
.fuss__unten{
  border-top:1px solid var(--linie-dunkel); padding:20px 0;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-family:var(--f-mono); font-size:.72rem; letter-spacing:.08em; color:rgba(228,211,190,.6);
}

.overlay{
  position:fixed; inset:0; z-index:100; display:none;
  align-items:center; justify-content:center; padding:24px;
  background:rgba(4,18,0,.86);
}
.overlay.offen{ display:flex; }
.overlay__box{ width:min(940px,100%); }
.overlay__kopf{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; color:var(--beige); }
.overlay__kopf h3{ font-size:1.1rem; font-weight:700; }
.overlay__kopf .eyebrow{ color:rgba(228,211,190,.6); }
.overlay__schliessen{
  background:none; border:1.5px solid rgba(228,211,190,.5); color:var(--beige);
  width:42px; height:42px; border-radius:50%; font-size:1.15rem; cursor:pointer; flex:none;
}
.overlay__schliessen:hover{ background:var(--beige); color:var(--gruen); }
.overlay__video{ aspect-ratio:16/9; background:#000; border-radius:var(--r-m); overflow:hidden; }
.overlay__video iframe{ width:100%; height:100%; border:0; display:block; }

/* ============================================================
   GOLD-AKZENTE (Experiment von Lars)
   Ein/Aus: Klasse "gold-akzente" am Body hinzufügen/entfernen.
   Gezielte Stellen (dezent): Kontur & Schrift der aktiven
   Wo/Was-Pille, die Karten-Titel auf Mobilgeräten sowie die
   Fächer auf der Abfahrtstafel (Metallic-Schrift).
   ============================================================ */
/* dezent: aktive Pille nur mit goldener Kontur & Schrift */
.gold-akzente .modus[aria-pressed="true"]{
  background:rgba(8,43,0,.35);
  border-color:#DDB65A;
  color:#E9CB7C;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
/* Karten-Titel (mobil) in Gold-Schrift wie im Team-Screenshot */
.gold-akzente .suchkarte h2{ color:#E3C06A; }
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .gold-akzente .suchkarte h2{
    background:linear-gradient(100deg,#B08A3A 0%, #E3C06A 24%, #F8ECB8 48%, #DDB65A 72%, #A9852F 100%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent;
    filter:drop-shadow(0 1px 1px rgba(0,0,0,.45));
  }
}
.gold-akzente .board .fach a{ color:#D8B45C; }          /* Fallback ältere Browser */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .gold-akzente .board .fach a{
    background:linear-gradient(100deg,#B08A3A 0%, #E3C06A 24%, #F8ECB8 48%, #DDB65A 72%, #A9852F 100%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent;
    filter:drop-shadow(0 1px 1px rgba(0,0,0,.45));
  }
}
.gold-akzente .board .fach a{ border-bottom-color:rgba(216,180,92,.5); }
.gold-akzente .board .fach a:hover{ border-bottom-color:#EFD68F; }

/* ============================================================
   Feinschliff für sehr kleine Geräte
   ============================================================ */
@media (max-width:420px) and (orientation: portrait){
  body{ font-size:16px; }
  .kopf__logo img{ height:34px; }
  .hero__inner{ padding:26px 0 54px; }
  .suchkarte{ padding:20px 16px 22px; }
  .suchkarte .vorschlaege{ left:12px; right:12px; }
  .weckruf{ padding:30px 24px 28px; }
  .buehne__info{ padding:24px 18px 28px; }
  .board{ padding:22px 16px 14px; }
  .tickets{ gap:18px; }
  .fuss__nav{ gap:36px; }
}
/* Fallback für ältere Browser ohne aspect-ratio (z. B. iOS < 15) */
@supports not (aspect-ratio: 16/9){
  .buehne__thumb, .video-karte__thumb, .overlay__video{
    height:0; padding-bottom:56.25%; position:relative;
  }
  .buehne__thumb img, .video-karte__thumb img, .overlay__video iframe{
    position:absolute; inset:0; width:100%; height:100%;
  }
}
/* Geräte mit Display-Aussparung (Notch) */
@supports (padding: env(safe-area-inset-left)){
  .wrap{ padding-left:env(safe-area-inset-left); padding-right:env(safe-area-inset-right); }
}

/* Forminator Admin-Edit-Link im Frontend ausblenden.
   Dieser Link wird nur für eingeloggte Admins eingeblendet; Besucher sehen ihn nicht. */
.formular--forminator .forminator-edit-module,
.formular--forminator .forminator-edit-link,
.formular--forminator a[href*="forminator"][href*="edit"],
.formular--forminator a[href*="admin.php?page=forminator"]{
  display:none !important;
}


/* ============================================================
   TOP-3-PODIUM "Beliebteste Verbindungen" (Startseite)
   ============================================================ */
.podium{ display:grid; grid-template-columns:1fr 1.12fr 1fr; gap:20px; align-items:end; margin-top:40px; }
@media (max-width:820px){ .podium{ grid-template-columns:1fr; align-items:stretch; } }
.podest{ position:relative; background:var(--gruen-tief); color:var(--beige);
  border-radius:var(--r-l); padding:20px 20px 24px; box-shadow:var(--schatten);
  display:flex; flex-direction:column; gap:12px; }
.podest--1{ border:1.5px solid rgba(221,182,90,.7); padding-bottom:40px;
  box-shadow:0 26px 60px -24px rgba(0,0,0,.5), 0 0 0 4px rgba(221,182,90,.12); }
@media (min-width:821px){ .podest--2, .podest--3{ margin-top:44px; } }
.gleis-schild{ display:inline-flex; align-items:center; gap:10px; align-self:flex-start;
  font-family:var(--f-mono); font-size:.66rem; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; border:1.5px solid rgba(228,211,190,.45); border-radius:8px;
  padding:6px 12px; color:rgba(228,211,190,.9); }
.podest--1 .gleis-schild{ border-color:#DDB65A; color:#E9CB7C; }
.podest__thumb{ position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden;
  background:var(--gruen); border:0; padding:0; cursor:pointer; display:block; width:100%; }
.podest__thumb img{ width:100%; height:100%; object-fit:cover; }
.podest__thumb .play{ width:54px; height:54px; }
.podest__thumb .play::after{ border-left-width:16px; border-top-width:10px; border-bottom-width:10px; }
.podest h3{ font-size:1.1rem; font-weight:800; color:#F0E5D4; }
.podest .meta-zeile{ font-family:var(--f-mono); font-size:.7rem; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(228,211,190,.65); }
.podest--geist{ background:transparent; border:2px dashed rgba(13,61,0,.3); color:rgba(19,53,9,.7);
  box-shadow:none; align-items:center; justify-content:center; text-align:center; min-height:220px; }
.podest--geist p{ font-size:.9rem; max-width:26ch; }
@media (max-width:820px){ .podest--geist{ min-height:120px; } }


/* ============================================================
   STARTSEITE: Produktionskarte statt klassischer Abfahrtstafel
   ============================================================ */
.startkarte{margin-top:56px;background:var(--gruen-tief);color:var(--beige);border-radius:var(--r-l);padding:36px 38px 34px;box-shadow:var(--schatten);position:relative;overflow:hidden;}
.startkarte::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(55% 60% at 18% 15%,rgba(228,211,190,.12),transparent 70%),radial-gradient(45% 50% at 90% 82%,rgba(226,183,100,.09),transparent 70%);} .startkarte>*{position:relative;z-index:1;}
.startkarte__kopf{display:flex;justify-content:space-between;gap:22px;align-items:flex-start;flex-wrap:wrap;margin-bottom:22px}.startkarte__kopf .eyebrow{color:rgba(228,211,190,.6)}.startkarte__kopf h3{font-size:1.45rem;font-weight:800;color:#F0E5D4;margin-top:4px}.startkarte__kopf p{max-width:62ch;color:rgba(228,211,190,.78);margin-top:8px;font-size:.95rem}.startkarte__link{color:var(--beige);border-bottom-color:rgba(228,211,190,.45);white-space:nowrap}
.startkarte__mission{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:20px 0 18px;padding:13px 16px;border:1px solid rgba(228,211,190,.22);border-radius:14px;background:rgba(228,211,190,.07)}.startkarte__mission .eyebrow{color:rgba(228,211,190,.62)}.startkarte__balken{flex:1 1 220px;height:11px;background:rgba(228,211,190,.16);border-radius:99px;overflow:hidden}.startkarte__balken span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#B08A3A,#E3C06A,#F8ECB8);transition:width .5s ease}.startkarte__mission b{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.07em;color:#F0E5D4;white-space:nowrap}
.startkarte__rahmen{position:relative;overflow:hidden;border-radius:20px;border:1px solid rgba(228,211,190,.22);background:rgba(4,24,0,.58)}.startkarte__svg{display:block;width:100%;height:min(58vh,560px);min-height:360px}.startkarte-track{fill:none;stroke:rgba(228,211,190,.32);stroke-width:3;stroke-linecap:round;stroke-dasharray:8 9;animation:startkarte-fahrt 3s linear infinite}@keyframes startkarte-fahrt{to{stroke-dashoffset:-34}}
.startkarte-station{cursor:pointer}.startkarte-station circle{stroke:rgba(250,245,235,.85);stroke-width:2.5;transition:transform .16s ease,filter .16s ease;transform-origin:center;transform-box:fill-box}.startkarte-station:hover circle{transform:scale(1.18);filter:drop-shadow(0 0 10px rgba(228,211,190,.45))}.startkarte-station text{font-family:var(--f-mono);font-size:11px;letter-spacing:.03em;fill:rgba(228,211,190,.86);pointer-events:none;paint-order:stroke;stroke:rgba(4,24,0,.82);stroke-width:3px;stroke-linejoin:round}.startkarte-station.live circle{fill:#7FB069}.startkarte-station.prod circle{fill:var(--beige)}.startkarte-station.plan circle{fill:rgba(228,211,190,.32);stroke:rgba(228,211,190,.45)}.startkarte-station.prod circle{animation:startkarte-puls 2.4s ease-in-out infinite}@keyframes startkarte-puls{0%,100%{opacity:1}50%{opacity:.55}}
.startkarte__legende{position:absolute;left:14px;bottom:14px;display:flex;gap:12px 18px;flex-wrap:wrap;padding:10px 14px;border-radius:14px;background:rgba(8,43,0,.78);border:1px solid rgba(228,211,190,.25);font-family:var(--f-mono);font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;color:rgba(228,211,190,.85)}.startkarte__legende i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:7px;vertical-align:-1px}.startkarte__legende i.live{background:#7FB069}.startkarte__legende i.prod{background:var(--beige)}.startkarte__legende i.plan{background:rgba(228,211,190,.32)}
.startkarte__tooltip{display:none;position:absolute;z-index:4;pointer-events:none;max-width:250px;padding:11px 14px;border-radius:12px;background:rgba(250,245,235,.97);color:var(--text);box-shadow:0 16px 36px -14px rgba(0,0,0,.55);border:1px solid var(--glas-kante)}.startkarte__tooltip b{display:block;color:var(--gruen);font-size:.94rem;line-height:1.25}.startkarte__tooltip span{display:block;margin-top:3px;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(19,53,9,.6)}
@media (max-width:720px){.startkarte{padding:26px 18px 24px}.startkarte__svg{height:460px;min-height:420px}.startkarte__legende{position:static;margin:12px}.startkarte__mission b{white-space:normal}}@media (prefers-reduced-motion:reduce){.startkarte-track,.startkarte-station.prod circle{animation:none!important}}


/* Volle Startseitenkarte: Zoom & Pan */
.startkarte__svg{touch-action:none;cursor:grab;user-select:none;}
.startkarte__svg:active{cursor:grabbing;}
.startkarte__zoom{position:absolute;right:14px;top:14px;z-index:6;display:flex;flex-direction:column;gap:8px;}
.startkarte__zoom button{width:42px;height:42px;border-radius:12px;border:1px solid rgba(228,211,190,.38);background:rgba(8,43,0,.76);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--beige);font-size:1.2rem;font-weight:800;line-height:1;cursor:pointer;}
.startkarte__zoom button:hover{background:var(--beige);color:var(--gruen);}
.startkarte__hint{position:absolute;right:14px;bottom:14px;z-index:5;padding:8px 12px;border-radius:10px;background:rgba(8,43,0,.66);border:1px solid rgba(228,211,190,.22);font-family:var(--f-mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(228,211,190,.72);}
@media (max-width:720px){.startkarte__zoom{right:10px;top:10px}.startkarte__zoom button{width:38px;height:38px}.startkarte__hint{display:none}}
.startkarte__svg .startkarte-station.rang2 text{opacity:0;transition:opacity .18s ease;}
.startkarte__svg.is-zoomed .startkarte-station.rang2 text,.startkarte__svg .startkarte-station.rang2:hover text{opacity:1;}


/* Einheitliche Kartenlogik Startseite = große Karte: Übersicht reduziert, Details erst beim Reinzoomen */
.startkarte-track{fill:none;stroke-linecap:round;stroke-dasharray:6 7;animation:startkarte-fahrt 3s linear infinite;}
.startkarte-track--aktiv{stroke:rgba(228,211,190,.7);stroke-width:2.8;}
.startkarte-track--bau{stroke:rgba(228,211,190,.42);stroke-width:2.2;}
.startkarte-track--leise{stroke:rgba(228,211,190,.14);stroke-width:1.6;stroke-dasharray:3 9;animation:none;}
.startkarte-station circle{cursor:help;}
.startkarte-station.live circle,.startkarte-station.prod circle{cursor:pointer;}
.startkarte-station text{fill:rgba(228,211,190,.95);font-family:var(--f-mono);letter-spacing:.06em;pointer-events:none;paint-order:stroke;stroke:rgba(4,24,0,.86);stroke-width:3px;stroke-linejoin:round;}
.startkarte-station.plan text{fill:rgba(228,211,190,.6);}
.startkarte__legende span:last-child{opacity:.78;}


/* ============================================================
   v8.7: PODIUM-MEDAILLEN (dezent über Rahmen & Gleis-Schild)
   + Hochformat: Platz 1 zuerst
   + Touch: Zoom-Knöpfe ohne Browser-Doppeltipp-Zoom
   ============================================================ */
.podest--2{ border:1.5px solid rgba(196,203,214,.55); }
.podest--3{ border:1.5px solid rgba(193,133,82,.55); }
.podest--2 .gleis-schild{ border-color:#C4CBD6; color:#DDE3EC; }
.podest--3 .gleis-schild{ border-color:#C18552; color:#DCA878; }
@media (max-width:820px){
  .podest--1{ order:1; } .podest--2{ order:2; } .podest--3{ order:3; }
}
.karte-zoom button{ touch-action:manipulation; -webkit-tap-highlight-color:transparent; user-select:none; }

.startkarte__zoom button{ touch-action:manipulation; -webkit-tap-highlight-color:transparent; user-select:none; }
.startkarte__rahmen svg{ touch-action:none; }

.video-source{
  position:absolute;left:10px;bottom:10px;z-index:2;padding:4px 8px;border-radius:999px;
  background:rgba(0,0,0,.72);color:#fff;font:700 .64rem/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.02em;box-shadow:0 2px 10px rgba(0,0,0,.24);pointer-events:none;
}

/* YouTube wird erst nach einer ausdrücklichen zweiten Auswahl geladen. */
.youtube-consent{
  position:relative;width:100%;height:100%;min-height:240px;overflow:hidden;
  display:grid;place-items:center;text-align:center;background:#071f00;color:#f2e9db;
}
.youtube-consent__thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.9)}
.youtube-consent__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,24,0,.28),rgba(5,24,0,.9))}
.youtube-consent__content{position:relative;z-index:1;padding:clamp(22px,5vw,48px);display:flex;flex-direction:column;align-items:center;gap:13px}
.youtube-consent strong{font-size:clamp(1.2rem,3vw,1.7rem);line-height:1.2;text-shadow:0 2px 18px rgba(0,0,0,.55)}
.youtube-consent p{max-width:62ch;margin:0;color:rgba(255,255,255,.92);line-height:1.5;text-shadow:0 1px 12px rgba(0,0,0,.72)}
.youtube-consent__button{border:0;border-radius:999px;padding:13px 20px;background:#e4d3be;color:#0d3d00;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.28)}
.youtube-consent__button:hover{transform:translateY(-1px)}
.youtube-consent__button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.youtube-consent a{color:#fff;text-underline-offset:3px}
