:root{
  --navy-950:#0b1c40;
  --navy-900:#122552;
  --navy-800:#182f68;
  --blue-700:#1d4093;
  --blue-500:#3a5db4;
  --sky-400:#8aa6dc;
  --sky-300:#b7c8ea;
  --paper:#f6f8fb;
  --paper-2:#ebf1f9;
  --ink:#101826;
  --ink-soft:#48566b;
  --line: rgba(16,24,38,0.12);
  --radius-s: 3px;
  --maxw: 1120px;
}
*{box-sizing:border-box;}
/* Verlässlich versteckt halten: manche Klassen (z. B. .btn mit display:inline-block) haben
   dieselbe Spezifität wie das native [hidden] und würden es sonst je nach Reihenfolge überschreiben. */
[hidden]{display:none !important;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Work Sans', sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Fraunces', serif;
  color:var(--navy-950);
  line-height:1.08;
  margin:0;
  font-weight:600;
}
a{color:inherit;}
img{max-width:100%; display:block;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
.badge{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; letter-spacing:.02em; color:var(--sky-300);
  border:1px solid var(--sky-300); border-radius:999px;
  padding:5px 14px; background:rgba(127,176,239,0.08);
}
.badge::before{content:"⛨"; font-size:14px;}

/* Header */
header{
  position:sticky; top:0; z-index:50;
  background:var(--navy-950);
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.nav{
  position:relative;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:nowrap; gap:20px;
  padding:14px 28px; max-width:var(--maxw); margin:0 auto;
}
.brand{
  display:flex; align-items:center; gap:12px;
  color:var(--paper); text-decoration:none; flex-shrink:0;
}
/* Wappen ragt unten über die Navbar hinaus (negativer unterer Rand = nimmt in der Leiste weniger Platz ein) */
.crest{
  position:relative; z-index:2;
  width:84px; height:116px;
  margin:-6px 0 -50px;
  flex-shrink:0;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,0.35));
}
.crest img{width:100%; height:100%; object-fit:contain;}
.brand-text{display:flex; flex-direction:column; line-height:1.2; white-space:nowrap;}
.brand-text strong{font-family:'Fraunces', serif; font-size:17px; font-weight:600;}
.brand-text span{font-size:11.5px; color:var(--sky-300); letter-spacing:.03em;}
nav.links{display:flex; align-items:center; gap:22px; font-size:14.5px; flex-wrap:nowrap;}
nav.links a{color:rgba(246,248,251,0.82); text-decoration:none; padding:4px 0; border-bottom:1px solid transparent; white-space:nowrap;}
nav.links a:hover{color:var(--paper); border-color:var(--sky-400);}
nav.links a.active{color:var(--paper); border-color:var(--sky-400);}
.nav-cta{
  background:var(--sky-400); color:var(--navy-950); text-decoration:none;
  padding:9px 18px; border-radius:var(--radius-s); font-weight:600; font-size:14.5px;
  white-space:nowrap; flex-shrink:0;
}
.nav-cta-mobile{display:none;}
.menu-btn{display:none; flex-shrink:0; background:none; border:none; color:var(--paper); font-size:26px; line-height:1; cursor:pointer; padding:4px 6px;}

/* Hero */
.hero{
  background:
    radial-gradient(1200px 500px at 15% -10%, rgba(127,176,239,0.16), transparent 60%),
    linear-gradient(180deg, var(--navy-950), var(--navy-900) 60%, var(--navy-800));
  color:var(--paper);
  padding:96px 0 80px;
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0; height:64px;
  background: repeating-linear-gradient(0deg, transparent 0 6px, rgba(255,255,255,0.035) 6px 7px);
  opacity:.6;
}
.hero-mark{
  position:absolute; right:-60px; top:50%; transform:translateY(-50%);
  width:420px; height:420px; opacity:.08; filter:brightness(0) invert(1);
  pointer-events:none;
}
.hero .wrap{position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center;}
.hero h1{font-size:clamp(2.4rem, 4.6vw, 3.6rem); color:var(--paper); margin:18px 0 20px;}
.hero p.lead{font-size:19px; color:rgba(246,248,251,0.82); max-width:46ch; margin-bottom:32px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.btn{
  display:inline-block; text-decoration:none; padding:13px 24px; border-radius:var(--radius-s);
  font-weight:600; font-size:15px; font-family:inherit; background:none; border:none; cursor:pointer;
}
.btn-primary{background:var(--sky-400); color:var(--navy-950);}
.btn-primary:hover{background:var(--sky-300);}
.btn-ghost{border:1px solid rgba(246,248,251,0.4); color:var(--paper);}
.btn-ghost:hover{border-color:var(--paper);}
.hero-stats{display:flex; flex-direction:column; gap:22px; border-left:1px solid rgba(255,255,255,0.15); padding-left:32px;}
.stat b{font-family:'Fraunces', serif; font-size:2.1rem; color:var(--sky-300); display:block; font-weight:600;}
.stat span{font-size:14px; color:rgba(246,248,251,0.72);}

section{padding:76px 0;}
.eyebrow-row{display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:36px; flex-wrap:wrap;}
.kicker{color:var(--blue-700); font-weight:600; font-size:14.5px;}
.section-title{font-size:clamp(1.7rem, 3vw, 2.3rem); max-width:22ch;}
.lede{color:var(--ink-soft); max-width:60ch; font-size:16px; margin-top:10px;}

/* Über uns */
.about{background:var(--paper-2);}
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
.about-grid p{color:var(--ink-soft); margin:0 0 16px;}
.quote{border-left:3px solid var(--blue-500); padding-left:22px; margin:28px 0; font-family:'Fraunces', serif; font-size:1.2rem; color:var(--navy-950); font-style:italic;}
.about-grid{align-items:center;}
.about-grid .quote{margin:0; font-size:1.35rem; line-height:1.4;}
.board-block{margin-top:64px;}
.board-block .section-title{max-width:none; margin-bottom:8px;}
.board-group-title{
  display:flex; align-items:center; gap:16px; margin:34px 0 16px;
  font-family:'Work Sans',sans-serif; font-size:12.5px; font-weight:600; color:var(--blue-700);
  text-transform:uppercase; letter-spacing:.06em;
}
.board-group-title::after{content:""; flex:1; height:1px; background:var(--line);}
.board-cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:16px;}
.board-card{
  display:flex; gap:14px; align-items:flex-start;
  background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:18px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.board-card:hover{border-color:var(--blue-500); box-shadow:0 4px 14px rgba(16,24,38,0.08);}
.board-avatar{
  flex-shrink:0; width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--navy-900); color:var(--sky-300);
  font-family:'Fraunces',serif; font-weight:600; font-size:16px; letter-spacing:.02em;
}
.board-avatar-photo{object-fit:cover; background:var(--paper-2);}
.board-card-body{min-width:0; display:flex; flex-direction:column; gap:2px;}
.board-role{font-size:11.5px; font-weight:600; color:var(--blue-700); text-transform:uppercase; letter-spacing:.04em; line-height:1.3;}
.board-name{font-family:'Fraunces',serif; font-weight:600; font-size:1.08rem; color:var(--navy-950); line-height:1.25;}
.board-mail{font-size:13px; color:var(--ink-soft); text-decoration:none; overflow-wrap:anywhere;}
.board-mail:hover{color:var(--blue-700); text-decoration:underline;}

/* Abteilungen */
.dept-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:20px;}
.dept{background:var(--paper); border:1px solid var(--line); border-top:4px solid var(--accent, var(--line)); border-radius:6px; padding:26px 26px 30px; min-height:190px; display:flex; flex-direction:column; gap:10px; text-decoration:none; color:inherit; transition:border-color .15s ease, box-shadow .15s ease;}
.dept:hover{border-color:var(--accent, var(--blue-500)); box-shadow:0 6px 18px rgba(16,24,38,0.10); transform:translateY(-2px);}
.dept .mark{font-family:'Fraunces', serif; color:var(--accent, var(--blue-500)); font-size:14px; font-weight:600;}
.dept h3{font-size:1.15rem;}
.dept p{color:var(--ink-soft); font-size:14.5px; margin:0; flex-grow:1; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.dept .who{font-size:13px; color:var(--blue-700); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.dept-link{font-size:13px; color:var(--blue-500); font-weight:600; text-decoration:none; margin-top:6px; display:inline-block;}
.dept-link:hover{text-decoration:underline;}

/* Aktuelles / News */
.news-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:24px; margin-top:36px;}
.news-more-link{display:inline-block; margin-top:32px;}
.pagination{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:40px;}
.pagination a, .pagination span{
  display:inline-flex; align-items:center; justify-content:center; min-width:38px; height:38px;
  padding:0 12px; border-radius:6px; font-size:14px; font-weight:600; text-decoration:none;
}
.pagination a{color:var(--blue-700); border:1px solid var(--line); background:var(--paper);}
.pagination a:hover{border-color:var(--blue-500); color:var(--blue-500);}
.pagination-current{background:var(--navy-950); color:var(--paper);}
.pagination-disabled{color:var(--ink-soft); opacity:.5;}
.pagination-info{color:var(--ink-soft); font-weight:500; padding:0 6px;}
.pagination-ellipsis{color:var(--ink-soft); min-width:auto !important; padding:0 2px !important; border:none !important;}
.pagination-jump{display:flex; align-items:center; gap:8px; margin-left:auto; font-size:14px; color:var(--ink-soft);}
.pagination-jump label{display:flex; align-items:center; gap:6px;}
.pagination-jump input[type="number"]{width:64px; height:38px; padding:0 10px; border:1px solid var(--line); border-radius:6px; font-size:14px; text-align:center;}
.pagination-jump-btn{
  height:38px; padding:0 16px; border-radius:6px; font-weight:600; font-size:14px; cursor:pointer;
  color:var(--blue-700); border:1px solid var(--line); background:var(--paper);
}
.pagination-jump-btn:hover{border-color:var(--blue-500); color:var(--blue-500);}
.news-card{background:var(--paper); border:1px solid var(--line); border-radius:6px; overflow:hidden; display:flex; flex-direction:column; text-decoration:none; color:inherit; transition:box-shadow .15s ease, border-color .15s ease;}
.news-card:hover{border-color:var(--blue-500); box-shadow:0 4px 14px rgba(16,24,38,0.08);}
.news-photo{width:100%; height:170px; object-fit:cover;}
.news-body{padding:24px;}
.news-date{font-size:13px; color:var(--blue-700); font-weight:600; margin-bottom:8px; display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.news-dept{font-size:11.5px; color:var(--ink-soft); font-weight:600; background:var(--paper-2); border:1px solid var(--line); border-radius:999px; padding:2px 10px;}
.news-author{font-size:12.5px; color:var(--ink-soft); font-weight:500;}
.news-card h3{font-size:1.05rem; margin-bottom:8px;}
.news-card p{color:var(--ink-soft); font-size:14.5px; margin:0;}
.empty-hint{color:var(--ink-soft); font-size:14.5px; font-style:italic;}

/* Mannschaften: Teaser auf der Startseite */
.team-teaser{display:grid; grid-template-columns:1fr auto; gap:40px; align-items:center; background:var(--paper-2); border:1px solid var(--line); border-radius:6px; padding:40px;}
.team-teaser .lede{margin:14px 0 22px; max-width:52ch;}
.team-teaser-photos{display:grid; grid-template-columns:repeat(3, 64px); gap:12px;}
.team-teaser-photo{width:64px; height:64px; border-radius:50%; overflow:hidden; display:flex; align-items:center; justify-content:center; background:var(--navy-950); box-shadow:0 0 0 2px var(--paper);}
.team-teaser-photo img{width:100%; height:100%; object-fit:cover;}
.team-teaser-photo .initial{color:var(--sky-300); font-family:'Fraunces', serif; font-weight:600; font-size:1.3rem;}

/* Mannschaften: Übersichtsseite */
.team-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:24px; margin-top:36px;}
.team-group-title{font-family:'Fraunces', serif; font-size:1.05rem; font-weight:600; color:var(--navy-950); margin-top:44px; padding-top:28px; border-top:1px solid var(--line);}
.team-group-title:first-of-type{margin-top:36px;}
.team-card{background:var(--paper); border:1px solid var(--line); border-radius:6px; overflow:hidden; display:flex; flex-direction:column; text-decoration:none; color:inherit; transition:box-shadow .15s ease, border-color .15s ease;}
.team-card:hover{border-color:var(--blue-500); box-shadow:0 4px 14px rgba(16,24,38,0.08);}
.team-photo{width:100%; height:190px; object-fit:cover; background:var(--paper-2);}
.team-photo-placeholder{background:linear-gradient(135deg, rgba(21,58,110,0.10), rgba(127,176,239,0.14));}
.team-body{padding:24px;}
.team-body .mark{font-family:'Fraunces', serif; color:var(--blue-500); font-size:14px; font-weight:600;}
.team-body h3{font-size:1.15rem; margin:6px 0 4px;}
.team-meta{color:var(--blue-700); font-size:13.5px; font-weight:600; margin:0 0 4px;}
.team-more{color:var(--blue-700); font-size:13px; font-weight:600; margin-top:10px; display:inline-block;}

/* Rechtliche Seiten (Impressum, Datenschutz) */
.legal-text{max-width:70ch; padding-top:44px; padding-bottom:56px;}
.legal-text h2{font-size:20px; margin-top:34px; margin-bottom:10px;}
.legal-text p{margin:0 0 16px;}
.legal-text ul{margin:0 0 16px; padding-left:22px;}
.legal-text li{margin-bottom:8px;}
.legal-text a{color:var(--blue-700); text-decoration:underline;}
.legal-meta{margin-top:32px; color:var(--ink-soft); font-size:14px;}

/* Mannschaften: Detailseite */
.page-header{background:linear-gradient(180deg, var(--navy-950), var(--navy-900)); color:var(--paper); padding:56px 0 44px;}
.page-header .kicker{color:var(--sky-300);}
.page-header .section-title{color:var(--paper); max-width:34ch;}
.page-header .lede{color:rgba(246,248,251,0.75); margin-top:12px; max-width:60ch;}
.page-header .filter-reset{display:inline-block; margin-top:18px; font-size:13.5px; color:var(--sky-300); text-decoration:none; border:1px solid rgba(255,255,255,0.3); padding:6px 14px; border-radius:999px;}
.page-header .filter-reset:hover{border-color:var(--paper); color:var(--paper);}
.news-filter{display:flex; flex-wrap:wrap; gap:16px; margin-top:26px;}
.news-filter label{display:flex; flex-direction:column; gap:5px; font-size:12.5px; color:rgba(246,248,251,0.7); font-weight:600; text-transform:uppercase; letter-spacing:.03em;}
.news-filter select, .news-filter input[type="date"]{
  font-size:14px; padding:9px 12px; border-radius:4px; border:1px solid rgba(255,255,255,0.3);
  background:rgba(255,255,255,0.08); color:var(--paper); font-family:inherit; min-width:200px;
  color-scheme:dark;
}
.news-filter input[type="date"]{min-width:160px;}
.news-filter select option{color:var(--ink);}
.news-filter select:hover, .news-filter input[type="date"]:hover{border-color:rgba(255,255,255,0.6);}
.kicker-link{color:inherit; text-decoration:underline; text-decoration-color:rgba(139,166,220,0.5);}
.kicker-link:hover{text-decoration-color:currentColor;}

/* News-Artikelseite */
.news-article{max-width:760px; margin:0 auto;}
.news-article-figure{margin:0 0 28px;}
.news-article-photo-btn{display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in;}
.news-article-photo-btn:hover img{opacity:0.92;}
.news-article-photo-btn:focus-visible{outline:2px solid var(--blue-500); outline-offset:3px; border-radius:8px;}
.news-article-figure img{width:100%; height:auto; max-height:640px; object-fit:contain; border-radius:8px; display:block; margin:0 auto; background:var(--paper-2);}
.news-article-figure figcaption{color:var(--ink-soft); font-size:13.5px; margin-top:8px; text-align:center;}
.news-article-body p{color:var(--ink-soft); font-size:17px; line-height:1.8; margin:0 0 16px;}
.news-attachments{margin:0 0 28px;}
.news-attachments a{display:inline-flex; align-items:center; gap:8px; color:var(--blue-700); text-decoration:none; font-weight:600; font-size:14.5px; background:var(--paper-2); border:1px solid var(--line); border-radius:6px; padding:10px 16px;}
.news-attachments a:hover{border-color:var(--blue-500);}
.doc-list{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px;}
.doc-list a{display:inline-flex; align-items:center; gap:8px; color:var(--blue-700); text-decoration:none; font-weight:600; font-size:14.5px; background:var(--paper-2); border:1px solid var(--line); border-radius:6px; padding:10px 16px;}
.doc-list a:hover{border-color:var(--blue-500);}
.team-detail-head-grid{display:grid; grid-template-columns:180px 1fr; gap:32px; align-items:center;}
.team-detail-photo{width:180px; height:180px; border-radius:12px; object-fit:cover; background:var(--paper-2); display:block;}
.team-detail-photo-btn{
  padding:0; border:0; background:none; cursor:zoom-in; border-radius:12px;
}
.team-detail-photo-btn:hover .team-detail-photo{opacity:0.9;}
.team-detail-photo-btn:focus-visible{outline:2px solid var(--blue-500); outline-offset:3px;}

.lightbox{
  position:fixed; inset:0; z-index:200;
  background:rgba(11,28,64,0.92);
  display:flex; align-items:center; justify-content:center;
  padding:40px;
}
.lightbox[hidden]{display:none;}
.lightbox img{max-width:100%; max-height:100%; border-radius:6px; box-shadow:0 20px 60px rgba(0,0,0,0.4);}
.lightbox-close{
  position:absolute; top:20px; right:24px;
  width:42px; height:42px; border-radius:50%; border:1px solid rgba(246,248,251,0.4);
  background:rgba(11,28,64,0.6); color:var(--paper); font-size:18px; cursor:pointer;
}
.lightbox-close:hover{border-color:var(--paper);}
.team-detail-body{display:grid; grid-template-columns:1fr 320px; gap:56px; align-items:start;}
.team-detail-text p{color:var(--ink-soft); margin:0 0 14px; font-size:16px; line-height:1.7;}
.team-facts-large{background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:26px; display:grid; gap:16px 0; margin:0;}
.team-facts-large .link-pills{margin-top:4px;}
.team-facts-large dt{font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); margin:0;}
.team-facts-large dd{margin:2px 0 0; font-weight:600; color:var(--navy-950); font-size:15px;}
.team-facts-large dd a{color:var(--blue-700); text-decoration:underline;}

/* Abteilungsseite */
.dept-facts{grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:22px 36px; max-width:820px;}
.dept-facts .fact{display:flex; flex-direction:column; gap:3px;}
.dept-sponsors-section{background:var(--paper-2);}
.sponsor-logos{display:flex; flex-wrap:wrap; gap:28px; margin-top:28px; align-items:center;}
.sponsor-logo{
  display:flex; align-items:center; justify-content:center;
  background:var(--paper); border:1px solid var(--line); border-radius:8px;
  padding:18px 28px; height:96px; min-width:160px;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.sponsor-logo:hover{border-color:var(--blue-500); box-shadow:0 4px 14px rgba(16,24,38,0.08);}
.sponsor-logo img{max-height:60px; max-width:220px; width:auto; object-fit:contain;}
.sponsor-name-fallback{font-family:'Fraunces', serif; font-weight:600; font-size:18px; color:var(--navy-950); text-align:center;}
.dept-links-section{background:var(--paper-2);}
.dept-infos{display:flex; flex-direction:column; gap:16px; max-width:920px; margin-top:8px;}
.dept-info{position:relative; background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:0 1px 2px rgba(16,24,38,.04); overflow:hidden; transition:box-shadow .3s ease, border-color .3s ease, transform .3s ease;}
.dept-info::before{content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--accent, var(--blue-700)); transform:scaleY(.35); transform-origin:center; opacity:.45; transition:transform .35s ease, opacity .35s ease;}
.dept-info:hover{border-color:var(--accent, var(--blue-500)); box-shadow:0 10px 30px rgba(16,24,38,.08);}
.dept-info.is-open{border-color:var(--accent, var(--blue-500)); box-shadow:0 14px 36px rgba(16,24,38,.10);}
.dept-info.is-open::before{transform:scaleY(1); opacity:1;}
.dept-info-head{all:unset; box-sizing:border-box; width:100%; display:flex; align-items:center; gap:18px; padding:22px 26px; cursor:pointer;}
.dept-info-head:focus-visible{outline:2px solid var(--blue-500); outline-offset:-4px; border-radius:18px;}
.dept-info-num{flex:none; font-family:'Fraunces',serif; font-weight:700; font-size:15px; letter-spacing:.04em; color:var(--accent, var(--blue-700)); background:var(--accent-bg, var(--paper-2)); width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;}
.dept-info-title{flex:1; min-width:0; font-family:'Fraunces',serif; font-weight:600; font-size:clamp(1.1rem,2.2vw,1.45rem); line-height:1.25; color:var(--navy-950);}
.dept-info-chev{flex:none; width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--navy-950); background:var(--paper-2); transition:transform .4s cubic-bezier(.3,1.4,.5,1), background .25s ease, color .25s ease;}
.dept-info-head:hover .dept-info-chev{background:var(--accent-bg, var(--paper-2)); color:var(--accent, var(--blue-700));}
.dept-info.is-open .dept-info-chev{transform:rotate(180deg); background:var(--accent, var(--blue-700)); color:#fff;}
.dept-info-panel{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.dept-info.is-open .dept-info-panel{grid-template-rows:1fr;}
.dept-info-inner{overflow:hidden; min-height:0;}
.dept-info-body{padding:2px 26px 28px 88px; color:var(--ink-soft); opacity:0; transform:translateY(-8px); transition:opacity .35s ease .05s, transform .35s ease .05s;}
.dept-info.is-open .dept-info-body{opacity:1; transform:none;}
.dept-info-body p{margin:0 0 14px; max-width:68ch;}
.dept-info-body a{color:var(--blue-700); font-weight:600; text-decoration:underline; text-decoration-color:rgba(29,64,147,.35); text-underline-offset:3px;}
.dept-info-body a:hover{text-decoration-color:currentColor;}
.dept-info-body ul{list-style:none; margin:0 0 16px; padding:0;}
.dept-info-body ul.info-steps{display:flex; flex-direction:column; gap:8px; max-width:68ch;}
.dept-info-body ul.info-steps li{background:var(--paper); border-left:3px solid var(--accent, var(--blue-700)); border-radius:6px; padding:10px 16px; color:var(--ink);}
.dept-info-body ul.chips{display:flex; flex-wrap:wrap; gap:8px;}
.dept-info-body ul.chips li{background:var(--accent-bg, var(--paper-2)); color:var(--navy-950); border-radius:999px; padding:6px 14px; font-size:14.5px; font-weight:500; transition:transform .2s cubic-bezier(.3,1.6,.5,1), background .2s ease, color .2s ease;}
.dept-info-body ul.chips li:hover{transform:translateY(-2px) scale(1.04); background:var(--accent, var(--blue-700)); color:#fff;}
@media (max-width:640px){
  .dept-info-head{padding:18px; gap:12px;}
  .dept-info-num{width:36px; height:36px; font-size:13px;}
  .dept-info-chev{width:34px; height:34px;}
  .dept-info-body{padding:2px 18px 22px;}
}
@media (prefers-reduced-motion: reduce){
  .dept-info, .dept-info::before, .dept-info-chev, .dept-info-panel, .dept-info-body, .dept-info-body ul.chips li{transition:none !important;}
}
.dept-links-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:48px;}
.link-pills{list-style:none; margin:18px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px;}
.link-pills li{display:contents;}
.link-pills a, .link-pills span{
  display:inline-block; background:var(--paper); border:1px solid var(--line); border-radius:999px;
  padding:8px 16px; font-size:14px; font-weight:600; text-decoration:none; color:var(--blue-700);
}
.link-pills a:hover{border-color:var(--blue-500); color:var(--blue-500);}
.link-pills span{color:var(--ink-soft); font-weight:500;}
.photo-gallery{display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:16px; margin-top:36px;}
.photo-gallery a{display:block; border-radius:6px; overflow:hidden; border:1px solid var(--line);}
.photo-gallery img{width:100%; height:150px; object-fit:cover; display:block; transition:transform .2s ease;}
.photo-gallery a:hover img{transform:scale(1.04);}

/* Termine */
.events{background:var(--navy-950); color:var(--paper);}
.events .kicker{color:var(--sky-300);}
.events .section-title{color:var(--paper);}
.events .lede{color:rgba(246,248,251,0.72);}
.event-list{margin-top:36px; border-top:1px solid rgba(255,255,255,0.15);}
.event-row{display:grid; grid-template-columns:120px 1fr auto; gap:24px; align-items:center; padding:20px 0; border-bottom:1px solid rgba(255,255,255,0.15);}
.event-date{font-family:'Fraunces', serif; color:var(--sky-300); font-size:1.05rem;}
.event-date small{display:block; color:rgba(246,248,251,0.6); font-family:'Work Sans',sans-serif; font-size:12px; margin-top:2px;}
.event-name{font-weight:600;}
.event-place{color:rgba(246,248,251,0.65); font-size:14px; margin-top:3px;}
.event-dept{font-size:12.5px; color:var(--navy-950); background:var(--sky-400); padding:5px 12px; border-radius:999px; font-weight:600; white-space:nowrap;}

/* Mitglied werden */
.join-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.steps{list-style:none; margin:26px 0 0; padding:0; display:flex; flex-direction:column; gap:18px;}
.steps li{display:flex; gap:16px;}
.steps .num{font-family:'Fraunces', serif; color:var(--blue-500); font-weight:600; font-size:1.1rem; width:34px; flex-shrink:0;}
.steps h4{margin:0 0 4px; font-size:16px; font-family:'Work Sans',sans-serif; font-weight:600;}
.steps p{margin:0; color:var(--ink-soft); font-size:14.5px;}
.join-card{background:var(--navy-950); color:var(--paper); border-radius:6px; padding:36px;}
.join-card h3{color:var(--paper); font-size:1.4rem; margin-bottom:10px;}
.join-card p{color:rgba(246,248,251,0.75); font-size:15px; margin-bottom:24px;}

/* Kontakt */
.contact{background:var(--paper-2);}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px;}
.contact-list{list-style:none; margin:26px 0 0; padding:0; display:flex; flex-direction:column; gap:20px;}
.contact-list li{display:flex; gap:16px; align-items:flex-start;}
.contact-list .ic{width:38px; height:38px; border-radius:50%; background:var(--navy-950); color:var(--sky-300); display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0;}
.contact-list b{display:block; font-size:15px;}
.contact-list span{color:var(--ink-soft); font-size:14.5px;}
.map-box{border:1px solid var(--line); border-radius:6px; height:100%; min-height:220px; overflow:hidden; background: linear-gradient(135deg, rgba(21,58,110,0.08), rgba(127,176,239,0.1)), repeating-linear-gradient(45deg, rgba(16,24,38,0.03) 0 12px, transparent 12px 24px); display:flex; align-items:center; justify-content:center; color:var(--ink-soft); font-size:14px; text-align:center;}
.map-box iframe{width:100%; height:100%; min-height:220px; border:0; display:block;}
.map-box .map-leaflet{width:100%; height:100%; min-height:220px;}
.map-box-placeholder{padding:20px; display:flex; flex-direction:column; align-items:center; gap:10px;}
.map-box-icon{font-size:28px;}
.map-box-placeholder p{margin:0; max-width:32ch;}
.map-box-link{color:var(--blue-700); font-weight:600; font-size:13.5px; text-decoration:none;}
.map-box-link:hover{text-decoration:underline;}

/* Scroll-Reveal: Abschnitte faden beim Scrollen sanft ein */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease;}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* Sponsoren-Laufband (Startseite) */
.sponsors-marquee-section{background:var(--paper-2); padding:56px 0; overflow:hidden;}
.sponsors-marquee-section .wrap{text-align:center;}
.sponsors-marquee-section .section-title{max-width:none;}
.sponsors-marquee{
  margin-top:32px; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.sponsors-marquee-track{display:flex; gap:28px; width:max-content; animation:sponsors-scroll 30s linear infinite;}
.sponsors-marquee-track .sponsor-logo{flex-shrink:0;}
.sponsors-marquee:hover .sponsors-marquee-track{animation-play-state:paused;}
@keyframes sponsors-scroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
/* Zu wenige Sponsoren, um die Breite zu füllen: statisch zentriert statt Laufband */
.sponsors-marquee.is-static{-webkit-mask-image:none; mask-image:none;}
.sponsors-marquee.is-static .sponsors-marquee-track{animation:none; width:100%; justify-content:center;}
.sponsors-marquee.is-static .sponsors-marquee-track [aria-hidden="true"]{display:none;}
@media (prefers-reduced-motion: reduce){
  .sponsors-marquee-track{animation:none; overflow-x:auto; max-width:100%;}
  .sponsors-marquee-track [aria-hidden="true"]{display:none;}
}

footer{background:var(--navy-950); color:rgba(246,248,251,0.6); padding:40px 0;}
.footer-row{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; font-size:13.5px;}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand img{width:34px; height:34px; object-fit:contain; background:#fff; border-radius:50%; padding:4px;}
.footer-links{display:flex; gap:20px;}
.footer-links a{color:rgba(246,248,251,0.6); text-decoration:none;}
.footer-links a:hover{color:var(--paper);}
.footer-link-btn{background:none; border:none; padding:0; margin:0; font:inherit; cursor:pointer; color:rgba(246,248,251,0.6);}
.footer-link-btn:hover{color:var(--paper);}

@media (max-width: 1200px){
  nav.links{
    display:none;
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--navy-950); border-top:1px solid rgba(255,255,255,0.08);
    padding:8px 28px 18px;
    box-shadow:0 12px 24px rgba(0,0,0,0.25);
  }
  .nav.nav-open nav.links{display:flex;}
  nav.links a{padding:12px 0; border-bottom:1px solid rgba(255,255,255,0.08); white-space:normal;}
  .nav-cta-mobile{
    display:block; text-align:center; margin-top:14px;
    background:var(--sky-400); color:var(--navy-950); text-decoration:none;
    padding:10px; border-radius:var(--radius-s); font-weight:600;
  }
  .nav-cta{display:none;}
  .menu-btn{display:block;}
  .brand-text span{display:none;}
}

@media (max-width: 860px){
  .crest{width:60px; height:83px; margin:-4px 0 -28px;}
  .hero .wrap{grid-template-columns:1fr;}
  .hero-stats{flex-direction:row; border-left:none; border-top:1px solid rgba(255,255,255,0.15); padding-left:0; padding-top:24px; gap:32px; flex-wrap:wrap;}
  .about-grid, .join-grid, .contact-grid{grid-template-columns:1fr;}
  .event-row{grid-template-columns:1fr; gap:6px;}
  .team-teaser{grid-template-columns:1fr;}
  .team-teaser-photos{grid-template-columns:repeat(auto-fit, 56px); justify-content:start;}
  .team-detail-head-grid{grid-template-columns:1fr; text-align:left;}
  .team-detail-photo{width:120px; height:120px;}
  .team-detail-body{grid-template-columns:1fr;}
}

/* Cookie-/Einwilligungsbanner */
.cookie-banner{position:fixed; left:0; right:0; bottom:0; z-index:250; padding:16px; display:flex; justify-content:center;}
.cookie-banner[hidden]{display:none;}
.cookie-banner-box{
  background:var(--navy-950); color:rgba(246,248,251,0.88); border-radius:10px; padding:20px 24px;
  max-width:760px; width:100%; box-shadow:0 12px 32px rgba(0,0,0,0.3);
}
.cookie-banner-text{margin:0 0 14px; font-size:13.5px; line-height:1.6;}
.cookie-banner-text a{color:var(--sky-300);}
.cookie-banner-settings{margin:0 0 14px; display:flex; flex-direction:column; gap:10px; border-top:1px solid rgba(246,248,251,0.15); padding-top:14px;}
.cookie-banner-settings[hidden]{display:none;}
.cookie-toggle-row{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; font-size:13px; line-height:1.5; cursor:pointer;}
.cookie-toggle-row b{color:var(--paper); font-size:13.5px;}
.cookie-toggle-row input{flex-shrink:0; margin-top:3px; width:18px; height:18px;}
.cookie-banner-actions{display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end;}
.cookie-banner-actions .btn-ghost{color:rgba(246,248,251,0.85); border-color:rgba(246,248,251,0.3);}
.cookie-banner-actions .btn-ghost:hover{border-color:rgba(246,248,251,0.6); color:var(--paper);}
@media (max-width: 640px){
  .cookie-banner{padding:0;}
  .cookie-banner-box{border-radius:10px 10px 0 0;}
  .cookie-banner-actions{justify-content:stretch;}
  .cookie-banner-actions button{flex:1 1 auto;}
}

/* Popup-Hinweise (zeitgesteuert, aus News-Beiträgen) */
.site-popup{
  position:fixed; inset:0; z-index:300;
  background:rgba(11,28,64,0.72);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.site-popup[hidden]{display:none;}
.site-popup-stack{
  width:100%; max-width:520px; max-height:90vh; overflow-y:auto;
  display:flex; flex-direction:column; gap:14px;
  animation:popup-in .35s ease;
}
.site-popup-card{
  position:relative; background:var(--paper); border-radius:10px; overflow:hidden; flex-shrink:0;
  box-shadow:0 24px 70px rgba(0,0,0,0.4);
}
.site-popup-topbar{position:sticky; top:0; z-index:2; display:flex; justify-content:flex-end; flex-shrink:0;}
.site-popup-dismiss-all{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-family:inherit;
  background:var(--paper); color:var(--navy-950); border:0; border-radius:999px;
  padding:9px 18px; font-size:14.5px; font-weight:600;
  box-shadow:0 6px 20px rgba(0,0,0,0.3);
}
.site-popup-dismiss-all:hover{background:#fff;}
.site-popup-dismiss-all:focus-visible{outline:2px solid var(--sky-300); outline-offset:2px;}
@keyframes popup-in{ from{opacity:0; transform:translateY(16px) scale(.98);} to{opacity:1; transform:none;} }
.site-popup-image{width:100%; max-height:240px; object-fit:cover; display:block;}
.site-popup-body{padding:26px 28px 28px;}
.site-popup-kicker{color:var(--blue-700); font-weight:600; font-size:13.5px; margin-bottom:8px;}
.site-popup-body h2{font-size:1.5rem; margin-bottom:12px;}
.site-popup-body p{color:var(--ink-soft); font-size:15.5px; margin:0 0 22px; white-space:pre-line;}
@media (prefers-reduced-motion: reduce){ .site-popup-stack{animation:none;} }

/* Ergebnisse / Spieltag */
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.spieltag-nav{display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:22px;}
.spieltag-nav .filter-reset{margin-top:0;}
.spieltag-select select{
  font-size:14px; padding:8px 12px; border-radius:4px; border:1px solid rgba(255,255,255,0.3);
  background:rgba(255,255,255,0.08); color:var(--paper); font-family:inherit; color-scheme:dark;
}
.result-day{font-size:1.25rem; margin:40px 0 14px;}
.result-day:first-child{margin-top:0;}
.result-table{display:flex; flex-direction:column; gap:8px;}
.result-head, .result-row{
  display:grid; align-items:center; gap:14px;
  grid-template-columns:minmax(150px,1.3fr) 76px minmax(0,1.4fr) 112px minmax(0,1.4fr) 132px;
}
.result-head{padding:0 18px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft);}
.result-head .center{text-align:center;}
.result-row{
  background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--line);
  border-radius:6px; padding:14px 18px; font-size:15px;
}
.result-row.status-sieg{border-left-color:#2f9e5b;}
.result-row.status-niederlage{border-left-color:#c8473f;}
.result-row.status-unentschieden{border-left-color:#d19a2a;}
.result-team{text-decoration:none; color:inherit; display:flex; flex-direction:column; line-height:1.3;}
.result-team strong{color:var(--navy-950);}
.result-team:hover strong{color:var(--blue-500);}
.result-team small, .result-time{color:var(--ink-soft); font-size:13px;}
.result-side{color:var(--ink-soft);}
.result-side.is-us{color:var(--navy-950); font-weight:700;}
.side-label{display:none;}
.result-score{display:flex; flex-direction:column; align-items:center; gap:2px;}
.result-score small{color:var(--ink-soft); font-size:11.5px; white-space:nowrap;}
.result-note{color:#a4671a !important; font-weight:600;}
.score-badge{
  display:inline-block; min-width:78px; text-align:center; padding:5px 12px; border-radius:999px;
  font-weight:700; font-size:15px; font-variant-numeric:tabular-nums;
  background:var(--paper-2); color:var(--ink-soft); border:1px solid var(--line);
}
.score-badge.status-sieg{background:#e3f4e8; color:#1f6b3a; border-color:#b9e0c6;}
.score-badge.status-niederlage{background:#fbe6e4; color:#a53228; border-color:#f0c2be;}
.score-badge.status-unentschieden{background:#fbf1d9; color:#8a6412; border-color:#ecd9a4;}
.score-badge.status-neutral{background:var(--paper-2); color:var(--navy-950);}
.result-links{display:flex; flex-direction:column; gap:2px; font-size:13.5px; font-weight:600;}
.result-links a{color:var(--blue-700); text-decoration:none;}
.result-links a:hover{text-decoration:underline;}
.result-source{margin-top:30px; font-size:13px; color:var(--ink-soft);}

@media (max-width: 860px){
  .result-head{display:none;}
  .result-row{
    grid-template-columns:1fr auto; gap:6px 14px;
    grid-template-areas:"team time" "home score" "away score" "links links";
  }
  .result-team{grid-area:team;}
  .result-time{grid-area:time; text-align:right;}
  .result-home{grid-area:home;}
  .result-away{grid-area:away;}
  .result-score{grid-area:score; align-self:center;}
  .result-links{grid-area:links; flex-direction:row; gap:16px; padding-top:6px; border-top:1px solid var(--line);}
  .side-label{display:inline; font-size:12px; opacity:.7;}
}

/* Spiele & Ergebnisse auf der Mannschaftsseite */
.team-games h2{margin-bottom:6px;}
.team-games h3{font-size:1rem; margin:26px 0 10px; color:var(--ink-soft); font-family:'Work Sans',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.04em; font-size:12.5px;}
.game-list{display:flex; flex-direction:column; gap:8px;}
.game-row{
  display:grid; align-items:center; gap:14px;
  grid-template-columns:132px minmax(0,1fr) 112px minmax(0,1fr) 96px;
  background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--line);
  border-radius:6px; padding:12px 18px; font-size:15px;
}
.game-row.status-sieg{border-left-color:#2f9e5b;}
.game-row.status-niederlage{border-left-color:#c8473f;}
.game-row.status-unentschieden{border-left-color:#d19a2a;}
.game-date{color:var(--ink-soft); font-size:13.5px; line-height:1.3;}
.game-date strong{display:block; color:var(--navy-950); font-size:14.5px;}
.game-row .result-score{align-items:center;}
.game-row .game-report{font-size:13.5px; font-weight:600; color:var(--blue-700); text-decoration:none; text-align:right;}
.game-row .game-report:hover{text-decoration:underline;}
.game-more{margin-top:14px;}
.game-more summary{cursor:pointer; color:var(--blue-700); font-weight:600; font-size:14.5px;}
.game-more .game-list{margin-top:12px;}
@media (max-width: 860px){
  .game-row{grid-template-columns:1fr auto; gap:6px 14px; grid-template-areas:"date score" "home score" "away score" "rep rep";}
  .game-row .game-date{grid-area:date;}
  .game-row .result-home{grid-area:home;}
  .game-row .result-away{grid-area:away;}
  .game-row .result-score{grid-area:score;}
  .game-row .game-report{grid-area:rep; text-align:left;}
  .game-row .side-label{display:inline; font-size:12px; opacity:.7;}
}

.news-results-section{padding-top:0;}

.news-text-section-tight{padding-bottom:28px;}
.news-article-wide{max-width:var(--maxw);}
.news-article-wide .news-article-body{max-width:760px;}


/* Dropdown-Listen im dunklen Seitenkopf: Optionen brauchen eigene Farben, sonst helle Schrift auf weißem Grund */
.spieltag-select select option, .news-filter select option{background:var(--navy-900); color:var(--paper);}
.spieltag-select select optgroup, .news-filter select optgroup{background:var(--navy-950); color:var(--sky-300); font-style:normal; font-weight:600;}
.spieltag-select select optgroup option, .news-filter select optgroup option{background:var(--navy-900); color:var(--paper); font-weight:400;}

/* Ligatabelle auf der Mannschaftsseite */
.team-standings h2{margin-bottom:22px;}
.standings-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:6px; background:var(--paper);}
.standings{width:100%; min-width:560px; border-collapse:collapse; font-size:15px; font-variant-numeric:tabular-nums;}
.standings th{
  padding:11px 12px; text-align:center; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em;
  color:var(--ink-soft); background:var(--paper-2); border-bottom:1px solid var(--line);
}
.standings td{padding:11px 12px; text-align:center; border-bottom:1px solid var(--line);}
.standings tbody tr:last-child td{border-bottom:0;}
.standings .col-rang{width:64px; color:var(--ink-soft);}
.standings th.col-name, .standings td.col-name{text-align:left;}
.standings td.col-name{font-weight:500;}
.standings .col-punkte{font-weight:700; color:var(--navy-950);}
.standings tr.is-us td{background:#e6eefb; font-weight:700; color:var(--navy-950);}
.standings tr.is-us td.col-rang{color:var(--blue-700);}
.standings tr.standings-note td{color:var(--ink-soft); font-style:italic; text-align:left;}
.standings tr.standings-note td.col-rang{text-align:center;}
.standings-marker{color:var(--blue-500); font-size:10px; vertical-align:middle;}
.standings-title{font-family:'Work Sans',sans-serif; font-size:13px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); font-weight:600; margin:20px 0 10px;}
.standings-title small{text-transform:none; letter-spacing:0; font-weight:400;}
.game-more .standings-wrap{margin-top:6px;}

/* Termine: Spiele als anklickbare Zeilen */
a.event-row{color:inherit; text-decoration:none; transition:background .15s ease;}
a.event-row:hover{background:rgba(255,255,255,0.05);}
a.event-row:hover .event-name{color:var(--sky-300);}
.event-tag{
  display:inline-block; margin-left:8px; padding:2px 9px; border-radius:999px; vertical-align:middle;
  font-size:11px; font-weight:600; letter-spacing:.02em;
  color:var(--sky-300); border:1px solid rgba(183,200,234,0.45);
}
/* Terminseite (heller Hintergrund) */
.events-light .event-list{margin-top:0; border-top:1px solid var(--line);}
.events-light .event-row{border-bottom:1px solid var(--line);}
.events-light .event-date{color:var(--blue-700);}
.events-light .event-date small{color:var(--ink-soft);}
.events-light .event-place{color:var(--ink-soft);}
.events-light .event-tag{color:var(--blue-700); border-color:var(--sky-400);}
.events-light a.event-row:hover{background:var(--paper-2);}
.events-light a.event-row:hover .event-name{color:var(--blue-700);}
.event-month{font-size:1.25rem; margin:44px 0 12px;}
.event-month:first-child{margin-top:0;}

/* Abteilungs-Symbole */
.dept{transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;}
.dept-head{display:flex; align-items:center; gap:12px; margin-bottom:2px;}
.dept-icon{
  width:48px; height:48px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:var(--accent-bg, var(--paper-2)); font-size:24px; line-height:1;
}
.dept > .dept-icon{margin-bottom:8px;}
.dept-icon-sm{width:30px; height:30px; font-size:16px; vertical-align:middle; margin-right:6px; display:inline-flex;}
.dept-kicker{display:flex; align-items:center;}
.team-teaser-photo .dept-emoji{width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:1.7rem; line-height:1;}
@media (prefers-reduced-motion: reduce){ .dept:hover{transform:none;} }
/* Vereinsshop-Bereich auf der Startseite */
.shop{background:var(--paper-2);}
.shop-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;}
.shop-grid-solo{grid-template-columns:1fr;}
.shop-text .lede{margin:14px 0 26px; max-width:52ch;}
.shop-bild{display:block; justify-self:center; max-width:420px; border-radius:14px; overflow:hidden; box-shadow:0 20px 50px rgba(16,24,38,.18); transform:rotate(1.5deg); transition:transform .35s cubic-bezier(.3,1.4,.5,1), box-shadow .35s ease;}
.shop-bild:hover{transform:rotate(0) scale(1.03); box-shadow:0 26px 60px rgba(16,24,38,.24);}
.shop-bild img{display:block; width:100%; height:auto;}
@media (max-width:860px){ .shop-grid{grid-template-columns:1fr; gap:32px;} .shop-bild{max-width:340px; transform:none;} }
@media (prefers-reduced-motion: reduce){ .shop-bild{transition:none; transform:none;} .shop-bild:hover{transform:none;} }

/* Mitgliedsbeiträge (Seite Verein) */
.fee-card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:24px 26px 20px; max-width:760px; margin:26px 0;}
.fee-card h3{margin:0 0 14px; font-size:1.25rem;}
.fee-row{display:grid; grid-template-columns:1.6fr 1fr .7fr; gap:16px; padding:11px 4px; border-top:1px solid var(--line); align-items:baseline;}
.fee-row:first-child{border-top:0;}
.fee-head{font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); padding-top:0;}
.fee-amount{font-family:'Fraunces',serif; font-weight:700; font-size:1.15rem; color:var(--blue-700); text-align:right;}
.fee-head span:last-child{text-align:right;}
.fee-note{margin:12px 0 0; font-size:14px; color:var(--ink-soft);}
@media (max-width:560px){ .fee-row{grid-template-columns:1fr auto; gap:2px 12px;} .fee-row span:nth-child(2){grid-column:1; grid-row:2; font-size:14px; color:var(--ink-soft);} .fee-row .fee-amount{grid-column:2; grid-row:1 / span 2; align-self:center;} .fee-head{display:none;} }
/* ================= Abteilungsseite: Dynamik ================= */
.dyn-progress{position:fixed; left:0; top:0; width:100%; height:4px; z-index:120; pointer-events:none;}
.dyn-progress b{display:block; height:100%; transform-origin:0 50%; transform:scaleX(var(--p,0)); background:linear-gradient(90deg,var(--blue-500),var(--sky-300),#fff); box-shadow:0 0 12px rgba(138,166,220,.8);}

/* Einblenden (nur wenn JavaScript läuft, sonst bleibt alles sichtbar) */
html.dyn .dyn-rv{opacity:0; transform:translateY(34px) scale(.97); transition:opacity .7s ease, transform .85s cubic-bezier(.2,1.2,.3,1), box-shadow .15s ease, border-color .15s ease; transition-delay:var(--d,0s);}
html.dyn .dyn-rv.in{opacity:1; transform:none;}

/* Kopfbereich */
.dept-hero{position:relative; overflow:hidden;}
.dept-hero-blob{position:absolute; border-radius:50%; filter:blur(60px); pointer-events:none; z-index:0;}
.dept-hero-blob.a{width:520px; height:520px; right:-120px; top:-220px; background:radial-gradient(circle,var(--blue-500),transparent 65%); opacity:.5; animation:dyn-drift 16s ease-in-out infinite alternate;}
.dept-hero-blob.b{width:420px; height:420px; left:-140px; bottom:-240px; background:radial-gradient(circle,var(--sky-400),transparent 65%); opacity:.3; animation:dyn-drift 21s ease-in-out infinite alternate-reverse;}
@keyframes dyn-drift{to{transform:translate(70px,40px) scale(1.25);}}
.dept-hero-word{position:absolute; left:0; bottom:-.2em; font-family:'Fraunces',serif; font-weight:700; font-size:clamp(110px,20vw,300px); line-height:1; white-space:nowrap; color:transparent; -webkit-text-stroke:1.5px rgba(138,166,220,.2); pointer-events:none; z-index:1; will-change:transform;}
.dept-hero-grid{position:relative; z-index:2;}
.dept-hero-grid.has-tafel{display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center;}
.dyn-title .w{display:inline-block; white-space:nowrap;}
html.dyn .dyn-title .l{display:inline-block; animation:dyn-letter .9s cubic-bezier(.2,1.5,.3,1) both; animation-delay:calc(var(--i)*.05s + .1s);}
@keyframes dyn-letter{from{opacity:0; transform:translateY(60%) rotate(6deg);} to{opacity:1; transform:none;}}
.dyn-icon{animation:dyn-bob 3.2s ease-in-out infinite;}
@keyframes dyn-bob{50%{transform:translateY(-3px) rotate(-6deg);}}

/* Taktiktafel (Handball) */
.tafel{position:relative; padding:34px 12px 12px; border-radius:16px; background:rgba(18,37,82,.55); border:1px solid rgba(138,166,220,.4); box-shadow:0 24px 60px rgba(0,0,0,.4), inset 0 0 50px rgba(29,64,147,.35);}
.tafel svg{display:block; width:100%; height:auto; overflow:visible;}
.tafel-cap{position:absolute; left:16px; top:10px; font-size:11px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--sky-300);}
.tafel-cap i{display:inline-block; width:8px; height:8px; border-radius:50%; background:#fff; margin-right:8px; animation:dyn-blink 1s steps(2) infinite;}
@keyframes dyn-blink{50%{opacity:.15;}}
.tt-floor{fill:rgba(29,64,147,.22);}
.tt-lines{fill:none; stroke:var(--sky-300); stroke-width:2; stroke-linecap:round;}
.tt-lines .tt-fill{fill:rgba(29,64,147,.35);}
.tt-lines .tt-dash{stroke-dasharray:8 7;}
#tt-net line{stroke:var(--sky-300); stroke-width:1.2; opacity:.75;}
#tt-net.ripple{animation:tt-net .8s ease-out; transform-box:fill-box; transform-origin:left center;}
@keyframes tt-net{0%{transform:scaleX(1);} 20%{transform:scaleX(2.4) skewY(6deg);} 45%{transform:scaleX(.7) skewY(-4deg);} 70%{transform:scaleX(1.3);} 100%{transform:scaleX(1);}}
.tt-pi{transform-box:fill-box; transform-origin:center;}
.tt-pi circle{fill:var(--sky-400); stroke:#fff; stroke-width:1.8;}
.tt-pi text{font:800 12px 'Work Sans',sans-serif; fill:var(--navy-950); text-anchor:middle; dominant-baseline:central;}
.tt-d .tt-pi circle{fill:rgba(11,28,64,.65); stroke:var(--sky-300);}
.tt-d .tt-pi text{fill:var(--sky-300); font-size:9px;}
.tt-gkc circle{fill:#fff; stroke:var(--blue-700);}
.tt-gkc text{fill:var(--blue-700);}
.tt-pl.cheer .tt-pi{animation:tt-cheer .6s cubic-bezier(.2,2.4,.3,1) 2;}
@keyframes tt-cheer{50%{transform:scale(1.4);}}
.tt-route{fill:none; stroke:#fff; stroke-width:2; stroke-dasharray:6 6; stroke-linecap:round; opacity:.85; animation:tt-route .5s ease-out both;}
@keyframes tt-route{from{opacity:0; stroke-dashoffset:50;} to{opacity:.85; stroke-dashoffset:0;}}
#tt-tor{font:700 54px 'Fraunces',serif; fill:#fff; text-anchor:middle; opacity:0; paint-order:stroke; stroke:var(--blue-700); stroke-width:7px; transform-box:fill-box; transform-origin:center;}
#tt-tor.go{animation:tt-tor 1.5s cubic-bezier(.2,1.8,.3,1);}
@keyframes tt-tor{0%{opacity:0; transform:scale(.2) rotate(-12deg);} 25%{opacity:1; transform:scale(1.2) rotate(3deg);} 70%{opacity:1; transform:scale(1);} 100%{opacity:0; transform:scale(1.1);}}
@media (max-width:900px){ .dept-hero-grid.has-tafel{grid-template-columns:1fr;} .tafel{display:none;} }

/* Saison in Zahlen */
.dyn-season{background:var(--paper-2);}
.dyn-board{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:18px; margin-top:30px;}
.dyn-panel{position:relative; text-align:center; padding:24px 12px 22px; border-radius:14px; background:linear-gradient(180deg,var(--navy-900),var(--navy-950)); color:#fff; border:1px solid rgba(138,166,220,.5); box-shadow:0 14px 34px rgba(11,28,64,.22); overflow:hidden;}
.dyn-panel::before{content:''; position:absolute; left:0; right:0; top:0; height:5px; background:repeating-linear-gradient(90deg,var(--sky-400) 0 9px,transparent 9px 18px); animation:dyn-led 1s steps(2) infinite;}
@keyframes dyn-led{50%{background-position:9px 0;}}
.dyn-panel .num{display:block; font-weight:800; font-size:clamp(44px,6vw,70px); line-height:1.1; font-variant-numeric:tabular-nums; text-shadow:0 0 18px rgba(138,166,220,.85);}
.dyn-panel.pop .num{animation:dyn-pop .7s cubic-bezier(.2,2,.3,1);}
@keyframes dyn-pop{40%{transform:scale(1.35) rotate(-3deg);}}
.dyn-panel small{display:block; margin-top:4px; letter-spacing:.24em; text-transform:uppercase; font-size:11.5px; font-weight:700; color:var(--sky-300);}

.dyn-next{display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; margin-top:22px; padding:26px 30px; border-radius:16px; background:var(--navy-950); color:var(--paper); text-decoration:none; box-shadow:0 14px 34px rgba(11,28,64,.25); position:relative; overflow:hidden;}
.dyn-next::after{content:''; position:absolute; top:0; left:-60%; width:40%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.12),transparent); transform:skewX(-20deg); animation:dyn-shine 5s ease-in-out infinite;}
@keyframes dyn-shine{0%{left:-60%;} 45%,100%{left:140%;}}
.dyn-next-info{display:flex; flex-direction:column; gap:2px; position:relative; z-index:1;}
.dyn-next-label{font-size:12px; font-weight:800; letter-spacing:.26em; text-transform:uppercase; color:var(--sky-400);}
.dyn-next strong{font-family:'Fraunces',serif; font-size:1.6rem; line-height:1.2;}
.dyn-next-when{color:var(--sky-300); font-size:14px; margin-top:4px;}
.dyn-cd{display:flex; gap:10px; position:relative; z-index:1;}
.dyn-cd div{min-width:76px; text-align:center; padding:12px 8px; border-radius:10px; background:var(--navy-900); border:1px solid rgba(138,166,220,.5);}
.dyn-cd b{display:block; font-size:34px; line-height:1.1; font-weight:800; font-variant-numeric:tabular-nums;}
.dyn-cd b.tick{animation:dyn-tick .45s cubic-bezier(.2,2,.3,1);}
@keyframes dyn-tick{0%{transform:translateY(-14px) rotateX(80deg); opacity:0;} 100%{transform:none; opacity:1;}}
.dyn-cd small{font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--sky-300); font-weight:700;}
@media (max-width:760px){ .dyn-next{grid-template-columns:1fr; padding:22px;} .dyn-cd{justify-content:space-between;} .dyn-cd div{min-width:0; flex:1;} }

.dyn-results{display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:14px; margin-top:18px;}
.dyn-res{--c:var(--sky-400); display:flex; justify-content:space-between; align-items:center; gap:14px; padding:14px 18px; border-radius:12px; background:#fff; border:1px solid var(--line); border-left:5px solid var(--c); text-decoration:none; color:var(--ink);}
.dyn-res:hover{box-shadow:0 10px 24px rgba(16,24,38,.10);}
.dyn-res.sieg{--c:var(--blue-700);} .dyn-res.niederlage{--c:#b7bfcc;} .dyn-res.unentschieden{--c:var(--sky-400);}
.dyn-res-main{font-weight:600; line-height:1.3;}
.dyn-res-main small{display:block; color:var(--ink-soft); font-weight:500; font-size:12.5px;}
.dyn-res-score{display:flex; flex-direction:column; align-items:flex-end; flex:none;}
.dyn-res-score b{font-family:'Fraunces',serif; font-size:1.7rem; line-height:1; color:var(--navy-950); font-variant-numeric:tabular-nums;}
.dyn-res-score em{font-style:normal; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); margin-top:3px;}
.dyn-res.sieg .dyn-res-score em{color:var(--blue-700);}

/* Kippen der Mannschaftskarten, Bildzoom */
.team-card.dyn-tilt{position:relative;}
.team-card.dyn-tilt.is-tilting{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-4px); transition:transform .12s ease-out, box-shadow .2s ease, border-color .15s ease; box-shadow:0 14px 34px rgba(16,24,38,.16);}
.team-card.dyn-tilt::after{content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(255,255,255,.4), transparent 55%); opacity:0; transition:opacity .2s ease;}
.team-card.dyn-tilt.is-tilting::after{opacity:1;}
.team-card .team-photo{transition:transform .6s cubic-bezier(.2,1,.3,1);}
.team-card:hover .team-photo{transform:scale(1.06);}
.news-card .news-photo{transition:transform .6s cubic-bezier(.2,1,.3,1);}
.news-card:hover .news-photo{transform:scale(1.06);}

@media (prefers-reduced-motion: reduce){
  .dept-hero-blob, .dyn-icon, .tafel-cap i, .dyn-panel::before, .dyn-next::after{animation:none !important;}
  html.dyn .dyn-rv{opacity:1; transform:none; transition:none;}
  html.dyn .dyn-title .l{animation:none;}
  .team-card .team-photo, .news-card .news-photo{transition:none;}
}
