/* Schiclub Tobadill – Design
   Idee: der Rennlauf. Rote und blaue Torstangen, Startnummern, Zeitnehmertafel. */

/* ---------- Schriften (lokal, keine Verbindung zu Google) ---------- */
@font-face{font-family:"Archivo";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/Archivo-SemiBold.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/Archivo-Bold.woff2") format("woff2")}
@font-face{font-family:"Archivo Expanded";font-weight:800;font-style:normal;font-display:swap;src:url("../fonts/ArchivoExpanded-ExtraBold.woff2") format("woff2")}
@font-face{font-family:"Archivo Expanded";font-weight:900;font-style:normal;font-display:swap;src:url("../fonts/ArchivoExpanded-Black.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-weight:200 900;font-style:normal;font-display:swap;src:url("../fonts/SourceSerif4-Roman.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-weight:200 900;font-style:italic;font-display:swap;src:url("../fonts/SourceSerif4-Italic.woff2") format("woff2")}

:root{
  --schnee:#f1f5f9;
  --papier:#ffffff;
  --blau:#0a1590;        /* Blau aus dem Vereinslogo */
  --tiefblau:#070e5e;
  --torrot:#b01f2b;      /* Rot aus Logo und Torstangen */
  --torrot-dunkel:#8e1520;
  --fels:#5d6578;        /* Grau aus dem Berg im Logo */
  --eis:#d9e1ec;
  --tinte:#0c1240;

  --kopf:"Archivo","Segoe UI",Arial,system-ui,sans-serif;
  --breit:"Archivo Expanded","Archivo","Arial Black",Arial,sans-serif;
  --text:"Source Serif 4",Georgia,"Times New Roman",serif;
  --rand:clamp(20px,5vw,64px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{font-family:var(--text);font-size:1.0625rem;line-height:1.65;color:var(--tinte);background:var(--schnee);-webkit-font-smoothing:antialiased;hyphens:manual}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--torrot);outline-offset:3px}
main:focus{outline:none}
.nur-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{width:auto;height:auto;clip:auto;left:12px;top:12px;z-index:99;background:#fff;color:var(--tinte);padding:10px 16px}
.innen{max-width:1280px;margin:0 auto;padding-left:var(--rand);padding-right:var(--rand)}
.innen.schmal{max-width:900px}
.innen.breit{max-width:1100px}

/* ---------- Kopfzeile ---------- */
.site-kopf{background:var(--papier);position:sticky;top:0;z-index:30;border-bottom:1px solid var(--eis)}
.admin-bar .site-kopf{top:32px}
@media (max-width:782px){.admin-bar .site-kopf{top:46px}}
.site-kopf .innen{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.marke{display:flex;align-items:center;gap:14px;text-decoration:none}
.marke img{height:50px;width:auto}
.marke span{font-family:var(--kopf);font-weight:700;font-size:1.05rem;line-height:1.1;color:var(--blau)}
.marke small{display:block;font-weight:600;font-size:.8rem;color:var(--fels)}
.menue ul{display:flex;gap:4px;list-style:none;align-items:center}
.menue a{display:block;padding:10px 14px;text-decoration:none;font-family:var(--kopf);font-weight:600;font-size:.95rem;color:var(--tinte)}
.menue a:hover,.menue .current-menu-item>a,.menue .current-menu-ancestor>a,.menue .current_page_item>a{color:var(--blau);box-shadow:inset 0 -3px 0 var(--blau)}
.menue .menue-cta a.anmelden{background:var(--torrot);color:#fff;margin-left:10px;border-radius:3px;padding:11px 20px;font-weight:700;box-shadow:none}
.menue .menue-cta a.anmelden:hover{background:var(--torrot-dunkel)}
.menue-knopf{display:none;font-family:var(--kopf);font-weight:700;font-size:.95rem;background:var(--blau);color:#fff;border:0;padding:11px 18px;border-radius:3px;cursor:pointer}

/* ---------- Kopfbereich der Startseite ---------- */
.hero{position:relative;overflow:hidden;background:var(--schnee)}
.hero .innen{position:relative;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end;padding-top:56px;min-height:min(86vh,820px)}
.hero-text{grid-column:1 / span 8;grid-row:1;align-self:center;position:relative;z-index:3;padding-bottom:64px}
.hero h1{font-family:var(--breit);font-weight:900;font-size:clamp(2.5rem,7.4vw,7rem);line-height:.92;letter-spacing:-.035em;color:var(--blau)}
.hero h1 span{display:block;white-space:nowrap}
.hero h1 span+span{margin-left:.55em;color:var(--torrot)}
.hero-satz{max-width:min(26em,100%);margin-top:34px;font-size:1.25rem;line-height:1.5}
.hero-aktionen{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.knopf{display:inline-block;font-family:var(--kopf);font-weight:700;font-size:1rem;padding:15px 26px;text-decoration:none;border-radius:3px;border:2px solid var(--blau);transition:background .15s,color .15s;line-height:1.2}
.knopf.voll{background:var(--blau);color:#fff}
.knopf.voll:hover{background:var(--tiefblau);border-color:var(--tiefblau)}
.knopf.leer{color:var(--blau)}
.knopf.leer:hover{background:var(--blau);color:#fff}
.hero-foto{grid-column:8 / span 5;grid-row:1;position:relative;z-index:1;align-self:end}
.hero-foto img{width:100%;height:min(74vh,720px);object-fit:cover;object-position:50% 60%}
.hero-foto figcaption{position:absolute;right:0;bottom:0;background:var(--torrot);color:#fff;font-family:var(--kopf);font-weight:700;font-size:.9rem;padding:10px 16px}

/* Ein blaues Tor (zwei Stangen mit Fahne) neben dem roten Tor im Foto: zusammen ein Slalom.
   Es fällt beim Laden einmal ein. Ohne Animation steht es einfach da. */
.tor{position:absolute;z-index:2;bottom:-2px;left:-76px;width:150px;color:var(--blau);pointer-events:none}
.tor svg{display:block;width:100%;height:auto;overflow:visible}
@media (prefers-reduced-motion:no-preference){
  .tor{animation:einrammen 1.1s cubic-bezier(.3,.7,.3,1) .2s backwards}
  @keyframes einrammen{
    0%{translate:0 -380px}
    55%{translate:0 8px}
    72%{translate:0 -4px}
    100%{translate:0 0}
  }
}

/* ---------- Startliste (Termine) ---------- */
.startliste{background:var(--tiefblau);color:#fff;padding:84px 0 92px}
.sek-kopf{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:38px}
.sek-kopf h1,.sek-kopf h2{font-family:var(--breit);font-weight:800;font-size:clamp(1.8rem,4vw,3.1rem);line-height:1.05;letter-spacing:-.025em}
.sek-kopf p{max-width:30em;opacity:.82}
.zeile{display:grid;grid-template-columns:84px 190px 1fr 220px;gap:28px;align-items:center;padding:22px 0;border-top:1px solid rgba(255,255,255,.22);text-decoration:none;color:inherit;transition:background .15s}
.zeile:last-of-type{border-bottom:1px solid rgba(255,255,255,.22)}
a.zeile:hover{background:rgba(255,255,255,.06)}
.nummer{background:var(--torrot);color:#fff;font-family:var(--breit);font-weight:900;font-size:1.7rem;line-height:1;text-align:center;padding:14px 0;border-radius:3px}
.zeile .wann{font-family:var(--kopf);font-weight:700;font-size:1.05rem}
.zeile .wann small{display:block;font-weight:600;opacity:.72;font-size:.88rem}
.zeile h3{font-family:var(--kopf);font-weight:700;font-size:1.3rem;line-height:1.2}
.zeile h3 small{display:block;font-family:var(--text);font-weight:400;font-size:.98rem;opacity:.8;margin-top:4px}
.zeile .ort{font-family:var(--kopf);font-weight:600;font-size:.95rem;opacity:.9;text-align:right}
.mehr-zeile{margin-top:26px;font-family:var(--kopf);font-weight:700}
.mehr-zeile a{text-underline-offset:5px;text-decoration-color:var(--torrot);text-decoration-thickness:3px}
.leer-hell{opacity:.85;padding:22px 0;border-top:1px solid rgba(255,255,255,.22)}
.keine-eintraege{color:var(--fels);padding:10px 0}
.startliste--seite{min-height:60vh}
.startliste--eingebettet{background:var(--tiefblau);color:#fff;padding:6px 24px;margin:28px 0;border-radius:3px}
.startliste--eingebettet .zeile:first-child{border-top:0}

/* ---------- Berichte ---------- */
.berichte{padding:100px 0}
.berichte .sek-kopf h2{color:var(--blau)}
.berichte-raster{display:grid;grid-template-columns:7fr 5fr;gap:56px;align-items:start}
.haupt-bericht{text-decoration:none;display:block;color:inherit}
.haupt-bericht .bild{overflow:hidden;background:var(--eis)}
.haupt-bericht .bild img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:50% 30%;transition:transform .5s}
.haupt-bericht:hover .bild img{transform:scale(1.03)}
.bild-leer{display:grid;place-items:center;aspect-ratio:3/2;background:var(--eis)}
.haupt-bericht .bild .bild-leer img{height:46%;width:auto;aspect-ratio:auto;object-fit:contain;mix-blend-mode:multiply;transform:none}
.meta{font-family:var(--kopf);font-weight:600;font-size:.9rem;color:var(--fels);margin-top:20px}
.meta b{color:var(--torrot);font-weight:700}
.meta a{text-decoration:none}
.haupt-bericht h3{font-family:var(--kopf);font-weight:700;font-size:clamp(1.5rem,2.8vw,2.2rem);line-height:1.12;letter-spacing:-.015em;margin:8px 0 12px;color:var(--tinte)}
.haupt-bericht:hover h3{color:var(--blau)}
.haupt-bericht p:last-child{max-width:36em}
.weitere{list-style:none}
.weitere li{border-top:3px solid var(--blau);padding:18px 0 28px}
.weitere li:nth-child(even){border-top-color:var(--torrot)}
.weitere a{text-decoration:none}
.weitere .meta{margin-top:0}
.weitere h3{font-family:var(--kopf);font-weight:700;font-size:1.25rem;line-height:1.2;margin:6px 0 8px}
.weitere a:hover h3{color:var(--blau);text-decoration:underline;text-underline-offset:4px}
.weitere p:last-child{font-size:.98rem;color:#2a3156}
.alle{display:inline-block;font-family:var(--kopf);font-weight:700;color:var(--blau);text-underline-offset:5px;text-decoration-color:var(--torrot);text-decoration-thickness:3px}

/* ---------- Gruppen ---------- */
.mitmachen{background:var(--papier);padding:100px 0}
.mitmachen .sek-kopf h2{color:var(--blau)}
.gruppen{list-style:none}
.gruppen li{border-top:1px solid var(--eis)}
.gruppen li:last-child{border-bottom:1px solid var(--eis)}
.gruppen a{display:grid;grid-template-columns:6fr 5fr auto;gap:32px;align-items:center;padding:34px 0;text-decoration:none}
.gruppen h3{font-family:var(--breit);font-weight:800;font-size:clamp(1.4rem,2.9vw,2.3rem);line-height:1.05;letter-spacing:-.02em;color:var(--tinte);transition:color .15s;hyphens:auto;overflow-wrap:break-word}
.gruppen p{max-width:32em}
.gruppen .los{font-family:var(--kopf);font-weight:700;color:var(--torrot);border-bottom:2px solid currentColor;padding-bottom:2px;white-space:nowrap}
.gruppen a:hover h3{color:var(--blau)}
.gruppen.unterseiten{margin-top:48px}
.gruppen.unterseiten a{grid-template-columns:1fr auto;padding:24px 0}
.gruppen.unterseiten h3{font-size:clamp(1.3rem,2.4vw,1.8rem)}

/* ---------- Rangliste ---------- */
.rangliste{padding:100px 0;background:var(--schnee)}
.rangliste .sek-kopf h1,.rangliste .sek-kopf h2{color:var(--blau)}
.rangliste--seite{min-height:60vh}
table{width:100%;border-collapse:collapse;background:var(--papier)}
th,td{text-align:left;padding:18px 20px;border-bottom:1px solid var(--eis);vertical-align:top}
thead th{font-family:var(--kopf);font-weight:700;font-size:.92rem;background:var(--blau);color:#fff;border-bottom:0}
tbody th{font-family:var(--breit);font-weight:800;font-size:1.25rem;color:var(--blau);white-space:nowrap;width:1%}
.pdf-liste{list-style:none;display:flex;flex-wrap:wrap;gap:10px 34px}
.pdf-liste a{font-family:var(--kopf);font-weight:700;color:var(--tinte);text-underline-offset:4px;text-decoration-color:var(--torrot);text-decoration-thickness:2px}
.pdf-liste a:hover{color:var(--torrot)}
.pdf-liste span{display:block;font-family:var(--kopf);font-weight:600;font-size:.8rem;color:var(--fels)}

/* ---------- Chronik ---------- */
.chronik{background:var(--tiefblau);color:#fff;padding:100px 0}
.chronik .innen{display:grid;grid-template-columns:5fr 7fr;gap:72px;align-items:center}
.chronik img{width:100%;filter:grayscale(1) contrast(1.08);border-left:10px solid var(--torrot)}
.chronik .jahr{font-family:var(--breit);font-weight:900;font-size:clamp(4.5rem,13vw,10.5rem);line-height:.85;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:2px #fff;display:block;margin-bottom:26px}
.chronik p{max-width:30em;font-size:1.15rem;opacity:.92}
.chronik a{display:inline-block;margin-top:22px;font-family:var(--kopf);font-weight:700;color:#fff;text-underline-offset:5px;text-decoration-color:var(--torrot);text-decoration-thickness:3px}

/* ---------- Partner ---------- */
.partner{padding:90px 0;background:var(--papier)}
.partner .sek-kopf h2{color:var(--blau)}
.logos{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.logo-platz{height:104px;display:grid;place-items:center;border:1px solid var(--eis);padding:14px;background:#fff;font-family:var(--kopf);font-size:.9rem;color:var(--fels);text-align:center}
.logo-platz a{display:grid;place-items:center;width:100%;height:100%}
.logo-platz img{max-height:100%;width:auto;max-width:100%;object-fit:contain}

/* ---------- Innenseiten ---------- */
.seitenkopf{background:var(--schnee);padding:64px 0 28px}
.seitenkopf h1{font-family:var(--breit);font-weight:900;font-size:clamp(2rem,5.4vw,4rem);line-height:1;letter-spacing:-.03em;color:var(--blau);margin-top:10px;overflow-wrap:break-word;hyphens:auto}
.seitenkopf .meta{margin-top:0}
.seitenkopf-text{max-width:36em;margin-top:14px;color:var(--fels)}
.kategorien{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.kategorien a{display:block;padding:8px 16px;border:2px solid var(--blau);border-radius:3px;font-family:var(--kopf);font-weight:700;font-size:.92rem;text-decoration:none;color:var(--blau)}
.kategorien a:hover,.kategorien a[aria-current]{background:var(--blau);color:#fff}
.seite-inhalt{padding:48px 0 100px}
.seite>.innen:last-child,.bericht>.innen:last-child{padding-bottom:100px;padding-top:28px}
.titelbild{margin:24px 0 8px}
.titelbild img{width:100%;max-height:560px;object-fit:cover}
.titelbild figcaption{font-family:var(--kopf);font-size:.85rem;color:var(--fels);margin-top:8px}
.berichte-liste{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 32px}
.berichte-liste .haupt-bericht h3{font-size:1.35rem}
.navigation.pagination{margin-top:64px}
.nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.page-numbers{display:inline-block;min-width:44px;text-align:center;padding:10px 14px;border:2px solid var(--blau);font-family:var(--kopf);font-weight:700;text-decoration:none;color:var(--blau);border-radius:3px}
a.page-numbers:hover,.page-numbers.current{background:var(--blau);color:#fff}
.page-numbers.dots{border-color:transparent}
.beitrag-nav{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:3px solid var(--blau);margin-top:56px;padding-top:20px;font-family:var(--kopf);font-weight:700}
.beitrag-nav a{text-underline-offset:4px;text-decoration-color:var(--torrot);text-decoration-thickness:2px}
.fakten{display:grid;gap:12px;margin:8px 0 24px;border-top:3px solid var(--torrot);padding-top:18px}
.fakten div{display:grid;grid-template-columns:90px 1fr;gap:16px}
.fakten dt{font-family:var(--kopf);font-weight:700;color:var(--fels)}
.fakten dd{font-family:var(--kopf);font-weight:700;font-size:1.1rem}
.fakten + p{margin-bottom:28px}
.hinweis-vorbei{font-family:var(--kopf);font-weight:700;color:var(--fels);margin-bottom:20px}

/* Inhalt aus dem Editor */
.inhalt{font-size:1.15rem;line-height:1.7}
.inhalt>*+*{margin-top:1.1em}
.inhalt h2,.inhalt h3,.inhalt h4{font-family:var(--kopf);font-weight:700;line-height:1.2;color:var(--blau);margin-top:1.8em}
.inhalt h2{font-size:1.9rem}
.inhalt h3{font-size:1.45rem}
.inhalt h4{font-size:1.2rem}
.inhalt a{color:var(--blau);text-underline-offset:3px;text-decoration-color:var(--torrot);text-decoration-thickness:2px}
.inhalt ul,.inhalt ol{padding-left:1.4em}
.inhalt li+li{margin-top:.35em}
.inhalt img{height:auto}
.inhalt figure{margin-top:1.6em}
.inhalt figcaption,.wp-element-caption{font-family:var(--kopf);font-size:.88rem;color:var(--fels);margin-top:8px}
.inhalt blockquote{border-left:6px solid var(--torrot);padding-left:22px;font-style:italic}
.inhalt table{font-size:1rem}
.inhalt .wp-block-table{overflow-x:auto}
.inhalt .wp-block-file{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--eis);background:#fff;padding:14px 18px}
.inhalt .wp-block-file a:not(.wp-block-file__button){font-family:var(--kopf);font-weight:700}
.inhalt .wp-block-file__button{background:var(--blau);color:#fff!important;text-decoration:none!important;padding:10px 18px;border-radius:3px;font-family:var(--kopf);font-weight:700;font-size:.95rem}
.inhalt .wp-block-button__link{background:var(--blau);color:#fff;border-radius:3px;font-family:var(--kopf);font-weight:700;text-decoration:none;padding:14px 26px}
.inhalt .wp-block-gallery{gap:10px}
.inhalt .alignwide{max-width:1100px}
.inhalt .alignleft{float:left;margin:.3em 1.4em 1em 0;max-width:50%}
.inhalt .alignright{float:right;margin:.3em 0 1em 1.4em;max-width:50%}
.inhalt .aligncenter{margin-left:auto;margin-right:auto}
.inhalt::after{content:"";display:block;clear:both}

/* ---------- Clubmeister: Tabelle und Balkendiagramm ---------- */
.meister-raster{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;align-items:start;padding:28px 0 100px}
.meister-raster.ohne-diagramm{grid-template-columns:minmax(0,900px)}
.meister-tabelle{overflow-x:auto}
.meister-tabelle>*:first-child{margin-top:0}
.meister-tabelle table{font-size:.98rem;min-width:560px}
.meister-tabelle thead td,.meister-tabelle thead th{background:var(--blau);color:#fff;font-family:var(--kopf);font-weight:700;padding:14px 16px}
.meister-tabelle tbody td,.meister-tabelle tbody th{padding:10px 16px;font-family:var(--text)}
.meister-tabelle tbody td strong{font-family:var(--kopf);color:var(--blau)}
.meister-tabelle tbody tr:nth-child(even){background:var(--schnee)}
.meister-diagramm{position:sticky;top:96px;background:var(--papier);border:1px solid var(--eis);border-top:4px solid var(--blau);padding:22px 22px 18px}
.admin-bar .meister-diagramm{top:128px}
.meister-diagramm h2{font-family:var(--breit);font-weight:800;font-size:1.25rem;line-height:1.15;letter-spacing:-.015em;color:var(--blau);margin-bottom:8px}
.meister-hinweis{font-family:var(--kopf);font-weight:600;font-size:.82rem;color:var(--fels);line-height:1.4}
.meister-hinweis.klein{margin-top:14px}
.meister-legende{list-style:none;display:flex;gap:18px;flex-wrap:wrap;margin:14px 0 12px;font-family:var(--kopf);font-weight:600;font-size:.82rem}
.meister-legende i,.balken .spur span{display:block}
.meister-legende li{display:flex;align-items:center;gap:7px}
.meister-legende i{width:14px;height:14px}
.meister-legende .club,.balken .club{background:var(--blau)}
.meister-legende .schueler,.balken .schueler{background:var(--torrot)}
.balken{list-style:none;display:grid;gap:7px}
.balken li{display:grid;grid-template-columns:132px 1fr 22px;gap:10px;align-items:center}
.balken .name{font-family:var(--kopf);font-weight:600;font-size:.84rem;line-height:1.15;overflow-wrap:anywhere}
.balken .spur{display:flex;height:16px;background:var(--schnee)}
.balken .zahl{font-family:var(--kopf);font-weight:700;font-size:.85rem;text-align:right}
@media (max-width:1100px){.meister-raster{grid-template-columns:minmax(0,1fr) 340px;gap:32px}.balken li{grid-template-columns:110px 1fr 22px}}
@media (max-width:900px){.meister-raster{grid-template-columns:1fr}.meister-diagramm{position:static;order:-1}}

/* ---------- Bilder: Alben und Großansicht ---------- */
.album-inhalt{max-width:none}
.inhalt .wp-block-gallery{gap:10px}
.album-inhalt .wp-block-gallery.has-nested-images{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.album-inhalt .wp-block-gallery.has-nested-images figure.wp-block-image{width:auto!important;margin:0!important;flex:none!important}
.album-inhalt .wp-block-gallery img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover}
.inhalt figure img,.album-inhalt figure img{cursor:zoom-in}
.inhalt figure a img{cursor:zoom-in}
.album-karte .meta{margin-top:16px}
dialog.lightbox{padding:0;border:0;background:rgba(7,14,94,.97);color:#fff;width:100vw;height:100vh;max-width:100vw;max-height:100vh;margin:0}
dialog.lightbox[open]{display:grid;grid-template-columns:64px 1fr 64px;align-items:center}
dialog.lightbox::backdrop{background:rgba(7,14,94,.9)}
dialog.lightbox figure{grid-column:2;display:grid;justify-items:center;gap:12px;margin:0}
dialog.lightbox img{max-width:100%;max-height:82vh;width:auto;height:auto;cursor:default;background:#fff1}
dialog.lightbox figcaption{font-family:var(--kopf);font-weight:600;font-size:.9rem;min-height:1.4em;text-align:center}
dialog.lightbox button{background:none;border:0;color:#fff;font-size:2.6rem;line-height:1;cursor:pointer;padding:12px;font-family:var(--kopf)}
dialog.lightbox button:hover{color:#ffb4b9}
dialog.lightbox .lb-zu{position:absolute;top:8px;right:12px;font-size:2.4rem}
dialog.lightbox .lb-zurueck{grid-column:1;grid-row:1}
dialog.lightbox .lb-weiter{grid-column:3;grid-row:1}
@media (max-width:620px){dialog.lightbox[open]{grid-template-columns:44px 1fr 44px}}

/* ---------- Fußzeile ---------- */
.fuss{background:var(--blau);color:#fff;padding:64px 0 28px}
.fuss-raster{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.fuss h2{font-family:var(--kopf);font-weight:700;font-size:1rem;margin-bottom:14px}
.fuss ul{list-style:none;display:grid;gap:8px;font-size:.98rem}
.fuss a{text-decoration:none;opacity:.9}
.fuss a:hover{opacity:1;text-decoration:underline}
.fuss-marke{display:flex;gap:16px;align-items:flex-start}
.fuss-marke img{height:64px;width:auto;background:#fff;padding:4px;border-radius:3px}
.fuss-marke p{font-family:var(--kopf);font-weight:700;font-size:1.15rem;line-height:1.25}
.fuss-marke small{display:block;font-family:var(--text);font-weight:400;font-size:.95rem;opacity:.88;margin-top:6px}
.fuss-unten{margin-top:44px;padding-top:18px;border-top:1px solid rgba(255,255,255,.25);font-family:var(--kopf);font-weight:600;font-size:.82rem;opacity:.85;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ---------- Schmale Bildschirme ---------- */
@media (max-width:980px){
  .menue-knopf{display:block}
  .menue{position:absolute;top:76px;left:0;right:0;background:var(--papier);border-bottom:1px solid var(--eis);display:none}
  .menue.offen{display:block}
  .menue ul{flex-direction:column;align-items:stretch;padding:8px var(--rand) 20px}
  .menue a{padding:14px 0}
  .menue .menue-cta a.anmelden{margin:10px 0 0;text-align:center}
  .hero .innen{grid-template-columns:1fr;min-height:0;padding-top:36px}
  .hero-text{grid-column:1;padding-bottom:30px}
  .hero-foto{grid-column:1;grid-row:2}
  .hero-foto img{height:min(70vh,520px)}
  .tor{left:10px;width:84px}
  .berichte-raster,.chronik .innen{grid-template-columns:1fr;gap:40px}
  .berichte-liste{grid-template-columns:1fr 1fr}
  .zeile{grid-template-columns:64px 1fr;gap:4px 18px}
  .nummer{grid-row:1 / span 3;align-self:start}
  .zeile .ort{text-align:left;opacity:.75}
  .gruppen a{grid-template-columns:1fr;gap:12px;padding:26px 0}
  .logos{grid-template-columns:repeat(2,1fr)}
  .fuss-raster{grid-template-columns:1fr 1fr}
  .fuss-raster>div:first-child{grid-column:1 / -1}
  .rangliste-tabelle,.rangliste-tabelle thead,.rangliste-tabelle tbody,.rangliste-tabelle tr,.rangliste-tabelle th,.rangliste-tabelle td{display:block}
  .rangliste-tabelle thead{display:none}
  .rangliste-tabelle tr{border-bottom:1px solid var(--eis);padding:14px 0}
  .rangliste-tabelle td,.rangliste-tabelle tbody th{border:0;padding:4px 20px;width:auto}
}
@media (max-width:620px){
  .berichte-liste{grid-template-columns:1fr}
  .fakten div{grid-template-columns:1fr;gap:2px}
}