/* Sommerrodelbahnen in Deutschland — Edelstahl, Bob-Rot, Hanggrün.
   Raster: 12 Spalten, Navigation als eine Zeile über die Spalten verteilt; Startseite = Fahrspur durch die Überschrift. */
@font-face{font-family:"Technor";src:url(/schrift/technor-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Technor";src:url(/schrift/technor-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Author";src:url(/schrift/author-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Author";src:url(/schrift/author-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Striper";src:url(/schrift/striper-400.woff2) format("woff2");font-weight:400;font-display:swap}

:root{
  --stahl:#DADFE1; --glanz:#EEF1F2; --tinte:#121719; --tinte2:#3D474B;
  --bob:#E3261B; --bob-text:#B81A11; --hang:#2A6125; --linie:#9AA4A8;
  --gelb:#E9B824;
  --f-anzeige:"Technor","Arial Narrow",system-ui,sans-serif;
  --f-text:"Author",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-zahl:"Striper","Technor",system-ui,sans-serif;
  --rand:clamp(16px,4vw,48px);
  --breite:1440px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --stahl:#14191B; --glanz:#1C2326; --tinte:#E6EBEC; --tinte2:#A9B4B8;
  --bob:#FF4B3E; --bob-text:#FF7A6F; --hang:#7CC46F; --linie:#3A4549; --gelb:#F0C640; color-scheme:dark}}
:root[data-theme="dark"]{
  --stahl:#14191B; --glanz:#1C2326; --tinte:#E6EBEC; --tinte2:#A9B4B8;
  --bob:#FF4B3E; --bob-text:#FF7A6F; --hang:#7CC46F; --linie:#3A4549; --gelb:#F0C640; color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--stahl);color:var(--tinte);font:400 1.0625rem/1.6 var(--f-text);
  background-image:repeating-linear-gradient(90deg,color-mix(in srgb,var(--glanz) 35%,transparent) 0 1px,transparent 1px 4px);
  overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--bob-text)}
:focus-visible{outline:3px solid var(--bob);outline-offset:3px}
h1,h2,h3{overflow-wrap:break-word;hyphens:manual;font-family:var(--f-anzeige);font-weight:700;line-height:.98;letter-spacing:-.01em;text-wrap:balance;margin:0}
h2{font-size:clamp(1.9rem,5vw,3.4rem)}
h3{font-size:clamp(1.25rem,2.4vw,1.6rem);line-height:1.1}
p{margin:0}
.huelle{max-width:var(--breite);margin-inline:auto;padding-inline:var(--rand)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.marke{font:600 .78rem/1.2 var(--f-text);letter-spacing:.12em;text-transform:uppercase;color:var(--tinte2)}
.zahl{font-variant-numeric:tabular-nums}

/* ---------- Kopfzeile: eine Zeile über das Raster ---------- */
.kopf{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:color-mix(in srgb,var(--stahl) 92%,transparent);
  backdrop-filter:blur(6px);border-bottom:1px solid var(--linie)}
.kopf .huelle{display:grid;grid-template-columns:1fr auto;align-items:center;min-height:60px;gap:16px}
.wort{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 1rem/1 var(--f-anzeige);letter-spacing:.01em;min-height:44px}
.wort svg{width:34px;height:18px;flex:none}
.wege{display:none}
.wege a{white-space:nowrap;text-decoration:none;font:500 .98rem/1 var(--f-anzeige);display:inline-flex;align-items:center;min-height:44px;position:relative}
.wege a[aria-current="page"]::after,.wege a:hover::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:3px;background:var(--bob)}
.planknopf{font:700 .95rem/1 var(--f-anzeige);background:var(--tinte);color:var(--stahl);border:0;border-radius:999px;
  min-height:44px;padding:0 18px;display:inline-flex;align-items:center;gap:10px;cursor:pointer}
.planknopf i{display:block;width:16px;height:2px;background:currentColor;box-shadow:0 5px 0 currentColor,0 -5px 0 currentColor}
@media (min-width:1000px){
  .kopf .huelle{grid-template-columns:repeat(12,1fr);gap:20px}
  .wort{grid-column:1 / span 3}
  .wege{display:contents}
  .wege a:nth-child(1){grid-column:4}
  .wege a:nth-child(2){grid-column:5 / span 2}
  .wege a:nth-child(3){grid-column:7 / span 2}
  .wege a:nth-child(4){grid-column:9 / span 2}
  .wege a:nth-child(5){grid-column:11}
  .planknopf{grid-column:12;justify-self:end;padding:0 14px}
  .planknopf span{display:none}
}

/* ---------- Streckenplan (Menü) ---------- */
.plan{position:fixed;inset:0;z-index:50;background:var(--tinte);color:var(--stahl);display:grid;grid-template-rows:auto 1fr;
  padding:calc(env(safe-area-inset-top,0px) + 12px) var(--rand) calc(env(safe-area-inset-bottom,0px) + 24px);overflow-y:auto}
.plan[hidden]{display:none}
.plan-kopf{display:flex;justify-content:space-between;align-items:center;min-height:48px}
.plan-kopf .marke{color:var(--linie)}
.plan-zu{background:none;border:1px solid var(--linie);color:inherit;border-radius:999px;min-height:44px;padding:0 18px;font:600 .95rem var(--f-text);cursor:pointer}
.plan ol{list-style:none;margin:24px 0 0;padding:0 0 0 34px;position:relative;align-self:start}
.plan ol::before{content:"";position:absolute;left:9px;top:12px;bottom:12px;width:8px;border-left:2px solid var(--stahl);border-right:2px solid var(--stahl);opacity:.7}
.plan li{position:relative}
.plan li::before{content:"";position:absolute;left:-31px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:var(--tinte);border:3px solid var(--stahl)}
.plan li.hier::before{background:var(--bob);border-color:var(--bob)}
.plan a{display:flex;align-items:baseline;gap:14px;text-decoration:none;font:700 clamp(1.6rem,7vw,3rem)/1.15 var(--f-anzeige);padding:8px 0;min-height:44px}
.plan a small{font:500 .85rem/1 var(--f-text);color:var(--linie);letter-spacing:.06em;text-transform:uppercase}
.plan a:hover{color:var(--bob)}
.plan li.klein a{font-size:clamp(1.1rem,4vw,1.5rem)}

/* ---------- Startseite: Fahrspur ---------- */
.start{position:relative;overflow:hidden;padding-block:clamp(28px,5vw,64px) 0}
.start .huelle{position:relative;z-index:2}
.start .marke{display:flex;gap:14px;flex-wrap:wrap}
.start h1{font-size:clamp(3.1rem,12.4vw,12.4rem);line-height:.86;letter-spacing:-.025em;margin-top:18px;max-width:11ch;
  hyphens:manual}
.start h1,.tacho{text-shadow:0 0 6px var(--stahl),0 0 2px var(--stahl),0 0 12px var(--stahl)}
.start h1 .klein{display:block;font-size:.42em;letter-spacing:0;margin-top:.18em;color:var(--tinte2)}
.spur{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.spur-weit{display:none}
@media (min-width:760px){.spur-schmal{display:none}.spur-weit{display:block}}
.spur .schwelle{fill:none;stroke:var(--tinte2);stroke-width:24;stroke-dasharray:3 10;opacity:.45}
.spur .schiene{fill:none;stroke:var(--tinte);stroke-width:15;stroke-linecap:round;stroke-linejoin:round}
.spur .rinne{fill:none;stroke:var(--stahl);stroke-width:8;stroke-linecap:round;stroke-linejoin:round}
.spur .bob-koerper{fill:var(--bob)}
.spur .bob-sitz{fill:var(--tinte)}
.spur .station{fill:var(--tinte)}
.spur .station-text{font:700 15px var(--f-anzeige);fill:var(--tinte);letter-spacing:.06em}
.start-unten{display:grid;gap:18px;padding-block:clamp(180px,48vw,260px) 28px;position:relative;z-index:2}
@media (min-width:760px){.start-unten{padding-block:clamp(120px,14vw,200px) 40px;grid-template-columns:repeat(12,1fr);align-items:end}}
.tacho{display:flex;align-items:flex-end;gap:10px;line-height:.8}
.tacho-zahl{font:400 clamp(6rem,24vw,17rem)/.78 var(--f-zahl);color:var(--bob);font-variant-numeric:tabular-nums;min-width:2ch;text-align:right}
.tacho-einheit{display:grid;gap:6px;padding-bottom:.5rem}
.tacho-einheit b{font:700 1.4rem/1 var(--f-anzeige)}
.tacho-einheit span{font-size:.85rem;line-height:1.3;color:var(--tinte2);max-width:22ch}
.nochmal{justify-self:start;font:700 1rem/1 var(--f-anzeige);background:transparent;color:var(--tinte);border:2px solid var(--tinte);border-radius:999px;
  min-height:48px;padding:0 22px;cursor:pointer;display:inline-flex;align-items:center;gap:10px}
.nochmal:hover{background:var(--tinte);color:var(--stahl)}
@media (min-width:760px){
  .tacho{grid-column:7 / span 6;justify-content:flex-end;grid-row:1}
  .nochmal{grid-column:1 / span 4;grid-row:1;align-self:end}
}

/* ---------- Vorwort (eingerückte erste Zeile) ---------- */
.vorwort{border-top:1px solid var(--linie);padding-block:clamp(28px,5vw,64px)}
.vorwort .huelle{display:grid;gap:14px}
.vorwort p.gross{font:500 clamp(1.35rem,3.1vw,2.35rem)/1.22 var(--f-anzeige);text-indent:clamp(2.5rem,16vw,14rem);max-width:34ch;letter-spacing:-.005em}
.vorwort p.gross strong{font-weight:700;color:var(--bob-text)}
.kennzahlen{display:flex;flex-wrap:wrap;gap:12px 40px;margin-top:20px}
.kennzahlen div{display:grid}
.kennzahlen b{font:400 clamp(2.6rem,6vw,4.4rem)/1 var(--f-zahl);color:var(--tinte)}
.kennzahlen span{font-size:.92rem;color:var(--tinte2)}
@media (min-width:1000px){.vorwort .huelle{grid-template-columns:repeat(12,1fr);gap:20px}
  .vorwort .marke{grid-column:1 / span 2;padding-top:.6rem}.vorwort .rechts{grid-column:3 / span 10}}

/* ---------- Abschnitte ---------- */
.abschnitt{padding-block:clamp(40px,7vw,96px);border-top:1px solid var(--linie)}
.abschnitt-kopf{display:grid;gap:12px;margin-bottom:clamp(24px,4vw,48px)}
.abschnitt-kopf p{max-width:60ch;color:var(--tinte2)}
@media (min-width:1000px){.abschnitt-kopf{grid-template-columns:repeat(12,1fr);gap:20px;align-items:end}
  .abschnitt-kopf .marke{grid-column:1 / span 2;align-self:start;padding-top:.7rem}.abschnitt-kopf h2{grid-column:3 / span 6}.abschnitt-kopf p{grid-column:9 / span 4}}

/* Querschnitt Rinne / Schiene */
.quer{display:grid;gap:clamp(24px,4vw,48px)}
@media (min-width:860px){.quer{grid-template-columns:1fr 1fr}}
.quer figure{margin:0;display:grid;gap:16px}
.quer svg{width:100%;height:auto;max-height:240px;background:var(--glanz);border-radius:4px}
.quer .q-linie{stroke:var(--tinte);fill:none;stroke-width:3}
.quer .q-stahl{fill:var(--linie)}
.quer .q-bob{fill:var(--bob)}
.quer .q-tinte{fill:var(--tinte)}
.quer .q-text{font:600 13px var(--f-text);fill:var(--tinte2)}
.quer h3{display:flex;gap:12px;align-items:baseline}
.quer h3 small{font:600 .8rem var(--f-text);letter-spacing:.1em;text-transform:uppercase;color:var(--tinte2)}
.quer ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.quer li{padding-left:22px;position:relative}
.quer li::before{content:"";position:absolute;left:0;top:.7em;width:12px;height:3px;background:var(--bob)}

/* ---------- Messlatte ---------- */
.latte{display:grid;gap:clamp(24px,4vw,48px)}
@media (min-width:960px){.latte{grid-template-columns:minmax(300px,4fr) 8fr;align-items:start}}
.latte-mass{display:grid;grid-template-columns:auto 1fr;gap:20px 52px;align-items:end;position:sticky;top:80px}
.stab{position:relative;width:64px;height:340px;border:2px solid var(--tinte);border-radius:3px;
  background:repeating-linear-gradient(to top,var(--bob) 0 10%,var(--glanz) 10% 20%)}
.stab-skala{position:absolute;left:100%;top:0;bottom:0;margin-left:6px;font:600 .72rem/1 var(--f-text);color:var(--tinte2)}
.stab-skala span{position:absolute;transform:translateY(50%)}
.stab-marke{position:absolute;left:-12px;right:-12px;height:3px;background:var(--tinte);transition:bottom .25s}
.figur{position:absolute;left:8px;bottom:0;width:48px;transition:height .25s}
.figur svg{width:100%;height:100%;display:block}
.figur path{fill:var(--tinte)}
.regler{display:grid;gap:18px}
.regler label{display:grid;gap:6px;font-weight:600}
.regler output{font:700 1.6rem/1 var(--f-anzeige)}
.regler input[type=range]{width:100%;min-height:44px;accent-color:var(--bob)}
.regler select{font:inherit;min-height:48px;border:2px solid var(--tinte);border-radius:3px;background:var(--glanz);color:var(--tinte);padding:0 10px}
.latte-liste{list-style:none;margin:0;padding:0;border-top:2px solid var(--tinte)}
.latte-liste li{display:grid;grid-template-columns:1fr auto;gap:6px 16px;padding:14px 0;border-bottom:1px solid var(--linie);align-items:center}
.latte-liste .n{font:700 1.1rem/1.15 var(--f-anzeige)}
.latte-liste .n a{text-decoration:none}
.latte-liste .o{grid-column:1;font-size:.9rem;color:var(--tinte2)}
.latte-liste .s{grid-row:1 / span 2;grid-column:2}
.status{display:inline-flex;align-items:center;gap:8px;font:700 .82rem/1.1 var(--f-text);padding:8px 12px;border-radius:999px;border:2px solid currentColor;white-space:nowrap}
.status::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor}
.st-allein{color:var(--hang)}
.st-begleit{color:var(--tinte)}
.st-begleit::before{background:transparent;border:2px solid currentColor;width:6px;height:6px}
.st-nein{color:var(--bob-text)}
.st-unklar{color:var(--tinte2);border-style:dashed}
.latte-zusammen{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 14px;font-size:.95rem}
.latte-zusammen b{font-family:var(--f-anzeige)}
.hinweis{font-size:.88rem;color:var(--tinte2);margin-top:14px;max-width:70ch}
@media (max-width:520px){.latte-liste li{grid-template-columns:1fr}.latte-liste .s{grid-row:auto;grid-column:1}.stab{height:280px}}

/* ---------- Fahrplan (Bahnen nach Land) ---------- */
.fahrplan{display:grid;gap:0}
.land{display:grid;gap:8px;padding-block:22px;border-top:2px solid var(--tinte)}
@media (min-width:1000px){.land{grid-template-columns:repeat(12,1fr);gap:20px}.land h3{grid-column:1 / span 3}.land ul{grid-column:4 / span 9}}
.land h3 a{text-decoration:none}
.land h3 small{display:block;font:600 .8rem/1.4 var(--f-text);color:var(--tinte2);letter-spacing:.06em;text-transform:uppercase;margin-top:6px}
.land ul{list-style:none;margin:0;padding:0}
.zeile{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:10px 0;border-bottom:1px solid var(--linie);align-items:center}
.zeile:last-child{border-bottom:0}
.zeile a{font:700 1.08rem/1.2 var(--f-anzeige);text-decoration:none}
.zeile .ort{font-size:.88rem;color:var(--tinte2)}
.zeile .typ{font:600 .74rem/1 var(--f-text);letter-spacing:.08em;text-transform:uppercase;padding:6px 8px;border:1.5px solid var(--tinte);border-radius:3px;justify-self:end}
.zeile .typ.schiene{background:var(--tinte);color:var(--stahl)}
.laenge{grid-column:1 / -1;display:flex;align-items:center;gap:10px}
.laenge i{display:block;height:8px;background:repeating-linear-gradient(90deg,var(--tinte) 0 2px,transparent 2px 7px);border-top:2px solid var(--tinte);border-bottom:2px solid var(--tinte);min-width:6px}
.laenge b{font:400 1.25rem/1 var(--f-zahl);color:var(--bob-text);white-space:nowrap}
@media (min-width:700px){.zeile{grid-template-columns:minmax(0,4fr) minmax(0,5fr) auto}.laenge{grid-column:2;grid-row:1 / span 2}.zeile .typ{grid-column:3;grid-row:1 / span 2}}

/* ---------- Foto ---------- */
.bild{margin:0;display:grid;gap:10px}
.bild img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:2px;background:var(--glanz)}
.bild figcaption{font-size:.84rem;color:var(--tinte2);display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:space-between}
.bild-band{display:grid;gap:20px}
@media (min-width:900px){.bild-band{grid-template-columns:7fr 5fr;align-items:end}.bild-band .bild:nth-child(2) img{aspect-ratio:4/5}}

/* ---------- Ablauf einer Fahrt ---------- */
.ablauf{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:a}
.ablauf li{counter-increment:a;display:grid;grid-template-columns:auto 1fr;gap:6px 18px;padding:18px 0;border-top:1px solid var(--linie)}
.ablauf li::before{content:counter(a);grid-row:1 / span 2;font:400 clamp(2.4rem,5vw,3.6rem)/.9 var(--f-zahl);color:var(--bob-text);min-width:1.2em}
.ablauf h3{font-size:1.3rem}
.ablauf p{color:var(--tinte2);max-width:62ch}
@media (min-width:1000px){.ablauf{grid-template-columns:repeat(5,1fr);gap:20px}.ablauf li{grid-template-columns:1fr;border-top:3px solid var(--tinte)}.ablauf li::before{grid-row:auto}}

/* ---------- Unterseiten ---------- */
.seitenkopf{padding-block:clamp(20px,4vw,40px) clamp(28px,5vw,56px);border-bottom:2px solid var(--tinte);position:relative}
.krumen{font-size:.88rem;color:var(--tinte2)}
.krumen ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 8px}
.krumen li+li::before{content:"→";margin-right:8px;color:var(--linie)}
.krumen a{display:inline-flex;min-height:44px;align-items:center}
.seitenkopf h1{font-size:clamp(2.4rem,8vw,6.8rem);line-height:.9;margin-top:10px;max-width:16ch;letter-spacing:-.02em}
.seitenkopf .lead{font:500 clamp(1.15rem,2.2vw,1.55rem)/1.35 var(--f-anzeige);max-width:44ch;margin-top:22px;text-indent:clamp(1.5rem,8vw,6rem)}
.profil{display:block;width:100%;height:44px;margin-top:26px}
.profil .p-schiene{fill:none;stroke:var(--tinte);stroke-width:8;stroke-linecap:round}
.profil .p-rinne{fill:none;stroke:var(--stahl);stroke-width:3.5;stroke-linecap:round}
.profil .p-bob{fill:var(--bob)}
.text{display:grid;gap:clamp(28px,4vw,48px);padding-block:clamp(28px,5vw,64px)}
@media (min-width:1000px){.text{grid-template-columns:repeat(12,1fr);gap:20px}.text>.haupt{grid-column:3 / span 7}.text>.rand{grid-column:10 / span 3}}
.haupt{min-width:0;display:grid;gap:18px}
.haupt h2{font-size:clamp(1.6rem,3.6vw,2.5rem);margin-top:22px}
.haupt h3{margin-top:8px}
.haupt p,.haupt li{max-width:66ch}
.haupt ul,.haupt ol{margin:0;padding-left:1.2em;display:grid;gap:6px}
.haupt .bild{margin-block:10px}
.rand{min-width:0;display:grid;gap:18px;align-content:start;font-size:.95rem}
.rand .kasten{border-top:3px solid var(--tinte);padding-top:12px;display:grid;gap:8px}
.rand .kasten a{font-weight:600}
.quelle{font-size:.86rem;color:var(--tinte2)}
.pruefen{display:inline-block;font:600 .8rem/1.3 var(--f-text);border-left:4px solid var(--gelb);padding:4px 10px;background:var(--glanz)}

/* Steckbrief einer Bahn */
.bahn{display:grid;gap:14px;padding-top:26px;border-top:2px solid var(--tinte);scroll-margin-top:80px}
.bahn h2{margin-top:0}
.bahn-daten{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;margin:0;border-top:1px solid var(--linie)}
.bahn-daten div{padding:10px 12px 10px 0;border-bottom:1px solid var(--linie)}
.bahn-daten dt{font:600 .74rem/1.2 var(--f-text);letter-spacing:.1em;text-transform:uppercase;color:var(--tinte2)}
.bahn-daten dd{margin:4px 0 0;font:700 1.08rem/1.25 var(--f-anzeige)}
.bahn-daten dd.gross{font:400 1.7rem/1 var(--f-zahl);color:var(--bob-text)}

/* Tabelle nach Bundesland */
.tabelle{overflow-x:auto;-webkit-overflow-scrolling:touch;border-top:2px solid var(--tinte)}
.tabelle table{border-collapse:collapse;width:100%;min-width:560px;font-size:.95rem}
.tabelle th,.tabelle td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--linie);vertical-align:top}
.tabelle th{font:600 .76rem/1.2 var(--f-text);letter-spacing:.08em;text-transform:uppercase;color:var(--tinte2)}
.tabelle td:first-child,.tabelle th:first-child{position:sticky;left:0;background:var(--stahl);font-weight:600}

/* FAQ */
.fragen{display:grid;gap:0;border-top:2px solid var(--tinte)}
.fragen details{border-bottom:1px solid var(--linie)}
.fragen summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:56px;padding:12px 0;
  font:700 clamp(1.08rem,2vw,1.35rem)/1.2 var(--f-anzeige)}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";font:400 1.8rem/1 var(--f-zahl);color:var(--bob-text);flex:none}
.fragen details[open] summary::after{content:"–"}
.fragen details>div{padding:0 0 18px;display:grid;gap:10px;max-width:66ch}

/* ---------- 404 ---------- */
.verloren{padding-block:clamp(40px,8vw,120px);display:grid;gap:22px}
.verloren .zahl404{font:400 clamp(7rem,30vw,22rem)/.8 var(--f-zahl);color:var(--bob)}
.verloren h1{font-size:clamp(2.2rem,7vw,5rem)}
.verloren ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.verloren ul a{display:inline-flex;align-items:center;min-height:48px;padding:0 18px;border:2px solid var(--tinte);border-radius:999px;text-decoration:none;font:700 1rem var(--f-anzeige)}

/* ---------- Auslauf (Fußzeile) ---------- */
.auslauf{margin-top:clamp(40px,7vw,96px);background:var(--tinte);color:var(--stahl)}
.bremszone{height:28px;background:repeating-linear-gradient(-45deg,var(--bob) 0 18px,var(--stahl) 18px 36px)}
.auslauf .huelle{display:grid;gap:26px;padding-block:clamp(32px,5vw,64px) calc(env(safe-area-inset-bottom,0px) + 32px)}
.auslauf .ende{font:700 clamp(3.4rem,13vw,10rem)/.85 var(--f-anzeige);letter-spacing:-.03em}
.auslauf p{max-width:60ch;color:color-mix(in srgb,var(--stahl) 78%,var(--tinte))}
.auslauf nav{display:flex;flex-wrap:wrap;gap:4px 26px}
.auslauf nav a{display:inline-flex;align-items:center;min-height:44px;font:600 1rem var(--f-text);text-decoration:none}
.auslauf nav a:hover{color:var(--bob)}
.auslauf .klein{font-size:.84rem}
@media (min-width:1000px){.auslauf .huelle{grid-template-columns:repeat(12,1fr);gap:20px;align-items:end}.auslauf .ende{grid-column:1 / span 7}.auslauf .rest{grid-column:8 / span 5;display:grid;gap:18px}}
@media (max-width:999px){.auslauf .rest{display:grid;gap:18px}}

.promo-image-section{width: 100%;padding: 28px 20px 0;}
.promo-image-link{display: block;width: min(92%, 1200px);margin: 0 auto;overflow: hidden;border: 1px solid #35423b;background: #0d1410;}
.promo-image-link img{display: block;width: 100%;height: auto;object-fit: cover;}
.content-spacer{width: 100%;height: 120vh;}