/* Stadion layout from the approved JFV preview. */
.jfv-stadion {
  --stadion-black: #08080a;
  --stadion-panel: #17171c;
  --stadion-ink: #fff;
  --stadion-muted: #d2d2d4;
  --stadion-line: #353539;
  --stadion-red: #c4102b;
  --stadion-link: #ffa4af;
  --platform-nav-text: #fff;
  margin: 0;
  min-width: 0;
  color: var(--stadion-ink);
  background: var(--stadion-black);
  font: 16px/1.5 system-ui, sans-serif;
}

body.jfv-stadion:has([data-vereinapp-shell]) {
  color: var(--stadion-ink) !important;
  background: var(--stadion-black) !important;
}

.jfv-stadion * { box-sizing: border-box; }
.jfv-stadion :is(a, button, summary, select):focus-visible { outline: 3px solid #7ac9ff; outline-offset: 3px; }
.jfv-stadion [hidden] { display: none !important; }
.jfv-stadion h1, .jfv-stadion h2, .jfv-stadion h3 { color: inherit; }
.jfv-stadion main :is(a, summary) { text-underline-offset: .18em; }
.jfv-stadion main a { color: var(--stadion-link); }
.jfv-stadion main p { max-width: 72ch; }

.stadion-wrap { width: min(1000px, calc(100% - 26px)); margin-inline: auto; }
.stadion-section { margin-block: 23px; scroll-margin-top: 12px; }
.stadion-eyebrow { margin: 0 0 3px; color: #ff8798; font-size: .71rem; letter-spacing: .065em; text-transform: uppercase; font-weight: 820; }
.stadion-section-heading {
  display: flex;
  gap: 10px 20px;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 11px;
}
.stadion-section-heading h2 { margin: 0; font-size: clamp(1.32rem, 3.5vw, 2rem); }
.stadion-section-heading p, .stadion-section-heading a { font-size: .86rem; }
.stadion-section-heading > a, .stadion-feeds { margin: 0; font-weight: 700; }
.stadion-feature { margin-block: 16px 6px; border: 1px solid #2e2e34; background: #08080a; }
.stadion-feature-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 11px;
  background: #111116;
}
.stadion-feature-heading h1 { margin: 0; font-size: clamp(1.08rem, 2.4vw, 1.42rem); }
.stadion-feature-heading a { font-size: .8rem; font-weight: 740; }
.jfv-stadion .stadion-feature-link { display: block; color: #fff; text-decoration: none; }
.stadion-feature-visual {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 8.5;
  max-height: 440px;
  background: #18181c;
  overflow: hidden;
}
.stadion-feature-visual img { width: 100%; height: 100%; max-height: 440px; object-fit: contain; }
.stadion-feature-copy { position: relative; padding: 0 12px 12px; }
.stadion-feature-copy span {
  display: inline-block;
  position: relative;
  margin-top: -12px;
  padding: 3px 25px 3px 8px;
  color: #fff;
  background: var(--stadion-red);
  clip-path: polygon(0 0, 100% 0, 90% 100%, 0 100%);
  font-size: .7rem;
  font-weight: 850;
}
.stadion-feature-copy h2 { margin: 5px 0 2px; font-size: clamp(1.42rem, 3.6vw, 2.8rem); line-height: 1.12; }
.stadion-feature-copy p { margin: 4px 0 0; color: #ffd9df; font-size: .83rem; }
.stadion-feature-links { padding: 8px; border-top: 1px solid #2f2f36; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 20px; font-size: .8rem; }
.stadion-feature-controls { display: flex; gap: 6px; align-items: center; }
.stadion-feature-controls button { min-height: 36px; min-width: 39px; border-radius: 3px; padding: 5px 8px; border: 1px solid #45454a; background: #16161c; color: #fff; }
.stadion-highlights { display: flex; gap: 17px; padding: 7px 1px 11px; overflow-x: auto; scrollbar-width: thin; }
.jfv-stadion .stadion-highlights a {
  display: grid;
  justify-items: center;
  flex: 0 0 65px;
  gap: 5px;
  color: #fff;
  text-decoration: none;
  font-size: .72rem;
  font-weight: 780;
}
.stadion-highlights a span {
  display: grid;
  place-items: center;
  width: 61px;
  height: 61px;
  border: 2px solid #ff557e;
  border-radius: 50%;
  background: #20131b;
  color: #ff92a8;
  font-family: system-ui, sans-serif;
  font-size: 1.5rem;
}
.stadion-highlights a:hover span { border-color: #fff; }
.stadion-community {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  margin: 17px 0 3px;
  padding: 14px;
  background: #171719;
  border: 1px solid #3b4240;
  border-left: 3px solid #51df90;
}
.stadion-community-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  background: #183528;
  color: #69e99d;
  border-radius: 50%;
  font-size: 1.45rem;
}
.stadion-community h2 { margin: 1px 0 4px; font-size: clamp(1.15rem, 3vw, 1.8rem); }
.stadion-community p { margin: 0; font-size: .8rem; }
.stadion-community .stadion-eyebrow { color: #9bf3ba; }
.jfv-stadion .stadion-community a {
  padding: 9px 11px;
  background: #50da87;
  color: #102118;
  font-size: .78rem;
  font-weight: 840;
  border-radius: 5px;
  white-space: nowrap;
  text-decoration: none;
}
.stadion-calendar { background: #101017; border: 1px solid #3c3740; padding: 13px; }
.stadion-archive-card {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  width: min(100%, 520px);
  background: var(--stadion-panel);
  border: 1px solid var(--stadion-line);
  text-decoration: none;
}
.jfv-stadion .stadion-archive-card { color: #fff; }
.stadion-archive-card img { width: 100%; height: 100%; min-height: 95px; object-fit: cover; }
.stadion-archive-card span { padding: 7px; font-size: .84rem; }
.stadion-archive-card :is(small, strong) { display: block; }
.stadion-archive-card strong { margin-block: 3px; font-size: 1.12rem; }
.stadion-archive-card small { color: var(--stadion-link); }

.stadion-page-heading, .stadion-team-directory, .stadion-team-page { padding-top: 18px; }
.stadion-page-heading h1, .stadion-team-directory h1 { margin: 3px 0 5px; font-size: clamp(1.82rem, 5vw, 3.35rem); line-height: 1.12; }
.stadion-back { display: inline-block; margin-bottom: 10px; font-size: .86rem; font-weight: 770; }
.jfv-stadion .jfv-page-content { color: var(--stadion-ink); padding-top: 16px; min-height: 35vh; }
.jfv-stadion .jfv-page-content > :is(p, ul, ol) { color: var(--stadion-muted); }
.stadion-team-directory .stadion-section-heading p { margin-block: 4px; }
.stadion-filters { display: flex; gap: 9px; flex-wrap: wrap; align-items: center; margin: 12px 0; }
.stadion-filter-options { display: flex; flex-wrap: wrap; gap: 5px; flex: 1 0 100%; }
.stadion-filter-options button, .stadion-filters select {
  padding: 7px 9px;
  min-height: 39px;
  border: 1px solid #4a4a52;
  border-radius: 4px;
  background: #1b1820;
  color: #fff;
  font: inherit;
  font-size: .84rem;
}
.stadion-filter-options [aria-pressed="true"] { background: var(--stadion-red); border-color: var(--stadion-red); font-weight: 750; }
.stadion-filters label { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: .84rem; }
.stadion-filters [data-stadion-count] { color: var(--stadion-muted); font-size: .83rem; }
.stadion-team-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.stadion-team-list article { min-width: 0; scroll-margin-top: 10px; }
.stadion-team-list article > a {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  height: 100%;
  padding: 8px;
  background: #1a151e;
  border: 1px solid #45363e;
  text-decoration: none;
}
.jfv-stadion .stadion-team-list article > a { color: #fff; }
.stadion-team-list article > a:hover { border-color: #ff7184; }
.stadion-team-letter {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  background: #901831;
  color: #fff;
  font: 850 1.01rem system-ui, sans-serif;
}
.stadion-team-list strong { display: block; overflow-wrap: anywhere; }
.stadion-team-list small { display: block; color: var(--stadion-muted); line-height: 1.35; font-size: .72rem; overflow-wrap: anywhere; }
.stadion-team-chevron { color: var(--stadion-link); font-size: 1.3rem; }
.stadion-team-cover { display: grid; grid-template-columns: 1.3fr 1fr; background: #161219; border: 1px solid #443440; margin-bottom: 8px; }
.stadion-team-image { display: grid; place-items: center; min-height: 215px; overflow: hidden; }
.stadion-team-image img { display: block; width: 100%; height: 100%; max-height: 360px; object-fit: cover; margin: 0; }
.stadion-team-image-badge { background: linear-gradient(125deg, #691222, #281018 52%, #13131a); }
.stadion-team-image-badge img { width: 115px; height: 136px; object-fit: contain; }
.stadion-team-intro { align-self: center; min-width: 0; padding: clamp(12px, 3vw, 26px); }
.stadion-team-intro h1 { font-size: clamp(1.65rem, 4vw, 3.15rem); margin: 0 0 16px; overflow-wrap: anywhere; line-height: 1.15; }
.jfv-stadion .stadion-button { display: inline-block; padding: 9px 12px; background: var(--stadion-red); color: #fff; text-decoration: none; font-weight: 740; border-radius: 4px; }
.stadion-team-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.stadion-team-card { padding: 13px; min-width: 0; background: var(--stadion-panel); border: 1px solid #45363e; }
.stadion-team-card h2 { margin: 0 0 8px; font-size: clamp(1.1rem, 2.7vw, 1.43rem); }
.stadion-team-card p { margin: 0 0 6px; }
.stadion-team-wide { grid-column: 1 / -1; }
.stadion-times { list-style: none; margin: 0; padding: 0; }
.stadion-times li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 8px; padding: 8px 0; border-bottom: 1px solid #47343e; }
.stadion-times small { grid-column: 1 / -1; color: var(--stadion-muted); font-size: .72rem; }
.stadion-team-card .jfv-team-sports { margin: 0; }
.stadion-team-card .jfv-coaches li { padding-inline: 0; }

.jfv-stadion :is(.jfv-event-card, .jfv-org-root, .jfv-org-branch, .jfv-org-teams,
  .jfv-person, .jfv-org-team, .jfv-contact-panel, .jfv-panel, .jfv-archive-details,
  .jfv-partner-card, .jfv-service-card, .jfv-legal, .jfv-embed-gate, .jfv-team-sports, .stadion-empty) {
  background: var(--stadion-panel);
  border-color: #45363e;
  color: var(--stadion-ink);
}
.jfv-stadion :is(.jfv-muted, .jfv-note, .jfv-event-meta, .jfv-person p, .jfv-org-branch p) { color: var(--stadion-muted); }
.jfv-stadion :is(.jfv-org-root, .jfv-contact-panel) { background: #28131f; }
.jfv-stadion :is(.jfv-eyebrow, .jfv-event-meta strong, .jfv-person h4) { color: var(--stadion-link); }
.jfv-stadion :is(.jfv-sponsor, .jfv-sponsor-grid .jfv-sponsor) { color: #1b171a; background-color: #fff; }
.jfv-stadion .jfv-home-sponsors .jfv-sponsor-grid { gap: 7px; }
.jfv-stadion .jfv-footer-logo { max-width: 120px; }
.jfv-stadion .jfv-partnership .jfv-sponsor-grid, .jfv-stadion .stadion-home-sponsors .jfv-sponsor-grid { margin: 12px 0; }
.jfv-stadion .jfv-instagram-feed > p:first-child { display: none; }
.jfv-stadion .jfv-integration-grid article { color: #fff; background: var(--stadion-panel); border-color: var(--stadion-line); }
.jfv-stadion .jfv-event-grid { gap: 8px; }
.jfv-stadion .jfv-event-card { padding: 13px; border-radius: 4px; }
.jfv-stadion .jfv-event-card .jfv-text-link { color: var(--stadion-link); }
.stadion-empty { padding: 12px; }
.stadion-footer { margin-top: 24px; background: #0e090d; }
.jfv-stadion .stadion-footer .vereinapp-platform-footer { width: min(1000px, calc(100% - 26px)); max-width: none; margin: 0 auto; padding-inline: 0; background: transparent; color: #fff; }
.jfv-stadion:has(.stadion-rail) { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }
.stadion-rail {
  position: fixed;
  z-index: 12;
  bottom: 0;
  inset-inline: 0;
  padding-bottom: env(safe-area-inset-bottom);
  background: #f6f6f6;
  color: #111;
  border-top: 3px solid var(--stadion-red);
}
.stadion-rail-inner { display: flex; align-items: center; gap: 8px; width: min(100%, 1190px); min-height: 61px; margin: auto; padding: 4px 8px; }
.stadion-rail-label { flex: none; color: #a50f25; font-size: .76rem; font-weight: 690; line-height: 1.16; text-decoration: none; }
.stadion-rail-label strong { display: block; }
.stadion-rail .jfv-sponsor-viewport { flex: 1; min-width: 0; overflow: auto hidden; }
.stadion-rail :is(.jfv-sponsor-track, .jfv-sponsor-sequence) { display: flex; width: max-content; align-items: center; gap: 7px; }
.stadion-rail .jfv-sponsor {
  display: grid;
  place-items: center;
  flex: 0 0 92px;
  width: 92px;
  height: 44px;
  min-height: 44px;
  padding: 3px;
  margin: 0;
  color: #191919;
  text-decoration: none;
}
.stadion-rail .jfv-sponsor img { width: 100%; height: 100%; max-height: 38px; object-fit: contain; }
.stadion-rail .jfv-sponsor img + span { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
.stadion-rail-toggle { width: 44px; height: 44px; padding: 2px; border: 1px solid #b6b6bc; border-radius: 4px; background: #fff; color: #15151a; font-size: .7rem; }
.stadion-rail[data-ready="true"] .jfv-sponsor-viewport { overflow: hidden; }
.stadion-rail[data-ready="true"] .jfv-sponsor-track { animation: stadion-scroll var(--jfv-duration, 35s) linear infinite; }
.stadion-rail[data-paused="true"] .jfv-sponsor-track { animation-play-state: paused; }
@keyframes stadion-scroll { to { transform: translateX(calc(-1 * var(--jfv-distance, 0px) - 7px)); } }

@media (max-width: 780px) {
  .stadion-team-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .stadion-highlights { gap: 7px; }
  .stadion-highlights a span { width: 56px; height: 56px; }
  .stadion-community a { grid-column: 2; justify-self: start; }
  .stadion-team-image { min-height: 155px; }
  .stadion-team-cover { grid-template-columns: minmax(0, 1fr); }
  .stadion-team-details { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 360px) {
  .stadion-team-list { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .stadion-rail .jfv-sponsor-track { animation: none !important; }
}

.stadion-feature-badge {
  background: linear-gradient(125deg, #691222, #281018 52%, #13131a);
}
.stadion-feature-badge img {
  width: min(160px, 32vw);
  height: auto;
}