/* Wanderers Germering – Eisarena-Design: Schwarz, Wanderers-Gold, Eisweiß. Schriften lokal, keine externen Ressourcen. */
@font-face { font-family: "Barlow"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/barlow-latin-500-normal.8e986e86d57e.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/barlow-latin-700-normal.15481e4eab6d.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 800; font-style: normal; font-display: swap; src: url("../fonts/barlow-latin-800-normal.8a60890dcf69.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 700; font-style: italic; font-display: swap; src: url("../fonts/barlow-condensed-latin-700-italic.47197c3b45b7.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 800; font-style: italic; font-display: swap; src: url("../fonts/barlow-condensed-latin-800-italic.5dfa75d7e8f4.woff2") format("woff2"); }

:root {
  --gold: #f7b517;
  --gold-hi: #ffc933;
  --gold-deep: #a97500;
  --black: #121212;
  --coal: #1e1e1f;
  --steel: #5b6066;
  --ice: #edf1f4;
  --line: #d8dee3;
  --ink: #1a1b1c;
  --muted: #5d636a;
  --bg: var(--ice);
  --bg-soft: #fff;
  --radius: 4px;
  --wrap: 1240px;
  --narrow: 760px;
  --display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
  --slant: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
  font-family: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; color: var(--ink); font-size: 1.1rem; line-height: 1.6; font-weight: 500;
  background-color: var(--ice);
  background-image:
    radial-gradient(1200px 500px at 20% 0, rgba(255,255,255,.9), transparent 70%),
    repeating-linear-gradient(112deg, transparent 0 140px, rgba(120,150,175,.07) 140px 141px, transparent 141px 310px);
  background-attachment: fixed;
}
img { max-width: 100%; height: auto; }
a { color: var(--black); text-decoration-color: var(--gold); text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { text-decoration-color: var(--black); }
h1, h2, h3 { font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; line-height: 1.05; letter-spacing: .005em; }
h2 { margin-top: 2.2rem; font-size: 1.9rem; }
h3 { font-size: 1.4rem; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 1.25rem; }
.narrow { max-width: var(--narrow); }
.wrap.narrow { margin-left: auto; margin-right: auto; }
.content { padding-top: 1.5rem; padding-bottom: 2.5rem; }
.muted { color: var(--muted); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: -999px; background: var(--gold); padding: .5rem 1rem; z-index: 100; }
.skip-link:focus { left: 0; }
:focus-visible { outline: 3px solid var(--gold-deep); outline-offset: 2px; }
.section-title { margin: 1rem 0 1rem; }

/* Kopfzeile: Gold-Leiste, schwarze Menüleiste mit Logo in der Mitte, Spielstreifen */
.topbar { background: var(--gold); color: var(--black); font-size: .92rem; font-weight: 700; }
.topbar-inner { display: flex; justify-content: flex-end; align-items: center; min-height: 36px; }
.topbar-links { list-style: none; display: flex; gap: .3rem; align-items: center; margin: 0; padding: 0; }
.icon-link { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; background: none; border: 0; padding: 0; cursor: pointer; color: var(--black); }
.icon-link svg { width: 21px; height: 21px; fill: currentColor; }
.icon-link:hover { background: var(--black); color: var(--gold); }
.topsearch { position: relative; }
.topsearch-form { position: absolute; right: 0; top: 100%; z-index: 80; display: flex; gap: .5rem; background: var(--black); padding: .7rem; border-top: 4px solid var(--gold); box-shadow: 0 14px 28px rgba(0,0,0,.35); width: min(360px, 92vw); }
.topsearch-form[hidden] { display: none; }
.topsearch-form input { flex: 1; min-width: 0; border: 0; padding: .5rem .7rem; }
.topsearch-form .btn { font-size: 1.05rem; }
.topbar a { color: var(--black); text-decoration: none; }
.topbar a:hover { text-decoration: underline; }

.site-header { background: var(--black); color: #fff; position: sticky; top: 0; z-index: 50; }
.header-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 72px; max-width: 1400px; }
.main-nav { display: contents; }
.nav-left { order: 1; justify-content: flex-end; }
.brand { order: 2; align-self: start; position: relative; z-index: 60; padding: 0 1.2rem; }
.nav-right { order: 3; justify-content: flex-start; }
.brand-logo { display: block; height: 132px; width: 125px; max-width: none; margin-bottom: -60px; filter: drop-shadow(0 6px 8px rgba(0,0,0,.45)); }
.main-nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: .1rem; }
.main-nav a { display: block; white-space: nowrap; color: #fff; text-decoration: none; padding: .8rem .62rem; font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.16rem; letter-spacing: .01em; }
.main-nav li { position: relative; }
.main-nav > ul > li > a::after { content: ""; display: block; height: 4px; margin-top: 2px; background: var(--gold); transform: skewX(-20deg) scaleX(0); transform-origin: left; transition: transform .18s; }
.main-nav > ul > li > a:hover::after, .main-nav > ul > li.is-active > a::after { transform: skewX(-20deg) scaleX(1); }
.main-nav .sub { display: none; position: absolute; left: 0; top: 100%; min-width: 230px; flex-direction: column; background: var(--coal); border-top: 4px solid var(--gold); box-shadow: 0 14px 28px rgba(0,0,0,.35); padding: .3rem 0; z-index: 70; }
.nav-right .sub { left: auto; right: 0; }
.main-nav .has-sub:hover > .sub, .main-nav .has-sub:focus-within > .sub { display: flex; }
.main-nav .sub a { font-size: 1.1rem; padding: .55rem 1.1rem; text-transform: none; font-weight: 700; }
.main-nav .sub a:hover { background: var(--gold); color: var(--black); }
.nav-toggle { display: none; }

.gamebar { background: var(--coal); color: #fff; border-top: 1px solid #333; font-size: .95rem; }
.gamebar-inner { display: flex; justify-content: flex-end; align-items: center; gap: 1.4rem; min-height: 46px; max-width: 1400px; }
.gamebar-teams { white-space: nowrap; margin-left: auto; font-family: var(--display); font-style: italic; font-weight: 800; font-size: 1.15rem; text-transform: uppercase; }
.gamebar-teams i { color: var(--gold); padding: 0 .2rem; }
.gamebar-when { background: var(--gold); color: var(--black); font-weight: 800; padding: .15rem 1rem .15rem .8rem; clip-path: var(--slant); white-space: nowrap; }
.gamebar-when b { font-family: var(--display); font-size: 1.2rem; font-style: italic; }

@media (max-width: 1320px) {
  .header-inner { grid-template-columns: 1fr auto; min-height: 64px; }
  .brand { order: 1; padding: 0; align-self: center; }
  .brand-logo { height: 52px; width: 49px; margin: 0; filter: none; }
  .nav-toggle { order: 2; display: flex; align-items: center; gap: .6rem; background: none; color: #fff; border: 2px solid var(--gold); padding: .35rem .8rem; cursor: pointer; font: inherit; font-family: var(--display); font-style: italic; font-weight: 800; font-size: 1.15rem; text-transform: uppercase; }
  .nav-toggle-bars, .nav-toggle-bars::before, .nav-toggle-bars::after { display: block; width: 22px; height: 2px; background: var(--gold); position: relative; content: ""; }
  .nav-toggle-bars::before { position: absolute; top: -7px; left: 0; }
  .nav-toggle-bars::after { position: absolute; top: 7px; left: 0; }
  .main-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--black); max-height: 80vh; overflow: auto; border-bottom: 4px solid var(--gold); padding: .4rem 1.25rem 1rem; }
  .main-nav.is-open { display: block; }
  .main-nav ul { flex-direction: column; justify-content: flex-start; }
  .main-nav .sub, .nav-right .sub { display: none; position: static; box-shadow: none; border-top: 0; background: none; padding: 0 0 0 1rem; min-width: 0; }
  .main-nav .has-sub.is-expanded > .sub { display: flex; }
  .main-nav .has-sub:hover > .sub { display: none; }
  .main-nav .has-sub.is-expanded:hover > .sub { display: flex; }
  .main-nav > ul > li > a::after { display: none; }
  .gamebar-inner { justify-content: space-between; flex-wrap: wrap; gap: .3rem 1rem; padding-top: .4rem; padding-bottom: .4rem; }
  .gamebar-teams { margin-left: 0; white-space: normal; }
}

/* Seitenkopf */
.page-head { background: var(--black); color: #fff; padding: 2.2rem 0 1.6rem; border-bottom: 5px solid var(--gold); position: relative; overflow: hidden; }
.page-head::after { content: ""; position: absolute; right: -40px; top: 0; bottom: 0; width: 260px; background: var(--gold); transform: skewX(-20deg); opacity: .12; }
.page-head h1 { margin: .3rem 0 0; font-size: clamp(2.2rem, 5.5vw, 3.8rem); position: relative; z-index: 1; }
.crumbs, .meta { font-size: .95rem; color: #b9bfc5; position: relative; z-index: 1; }
.crumbs a, .meta a { color: #b9bfc5; text-decoration-color: var(--gold); }
.meta { margin: 0; }
.banner { height: clamp(160px, 28vw, 340px); background-size: cover; background-position: center; }
.lead { font-size: 1.3rem; }
.hero-img { width: 100%; max-height: 520px; object-fit: cover; margin-bottom: 1.5rem; }

/* Startseite: große Meldung + zwei kleine */
.newsgrid { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: auto auto; gap: 1.5rem; padding-top: 1.6rem; }
.story { background: #fff; box-shadow: 0 1px 0 var(--line), 0 10px 24px -14px rgba(20,40,60,.35); }
.story a { display: block; color: inherit; text-decoration: none; height: 100%; }
.story-media { position: relative; overflow: hidden; background: var(--black); aspect-ratio: 16/10; }
.story-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s; }
.story a:hover .story-media img { transform: scale(1.03); }
.story-body { padding: .9rem 1.2rem 1.3rem; }
.story-body time { font-size: .9rem; color: var(--muted); font-weight: 700; }
.story-body h2, .story-body h3 { margin: .2rem 0 .4rem; }
.story-body p { margin: 0; color: #3b4046; font-size: 1rem; }
.story a:hover h2, .story a:hover h3 { text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 4px; text-underline-offset: 4px; }
.ph { width: 100%; height: 100%; background: var(--black) url("../img/wanderers-logo.e685830a4f27.png") center / auto 70% no-repeat; opacity: .96; }
.chip-tag { position: absolute; left: 0; bottom: 14px; background: var(--gold); color: var(--black); font-weight: 800; font-size: .9rem; padding: .25rem 1.1rem .25rem .8rem; clip-path: var(--slant); }
.story-lead { grid-row: span 2; }
.story-lead .story-media { aspect-ratio: 16/9.4; }
.story-lead .story-body h2 { font-size: clamp(2rem, 3.6vw, 3.2rem); }
.story-lead .story-body p { font-size: 1.1rem; max-width: 60ch; }
.story-side .story-body h2 { font-size: 1.55rem; }
.more-link { text-align: right; margin: .9rem auto 0; font-weight: 800; }
.more-link a { text-decoration-thickness: 3px; }
.more-link a::after { content: "  ›"; }

/* Kacheln (Schnellzugriff) */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1rem; margin-top: 2rem; }
.tile { display: flex; align-items: flex-end; min-height: 110px; background: var(--black); color: #fff; text-decoration: none; padding: 1rem 1.2rem; position: relative; overflow: hidden; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); border-bottom: 5px solid var(--gold); transition: background .15s, color .15s; }
.tile::before { content: ""; position: absolute; right: -18px; top: 0; bottom: 0; width: 70px; background: var(--gold); transform: skewX(-20deg); opacity: .18; transition: opacity .15s, width .2s; }
.tile span { position: relative; font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.3rem; line-height: 1; overflow-wrap: anywhere; hyphens: auto; }
.tile:hover { background: var(--gold); color: var(--black); }
.tile:hover::before { opacity: .35; background: #fff; width: 110px; }

.welcome { margin-top: 2.5rem; }
.welcome-card { background: #fff; border-left: 8px solid var(--gold); padding: 1.6rem 2rem; box-shadow: 0 10px 24px -14px rgba(20,40,60,.35); }
.welcome-card h2 { margin: 0 0 .4rem; }
.welcome-card p { margin: 0 0 1rem; max-width: 62ch; font-size: 1.15rem; }

/* Buttons & Chips */
.btn { display: inline-block; background: var(--gold); color: var(--black); font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.2rem; padding: .5rem 1.8rem .5rem 1.3rem; clip-path: var(--slant); text-decoration: none; border: 0; cursor: pointer; }
.btn:hover { background: var(--black); color: var(--gold); }
.btn-ghost { background: var(--black); color: #fff; }
.btn-ghost:hover { background: var(--gold); color: var(--black); }
.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.chip { padding: .25rem 1rem; background: #fff; border: 1px solid var(--line); text-decoration: none; font-weight: 700; font-size: .95rem; }
.chip.is-active, .chip:hover { background: var(--black); color: var(--gold); border-color: var(--black); }
.subpage-list { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }

/* Karten (Meldungsübersichten) */
.news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 1.4rem; }
.story-card .story-media { aspect-ratio: 8/5; }
.story-card h3 { font-size: 1.45rem; }
.card { background: #fff; border: 1px solid var(--line); }

/* Fließtext */
.prose > :first-child { margin-top: 0; }
.prose img { border-radius: 6px; }
.prose table { border-collapse: collapse; width: 100%; display: block; overflow-x: auto; }
.prose th, .prose td { border: 1px solid var(--line); padding: .4rem .6rem; text-align: left; }
.block-image { margin: 1.5rem 0; }
.block-image figcaption { color: var(--muted); font-size: .9rem; margin-top: .3rem; }
.block-html iframe { max-width: 100%; }
.gallery-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin: 2rem 0; }
.gallery-grid > a { flex: 1 1 200px; max-width: 340px; }
.gallery-grid + *, .block-gallery + * { margin-top: 0; }
.gallery-grid img { width: 100%; height: auto; border-radius: 6px; display: block; }
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.88); display: flex; align-items: center; justify-content: center; z-index: 200; cursor: zoom-out; }
.lightbox img { max-width: 95vw; max-height: 92vh; }
.doc-list { padding-left: 1.2rem; }
.block-accordion details { border: 1px solid var(--line); border-radius: 8px; margin: .5rem 0; padding: .1rem 1rem; }
.block-accordion summary { cursor: pointer; font-weight: 700; padding: .7rem 0; }
.contact-card { display: flex; gap: 1rem; align-items: center; border: 1px solid var(--line); border-left: 6px solid var(--gold); border-radius: 8px; padding: .8rem 1rem; margin: 1rem 0; }
.contact-photo { border-radius: 50%; width: 80px; height: 80px; object-fit: cover; }
.sponsor-grid { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; }

/* Kader */
.roster-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .9rem; }
.player { border-bottom: 4px solid var(--gold); overflow: hidden; background: #fff; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); }
.player img, .player-placeholder { width: 100%; aspect-ratio: 5/6; object-fit: cover; display: block; }
.player-placeholder { background: var(--bg-soft); }
.player-body { flex: 1; position: relative; z-index: 1; padding: .6rem .8rem .8rem; }
.player-body h3 { margin: 0; font-size: 1.3rem; }
.nr { color: var(--gold); background: var(--black); padding: 0 .45rem; font-size: 1rem; font-style: italic; margin-right: .2rem; }
.player dl { margin: .4rem 0 0; font-size: .82rem; display: grid; grid-template-columns: auto 1fr; gap: 0 .5rem; }
.player dt { color: var(--muted); } .player dd { margin: 0; }

/* Tabellen & Formulare */
.table-wrap { overflow-x: auto; margin: 1rem 0; }
table.data { border-collapse: collapse; width: 100%; font-size: .95rem; }
table.data th { background: var(--black); color: var(--gold); font-family: var(--display); font-style: italic; text-transform: uppercase; font-size: 1.1rem; text-align: left; padding: .5rem .7rem; }
table.data td { padding: .45rem .7rem; border-bottom: 1px solid var(--line); }
table.data tr.win td:first-child { box-shadow: inset 4px 0 0 #2e9d3a; }
table.data tr.loss td:first-child { box-shadow: inset 4px 0 0 #c43b3b; }

/* sortierbare Statistik-Tabellen: Spaltenkopf anklickbar, Pfeil zeigt aktive Sortierung */
.sortable-table th.is-sortable { cursor: pointer; user-select: none; position: relative; padding-right: 1.3rem; }
.sortable-table th.is-sortable:hover { color: #fff; }
table.data.sortable-table th.is-sortable:hover { color: #fff; }
.mc-table table.sortable-table th.is-sortable:hover { color: #111; }
.sortable-table th.is-sortable:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.sortable-table th.is-sortable::after { content: ""; position: absolute; right: .4rem; top: 50%; transform: translateY(-50%); opacity: .35; border: 4px solid transparent; border-top-color: currentColor; border-bottom: none; }
.sortable-table th.is-sortable[aria-sort="ascending"]::after { opacity: 1; border-top: none; border-bottom: 4px solid currentColor; }
.sortable-table th.is-sortable[aria-sort="descending"]::after { opacity: 1; }
.season-form { margin: 1rem 0; display: flex; gap: .6rem; align-items: center; }
select, input[type=text], input[type=email], input[type=search], textarea { font: inherit; padding: .5rem .7rem; border: 1px solid #bbb; border-radius: 6px; max-width: 100%; }
.form .field { margin-bottom: 1rem; display: flex; flex-direction: column; gap: .3rem; }
.form .field small, .errorlist { color: #a22; }
.errorlist { list-style: none; padding: 0; margin: 0; }
.search-form { display: flex; gap: .5rem; margin-bottom: 1.5rem; } .search-form input { flex: 1; }
.results { padding-left: 1.1rem; } .results li { margin-bottom: 1rem; }
.pager { display: flex; justify-content: space-between; align-items: center; margin-top: 1.5rem; gap: 1rem; }

/* HockeyData */
.hd-block { margin: 1rem 0 2rem; }
.hd-fallback { margin: 0; }
.hd-fallback--small { font-size: .85rem; color: var(--muted); }

/* Footer */
.site-footer { background: var(--black); color: #d5d9dd; margin-top: 3.5rem; border-top: 6px solid var(--gold); }
.site-footer a { color: var(--gold); }
.footer-grid { display: grid; grid-template-columns: auto repeat(3, minmax(180px, 1fr)); gap: 2rem; padding-top: 2rem; padding-bottom: 1.5rem; }
.footer-title { font-size: 1.4rem; color: var(--gold); margin: 0 0 .6rem; }
.footer-brand img { display: block; margin-top: -3.2rem; filter: drop-shadow(0 6px 8px rgba(0,0,0,.5)); }
@media (max-width: 760px) { .newsgrid { grid-template-columns: 1fr; } .story-lead { grid-row: auto; } .footer-grid { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } .footer-brand img { margin-top: 0; width: 96px; height: auto; } }
.plain { list-style: none; padding: 0; margin: 0; }
.footer-bottom { border-top: 1px solid #2a2a2a; padding-top: 1rem; padding-bottom: 1.5rem; font-size: .85rem; color: #999; }

@media print { .site-header, .site-footer { display: none; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

.player .note { margin: .15rem 0 0; font-size: .85rem; }
.player { position: relative; display: flex; flex-direction: column; border-bottom: 0; border-left: 5px solid var(--gold); }
.player:not(:has(img)) .player-body { padding: 1rem 5rem 1rem 1.1rem; min-height: 4.6rem; display: flex; flex-direction: column; justify-content: center; }
.player h3 { font-size: 1.2rem; line-height: 1.15; }
.player .nr { background: none; padding: 0; margin: 0; position: absolute; right: .8rem; top: 50%; transform: translateY(-52%); font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-weight: 800; font-size: 3rem; line-height: 1; color: var(--gold); pointer-events: none; }
.player-staff { border-left-color: var(--black); }
.player-staff:not(:has(img)) .player-body { padding: .8rem 1.1rem; min-height: 0; }
.player-staff .note { margin: .1rem 0 0; }

/* Unterseiten-Kacheln (Bereichsseiten) */
.tile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; margin: 1.5rem 0 2rem; }
.tile-card { display: flex; background:#fff; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); flex-direction: column; gap: .4rem; padding: 1.2rem 1.3rem; text-decoration: none; color: inherit; border-left: 8px solid var(--gold); }
.tile-card h2 { margin: 0; font-size: 1.2rem; }
.tile-card p { margin: 0; color: #444; font-size: .95rem; }
.tile-card .more { margin-top: auto; padding-top: .4rem; font-weight: 700; }

.home .news-grid { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); }
@media (min-width: 900px) { .home .news-grid { grid-template-columns: repeat(3, 1fr); } }

/* Meldungsseite: volle Breite mit Seitenspalte */
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 2.5rem; align-items: start; }
.article-main { background: #fff; padding: 0 0 1.5rem; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); }
.article-main .hero-img { display: block; width: 100%; max-height: 640px; margin: 0; }
.article-body { padding: 1.5rem 2rem 0; }
.article-body > :first-child { margin-top: 0; }
.side-title { margin: 0 0 1rem; font-size: 1.6rem; }
.side-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.side-list a { display: block; background: #fff; text-decoration: none; color: inherit; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); border-bottom: 4px solid var(--gold); }
.side-list img { display: block; width: 100%; height: auto; }
.side-list time { display: block; padding: .6rem 1rem 0; font-size: .9rem; font-weight: 700; color: var(--muted); }
.side-headline { display: block; padding: 0 1rem 1rem; font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.3rem; line-height: 1.1; }
.side-list a:hover .side-headline { text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 3px; }
@media (max-width: 960px) { .article-layout { grid-template-columns: 1fr; } .article-body { padding: 1.2rem 1.1rem 0; } }
/* Schmale Fenster/Tablets: „Weitere Meldungen“ als kompaktes Raster statt riesiger Einzelkacheln */
@media (max-width: 960px) { .side-list { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); } .side-list img { aspect-ratio: 16 / 10; object-fit: cover; } }

/* Beim Scrollen: kleineres Logo, gleiche Höhe der Leiste */
.site-header .brand-logo { transition: height .2s, width .2s, margin .2s; }
@media (min-width: 1321px) {
  .site-header.is-scrolled .brand-logo { height: 68px; width: 64px; margin-bottom: 4px; filter: none; }
  .site-header.is-scrolled .brand { align-self: center; }
}

/* Tabellen-Baustein */
.data-table { margin: 1.6rem 0; overflow-x: auto; background: #fff; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); }
.data-table table { width: 100%; border-collapse: collapse; min-width: 28rem; }
.data-table caption { text-align: left; padding: .7rem 1rem; font-weight: 700; background: var(--ice, #edf1f4); }
.data-table thead th { background: var(--black); color: var(--gold); text-align: left; padding: .75rem 1rem; font-family: 'Barlow Condensed', sans-serif; font-style: italic; font-weight: 800; font-size: 1.1rem; letter-spacing: .02em; border-bottom: 4px solid var(--gold); }
.data-table td { padding: .7rem 1rem; vertical-align: middle; border-bottom: 1px solid var(--line); }
.data-table td p { margin: 0; }
.data-table tbody tr:nth-child(even) td { background: #f7f9fb; }
.data-table tbody tr:last-child td { border-bottom: 0; }

/* Bilder: Größe und Textfluss */
.content, .narrow, .article-body { display: flow-root; }
.article-layout.content { display: grid; } /* Meldungsseite: Artikel links, weitere Meldungen rechts (flow-root darf das Raster nicht überschreiben) */
.content h2, .narrow h2, .article-body h2 { clear: both; }
.block-image img, .richtext-image { max-width: 100%; height: auto; }
.block-image.size-small { width: min(100%, 240px); }
.block-image.size-medium { width: min(100%, 420px); }
.block-image.size-large { width: min(100%, 680px); }
.block-image.size-full { width: 100%; }
.block-image.size-full img { width: 100%; }
.block-image.align-center { margin-left: auto; margin-right: auto; }
@media (min-width: 700px) {
  .block-image.align-left { float: left; margin: .3rem 1.6rem 1rem 0; }
  .block-image.align-right { float: right; margin: .3rem 0 1rem 1.6rem; }
  /* Umflossene Bilder dürfen nie die ganze Spalte füllen, sonst bleibt kein Platz für den Text daneben */
  .block-image.align-left.size-large, .block-image.align-right.size-large { width: min(48%, 400px); }
  .block-image.align-left.size-medium, .block-image.align-right.size-medium { width: min(38%, 300px); }
  .block-image.align-left.size-small, .block-image.align-right.size-small { width: min(28%, 200px); }
  .block-image.align-left.size-full, .block-image.align-right.size-full { width: 60%; }
  .richtext-image.left { float: left; margin: .3rem 1.4rem .8rem 0; }
  .richtext-image.right { float: right; margin: .3rem 0 .8rem 1.4rem; }
}
.richtext-image.full-width { display: block; width: 100%; }
.richtext-image.center { display: block; margin: 1rem auto; }

/* Startseite: Heimspiele-Platzhalter, Unser Verein, Zahlen, Schluss */
.home-games { margin-top: 2.5rem; }
.games-card { background: var(--coal); color: #fff; padding: 1.6rem 2rem; border-left: 8px solid var(--gold); display: grid; gap: .4rem; justify-items: start; }
.games-card h2 { margin: 0; color: var(--gold); }
.games-card p { margin: 0 0 .6rem; max-width: 60ch; }
.home-club { margin-top: 3rem; }
.club-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.4rem; }
.club-card { background: #fff; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); border-bottom: 5px solid var(--gold); display: flex; }
.club-card-link { display: flex; flex-direction: column; color: inherit; text-decoration: none; width: 100%; }
.club-card > :first-child:not(a) { width: 100%; }
.club-media { aspect-ratio: 8/5; background: var(--black); overflow: hidden; position: relative; }
.club-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.club-card-link:hover .club-media img { transform: scale(1.04); }
.club-ph { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(115deg, var(--black) 62%, #2b2410 62%); }
.club-ph img { height: 78%; width: auto; }
.club-body { padding: 1.1rem 1.3rem 1.4rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.club-body h3 { margin: 0; font-size: 1.6rem; }
.club-body p { margin: 0; color: #333; }
.club-more { margin-top: auto; padding-top: .3rem; font-weight: 800; text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.club-more::after { content: "  ›"; }
.numbers { margin-top: 3.5rem; background: var(--black); color: #fff; padding: 2.6rem 0 2.8rem; position: relative; overflow: hidden; border-bottom: 6px solid var(--gold); }
.numbers::before { content: ""; position: absolute; right: -60px; top: 0; bottom: 0; width: 220px; background: var(--gold); transform: skewX(-20deg); opacity: .14; }
.numbers-title { margin: 0 0 1.4rem; color: var(--gold); position: relative; }
.numbers-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1.4rem 2rem; margin: 0; position: relative; }
.numbers-grid dd { margin: 0; font-family: var(--display); font-style: italic; font-weight: 800; font-size: clamp(2.8rem, 6vw, 4.6rem); line-height: 1; color: #fff; }
.numbers-grid dt { margin-top: .35rem; font-weight: 700; color: #d7d7d7; }
.welcome { margin-bottom: 3rem; }
.data-table td + td, .data-table th + th { min-width: 13rem; }
.data-table td { text-wrap: pretty; }
.data-table td .cell-logo { display: block; max-width: 140px; height: auto; }
.data-table td:has(.cell-logo) { width: 1%; white-space: nowrap; }

/* Kalender */
.cal { margin: 1rem 0 2rem; }
.cal-title { margin: 0 0 1rem; }
.cal-bar { display: flex; flex-wrap: wrap; gap: .8rem 1.5rem; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.cal-nav { display: flex; align-items: center; gap: .6rem; }
.cal-range { font-family: var(--display); font-style: italic; font-size: 1.35rem; min-width: 14rem; text-align: center; }
.cal-btn { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; background: var(--black); color: var(--gold); font-size: 1.6rem; line-height: 1; text-decoration: none; clip-path: var(--slant); }
.cal-btn:hover { background: var(--gold); color: var(--black); }
.cal-today { font-weight: 800; text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.cal-filters { display: flex; flex-wrap: wrap; gap: .4rem; }
.cal-chip { padding: .3rem .85rem; background: #fff; color: var(--black); text-decoration: none; font-weight: 700; box-shadow: inset 0 0 0 2px var(--black); font-size: .95rem; }
.cal-chip:hover { background: var(--ice); }
.cal-chip.is-on { background: var(--black); color: var(--gold); }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .6rem; align-items: start; }
.cal-day { background: #fff; box-shadow: 0 10px 24px -18px rgba(20,40,60,.5); min-height: 8rem; padding: 0 0 .5rem; }
.cal-day h3 { margin: 0 0 .5rem; padding: .55rem .7rem; background: var(--black); color: #fff; font-size: 1.05rem; display: flex; justify-content: space-between; align-items: baseline; gap: .4rem; }
.cal-day h3 small { color: var(--gold); font-family: var(--body, inherit); font-style: normal; font-weight: 700; font-size: .85rem; }
.cal-day.is-today h3 { background: var(--gold); color: var(--black); }
.cal-day.is-today h3 small { color: var(--black); }
.cal-event { margin: 0 .5rem .45rem; padding: .4rem .55rem .45rem; border-left: 5px solid #8a96a0; background: #f6f8fa; font-size: .92rem; }
.cal-event time { display: block; font-weight: 800; font-size: .85rem; color: #333; }
.cal-event p { margin: .1rem 0 0; line-height: 1.25; }
.cal-event small { color: var(--muted); display: block; }
.cal-name { font-weight: 700; }
.area-herren { border-left-color: var(--gold); }
.area-nachwuchs { border-left-color: var(--black); }
.area-eiskunstlauf { border-left-color: #3a8fd6; }
.area-hobby { border-left-color: #8a96a0; }
.cal-event.is-game { background: #fff7de; border-left-width: 8px; }
.cal-flag { display: inline-block; background: var(--gold); color: var(--black); font-family: var(--display); font-style: italic; font-weight: 800; font-size: .8rem; padding: 0 .5rem; margin-right: .25rem; text-transform: uppercase; }
.cal-game strong { display: block; font-size: 1.05rem; }
.cal-none { margin: .3rem .7rem; color: var(--muted); font-size: .85rem; }
.cal-hint { margin-top: 1rem; color: var(--muted); }
@media (max-width: 1100px) { .cal-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); } }
@media (max-width: 800px) { .cal-grid { grid-template-columns: 1fr; } .cal-day.is-empty { display: none; } .cal-range { min-width: 0; } }

/* Startseite: Heimspiele */
.home-games .section-title { margin-bottom: .9rem; }
.game-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .9rem; }
.game-item { background: var(--coal); color: #fff; display: grid; grid-template-columns: auto 1fr; gap: .15rem 1rem; align-items: center; padding: 1rem 1.2rem; border-left: 8px solid var(--gold); }
.game-item.area-nachwuchs { border-left-color: #fff; }
.game-when { grid-row: 1 / 3; text-align: center; line-height: 1.1; }
.game-when strong { display: block; font-family: var(--display); font-style: italic; font-weight: 800; font-size: 2rem; color: var(--gold); }
.game-when span { font-size: .85rem; color: #d7d7d7; }
.game-teams { margin: 0; line-height: 1.2; }
.game-teams strong { display: block; font-family: var(--display); font-style: italic; font-size: 1.3rem; text-transform: uppercase; }
.game-teams span { color: #e8e8e8; }
.game-place { font-size: .82rem; color: #b5b5b5; }

/* Chronik / Zeitleiste */
.timeline { margin: 2rem 0; }
.timeline-title { margin-bottom: 1.2rem; }
.timeline-list { list-style: none; margin: 0; padding: 0; position: relative; }
.timeline-list::before { content: ""; position: absolute; top: 0; bottom: 0; left: 6.6rem; width: 4px; background: var(--black); transform: translateX(-50%); }
.tl-item { position: relative; display: grid; grid-template-columns: 5.2rem 1fr; column-gap: 2.6rem; align-items: start; padding-bottom: 1.4rem; }
.tl-year { font-family: var(--display, "Barlow Condensed", sans-serif); font-style: italic; font-weight: 800; font-size: 1.7rem; line-height: 1.1; text-align: right; color: var(--black); padding-top: .55rem; overflow-wrap: anywhere; }
.tl-item::before { content: ""; position: absolute; left: 6.6rem; top: 1.05rem; width: 16px; height: 16px; background: var(--gold); border: 4px solid var(--black); transform: translateX(-50%) skewX(-12deg); z-index: 1; }
.tl-card { background: #fff; padding: .9rem 1.2rem 1rem; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); border-left: 4px solid var(--line); }
.tl-card h3 { margin: 0 0 .25rem; font-size: 1.25rem; }
.tl-card p { margin: 0; }
.tl-card img { display: block; width: 100%; height: auto; max-height: 24rem; object-fit: cover; margin-top: .8rem; }
.tl-item.is-highlight .tl-card { background: var(--black); color: #fff; border-left-color: var(--gold); }
.tl-item.is-highlight .tl-year { color: var(--gold-deep); }
.tl-item.is-highlight::before { background: var(--black); border-color: var(--gold); }
@media (max-width: 560px) {
  .timeline-list::before { left: .5rem; }
  .tl-item { grid-template-columns: 1fr; padding-left: 1.8rem; row-gap: .15rem; }
  .tl-item::before { left: .5rem; top: .55rem; }
  .tl-year { text-align: left; padding-top: 0; }
}

/* Trainingszeiten */
.training { margin: 2rem 0; }
.training-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.training-grid.is-single { grid-template-columns: 1fr; }
.training-card { background: #fff; padding: 1.1rem 1.3rem 1.2rem; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); border-top: 6px solid var(--gold); }
.training-card h3 { margin: 0 0 .7rem; font-size: 1.2rem; }
.training-week, .training-upcoming { list-style: none; margin: 0; padding: 0; }
.training-week li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .8rem; padding: .55rem 0; border-top: 1px solid var(--line); }
.training-week li:first-child { border-top: 0; padding-top: 0; }
.tw-day { font-weight: 700; flex: 1 1 9rem; }
.training-footnote { margin: .6rem 0 0; color: var(--muted); font-size: .9rem; }
.tw-time { text-align: right; font-family: var(--display, "Barlow Condensed", sans-serif); font-style: italic; font-weight: 800; font-size: 1.35rem; }
.tw-note { flex-basis: 100%; color: var(--muted); font-size: .9rem; }
.training-next { background: var(--coal); color: #fff; }
.training-next h3 { color: #fff; }
.training-upcoming li { display: flex; align-items: center; gap: 1rem; padding: .5rem 0; border-top: 1px solid rgba(255,255,255,.14); }
.training-upcoming li:first-child { border-top: 0; padding-top: 0; }
.training-upcoming time { display: flex; flex-direction: column; align-items: center; min-width: 3.6rem; line-height: 1.05; }
.training-upcoming time strong { font-family: var(--display, "Barlow Condensed", sans-serif); font-style: italic; font-weight: 800; font-size: 1.5rem; color: var(--gold); }
.training-upcoming time span { font-size: .8rem; color: #cfcfcf; }
.tu-time { font-weight: 600; }
.tu-game { font-style: normal; background: var(--gold); color: var(--black); font-size: .78rem; font-weight: 700; padding: .1rem .45rem; }
.training-more { display: inline-block; margin-top: .7rem; color: var(--gold); font-weight: 700; }
@media (max-width: 760px) { .training-grid { grid-template-columns: 1fr; } }

/* Startseite: Heimspiele – 8 bei vier Spalten, sonst 6 */
.game-list { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1099px) { .game-list { grid-template-columns: repeat(3, 1fr); } .game-item:nth-child(n+7) { display: none; } }
@media (max-width: 799px) { .game-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 519px) { .game-list { grid-template-columns: 1fr; } }

/* Kontaktbox */
.contactbox { position: relative; margin: 2rem 0; padding: 1.6rem 1.8rem 1.6rem 2.4rem; background: var(--coal); color: #fff; display: grid; grid-template-columns: 1fr auto; gap: 1.2rem 2rem; align-items: center; box-shadow: 0 14px 30px -18px rgba(20,40,60,.6); }
.contactbox::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 12px; background: var(--gold); clip-path: polygon(0 0, 100% 0, 60% 100%, 0 100%); }
.cb-title { margin: 0; font-size: 2rem; color: #fff; }
.cb-text { margin: .3rem 0 0; color: #e3e3e3; max-width: 36rem; }
.cb-actions { display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; }
.cb-mail { margin: 0; }
.cb-addr, .cb-phone { color: #d7d7d7; font-size: .95rem; }
.cb-phone { color: var(--gold); font-weight: 700; }
.cb-persons { grid-column: 1 / -1; list-style: none; margin: .4rem 0 0; padding: 1rem 0 0; border-top: 1px solid rgba(255,255,255,.16); display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1rem; }
.cb-persons li { display: flex; gap: .8rem; align-items: center; }
.cb-persons div { display: flex; flex-direction: column; line-height: 1.35; }
.cb-role { color: #bdbdbd; font-size: .88rem; }
.cb-persons a { color: var(--gold); font-size: .92rem; }
.cb-photo { width: 56px; height: 56px; object-fit: cover; border-radius: 50%; }
@media (max-width: 700px) { .contactbox { grid-template-columns: 1fr; padding: 1.3rem 1.2rem 1.3rem 1.9rem; } }

/* Breite Bausteine dürfen auf Mannschaftsseiten die volle Breite nutzen */
.body-flow { display: flow-root; }
.body-flow > * { max-width: var(--narrow); }
.body-flow > .block-training, .body-flow > .block-cards, .body-flow > .block-contactbox, .body-flow > .block-calendar, .body-flow > .block-timeline { max-width: none; }

/* Menü: dritte Ebene */
.main-nav .sub .has-sub > a::after { content: "›"; float: right; margin-left: 1.2rem; }
.main-nav .sub .sub { top: calc(-.3rem - 4px); left: 100%; right: auto; min-width: 200px; }
.nav-right .sub .sub { left: auto; right: 100%; }
@media (max-width: 1320px) {
  .main-nav .sub .has-sub > a::after { content: "+"; }
  .main-nav .sub .sub { padding-left: 1rem; }
}
.main-nav .sub .sub { background: #2a2a2b; box-shadow: 8px 10px 26px rgba(0,0,0,.45); }
@media (max-width: 1320px) { .main-nav .sub .sub { background: none; box-shadow: none; } }

/* Karten */
.cards { margin: 2rem 0; }
.cards-title { margin: 0 0 .4rem; }
.cards-intro { margin: 0 0 1rem; color: var(--muted); max-width: 46rem; }
.cards-grid { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); counter-reset: none; }
.cards-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.cards-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cards-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
.card-item { position: relative; background: #fff; padding: 1.1rem 1.3rem 1.2rem; border-top: 6px solid var(--gold); box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); }
.card-item h3 { margin: 0 0 .5rem; font-size: 1.3rem; }
.card-text > :first-child { margin-top: 0; }
.card-text > :last-child { margin-bottom: 0; }
.card-text ul { padding-left: 1.1rem; margin: .4rem 0; }
.card-text li { margin: .25rem 0; }
.is-numbered .card-item { padding-top: 1.6rem; }
.card-no { position: absolute; top: -1.15rem; left: 1rem; min-width: 2.6rem; padding: .05rem .8rem .05rem .6rem; background: var(--black); color: var(--gold); font-family: var(--display, "Barlow Condensed", sans-serif); font-style: italic; font-weight: 800; font-size: 1.9rem; line-height: 1.25; clip-path: var(--slant); }
.is-compact .cards-grid { gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.is-compact .card-item { padding: .7rem 1rem; border-top: 0; border-left: 5px solid var(--gold); }
.is-compact .card-item h3 { margin: 0; font-size: 1.05rem; }
@media (max-width: 900px) { .cards-grid.cols-3, .cards-grid.cols-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cards-grid.cols-2, .cards-grid.cols-3, .cards-grid.cols-4 { grid-template-columns: minmax(0, 1fr); } .is-compact .cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.card-item { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
.body-flow > .block-cards, .body-flow > .block-accordion { margin-bottom: 2rem; }

/* Breite Seiten: Textblöcke nutzen die volle Breite */
.body-flow > .block-paragraph, .body-flow > .block-accordion, .body-flow > .block-documents, .body-flow > .block-image { max-width: none; }
.body-flow > .block-paragraph { font-size: 1.05rem; }
.body-flow > .block-accordion { margin-bottom: 2rem; }

.main-nav a.nolink { cursor: default; }
.body-flow > .block-image.align-center figcaption { text-align: center; }
.block-image.align-center figcaption { text-align: center; }

/* 404 */
.e404 { background: var(--black); color: #fff; padding: 3rem 0 4rem; text-align: center; }
.e404-inner { display: flex; flex-direction: column; align-items: center; }
.e404-rink { width: min(100%, 640px); }
.e404-rink svg { width: 100%; height: auto; display: block; }
.e404-puck { transform: translate(60px, 110px); animation: e404-slide 3.2s cubic-bezier(.2,.7,.3,1) infinite; }
.e404-trail { stroke-dashoffset: 0; }
@keyframes e404-slide { 0% { transform: translate(60px, 110px); } 55% { transform: translate(560px, 110px); } 62% { transform: translate(540px, 118px); } 100% { transform: translate(540px, 118px); } }
@media (prefers-reduced-motion: reduce) { .e404-puck { animation: none; transform: translate(540px, 118px); } }
.e404-score { margin: 1.4rem 0 0; }
.e404-score span { font-family: var(--display); font-style: italic; font-weight: 800; font-size: clamp(5rem, 18vw, 10rem); line-height: 1; color: var(--gold); letter-spacing: .04em; }
.e404 h1 { color: #fff; margin: 0 0 .6rem; font-size: clamp(2.2rem, 6vw, 3.4rem); }
.e404-lead { max-width: 36rem; font-size: 1.15rem; margin: 0 0 .4rem; }
.e404-note { color: #c4ccd2; font-style: italic; margin: 0 0 1.6rem; }
.e404-actions { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: center; margin: 0 0 2.2rem; }
.e404-actions .btn-ghost { background: #2a2a2b; }
.e404-actions .btn-ghost:hover { background: var(--gold); }
.e404-search label { display: block; margin-bottom: .5rem; color: #c4ccd2; }
.e404-search span { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; }
.e404-search input { font: inherit; padding: .55rem .9rem; min-width: min(18rem, 80vw); border: 2px solid var(--gold); background: #fff; color: var(--black); }

/* Untermenü: aktuelle Seite (und ihre Eltern) mit gelbem Balken links */
.main-nav .sub a { border-left: 5px solid transparent; }
.main-nav .sub a[aria-current="page"] { border-left-color: var(--gold); background: rgba(247, 181, 23, .14); }
.main-nav .sub a[aria-current="page"]:hover { background: var(--gold); border-left-color: var(--black); }
.body-flow > .block-gallery { max-width: none; }

/* BEV-Tabelle und Spielplan */
.bev-table th.num, .bev-table td.num { text-align: right; white-space: nowrap; }
.bev-table thead th { background: var(--black); color: var(--gold); font-family: var(--display); font-style: italic; text-transform: uppercase; padding: .5rem .7rem; text-align: left; }
.bev-table td { padding: .45rem .7rem; border-bottom: 1px solid var(--line); }
.bev-table tr.own td { background: #fff7dc; font-weight: 700; box-shadow: none; }
.bev-table tr.own td:first-child { box-shadow: inset 5px 0 0 var(--gold); }
.bev-sub { margin: 1.4rem 0 .5rem; font-size: 1.25rem; }
.bev-games table { min-width: 0; }
.bev-games td { padding: .55rem .8rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
.bev-games .when { white-space: nowrap; width: 9.5rem; }
.bev-games .teams i { color: var(--gold); font-style: normal; padding: 0 .25rem; }
.bev-games .teams .own { font-weight: 800; }
.bev-games .score { text-align: right; font-size: 1.3rem; white-space: nowrap; }
.bev-games .score small { font-size: .75rem; color: var(--muted); }
.bev-games tr.win td:first-child { box-shadow: inset 5px 0 0 #2e9d3a; }
.bev-games tr.loss td:first-child { box-shadow: inset 5px 0 0 #c43b3b; }
.bev-games tr.moved .when { text-decoration: line-through; }
.bev-all { margin: 1.4rem 0; }
.bev-all summary { cursor: pointer; font-weight: 800; padding: .6rem 0; }
.muted { color: var(--muted); }
.bev-table table { table-layout: auto; min-width: 0; }
.bev-table th.num, .bev-table td.num { width: 4.5rem; padding-left: .4rem; padding-right: .6rem; }
.bev-table td:nth-child(2), .bev-table th:nth-child(2) { width: auto; }
.bev-table th:first-child, .bev-table td:first-child { width: 3rem; }
.bev-games table { table-layout: auto; }
.bev-table td + td, .bev-table th + th, .bev-games td + td { min-width: 0; }
.bev-games .score .thirds { display: inline-block; margin-top: .15rem; font-size: .8rem; font-weight: 400; letter-spacing: .02em; }

/* Teambild: breiter als die Textspalte, mittig, mit Schatten */
.block-image.size-team { width: min(1200px, 100vw - 2.5rem); position: relative; left: 50%; transform: translateX(-50%); margin-top: 2rem; margin-bottom: 2rem; }
.block-image.size-team img { width: 100%; box-shadow: 0 14px 34px -18px rgba(18,18,18,.55); border-bottom: 5px solid var(--gold); }
.block-image.size-team figcaption { text-align: center; }

/* Platzhalter, solange ein Spieler noch kein Foto hat: Vereinslogo auf dunklem Eis */
.player .player-placeholder { display: grid; place-items: center; aspect-ratio: 5/6; width: 100%; background: radial-gradient(120% 90% at 50% 38%, #3a3a3c 0%, var(--coal, #1e1e1f) 62%, #121212 100%); }
.player .player-placeholder img { width: 64%; height: auto; aspect-ratio: auto; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0,0,0,.55)); }

/* Rückennummer als gelbe Plakette unten rechts im Bild, linke Kante abgeschrägt */
.player-media { position: relative; }
.player .player-media .nr {
  position: absolute; right: 0; bottom: 0; top: auto; transform: none; pointer-events: none;
  background: var(--gold); color: var(--black); padding: .1rem .75rem .05rem 1.5rem;
  font-size: 2.1rem; line-height: 1.1; min-width: 3.6rem; text-align: right;
  clip-path: polygon(.9rem 0, 100% 0, 100% 100%, 0 100%);
}

/* Laufband „Unsere Unterstützer“ (Startseite): nur so breit wie der Inhalt, an den Rändern ausgeblendet */
.supporters { margin: 3rem 0 2rem; }
.supporters h2 { margin-bottom: 1rem; }
.supporters-track { display: flex; overflow: hidden; background: #fff; border-radius: 8px; padding-block: 1rem; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.supporters-list { display: flex; flex-shrink: 0; align-items: center; gap: 1.5rem; padding: 0 .75rem; margin: 0; list-style: none; animation: supporters-scroll 70s linear infinite; }
.supporters-track:hover .supporters-list, .supporters-track:focus-within .supporters-list { animation-play-state: paused; }
.supporters-list li { flex: 0 0 auto; width: 150px; height: 76px; display: flex; align-items: center; justify-content: center; }
.supporters-list a { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; }
.supporters-list img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.supporters-more { margin-top: .75rem; }
@keyframes supporters-scroll { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .supporters-track { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .supporters-list { animation: none; }
  .supporters-list[aria-hidden="true"] { display: none; }
}

/* Umflossenes Bild am Seitenanfang (z. B. Logo): die erste Überschrift darf daneben stehen, statt unter das Bild zu rutschen */
.w-block-image:has(> .block-image.align-left, > .block-image.align-right) + .w-block-paragraph .prose > h2:first-child { clear: none; margin-top: 0; }
.block-image.align-left img, .block-image.align-right img { box-shadow: 0 10px 24px -16px rgba(18,18,18,.45); }
.block-image.align-right img { margin-left: auto; }
/* Kleine umflossene Bilder (z. B. Logos) nehmen nur so viel Platz wie das Bild selbst, größere höchstens die bisherige Breite */
@media (min-width: 700px) {
  .w-block-image > .block-image.align-left[class], .w-block-image > .block-image.align-right[class] { width: fit-content; max-width: min(48%, 400px); }
}

/* Download-Box (z. B. Sponsorenmappe) */
.downloadbox { position: relative; margin: 2rem 0; padding: 1.6rem 1.8rem 1.6rem 2.4rem; background: var(--coal); color: #fff; display: grid; grid-template-columns: 170px 1fr; gap: 1.4rem 2rem; align-items: center; box-shadow: 0 14px 30px -18px rgba(20,40,60,.6); }
.downloadbox::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 12px; background: var(--gold); clip-path: polygon(0 0, 100% 0, 60% 100%, 0 100%); }
.downloadbox:not(:has(.db-cover)) { grid-template-columns: 1fr; }
.db-cover { display: block; box-shadow: 0 10px 24px -8px rgba(0,0,0,.7); transition: transform .2s ease; }
.db-cover:hover { transform: translateY(-3px); }
.db-cover img { display: block; width: 100%; height: auto; }
.db-title { margin: 0; font-size: 2rem; color: #fff; }
.db-text { margin: .5rem 0 0; color: #e3e3e3; max-width: 38rem; }
.db-list { margin: .8rem 0 0; padding-left: 1.2rem; color: #e3e3e3; }
.db-list li::marker { color: var(--gold); }
.db-action { margin: 1.1rem 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; }
.db-meta { color: #bdbdbd; font-size: .9rem; }
.db-contact { margin: .8rem 0 0; color: #bdbdbd; font-size: .92rem; }
.db-contact a { color: var(--gold); }
@media (max-width: 700px) { .downloadbox { grid-template-columns: 1fr; padding: 1.3rem 1.2rem 1.3rem 1.9rem; } .db-cover { max-width: 190px; } }

/* Eigenes Mannschaftslogo im Platzhalter (meist dunkle Logos): heller Hintergrund, weißer Logo-Rand verschwindet */
.player .player-placeholder-own { background: radial-gradient(120% 90% at 50% 38%, #ffffff 0%, #f1f1ee 70%, #e3e3df 100%); }
.player .player-placeholder-own img { width: 80%; filter: none; mix-blend-mode: multiply; }


/* Spielseite (Archiv) */
.mc-hero { background: var(--black); color: #fff; padding: 2rem 0 1.8rem; border-bottom: 5px solid var(--gold); position: relative; overflow: hidden; }
.mc-hero::after { content: ""; position: absolute; right: -60px; top: 0; bottom: 0; width: 300px; background: var(--gold); transform: skewX(-20deg); opacity: .1; }
.mc-hero .wrap { position: relative; z-index: 1; }
.mc-meta { margin: 0 0 1rem; color: #cfcfcf; font-size: .95rem; }
.mc-board { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.2rem; }
.mc-team { font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: clamp(1.3rem, 3.6vw, 2.4rem); line-height: 1.05; color: #d9d9d9; }
.mc-home { text-align: right; }
.mc-team.is-us { color: #fff; }
.mc-team.is-us::after { content: ""; display: block; height: 4px; width: 56px; background: var(--gold); margin-top: .45rem; }
.mc-home.is-us::after { margin-left: auto; }
.mc-score { font-family: var(--display); font-style: italic; font-weight: 800; font-size: clamp(2.8rem, 9vw, 5.6rem); line-height: 1; display: flex; align-items: center; gap: .35em; color: var(--gold); }
.mc-score i { font-style: normal; color: #7a7a7a; font-size: .7em; }
.mc-vs { font-size: .5em; color: #9a9a9a; }
.mc-periods-wrap { margin: 1.2rem 0 0; }
.mc-periods { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin: 0; font-family: var(--display); font-style: italic; font-size: 1.3rem; }
.mc-periods span { background: rgba(255,255,255,.08); padding: .25rem .8rem; }
.mc-periods small { display: block; font-family: var(--body, inherit); font-style: normal; font-size: .7rem; color: #b0b0b0; letter-spacing: .02em; }
/* eigene, zentrierte Zeile statt im Drittel-Flex, sonst verschiebt die zusätzliche Badge die Drittelergebnisse nach links */
.mc-ending-row { text-align: center; margin: .6rem 0 0; }
.mc-ending { display: inline-block; background: var(--gold); color: #111; font-size: 1rem; font-family: var(--display); font-style: italic; font-weight: 800; padding: .25rem .9rem; }
.mc-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.4rem; margin: 1.1rem 0 0; color: #bdbdbd; font-size: .92rem; }
.mc-table { margin: 1.2rem 0; overflow-x: auto; background: #fff; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); }
.mc-table table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.mc-table caption { text-align: left; padding: .7rem 1rem; background: var(--black); color: var(--gold); font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.15rem; }
.mc-table th { text-align: center; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #6d6d6d; padding: .5rem .6rem; border-bottom: 2px solid var(--gold); }
.mc-table td { text-align: center; padding: .5rem .6rem; border-bottom: 1px solid var(--line); color: #b5b5b5; }
.mc-table td.on { color: #111; font-weight: 700; }
.mc-table td.pts.on { color: #111; background: rgba(247, 181, 23, .22); }
.mc-table .nr { width: 3.2rem; text-align: left; padding-left: 1rem; color: #7a7a7a; font-family: var(--display); font-style: italic; font-size: 1.05rem; }
.mc-table .name { text-align: left; color: #111; font-weight: 600; width: 100%; }
.mc-table tr.has-pts td.name { box-shadow: inset 4px 0 0 var(--gold); }
.mc-sum { color: #555; margin: .6rem 0 1.4rem; }
@media (max-width: 640px) { .mc-board { grid-template-columns: 1fr; text-align: center; gap: .5rem; } .mc-home { text-align: center; } .mc-home.is-us::after { margin-left: auto; margin-right: auto; } .mc-team.is-us::after { margin-left: auto; margin-right: auto; } .mc-score { justify-content: center; } }

/* schlanke Zeile mit Teams + Ergebnis, die beim Scrollen unter der Navigation hängen bleibt */
.mc-sticky {
  position: sticky; top: 72px; z-index: 40; background: var(--black); border-bottom: 3px solid var(--gold); box-shadow: 0 10px 18px -12px rgba(0,0,0,.5);
  transform: translateY(-100%); opacity: 0; transition: transform .2s ease, opacity .2s ease;
}
.mc-sticky.is-visible { transform: translateY(0); opacity: 1; }
@media (prefers-reduced-motion: reduce) { .mc-sticky { transition: none; } }
.mc-sticky-row { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: .55rem 0; }
.mc-sticky-team { font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.05rem; color: #9a9a9a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 38%; }
.mc-sticky-team.is-us { color: #fff; }
.mc-sticky-score { font-family: var(--display); font-style: italic; font-weight: 800; font-size: 1.3rem; color: var(--gold); white-space: nowrap; }
@media (max-width: 1320px) { .mc-sticky { top: 64px; } }
@media (max-width: 600px) { .mc-sticky-row { font-size: .85rem; gap: .5rem; } .mc-sticky-team { font-size: .88rem; max-width: 34%; } .mc-sticky-score { font-size: 1.05rem; } }

.mc-officials { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 2rem; margin: 1.1rem 0 0; }
.mc-officials div { text-align: center; }
.mc-officials dt { font-size: .72rem; color: #9a9a9a; }
.mc-officials dd { margin: 0; color: #e8e8e8; font-weight: 600; }
.mc-table td.pen { white-space: nowrap; }
.mc-table td.pen small { color: #777; font-weight: 400; }
.mc-events td, .mc-stats td { color: #333; }
.mc-events td.on, .mc-stats td.on { font-weight: 700; color: #111; }
.mc-events small { color: #777; font-weight: 400; }
.mc-events td.name { width: auto; }
.mc-stats .name { width: auto; }
.mc-events td.assist, .mc-events th.assist { white-space: nowrap; padding-right: 1rem; }
.mc-events td.name:not(.assist) { width: 100%; }

/* Teamstatistik: Vergleichsbalken */
.mc-stats-card { background: #fff; box-shadow: 0 10px 24px -16px rgba(20,40,60,.4); padding: 1.4rem 1.4rem 1.6rem; margin: 1.2rem 0; }
.mc-stats-head { display: flex; justify-content: space-between; font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.1rem; color: var(--black); padding-bottom: .7rem; margin-bottom: .6rem; border-bottom: 2px solid var(--gold); }
.mc-stats-head span:last-child { color: #8a8a8a; }
.mc-stat-row { display: grid; grid-template-columns: 1fr minmax(10rem, auto) 1fr; align-items: center; gap: .9rem; padding: .6rem 0; }
/* beide Spuren sind immer Flex-Container, sonst ignoriert der Balken (ein <span>) sein width – nur "us" bekam das vorher */
.mc-stat-track { height: 9px; border-radius: 5px; background: #eef0f2; overflow: hidden; display: flex; }
.mc-stat-track.us { justify-content: flex-end; }
.mc-stat-fill { height: 100%; border-radius: 5px; }
.mc-stat-fill.us { background: linear-gradient(90deg, var(--gold-deep), var(--gold)); }
.mc-stat-fill.them { background: #9a9a9a; }
.mc-stat-mid { text-align: center; }
.mc-stat-nums { display: flex; justify-content: space-between; font-family: var(--display); font-style: italic; font-weight: 800; font-size: 1.25rem; color: var(--black); gap: 1rem; }
.mc-stat-name { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: #8a8a8a; margin-top: .1rem; }

/* Teamstatistik + Spielverlauf nebeneinander: der Verlauf nutzt den Platz, der vorher rechts leer blieb,
   die Teamstatistik wird zur schlankeren Seitenspalte. */
@media (min-width: 900px) {
  .mc-insights { display: grid; grid-template-columns: minmax(0, 1fr) 320px; grid-template-areas: "timeline stats"; align-items: start; gap: 0 2.2rem; }
  .mc-insights-timeline { grid-area: timeline; }
  .mc-insights-stats { grid-area: stats; position: sticky; top: 84px; }
  .mc-insights-stats .mc-stats-card { padding: 1.1rem 1.1rem 1.3rem; }
  .mc-insights-stats .mc-stat-row { grid-template-columns: 1fr 1fr; grid-template-areas: "mid mid" "us them"; row-gap: .4rem; }
  .mc-insights-stats .mc-stat-mid { grid-area: mid; }
  .mc-insights-stats .mc-stat-track.us { grid-area: us; }
  .mc-insights-stats .mc-stat-track.them { grid-area: them; }
}

/* Spielverlauf: Zeitleiste aus Toren und Strafen */
.mc-timeline { list-style: none; margin: 1.2rem 0 1.6rem; padding: 0; position: relative; }
.mc-timeline::before { content: ""; position: absolute; left: 2.6rem; top: .4rem; bottom: .4rem; width: 2px; background: var(--line); }
.mc-tl-period { font-family: var(--display); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.1rem; color: #fff; background: var(--black); display: inline-block; padding: .25rem 1rem .25rem 2.9rem; margin: 1.1rem 0 .4rem; position: relative; }
.mc-tl-period:first-child { margin-top: 0; }
.mc-tl-event { display: grid; grid-template-columns: 2.4rem 1.6rem 1fr; align-items: start; gap: 0 .9rem; padding: .55rem 0; position: relative; }
.mc-tl-time { font-family: var(--display); font-style: italic; font-weight: 700; color: #8a8a8a; font-size: .95rem; text-align: right; padding-top: .1rem; }
.mc-tl-dot { width: 1.6rem; height: 1.6rem; border-radius: 50%; background: #fff; border: 2px solid var(--line); display: flex; align-items: center; justify-content: center; font-size: .7rem; color: #aaa; z-index: 1; }
.mc-tl-goal .mc-tl-dot { border-color: var(--gold); color: var(--gold-deep); background: #fff8e6; }
.mc-tl-goal.is-us .mc-tl-dot { background: var(--gold); color: var(--black); border-color: var(--gold-deep); }
.mc-tl-penalty .mc-tl-dot { border-color: #c0392b; color: #c0392b; background: #fdecea; font-size: .75rem; }
.mc-tl-body { padding-top: .05rem; color: #333; }
.mc-tl-score { font-family: var(--display); font-style: italic; font-weight: 800; color: var(--black); margin-right: .5rem; }
.mc-tl-sub, .mc-tl-team { display: block; font-size: .82rem; color: #8a8a8a; }
.mc-tl-tag { display: inline-block; font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; background: #eef0f2; color: #666; border-radius: 3px; padding: .05rem .4rem; margin-left: .4rem; }
.mc-tl-tag.mc-tl-pen { background: #fdecea; color: #c0392b; }
.mc-tl-event.is-us .mc-tl-score, .mc-tl-event.is-us strong { color: var(--black); }
.mc-tl-event:not(.is-us) .mc-tl-body { opacity: .78; }

/* Spielerwerte: kleines Spielerfoto, beim Hover (bzw. Fokus) größer */
.mc-player-photo { position: relative; display: inline-block; vertical-align: middle; margin-right: .5rem; line-height: 0; }
.mc-pp-thumb { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; display: block; border: 1px solid var(--line); }
.mc-pp-big {
  position: absolute; left: -.3rem; top: 50%; width: 132px; height: 132px; max-width: none; border-radius: 50%; object-fit: cover;
  object-position: center 22%;
  border: 3px solid #fff; box-shadow: 0 16px 30px -12px rgba(20,20,20,.5); z-index: 30; pointer-events: none;
  transform: translateY(-50%) scale(.3); transform-origin: left center; opacity: 0;
  transition: transform .15s ease, opacity .15s ease;
}
/* die globale "img { max-width: 100%; height: auto }"-Regel darf das große Foto nicht wieder auf die winzige
   Thumbnail-Spaltenbreite zusammenstauchen (sonst wird daraus ein schmaler, verzerrter Streifen). */
.mc-player-photo:hover .mc-pp-big, .mc-player-photo:focus-within .mc-pp-big { opacity: 1; transform: translateY(-50%) scale(1); }
@media (prefers-reduced-motion: reduce) { .mc-pp-big { transition: none; } }
/* kein Kaderfoto hinterlegt: Kreis mit Vereinslogo statt Leerstelle */
.mc-pp-placeholder { background: var(--black); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.mc-pp-placeholder img { width: 68%; height: 68%; object-fit: contain; filter: drop-shadow(0 1px 2px rgba(0,0,0,.4)); }

/* Torhüter, die im Kader waren, aber nicht eingesetzt wurden */
.mc-table tr.is-unused td { color: #b5b5b5; }
.mc-table tr.is-unused td.name { color: #6d6d6d; font-weight: 500; }
.mc-unused { font-weight: 400; color: #9a9a9a; font-size: .82rem; }

/* Spielplan: Vereinslogos statt generischer Tabelle */
.sched-list { display: flex; flex-direction: column; gap: 2px; margin: 1rem 0; }
.sched-row { position: relative; display: grid; grid-template-columns: 6.5rem minmax(0,1fr) 6rem minmax(0,1fr) auto; align-items: center; gap: .3rem .9rem; background: #fff; padding: .7rem 1rem; box-shadow: 0 1px 0 var(--line); transition: background .12s; }
.sched-row.is-win { box-shadow: inset 4px 0 0 #2e9d3a, 0 1px 0 var(--line); }
.sched-row.is-loss { box-shadow: inset 4px 0 0 #c43b3b, 0 1px 0 var(--line); }
.sched-row.has-link:hover { background: #f4f6f8; }
.sched-link { position: absolute; inset: 0; z-index: 1; }
.sched-date { font-family: var(--display); font-style: italic; font-weight: 700; color: #6d6d6d; font-size: .9rem; line-height: 1.2; }
.sched-date small { display: block; font-family: var(--body, inherit); font-style: normal; font-weight: 400; color: #9a9a9a; font-size: .78rem; }
.sched-team { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.sched-home { justify-content: flex-end; text-align: right; }
.sched-away { justify-content: flex-start; text-align: left; }
.sched-name { font-weight: 600; color: #222; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sched-logo { width: 30px; height: 30px; max-width: none; border-radius: 50%; object-fit: contain; background: #f4f6f8; border: 1px solid var(--line); flex: none; }
.sched-logo-ph { display: flex; align-items: center; justify-content: center; background: var(--black); color: var(--gold); font-family: var(--display); font-style: italic; font-weight: 800; font-size: .95rem; }
.sched-score { text-align: center; font-family: var(--display); font-style: italic; font-weight: 800; font-size: 1.15rem; color: var(--black); }
.sched-score .sched-vs { color: #9a9a9a; font-size: .9rem; font-style: italic; }
.sched-score small { display: block; font-family: var(--body, inherit); font-style: normal; font-weight: 400; font-size: .72rem; color: #9a9a9a; }
.sched-meta { text-align: right; font-size: .82rem; color: #8a8a8a; white-space: nowrap; }
@media (max-width: 760px) {
  .sched-row { grid-template-columns: 1fr auto 1fr; grid-template-areas: "home score away" "date date meta"; row-gap: .3rem; }
  .sched-date { grid-area: date; }
  .sched-home { grid-area: home; }
  .sched-score { grid-area: score; }
  .sched-away { grid-area: away; }
  .sched-meta { grid-area: meta; }
  .sched-name { font-size: .88rem; }
}