/* TC Schützenmatt Solothurn · «Frisch bespannt» · Herzhaus Studios 2026 */
@font-face{font-family:Afacad;src:url(/assets/fonts/afacad-latin-wght-normal.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:Afacad;src:url(/assets/fonts/afacad-latin-wght-italic.woff2) format("woff2");font-weight:400 700;font-style:italic;font-display:swap}
@font-face{font-family:Gantari;src:url(/assets/fonts/gantari-latin-wght-normal.woff2) format("woff2");font-weight:300 800;font-display:swap}
@font-face{font-family:Gantari;src:url(/assets/fonts/gantari-latin-wght-italic.woff2) format("woff2");font-weight:300 800;font-style:italic;font-display:swap}
@font-face{font-family:Schablone;src:url(/assets/fonts/big-shoulders-stencil-display-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
 --kreide:#f4f0e6;--kreide2:#ebe4d4;--papier:#fbf9f3;
 --tinte:#14231a;--tinte2:#45534b;
 --gruen:#2a9d54;--gruen-d:#1d7a3f;--gruen-h:#4cc77a;
 --wald:#10281b;--wald2:#183a28;--wald3:#22503a;
 --sand:#d97453;--sand-d:#a8482a;
 --aare:#2b4559;--aare-d:#1d3242;
 --saite:#efe8d6;--ball:#dbe94b;
 --kopf:Afacad,system-ui,sans-serif;--text:Gantari,system-ui,sans-serif;--schab:Schablone,Afacad,sans-serif;
 --rand:clamp(16px,4.2vw,56px);--breit:1320px;
 --kopfhoehe:72px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--kopfhoehe) + 16px)}
body{margin:0;background:var(--kreide);color:var(--tinte);font:400 18px/1.62 var(--text);font-feature-settings:"kern" 1;overflow-x:clip}
button,input,select,textarea,optgroup{font-family:inherit;font-size:inherit;color:inherit}
img{max-width:100%;height:auto;display:block}
a{color:var(--gruen-d);text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:color-mix(in srgb,var(--gruen) 55%,transparent)}
a:hover{text-decoration-color:var(--gruen)}
:focus-visible{outline:3px solid var(--ball);outline-offset:3px;border-radius:2px}
h1,h2,h3,h4{font-family:var(--kopf);font-weight:700;line-height:.98;letter-spacing:-.012em;margin:0 0 .4em;text-wrap:balance}
h1{font-size:clamp(46px,7.4vw,108px)}
h2{font-size:clamp(36px,4.8vw,66px)}
h3{font-size:clamp(25px,2.4vw,32px);line-height:1.05}
h1 em,h2 em,h3 em{font-style:italic;color:var(--gruen)}
p{margin:0 0 1em;text-wrap:pretty}
.huelle{max-width:var(--breit);margin:0 auto;padding:0 var(--rand)}
.schmal{max-width:760px}
.lead{font-size:clamp(19px,1.6vw,22px);line-height:1.55;color:var(--tinte2)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--wald);color:#fff;padding:12px 16px;font-family:var(--kopf);font-weight:600}
.skip:focus{top:12px}
section{position:relative}
.block{padding:clamp(72px,10vw,140px) 0}
.block.eng{padding:clamp(52px,7vw,96px) 0}
.dunkel{background:var(--wald);color:var(--saite)}
.dunkel h2,.dunkel h3{color:#fff}
.dunkel .lead,.dunkel p{color:#d8d2c2}
.dunkel a:not(.griff){color:var(--gruen-h)}
.papier{background:var(--papier)}
.sandgrund{background:var(--sand-d);color:#fff}

/* Rubrik: gekreuzte Saiten als Merkzeichen */
.rubrik{display:flex;align-items:center;gap:12px;font:600 15px/1.2 var(--kopf);letter-spacing:.16em;text-transform:uppercase;color:var(--gruen-d);margin:0 0 22px}
.dunkel .rubrik{color:var(--gruen-h)}
.rubrik::before{content:"";flex:0 0 26px;height:26px;background:
 linear-gradient(currentColor,currentColor) 8px 0/2px 100% no-repeat,
 linear-gradient(currentColor,currentColor) 16px 0/2px 100% no-repeat,
 linear-gradient(currentColor,currentColor) 0 8px/100% 2px no-repeat,
 linear-gradient(currentColor,currentColor) 0 16px/100% 2px no-repeat;opacity:.9}

/* Saitenbett als Grund */
.bett{background-image:repeating-linear-gradient(90deg,var(--sb,rgba(239,232,214,.10)) 0 2px,transparent 2px 15px),repeating-linear-gradient(0deg,var(--sb,rgba(239,232,214,.10)) 0 2px,transparent 2px 15px)}

/* Schablone: Ziffern nur auf den Saiten */
.schab{font-family:var(--schab);font-weight:850;line-height:.8;letter-spacing:.01em;color:var(--gruen);display:inline-block;
 -webkit-mask:repeating-linear-gradient(90deg,#000 0 5px,transparent 5px 8px),repeating-linear-gradient(0deg,#000 0 5px,transparent 5px 8px);
 mask:repeating-linear-gradient(90deg,#000 0 5px,transparent 5px 8px),repeating-linear-gradient(0deg,#000 0 5px,transparent 5px 8px)}
.dunkel .schab{color:var(--gruen-h)}

/* Griffband-Knopf */
.griff{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 54px 0 24px;
 font:650 17px/1.1 var(--kopf);letter-spacing:.075em;text-transform:uppercase;text-decoration:none;color:var(--wald);
 background:repeating-linear-gradient(116deg,transparent 0 13px,rgba(20,35,26,.10) 13px 15px,rgba(255,255,255,.75) 15px 16.5px),linear-gradient(180deg,#fff,#ece6d7);
 background-size:36px 100%,100% 100%;border:0;border-radius:5px;cursor:pointer;
 box-shadow:inset 0 -3px 0 rgba(20,35,26,.10),0 1px 2px rgba(0,0,0,.12);transition:background-position .6s cubic-bezier(.2,.7,.2,1),transform .15s}
.griff::after{content:"";position:absolute;right:0;top:0;bottom:0;width:26px;border-radius:0 5px 5px 0;background:
 linear-gradient(90deg,rgba(0,0,0,.18) 0 2px,transparent 2px),repeating-linear-gradient(0deg,rgba(255,255,255,.18) 0 2px,transparent 2px 6px),var(--gruen)}
.griff:hover{background-position:36px 0,0 0;text-decoration:none}
.griff:active{transform:translateY(1px)}
.griff .pfeil{display:none}
.griff.gruen{color:#fff;background:repeating-linear-gradient(116deg,transparent 0 13px,rgba(0,0,0,.16) 13px 15px,rgba(255,255,255,.22) 15px 16.5px),linear-gradient(180deg,#2fae5e,var(--gruen-d));background-size:36px 100%,100% 100%;box-shadow:inset 0 -3px 0 rgba(0,0,0,.18),0 1px 2px rgba(0,0,0,.2)}
.griff.gruen::after{background:linear-gradient(90deg,rgba(0,0,0,.2) 0 2px,transparent 2px),repeating-linear-gradient(0deg,rgba(0,0,0,.08) 0 2px,transparent 2px 6px),var(--saite)}
.griff.sand{color:#fff;background:repeating-linear-gradient(116deg,transparent 0 13px,rgba(0,0,0,.14) 13px 15px,rgba(255,255,255,.22) 15px 16.5px),linear-gradient(180deg,#c95f3b,var(--sand-d));background-size:36px 100%,100% 100%}
.griff.sand::after{background:linear-gradient(90deg,rgba(0,0,0,.2) 0 2px,transparent 2px),var(--saite)}
.griff.klein{min-height:46px;font-size:15px;padding:0 44px 0 18px}
.griff.klein::after{width:20px}
.knoepfe{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}

/* Textverweis: Saite mit Knoten */
.saitenlink{font:600 18px/1.3 var(--kopf);letter-spacing:.02em;color:var(--gruen-d);text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:3px;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.saitenlink::after{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 25%,transparent)}
.dunkel .saitenlink{color:var(--gruen-h)}

/* ---------- Kopf ---------- */
.kopf{position:fixed;inset:0 0 auto 0;z-index:60;height:var(--kopfhoehe);display:flex;align-items:center;gap:18px;padding:0 var(--rand);
 background:color-mix(in srgb,var(--kreide) 88%,transparent);-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);border-bottom:1px solid rgba(20,35,26,.08);transition:background .3s}
.kopf .marke{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--tinte);min-height:48px}
.kopf .marke img{width:52px;height:auto}
.kopf .marke b{display:block;font:700 21px/1 var(--kopf);letter-spacing:-.005em}
.kopf .marke small{display:block;font:500 13.5px/1.2 var(--kopf);letter-spacing:.12em;text-transform:uppercase;color:var(--tinte2);margin-top:3px}
.kopf nav.kurz{margin-left:auto;display:none;gap:4px}
.kopf nav.kurz a{font:600 16.5px/1 var(--kopf);letter-spacing:.03em;color:var(--tinte);text-decoration:none;padding:14px 12px;position:relative}
.kopf nav.kurz a[aria-current]::after,.kopf nav.kurz a:hover::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:2px;background:var(--gruen)}
.kopf .sprache{font:600 15px/1 var(--kopf);letter-spacing:.1em;color:var(--tinte2);text-decoration:none;padding:14px 8px;margin-left:auto}
.kopf .griff{display:none}
/* Menüknopf: Griffkappe mit Clubzeichen */
.kappe{display:flex;align-items:center;gap:10px;background:none;border:0;padding:4px 0 4px 6px;cursor:pointer;font:650 16px/1 var(--kopf);letter-spacing:.12em;text-transform:uppercase;color:var(--tinte);min-height:48px}
.kappe i{width:46px;height:46px;display:grid;place-items:center;background:linear-gradient(145deg,var(--wald3),var(--wald));clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.1)}
.kappe i img{width:30px;height:auto}
.kappe:hover i{transform:rotate(22.5deg);transition:transform .35s}
@media (min-width:1180px){
 .kopf nav.kurz{display:flex}.kopf .sprache{margin-left:0}
 .kopf .griff{display:inline-flex;min-height:46px;font-size:15px;padding:0 44px 0 18px}.kopf .griff::after{width:20px}
}
@media (max-width:420px){.kopf .marke small{display:none}.kopf .marke b{font-size:19px}.kappe span{display:none}.kopf{gap:10px}.kopf .marke img{width:46px}}

/* ---------- Menü: das Saitenbett ---------- */
.menue{position:fixed;inset:0;z-index:90;background:var(--wald);color:var(--saite);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;
 visibility:hidden;opacity:0;transition:opacity .35s,visibility 0s .35s}
.menue::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:repeating-linear-gradient(90deg,rgba(239,232,214,.07) 0 2px,transparent 2px 38px)}
.menue .rahmenbogen{position:fixed;right:-34vmin;top:50%;width:92vmin;height:118vmin;transform:translateY(-50%);border-radius:50%;border:clamp(14px,2.6vmin,26px) solid #0a1a11;box-shadow:inset 0 0 0 3px var(--gruen),0 0 0 3px rgba(255,255,255,.05);pointer-events:none;opacity:.9}
.menue.offen{visibility:visible;opacity:1;transition:opacity .35s}
.menue .oben{display:flex;align-items:center;justify-content:space-between;height:var(--kopfhoehe);padding:0 var(--rand);position:relative;z-index:2}
.menue .oben .marke{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font:700 21px/1 var(--kopf)}
.menue .oben .marke img{width:52px}
.zu{background:none;border:0;color:var(--saite);display:flex;align-items:center;gap:10px;font:650 16px/1 var(--kopf);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;min-height:48px;padding:0}
.zu i{width:46px;height:46px;display:grid;place-items:center;border:2px solid rgba(239,232,214,.5);clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);background:rgba(239,232,214,.08);font-style:normal;font-size:26px;line-height:1}
.menue ol{list-style:none;margin:0;padding:8px var(--rand) 10px;position:relative;z-index:2;max-width:980px}
.quer{display:grid;grid-template-columns:54px 1fr;align-items:end;column-gap:14px;text-decoration:none;color:#fff;padding:14px 0 0;position:relative;min-height:62px}
.quer .nr{font:800 22px/1 var(--schab);color:var(--gruen-h);padding-bottom:13px}
.quer .wort{font:650 clamp(28px,4.6vw,44px)/1.05 var(--kopf);letter-spacing:-.01em;padding-bottom:10px}
.quer .hin{grid-column:2;font:400 15.5px/1.3 var(--text);color:#bdb6a4;margin:-6px 0 10px}
.quer svg{position:absolute;left:0;right:0;bottom:0;width:100%;height:18px;overflow:visible;pointer-events:none}
.quer svg path{fill:none;stroke:rgba(239,232,214,.38);stroke-width:2;vector-effect:non-scaling-stroke}
.quer:hover svg path,.quer:focus-visible svg path{stroke:var(--gruen-h)}
.quer[aria-current] .wort::after{content:"";display:inline-block;width:20px;height:20px;margin-left:14px;vertical-align:middle;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fbffc9,var(--ball) 50%,#9aa82a);box-shadow:0 2px 6px rgba(0,0,0,.35)}
.menue .unten{position:relative;z-index:2;padding:22px var(--rand) 34px;display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;margin-top:auto}
.menue .unten a:not(.griff){color:#d9d3c3;font:600 16px/1 var(--kopf);letter-spacing:.06em;min-height:44px;display:inline-flex;align-items:center}
body.menue-offen{overflow:hidden}

/* ---------- Held: Schläger mit Saitenbett ---------- */
.held{padding:calc(var(--kopfhoehe) + 28px) 0 clamp(48px,6vw,90px);background:var(--kreide);overflow:hidden}
.held .huelle{display:grid;grid-template-columns:1fr;grid-template-areas:"a" "r" "b";gap:20px;align-items:center}
.held .text-a{grid-area:a}.held .text-b{grid-area:b}
.schlaeger{position:relative;width:min(100%,560px);aspect-ratio:.8;margin:0 auto 34px;touch-action:pan-y;grid-area:r}
.schlaeger::before{content:"";position:absolute;left:8%;right:8%;top:6%;bottom:2%;border-radius:50%;box-shadow:0 28px 46px -14px rgba(10,25,16,.45)}
.schlaeger img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:42% 60%;clip-path:ellipse(44.2% 45.4% at 50% 50%)}
.schlaeger canvas{position:absolute;inset:0;width:100%;height:100%}
.schlaeger .hinweis{position:absolute;left:50%;bottom:-30px;transform:translateX(-50%);font:500 14px/1.2 var(--kopf);letter-spacing:.14em;text-transform:uppercase;color:var(--tinte2);white-space:nowrap;opacity:0;transition:opacity .6s}
.schlaeger.bereit .hinweis{opacity:.85}
.held .text .rubrik{margin-bottom:16px}
.held h1{margin-bottom:.3em}
.held .lead{max-width:34ch}
.held .angebot{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:6px 0 0;font:600 18px/1.3 var(--kopf);color:var(--tinte)}
.held .angebot b{font:850 44px/1 var(--schab);color:var(--sand-d)}
@media (min-width:980px){
 .held{padding-top:calc(var(--kopfhoehe) + 40px)}
 .held .huelle{grid-template-columns:1.08fr .92fr;grid-template-areas:"a r" "b r";grid-template-rows:auto 1fr;column-gap:40px;row-gap:0;align-content:center}
 .held .text-a{align-self:end}.held .text-b{align-self:start}
 .schlaeger{width:100%;max-width:600px}
}
@media (max-width:979px){
 .held .huelle{gap:8px}
 .schlaeger{width:min(70vw,360px);margin-bottom:38px}
 .held h1{font-size:clamp(42px,11.2vw,64px);margin-bottom:6px}
 .held .text-a .rubrik{margin-bottom:10px}
}

/* Live-Blick vom Ritterquai */
.live{display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:center;margin-top:30px;max-width:460px;background:var(--wald);color:var(--saite);padding:10px 16px 10px 10px;border-radius:6px;text-decoration:none;box-shadow:0 10px 30px -14px rgba(16,40,27,.6)}
.live[hidden]{display:none}
.live .bild{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:3px;background:#0b1a12}
.live .bild img{width:100%;height:100%;object-fit:cover}
.live b{display:flex;align-items:center;gap:8px;font:650 14.5px/1.2 var(--kopf);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.live b::before{content:"";width:9px;height:9px;border-radius:50%;background:#ff5a3c;box-shadow:0 0 0 0 rgba(255,90,60,.6);animation:puls 2s infinite}
.live span{display:block;font:400 15px/1.35 var(--text);color:#cfc9b8;margin-top:4px}
@keyframes puls{70%{box-shadow:0 0 0 9px rgba(255,90,60,0)}100%{box-shadow:0 0 0 0 rgba(255,90,60,0)}}

/* Kennzahlen auf den Saiten */
.zahlen{background:var(--wald);color:var(--saite);overflow:hidden}
.zahlen .reihe{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 26px}
.zahlen .z{position:relative;padding:22px 0 0}
.zahlen .z .schab{font-size:clamp(92px,10vw,156px)}
.zahlen .z p{font:600 18px/1.35 var(--kopf);color:#fff;margin:12px 0 0;max-width:22ch}
.zahlen .z small{display:block;font:400 15.5px/1.4 var(--text);color:#bfb8a6;margin-top:4px}
@media (min-width:980px){.zahlen .reihe{grid-template-columns:repeat(4,1fr);gap:40px 48px}}

/* Zweispalter mit Foto */
.zwei{display:grid;grid-template-columns:1fr;gap:clamp(28px,5vw,72px);align-items:center}
@media (min-width:900px){.zwei{grid-template-columns:1fr 1fr}.zwei.links-bild>figure{order:-1}}
figure{margin:0}
.foto{position:relative;overflow:hidden;border-radius:4px;background:var(--kreide2)}
.foto img{width:100%;height:100%;object-fit:cover}
figcaption{font:500 15px/1.4 var(--kopf);letter-spacing:.03em;color:var(--tinte2);margin-top:10px}
.dunkel figcaption{color:#bdb6a4}
.lb{cursor:zoom-in}

/* Zitat aus dem Club */
.zitat{font:500 italic clamp(26px,3.1vw,40px)/1.22 var(--kopf);color:var(--wald);margin:0 0 22px;text-wrap:balance}
.zitat::before{content:"«";color:var(--gruen)}.zitat::after{content:"»";color:var(--gruen)}
.quelle{font:600 15px/1.3 var(--kopf);letter-spacing:.12em;text-transform:uppercase;color:var(--tinte2)}

/* Erstes Jahr: Saitenset */
.set{position:relative;background:var(--papier);border-radius:6px 6px 4px 4px;padding:44px 26px 26px;box-shadow:0 1px 0 rgba(0,0,0,.05),0 18px 40px -24px rgba(16,40,27,.45);overflow:hidden}
.set::before{content:"";position:absolute;left:50%;top:12px;transform:translateX(-50%);width:46px;height:14px;border-radius:9px;background:var(--kreide);box-shadow:inset 0 2px 3px rgba(0,0,0,.25)}
.set .band{position:absolute;left:0;right:0;top:0;height:6px;background:var(--c,var(--gruen))}
.set .art{font:600 15px/1.2 var(--kopf);letter-spacing:.14em;text-transform:uppercase;color:var(--tinte2)}
.set h3{margin:6px 0 4px;font-size:clamp(26px,2.4vw,32px)}
.set .wer{font-size:16px;color:var(--tinte2);line-height:1.45;margin:0 0 16px;min-height:2.9em}
.set .preis{display:flex;align-items:baseline;gap:8px;font:700 18px/1 var(--kopf);color:var(--tinte2)}
.set .preis b{font:850 clamp(62px,6vw,80px)/.85 var(--schab);color:var(--c,var(--gruen-d))}
.set .rolle{position:absolute;right:-30px;bottom:-30px;width:120px;height:120px;border-radius:50%;border:10px solid color-mix(in srgb,var(--c,var(--gruen)) 22%,transparent);box-shadow:inset 0 0 0 8px color-mix(in srgb,var(--c,var(--gruen)) 12%,transparent),inset 0 0 0 16px color-mix(in srgb,var(--c,var(--gruen)) 22%,transparent)}
.set .erst{display:inline-block;margin-top:14px;font:650 15px/1.25 var(--kopf);letter-spacing:.04em;background:var(--ball);color:var(--wald);padding:7px 11px;border-radius:3px;transform:rotate(-2deg)}
.set .erst s{opacity:.6}
.set .klein{font-size:15px;color:var(--tinte2);margin:10px 0 0;line-height:1.4}
.regal{position:relative;padding-top:26px}
.regal::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;border-radius:5px;background:linear-gradient(180deg,#5d6a62,#2f3a33);box-shadow:0 3px 0 rgba(0,0,0,.15)}
.regal .sets{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:26px}
@media (max-width:699px){.regal .sets{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82%;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--rand) 18px;margin:0 calc(var(--rand)*-1);scrollbar-width:thin}.regal .set{scroll-snap-align:center}.regal::after{content:"Wischen für weitere Sets";display:block;font:600 14px/1 var(--kopf);letter-spacing:.12em;text-transform:uppercase;color:var(--tinte2);margin-top:6px}html[lang=en] .regal::after{content:"Swipe for more sets"}}
.regal .set{transform-origin:50% 0}
.regal .set::after{content:"";position:absolute;left:50%;top:-26px;width:2px;height:30px;background:#2f3a33;transform:translateX(-50%)}
@media (prefers-reduced-motion:no-preference){.regal .set.sicht{animation:pendel 1.6s cubic-bezier(.3,.6,.3,1) both}}
@keyframes pendel{0%{transform:rotate(3.5deg)}35%{transform:rotate(-2deg)}65%{transform:rotate(1deg)}100%{transform:rotate(0)}}

/* Drei Wege: Quersaiten mit Foto */
.wege{border-top:2px solid rgba(20,35,26,.14)}
.weg{display:grid;grid-template-columns:96px 1fr;gap:4px 18px;align-items:center;padding:22px 0;border-bottom:2px solid rgba(20,35,26,.14);text-decoration:none;color:var(--tinte);position:relative}
.weg .bild{grid-row:span 2;width:96px;height:96px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 4px var(--kreide),0 0 0 6px var(--gruen)}
.weg .bild img{width:100%;height:100%;object-fit:cover}
.weg h3{margin:0;font-size:clamp(28px,3.4vw,46px)}
.weg p{margin:0;color:var(--tinte2);font-size:17px;line-height:1.45}
.weg:hover h3{color:var(--gruen-d)}
@media (min-width:900px){.weg{grid-template-columns:150px 1fr 320px;padding:28px 0}.weg .bild{width:150px;height:150px;grid-row:auto}.weg p{font-size:18px}}

/* Grosses Bild mit Text */
.buehne{position:relative;min-height:min(92vh,820px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--wald)}
.buehne>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.buehne::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,26,17,0) 35%,rgba(10,26,17,.82) 88%)}
.buehne .huelle{position:relative;z-index:2;width:100%;padding-bottom:clamp(40px,7vw,90px)}
.buehne h2{color:#fff;max-width:16ch}
.buehne p{color:#e8e2d2;max-width:46ch;font-size:clamp(18px,1.5vw,21px)}

/* Balldosen der Sponsoren */
.dosen{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:30px 18px;align-items:end}
.dose{position:relative;text-decoration:none;color:inherit;display:block}
.dose .koerper{position:relative;height:186px;border-radius:12px 12px 10px 10px;background:
 linear-gradient(90deg,rgba(0,0,0,.18),rgba(255,255,255,.35) 22%,rgba(255,255,255,.05) 46%,rgba(0,0,0,.12) 78%,rgba(0,0,0,.28)),#f8f6f0;display:grid;place-items:center;padding:30px 14px 22px;box-shadow:0 14px 22px -16px rgba(0,0,0,.6)}
.dose .koerper::before{content:"";position:absolute;left:-3px;right:-3px;top:-10px;height:20px;border-radius:50%;background:linear-gradient(180deg,#f2efe6,#c7c1b3);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12),0 2px 0 rgba(0,0,0,.08)}
.dose .koerper::after{content:"";position:absolute;left:0;right:0;bottom:16px;height:8px;background:var(--gruen);opacity:.85}
.dose img{max-height:70px;max-width:100%;width:auto;mix-blend-mode:multiply;position:relative}
.dose span{display:block;font:600 15px/1.3 var(--kopf);text-align:center;margin-top:10px;color:var(--tinte2)}
.dose:hover .koerper{transform:translateY(-4px);transition:transform .25s}
.dunkel .dose span{color:#cfc9b8}

/* Herzhaus Digitalpartner-Karte */
.hh-karte{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:40px;padding:20px 22px;background:#0b0b0c;color:#e9e4d6!important;text-decoration:none;font:400 16px/1.45 var(--text);border-radius:4px}
.hh-karte .hk-marke{display:inline-flex;align-items:flex-end;gap:6px;flex:0 0 auto}
.hh-karte .hk-marke img:first-child{height:32px;width:auto}
.hh-karte .hk-marke img:last-child{height:32px;width:auto;margin-bottom:-3px}
.hh-karte strong{display:block;font:650 15px/1.3 var(--kopf);letter-spacing:.12em;text-transform:uppercase;color:#fff}
.hh-karte>span:last-child{flex:1 1 240px;min-width:0}

/* Unterseiten-Kopf */
.seitenkopf{padding:calc(var(--kopfhoehe) + clamp(36px,6vw,80px)) 0 clamp(40px,6vw,72px)}
.seitenkopf h1{max-width:15ch}
.seitenkopf .lead{max-width:56ch}

/* Spielplan-Tafel (Heimspiele) */
.tafel{background:var(--wald);color:#fff;border-radius:6px;overflow:hidden;box-shadow:0 20px 40px -24px rgba(0,0,0,.55)}
.tafel .tk{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:16px 20px;background:var(--wald2);font:650 15px/1.2 var(--kopf);letter-spacing:.14em;text-transform:uppercase;color:var(--gruen-h)}
.tafel ol{list-style:none;margin:0;padding:0}
.tafel li{display:grid;grid-template-columns:92px 1fr;gap:4px 16px;padding:14px 20px;border-top:1px solid rgba(239,232,214,.1)}
.tafel .d{font:700 17px/1.2 var(--kopf);color:var(--saite)}
.tafel .d small{display:block;font:400 14.5px/1.3 var(--text);color:#a9a391;margin-top:2px}
.tafel .m{font:500 17.5px/1.35 var(--text);color:#fff}
.tafel .m em{font-style:normal;display:block;font:600 14.5px/1.3 var(--kopf);letter-spacing:.06em;color:var(--gruen-h);margin-top:3px}
.tafel li.cup{background:linear-gradient(90deg,rgba(76,199,122,.16),transparent)}

/* Mannschaften */
.teams{display:grid;grid-template-columns:1fr;gap:34px}
@media (min-width:700px){.teams{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.teams{grid-template-columns:repeat(3,1fr)}}
.team .foto{aspect-ratio:4/3}
.team .foto img{object-position:50% 40%}
.team h3{font-size:25px;margin:14px 0 4px}
.team .liga{display:inline-flex;align-items:center;gap:8px;font:650 14.5px/1 var(--kopf);letter-spacing:.12em;text-transform:uppercase;color:var(--gruen-d)}
.team .liga::before{content:"";width:22px;height:10px;border-radius:2px;background:repeating-linear-gradient(116deg,var(--gruen) 0 4px,var(--gruen-d) 4px 6px)}
.team.nla{grid-column:1/-1}
.team.nla .foto{aspect-ratio:16/8}
.team.nla .liga{color:var(--sand-d)}.team.nla .liga::before{background:repeating-linear-gradient(116deg,var(--ball) 0 4px,#b9c63a 4px 6px)}
@media (max-width:699px){.team.nla .foto{aspect-ratio:4/5}}

/* Galerie */
.galerie{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:800px){.galerie{grid-template-columns:repeat(4,1fr);gap:14px}}
.galerie button{padding:0;border:0;background:none;aspect-ratio:3/4;overflow:hidden;border-radius:4px;cursor:zoom-in}
.galerie button img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.galerie button:hover img{transform:scale(1.04)}

/* Lichtbox */
.lichtbox{position:fixed;inset:0;z-index:120;background:rgba(8,20,13,.94);display:none;align-items:center;justify-content:center;padding:64px 12px}
.lichtbox.offen{display:flex}
.lichtbox img{max-width:min(1400px,100%);max-height:100%;object-fit:contain;border-radius:3px}
.lichtbox button{position:absolute;background:var(--saite);color:var(--wald);border:0;width:52px;height:52px;border-radius:50%;font:700 24px/1 var(--kopf);cursor:pointer;display:grid;place-items:center}
.lichtbox .lz{top:12px;right:12px}.lichtbox .lv{left:12px;top:50%;transform:translateY(-50%)}.lichtbox .ln{right:12px;top:50%;transform:translateY(-50%)}

/* Weg zum Badge: Saite durch Ösen */
.oesen{list-style:none;margin:0;padding:0;position:relative;counter-reset:o}
.oesen::before{content:"";position:absolute;left:21px;top:24px;bottom:24px;width:3px;background:var(--gruen);border-radius:2px}
.oesen li{position:relative;padding:0 0 30px 70px;counter-increment:o}
.oesen li::before{content:counter(o);position:absolute;left:0;top:0;width:45px;height:45px;border-radius:50%;background:var(--kreide);border:3px solid var(--gruen);display:grid;place-items:center;font:850 22px/1 var(--schab);color:var(--gruen-d);box-shadow:inset 0 0 0 5px var(--kreide),inset 0 0 0 7px rgba(42,157,84,.25)}
.papier .oesen li::before{background:var(--papier);box-shadow:inset 0 0 0 5px var(--papier),inset 0 0 0 7px rgba(42,157,84,.25)}
.oesen h3{font-size:clamp(23px,2.2vw,28px);margin:6px 0 6px}
.oesen p{margin:0;color:var(--tinte2)}

/* Platzordnung als Emailschild */
.schild{background:var(--saite);color:var(--wald);border-radius:10px;padding:28px 26px;border:3px solid var(--wald);box-shadow:inset 0 0 0 6px var(--saite),inset 0 0 0 8px var(--wald),0 18px 30px -20px rgba(0,0,0,.5);position:relative}
.schild::before,.schild::after{content:"";position:absolute;top:14px;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#8c8778)}
.schild::before{left:14px}.schild::after{right:14px}
.schild h3{text-align:center;font-size:clamp(24px,2.4vw,30px);letter-spacing:.06em;text-transform:uppercase;margin:4px 0 18px}
.schild ul{list-style:none;margin:0;padding:0}
.schild li{display:grid;grid-template-columns:72px 1fr;gap:14px;padding:12px 0;border-top:1px dashed rgba(16,40,27,.3);font-size:17px;line-height:1.45}
.schild li b{font:700 18px/1.2 var(--kopf);color:var(--gruen-d)}

/* Luftbild mit Beschriftung */
.luft{position:relative;border-radius:6px;overflow:hidden}
.luft img{width:100%}
.luft .mk{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
.luft .mk i{width:18px;height:18px;border-radius:50%;background:var(--ball);box-shadow:0 0 0 4px rgba(16,40,27,.55),0 0 0 9px rgba(219,233,75,.25)}
.luft .mk span{font:650 14.5px/1.15 var(--kopf);letter-spacing:.06em;background:var(--wald);color:#fff;padding:6px 9px;border-radius:3px;white-space:nowrap}
@media (max-width:699px){.luft .mk span{font-size:13px;padding:5px 7px}.luft .mk.weg-handy span{display:none}}
.luftliste{display:grid;gap:10px;margin-top:20px;padding:0;list-style:none}
.luftliste li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start;font-size:17px}
.luftliste li::before{content:"";width:16px;height:16px;margin-top:5px;border-radius:50%;background:var(--ball);box-shadow:0 0 0 3px var(--wald)}

/* Webcam gross */
.platzblick{background:#06120c;border-radius:8px;padding:12px;box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.platzblick .bild{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:4px;background:#0b1a12}
.platzblick .bild img{width:100%;height:100%;object-fit:cover}
.platzblick .leiste-cam{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;padding:12px 6px 4px;color:#d7d1c0;font:500 15.5px/1.35 var(--kopf)}
.platzblick .leiste-cam b{display:inline-flex;align-items:center;gap:8px;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.platzblick .leiste-cam b::before{content:"";width:9px;height:9px;border-radius:50%;background:#ff5a3c;animation:puls 2s infinite}

/* Cup: 65 Ausgaben als Saiten */
.ausgaben{display:grid;grid-template-columns:repeat(13,1fr);gap:7px 5px;margin-top:26px}
.ausgaben i{height:42px;border-radius:2px;background:linear-gradient(180deg,rgba(239,232,214,.85),rgba(239,232,214,.45));transform-origin:50% 100%}
.ausgaben i.jetzt{background:linear-gradient(180deg,var(--ball),#a8b630)}
@media (prefers-reduced-motion:no-preference){.ausgaben.sicht i{animation:wachs .5s both;animation-delay:calc(var(--n)*22ms)}}
@keyframes wachs{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.ausgaben-leg{display:flex;justify-content:space-between;font:650 15px/1 var(--kopf);letter-spacing:.1em;color:#cfc9b8;margin-top:12px}
.fakten{list-style:none;margin:0;padding:0;display:grid;gap:0}
.fakten li{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:6px 22px;padding:16px 0;border-bottom:2px solid rgba(20,35,26,.12)}
.fakten li b{font:700 19px/1.3 var(--kopf);color:var(--gruen-d)}
.dunkel .fakten li{border-color:rgba(239,232,214,.14)}.dunkel .fakten li b{color:var(--gruen-h)}
@media (max-width:560px){.fakten li{grid-template-columns:1fr}}

/* Ballfarben Nachwuchs */
.baelle{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:900px){.baelle{grid-template-columns:repeat(4,1fr)}}
.ball{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}
@media (min-width:900px){.ball{grid-template-columns:1fr}}
.ball i{display:block;width:var(--s,70px);height:var(--s,70px);border-radius:50%;background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.55),transparent 38%),var(--c);position:relative;box-shadow:inset -6px -8px 14px rgba(0,0,0,.18),0 12px 20px -14px rgba(0,0,0,.6)}
.ball i::before,.ball i::after{content:"";position:absolute;inset:8%;border-radius:50%;border:3px solid rgba(255,255,255,.88);clip-path:inset(0 52% 0 0)}
.ball i::after{clip-path:inset(0 0 0 52%);transform:scaleX(-1)}
.ball h3{margin:0 0 6px}
.ball p{margin:0;color:var(--tinte2);font-size:17px;line-height:1.5}

/* Vorstand */
.vorstand{display:grid;grid-template-columns:1fr;gap:0;border-top:2px solid rgba(20,35,26,.14)}
@media (min-width:860px){.vorstand{grid-template-columns:1fr 1fr;column-gap:48px}}
.vorstand div{display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:center;padding:18px 0;border-bottom:2px solid rgba(20,35,26,.14)}
.vorstand b{font:700 21px/1.2 var(--kopf)}
.vorstand span{font:500 15px/1.3 var(--kopf);letter-spacing:.1em;text-transform:uppercase;color:var(--tinte2);grid-column:1}
.vorstand a{grid-row:1/3;grid-column:2;font:600 15.5px/1 var(--kopf);letter-spacing:.06em;text-decoration:none;color:var(--gruen-d);border:2px solid var(--gruen);padding:12px 14px;border-radius:4px;min-height:44px;display:inline-flex;align-items:center}
.vorstand .frei b{color:var(--sand-d)}
.vorstand .frei{background:linear-gradient(90deg,rgba(219,233,75,.28),transparent 70%);padding-left:12px;margin-left:-12px;padding-right:0}

/* Dokumente */
.doks{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.dok{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;padding:16px 18px;background:var(--papier);border-radius:4px;text-decoration:none;color:var(--tinte);box-shadow:0 1px 0 rgba(0,0,0,.06);min-height:64px}
.dok i{width:44px;height:54px;background:var(--kreide2);border-radius:2px;position:relative;font:700 12.5px/1 var(--kopf);font-style:normal;display:grid;place-items:end center;padding-bottom:8px;color:var(--sand-d);letter-spacing:.06em}
.dok i::before{content:"";position:absolute;right:0;top:0;border:8px solid var(--kreide);border-left-color:var(--sand);border-bottom-color:var(--sand)}
.dok b{font:650 17.5px/1.25 var(--kopf);display:block}
.dok small{font-size:14.5px;color:var(--tinte2)}
.dok:hover b{color:var(--gruen-d)}

/* Formular */
.formular{display:grid;gap:18px;background:var(--papier);padding:clamp(22px,3vw,36px);border-radius:6px;box-shadow:0 20px 40px -30px rgba(0,0,0,.4)}
.formular label{display:grid;gap:7px;font:600 15.5px/1.2 var(--kopf);letter-spacing:.06em;text-transform:uppercase;color:var(--tinte2)}
.formular input,.formular select,.formular textarea{font:400 18px/1.4 var(--text);text-transform:none;letter-spacing:0;color:var(--tinte);background:var(--kreide);border:0;border-bottom:3px solid rgba(20,35,26,.25);border-radius:4px 4px 0 0;padding:13px 14px;min-height:52px;width:100%}
.formular textarea{min-height:140px;resize:vertical}
.formular input:focus,.formular select:focus,.formular textarea:focus{outline:none;border-bottom-color:var(--gruen);background:#fff}
.formular .an{font:400 15.5px/1.4 var(--text);color:var(--tinte2);margin:0}
.formular .an b{color:var(--gruen-d)}

/* Barrierefreiheit: Dämpfer auf der Saite */
.daempfer{display:grid;gap:4px}
.daempfer>div{display:grid;grid-template-columns:1fr auto;gap:6px 24px;align-items:center;padding:22px 0;border-bottom:2px solid rgba(20,35,26,.14)}
.daempfer h3{margin:0;font-size:25px}
.daempfer p{margin:0;color:var(--tinte2);font-size:17px;grid-column:1}
.schalter{grid-row:1/3;grid-column:2;position:relative;width:96px;height:52px;border:0;background:none;cursor:pointer;padding:0}
.schalter::before{content:"";position:absolute;left:6px;right:6px;top:50%;height:3px;margin-top:-1.5px;background:var(--tinte2);border-radius:2px}
.schalter::after{content:"";position:absolute;top:50%;left:8px;width:34px;height:26px;margin-top:-13px;border-radius:8px;background:linear-gradient(180deg,#9aa49e,#6d7872);box-shadow:inset 0 -4px 0 rgba(0,0,0,.2);transition:left .3s cubic-bezier(.3,1.4,.5,1),background .3s}
.schalter[aria-pressed="true"]::after{left:54px;background:linear-gradient(180deg,var(--gruen-h),var(--gruen-d))}
.schalter span{position:absolute;bottom:-6px;left:0;right:0;font:650 13.5px/1 var(--kopf);letter-spacing:.12em;color:var(--tinte2);text-align:center}

/* Rechtstexte */
.recht h2{font-size:clamp(28px,3vw,38px);margin-top:1.4em}
.recht p,.recht li{max-width:70ch}

/* Fuss */
.fuss{background:var(--wald);color:#d6d0bf;padding:clamp(56px,7vw,96px) 0 40px;position:relative;overflow:hidden}
.fuss::before{content:"";position:absolute;right:-12vw;top:-30%;width:58vw;max-width:760px;aspect-ratio:.8;border-radius:50%;border:22px solid #0a1a11;box-shadow:inset 0 0 0 3px rgba(42,157,84,.5);opacity:.55;pointer-events:none}
.fuss .gitter{position:relative;display:grid;grid-template-columns:1fr;gap:36px}
.fuss .gitter{grid-template-columns:1fr 1fr;column-gap:22px}.fuss .gitter>div:first-child{grid-column:1/-1}
@media (min-width:900px){.fuss .gitter{grid-template-columns:1.3fr 1fr 1fr}.fuss .gitter>div:first-child{grid-column:auto}}
@media (max-width:899px){.fuss li a{font-size:16px}}
.fuss img.logo{width:96px;margin-bottom:16px}
.fuss h2{font-size:30px;color:#fff;margin-bottom:10px}
.fuss small{display:block;font:600 14.5px/1.2 var(--kopf);letter-spacing:.14em;text-transform:uppercase;color:var(--gruen-h);margin-bottom:12px}
.fuss ul{list-style:none;margin:0;padding:0}
.fuss li a{display:inline-flex;align-items:center;min-height:42px;color:#ece6d6;text-decoration:none;font:500 17px/1.2 var(--kopf)}
.fuss li a:hover{color:var(--gruen-h)}
.fuss p{font-size:17px;line-height:1.55}
.fuss p a{color:#ece6d6}

/* Herzhaus-Band */
.hh-band{background:#060607;color:#e9e4d6;display:flex;justify-content:center;padding:40px 16px 14px}
.hh-band a{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 14px;text-decoration:none;color:inherit;min-height:44px}
.hh-satz{font:600 15px/1 var(--kopf);letter-spacing:.03em}
.hh-marke{display:inline-flex;align-items:flex-end;gap:5px}
.hh-wort{height:30px;width:auto}
.hh-figur{height:30px;width:auto;margin-bottom:-3px;transform-origin:50% 100%;animation:hh-wipp 4.2s ease-in-out infinite,hh-hupf 7s ease-in-out 2s infinite}
@media (min-width:900px){.hh-figur{height:27px}}
@keyframes hh-wipp{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@keyframes hh-hupf{0%,88%,100%{translate:0 0}91%{translate:0 -6px}}

/* Leiste unten am Handy */
.leiste{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--wald) 94%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.leiste .griff{flex:1 1 0;justify-content:center;min-height:50px;font-size:15px;padding:0 34px 0 12px}
.leiste .griff::after{width:18px}
@media (max-width:1179px){.hh-band{padding-bottom:calc(14px + 72px + env(safe-area-inset-bottom))}}
@media (min-width:1180px){.leiste{display:none}}

/* Einblenden */
@media (prefers-reduced-motion:no-preference){
 .auf{opacity:0;transform:translateY(22px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
 .auf.sicht{opacity:1;transform:none}
}

/* 404 */
.fehler{min-height:80vh;display:grid;place-items:center;text-align:center;padding:calc(var(--kopfhoehe) + 40px) var(--rand) 60px}
.fehler .schab{font-size:clamp(150px,30vw,320px)}

/* Einstellungen */
html.gross main,html.gross .fuss{zoom:1.16}
html.ruhig *,html.ruhig *::before,html.ruhig *::after{animation:none!important;transition:none!important}
html.ruhig .auf{opacity:1;transform:none}
html.kontrast{--tinte2:#26312b;--gruen-d:#14612f}
html.kontrast .lead,html.kontrast .weg p{color:#1d2620}
html.kontrast .dunkel p,html.kontrast .dunkel .lead{color:#f0ebdc}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.hh-figur{animation:none}}
@media print{.kopf,.leiste,.hh-band,.menue{display:none}}

/* Runde 1, Umbauten nach Sichtkontrolle */
.luft .mk i{display:grid;place-items:center;font:800 13px/1 var(--kopf);color:var(--wald)}
.luftleg{display:none}
@media (max-width:699px){.luft .mk span{display:none}.luft .mk i::before{content:attr(data-n)}.luft .mk i{width:26px;height:26px}
 .luftleg{display:flex;flex-wrap:wrap;gap:8px 18px;list-style:none;margin:14px 0 0;padding:0;counter-reset:l;font:600 16px/1.3 var(--kopf)}
 .luftleg li{counter-increment:l;display:flex;align-items:center;gap:8px}.luftleg li::before{content:counter(l);width:24px;height:24px;border-radius:50%;background:var(--ball);display:grid;place-items:center;font:800 13px/1 var(--kopf);box-shadow:0 0 0 2px var(--wald)}}
.team .foto img{object-position:50% 25%}
@media (max-width:899px){.team.nla .foto{aspect-ratio:4/5}}
.tafel.kurz li:nth-child(n+9){display:none}
.tafel .mehr{display:block;width:100%;min-height:54px;background:var(--wald2);color:var(--gruen-h);border:0;border-top:1px solid rgba(239,232,214,.12);font:650 15.5px/1 var(--kopf);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.ausgaben{display:flex;justify-content:space-between;align-items:end;gap:0;height:120px;padding:0 2px}
.ausgaben i{width:2px;height:100%;border-radius:1px;background:linear-gradient(180deg,rgba(239,232,214,.9),rgba(239,232,214,.35));position:relative}
.ausgaben i::before{content:"";position:absolute;left:50%;top:-7px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:rgba(239,232,214,.6)}
.ausgaben i.jetzt{width:4px;background:var(--ball)}.ausgaben i.jetzt::before{background:var(--ball);width:10px;height:10px;margin-left:-5px;top:-11px}
@media (max-width:899px){.plakat{max-width:72%;margin:0 auto}}
@media (max-width:699px){.dosen{grid-template-columns:repeat(3,1fr);gap:22px 12px}.dose .koerper{height:128px;padding:22px 8px 18px;border-radius:9px}.dose .koerper::after{bottom:11px;height:6px}.dose img{max-height:46px}.dose span{font-size:13.5px}}

/* Durchgang 2 */
.chronik{list-style:none;margin:44px 0 0;padding:0;position:relative;display:grid;gap:0}
.chronik::before{content:"";position:absolute;left:23px;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--saite),#cfc6ae);box-shadow:1px 0 0 rgba(0,0,0,.15)}
.chronik li{position:relative;display:grid;grid-template-columns:1fr;gap:4px;padding:0 0 38px 74px}
.chronik li::before{content:"";position:absolute;left:12px;top:10px;width:25px;height:25px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--saite) 45%,#b9ae92);box-shadow:0 0 0 4px var(--kreide),0 3px 6px rgba(0,0,0,.25)}
.chronik li.hell::before{background:radial-gradient(circle at 35% 35%,#fbffc9,var(--ball) 50%,#9aa82a)}
.chronik b{font:850 clamp(64px,7vw,104px)/.85 var(--schab);color:var(--gruen-d);letter-spacing:.01em}
.chronik li.hell b{color:var(--sand-d)}
.chronik span{font-size:clamp(18px,1.5vw,21px);max-width:44ch;color:var(--tinte)}
@media (min-width:900px){
 .chronik{grid-template-columns:repeat(4,1fr);gap:30px;padding-top:56px}
 .chronik::before{left:0;right:0;top:18px;bottom:auto;width:auto;height:3px;background:linear-gradient(90deg,var(--saite),#cfc6ae);box-shadow:0 1px 0 rgba(0,0,0,.15)}
 .chronik li{padding:0;grid-template-rows:auto 1fr}
 .chronik li::before{left:0;top:-50px}
}
@media (prefers-reduced-motion:no-preference){.chronik.sicht li{animation:knoten .7s both}.chronik.sicht li:nth-child(2){animation-delay:.15s}.chronik.sicht li:nth-child(3){animation-delay:.3s}.chronik.sicht li:nth-child(4){animation-delay:.45s}}
@keyframes knoten{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.breitbild{aspect-ratio:21/8}
@media (max-width:699px){.breitbild{aspect-ratio:4/3}}
.zweitbild{margin-top:22px}
@media (min-width:900px){.zweitbild{display:none}}
.set .preis{flex-wrap:wrap;row-gap:4px}
@media (min-width:900px){
 .team.nla{display:grid;grid-template-columns:minmax(0,.9fr) 1fr;gap:12px 48px;align-items:center}
 .team.nla{grid-template-rows:1fr auto auto auto auto 1fr}
 .team.nla .nlabild{grid-row:1/7;aspect-ratio:3/4}
 .team.nla>.liga{grid-row:2;grid-column:2}.team.nla>h3{grid-row:3;grid-column:2}.team.nla>p{grid-row:4;grid-column:2}.team.nla>.knoepfe{grid-row:5;grid-column:2;margin-top:6px}
 .team.nla .nlabild img{object-position:50% 30%}
 .team.nla h3{font-size:clamp(32px,3.2vw,46px);line-height:1}
 .team.nla p{font-size:19px}
}

.buehne .rubrik{color:#fff}
.buehne h1 em,.buehne h2 em{color:var(--ball)}
.buehne::after{background:linear-gradient(90deg,rgba(10,26,17,.62),rgba(10,26,17,.1) 60%),linear-gradient(180deg,rgba(10,26,17,0) 40%,rgba(10,26,17,.8) 92%)}

@media (max-width:389px){.leiste .griff{font-size:13.5px;letter-spacing:.05em;padding:0 28px 0 8px}.leiste .griff::after{width:14px}}
@media (max-width:899px){.menue .rahmenbogen{right:-78vmin;opacity:.45}}

.griff{max-width:100%;text-align:left}
@media (max-width:389px){.knoepfe .griff{font-size:15.5px;letter-spacing:.06em;padding:0 44px 0 18px}}
.dok i{font-size:13px}
p a[href^="mailto"],li a[href^="mailto"]{overflow-wrap:anywhere}