/* Kopf-Layout als Komponenten-Tokens: Kopfzeilenhoehe und Hoehe der mobilen
   Schnellaktionsleiste. Spiegeln --top-h/--quick-h aus tokens.css, damit
   jede Berechnung (Hero, 404, Sticky, Scroll-Offsets) denselben Wert nutzt. */
:root{--head-h:4rem;--quick-h:4.5rem;--head-gap:1.5rem}
/* =====================================================================
   TKS Web · Komponenten  (mobile first · nur min-width · nur Tokens)
   Einheiten: keine px. 1px = 0.0625rem. Media Queries in em (zoomfest),
   Container Queries in rem. px steht hier nur noch als [REF-PX]-Hinweis.
   sm 37.5em [REF-PX 600] · quick 48em [768] · md 48.75em [780]
   lg 61.25em [980] · xl 68.75em [1100] · 2xl 75em [1200]
   ===================================================================== */
/* ---------- Basis ---------- */
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head-h) + var(--head-gap))}
/* Lange Woerter, Adressen und Titel duerfen umbrechen - sonst schiebt ein
   einziges Wort auf schmalen Geraeten die ganze Seite zur Seite. */
h1,h2,h3,h4,p,li,dd,dt,figcaption,label,summary{overflow-wrap:break-word}
/* Lange Komposita wie "Trainingszeiten" sollen mit Trennstrich umbrechen
   statt mitten im Wort. Die Sprache steht am <html>-Element. */
h1,h2,h3,h4,.h1,.h2,.h3{hyphens:auto;-webkit-hyphens:auto}
/* Eingabefelder und Auswahllisten sind von Haus aus so breit wie ihr
   laengster Inhalt und sprengen sonst schmale Raster. */
input,select,textarea,button{max-width:100%;min-width:0}
body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;transition:background var(--dur),color var(--dur);padding-bottom:var(--quick-h)}
@media(min-width:48em){body{padding-bottom:0}}
a{color:var(--red-t);text-decoration:none}a:hover{color:var(--red-d)}
:root[data-theme="dark"] a:hover{color:var(--tks-red-200)}
:focus-visible{outline:.1875rem solid var(--red);outline-offset:.125rem}
/* Der globale Ring gilt auch fuer Filter-Pillen, Terminzeilen, Jahres- und
   Inhaltslinks. Explizit festgehalten (und ueber die Nachbarn gehoben),
   damit Hover-Verschiebungen oder Rahmen ihn nicht anschneiden. */
.chip:focus-visible,a.term:focus-visible,.toc a:focus-visible,.years a:focus-visible,.pager a:focus-visible,.faq summary:focus-visible,.socials a:focus-visible{outline:.1875rem solid var(--red);outline-offset:.125rem;position:relative;z-index:1}
img,svg,video{display:block;max-width:100%}
h1,h2,h3,h4{font-weight:var(--fw-bold);letter-spacing:0;line-height:var(--lh-head);text-wrap:balance}
p,li{text-wrap:pretty}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gutter)}
.wrap.narrow{max-width:calc(var(--max-prose) + 2 * var(--gutter))}
.skip{position:absolute;left:-62.4375rem;top:.5rem;z-index:var(--z-skip);background:var(--red);color:var(--on-red);padding:.625rem 1rem}.skip:focus{left:.5rem}
/* ---------- Typo-Rollen ---------- */
.kick{font-size:var(--fs-kicker);font-weight:var(--fw-black);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--mute)}
.kick.red,.red{color:var(--red-t)}
.dot6{display:inline-block;width:.375rem;height:.375rem;background:var(--red);flex:none}
.h1{font-size:var(--fs-h1);letter-spacing:var(--ls-h1);line-height:.95;max-width:var(--measure-h1)}
.h2{font-size:var(--fs-h2);letter-spacing:var(--ls-h2);max-width:var(--measure-h2)}
.h3{font-size:var(--fs-h3);letter-spacing:var(--ls-h3);line-height:1.15}
.lede{font-size:var(--fs-lede);line-height:1.55;color:var(--mute);max-width:var(--measure-lede)}
.prose p,.prose li{max-width:var(--measure-body);color:var(--mute)}.prose p+p{margin-top:1em}.prose strong{color:var(--fg);font-weight:var(--fw-bold)}
.initial p:first-child::first-letter{float:left;font-size:4.4em;line-height:.8;font-weight:var(--fw-black);color:var(--red-t);margin:.06em .1em 0 0}
.mt16{margin-top:var(--s-4)}.mb32{margin-bottom:var(--s-8)}.mt32{margin-top:var(--s-8)}.mt48{margin-top:var(--s-12)}
.row-acts{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}
/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.625rem;min-height:var(--hit);padding:.875rem 1.5rem;font:inherit;font-size:var(--fs-btn);font-weight:var(--fw-black);letter-spacing:.13em;text-transform:uppercase;color:var(--on-red);background:var(--red);border:.0625rem solid var(--red);border-radius:var(--shape-field);cursor:pointer;transition:background var(--dur-fast),border-color var(--dur-fast),transform .1s;white-space:nowrap}
.btn:hover{background:var(--red-d);border-color:var(--red-d);color:var(--on-red)}
.btn:active{transform:translateY(.0625rem)}
.btn .arr{transition:transform var(--dur-fast) var(--ease)}.btn:hover .arr{transform:translateX(var(--nudge))}
.btn-ghost{background:transparent;color:var(--fg);border-color:var(--ghost)}
.btn-ghost:hover{background:transparent;border-color:var(--fg);color:var(--fg)}
.btn-sm{min-height:var(--hit);padding:.5625rem 1rem}
.btn-block{width:100%;justify-content:center}
.btn[disabled]{opacity:.4;cursor:not-allowed}
.link-arr{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--fs-btn);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--red-t)}
.link-arr::after{content:"→";transition:transform var(--dur-fast) var(--ease)}
.link-arr:hover::after,a:hover .link-arr::after{transform:translateX(var(--nudge))}
/* Tippflaechen auf Beruehrgeraeten: Der Leitfaden verlangt mindestens 3rem.
   Die schmalen Textlinks bekommen echte Hoehe; dafuer ruecken die Listen enger
   zusammen, damit die Fusszeile nicht auseinanderfaellt. */
@media(hover:none){
  .link-arr,.fz-links a,.crumb a,.fz-recht a,.fz-seite address a,.partners a,.toc a,.brand,.info a{
    min-height:var(--hit);display:inline-flex;align-items:center;
  }
  .fz-links ul{gap:0}
  .fz-recht{gap:.25rem 1rem}
  .crumb{gap:.25rem .625rem}
}

.link-arr.ext::after{content:"↗"}
/* ---------- Pills & Chips ---------- */
.pill{display:inline-flex;align-items:center;gap:.375rem;font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;padding:.3125rem .5625rem;border-radius:var(--shape-pill);background:var(--sunk);color:var(--mute);line-height:1.2}
.pill.red{background:var(--red);color:var(--on-red)}
.pill.line{background:transparent;border:.0625rem solid var(--red-t);color:var(--red-t)}
.pill.ok::before{content:"";width:.375rem;height:.375rem;background:var(--green)}
.pill.todo{background:transparent;border:.0625rem dashed var(--warn-t);color:var(--warn-t)}
.pill.bronze{background:var(--bronze);color:var(--tks-white)}
.chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.chip{font:inherit;font-size:.75rem;font-weight:var(--fw-bold);padding:.625rem 1rem;border-radius:var(--shape-chip);background:var(--sunk);color:var(--mute);border:0;cursor:pointer;min-height:var(--hit);display:inline-flex;align-items:center;gap:.5rem}
.chip:hover{color:var(--fg)}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.chip i{width:.5rem;height:.5rem;display:block}
.missing{color:var(--warn-t);font-weight:var(--fw-bold)}
/* ---------- Kopfzeile ---------- */
.top{position:sticky;top:0;z-index:var(--z-top);height:var(--head-h);background:var(--nav);backdrop-filter:blur(.875rem) saturate(140%);-webkit-backdrop-filter:blur(.875rem) saturate(140%);border-bottom:.0625rem solid var(--rule)}
.top .wrap{height:100%;display:flex;align-items:center;gap:var(--s-6)}
.brand{display:flex;align-items:center;gap:var(--s-3);color:var(--fg);flex:none;min-width:0}
.brand:hover{color:var(--fg)}
.brand img{width:2.25rem;height:2.25rem;object-fit:contain}
.lg-d{display:none}:root[data-theme="dark"] .lg-l{display:none}:root[data-theme="dark"] .lg-d{display:block}
.brand b{display:block;font-size:.875rem;font-weight:var(--fw-black);letter-spacing:0;line-height:1.1}
.brand small{display:block;font-size:.625rem;font-weight:var(--fw-bold);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.nav{display:none}
.top-act{display:flex;align-items:center;gap:.625rem;margin-left:auto}
.top-act>.btn{display:none}
.ic-btn{width:3rem;height:3rem;display:grid;place-items:center;background:var(--card);border:0;border-radius:var(--shape-field);box-shadow:var(--sh);cursor:pointer;color:var(--fg);flex:none}
.ic-btn svg{width:1.125rem;height:1.125rem;stroke:currentColor;fill:none;stroke-width:1.7}
.ic-btn .sun{display:none}:root[data-theme="dark"] .ic-btn .sun{display:block}:root[data-theme="dark"] .ic-btn .moon{display:none}
.mnav{display:flex;position:fixed;inset:var(--head-h) 0 0;z-index:var(--z-menu);background:var(--bg);flex-direction:column;padding:var(--s-6) var(--gutter) 7.5rem;overflow:auto;transform:translateY(-.5rem);opacity:0;visibility:hidden;transition:var(--dur)}
body.menu-open{overflow:hidden}
body.menu-open .mnav{opacity:1;visibility:visible;transform:none}
.mnav a{display:flex;justify-content:space-between;align-items:baseline;padding:1rem 0;border-bottom:.0625rem solid var(--rule);font-size:1.5rem;font-weight:var(--fw-bold);letter-spacing:0;color:var(--fg)}
.mnav a[aria-current="page"]{color:var(--red-t)}
.mnav a small{font-size:.75rem;font-weight:var(--fw-bold);color:var(--faint);letter-spacing:.1em}
.mnav .sub a{font-size:1.0625rem;padding:.75rem 0 .75rem 1rem;font-weight:var(--fw-semi)}
@media(min-width:61.25em){
.nav{display:flex;gap:1.125rem;margin-left:auto;align-items:center}
.top-act{margin-left:0}.top-act>.btn{display:inline-flex}.burger,.mnav{display:none}
.nav>a,.nav>.dd>button{font:inherit;background:none;border:0;cursor:pointer;font-size:.71875rem;font-weight:var(--fw-bold);letter-spacing:.0625rem;text-transform:uppercase;color:var(--fg);padding:1.375rem 0;border-bottom:.0625rem solid transparent;display:flex;align-items:center;gap:.375rem}
.nav>a:hover,.nav>.dd>button:hover{color:var(--red-t)}
.nav>a[aria-current="page"],.nav>.dd.cur>button{border-bottom-color:var(--red)}}
@media(min-width:68.75em){.nav{gap:1.625rem}.nav>a,.nav>.dd>button{font-size:var(--fs-kicker);letter-spacing:var(--ls-nav)}}
.dd{position:static}
.dd>button svg{transition:transform .2s}
.mega{position:absolute;top:100%;left:50%;transform:translate(-50%,.5rem);width:min(55rem,90vw);background:var(--card);box-shadow:var(--shHi);border-radius:var(--shape-sheet);padding:var(--s-6);display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--s-6);opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility .18s}
.dd:hover .mega,.dd:focus-within .mega,.dd.open .mega{opacity:1;visibility:visible;transform:translate(-50%,0)}
.dd:hover>button svg,.dd.open>button svg{transform:rotate(180deg)}
.mega-g{display:grid;grid-template-columns:1fr 1fr;gap:.0625rem;background:var(--rule)}
.mega-g a{background:var(--card);padding:1rem;display:flex;flex-direction:column;gap:.125rem;color:var(--fg)}
.mega-g a:hover{background:var(--sunk)}
.mega-g i{font-style:normal;font-size:.6875rem;font-weight:var(--fw-black);color:var(--faint);letter-spacing:.1em}
.mega-g b{font-size:1rem;color:var(--red-t)}
.mega-g span{font-size:.8125rem;color:var(--mute)}
.mega ul{list-style:none;display:flex;flex-direction:column;gap:.625rem;margin-top:.75rem}
.mega ul a{color:var(--fg);font-size:.875rem;font-weight:var(--fw-semi)}.mega ul a:hover{color:var(--red-t)}
.mega-pt{background:var(--inv);color:var(--invfg);border-radius:var(--shape-card);padding:1.25rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;min-height:10.625rem}
.mega-pt:hover{color:var(--invfg)}
.mega-pt .kick,.on-inv .kick{color:var(--on-inv-kick)}
.mega-pt b{font-size:1.375rem;letter-spacing:0;line-height:1.1}
/* ---------- Schnellaktionsleiste (mobil) ---------- */
.quick{display:grid;grid-template-columns:1fr 1.4fr;gap:.5rem;position:fixed;left:0;right:0;bottom:0;z-index:var(--z-quick);padding:.5rem .75rem calc(.5rem + env(safe-area-inset-bottom));background:var(--nav);backdrop-filter:blur(.875rem);-webkit-backdrop-filter:blur(.875rem);border-top:.0625rem solid var(--rule)}
.quick .btn{min-height:var(--hit);justify-content:center;min-width:0;padding-inline:clamp(.5rem,3.5vw,1.5rem);letter-spacing:.09em}
@media(min-width:48em){.quick{display:none}}
/* Beim Runterscrollen weg, beim Hochscrollen wieder da – wie die Leiste in der App */
.quick{transition:transform var(--dur) var(--ease)}
.quick.weg{transform:translateY(calc(100% + .0625rem))}
.quick-ico{width:1.125rem;height:1.125rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.8}
@media(prefers-reduced-motion:reduce){.quick{transition:none}}
/* ---------- Sektionen ---------- */
.sec{padding-block:var(--section)}
.sec.tight{padding-top:0}
.sec.first{padding-top:var(--s-16)}
.sec.sunk{background:var(--sunk)}
/* Eigenstaendiger Sektionskopf: gleicher Abstand zum Inhalt wie ein Kopf innerhalb eines Bausteins (sec-head margin) */
.sec.kopf{padding-bottom:0}
.sec.kopf+.sec{padding-top:0}
.sec.kopf+.sec.sunk{padding-top:var(--s-10)}
.sec.kopf.sunk+.sec.sunk{padding-top:0}
.sec.muster{padding-block:var(--s-16) var(--s-6)}
.sec.muster .sec-head{margin-bottom:0}
.sec.muster .kick:first-child{color:var(--red-t)}
.sec.muster+.sec:not(.sunk){padding-top:0}
.sec-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--s-3) var(--s-6);padding-bottom:var(--s-4);border-bottom:.0625rem solid var(--rule);margin-bottom:var(--s-10)}
.sec-intro{display:grid;gap:var(--s-6);margin-bottom:var(--s-12)}
@media(min-width:61.25em){.sec-intro{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--s-16);align-items:end}}
.card{background:var(--card);border-radius:var(--shape-card);box-shadow:var(--sh)}
.lift{transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.lift:hover{transform:translateY(var(--lift));box-shadow:var(--shHi)}
.media{position:relative;overflow:hidden;background:var(--sunk);border-radius:var(--shape-card)}
.media image-slot,.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.r43{aspect-ratio:4/3}.r169{aspect-ratio:16/9}.r45{aspect-ratio:4/5}.r916{aspect-ratio:9/16}.r11{aspect-ratio:1}.r32{aspect-ratio:3/2}
.split{display:grid;gap:var(--s-10)}
@media(min-width:61.25em){.split{grid-template-columns:15rem minmax(0,1fr);gap:var(--s-20)}.split.wide{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.two-col{display:grid;gap:var(--s-12)}
@media(min-width:61.25em){.two-col{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-16)}.two-col.form-l{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}
.sticky{position:static}
@media(min-width:61.25em){.sticky{position:sticky;top:calc(var(--head-h) + var(--head-gap))}}
.sig{display:flex;align-items:center;gap:.875rem;margin-top:var(--s-8);padding-top:var(--s-5);border-top:.0625rem solid var(--rule)}
.sig b{display:block;font-size:.9375rem}.sig span{font-size:.8125rem;color:var(--mute)}
/* ---------- Seitenkopf ---------- */
.phead{padding-block:var(--s-16) var(--s-12);border-bottom:.0625rem solid var(--rule)}
@media(min-width:61.25em){.phead{padding-block:7rem var(--s-16)}}
.phead .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:1.75rem}
@media(min-width:61.25em){.phead .wrap{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--s-12);align-items:end}}
.phead .lede{border-top:.0625rem solid var(--rule);padding-top:1.125rem}
.crumb{display:flex;flex-wrap:wrap;gap:.625rem;align-items:center;margin-bottom:1.375rem}
.crumb a{color:var(--mute)}.crumb a:hover{color:var(--fg)}
.crumb .sep{color:var(--faint);font-size:.75rem}
/* ---------- Laufband ---------- */
.marquee{border-block:.0625rem solid var(--rule);overflow:hidden;padding-block:1.125rem;background:var(--bg)}
.marquee-in{display:flex;width:max-content;animation:mq 40s linear infinite}
.marquee-in span{display:flex;align-items:center;gap:.875rem;padding-right:var(--s-12);font-size:.8125rem;font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;white-space:nowrap}
.marquee-in span::before{content:"";width:.375rem;height:.375rem;background:var(--red)}
@keyframes mq{to{transform:translateX(-50%)}}
/* ---------- Angebotskarten ---------- */
.offers{display:grid;gap:var(--s-6);container-type:inline-size;container-name:offers}
@media(min-width:48.75em){.offers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:68.75em){.offers{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Container Queries: Schwellen bewusst in rem und zahlengleich zu den
   Media-Query-Breakpoints. Ein Raster ist immer schmaler als der Viewport
   (Seitenrand), die @container-Regel greift also nie frueher als die
   @media-Regel -> heutiges Bild unveraendert, schmale Einbauorte spaeter ok. */
@container offers (min-width:48.75rem){.offers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container offers (min-width:68.75rem){.offers{grid-template-columns:repeat(4,minmax(0,1fr))}}
.offer{display:flex;flex-direction:column;color:var(--fg);overflow:hidden}
.offer:hover{color:var(--fg)}
.offer .media{border-radius:0}
.offer .num{position:absolute;left:1.125rem;bottom:.625rem;font-size:4rem;font-weight:var(--fw-black);letter-spacing:0;color:var(--on-media);line-height:1;text-shadow:0 .125rem .875rem var(--shadow-media);pointer-events:none}
.offer .age{position:absolute;top:.875rem;right:.875rem;pointer-events:none}
.offer-b{padding:var(--s-6);display:flex;flex-direction:column;gap:var(--s-3);flex:1}
.offer-b p{font-size:.9375rem;color:var(--mute)}
.kv{display:grid;grid-template-columns:5rem 1fr;gap:.375rem .75rem;font-size:.875rem;padding-block:.875rem;border-top:.0625rem solid var(--rule);margin-top:auto}
.kv dt{font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--faint);padding-top:.1875rem}
.kv dd{font-weight:var(--fw-semi)}
/* ---------- Bewertungen ---------- */
.reviews{display:grid;gap:var(--s-6);container-type:inline-size;container-name:reviews}
@media(min-width:48.75em){.reviews{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:68.75em){.reviews{grid-template-columns:12.5rem repeat(3,minmax(0,1fr))}}
@container reviews (min-width:48.75rem){.reviews{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container reviews (min-width:68.75rem){.reviews{grid-template-columns:12.5rem repeat(3,minmax(0,1fr))}}
.rbadge{background:var(--inv);color:var(--invfg);border-radius:var(--shape-card);padding:var(--s-6);display:flex;flex-direction:column;justify-content:space-between;gap:1rem;box-shadow:var(--shHi)}
.rbadge .big{font-size:3.5rem;font-weight:var(--fw-black);letter-spacing:0;line-height:1}
.stars{display:flex;gap:.1875rem}.stars i{width:.75rem;height:.75rem;background:var(--red);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.rbadge .kick{color:var(--on-inv-kick)}
.rbadge small{font-size:.75rem;color:var(--on-inv-kick)}
.rev{padding:var(--s-6);display:flex;flex-direction:column;gap:1rem}
.rev q{font-size:1rem;line-height:1.55;quotes:"„" "“"}
.rev q.ph{color:var(--faint);font-style:italic}
.rev footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-size:.8125rem;font-weight:var(--fw-bold)}
/* ---------- News ---------- */
.news-grid{display:grid;gap:var(--s-6);container-type:inline-size;container-name:news}
@media(min-width:48.75em){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:68.75em){.news-grid{grid-template-columns:2fr 1fr 1fr}.news-grid>.lead{grid-row:span 2}.news.w2{grid-column:span 2}}
@container news (min-width:48.75rem){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container news (min-width:68.75rem){.news-grid{grid-template-columns:2fr 1fr 1fr}.news-grid>.lead{grid-row:span 2}.news.w2{grid-column:span 2}}
.news{display:flex;flex-direction:column;color:var(--fg);overflow:hidden}
.news:hover{color:var(--fg)}
.news[hidden]{display:none}
.news .media{border-radius:0}
.news-b{padding:1.25rem 1.375rem 1.5rem;display:flex;flex-direction:column;gap:.625rem;flex:1}
.meta{font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--faint)}
.mt-line{display:flex;flex-wrap:wrap;gap:.625rem;align-items:center;font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--faint)}
.news .mt{display:flex;gap:.625rem;align-items:center;font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--faint)}
.news .mt .cat,.mt-line .cat{color:var(--red-t)}
.news h3{font-size:1.1875rem;letter-spacing:0;line-height:1.2}
.news p{font-size:.90625rem;color:var(--mute)}
.news.lead h3{font-size:clamp(1.5rem,2.4vw,2.125rem)}
.news.lead .news-b{padding:1.75rem 1.875rem 2rem}
.news .link-arr{margin-top:auto;padding-top:.5rem}
/* ---------- Terminliste ---------- */
.terms{border-top:.0625rem solid var(--rule)}
.term{display:grid;grid-template-columns:4rem minmax(0,1fr);gap:var(--s-4) var(--s-5);align-items:center;padding:1.375rem 0;border-bottom:.0625rem solid var(--rule);color:var(--fg);}
.term .link-arr{grid-column:2}
@media(min-width:37.5em){.term{grid-template-columns:5rem minmax(0,1fr) auto}.term .link-arr{grid-column:auto}}
a.term:hover{color:var(--fg)}
.term .d{display:flex;flex-direction:column;line-height:1}
.term .d b{font-size:2.25rem;font-weight:var(--fw-black);letter-spacing:0;font-variant-numeric:tabular-nums}
.term .d span{font-size:.6875rem;font-weight:var(--fw-black);letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin-top:.375rem}
.term h3{font-size:var(--fs-row);letter-spacing:0}
.term .m{font-size:.875rem;color:var(--mute);margin-top:.25rem}
.term .k{display:flex;gap:.5rem;margin-bottom:.375rem}
.term.feed{opacity:.85}
.cal-note{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between;margin-top:var(--s-8);padding:1.25rem 1.5rem}
.cal-note p{font-size:.90625rem;color:var(--mute);max-width:60ch}
/* ---------- App-Teaser ---------- */
.app-t{display:grid;gap:var(--s-12);align-items:center}
@media(min-width:61.25em){.app-t{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--s-20)}}
.app-feat{list-style:none;display:grid;gap:.0625rem;background:var(--rule);margin:var(--s-8) 0;border-block:.0625rem solid var(--rule)}
.app-feat li{background:var(--sunk);padding:1.125rem 0;display:flex;flex-direction:column;gap:.125rem}
@media(min-width:37.5em){.app-feat{grid-template-columns:1fr 1fr}.app-feat li:nth-child(even){padding-left:1.125rem}}
.app-feat b{font-size:1rem}.app-feat span{font-size:.875rem;color:var(--mute)}
.stores{display:flex;flex-wrap:wrap;gap:.625rem;align-items:center}
.store{display:flex;align-items:center;gap:.625rem;min-height:var(--hit);padding:.5rem 1rem;background:var(--fg);color:var(--bg);border-radius:var(--shape-field);font-size:.8125rem;font-weight:var(--fw-bold);line-height:1.1}
.store:hover{color:var(--bg);opacity:.88}
.store small{display:block;font-size:.625rem;font-weight:var(--fw-semi);opacity:.7}
.store svg{width:1.25rem;height:1.25rem;fill:currentColor}
.phone{max-width:20rem;width:100%;margin-inline:auto;padding:.625rem;background:var(--phone-frame);border-radius:2.75rem;box-shadow:var(--shHi)}
.phone .media{border-radius:2.1875rem}
.award{display:flex;gap:1rem;align-items:center;padding:1rem 1.25rem;margin-top:var(--s-6)}
.award b{display:block;font-size:.9375rem}.award span{font-size:.8125rem;color:var(--mute)}
.award .medal{width:2.5rem;height:2.5rem;flex:none;border-radius:var(--shape-dialog);background:var(--bronze);display:grid;place-items:center;color:var(--tks-white);font-weight:var(--fw-black);font-size:.75rem}
/* ---------- Zitat ---------- */
.quote{padding-block:var(--section);background:var(--sunk)}
.quote blockquote{font-size:var(--fs-quote);font-weight:var(--fw-medium);letter-spacing:0;line-height:1.15;max-width:var(--measure-quote);text-wrap:balance}
.quote blockquote::before{content:"„";color:var(--red-t);font-weight:var(--fw-black);margin-right:.05em}
.quote cite{display:block;margin-top:1.75rem;font-style:normal}
/* ---------- Stundenplan ---------- */
.filters{display:grid;gap:.875rem;margin-bottom:var(--s-8)}
.filters.card{padding:var(--s-5)}
.filters .row{display:flex;flex-direction:column;align-items:flex-start;gap:.625rem}
@media(min-width:37.5em){.filters .row{flex-direction:row;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}.filters .row>.kick{width:5.625rem;flex:none}}
.tl{border-top:.0625rem solid var(--rule)}
.tl-day{display:grid;grid-template-columns:1fr;gap:var(--s-3);padding:1.25rem 0;border-bottom:.0625rem solid var(--rule)}
@media(min-width:37.5em){.tl-day{grid-template-columns:8.25rem minmax(0,1fr);gap:var(--s-6);min-height:5.5rem}}
.tl-day[hidden]{display:none}
.tl-day>div:first-child b{display:block;font-size:1.375rem;font-weight:var(--fw-black);letter-spacing:0}
.tl-day>div:first-child span{font-size:.8125rem;color:var(--mute)}
.tl-pills{display:flex;flex-wrap:wrap;gap:.625rem;align-content:start}
.tl-pill{position:relative;background:var(--card);box-shadow:var(--sh);border-radius:var(--shape-field);padding:.75rem 1rem .75rem 1.1875rem;display:flex;flex-direction:column;gap:.125rem;flex:1 1 13.75rem}
@media(min-width:37.5em){.tl-pill{max-width:21.25rem}}
.tl-pill::before{ /* Gruppen-/Gürtelfarbe wie in der App – bewusst, kein Schmuck */content:"";position:absolute;left:0;top:0;bottom:0;width:.1875rem;background:var(--c,var(--g-alle))}
.tl-pill .t{font-size:.8125rem;font-weight:var(--fw-black);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.tl-pill b{font-size:1rem;font-weight:var(--fw-semi);letter-spacing:0;line-height:1.25}
.tl-pill span{font-size:.8125rem;color:var(--mute);line-height:1.35}
.tl-pill em{font-style:normal;margin-top:.375rem}
.tl-empty{font-size:.875rem;color:var(--faint);align-self:center}
.legend{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:1.25rem;font-size:.8125rem;color:var(--mute)}
.legend span{display:flex;gap:.5rem;align-items:center}.legend span[hidden]{display:none}.legend i{width:.875rem;height:.1875rem;display:block}
.notice{padding:var(--s-6);display:grid;gap:.625rem}
.notice p{font-size:.9375rem;color:var(--mute)}
.notice.inv{background:var(--inv);color:var(--invfg)}.notice.inv p{color:var(--on-inv-text)}
.notice.warn{box-shadow:inset 0 0 0 .0625rem var(--warn),var(--sh)}
.notice.warn .kick{color:var(--warn-t)}
/* Kicker im invertierten Hinweis: Rot-300 traegt auf --inv in beiden Modi. */
.notice.inv .kick{color:var(--red-on-inv)}
/* ---------- Standorte ---------- */
.locs{display:grid;gap:var(--s-6)}
@media(min-width:48.75em){.locs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.loc{padding:var(--s-6);display:flex;flex-direction:column;gap:.875rem}
.loc h3{font-size:1.375rem}
.loc ul{list-style:none;display:flex;flex-direction:column;gap:.625rem;font-size:.875rem}
.loc li{display:flex;flex-direction:column;padding-top:.625rem;border-top:.0625rem solid var(--rule)}
.loc li b{font-weight:var(--fw-bold)}.loc li span{color:var(--mute)}
.loc p{font-size:.9375rem;color:var(--mute)}
.loc .link-arr{margin-top:auto}
/* ---------- Trio / Zahlen / Säulen ---------- */
.trio{display:grid;gap:.0625rem;background:var(--rule);border-block:.0625rem solid var(--rule);container-type:inline-size;container-name:trio}
.trio>div{background:var(--bg);padding:var(--s-8) 0;display:flex;flex-direction:column;gap:var(--s-3)}
@media(min-width:48.75em){.trio{grid-template-columns:repeat(3,minmax(0,1fr))}.trio>div{padding-right:var(--s-8)}.trio>div+div{padding-left:var(--s-8)}}
@container trio (min-width:48.75rem){.trio{grid-template-columns:repeat(3,minmax(0,1fr))}.trio>div{padding-right:var(--s-8)}.trio>div+div{padding-left:var(--s-8)}}
.sec.sunk .trio>div,.sec.sunk .stats>div,.sec.sunk .coach{background:var(--sunk)}
.trio .n{font-size:.8125rem;font-weight:var(--fw-black);color:var(--red-t);letter-spacing:.1em}
.trio p{color:var(--mute);font-size:.9375rem}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.0625rem;background:var(--rule);border-block:.0625rem solid var(--rule)}
@media(min-width:48.75em){.stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.stats>div{background:var(--bg);padding:1.75rem var(--s-4) 1.75rem 0}
.stats>div:nth-child(even){padding-left:var(--s-4)}
@media(min-width:48.75em){.stats>div+div{padding-left:var(--s-6)}}
.stats b{display:block;font-size:var(--fs-stat);font-weight:var(--fw-black);letter-spacing:0;line-height:1;font-variant-numeric:tabular-nums}
.stats span{font-size:.875rem;color:var(--mute)}
.pillars{border-top:.0625rem solid var(--rule);container-type:inline-size;container-name:pillars}
.pillar{display:grid;grid-template-columns:2.75rem minmax(0,1fr);gap:.375rem var(--s-4);padding:var(--s-6) 0;border-bottom:.0625rem solid var(--rule);}
.pillar>span{font-size:.875rem;font-weight:var(--fw-black);color:var(--red-t);letter-spacing:.06em;padding-top:.25rem}
.pillar h3{font-size:var(--fs-h3);letter-spacing:var(--ls-h3)}
.pillar p{grid-column:2;color:var(--mute);max-width:var(--measure-body)}
@media(min-width:48.75em){.pillar{grid-template-columns:4rem minmax(0,1.1fr) minmax(0,2fr);gap:var(--s-6)}.pillar p{grid-column:auto}}
@container pillars (min-width:48.75rem){.pillar{grid-template-columns:4rem minmax(0,1.1fr) minmax(0,2fr);gap:var(--s-6)}.pillar p{grid-column:auto}}
.checklist{list-style:none;display:grid;gap:.0625rem;background:var(--rule);border-block:.0625rem solid var(--rule)}
.checklist li{background:var(--bg);padding:1rem 0 1rem 1.625rem;position:relative;font-weight:var(--fw-semi)}
.checklist li::before{content:"";position:absolute;left:0;top:1.35em;width:.5rem;height:.5rem;background:var(--red)}
.checklist li span{display:block;font-weight:var(--fw-regular);font-size:.875rem;color:var(--mute)}
@media(min-width:48.75em){.checklist.cols{grid-template-columns:1fr 1fr}.checklist.cols li:nth-child(even){padding-left:calc(1.625rem + var(--s-6))}.checklist.cols li:nth-child(even)::before{left:var(--s-6)}}
.sec.sunk .checklist li{background:var(--sunk)}
/* ---------- Feature (Bild/Text) ---------- */
.feature{display:grid;gap:var(--s-8);align-items:center}
@media(min-width:61.25em){.feature{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-16)}.feature.rev>.media{order:2}}
.feature+.feature{margin-top:var(--section)}
/* ---------- Galerie ---------- */
.gallery{display:grid;gap:var(--s-3);grid-template-columns:repeat(2,minmax(0,1fr))}
.gallery>:first-child{grid-column:span 2}
@media(min-width:48.75em){.gallery{grid-template-columns:2fr 1fr 1fr;gap:var(--s-4)}.gallery>:first-child{grid-column:auto;grid-row:span 2}.gallery>:first-child.media{aspect-ratio:auto}}
/* ---------- Trainer ---------- */
.coaches{display:grid;gap:.0625rem;background:var(--rule);border:.0625rem solid var(--rule)}
@media(min-width:37.5em){.coaches{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:61.25em){.coaches{grid-template-columns:repeat(4,minmax(0,1fr))}}
.coaches.c3{}@media(min-width:61.25em){.coaches.c3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.coach{background:var(--bg);padding:1.25rem;display:flex;flex-direction:column;gap:var(--s-3)}
.coach .g{font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--red-t)}
.coach h3{font-size:1.1875rem;letter-spacing:0}
.coach p{font-size:.84375rem;color:var(--mute);line-height:1.45}
.belt{display:inline-block;width:1.75rem;height:.375rem;border-radius:0 .125rem 0 .125rem;vertical-align:middle;margin-right:.5rem}
/* ---------- Zeitleiste ---------- */
.hist{border-left:.0625rem solid var(--rule);margin-left:.375rem;display:flex;flex-direction:column;gap:1.75rem}
.hist>div{position:relative;padding-left:1.75rem}
.hist>div::before{content:"";position:absolute;left:-.25rem;top:.45em;width:.4375rem;height:.4375rem;background:var(--red)}
.hist b{font-size:.8125rem;font-weight:var(--fw-black);letter-spacing:.1em;color:var(--red-t)}
.hist h3{font-size:1.1875rem;margin:.25rem 0}
.hist p{font-size:.9375rem;color:var(--mute);max-width:52ch}
/* ---------- Schritte ---------- */
.steps{border-top:.0625rem solid var(--rule)}
.step{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:var(--s-4);padding:1.375rem 0;border-bottom:.0625rem solid var(--rule)}
@media(min-width:37.5em){.step{grid-template-columns:3.75rem minmax(0,1fr)}}
.step>span{font-size:.875rem;font-weight:var(--fw-black);color:var(--red-t);letter-spacing:.06em;padding-top:.1875rem}
.step b{display:block;font-size:1.1875rem;letter-spacing:0;margin-bottom:.25rem}
.step p{color:var(--mute);font-size:.9375rem}
/* ---------- Preise / Programm ---------- */
.prices{display:grid;gap:.0625rem;background:var(--rule);border-block:.0625rem solid var(--rule)}
@media(min-width:37.5em){.prices{grid-template-columns:repeat(2,minmax(0,1fr))}}
.prices>div{background:var(--bg);padding:var(--s-6) 0;display:flex;flex-direction:column;gap:.25rem}
@media(min-width:37.5em){.prices>div:nth-child(even){padding-left:var(--s-6)}}
.prices b{font-size:var(--fs-stat);font-weight:var(--fw-black);letter-spacing:0;line-height:1;font-variant-numeric:tabular-nums}
.prices span{font-size:.875rem;color:var(--mute)}
.prices .kick{font-size:.6875rem}
.prog{display:grid;gap:var(--s-4)}
@media(min-width:37.5em){.prog{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:61.25em){.prog{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6)}}
.prog>div{padding:var(--s-6);display:flex;flex-direction:column;gap:var(--s-2)}
.prog .n{font-size:.8125rem;font-weight:var(--fw-black);color:var(--red-t);letter-spacing:.1em}
.prog p{font-size:.9375rem;color:var(--mute)}
/* ---------- Wege (App-Weiche) / Kontaktkarten ---------- */
.paths{display:grid;gap:var(--s-6)}
@media(min-width:48.75em){.paths{grid-template-columns:repeat(2,minmax(0,1fr))}}
.path{padding:var(--pad-card);display:flex;flex-direction:column;gap:var(--s-4)}
.path.inv{background:var(--inv);color:var(--invfg)}
.path.inv p{color:var(--on-inv-mute)}
.path p{color:var(--mute)}
.path .row-acts{margin-top:auto;padding-top:var(--s-2)}
.ccards{display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr)}
@media(min-width:48.75em){.ccards{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6)}}
.ccard{padding:var(--s-6);display:flex;flex-direction:column;gap:.375rem;color:var(--fg)}
a.ccard:hover{color:var(--fg)}
.ccard b{font-size:var(--fs-row);overflow-wrap:anywhere}.ccard b span{white-space:nowrap;font-size:inherit;color:inherit}.ccard span{font-size:.875rem;color:var(--mute)}
.ccard .link-arr{margin-top:var(--s-3)}
/* ---------- Formular ---------- */
.form{padding:var(--pad-card);display:grid;grid-template-columns:minmax(0,1fr);gap:1.125rem}
.form-h{display:flex;flex-direction:column;gap:.375rem;padding-bottom:1.125rem;border-bottom:.0625rem solid var(--rule)}
.form-h h2{font-size:1.625rem}
.form-h p{font-size:.875rem;color:var(--mute)}
.fg{display:grid;gap:.875rem}
@media(min-width:37.5em){.fg.two{grid-template-columns:repeat(2,minmax(0,1fr))}.fg.three{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr)}}
.field{display:flex;flex-direction:column;gap:.4375rem;min-width:0}
.field label,.field legend{font-size:.6875rem;font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.field input,.field select,.field textarea{font:inherit;font-size:1rem;color:var(--fg);background:var(--sunk);border:.0625rem solid var(--field-line);border-radius:var(--shape-field);padding:.8125rem .875rem;min-height:var(--hit);width:100%;transition:border-color var(--dur-fast),background var(--dur-fast)}
.field textarea{min-height:7.5rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--red);background:var(--card)}
.field .hint{font-size:.78125rem;color:var(--faint)}
fieldset.field{border:0}
.seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(5.625rem,1fr));gap:.375rem}
.seg label{position:relative;cursor:pointer}
.seg input{position:absolute;opacity:0}
.seg span{display:flex;align-items:center;justify-content:center;min-height:var(--hit);padding:.5rem;border-radius:var(--shape-chip);background:var(--sunk);font-size:.875rem;font-weight:var(--fw-semi);color:var(--mute);text-align:center;line-height:1.2}
.seg input:checked+span{background:var(--fg);color:var(--bg)}
.seg input:focus-visible+span{outline:.1875rem solid var(--red);outline-offset:.125rem}
.consent{display:flex;gap:.75rem;align-items:flex-start;font-size:.84375rem;color:var(--mute);line-height:1.5;cursor:pointer}
.consent input{width:1.25rem;height:1.25rem;accent-color:var(--red);flex:none;margin-top:.0625rem}
.hp{position:absolute;left:-624.9375rem}
.ok-msg{display:none;padding:.875rem 1rem;background:var(--sunk);border-radius:var(--shape-field);font-size:.875rem;font-weight:var(--fw-semi)}
.form.sent .ok-msg{display:block}
/* Mehrschritt-Formular */
.stepbar{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.25rem;counter-reset:s}
.stepbar li{display:flex;flex-direction:column;gap:.375rem;font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);counter-increment:s}
.stepbar li::before{content:"";height:.1875rem;background:var(--rule-s)}
.stepbar li span{display:none}
.stepbar li::after{content:counter(s,decimal-leading-zero)}
@media(min-width:37.5em){.stepbar li::after{content:none}.stepbar li span{display:block}}
.stepbar li.on{color:var(--fg)}.stepbar li.on::before{background:var(--red)}
.stepbar li.done::before{background:var(--fg)}
.fstep{display:grid;gap:1.125rem}
.fstep[hidden]{display:none}
.fnav{display:flex;justify-content:space-between;gap:var(--s-3);padding-top:1.125rem;border-top:.0625rem solid var(--rule)}
.sigpad{position:relative;background:var(--sunk);border-radius:var(--shape-field);height:10rem;touch-action:none;cursor:crosshair}
.sigpad canvas{width:100%;height:100%;display:block}
.sigpad .ph{position:absolute;left:1rem;bottom:.875rem;right:1rem;border-top:.0625rem solid var(--rule-s);padding-top:.375rem;font-size:.75rem;color:var(--faint);pointer-events:none}
.sigpad button{position:absolute;top:.5rem;right:.5rem}
/* ---------- FAQ ---------- */
.faq{border-top:.0625rem solid var(--rule)}
.faq details{border-bottom:.0625rem solid var(--rule)}
.faq summary{list-style:none;display:flex;justify-content:space-between;gap:var(--s-6);align-items:center;padding:1.375rem 0;cursor:pointer;font-size:var(--fs-row);font-weight:var(--fw-bold);letter-spacing:0;min-height:var(--hit)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.75rem;font-weight:var(--fw-medium);color:var(--red-t);line-height:1;transition:transform .2s var(--ease);flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 0 var(--s-6);max-width:var(--measure-body);color:var(--mute)}
.faq details>div p+p,.faq details>div ul{margin-top:.8em}
.faq details>div ul{padding-left:1.2em}
.faq details>div a{text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:.0625rem}
/* ---------- Kontakt ---------- */
.contact{display:grid;gap:var(--s-12)}
@media(min-width:61.25em){.contact{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:var(--s-16)}}
.info{border-top:.0625rem solid var(--rule)}
.info>div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:var(--s-4);padding:1.125rem 0;border-bottom:.0625rem solid var(--rule)}
@media(min-width:37.5em){.info>div{grid-template-columns:6.25rem minmax(0,1fr)}}
.info .kick{font-size:.6875rem;padding-top:.25rem}
.info b{display:block;font-size:1.0625rem;font-weight:var(--fw-semi)}.info span{display:block;font-size:.875rem;color:var(--mute)}
.info a{color:var(--fg);font-weight:var(--fw-semi);word-break:break-word}.info a:hover{color:var(--red-t)}
.map-card{position:relative;min-height:16.25rem;overflow:hidden}
.map-card .foot{position:absolute;left:1rem;right:1rem;bottom:1rem;display:flex;justify-content:space-between;gap:.75rem;flex-wrap:wrap;align-items:center;padding:.875rem 1rem;pointer-events:none;background:var(--card)}
.map-card .foot a{pointer-events:auto}
/* ---------- CTA-Band ---------- */
.cta{background:var(--inv);color:var(--invfg);padding-block:var(--s-20)}
.cta .kick{color:var(--on-inv-kick)}
:root[data-theme="dark"] .cta{border-block:.0625rem solid var(--rule)}
.cta .wrap{display:grid;gap:var(--s-8);align-items:end}
@media(min-width:61.25em){.cta .wrap{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}.cta .acts{justify-content:flex-end}}
.cta p{color:var(--on-inv-mute);max-width:46ch;margin-top:1rem}
.cta .btn-ghost{color:var(--tks-cream);border-color:var(--on-inv-line)}
.cta .btn-ghost:hover{border-color:var(--tks-cream)}
.cta .acts{display:flex;flex-wrap:wrap;gap:var(--s-3)}
/* ---------- Kinderschutz-Band ---------- */
.ks{display:grid;gap:var(--s-6);padding:var(--pad-card);align-items:center}
@media(min-width:61.25em){.ks{grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s-10)}}
.ks .ico{width:3.5rem;height:3.5rem;border-radius:var(--shape-dialog);background:var(--sunk);display:grid;place-items:center}
.ks .ico svg{width:1.625rem;height:1.625rem;stroke:var(--red-t);fill:none;stroke-width:1.7}
.ks p{color:var(--mute);font-size:.9375rem;max-width:var(--measure-body);margin-top:.375rem}
.ks .acts{display:flex;flex-direction:column;align-items:flex-start;gap:.625rem}
/* ---------- Prosa-Seite (Recht, Kinderschutz, Beitrag) ---------- */
.legal{display:grid;gap:var(--s-10)}
@media(min-width:61.25em){.legal{grid-template-columns:13.75rem minmax(0,1fr);gap:var(--s-16)}}
.toc{display:flex;gap:.375rem;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;margin-inline:calc(-1 * var(--gutter));padding:0 var(--gutter) var(--s-2);scrollbar-width:none}
.toc a{flex:none;font-size:.8125rem;font-weight:var(--fw-bold);min-height:var(--hit);display:flex;align-items:center;padding:.5625rem .875rem;border-radius:var(--shape-chip);background:var(--sunk);color:var(--mute);white-space:nowrap}
.toc a:hover{color:var(--fg)}
@media(min-width:61.25em){.toc{position:sticky;top:calc(var(--head-h) + var(--head-gap));align-self:start;flex-direction:column;margin:0;padding:0;overflow:visible;gap:0;border-top:.0625rem solid var(--rule)}.toc a{background:none;border-radius:0;padding:.75rem 0;border-bottom:.0625rem solid var(--rule);white-space:normal}.toc a:hover{padding-left:.375rem}}
.doc{max-width:var(--measure-body)}
.doc h2{font-size:clamp(1.375rem,1.1875rem + .8vw,1.875rem);letter-spacing:var(--ls-h3);margin:var(--s-16) 0 var(--s-4);scroll-margin-top:calc(var(--head-h) + var(--head-gap))}
.doc>h2:first-child,.doc>section:first-child>h2{margin-top:0}
.doc h3{font-size:var(--fs-row);margin:var(--s-8) 0 var(--s-2)}
.doc p,.doc li{color:var(--mute)}.doc p+p{margin-top:1em}
.doc ul,.doc ol{padding-left:1.2em;margin-top:.8em;display:grid;gap:.375rem}
.doc strong{color:var(--fg)}
.doc a{text-decoration:underline;text-underline-offset:.1875rem}
.doc .info,.doc .notice,.doc .faq{margin-top:var(--s-6)}
.doc figure{margin:var(--s-8) 0}
.doc figcaption{font-size:.8125rem;color:var(--faint);margin-top:var(--s-2)}
.doc blockquote{margin:var(--s-8) 0;padding-left:var(--s-5);border-left:.1875rem solid var(--red);font-size:var(--fs-lede);font-weight:var(--fw-medium);color:var(--fg)}
.art-lead{font-size:var(--fs-lede);color:var(--fg);font-weight:var(--fw-medium);line-height:1.5}
.art-nav{display:grid;gap:var(--s-4);margin-top:var(--s-16)}
@media(min-width:37.5em){.art-nav{grid-template-columns:1fr 1fr}}
.art-nav a{padding:var(--s-5);display:flex;flex-direction:column;gap:.25rem;color:var(--fg)}
.art-nav a:last-child{text-align:right;align-items:flex-end}
.art-nav b{font-size:1rem}
/* ---------- Suche / Archiv ---------- */
.search{position:relative;width:100%;max-width:26.25rem}
.search input{font:inherit;font-size:1rem;width:100%;min-height:var(--hit);padding:.75rem .875rem .75rem 2.75rem;background:var(--sunk);border:.0625rem solid var(--field-line);border-radius:var(--shape-field);color:var(--fg)}
.search input:focus{outline:none;border-color:var(--red);background:var(--card)}
.search svg{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);width:1.125rem;height:1.125rem;stroke:var(--mute);fill:none;stroke-width:1.8}
.years{display:flex;flex-wrap:wrap;gap:.375rem}
.years a{font-size:.8125rem;font-weight:var(--fw-bold);min-height:var(--hit);display:inline-flex;align-items:center;padding:.5rem .75rem;border-radius:var(--shape-chip);background:var(--sunk);color:var(--mute);font-variant-numeric:tabular-nums}
.years a:hover{color:var(--fg)}
.years a.on{background:var(--fg);color:var(--bg)}
.sec.sunk .years a,.sec.sunk .chip,.sec.sunk .search input{background:var(--card)}
.pager{display:flex;flex-wrap:wrap;gap:.375rem;justify-content:center;margin-top:var(--s-12)}
.pager a:not(.btn){min-width:var(--hit);min-height:var(--hit);display:grid;place-items:center;border-radius:var(--shape-field);background:var(--sunk);color:var(--fg);font-weight:var(--fw-bold);font-size:.875rem;padding:0 .75rem}
.sec.sunk .pager a{background:var(--card)}
.pager a.on{background:var(--red);color:var(--on-red)}
.empty{padding:var(--s-12) var(--s-6);text-align:center;color:var(--mute);display:none}
.empty.show{display:block}
/* ---------- Fuß ---------- */
.socials{display:flex;gap:.625rem}
.socials a{width:var(--hit);height:var(--hit);display:grid;place-items:center;background:var(--card);box-shadow:var(--sh);border-radius:50%;color:var(--fg)}
.socials svg{width:1.0625rem;height:1.0625rem;fill:none;stroke:currentColor;stroke-width:1.7}
.partners{display:grid;gap:var(--s-6);padding-block:var(--s-8);border-bottom:.0625rem solid var(--rule)}
@media(min-width:48.75em){.partners{grid-template-columns:repeat(3,minmax(0,1fr))}}
.partners div{display:flex;flex-direction:column;gap:.375rem;font-size:.875rem}
.partners a{color:var(--fg)}
.partners .kick{font-size:var(--fs-micro);margin-bottom:.25rem}
.partners .aw{display:flex;align-items:center;gap:.625rem;font-weight:var(--fw-bold)}
/* ---------- 404 ---------- */
.err{min-height:calc(100svh - var(--head-h) - var(--quick-h));display:grid;align-items:center}
.err .big{font-size:clamp(7.5rem,30vw,20rem);font-weight:var(--fw-black);letter-spacing:0;line-height:.8;color:var(--red-t)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Feldmeldung als Warnung – vom Formular genutzt. */
.hint.warn{color:var(--warn-t)}

/* Baukasten-Musterseiten: Bereichs-Reiter, Inhaltsliste, aufklappbare Bausteine */
.bk-leiste{padding-block:var(--s-10) var(--s-8)}
.bk-reiter{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-8)}
.bk-reiter a{display:inline-flex;align-items:center;min-height:var(--hit);padding:0 var(--s-4);border:.0625rem solid var(--rule);border-radius:var(--r-pill);font-size:var(--fs-small);font-weight:600;color:var(--fg);text-decoration:none}
.bk-reiter a:hover{border-color:var(--red-t)}
.bk-reiter a[aria-current=page]{background:var(--red);border-color:var(--red);color:#fff}
.bk-kopf{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-4);padding-bottom:var(--s-4);border-bottom:.0625rem solid var(--rule)}
.bk-schalter{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.bk-inhalt{list-style:none;margin:var(--s-6) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.bk-inhalt a{display:inline-flex;gap:var(--s-2);align-items:baseline;min-height:var(--hit);align-items:center;padding:0 var(--s-3);background:var(--card);border-radius:var(--r-chip);font-size:var(--fs-small);color:var(--fg);text-decoration:none}
.bk-inhalt a:hover{outline:.0625rem solid var(--red-t)}
.bk-inhalt .red{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85em}
.bk-liste{padding-bottom:var(--section);border-top:.0625rem solid var(--rule)}
.bk{border-bottom:.0625rem solid var(--rule)}
.bk>summary{list-style:none;cursor:pointer}
.bk>summary::-webkit-details-marker{display:none}
.bk-zeile{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:var(--s-3) var(--s-6);padding-block:var(--s-5)}
.bk>summary:hover .bk-titel{color:var(--red-t)}
.bk-nr{font-size:var(--fs-kicker);font-weight:var(--fw-black);color:var(--mute);letter-spacing:var(--ls-kicker)}
.bk-text{display:flex;flex-direction:column;gap:var(--s-1);min-width:0}
.bk-titel{font-size:var(--fs-h3);font-weight:700;line-height:1.2}
.bk-hinweis{font-size:var(--fs-small);color:var(--mute)}
.bk-name{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--fs-small);color:var(--red-t)}
.bk-pfeil{width:.75rem;height:.75rem;border-right:.125rem solid currentColor;border-bottom:.125rem solid currentColor;transform:rotate(45deg) translateY(-25%);transition:transform .2s}
.bk[open] .bk-pfeil{transform:rotate(225deg)}
.bk[open]>summary{border-bottom:.0625rem dashed var(--rule)}
.bk-koerper{padding-bottom:var(--s-8)}
.bk-koerper>.sec:first-child{padding-top:var(--s-12)}
.bk{scroll-margin-top:var(--s-20)}
@media(max-width:40em){.bk-zeile{grid-template-columns:auto minmax(0,1fr) auto}.bk-name{grid-column:2;grid-row:2}}
@media(prefers-reduced-motion:reduce){.bk-pfeil{transition:none}}
.bk-hoch{font-size:var(--fs-small);color:var(--mute)}

/* ---------- Stundenplan: Tag → Ort → Einheiten, Filter nur nach Ort ---------- */
.tl-filter{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-6)}
.tl-filter .chip-ferien{margin-left:auto}
.tl-ferien{margin-bottom:var(--s-6)}
.tl-day{grid-template-columns:8.25rem minmax(0,1fr)}
.tl-orte{display:grid;gap:var(--s-5)}
.tl-ort{display:grid;gap:.625rem}
.tl-ort[hidden]{display:none}
.tl-ort-n{font-size:var(--fs-kicker);font-weight:var(--fw-black);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--red-t)}
.tl-pill .tl-halle{font-size:.75rem;font-weight:var(--fw-bold);color:var(--mute)}
.tl-day:not(:has(.tl-ort:not([hidden]))){display:none}
.tl-leer{display:none;padding:var(--s-6) 0;color:var(--mute)}
.tl:not(:has(.tl-ort:not([hidden]))) .tl-leer{display:block}
@media(max-width:40em){.tl-day{grid-template-columns:1fr;gap:var(--s-3)}.tl-filter .chip-ferien{margin-left:0}}

/* ---------- Termine als Kartenraster (29.09.) – Kategoriefarben wie in der Vereins-App ---------- */
:root{--cat-training:#1976D2;--cat-lehrgang:#7B1FA2;--cat-pruefung:#D32F2F;--cat-turnier:#E64A19;--cat-verein:#388E3C;--cat-sonst:#546E7A}
[data-theme="dark"]{--cat-training:#4F9FE5;--cat-lehrgang:#B166CF;--cat-pruefung:#E8555A;--cat-turnier:#F2723E;--cat-verein:#55B25A;--cat-sonst:#7D94A0}
.terms{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,21rem),1fr));gap:var(--s-4);border-top:0}
.term,.term:hover{grid-template-columns:4.25rem minmax(0,1fr);align-items:start;padding:var(--s-5);border-bottom:0;background:var(--card);box-shadow:var(--sh);border-radius:var(--shape-card)}
a.term{transition:transform .15s var(--ease)}
a.term:hover{transform:translateY(-.125rem)}
.term .d b{font-size:2rem}
.term-body{display:flex;flex-direction:column;align-items:flex-start;gap:.375rem;min-width:0}
.term-body h3{font-size:1.0625rem;line-height:1.3;overflow-wrap:anywhere}
.term-body .link-arr{margin-top:.375rem}
.term .pill.cat{background:var(--cat,var(--cat-sonst));color:#fff;border:0}
.term[data-typ="Training"]{--cat:var(--cat-training)}
.term[data-typ="Lehrgang"],.term[data-typ="Trainingslager"]{--cat:var(--cat-lehrgang)}
.term[data-typ="Prüfung"]{--cat:var(--cat-pruefung)}
.term[data-typ="Turnier"]{--cat:var(--cat-turnier)}
.term[data-typ="Vereinsveranstaltung"]{--cat:var(--cat-verein)}
.term[data-typ="Szenario"]{--cat:var(--g-szen)}

/* ---------- Standortkarten: Knöpfe mit Symbol, alle gleich ---------- */
.loc-acts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(11.5rem,100%),1fr));gap:var(--s-2);margin-top:auto;padding-top:.5rem}
.loc-acts .btn{justify-content:center;letter-spacing:.08em;white-space:normal;text-align:center;padding-inline:.875rem}
.loc-acts svg{width:1rem;height:1rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Knopfleiste ---------- */
.knopfleiste{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:var(--s-3)}
.knopf{position:relative;display:flex;flex-direction:column;gap:.25rem;padding:1rem 3rem 1rem 1.25rem;min-height:var(--hit);border:.0625rem solid var(--ghost);border-radius:var(--shape-field);color:var(--fg);text-decoration:none;transition:border-color var(--dur-fast),background var(--dur-fast)}
.knopf b{font-size:var(--fs-btn);font-weight:var(--fw-black);letter-spacing:.1em;text-transform:uppercase}
.knopf span{font-size:.8125rem;color:var(--mute)}
.knopf i{position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);font-style:normal;color:var(--red-t);transition:transform var(--dur-fast)}
.knopf:hover{border-color:var(--red);color:var(--fg)}
.knopf:hover i{transform:translate(var(--nudge),-50%)}
.knopf:focus-visible{outline:.1875rem solid var(--red);outline-offset:.125rem}

/* ---------- Bewertungen als Slider: wischbar, läuft von selbst, stoppt bei Zeiger/Fokus ---------- */
.rv-slider{position:relative}
.rv-spur{display:flex;gap:var(--s-4);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding-bottom:.25rem;overscroll-behavior-x:contain}
.rv-spur::-webkit-scrollbar{display:none}
.rv-spur:focus-visible{outline:.1875rem solid var(--red);outline-offset:.25rem}
.rv-karte{flex:0 0 min(86%,22rem);scroll-snap-align:start}
.rv-karte.rbadge{flex-basis:min(70%,13rem)}
.rv-nav{display:flex;gap:var(--s-2);justify-content:flex-end;margin-top:var(--s-4)}
@media(prefers-reduced-motion:reduce){.rv-spur{scroll-behavior:auto}}

/* =====================================================================
   Redesign 04.10.2026 · „Gleiche Hand wie die App“ (REDESIGN-KONZEPT.md)
   Rot nur als Signal · keine Bewegung ohne Funktion · Hover über Farbe
   ===================================================================== */
:root{--ease-out:cubic-bezier(.23,1,.32,1);--fill:#3F3F4A;--on-fill:#FFFFFF}
:root[data-theme="dark"]{--fill:#2B2B2B;--on-fill:var(--tks-cream)}

/* ---------- Kopfbild: helles Foto in Farbe neben dem Text ---------- */
.hero{padding-block:var(--s-8) var(--s-12);background:var(--bg);color:var(--fg);border-bottom:.0625rem solid var(--rule)}
@media(min-width:61.25em){.hero{padding-block:var(--s-12) var(--s-16)}}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-8)}
@media(min-width:61.25em){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-rows:auto 1fr;column-gap:var(--s-16);row-gap:var(--s-8);align-items:start}
  .hero-text{grid-column:1;grid-row:1;align-self:end}
  .hero-media{grid-column:2;grid-row:1 / span 2}
  .hero .next{grid-column:1;grid-row:2;align-self:start}
}
.hero-text{display:flex;flex-direction:column;align-items:flex-start}
.hero .kick{color:var(--red-t);margin-bottom:var(--s-5)}
.hero .h1{font-size:clamp(2.25rem,1.55rem + 2.9vw,4.5rem);font-weight:var(--fw-black);letter-spacing:0;line-height:1.02;max-width:15ch;color:var(--fg)}
.hero.sm .h1{font-size:clamp(2rem,1.5rem + 2.2vw,3.5rem);max-width:18ch}
.hero-sub{font-size:var(--fs-lede);line-height:1.55;color:var(--mute);max-width:46ch;margin-top:var(--s-5)}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-8)}
.hero-media{aspect-ratio:4/3}
@media(min-width:61.25em){.hero-media{aspect-ratio:auto;min-height:30rem;height:100%}.hero.sm .hero-media{min-height:24rem}}
.hero.sm .hero-media{aspect-ratio:3/2}
@media(min-width:61.25em){.hero.sm .hero-media{aspect-ratio:auto}}

/* Nächstes Training: eine Zeile Fakt statt Werbesatz */
.next{display:grid;gap:.25rem;padding:var(--s-5) var(--s-6);color:var(--fg);max-width:28rem;width:100%}
.next:hover{color:var(--fg)}
.next .kick{color:var(--mute);margin:0}
.next-wann{font-size:1.25rem;font-weight:var(--fw-black);letter-spacing:0;font-variant-numeric:tabular-nums;transition:color var(--dur-fast) ease}
.next-was{font-size:.9375rem;color:var(--fg)}
.next-fuss{font-size:.8125rem;color:var(--mute);margin-top:.25rem}
@media(hover:hover) and (pointer:fine){.next:hover .next-wann{color:var(--red-t)}}

/* Auf invertierten Flächen (Weiche, CTA) */
.on-inv .btn-ghost{color:var(--tks-cream);border-color:var(--on-media-ghost)}
.on-inv .btn-ghost:hover{border-color:var(--tks-cream);color:var(--tks-cream)}
.mega-pt-l{font-size:.9375rem;font-weight:var(--fw-bold);color:var(--red-on-inv)}

/* ---------- Knöpfe: kurze Rückmeldung beim Drücken ---------- */
.btn{transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease,transform 160ms var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn-ghost{border-color:var(--red-t);color:var(--red-t)}
.btn-ghost:hover{border-color:var(--red-d);color:var(--red-d);background:transparent}
:root[data-theme="dark"] .btn-ghost:hover{border-color:var(--tks-red-200);color:var(--tks-red-200)}
.quick .btn-ghost{color:var(--fg);border-color:var(--ghost)}

/* ---------- Links: normale Schreibweise, Pfeil nur bei externen Zielen ---------- */
.link-arr{font-size:.9375rem;font-weight:var(--fw-bold);letter-spacing:0;text-transform:none;text-decoration:underline;text-decoration-thickness:.0625rem;text-underline-offset:.25em;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);transition:text-decoration-color var(--dur-fast) ease}
.link-arr::after{content:none}
.link-arr.ext::after{content:"↗"}
.link-arr:hover{text-decoration-color:currentColor}

/* ---------- Navigation: Wörter statt Versalien ---------- */
@media(min-width:61.25em){.nav>a,.nav>.dd>button{font-size:.875rem;font-weight:var(--fw-semi);letter-spacing:0;text-transform:none}}

/* ---------- Karten: Hover nur über Farbe, nichts springt ---------- */
.lift,.lift:hover{transform:none;box-shadow:var(--sh)}
a.term,a.term:hover{transform:none}
@media(hover:hover) and (pointer:fine){
  .offer:hover h3,a.term:hover h3,.news a:hover h3{color:var(--red-t)}
}
.offer h3,a.term h3{transition:color var(--dur-fast) ease}
.offer .num{display:none}
.knopf:hover i{transform:translateY(-50%)}
@media(hover:hover) and (pointer:fine){.knopf:hover i{transform:translate(var(--nudge),-50%)}}

/* ---------- Filter-Chips: aktiv wie in der App ---------- */
.chip{transition:background-color var(--dur-fast) ease,color var(--dur-fast) ease}
.chip[aria-pressed="true"]{background:var(--fill);color:var(--on-fill)}

/* ---------- Bewegung reduzieren ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  html{scroll-behavior:auto}
  .btn:active{transform:none}
}
/* Kopf nur mit Link (ohne Kicker): Link rechtsbündig statt verwaist links */
.sec-head>.link-arr:only-child{margin-left:auto}
.hero .h1{max-width:13ch}
/* Split ohne Kicker: Inhalt nicht in die schmale Etikett-Spalte zwängen */
@media(min-width:61.25em){.split.solo{grid-template-columns:minmax(0,1fr);max-width:var(--max-prose)}}


/* ---------- Startseiten-Kopfbild volle Breite (Foto jetzt, Video später) ----------
   Text unten links auf dem Bild. Abdunklung nur dort, wo Text steht (Lesbarkeit,
   WCAG) – der Rest des Bildes bleibt hell und farbig. */
.hero.voll{position:relative;isolation:isolate;overflow:hidden;padding:0;border-bottom:0;background:var(--overlay);color:var(--on-media);display:grid;min-height:calc(100svh - var(--head-h) - var(--quick-h))}
@media(min-width:48em){.hero.voll{min-height:min(calc(100svh - var(--head-h)),56rem)}}
.hero.voll .hero-media{position:absolute;inset:0;z-index:-2;aspect-ratio:auto;min-height:0;height:auto;border-radius:0;background:none}
.hero.voll .hero-media>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero.voll::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,rgba(10,10,11,.82) 0%,rgba(10,10,11,.5) 38%,rgba(10,10,11,0) 68%)}
@media(min-width:61.25em){.hero.voll::before{background:linear-gradient(0deg,rgba(10,10,11,.7) 0%,rgba(10,10,11,0) 55%),linear-gradient(90deg,rgba(10,10,11,.6) 0%,rgba(10,10,11,.25) 40%,rgba(10,10,11,0) 65%)}}
.hero.voll .hero-grid{align-self:end;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-6);width:100%;padding-block:var(--s-16) var(--s-8)}
@media(min-width:61.25em){.hero.voll .hero-grid{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;align-items:end;column-gap:var(--s-12);padding-block:var(--s-20) var(--s-12)}
  .hero.voll .hero-text{grid-column:1;grid-row:1;align-self:end}.hero.voll .next{grid-column:2;grid-row:1;align-self:end}}
.hero.voll .kick{color:var(--on-media)}
.hero.voll .h1{color:var(--on-media);font-size:clamp(2.375rem,1.6rem + 3.4vw,5.5rem);max-width:14ch}
.hero.voll .hero-sub{color:var(--on-media-text)}
.hero.voll .btn-ghost{color:var(--tks-cream);border-color:var(--on-media-ghost)}
.hero.voll .btn-ghost:hover{border-color:var(--tks-cream);color:var(--tks-cream)}
.hero.voll .next{max-width:24rem}
.hero.voll .hero-media{grid-column:auto;grid-row:auto}
.hero.voll .next .kick{color:var(--mute)}
/* Kleines Kopfbild in voller Breite (Unterseiten, wählbar pro Seite) */
.hero.sm.voll{min-height:min(72svh,42rem)}
.hero.sm.voll .h1{font-size:clamp(2rem,1.5rem + 2.4vw,4rem);max-width:18ch}
/* Nächstes Training: eine Zeile pro Standort, Uhrzeit groß rechts */
.next{gap:.375rem}
.next-wann{font-size:1.0625rem}
.next-orte{display:grid;margin-top:.25rem}
.next-ort{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--s-4);row-gap:.125rem;padding:.75rem 0;border-top:.0625rem solid var(--rule)}
.next-ort:last-child{padding-bottom:.25rem}
.next-ort-n{grid-column:1;font-size:var(--fs-kicker);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--red-t)}
.next-zeit{grid-column:2;grid-row:1 / span 2;align-self:center;font-size:1.5rem;font-weight:var(--fw-black);letter-spacing:0;font-variant-numeric:tabular-nums;line-height:1}
.next-gruppe{grid-column:1;font-size:.9375rem;line-height:1.35}
.next-weitere{grid-column:1 / -1;font-size:.8125rem;color:var(--mute);font-variant-numeric:tabular-nums}
.next-fuss{border-top:.0625rem solid var(--rule);padding-top:.625rem}
/* Mobil/Tablet: Karte so breit wie Text und Knöpfe (bis zum Seitenrand) */
@media(max-width:61.2375em){.hero .next,.hero.voll .next{max-width:none}}
/* Handy: Bild als Band oben (Gesichter frei), Text darunter auf dunklem Grund.
   Ab Tablet liegt der Text wieder auf dem Bild. */
@media(max-width:47.99em){
  .hero.voll{min-height:0;display:block}
  .hero.voll .hero-media{position:relative;inset:auto;z-index:0;aspect-ratio:4/3}
  .hero.voll::before{display:none}
  .hero.voll .hero-media::after{content:"";position:absolute;inset:auto 0 0 0;height:35%;background:linear-gradient(0deg,var(--overlay),rgba(10,10,11,0))}
  .hero.voll .hero-grid{padding-block:var(--s-2) var(--s-8)}
}

/* ---- Stundenplan (06.10.2026): Ort-Filter als Einzelauswahl, ruhigere Kacheln ----
   Standard: alle Orte sichtbar, Knöpfe hellgrau. Gewählter Ort: dunkelgrau.
   Ferienplan: direkt dahinter, mit Rand statt Fläche. */
.tl-filter .chip{background:var(--tks-n-100);color:var(--tks-n-600);font-weight:var(--fw-semi)}
.tl-filter .chip:hover{color:var(--tks-n-900)}
.tl-filter .chip[aria-pressed="true"]{background:var(--fill);color:var(--on-fill)}
.tl-filter .chip-ferien{margin-left:0;background:transparent;box-shadow:inset 0 0 0 .0625rem var(--tks-n-200)}
.tl-filter .chip-ferien[aria-pressed="true"]{box-shadow:none}
:root[data-theme="dark"] .tl-filter .chip{background:var(--tks-basalt-800);color:var(--mute)}
:root[data-theme="dark"] .tl-filter .chip:hover{color:var(--fg)}
:root[data-theme="dark"] .tl-filter .chip[aria-pressed="true"]{background:#4A4A55;color:var(--tks-cream)}
:root[data-theme="dark"] .tl-filter .chip-ferien{background:transparent;box-shadow:inset 0 0 0 .0625rem var(--rule-s)}
:root[data-theme="dark"] .tl-filter .chip-ferien[aria-pressed="true"]{background:#4A4A55;box-shadow:none}
.tl-pill .t{font-weight:var(--fw-semi);letter-spacing:.01em}
.tl-pill b{font-weight:var(--fw-medium)}
.tl-pill .tl-halle{font-weight:var(--fw-regular)}
/* Kinder: helles Lila statt Gelb */
:root{--g-kinder:#A48AD8}
:root[data-theme="dark"]{--g-kinder:#B9A3EA}
/* Standortkarten (06.10.2026): Hallenname + Google-Maps-Link rechts, Trainingstage darunter */
.loc-hk{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem}
.loc-map{display:inline-flex;align-items:center;gap:.25rem;flex:none;font-size:.75rem;font-weight:var(--fw-semi);color:var(--red-t);text-decoration:none;min-height:1.5rem}
.loc-map:hover{text-decoration:underline;text-underline-offset:.2em}
.loc-map:focus-visible{outline:.1875rem solid var(--red);outline-offset:.125rem}
.loc-map svg{width:.875rem;height:.875rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.loc li .loc-tage{color:var(--fg);margin-top:.125rem}
/* ---- Terminkarten Variante A (06.10.2026): leiser Datumsblock, Kategorie als Punkt + Wort, Zeit/Ort getrennt ---- */
.term .d{gap:.125rem}
.term .d i{font-style:normal;font-size:.75rem;font-weight:var(--fw-semi);color:var(--faint);line-height:1}
.term .d b{font-size:1.75rem;font-weight:var(--fw-semi);letter-spacing:0;line-height:1.05}
.term .d span{font-size:.8125rem;font-weight:var(--fw-medium);letter-spacing:0;text-transform:none;color:var(--mute);margin-top:0}
.term-cat{display:inline-flex;align-items:center;gap:.4375rem;font-size:.75rem;font-weight:var(--fw-semi);color:var(--mute);line-height:1.2}
.term-cat::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--cat,var(--cat-sonst))}
.term-body{gap:.3125rem}
.term-body h3{font-size:1.0625rem;font-weight:var(--fw-semi);letter-spacing:0;line-height:1.3}
.term-m{display:flex;flex-direction:column;gap:.0625rem;font-size:.875rem;line-height:1.45;color:var(--mute)}
.term-zeit{font-weight:var(--fw-medium);color:var(--fg);font-variant-numeric:tabular-nums}
/* ---- Hero-Video (07.10.2026): Standbild nur bei „weniger Bewegung“ ---- */
.hero-media .hero-still{display:none}
@media(prefers-reduced-motion:reduce){.hero-media .hero-vid{display:none}.hero-media .hero-still{display:block}}

/* ---- App-Störer (07.10.2026): Band auf invertierter Fläche, echte Screenshots ---- */
.app-band{background:var(--inv);color:var(--invfg);padding-block:var(--s-16) 0;overflow:hidden;border-block:.0625rem solid var(--rule)}
.app-band .wrap{display:grid;gap:var(--s-12);align-items:center}
@media(min-width:61.25em){.app-band{padding-block:var(--s-20)}.app-band .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
.app-band .kick{color:var(--on-inv-kick)}
.app-band .h2{margin-top:1rem;max-width:14ch;text-wrap:balance}
.app-lede{margin-top:1.25rem;max-width:46ch;color:var(--on-inv-mute);font-size:1.0625rem;line-height:1.6}
.app-punkte{list-style:none;display:grid;gap:.625rem;margin-top:1.5rem;padding:0}
@media(min-width:37.5em){.app-punkte{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-6)}}
.app-punkte li{display:flex;gap:.625rem;align-items:flex-start;font-size:.9375rem;line-height:1.45;color:var(--on-inv-text)}
.app-punkte svg{flex:none;width:1.125rem;height:1.125rem;margin-top:.125rem;fill:none;stroke:var(--red);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.app-stores{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-8)}
.app-store{display:inline-flex;align-items:center;gap:.75rem;min-height:3.25rem;padding:.5rem 1.25rem .5rem 1rem;border-radius:var(--shape-field);background:var(--tks-cream);color:var(--tks-n-900);text-decoration:none;transition:background-color var(--dur-fast) ease,transform .1s}
.app-store:hover{background:#fff}
.app-store:active{transform:scale(.97)}
.app-store:focus-visible{outline:.1875rem solid var(--red);outline-offset:.1875rem}
.app-store svg{width:1.5rem;height:1.5rem;fill:currentColor;flex:none}
.app-store span{display:flex;flex-direction:column;line-height:1.1;font-size:1.0625rem;font-weight:var(--fw-semi);letter-spacing:0}
.app-store small{font-size:.6875rem;font-weight:var(--fw-medium);letter-spacing:.02em;color:var(--tks-n-600)}
.app-hinweis{margin-top:var(--s-4);font-size:.8125rem;color:var(--on-inv-kick)}
.app-phones{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:var(--s-4);padding-top:var(--s-4)}
.app-phone{margin:0;width:min(44%,15rem);border-radius:1.75rem;overflow:hidden;background:#000;box-shadow:0 0 0 .375rem #1c1c1f,0 0 0 .4375rem rgba(245,241,230,.14),0 1.75rem 3rem -1rem rgba(0,0,0,.6)}
.app-phone img{display:block;width:100%;height:auto}
.app-phone:first-child{transform:translateY(-1.5rem)}
.app-phone + .app-phone{transform:translateY(1.5rem)}
/* Mobil: Telefone ragen unten aus dem Band heraus (nur angeschnitten) */
@media(max-width:61.2375em){.app-phones{margin-bottom:-6rem}}
@media(min-width:61.25em){.app-phones{justify-content:flex-end}.app-phone{width:min(46%,16.5rem)}}
/* Platzhalter für fehlende Fotos (Trainer-Porträts, Hallen) – bewusst als Platzhalter erkennbar, kein Fantasiebild */
.ph-foto{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:var(--sunk);border:.0625rem dashed var(--rule-s);color:var(--faint)}
.ph-foto svg{width:2rem;height:2rem;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ph-foto span{font-size:.75rem;font-weight:var(--fw-medium);letter-spacing:.02em}
.coach .ph-foto{background:var(--card)}

/* Trainingsplan-Kachel: Gruppentitel kleiner (Tony 07.10.2026) */
.tl-pill b{font-size:.9rem}
/* Standortkarten: Hallen luftiger (Tony 07.10.2026) – innen kleine Stufen, zwischen Hallen deutlich mehr Abstand */
.loc ul{gap:0}
.loc li{gap:.3125rem;padding-block:1.125rem;line-height:1.4}
.loc li:first-child{padding-top:1rem}
.loc li:last-child{padding-bottom:.25rem}
.loc li .loc-tage{margin-top:.25rem;font-weight:var(--fw-medium)}
/* ---- Terminkarten (07.10.2026): Datum als ruhige Kachel (Wochentag + TT.MM.), Titel etwas kleiner, mehr Luft zwischen den Angaben ---- */
.term,.term:hover{grid-template-columns:4.5rem minmax(0,1fr);column-gap:var(--s-5)}
.term .d{align-items:center;justify-content:center;gap:.25rem;padding:.75rem .375rem;background:var(--sunk);border-radius:var(--shape-field);text-align:center;line-height:1}
.term .d i{font-size:.6875rem;font-weight:var(--fw-semi);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.term .d b{font-size:1.0625rem;font-weight:var(--fw-semi);letter-spacing:0;font-variant-numeric:tabular-nums;line-height:1.1}
.term-body{gap:.5rem}
.term-body h3{font-size:.975rem;line-height:1.35}
.term-m{gap:.3125rem}
/* Standortkarten: Trainingstage normal statt halbfett */
.loc li .loc-tage{font-weight:var(--fw-regular)}
/* Terminkarte: Datum TT.MM.JJ braucht etwas mehr Breite */
.term,.term:hover{grid-template-columns:5rem minmax(0,1fr)}
.term .d b{font-size:1rem}
/* App-Störer: Screenshots passend zum Farbmodus */
.app-phones.hat-hell .app-hell{display:none}
:root:not([data-theme="dark"]) .app-phones.hat-hell .app-dunkel{display:none}
:root:not([data-theme="dark"]) .app-phones.hat-hell .app-hell{display:block}
.app-phones .app-hell:nth-child(3){transform:translateY(-1.5rem)}
.app-phones .app-hell:nth-child(4){transform:translateY(1.5rem)}
/* App-Störer: Text einheitlich in der hellen Schriftfarbe statt abgestufter Transparenz (Tony 07.10.2026) */
.app-band .kick,.app-lede,.app-punkte li,.app-hinweis{color:var(--invfg)}
/* Standortkarten: Trainingstage in Akzentrot (Tony 07.10.2026) */
.loc li .loc-tage{color:var(--red-t)}
/* Abschnitts-Einleitung: Überschrift und Text vertikal mittig zueinander; Terminkarte: Datumskachel mittig zum Inhalt (Tony 07.10.2026) */
.sec-intro{align-items:center}
.term .d{align-self:center}
/* Galerie mit genau 3 Bildern: großes Bild links, zwei kleine rechts übereinander (keine Lücke) */
@media(min-width:48.75em){.gallery:has(> :nth-child(3):last-child){grid-template-columns:2fr 1fr}}
/* Gruppenkarten: gleich hohe Karten, „Mehr erfahren“ immer unten bündig */
.offer-b{flex:1;display:flex;flex-direction:column}
.offer-b .link-arr{margin-top:auto;padding-top:var(--s-3)}
/* Terminkarten: Inhalt vertikal mittig in der Karte */
.term,.term:hover{align-items:center}
/* ---- Schritte als Karten mit Symbol (Probetraining, 08.10.2026) ---- */
.step-karten{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr)}
@media(min-width:37.5em){.step-karten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:68.75em){.step-karten{grid-template-columns:repeat(4,minmax(0,1fr))}}
.step-karte{position:relative;display:flex;flex-direction:column;gap:.5rem;padding:var(--s-6) var(--s-5) var(--s-6);background:var(--card);box-shadow:var(--sh);border-radius:var(--shape-card)}
.step-icon{display:grid;place-items:center;width:3rem;height:3rem;margin-bottom:.5rem;border-radius:50%;background:var(--sunk)}
.step-icon svg{width:1.375rem;height:1.375rem;fill:none;stroke:var(--red-t);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.step-nr{font-size:.75rem;font-weight:var(--fw-semi);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.step-karte b{font-size:1.0625rem;font-weight:var(--fw-semi);line-height:1.3}
.step-karte p{font-size:.9375rem;line-height:1.55;color:var(--mute)}
/* Verbindungslinie zwischen den Karten (nur 4-spaltig) */
@media(min-width:68.75em){.step-karte:not(:last-child)::after{content:"";position:absolute;top:calc(var(--s-6) + 1.5rem);right:calc(-1 * var(--s-4));width:var(--s-4);height:.0625rem;background:var(--rule-s)}}
/* Zahlenleiste: Kachel mit Bild (Auszeichnung) statt Zahl */
.stats>a{background:var(--bg);color:inherit;text-decoration:none;padding:1.75rem var(--s-4) 1.75rem 0;display:flex;align-items:center;gap:var(--s-4)}
.stats>a:nth-child(even){padding-left:var(--s-4)}
@media(min-width:48.75em){.stats>a{padding-left:var(--s-6)}}
.sec.sunk .stats>a{background:var(--sunk)}
.stats .stat-bild{width:auto;height:5rem;flex:none;transition:transform .2s ease}
@media(hover:hover) and (pointer:fine){.stats>a:hover .stat-bild{transform:rotate(-6deg) scale(1.04)}}
.stats>a:hover span{color:var(--fg);text-decoration:underline;text-underline-offset:.2em}
.stats>a:focus-visible{outline:.125rem solid var(--red);outline-offset:-.125rem}
@media(prefers-reduced-motion:reduce){.stats .stat-bild{transition:none}.stats>a:hover .stat-bild{transform:none}}

/* ===== FAQ zweispaltig: Intro + Bild links, Fragen mit Symbol + Kontakt rechts ===== */
.faq-split{display:grid;gap:var(--s-10)}
@media(min-width:61.25em){.faq-split{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s-16);align-items:start}.faq-aside{position:sticky;top:calc(var(--s-20) + var(--s-4))}}
.faq-aside{display:flex;flex-direction:column;gap:var(--s-5)}
.faq-aside .lede{color:var(--mute);max-width:40ch}
.faq-bild{margin-top:var(--s-3);aspect-ratio:16/10}
@media(min-width:61.25em){.faq-bild{aspect-ratio:4/3.4}}
.faq-bild img{width:100%;height:100%;object-fit:cover}
.faq-icons summary{justify-content:flex-start;gap:var(--s-4)}
.faq-icons .faq-q{flex:1}
.faq-icon{display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--sunk);flex:none}
.faq-icon svg{width:1.25rem;height:1.25rem;fill:none;stroke:var(--red-t);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:30em){.faq-icons details>div{padding-left:calc(2.75rem + var(--s-4))}}
.faq-kontakt{margin-top:var(--s-8);padding:var(--s-6);background:var(--sunk);border-radius:var(--shape-card);display:flex;flex-direction:column;gap:.25rem}
.faq-kontakt b{font-size:1.0625rem}
.faq-kontakt span{color:var(--mute);font-size:.9375rem}
.faq-kontakt div{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-4)}
.faq-k{display:inline-flex;align-items:center;gap:.5rem;min-height:var(--hit);padding:0 1.125rem;border-radius:var(--shape-field);background:var(--card);box-shadow:var(--sh);color:var(--fg);font-size:.9375rem;font-weight:var(--fw-semi);transition:color var(--dur-fast) ease,transform var(--dur-fast) var(--ease)}
.faq-k svg{width:1.125rem;height:1.125rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.faq-k:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.faq-k:hover{color:var(--red-t)}}

/* ===== Footer, ruhiger: Marke + App oben, gedämpfte Linkspalten, eine Meta-Zeile, Wortmarke ===== */
.foot-stores{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.store-badge{display:inline-flex;align-items:center;gap:.625rem;min-height:var(--hit);padding:.375rem 1.125rem .375rem .875rem;border-radius:var(--shape-field);background:var(--fg);color:var(--bg);text-decoration:none;text-align:left;transition:opacity var(--dur-fast) ease,transform var(--dur-fast) var(--ease)}
.store-badge:hover{color:var(--bg)}
.store-badge:active{transform:scale(.97)}
.store-badge:focus-visible{outline:.1875rem solid var(--red);outline-offset:.1875rem}
@media(hover:hover) and (pointer:fine){.store-badge:hover{opacity:.86}}
.store-badge svg{width:1.375rem;height:1.375rem;fill:currentColor;flex:none}
.store-badge span{display:flex;flex-direction:column;line-height:1.1;font-size:.9375rem;font-weight:var(--fw-semi)}
.store-badge small{font-size:.625rem;font-weight:var(--fw-medium);letter-spacing:.02em;opacity:.7}
/* Schritt-Karten: „Schritt 1“ neben dem Symbol, in Titelgröße */
.step-kopf{display:flex;align-items:center;gap:var(--s-3);margin-bottom:.5rem}
.step-kopf .step-icon{margin-bottom:0}
.step-kopf .step-nr{font-size:1.0625rem;font-weight:var(--fw-bold);letter-spacing:0;text-transform:none;color:var(--fg)}
/* Mobil: Emblem-Kachel untereinander, Karten-Link mit voller Tippfläche */
@media(max-width:48.74em){.stats>a{flex-direction:column;align-items:flex-start;gap:var(--s-3)}.stats .stat-bild{height:4.5rem}}
.loc-map{min-height:var(--hit);min-width:var(--hit);display:inline-flex;align-items:center;margin-block:calc((var(--hit) - 1.5rem) / -2)}

/* ===== Karten mit Symbol (Trio „karten“) ===== */
.ikarten{display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr)}
@media(min-width:37.5em){.ikarten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:61.25em){.ikarten{grid-template-columns:repeat(3,minmax(0,1fr))}.ikarten.vier{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ikarte{display:flex;flex-direction:column;gap:.5rem;padding:var(--s-6) var(--s-5);background:var(--card);box-shadow:var(--sh);border-radius:var(--shape-card);color:var(--fg);text-decoration:none}
a.ikarte{transition:transform var(--dur-fast) var(--ease)}
a.ikarte:hover{color:var(--fg)}
a.ikarte:active{transform:scale(.985)}
a.ikarte:focus-visible{outline:.1875rem solid var(--red);outline-offset:.1875rem}
.ikarte .ikarte-t{font-size:1.0625rem;font-weight:var(--fw-bold);line-height:1.3;margin-top:.25rem}
.ikarte p{font-size:.9375rem;line-height:1.55;color:var(--mute)}
.ikarte-mehr{margin-top:auto;padding-top:var(--s-3);font-size:.875rem;font-weight:var(--fw-semi);color:var(--red-t)}
@media(hover:hover) and (pointer:fine){a.ikarte:hover .ikarte-mehr{text-decoration:underline;text-underline-offset:.2em}}
.ikarte .step-icon{margin-bottom:.25rem}
.ikarte .step-icon svg{width:1.375rem;height:1.375rem;fill:none;stroke:var(--red-t);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ===== Trainerteam kompakt ===== */
.team-kompakt{display:grid;gap:var(--s-3);grid-template-columns:minmax(0,1fr)}
@media(min-width:56em){.team-kompakt{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:80em){.team-kompakt{grid-template-columns:repeat(3,minmax(0,1fr))}}
.team-k{display:flex;align-items:center;gap:var(--s-4);padding:var(--s-4) var(--s-5);background:var(--card);box-shadow:var(--sh);border-radius:var(--shape-card)}
.team-av{flex:none;display:grid;place-items:center;width:3.5rem;height:3.5rem;border-radius:50%;background:var(--sunk);color:var(--red-t);font-weight:var(--fw-bold);font-size:1.0625rem;object-fit:cover}
.team-k>div{display:flex;flex-direction:column;gap:.125rem;min-width:0}
.team-k h3{font-size:1rem;font-weight:var(--fw-bold);line-height:1.3}
.team-k .g{font-size:var(--fs-micro);font-weight:var(--fw-black);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--red-t)}
.team-k p{font-size:.8125rem;color:var(--mute);line-height:1.4}
/* Zeitleiste ab Desktop als Raster: Linie oben, roter Punkt, drei Einträge pro Reihe */
@media(min-width:61.25em){
.hist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-10) var(--s-8);border-left:0;margin-left:0}
.hist>div{padding:var(--s-5) 0 0;border-top:.0625rem solid var(--rule)}
.hist>div::before{left:0;top:-.25rem}
.hist b{font-size:1.5rem;letter-spacing:0;line-height:1;display:block;margin-bottom:.5rem}
}
.ikarte .ikarte-t{hyphens:manual;-webkit-hyphens:manual}

/* Kowalski-Check: Druck-Feedback auf allem Antippbaren */
.btn:active{transform:scale(.97)}
.chip{transition:background-color var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) var(--ease)}
.chip:active{transform:scale(.97)}
.faq summary{transition:opacity var(--dur-fast) ease}
.faq summary:active{opacity:.7}

/* ===== Intro + Auf einen Blick ===== */
.ifakt{display:grid;gap:var(--s-10);align-items:start}
@media(min-width:61.25em){.ifakt{grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:var(--s-16)}}
.ifakt-text{display:flex;flex-direction:column;gap:var(--s-6)}
.ifakt-text .prose{max-width:var(--measure-body)}
.ifakt-karte{background:var(--card);box-shadow:var(--sh);border-radius:var(--shape-card);padding:var(--s-6)}
@media(min-width:61.25em){.ifakt-karte{position:sticky;top:calc(var(--s-20) + var(--s-4))}}
.ifakt-titel{font-size:.875rem;font-weight:var(--fw-bold);color:var(--mute);margin-bottom:var(--s-2)}
.ifakt-karte dl{margin:0}
.ifakt-zeile{display:grid;grid-template-columns:2.5rem minmax(0,1fr);column-gap:var(--s-4);align-items:center;padding-block:var(--s-4);border-bottom:.0625rem solid var(--rule)}
.ifakt-zeile:last-child{border-bottom:0}
.ifakt-icon{grid-row:span 2;display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--sunk)}
.ifakt-icon svg{width:1.125rem;height:1.125rem;fill:none;stroke:var(--red-t);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ifakt-zeile dt{font-size:1rem;font-weight:var(--fw-bold);line-height:1.3}
.ifakt-zeile dd{margin:0;font-size:.875rem;color:var(--mute);line-height:1.4}
.ifakt-zeile:not(:has(dd)) .ifakt-icon{grid-row:auto}
.ifakt-btn{width:100%;justify-content:center;margin-top:var(--s-4)}

/* ===== Bild-/Videoband über die volle Breite ===== */
.band{position:relative;margin-block:var(--s-16)}
.band.tight{margin-top:0}
.band-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--sunk)}
@media(min-width:48em){.band-media{aspect-ratio:21/9;max-height:38rem;width:100%}}
.band-media img,.band-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band-text{position:absolute;inset:auto 0 0 0;padding-block:var(--s-16) var(--s-8);background:linear-gradient(to top,rgb(0 0 0 / .72) 0%,rgb(0 0 0 / .5) 60%,rgb(0 0 0 / 0) 100%);pointer-events:none}
.band-text p{max-width:22ch;font-size:var(--fs-h2);font-weight:var(--fw-bold);line-height:var(--lh-head);letter-spacing:0;color:#fff;text-wrap:balance}

/* ===== App-Störer kompakt (halbe Höhe) ===== */
.app-band.app-mini{padding-block:var(--s-10)}
.app-mini .wrap{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-5)}
.app-mini-h{font-size:clamp(1.375rem,1.2rem + .7vw,1.75rem);font-weight:var(--fw-bold);line-height:1.2;letter-spacing:0;color:var(--invfg);text-wrap:balance}
.app-mini .app-lede{margin-top:.5rem;font-size:.9375rem;max-width:52ch}
.app-mini .app-stores{margin-top:0}
.app-mini .app-store{min-height:var(--hit);padding:.375rem 1.125rem .375rem .875rem}
.app-mini .app-store span{font-size:.9375rem}
.app-mini-phone{display:none}
@media(min-width:61.25em){
.app-band.app-mini{padding-block:var(--s-8)}
.app-mini .wrap{display:grid;grid-template-columns:9.5rem minmax(0,1fr) auto;column-gap:var(--s-10);align-items:center}
.app-mini-phone{display:block;position:relative;align-self:stretch;min-height:9rem;padding:0}
.app-mini-phone .app-phone,.app-mini-phone .app-phone:first-child,.app-phones.app-mini-phone .app-hell:nth-child(2){position:absolute;top:0;left:0;width:9.5rem;transform:none;border-radius:1.25rem}
.app-mini .app-stores{flex-direction:column}
}

/* ===== Ablauf mit Fotos ===== */
.ablauf{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-8) var(--s-5);grid-template-columns:minmax(0,1fr)}
@media(min-width:37.5em){.ablauf{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:61.25em){.ablauf{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ablauf li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--s-3);align-content:start}
.ablauf .media{grid-column:1/-1;margin-bottom:var(--s-4)}
.ablauf-nr{grid-row:span 2;font-size:2rem;font-weight:var(--fw-black);line-height:1;color:var(--red-t);font-variant-numeric:tabular-nums}
.ablauf h3{font-size:1.0625rem;font-weight:var(--fw-bold);line-height:1.25;align-self:center}
.ablauf p{grid-column:2;margin-top:.25rem;font-size:.9375rem;line-height:1.55;color:var(--mute)}

/* ===== Schritte als kompakte Zeile mit Knopf ===== */
.step-zeile{display:grid;gap:var(--s-6);align-items:center;padding-block:var(--s-6);border-block:.0625rem solid var(--rule)}
@media(min-width:61.25em){.step-zeile{grid-template-columns:minmax(0,1fr) auto;gap:var(--s-10)}}
.step-zeile ol{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-4);grid-template-columns:minmax(0,1fr)}
@media(min-width:37.5em){.step-zeile ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:61.25em){.step-zeile ol{grid-template-columns:repeat(4,minmax(0,1fr))}}
.step-zeile li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--s-3)}
.step-z-nr{grid-row:span 2;font-size:1.25rem;font-weight:var(--fw-black);color:var(--red-t);line-height:1.2;font-variant-numeric:tabular-nums}
.step-zeile b{font-size:.9375rem;line-height:1.3}
.step-zeile li span:not(.step-z-nr){font-size:.875rem;color:var(--mute);line-height:1.45}
.step-zeile .btn{justify-self:start}
/* Ablauf mobil: wischbare Reihe statt 4 hoher Hochformat-Fotos untereinander */
@media(max-width:37.49em){.ablauf{display:flex;gap:var(--s-4);overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter)}.ablauf::-webkit-scrollbar{display:none}.ablauf li{flex:0 0 78%;scroll-snap-align:start}}
/* Stundenplan mobil kompakt: Zeilen statt Karten (Tony 15.10.2026) */
@media(max-width:37.49em){
.tl-day{padding:.875rem 0;gap:.375rem}
.tl-day>div:first-child b{font-size:1.125rem}
.tl-ort{gap:.25rem}
.tl-pills{display:grid;gap:0}
.tl-pill{background:none;box-shadow:none;border-radius:0;padding:.5rem 0 .5rem .875rem;display:grid;grid-template-columns:6.75rem minmax(0,1fr);column-gap:.75rem;row-gap:.125rem;border-top:.0625rem solid var(--rule)}
.tl-pill:first-child{border-top:0}
.tl-pill::before{top:.5rem;bottom:.5rem}
.tl-pill .t{grid-row:span 3;padding-top:.125rem}
.tl-pill b{font-size:.9375rem}
.tl-pill .tl-halle,.tl-pill .tl-ort-zeile{grid-column:2}
}
/* Standort-Knöpfe mobil: 2×2 gleich breit statt Umbruch mit einzelnem „Ferienplan“ (Tony 15.10.2026) */
@media(max-width:37.49em){.tl-filter{display:grid;grid-template-columns:1fr 1fr}.tl-filter .chip{justify-content:center}}

/* ── Wissensseiten: Steckbrief + Artikel ─────────────────────────────── */
.sb{display:grid;gap:var(--s-10)}
@media (min-width:61.25em){.sb{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--s-16);align-items:start}}
.sb-lead .h2{margin-bottom:var(--s-6)}
.sb-lead p{font-size:clamp(1.25rem,1.05rem + .9vw,1.75rem);line-height:1.45;font-weight:var(--fw-medium);color:var(--fg);max-width:34ch;text-wrap:pretty}
.sb-lead p+p{margin-top:1em;font-size:var(--fs-lede);line-height:1.6;font-weight:400;color:var(--mute);max-width:var(--measure-lede)}
.sb-karte{background:var(--card);border-radius:var(--shape-card);box-shadow:var(--sh);padding:var(--s-6) var(--s-6) var(--s-3)}
.sb-titel{font-size:var(--fs-kicker);font-weight:var(--fw-black);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--red-t);margin-bottom:var(--s-2)}
.sb-karte dl>div{display:grid;grid-template-columns:minmax(6.5rem,40%) 1fr;gap:var(--s-4);padding:.875rem 0;border-top:.0625rem solid var(--rule)}
.sb-karte dt{font-size:var(--fs-small);color:var(--faint);padding-top:.0625rem}
.sb-karte dd{font-weight:var(--fw-semi);color:var(--fg);line-height:1.4}

.art-sec{width:100%}
.art-text,.art-sec>.art-zitat{max-width:46rem}
.art-sec+.art-sec{margin-top:clamp(3.5rem,2.5rem + 4vw,6rem)}
.art-h{font-size:var(--fs-h2);letter-spacing:var(--ls-h2);line-height:1.05;max-width:var(--measure-h2);text-wrap:balance;margin-bottom:var(--s-6);scroll-margin-top:calc(var(--head-h) + var(--head-gap))}
.art-text p,.art-text li{font-size:clamp(1.0625rem,1rem + .25vw,1.1875rem);line-height:1.7;color:var(--fg)}
.art-text>*+*{margin-top:1.1em}
.art-text h3{font-size:var(--fs-h3);margin-top:var(--s-10)}
.art-text ul{padding-left:1.2em}.art-text li+li{margin-top:.4em}
.art-text strong{font-weight:var(--fw-bold)}
.art-text a{text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:.0625rem}
.art-text blockquote{margin-block:1.6em;padding:var(--s-1) 0 var(--s-1) var(--s-6);border-left:.0625rem solid var(--rule-s)}
.art-text blockquote p{font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem);line-height:1.35;font-weight:var(--fw-medium)}
.art-text blockquote p::before{content:"„";color:var(--red-t);font-weight:var(--fw-black)}
.art-text blockquote p::after{content:"“";color:var(--red-t);font-weight:var(--fw-black)}
.art-text blockquote cite{display:block;margin-top:var(--s-2);font-size:var(--fs-small);font-style:normal;color:var(--faint)}
.art-text table{width:100%;border-collapse:collapse;font-size:var(--fs-small);font-variant-numeric:tabular-nums;margin-block:1.4em}
.art-text caption{caption-side:bottom;text-align:left;color:var(--faint);font-size:var(--fs-small);padding-top:var(--s-2)}
.art-text th,.art-text td{text-align:left;padding:.5rem .75rem .5rem 0;border-bottom:.0625rem solid var(--rule);color:var(--mute)}
.art-text th{font-weight:var(--fw-semi);color:var(--fg)}
.art-text td:last-child{text-align:right;padding-right:0;color:var(--fg);white-space:nowrap}
.art-fig{margin:var(--s-10) 0 0}
.art-fig img{display:block;width:100%;height:auto;border-radius:var(--shape-card);background:var(--sunk)}
.art-fig figcaption,.art-cap{font-size:var(--fs-small);color:var(--faint);margin-top:var(--s-3);line-height:1.5}
.art-breit figcaption{max-width:46rem}
.art-stapel,.art-mini{display:grid;gap:var(--s-3)}
.art-stapel{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:var(--s-8)}
.art-mini{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s-3)}
.art-mini-reihe{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s-8)}
@media (min-width:48.75em){.art-mini-reihe{grid-template-columns:repeat(5,minmax(0,1fr))}}
.art-stapel .art-fig,.art-mini .art-fig{margin:0}
.art-stapel .art-fig img,.art-mini .art-fig img{aspect-ratio:1;object-fit:cover;object-position:50% 25%}
.art-stapel .art-cap{grid-column:1/-1;margin-top:0}
.art-seite .art-fig{margin:0}
@media (max-width:61.24em){
  .art-daneben{display:flex;flex-direction:column}
  .art-daneben .art-seite{order:-1;width:100%;max-width:16rem;margin:0 0 var(--s-6)}
}
@media (min-width:61.25em){
  .art-reihe{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s-16);align-items:start}
  .art-links{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  .art-links>.art-seite,.art-links>.art-stapel{order:-1}
  .art-seite{margin-top:.5rem;position:sticky;top:calc(var(--head-h) + var(--head-gap) + 1rem);width:100%;max-width:26rem;justify-self:end}
  .art-links>.art-seite{justify-self:start}
  .art-stapel{margin-top:.5rem;position:sticky;top:calc(var(--head-h) + var(--head-gap) + 1rem)}
}
.art-zitat{margin:var(--s-12) 0 0}
.art-zitat p{font-size:clamp(1.5rem,1.2rem + 1.4vw,2.375rem);line-height:1.2;font-weight:var(--fw-medium);color:var(--fg);text-wrap:balance}
.art-zitat p::before{content:"„";color:var(--red-t);font-weight:var(--fw-black)}
.art-zitat p::after{content:"“";color:var(--red-t);font-weight:var(--fw-black)}
.art-zitat cite{display:block;margin-top:var(--s-4);font-size:var(--fs-small);font-style:normal;color:var(--faint)}

/* Zeitleiste kompakt */
.hist.hist-k{gap:var(--s-4)}
.hist.hist-k>div{padding-left:1.25rem}
.hist.hist-k b{font-size:var(--fs-micro)}
.hist.hist-k h3{font-size:var(--fs-row);margin:.125rem 0}
.hist.hist-k p{font-size:var(--fs-small);color:var(--mute)}

/* Kata-Slider (nutzt die Bewertungs-Slider-Logik) */
.kata-slider .rv-karte{flex-basis:min(72%,17rem)}
.kata-slider .coach{background:var(--card);border-radius:var(--shape-card);box-shadow:var(--sh)}
/* Kata ohne Foto: weiße Karte, Fudokan-Wappen als Wasserzeichen (10 %), Name darüber – auch im Dark Mode weiß */
.kata-ohne-bild{position:relative;display:grid;place-items:center;background:#fff;padding:var(--s-4);isolation:isolate}
.kata-ohne-bild::before{content:"";position:absolute;inset:14% 18%;background:url(/design/fudokan-logo-wz.webp) center/contain no-repeat;opacity:.1;z-index:-1}
.kata-ohne-bild span{font-size:var(--fs-h3);font-weight:var(--fw-black);color:#0a0a0b;text-align:center;line-height:1.1}

/* kleines Dropdown (Karate Wissen) */
.mega.mega-klein{width:20rem;display:block;padding:var(--s-5)}
.mega-klein .mega-g{grid-template-columns:1fr}

@media (max-width:37.49em){.coaches.m2{grid-template-columns:repeat(2,minmax(0,1fr))}.coaches.m2 .coach{padding:.875rem}.coaches.m2 .coach h3{font-size:1rem}.coaches.m2 .coach p{font-size:.8125rem}}
@media (min-width:61.25em) and (max-width:68.74em){.nav{gap:.75rem}}
@media (min-width:61.25em){
  .hist.hist-k{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-6) var(--s-6)}
  .hist.hist-k>div{padding:var(--s-3) 0 0}
  .hist.hist-k b{font-size:1.125rem;letter-spacing:0;margin-bottom:.25rem}
}
.band-quelle{display:block;margin-top:var(--s-4);font-size:var(--fs-kicker);font-weight:var(--fw-black);letter-spacing:var(--ls-kicker);text-transform:uppercase;font-style:normal;color:rgb(255 255 255 / .8)}
@media (min-width:61.25em){.coaches.m2:has(> .coach:nth-child(5):last-child){grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (min-width:48.75em){.art-mini-reihe:has(> .art-fig:nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:37.49em){.coaches.m2>.coach:last-child:nth-child(odd){grid-column:1/-1;display:grid;grid-template-columns:7.5rem 1fr;column-gap:var(--s-4);align-items:start}.coaches.m2>.coach:last-child:nth-child(odd) .media{grid-row:1/span 3}}
.bildquelle{display:block;font-size:var(--fs-micro);line-height:1.4;color:var(--faint);margin-top:.375rem}
.bq-auf-bild{position:absolute;right:var(--gutter);bottom:.75rem;z-index:2;margin:0;padding:.1875rem .5rem;border-radius:var(--shape-chip);background:rgb(10 10 11 / .55);color:rgb(255 255 255 / .85)}
.band-media{position:relative}
.hero.sm.voll .bq-auf-bild{bottom:auto;top:.75rem}
@media (min-width:48.75em){.locs:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:75em){.locs:has(> :nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:48.75em){.locs:has(> :nth-child(4):last-child) .loc>h3{min-height:2.3em}}
/* Einzelne Hallenkarte (Petershagen, Eggersdorf): quer – Bild links, Angaben rechts */
@media (min-width:48.75em){
.locs:has(> :only-child){grid-template-columns:minmax(0,1fr)}
.loc:only-child{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:var(--s-8);align-content:start}
.loc:only-child>*{grid-column:2}
.loc:only-child>.media{grid-column:1;grid-row:1/span 5;aspect-ratio:auto;min-height:18rem;height:100%}
}
/* Galerie mit 4 Bildern: großes Bild links über zwei Zeilen, zwei kleine rechts, das vierte breit darunter rechts */
.gallery:has(> :nth-child(4):last-child)>:last-child{grid-column:span 2}
@media(min-width:48.75em){.gallery:has(> :nth-child(4):last-child)>:last-child{grid-column:2 / span 2;aspect-ratio:8/3}}
/* Hallenkarten mobil: Platzhalter „Hallenfoto folgt“ ausblenden – spart viel leere Fläche, solange Fotos fehlen */
@media (max-width:48.74em){.loc>.ph-foto{display:none}}
/* Ferienplan-Hinweis: Lesebreite, darunter die trainingsfreien Zeiträume */
.tl-ferien{max-width:none}
@media(min-width:61.25em){.tl-ferien:has(.tl-pausen){grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);column-gap:var(--s-12);align-items:start}.tl-ferien:has(.tl-pausen)>.kick{grid-column:1}.tl-ferien:has(.tl-pausen)>p{grid-column:1}.tl-ferien .tl-pausen{grid-column:2;grid-row:1 / span 2;margin-top:0;padding-top:0;padding-left:var(--s-8);border-top:0;border-left:.0625rem solid rgba(245,241,230,.18)}}
.tl-pausen{margin-top:.375rem;padding-top:.75rem;border-top:.0625rem solid var(--on-inv-rule, rgba(245,241,230,.18));font-size:.9375rem}
.tl-pausen b{display:block;margin-bottom:.375rem}
.tl-pausen ul{list-style:none;margin:0;padding:0;display:grid;gap:.25rem}
.tl-pausen li{color:var(--on-inv-text)}
.tl-pausen li span{font-variant-numeric:tabular-nums;color:var(--invfg);margin-right:.375rem}
/* Einleitung über einem Kartenraster: Text an den Kartenspalten ausrichten (Überschrift = 1. Spalte, Text = Spalten 2–3) */
@media(min-width:56em){.sec:has(+ .sec .team-kompakt) .sec-intro{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-3);align-items:center}.sec:has(+ .sec .team-kompakt) .sec-intro>.lede{max-width:none}}
@media(min-width:80em){.sec:has(+ .sec .team-kompakt) .sec-intro{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s-3)}.sec:has(+ .sec .team-kompakt) .sec-intro>.lede{grid-column:2 / span 2;max-width:none}}
@media(min-width:61.25em){
.sec:has(+ .sec .ikarten:not(.vier)) .sec-intro{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s-4)}
.sec:has(+ .sec .ikarten.vier) .sec-intro{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--s-4)}
.sec:has(+ .sec .ikarten:not(.vier)) .sec-intro>.lede{grid-column:2 / span 2;max-width:none}
.sec:has(+ .sec .ikarten.vier) .sec-intro>:first-child{grid-column:span 2}
.sec:has(+ .sec .ikarten.vier) .sec-intro>.lede{grid-column:3 / span 2;max-width:none}
}
/* Trainerkarten auf schmalen Handys: kleinerer Kreis + Lizenzzeilen etwas kleiner, damit jede Qualifikation in eine Zeile passt */
@media(max-width:29.99em){.team-k{gap:var(--s-3);padding:var(--s-4)}.team-av{width:2.75rem;height:2.75rem;font-size:.9375rem}.team-k p{font-size:.75rem}}
@media(max-width:23.99em){.team-k .team-av{display:none}}
/* Safari: Textspalte der Trainerkarte füllt die Karte (sonst schrumpft sie und bricht die Lizenzzeilen um) */
.team-k>div{flex:1 1 auto}
.team-k p,.team-k h3{text-wrap:wrap}
/* Trainerkarten: Kopf (Kreis, Name, Rolle) – feine Linie – Lizenzen; mehr Innenabstand */
.team-k{flex-direction:column;align-items:stretch;gap:0;padding:var(--s-6)}
.team-k>.team-kopf{display:flex;flex-direction:row;align-items:center;gap:var(--s-4);flex:none}
.team-kopf>div{display:flex;flex-direction:column;gap:.25rem;min-width:0;flex:1 1 auto}
.team-k .team-liz{margin-top:var(--s-5);padding-top:var(--s-4);border-top:.0625rem solid var(--rule);line-height:1.65}
@media(max-width:29.99em){.team-k{padding:var(--s-5)}.team-k .team-liz{margin-top:var(--s-4);padding-top:var(--s-3)}}
/* Trainerkarten: Gürtelfarbe des Grades als kurzes Gürtelende auf der Linie, Grad (erste Zeile) hervorgehoben */
.gurt-dan{--gurt:#0b0b0b}.gurt-braun{--gurt:#6b3f1a}.gurt-gruen{--gurt:#1f6b3f}.gurt-lila{--gurt:#6a3d8f}.gurt-blau{--gurt:#1f4a6b}
.team-k .team-liz{position:relative;border-top:.0625rem solid var(--rule)}
.team-k[class*=gurt-] .team-liz::before{content:"";position:absolute;left:0;top:-.125rem;width:2rem;height:.1875rem;border-radius:.125rem;background:var(--gurt)}
.team-k .team-liz::first-line{color:var(--fg);font-weight:var(--fw-medium)}
/* Dunkler Modus (data-theme="dark"): Schwarz als dunkles Grau, die übrigen Gürtelfarben etwas aufgehellt, damit sie auf der dunklen Karte sichtbar bleiben */
:root[data-theme="dark"] .gurt-dan{--gurt:#4a4743}:root[data-theme="dark"] .gurt-braun{--gurt:#8a5a2e}:root[data-theme="dark"] .gurt-gruen{--gurt:#2e8a52}:root[data-theme="dark"] .gurt-lila{--gurt:#9466c2}:root[data-theme="dark"] .gurt-blau{--gurt:#3a6f9a}
/* Kontaktkarten: bei vier Karten 2×2 bzw. eine Reihe statt einer allein stehenden vierten */
@media(min-width:48.75em){.ccards:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 4 Kontaktkarten: 2×2 statt 4 nebeneinander, damit Mail/Adresse nicht umbrechen; Link immer unten */
.ccard .link-arr{margin-top:auto;padding-top:var(--s-3)}
@media(min-width:68.75em){.ccards:has(> :nth-child(4):last-child) .ccard b{white-space:nowrap}}
/* Wissensartikel: Platzhalter „Foto folgt“ in Bildform */
.art-seite>.ph-foto{aspect-ratio:4/5;width:100%}
.art-mini-reihe>.ph-foto{aspect-ratio:1}
/* News-Beitrag: Text über die volle Inhaltsbreite (Tony 21.10.2026), Zwischenüberschriften mit Luft, Galerien als Raster */
.news-text,.news-text p,.news-text li{max-width:none}
.news-text h2,.news-text h3,.news-text h4{margin:2em 0 .5em;color:var(--fg);line-height:1.2}
.news-text>:first-child{margin-top:0}
.news-text ul,.news-text ol{margin:1em 0;padding-left:1.25em}.news-text li+li{margin-top:.35em}
.news-text figure{margin:2em 0}.news-text figure img{width:100%;height:auto;display:block}
.news-text figure.columns-default{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4)}
.news-text figure.columns-default>figure{margin:0}.news-text figure.columns-default img{aspect-ratio:3/2;object-fit:cover}
@media(min-width:48em){.news-text figure.columns-default{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Auswahlfelder: eigener Pfeil statt Browser-Optik, gleiche Höhe/Abstände wie Textfelder (Tony 21.10.2026) */
.field select{appearance:none;-webkit-appearance:none;cursor:pointer;line-height:1.6;padding-right:2.75rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%238a8780' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .875rem center;background-size:.75rem auto}
.field select:focus{background-color:var(--card);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23c8102e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .875rem center;background-size:.75rem auto}
.field select:invalid,.field select option[value=""]{color:var(--mute)}.field select option{color:var(--fg);background:var(--card)}
/* Trainer ohne Foto: weißes Viereck mit Vereinslogo (5 %) – Tony 21.10.2026 */
.team-av-leer{position:relative;background:#fff;border-radius:var(--shape-field);overflow:hidden}
.team-av-leer::before{content:"";position:absolute;inset:14%;background:url(/design/assets/tks-logo.webp) center/contain no-repeat;opacity:.05}
/* Go-live-Prüfung 21.10.2026 */
.ccard b span:only-child{white-space:normal}
.mnav .mnav-cta{display:flex;justify-content:center;margin-top:var(--s-6);border-bottom:0;font-size:1rem;color:#fff}
@media(max-width:47.99em){.band-text{background:linear-gradient(to top,rgb(0 0 0 / .78),rgb(0 0 0 / .45) 60%,rgb(0 0 0 / .15))}.band-text p{text-shadow:0 1px 12px rgb(0 0 0 / .5)}}
/* Desktop-Prüfung 21.10.2026 */
.band-text p{text-shadow:0 1px 12px rgb(0 0 0 / .45)}
@media(min-width:48em){.top-act>.btn{display:inline-flex}}
@media(min-width:48em) and (max-width:61.24em){.hero.voll::before{background:linear-gradient(0deg,rgba(10,10,11,.85) 0%,rgba(10,10,11,.6) 60%,rgba(10,10,11,.3) 100%)}}
.news-grid>.pager{grid-column:1/-1}

/* =====================================================================
   Bewegung 21.10.2026 (Vorschau tks-animationen-vorschau.html, von Tony freigegeben)
   Die Start-Zustände (.auf, .zieh, .weich) setzt nur site.js – und nur ohne
   „weniger Bewegung“. Ohne JS bleibt alles sichtbar. Nur transform/opacity.
   ===================================================================== */
:root{--ease-ankunft:cubic-bezier(.16,1,.3,1);
  --gurt-weiss:#EDE8DD;--gurt-blau:#1E2F63;--gurt-lila:#5E3A8C;--gurt-braun:#6B3F1A;--gurt-schwarz:#0B0B0C}
:root[data-theme="dark"]{--gurt-blau:#3550A0;--gurt-lila:#8A5CC4;--gurt-braun:#8A5A30}

/* 1 · Kartenreihen tauchen beim ersten Hineinscrollen gestaffelt auf (Verzögerung setzt site.js) */
.auf,.auf:hover{opacity:0;transform:translateY(1rem)}
.auf.da{opacity:1;transform:none;transition:opacity 600ms var(--ease-ankunft),transform 600ms var(--ease-ankunft)}

/* 2 · Abschnittskopf: roter Strich auf der Linie; beim ersten Hineinscrollen zieht sich die Linie */
.sec-head{position:relative}
.sec-head::before{content:"";position:absolute;left:0;bottom:-.0625rem;width:2.5rem;height:.125rem;background:var(--red);transform-origin:left}
.sec-head.zieh{border-bottom-color:transparent}
.sec-head.zieh::after{content:"";position:absolute;left:0;right:0;bottom:-.0625rem;height:.0625rem;background:var(--rule);transform:scaleX(0);transform-origin:left}
.sec-head.zieh::before{transform:scaleX(0)}
.sec-head.zieh .kick{opacity:0}
.sec-head.zieh.da::after{transform:none;transition:transform 900ms var(--ease-out)}
.sec-head.zieh.da::before{transform:none;transition:transform 500ms var(--ease-out) 650ms}
.sec-head.zieh.da .kick{opacity:1;transition:opacity 400ms ease 150ms}

/* 3 · Gürtel-Lesefortschritt unter der Kopfzeile (Baustein „artikel“, Balken baut site.js ein):
   Weiß · 5. Kyu dunkelblau · 4. Kyu lila · 1.–3. Kyu braun · Dan schwarz. Der Deckel gibt ihn frei. */
.guertel{position:absolute;left:0;right:0;bottom:-.0625rem;height:.25rem;overflow:hidden;pointer-events:none;
  background:linear-gradient(90deg,var(--gurt-weiss) 0 20%,var(--gurt-blau) 20% 40%,var(--gurt-lila) 40% 60%,var(--gurt-braun) 60% 80%,var(--gurt-schwarz) 80% 100%)}
:root[data-theme="dark"] .guertel{box-shadow:inset 0 .0625rem 0 rgb(237 232 221 / .18)}
.guertel i{position:absolute;inset:0;background:var(--rule)}

/* 4 · Stundenplan: neu eingeblendete Orte gleiten herein, Ausgeblendetes geht sofort.
   .weich setzt site.js erst nach dem ersten Filtern – beim Laden bewegt sich nichts. */
[data-tl].weich .tl-ort{transition:opacity 260ms var(--ease-out),transform 260ms var(--ease-out);transition-delay:calc(var(--i,0) * 40ms)}
@starting-style{[data-tl].weich .tl-ort{opacity:0;transform:translateY(.5rem)}}

/* 5 · Seitenwechsel: Kopfzeile bleibt stehen, nur der Inhalt blendet über (Chrome/Edge, Safari 18.2+) */
@view-transition{navigation:auto}
.top{view-transition-name:kopf}
main{view-transition-name:inhalt}
::view-transition-old(root),::view-transition-new(root),::view-transition-group(inhalt){animation:none}
::view-transition-old(inhalt){animation:140ms ease-out both seite-aus}
::view-transition-new(inhalt){animation:280ms var(--ease-out) 60ms both seite-ein}
@keyframes seite-aus{to{opacity:0}}
@keyframes seite-ein{from{opacity:0;transform:translateY(.5rem)}}

/* 8 · Formular: Knopf während des Sendens; „Angekommen“ kommt ruhig an, ein roter Strich zieht sich */
.btn.sendet{opacity:.8;cursor:progress}
.form .notice:not(.warn){animation:rei-ein 640ms var(--ease-ankunft) both}
.form .notice:not(.warn) .kick{position:relative;padding-bottom:.5rem;justify-self:start}
.form .notice:not(.warn) .kick::after{content:"";position:absolute;left:0;right:0;bottom:0;height:.125rem;background:var(--red);transform-origin:left;animation:rei-strich 520ms var(--ease-out) 380ms both}
@keyframes rei-ein{from{opacity:0;transform:translateY(.75rem) scale(.985)}}
@keyframes rei-strich{from{transform:scaleX(0)}}

@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .form .notice:not(.warn),.form .notice:not(.warn) .kick::after{animation:none}
}
/* ---------- Fusszeile „Editorial“ (Variante B, 22.10.2026) ----------
   Kopf (Marke | Socials), Linkraster | Kontakt + App, zwei schmale Leisten,
   Ein einziger Akzent: Probetraining. */
.fz{--fz-linie:color-mix(in oklab,var(--fg) 18%,transparent);background:var(--sunk);border-top:.0625rem solid var(--fz-linie);padding-block:var(--s-16) var(--s-4);overflow:hidden;color:var(--fg)}
.fz-kopf{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s-6);padding-bottom:var(--s-10);border-bottom:.0625rem solid var(--fz-linie)}
.fz-marke{display:flex;align-items:center;gap:.875rem;color:var(--fg);text-decoration:none}
.fz-marke:hover{color:var(--fg)}
.fz-marke img{width:2.75rem;height:2.75rem;object-fit:contain;flex:none}
.fz-marke span{display:flex;flex-direction:column;line-height:1.3}
.fz-marke b{font-size:1rem;font-weight:var(--fw-bold)}
.fz-marke small{font-size:.8125rem;color:var(--mute)}
.fz .socials{gap:.5rem}
.fz .socials a{background:transparent;box-shadow:none;border:.0625rem solid var(--tks-n-600);color:var(--mute);transition:color var(--dur-fast) ease,border-color var(--dur-fast) ease,transform var(--dur-fast) var(--ease)}
.fz .socials a:active{transform:scale(.97)}
.fz .socials svg{width:1.4375rem;height:1.4375rem;stroke-width:1.6}
.fz-haupt{display:grid;gap:var(--s-10);padding-block:var(--s-12)}
@media(min-width:75em){.fz-haupt{grid-template-columns:minmax(0,1fr) minmax(0,23.5rem);gap:var(--s-16)}}
.fz-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-8) var(--s-4)}
@media(min-width:48em){.fz-links{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-8)}}
.fz h2{font-size:.6875rem;font-weight:var(--fw-black);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--mute);margin-bottom:1rem}
.fz-links ul{list-style:none;display:flex;flex-direction:column;gap:.125rem;font-size:.9375rem}
.fz-links a{display:inline-block;padding-block:.375rem;color:var(--fg);text-decoration:none;transition:color var(--dur-fast) ease}
.fz-links a.fz-cta{color:var(--red-t);font-weight:var(--fw-bold)}
.fz-links a.fz-cta::after{content:" →"}
.fz-seite{display:flex;flex-direction:column;gap:var(--s-8)}
@media(min-width:48em) and (max-width:74.99em){.fz-seite{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-8)}}
@media(min-width:75em){.fz-seite{padding-left:var(--s-10);border-left:.0625rem solid var(--fz-linie)}}
.fz-seite address{font-style:normal;font-size:.9375rem;display:flex;flex-direction:column;gap:.5rem;color:var(--mute);line-height:1.5}
.fz-seite address a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--fz-linie);text-underline-offset:.25em;text-decoration-thickness:.0625rem;width:fit-content;word-break:break-word}
.fz-label{display:block;color:var(--fg);font-weight:var(--fw-semi)}
.fz-app p{font-size:.875rem;color:var(--mute);margin-bottom:var(--s-4);max-width:32ch}
.fz-leiste{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-3) var(--s-8);padding-block:var(--s-5);border-top:.0625rem solid var(--fz-linie);font-size:.8125rem;color:var(--mute)}
.fz-leiste ul{list-style:none;display:flex;flex-wrap:wrap;row-gap:.25rem}
.fz-leiste li:not(:last-child)::after{content:"·";margin-inline:.625rem;opacity:.5}
.fz-leiste a{color:var(--mute);text-decoration:underline;text-decoration-color:var(--fz-linie);text-underline-offset:.25em;text-decoration-thickness:.0625rem;transition:color var(--dur-fast) ease}
.fz-recht{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}
@media(hover:hover) and (pointer:fine){
  .fz .socials a:hover{color:var(--fg);border-color:var(--fg)}
  .fz-links a:hover{color:var(--red-t)}
  .fz-seite address a:hover,.fz-leiste a:hover{color:var(--fg)}
}
@media(max-width:47.99em){
  .fz-leiste{flex-direction:column}
  .fz-leiste ul{flex-direction:column}
  .fz-leiste li:not(:last-child)::after{content:none}
}
