/* =====================================================
   SV Motor Sörnewitz – Theme-Styles (Variante A)
   Portiert aus dem Designprototyp redesign/index.html
   ===================================================== */

:root{
  --sv-rot:        var(--wp--preset--color--rot, #f72706);
  --sv-rot-text:   var(--wp--preset--color--rot-text, #c81b06);
  --sv-rot-dunkel: var(--wp--preset--color--rot-dunkel, #a91505);
  --sv-gold:       var(--wp--preset--color--gold, #fdbd1d);
  --sv-schwarz:    var(--wp--preset--color--schwarz, #0e0e10);
  --sv-anthrazit:  var(--wp--preset--color--anthrazit, #16171b);
  --sv-grau:       var(--wp--preset--color--grau, #6b6c75);
  --sv-grau-hell:  var(--wp--preset--color--grau-hell, #f0efec);
  --sv-papier:     var(--wp--preset--color--papier, #f7f6f3);
  --sv-radius:14px;
  --sv-shadow:0 10px 30px rgba(14,14,16,.10);
  --sv-shadow-lg:0 24px 60px rgba(14,14,16,.18);
  --sv-display:var(--wp--preset--font-family--display, "Barlow Condensed", sans-serif);
}

html{scroll-behavior:smooth;scroll-padding-top:90px}
body{-webkit-font-smoothing:antialiased;overflow-x:clip}

:focus-visible{outline:3px solid var(--sv-gold);outline-offset:2px;border-radius:4px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* ---------- Wiederkehrende Elemente ---------- */
.sv-kicker{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sv-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.14em;font-size:15px;color:var(--sv-rot-text);margin-bottom:0}
.sv-kicker::before{content:"";width:34px;height:3px;background:var(--sv-gold)}
.sv-kicker--gold{color:var(--sv-gold)}

/* Einheitliche linke Kante: Schmale Elemente (Kicker, Intro, Hero-Text) am
   1200px-Inhaltsraster ausrichten statt am Viewport oder mittig.
   (100% - 1200px)/2 = derselbe Auto-Margin, den WP breiten Blöcken gibt. */
.sv-section .sv-kicker,.sv-hero .sv-kicker,
.sv-section .sv-section__intro,.sv-vermietung .sv-section__intro,
.sv-hero .sv-hero__sub{
  margin-left:max(calc((100% - 1200px)/2),0px)!important}
/* Im Seiten-/Beitragsinhalt gilt die schmalere Lesespalte (760px) als Raster */
.wp-block-post-content .sv-kicker{
  margin-left:max(calc((100% - 760px)/2),0px)!important}

.sv-section{padding:96px 24px}
.sv-section__titel{
  font-size:clamp(38px,5vw,58px);font-weight:800;font-style:italic;
  margin:10px 0 14px;line-height:1.02}
.sv-section__titel--klein{font-size:clamp(30px,4vw,42px)}
.sv-section__intro{max-width:640px;color:var(--sv-grau);font-size:18px;margin-bottom:48px}
.sv-section__kopf{margin-bottom:48px}
.sv-section__kopf .sv-section__titel{margin-bottom:0}

/* ---------- Buttons ---------- */
.wp-block-button__link{transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease}
.wp-block-button__link:hover{transform:translateY(-2px)}
.wp-block-button__link:active{transform:translateY(0) scale(.98)}
.sv-btn-ghost .wp-block-button__link{
  background:transparent;border:2px solid rgba(255,255,255,.55);color:#fff}
.sv-btn-ghost .wp-block-button__link:hover{border-color:var(--sv-gold);color:var(--sv-gold)}

/* ---------- Header ---------- */
/* Sticky muss auf dem Template-Part-Wrapper liegen – .sv-header allein hat
   im Block-Theme kein höheres Elternelement, in dem es "wandern" könnte. */
header.wp-block-template-part:has(.sv-header){position:sticky;top:0;z-index:1000}
.sv-header{
  position:relative;z-index:0;
  background:rgba(14,14,16,.92);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:0 24px}
/* Blur als Pseudo-Element: backdrop-filter direkt auf .sv-header würde das
   position:fixed-Overlay des Mobilmenüs einsperren (Containing Block!) */
.sv-header::before{content:"";position:absolute;inset:0;backdrop-filter:blur(12px);z-index:-1}
.sv-header__inner{min-height:76px;gap:18px;justify-content:flex-end!important}
.sv-brand{gap:14px;margin-right:auto!important}
/* Eingeloggt: Sticky-Header unterhalb der Admin-Bar andocken */
.admin-bar header.wp-block-template-part:has(.sv-header){top:32px}
@media (max-width:782px){.admin-bar header.wp-block-template-part:has(.sv-header){top:46px}}
.sv-brand__logo{margin:0}
.sv-brand__logo img{height:48px;width:auto!important}
.sv-brand__text{line-height:1}
.sv-brand__title{margin:0;font-size:24px!important;line-height:.95}
.sv-brand__title a{color:#fff;text-decoration:none}
.sv-brand__claim{
  margin:2px 0 0;font-family:var(--sv-display);font-weight:600;font-size:13px;
  letter-spacing:.28em;text-transform:uppercase;color:var(--sv-gold)}
/* Navigation: hohe Spezifität, damit die Block-Library-Styles nicht gewinnen */
.sv-header .wp-block-navigation a,
.sv-header .wp-block-navigation .wp-block-navigation-item__content,
.sv-header .wp-block-pages-list__item__link{
  color:#e8e8ea!important;font-weight:600;font-size:15.5px;
  padding:10px 14px;border-radius:6px;text-decoration:none;
  transition:color .15s,background-color .15s}
.sv-header .wp-block-navigation a:hover,
.sv-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.sv-header .wp-block-pages-list__item__link:hover{
  color:var(--sv-gold)!important;background:rgba(255,255,255,.06)}
.sv-header .wp-block-navigation__responsive-container-open{color:#fff}
/* Im geöffneten Mobil-Overlay: Vollbild, linksbündig, große weiße Menüpunkte */
.sv-header .wp-block-navigation__responsive-container.is-menu-open{
  padding:110px 36px 36px}
.sv-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{
  align-items:flex-start}
.sv-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.sv-header .wp-block-navigation__responsive-container.is-menu-open ul{
  justify-content:flex-start!important;align-items:flex-start!important}
.sv-header .wp-block-navigation__responsive-container.is-menu-open a{
  color:#fff!important;font-size:26px;font-family:var(--sv-display);
  font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:12px 0}
.sv-header .wp-block-navigation__responsive-container.is-menu-open a:hover{color:var(--sv-gold)!important;background:none}
.sv-header .wp-block-navigation__responsive-container-close{color:#fff}
.sv-header .wp-block-navigation__responsive-container.is-menu-open{padding-top:100px}
.sv-header__cta .wp-block-button__link{font-size:17px;padding:11px 22px}
@media (max-width:781px){
  .sv-header .sv-header__cta{display:none!important}
  .sv-brand__title{font-size:20px!important}
}

/* ---------- Hero ---------- */
.sv-hero{
  position:relative;color:#fff;overflow:hidden;min-height:640px;
  display:flex;align-items:center;
  padding:110px 24px 200px;background:var(--sv-schwarz)}
.sv-hero__content{position:relative;z-index:3;width:100%}
/* Hero-Bilder-Slider: drei Fotos blenden automatisch über (reines CSS) */
.sv-hero__slider{position:absolute;inset:0;z-index:0;overflow:hidden}
.sv-hero__slide{
  position:absolute;inset:0;background-size:cover;background-position:center;
  /* Einheitlich abgedunkelt + leicht entsättigt: ruhiger Hintergrund, Schrift trägt */
  opacity:0;filter:contrast(1.05) brightness(.85) saturate(.82);
  animation:sv-hero-fade 27s infinite;will-change:opacity}
.sv-hero__slide--1{background-position:50% 42%}
.sv-hero__slide--2{animation-name:sv-hero-fade-2}
.sv-hero__slide--3{animation-name:sv-hero-fade-3}
@keyframes sv-hero-fade   {0%,28%{opacity:.95}33%,95%{opacity:0}100%{opacity:.95}}
@keyframes sv-hero-fade-2 {0%,28%{opacity:0}33%,62%{opacity:.95}67%,100%{opacity:0}}
@keyframes sv-hero-fade-3 {0%,62%{opacity:0}67%,95%{opacity:.95}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .sv-hero__slide{animation:none}
  .sv-hero__slide--1{opacity:.95}
}
/* Farbverlauf-Overlay über dem Slider (für Text-Lesbarkeit links) */
.sv-hero::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to bottom,rgba(14,14,16,.52) 0%,rgba(14,14,16,.06) 26%,rgba(14,14,16,0) 46%,rgba(14,14,16,0) 56%,rgba(14,14,16,.36) 82%,rgba(14,14,16,.60) 100%)}
/* Text-Schatten trägt die Schrift auf dem freien Foto (nur im Hero!) */
.sv-hero__titel{text-shadow:0 4px 36px rgba(0,0,0,.9),0 2px 14px rgba(0,0,0,.8),0 1px 4px rgba(0,0,0,.65)}
.sv-hero__sub{text-shadow:0 1px 10px rgba(0,0,0,.85),0 1px 3px rgba(0,0,0,.7)}
.sv-hero .sv-kicker{text-shadow:0 1px 8px rgba(0,0,0,.9)}
.sv-hero .sv-stat__zahl,.sv-hero .sv-stat__label{text-shadow:0 1px 8px rgba(0,0,0,.8)}
.sv-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:90px;
  background:var(--sv-papier);clip-path:polygon(0 100%,100% 100%,100% 0);z-index:2}
.sv-hero__titel{
  font-size:clamp(64px,10vw,148px);font-weight:800;font-style:italic;
  line-height:1.0;letter-spacing:.005em;margin:18px 0 0}
.sv-hero__titel em{font-style:italic;color:var(--sv-gold)}
.sv-hero__titel strong{color:var(--sv-rot);font-weight:inherit}
.sv-hero__sub{display:inline-block;position:relative;z-index:0;max-width:560px;margin:26px 0 36px;
  font-size:clamp(17px,2vw,21px);color:#ececed;padding:16px 30px}
/* Weich auslaufende dunkle Fläche hinter der Subline (keine harte Kante) */
.sv-hero__sub::before{content:"";position:absolute;inset:-6px -10px;z-index:-1;
  background:rgba(14,14,16,.66);border-radius:20px;filter:blur(18px)}
.sv-hero__actions{gap:16px;flex-wrap:wrap!important}
.sv-hero__stats{
  border-top:1px solid rgba(255,255,255,.55);margin-top:80px;gap:0!important;width:100%}
.sv-stat{flex:1 1 200px;min-width:0;padding:36px 38px;position:relative}
.sv-stat::after{
  content:"";position:absolute;right:0;top:42px;bottom:42px;width:1px;
  background:rgba(255,255,255,.45);box-shadow:0 0 5px rgba(0,0,0,.4)}
.sv-stat:first-child{padding-left:0}
.sv-stat:last-child::after{display:none}
.sv-stat__zahl{
  font-family:var(--sv-display);font-style:italic;font-weight:800;
  font-size:44px;color:var(--sv-gold);line-height:1;margin:0}
.sv-stat__label{
  font-size:15px;color:#fff;text-transform:uppercase;
  letter-spacing:.1em;font-weight:600;margin:12px 0 0;
  overflow-wrap:break-word;hyphens:auto}
@media (max-width:640px){
  /* „Eine Bildschirmhöhe“-Hero: füllt genau den ersten Screen, danach beginnt der Inhalt */
  .sv-hero{padding:44px 20px 116px;min-height:calc(100vh - 77px);min-height:calc(100svh - 77px)}
  .sv-hero .sv-kicker{font-size:12.5px;letter-spacing:.12em}
  .sv-hero__titel{font-size:48px}
  .sv-hero__sub{font-size:15.5px;margin:16px 0 22px;padding:12px 16px}
  /* Buttons nebeneinander statt untereinander */
  .sv-hero__actions{flex-wrap:nowrap!important;gap:10px}
  .sv-hero__actions .wp-block-button{min-width:0}
  .sv-hero__actions .wp-block-button__link{font-size:13.5px;padding:12px 12px;white-space:nowrap}
  /* Statistik als kompakte Chips statt 2×2-Block: spart ~250 px, gibt dem Bild Luft */
  .sv-hero__stats{margin-top:26px;border-top:none;gap:8px!important}
  .sv-stat{flex:0 1 auto;display:flex;align-items:baseline;gap:7px;padding:7px 12px;
    background:rgba(14,14,16,.45);border:1px solid rgba(255,255,255,.28);border-radius:10px}
  .sv-stat:first-child{padding-left:12px}
  .sv-stat::after{display:none}
  .sv-stat__zahl{font-size:20px}
  .sv-stat__label{min-height:0;font-size:12px;margin:0;letter-spacing:.06em}
}

/* ---------- Abteilungen ---------- */
.sv-abt-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.sv-abt-card{
  position:relative;background:#fff;border-radius:var(--sv-radius);
  padding:30px 26px 26px;box-shadow:var(--sv-shadow);overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease}
.sv-abt-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--sv-rot),var(--sv-gold));
  transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.sv-abt-card:hover{transform:translateY(-6px);box-shadow:var(--sv-shadow-lg)}
.sv-abt-card:hover::before{transform:scaleX(1)}
.sv-abt-card__icon{
  width:54px;height:54px;border-radius:12px;background:var(--sv-grau-hell);
  display:grid;place-items:center;margin-bottom:18px;color:var(--sv-rot-text)}
.sv-abt-card__icon svg{width:30px;height:30px}
.sv-abt-card__titel{font-size:26px;font-weight:700;margin:0 0 4px;font-style:normal}
.sv-abt-card__text{font-size:15px;color:var(--sv-grau);margin:0 0 16px}
.sv-abt-card__link{margin:0}
.sv-abt-card__link a{
  font-weight:700;font-size:14.5px;color:var(--sv-rot-text);
  text-transform:uppercase;letter-spacing:.08em;text-decoration:none}
.sv-abt-card__link a::after{content:" →"}

/* ---------- Aktuelles ---------- */
.sv-news{background:#fff}
ul.sv-news-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:26px;list-style:none;padding:0;margin:0}
.sv-news-grid > li{margin:0}
.sv-news-card{
  background:var(--sv-papier);border-radius:var(--sv-radius);overflow:hidden;
  box-shadow:var(--sv-shadow);display:flex;flex-direction:column;height:100%;
  transition:transform .2s ease,box-shadow .2s ease}
.sv-news-card:hover{transform:translateY(-6px);box-shadow:var(--sv-shadow-lg)}
.sv-news-card__media{
  position:relative;aspect-ratio:16/9;
  background:var(--sv-anthrazit) url(../img/logo-sv-final.png) center/150px auto no-repeat}
.sv-news-card__media figure{margin:0;height:100%}
.sv-news-card__media img{width:100%;height:100%;object-fit:cover}
.sv-news-card__datum{
  position:absolute;top:14px;left:14px;background:var(--sv-gold);color:var(--sv-schwarz);
  font-family:var(--sv-display);font-weight:700;font-size:15px;text-transform:uppercase;
  letter-spacing:.06em;padding:5px 12px;border-radius:6px;margin:0}
.sv-news-card__body{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.sv-news-card__tag{
  font-size:13px;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;margin:0 0 8px}
.sv-news-card__tag a{color:var(--sv-rot-text);text-decoration:none}
.sv-news-card__titel{font-size:27px;font-weight:700;margin:0 0 8px;font-style:normal}
.sv-news-card__titel a{color:inherit;text-decoration:none}
.sv-news-card__titel a:hover{color:var(--sv-rot-text)}
.sv-news-card__text{
  font-size:15.5px;color:var(--sv-grau);flex:1;margin:0;
  /* Eigener Flex-Container, damit "Weiterlesen" unabhaengig von der Laenge des
     Textauszugs immer an der Unterkante der Karte sitzt und alle Karten einer
     Reihe auf einer Linie abschliessen. */
  display:flex;flex-direction:column}
.sv-news-card__text .wp-block-post-excerpt__excerpt{margin:0}
.sv-news-card__text .wp-block-post-excerpt__more-text{margin:auto 0 0;padding-top:14px}
/* Die Kategoriezeile darf die Karten nicht gegeneinander verschieben. */
.sv-news-card__tag{min-height:1.5em}
.sv-news-card__text .wp-block-post-excerpt__more-link{
  display:inline-block;margin-top:18px;font-weight:700;font-size:14.5px;
  color:var(--sv-rot-text);text-transform:uppercase;letter-spacing:.08em;text-decoration:none}
.sv-news-card__text .wp-block-post-excerpt__more-link::after{content:" →"}
.sv-news-leer{color:var(--sv-grau);font-size:17px}
.sv-pagination{margin-top:48px;font-weight:600}

/* ---------- Vermietung ---------- */
.sv-vermietung{background:var(--sv-schwarz);color:#fff}
.sv-vermietung .sv-section__intro{color:#b9b9c0}
.sv-vermietung .sv-section__titel{color:#fff}
.sv-vermietung__layout{gap:56px}
.sv-vermietung__foto{margin:0;border-radius:var(--sv-radius);overflow:hidden;box-shadow:var(--sv-shadow-lg);position:relative}
.sv-vermietung__foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(20deg,rgba(247,39,6,.30),transparent 55%)}
.sv-vermietung__foto img{width:100%;aspect-ratio:4/3;object-fit:cover}
.sv-angebote > .sv-angebot{margin-bottom:14px}
.sv-angebot{
  position:relative;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);
  border-radius:12px;padding:18px 20px;gap:18px;
  transition:border-color .2s,background .2s,transform .2s}
.sv-angebot:hover{border-color:var(--sv-gold);background:rgba(255,255,255,.08);transform:translateY(-3px)}
.sv-angebot__link{position:absolute;inset:0;z-index:2;border-radius:12px;
  font-size:0;text-indent:-9999px;overflow:hidden}
.sv-angebot__titel::after{content:" →";color:var(--sv-gold);font-style:normal}
.sv-angebot__icon{
  flex:0 0 auto;width:44px;height:44px;border-radius:10px;
  background:var(--sv-gold);color:var(--sv-schwarz);display:grid;place-items:center}
.sv-angebot__icon svg{width:24px;height:24px}
.sv-angebot__titel{font-size:23px;font-weight:700;margin:0;color:#fff;font-style:normal}
.sv-angebot__text{font-size:15px;color:#b9b9c0;margin:4px 0 0}
@media (max-width:781px){
  .sv-vermietung__layout{gap:24px}
}

/* ---------- CTA ---------- */
.sv-cta{padding:80px 24px;color:#fff}
.sv-cta__inner{gap:28px;flex-wrap:wrap!important}
.sv-cta__titel{
  font-size:clamp(36px,4.6vw,54px);font-weight:800;font-style:italic;color:#fff;margin:0}
.sv-cta__titel em{color:var(--sv-gold);font-style:italic}
.sv-cta__text{margin:8px 0 0;font-size:18px;color:#ffe3d9;max-width:520px}
.sv-cta__button .wp-block-button__link{font-size:21px;padding:16px 36px}

/* ---------- Sponsoren ---------- */
.sv-sponsoren{padding:70px 24px}
.sv-sponsoren__grid{display:flex;flex-wrap:wrap;gap:18px;margin-top:36px;
  max-width:1200px;margin-left:auto;margin-right:auto}
.sv-sponsor{
  flex:1 1 160px;min-width:0;max-width:420px;box-sizing:border-box;
  display:grid;place-items:center;background:#fff;border-radius:12px;
  box-shadow:var(--sv-shadow);padding:26px 22px;margin:0;min-height:180px;
  text-decoration:none;transition:transform .2s,box-shadow .2s}
.sv-sponsor:hover{transform:translateY(-4px);box-shadow:var(--sv-shadow-lg)}
.sv-sponsor img{
  max-height:150px;max-width:min(290px,100%);width:auto;height:auto;object-fit:contain;
  transition:transform .25s}
.sv-sponsor:hover img{transform:scale(1.06)}

/* ---------- Footer ---------- */
.sv-footer{background:var(--sv-schwarz);color:#b9b9c0;padding:72px 24px 0}
.sv-footer__grid{gap:40px;padding-bottom:56px}
.sv-footer__brand{gap:14px;margin-bottom:18px}
.sv-footer__brand figure{margin:0}
.sv-footer__brandname{
  font-family:var(--sv-display);font-weight:800;font-size:22px;text-transform:uppercase;
  line-height:.95;color:#fff;margin:0}
.sv-footer__brandname span{
  font-weight:600;font-size:13px;letter-spacing:.28em;color:var(--sv-gold)}
.sv-footer__adresse{font-size:15px;max-width:300px}
.sv-footer__titel{
  font-family:var(--sv-display);text-transform:uppercase;font-size:18px;
  letter-spacing:.08em;color:#fff;margin:0 0 16px;font-style:normal}
ul.sv-footer__links{list-style:none;padding:0;margin:0}
.sv-footer__links li{margin-bottom:9px;font-size:15px}
.sv-footer__links a{color:#b9b9c0;text-decoration:none;transition:color .15s}
.sv-footer__links a:hover{color:var(--sv-gold)}
.sv-footer__bottom{
  border-top:1px solid rgba(255,255,255,.10);padding:22px 0;font-size:14px}
.sv-footer__bottom p{margin:0}

/* ---------- Beitrag / Seite ---------- */
.sv-beitrag,.sv-seite{padding-top:72px}
.sv-beitrag__kopf{margin-bottom:28px}
.sv-beitrag__titel{
  font-size:clamp(36px,5vw,56px);font-weight:800;font-style:italic;margin:10px 0 6px}
.sv-beitrag__datum{color:var(--sv-grau);font-size:15px}
.sv-beitrag__bild{border-radius:var(--sv-radius);overflow:hidden;margin-bottom:40px}
.sv-beitrag__zurueck{margin-top:56px}
/* Luft für Zwischenüberschriften im Seiteninhalt */
.sv-seite .wp-block-post-content h2,
.sv-beitrag .wp-block-post-content h2{margin:44px 0 12px;font-size:clamp(26px,3vw,34px)}
.sv-seite .wp-block-post-content h3,
.sv-beitrag .wp-block-post-content h3{margin:32px 0 8px}
.sv-beitrag__zurueck a{font-weight:700;text-decoration:none}
.sv-archiv ul.sv-news-grid{margin-top:24px}

/* Breite Elemente im Seiteninhalt (alignwide) wirklich breit machen */
.wp-block-post-content > .alignwide{max-width:1200px!important;margin-left:auto!important;margin-right:auto!important}
/* Seitentitel bleibt auf Lesebreite des Textes (Container ist 1200px) */
.sv-seite > .wp-block-post-title,
.sv-beitrag > .wp-block-post-title{max-width:760px!important;margin-left:auto!important;margin-right:auto!important}

/* ---------- fussball.de-Widgets (Klick-zum-Laden) ---------- */
.sv-fbde-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(420px,100%),1fr));gap:26px;margin:32px 0}
.sv-fbde{background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);padding:24px;overflow:hidden}
.sv-fbde__titel{font-family:var(--sv-display);font-weight:700;text-transform:uppercase;font-size:22px;margin:0 0 14px}
.sv-fbde__ziel{min-width:0}
.sv-fbde__ziel iframe{max-width:100%}
.sv-fbde__laden{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;
  font-family:var(--sv-display);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.05em;
  background:var(--sv-rot);color:#fff;border:none;border-radius:8px;padding:12px 22px;
  transition:background .15s,transform .15s}
.sv-fbde__laden:hover{background:var(--sv-rot-dunkel);transform:translateY(-2px)}
.sv-fbde__hinweis{font-size:13.5px;color:var(--sv-grau);margin:12px 0 0}
.sv-fbde--geladen .sv-fbde__laden,
.sv-fbde--geladen .sv-fbde__hinweis{display:none}
.sv-fbde--ohne-schluessel .sv-fbde__laden{display:none}
.sv-fbde--ohne-schluessel .sv-fbde__ziel::before{
  content:"Noch kein Widget-Schlüssel eingetragen – Anleitung siehe Infokasten unten.";
  display:block;font-size:14.5px;color:var(--sv-grau);
  background:var(--sv-grau-hell);border-radius:8px;padding:14px 16px}
.sv-fbde--fehler .sv-fbde__ziel::before{
  content:"Die Daten von fussball.de konnten gerade nicht geladen werden.";
  display:block;font-size:14.5px;color:var(--sv-rot-text);
  background:#fdeeea;border-radius:8px;padding:14px 16px}

/* Infokasten */
.sv-infokasten{
  background:#fff;border-left:5px solid var(--sv-gold);border-radius:0 var(--sv-radius) var(--sv-radius) 0;
  box-shadow:var(--sv-shadow);padding:22px 26px;margin:32px 0;font-size:15.5px}
.sv-infokasten p{margin:0 0 8px}
.sv-infokasten ol{margin:8px 0 0 18px;padding:0}
.sv-infokasten li{margin-bottom:6px}

/* Trainingszeiten-Tabelle */
.sv-zeiten{overflow-x:auto;background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);margin:32px 0}
.sv-zeiten table{width:100%;border-collapse:collapse;min-width:680px;margin:0}
.sv-zeiten th{
  background:var(--sv-schwarz);color:#fff;font-family:var(--sv-display);
  font-weight:700;text-transform:uppercase;letter-spacing:.07em;font-size:17px;
  text-align:left;padding:14px 22px}
.sv-zeiten th:first-child::before{content:"";display:inline-block;width:10px;height:10px;
  border-radius:3px;background:var(--sv-gold);margin-right:10px;vertical-align:1px}
.sv-zeiten td{padding:14px 22px;font-size:15.5px;border-bottom:1px solid var(--sv-grau-hell);vertical-align:top}
.sv-zeiten tbody tr:nth-child(even){background:var(--sv-papier)}
.sv-zeiten tbody tr:last-child td{border-bottom:none}
.sv-zeiten tbody tr{transition:background .15s}
.sv-zeiten tbody tr:hover{background:#fdf3e0}
.sv-zeiten td:first-child{font-weight:700;white-space:nowrap}
.sv-zeiten td:nth-child(3){color:var(--sv-grau)}

/* Mannschaftskarten auf Abteilungsseiten */
.sv-team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin:32px 0}
.sv-team{background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);padding:24px;position:relative;overflow:hidden}
.sv-team::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--sv-rot),var(--sv-gold))}
.sv-team h3{font-size:24px;font-weight:700;margin:0 0 4px;font-style:normal}
.sv-team p{font-size:15px;color:var(--sv-grau);margin:0}
a.sv-team--link{display:block;text-decoration:none;color:inherit;
  transition:transform .2s ease,box-shadow .2s ease}
a.sv-team--link:hover{transform:translateY(-6px);box-shadow:var(--sv-shadow-lg)}
.sv-team__mehr{display:inline-block;margin-top:14px;font-weight:700;font-size:14px;
  color:var(--sv-rot-text);text-transform:uppercase;letter-spacing:.08em}
.sv-team__mehr::after{content:" →"}

/* Kontakt-Karten (Vorstand, Ansprechpartner, Bankverbindung) */
.sv-kontakt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:22px;margin:32px 0}
.sv-kontakt{background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);
  padding:26px 24px;position:relative;overflow:hidden}
.sv-kontakt::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--sv-rot),var(--sv-gold))}
.sv-kontakt__rolle{display:inline-block;font-family:var(--sv-display);font-weight:700;
  font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--sv-rot-text);margin-bottom:8px}
.sv-kontakt__name{font-size:22px;font-weight:700;margin:0 0 12px;font-style:normal;line-height:1.15}
/* Eigennamen (Trainer/Ansprechpartner) in natuerlicher Schreibweise - sonst wird z. B. "Assmann" aus "Aszmann" wg. Versal-ss */
.sv-kontakt-grid--mittig .sv-kontakt__name{text-transform:none}
.sv-kontakt p{font-size:15px;color:var(--sv-grau);margin:0 0 10px;line-height:1.65}
.sv-kontakt p:last-child{margin-bottom:0}
.sv-kontakt__adr{color:var(--sv-schwarz)!important}
.sv-kontakt__mail{display:inline-block;font-weight:600;font-size:14.5px;word-break:break-word;color:var(--sv-rot-text)}

/* ---------- Aufnahmeantrag-Formular ---------- */
.sv-form{background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);padding:36px 34px;margin:32px 0}
.sv-form fieldset{border:none;margin:0 0 28px;padding:0}
.sv-form legend{
  font-family:var(--sv-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;font-size:21px;margin-bottom:14px;padding:0}
.sv-form__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 22px}
.sv-form__grid p,.sv-form p{margin:0}
.sv-form__grid p{min-width:0} /* Grid-Zellen dürfen schmaler werden als der Feld-Eigenbedarf */
.sv-form__breit{grid-column:1 / -1}
.sv-form label{display:block;font-weight:600;font-size:14.5px;margin-bottom:6px}
.sv-form *,.sv-form *::before,.sv-form *::after{box-sizing:border-box}
.sv-form input[type=text],.sv-form input[type=email],.sv-form input[type=tel],
.sv-form input[type=date],.sv-form select,.sv-form textarea{
  width:100%;max-width:100%;min-width:0;height:48px;min-height:0;padding:10px 14px;
  font:inherit;font-size:16px;line-height:1.4;
  border:1.5px solid var(--sv-grau-300,#d8d8dc);border-radius:8px;background:var(--sv-papier);
  transition:border-color .15s}
/* Datumsfelder: native Optik (v. a. iOS) abschalten, sonst eigene Größe/Überbreite */
.sv-form input[type=date]{-webkit-appearance:none;appearance:none;display:block}
.sv-form textarea{height:auto;min-height:96px;resize:vertical}
.sv-form input:focus,.sv-form select:focus,.sv-form textarea:focus{
  border-color:var(--sv-rot);outline:none;background:#fff}
.sv-form__radios{display:flex;flex-wrap:wrap;gap:10px 28px}
.sv-form__radios label,.sv-form__zustimmung label{
  display:flex;align-items:flex-start;gap:10px;font-weight:500;font-size:15.5px;margin:0;cursor:pointer}
.sv-form__radios input,.sv-form__zustimmung input{width:20px;height:20px;margin-top:2px;accent-color:var(--sv-rot)}
.sv-form__zustimmung{margin:0 0 24px!important}
.sv-form__senden{
  font-family:var(--sv-display);font-weight:700;font-size:20px;text-transform:uppercase;
  letter-spacing:.06em;background:var(--sv-rot);color:#fff;border:none;border-radius:8px;
  padding:15px 36px;cursor:pointer;transition:background .15s,transform .15s}
.sv-form__senden:hover{background:var(--sv-rot-dunkel);transform:translateY(-2px)}
.sv-form__hinweis{margin-top:14px!important;font-size:13.5px;color:var(--sv-grau)}
.sv-form__honig{position:absolute!important;left:-9999px;opacity:0;height:0;overflow:hidden}
.sv-form-erfolg,.sv-form-fehler{
  border-radius:var(--sv-radius);padding:22px 26px;margin:32px 0;font-size:16.5px}
.sv-form-erfolg{background:#e8f6ea;border-left:5px solid #2e9e44}
.sv-form-fehler{background:#fdeeea;border-left:5px solid var(--sv-rot)}
@media (max-width:640px){
  .sv-form{padding:26px 20px}
  .sv-form__grid{grid-template-columns:1fr}
}

/* ---------- Chronik ---------- */
.sv-chronik-intro{font-size:19px;line-height:1.7;max-width:760px}
.sv-chronik h2{margin-top:8px}
/* Gründungs-Highlight */
.sv-chronik-highlight{
  background:var(--sv-schwarz);color:#fff;border-radius:var(--sv-radius);
  padding:32px 34px;margin:32px 0;position:relative;overflow:hidden}
.sv-chronik-highlight::before{content:"";position:absolute;top:0;left:0;bottom:0;width:6px;
  background:linear-gradient(var(--sv-rot),var(--sv-gold))}
.sv-chronik-highlight .jahr{font-family:var(--sv-display);font-weight:800;font-style:italic;
  font-size:clamp(40px,6vw,68px);line-height:1;color:var(--sv-gold);margin:0 0 10px}
.sv-chronik-highlight p{margin:0;font-size:17.5px;line-height:1.7;color:#e8e8ea}
/* Zeitstrahl */
.sv-zeitstrahl{margin:32px 0;border-left:3px solid var(--sv-grau-hell);padding-left:0}
.sv-zeit-eintrag{position:relative;display:grid;grid-template-columns:96px 1fr;gap:20px;
  padding:0 0 24px 28px;margin-left:-3px;border-left:3px solid transparent}
.sv-zeit-eintrag::before{content:"";position:absolute;left:-9px;top:4px;width:15px;height:15px;
  border-radius:50%;background:var(--sv-rot);border:3px solid var(--sv-papier);box-shadow:0 0 0 2px var(--sv-rot)}
.sv-zeit-jahr{font-family:var(--sv-display);font-weight:800;font-size:21px;color:var(--sv-rot-text);line-height:1.3;white-space:nowrap}
.sv-zeit-text{font-size:16px;line-height:1.6;color:var(--sv-schwarz)}
@media (max-width:600px){
  .sv-zeit-eintrag{grid-template-columns:1fr;gap:4px;padding-bottom:22px}
}
/* Listen für Vorstände/Mitarbeiter */
.sv-amtszeit{list-style:none;margin:24px 0;padding:0;
  columns:2;column-gap:48px}
.sv-amtszeit li{break-inside:avoid;padding:9px 0;border-bottom:1px solid var(--sv-grau-hell);
  display:grid;grid-template-columns:104px 1fr;gap:14px;font-size:15.5px}
.sv-amtszeit li b{font-family:var(--sv-display);font-weight:700;color:var(--sv-rot-text)}
@media (max-width:640px){.sv-amtszeit{columns:1}}

/* ---------- Satzung ---------- */
.sv-satzung-toc{background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);
  padding:26px 30px;margin:32px 0}
.sv-satzung-toc h2{font-family:var(--sv-display);text-transform:uppercase;font-size:20px;
  letter-spacing:.06em;margin:0 0 14px}
.sv-satzung-toc ol{list-style:none;margin:0;padding:0;columns:2;column-gap:40px}
.sv-satzung-toc li{break-inside:avoid;margin-bottom:7px}
.sv-satzung-toc a{display:block;font-size:15px;color:var(--sv-schwarz);text-decoration:none;
  padding:5px 8px;border-radius:6px;transition:background .15s,color .15s}
.sv-satzung-toc a:hover{background:var(--sv-grau-hell);color:var(--sv-rot-text)}
.sv-satzung-toc b{color:var(--sv-rot-text);font-family:var(--sv-display);font-weight:700;margin-right:6px}
@media (max-width:640px){.sv-satzung-toc ol{columns:1}}

.sv-paragraf{background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);
  padding:26px 30px 22px;margin:0 0 20px;border-left:5px solid var(--sv-gold);scroll-margin-top:100px}
.sv-paragraf__titel{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  font-size:22px;font-weight:700;font-style:normal;margin:0 0 14px;line-height:1.2}
.sv-paragraf__nr{font-family:var(--sv-display);font-weight:800;font-style:italic;
  font-size:28px;color:var(--sv-rot);line-height:1}
.sv-paragraf__body p{font-size:15.5px;line-height:1.65;margin:0 0 10px;color:var(--sv-schwarz)}
.sv-paragraf__body ul{margin:0 0 10px;padding-left:22px}
.sv-paragraf__body li{font-size:15.5px;line-height:1.6;margin-bottom:7px}
.sv-paragraf__body :last-child{margin-bottom:0}

/* ---------- Scroll-Reveal (per JS gesetzt) ---------- */
.sv-reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease}
.sv-reveal.sv-sichtbar{opacity:1;transform:none}

/* ---------- Vermietung-Unterseiten: Preistabellen ---------- */
.sv-preise{overflow-x:auto;background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);margin:24px 0}
.sv-preise table{width:100%;border-collapse:collapse;margin:0}
.sv-preise th{background:var(--sv-schwarz);color:#fff;font-family:var(--sv-display);font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;font-size:14px;text-align:left;padding:13px 20px}
.sv-preise td{padding:12px 20px;font-size:15px;border-bottom:1px solid var(--sv-grau-hell);vertical-align:top;color:var(--sv-schwarz)}
.sv-preise tbody tr:nth-child(even){background:var(--sv-papier)}
.sv-preise tbody tr:last-child td{border-bottom:none}
.sv-preise td:first-child{font-weight:600}
.sv-preise th:not(:first-child),.sv-preise td:not(:first-child){text-align:right;white-space:nowrap}
.sv-hinweis{font-size:14px;color:var(--sv-grau);margin:6px 2px 0;line-height:1.6}

/* ---------- Sponsoren-CTA ---------- */
.sv-sponsoren__cta{margin-top:28px;font-size:16px;color:var(--sv-grau)}
.sv-sponsoren__cta a{font-weight:700;color:var(--sv-rot-text);text-decoration:none}
.sv-sponsoren__cta a:hover{text-decoration:underline}
/* Preistabellen-Variante mit Fließtext statt Zahlen (z. B. Sponsoring-Pakete) */
.sv-preise--text th:not(:first-child),.sv-preise--text td:not(:first-child){
  text-align:left;white-space:normal}
.sv-preise--text td:first-child{white-space:nowrap}
/* Kontakt-Karten als 2×2-Raster (z. B. Werte-Karten auf Teamseiten) */
.sv-kontakt-grid--paare{grid-template-columns:repeat(auto-fill,minmax(min(420px,100%),1fr))}
/* Kontakt-Karten zentriert (z. B. Trainer-Kacheln auf Teamseiten) */
.sv-kontakt-grid--mittig{grid-template-columns:repeat(auto-fit,minmax(min(310px,100%),380px));justify-content:center}

/* Mobil: Trainingszeiten-Tabelle als gestapelte Karten statt Seitwaerts-Scrollen */
@media (max-width:640px){
  .sv-zeiten{overflow:visible}
  .sv-zeiten table{min-width:0;width:100%}
  .sv-zeiten thead{display:none}
  .sv-zeiten tbody tr{display:block;padding:14px 18px;border-bottom:1px solid var(--sv-grau-hell)}
  .sv-zeiten tbody tr:last-child{border-bottom:none}
  .sv-zeiten td{display:block;border:none;padding:0}
  .sv-zeiten td:first-child{font-family:var(--sv-display);text-transform:uppercase;
    letter-spacing:.04em;font-size:17px;font-weight:700;white-space:normal;margin-bottom:3px}
  .sv-zeiten td:nth-child(2){font-size:15px;line-height:1.5}
  .sv-zeiten td:nth-child(3){font-size:13.5px;margin-top:2px}
  .sv-zeiten td:nth-child(3)::before{content:"Trainer: "}
}

/* ---------- Social-Media-Icons (Footer dunkel / Kontaktseite hell) ---------- */
.sv-social{display:flex;gap:10px;margin-top:18px}
.sv-social a{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;
  color:#b9b9c0;border:1px solid rgba(255,255,255,.16);
  transition:color .15s,border-color .15s,transform .15s}
.sv-social a:hover{color:var(--sv-gold);border-color:var(--sv-gold);transform:translateY(-2px)}
.sv-social svg{width:19px;height:19px}
.sv-social--hell a{color:var(--sv-grau);border-color:#e2e1dc;background:#fff;box-shadow:var(--sv-shadow)}
.sv-social--hell a:hover{color:var(--sv-rot-text);border-color:var(--sv-rot-text)}

/* ---------- Zwei-Ebenen-Struktur: Verein (Ueberbau) / Abteilung ---------- */
/* Schmale Leiste ueber dem Header: macht die Zugehoerigkeit der Abteilung sichtbar. */
.sv-abteilungsleiste{background:#000;color:#cfcfd4;font-size:13.5px}
.sv-abteilungsleiste__inner{
  max-width:1200px;margin:0 auto;padding:8px 24px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sv-abteilungsleiste__verein{
  color:#fff;text-decoration:none;font-weight:600;letter-spacing:.02em;
  display:inline-flex;align-items:center;gap:7px;transition:color .2s}
.sv-abteilungsleiste__verein:hover,.sv-abteilungsleiste__verein:focus-visible{color:var(--sv-gold)}
.sv-abteilungsleiste__pfeil{color:var(--sv-gold)}
.sv-abteilungsleiste__trenner{color:#5c5c66}
.sv-abteilungsleiste__aktuell{
  text-transform:uppercase;letter-spacing:.1em;font-size:12px;
  font-weight:700;color:var(--sv-gold)}

/* Abteilungskarten: ganze Karte klickbar, Karten ohne eigene Seite zurueckgenommen. */
.sv-abt-card__link a::before{content:"";position:absolute;inset:0;border-radius:var(--sv-radius)}
.sv-abt-card--bald{opacity:.72}
.sv-abt-card--bald:hover{transform:none;box-shadow:var(--sv-shadow)}
.sv-abt-card--bald:hover::before{transform:scaleX(0)}
.sv-abt-card__hinweis{font-size:13.5px;color:var(--sv-grau);margin:0;font-style:italic}
/* Abteilungskarten: Link/Hinweis buendig an der Unterkante aller Karten. */
.sv-abt-card{display:flex;flex-direction:column}
.sv-abt-card__link,.sv-abt-card__hinweis{margin-top:auto;padding-top:4px}
/* Ab zwei Spalten alle Zeilen gleich hoch, damit die Links auch ueber die
   Reihen hinweg auf einer Linie sitzen. Einspaltig (Handy) waere das nur
   unnoetiger Leerraum, weil nie zwei Karten nebeneinander stehen. */
@media (min-width:640px){
  .sv-abt-grid{grid-auto-rows:1fr}
}

/* Vermietungs-Kacheln stehen als Rohmarkup in der Spalte, brauchen also Flex. */
.sv-angebot{display:flex;align-items:center}

@media (max-width:640px){
  .sv-abteilungsleiste__inner{padding:7px 20px;font-size:12.5px;gap:8px}
  .sv-abteilungsleiste__aktuell{font-size:11px;letter-spacing:.08em}
  /* Der Ein-Screen-Hero muss die zusaetzliche Leiste mit einrechnen. */
  body.sv-hat-abteilungsleiste .sv-hero{
    min-height:calc(100vh - 77px - 32px);min-height:calc(100svh - 77px - 32px)}
}

/* ---------- Download-Karten (PDF-Formulare) ---------- */
.sv-downloads{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));
  gap:16px;margin:26px 0}
.sv-download{
  display:flex;align-items:center;gap:16px;text-decoration:none;color:inherit;
  background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);
  padding:18px 20px;transition:transform .2s ease,box-shadow .2s ease}
.sv-download:hover,.sv-download:focus-visible{
  transform:translateY(-3px);box-shadow:var(--sv-shadow-lg)}
.sv-download__icon{
  flex:0 0 auto;width:46px;height:46px;border-radius:10px;
  background:var(--sv-grau-hell);color:var(--sv-rot-text);display:grid;place-items:center}
.sv-download__icon svg{width:25px;height:25px}
.sv-download__text{display:block;min-width:0}
.sv-download__titel{
  display:block;font-weight:700;font-size:17px;line-height:1.35;color:var(--sv-schwarz)}
.sv-download__meta{
  display:block;font-size:12.5px;color:var(--sv-grau);margin-top:3px;
  text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.sv-download__titel::after{content:" \2193";color:var(--sv-rot-text)}

/* Infokasten-Variante fuer Warnhinweise (roter statt goldener Balken) */
.sv-infokasten--warnung{border-left-color:var(--sv-rot)}

/* ---------- Aufnahmeformular (Contact Form 7, eigenes Raster) ---------- */
.sv-formular{
  background:#fff;border-radius:var(--sv-radius);box-shadow:var(--sv-shadow);
  padding:34px 32px;margin:28px 0}
.sv-form__titel{
  font-family:var(--sv-display);font-weight:800;font-style:italic;text-transform:uppercase;
  font-size:26px;letter-spacing:.01em;margin:34px 0 4px;padding-top:22px;
  border-top:2px solid var(--sv-grau-hell)}
.sv-formular > .sv-form__titel:first-of-type{margin-top:6px;padding-top:0;border-top:none}
.sv-form__zeile{
  display:grid;grid-template-columns:repeat(12,1fr);gap:16px 18px;margin:14px 0}
.sv-form__feld{grid-column:span 12;min-width:0}
.sv-form__feld--1{grid-column:span 1}   .sv-form__feld--2{grid-column:span 2}
.sv-form__feld--3{grid-column:span 3}   .sv-form__feld--4{grid-column:span 4}
.sv-form__feld--5{grid-column:span 5}   .sv-form__feld--6{grid-column:span 6}
.sv-form__feld--9{grid-column:span 9}   .sv-form__feld--12{grid-column:span 12}
.sv-form__label{
  display:block;font-weight:700;font-size:14.5px;color:var(--sv-schwarz);
  margin-bottom:6px;letter-spacing:.01em}
.sv-form__label em,.sv-formular em{color:var(--sv-rot-text);font-style:normal;font-weight:700}
.sv-form__tipp{font-size:13px;color:var(--sv-grau);margin:6px 0 0;line-height:1.5}
/* Contact Form 7 umhuellt jedes Feld mit einem inline-Element. Dadurch wird der
   Zeilenumbruch zwischen Label und Feld als Leerzeichen gerendert und schiebt das
   Feld nach unten. Als Blockelement entfaellt dieser Leerraum. */
.sv-formular .wpcf7-form-control-wrap{display:block}
.sv-form__block{
  background:var(--sv-papier);border-radius:12px;padding:18px 22px;margin:14px 0;
  font-size:14.5px;line-height:1.65}
.sv-form__block p{margin:0 0 10px}
.sv-form__block p:last-child{margin-bottom:0}

/* Eingabefelder */
.sv-formular input[type=text],.sv-formular input[type=email],.sv-formular input[type=tel],
.sv-formular input[type=number],.sv-formular input[type=date],
.sv-formular select,.sv-formular textarea{
  width:100%;box-sizing:border-box;font:inherit;font-size:15.5px;color:var(--sv-schwarz);
  background:#fff;border:1.5px solid #d8d7d2;border-radius:9px;padding:11px 13px;
  transition:border-color .15s,box-shadow .15s}
.sv-formular textarea{min-height:88px;resize:vertical}
.sv-formular input:focus,.sv-formular select:focus,.sv-formular textarea:focus{
  outline:none;border-color:var(--sv-rot);box-shadow:0 0 0 3px rgba(247,39,6,.12)}
.sv-formular .wpcf7-not-valid{border-color:var(--sv-rot)}

/* Auswahlfelder */
.sv-formular .wpcf7-radio,.sv-formular .wpcf7-acceptance{display:block}
.sv-formular .wpcf7-list-item{display:block;margin:0 0 8px}
.sv-formular .wpcf7-list-item label{
  display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.5;cursor:pointer}
.sv-formular input[type=radio],.sv-formular input[type=checkbox]{
  width:19px;height:19px;flex:0 0 auto;margin-top:1px;accent-color:var(--sv-rot)}
.sv-formular .wpcf7-acceptance .wpcf7-list-item{margin:0}
.sv-formular a{color:var(--sv-rot-text);text-decoration:underline}

/* Bedingte Felder: Das Plugin vergibt diese Klasse per JavaScript, liefert aber
   selbst kein Stylesheet mit. Ohne die folgende Regel bleiben ausgeblendete
   Gruppen sichtbar, obwohl sie aus Pruefung und Versand ausgenommen sind. */
.wpcf7cf-hidden{display:none!important}

/* Absenden */
.sv-form__aktion{margin-top:30px;padding-top:24px;border-top:2px solid var(--sv-grau-hell)}
.sv-formular input[type=submit]{
  font-family:var(--sv-display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  font-size:17px;color:#fff;background:var(--sv-rot);border:none;border-radius:9px;
  padding:15px 34px;cursor:pointer;transition:transform .18s,background-color .18s}
.sv-formular input[type=submit]:hover{background:var(--sv-rot-dunkel);transform:translateY(-2px)}
.sv-formular .wpcf7-spinner{margin-left:12px}

/* Rueckmeldungen von Contact Form 7 */
.sv-formular .wpcf7-response-output{
  margin:22px 0 0!important;padding:14px 18px!important;border-radius:9px;
  border-width:2px!important;font-size:15px}
.sv-formular .wpcf7-not-valid-tip{
  color:var(--sv-rot-text);font-size:13.5px;font-weight:600;margin-top:5px}

@media (max-width:781px){
  .sv-formular{padding:24px 20px}
  .sv-form__zeile{gap:12px}
  /* Auf schmalen Schirmen alles untereinander */
  .sv-form__feld,.sv-form__feld--1,.sv-form__feld--2,.sv-form__feld--3,.sv-form__feld--4,
  .sv-form__feld--5,.sv-form__feld--6,.sv-form__feld--9{grid-column:span 12}
}

/* ---------- 404-Seite ---------- */
.sv-404{padding:110px 24px 90px;text-align:center}
.sv-404__nr{
  font-family:var(--sv-display);font-style:italic;font-weight:800;line-height:.9;
  font-size:clamp(96px,18vw,190px);color:var(--sv-grau-hell);margin:0}
.sv-404__titel{
  font-size:clamp(32px,5vw,52px);font-weight:800;font-style:italic;margin:-8px 0 14px}
.sv-404__text{
  max-width:560px;margin:0 auto 34px;color:var(--sv-grau);font-size:17.5px;line-height:1.65}
.sv-404__links{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:center;list-style:none;padding:0;margin:0}
.sv-404__links li{margin:0}
.sv-404__links a{
  display:inline-block;text-decoration:none;font-weight:700;font-size:15px;
  color:var(--sv-schwarz);background:#fff;border-radius:999px;padding:11px 22px;
  box-shadow:var(--sv-shadow);transition:transform .18s,box-shadow .18s,color .18s}
.sv-404__links a:hover{transform:translateY(-3px);box-shadow:var(--sv-shadow-lg);color:var(--sv-rot-text)}

/* ---------- Fotogalerie (Bilder des Vereinsfotografen) ---------- */
.sv-fotos{background:var(--sv-schwarz);color:#fff}
.sv-fotos .sv-section__titel{color:#fff}
.sv-fotos .sv-section__intro{color:#b9b9c0}
.sv-fotos .sv-section__intro strong{color:#fff}
ul.sv-fotos-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));
  gap:14px;list-style:none;padding:0;margin:0}
.sv-fotos-grid > li{margin:0}
.sv-foto{
  position:relative;display:block;overflow:hidden;border-radius:12px;
  background:#1b1b20;text-decoration:none;
  transition:transform .22s ease,box-shadow .22s ease}
.sv-foto:hover,.sv-foto:focus-visible{transform:translateY(-4px);box-shadow:var(--sv-shadow-lg)}
.sv-foto__bild{
  display:block;width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;
  filter:saturate(.95);transition:transform .4s ease,filter .22s ease}
.sv-foto:hover .sv-foto__bild{transform:scale(1.05);filter:saturate(1.05)}
/* Bildtitel erscheint als Verlauf am unteren Rand */
.sv-foto__titel{
  position:absolute;left:0;right:0;bottom:0;padding:26px 14px 11px;
  font-size:12.5px;line-height:1.35;color:#fff;font-weight:600;
  background:linear-gradient(to top,rgba(14,14,16,.92),rgba(14,14,16,0));
  opacity:0;transform:translateY(6px);transition:opacity .22s ease,transform .22s ease;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sv-foto:hover .sv-foto__titel,.sv-foto:focus-visible .sv-foto__titel{opacity:1;transform:none}
.sv-fotos-nachweis{margin:26px 0 0}
.sv-fotos-nachweis__text{
  font-size:14.5px;color:#b9b9c0;margin:0;
  border-left:3px solid var(--sv-gold);padding-left:14px;line-height:1.6}
.sv-fotos-nachweis__text strong{color:var(--sv-gold)}
.sv-fotos-aktion{margin-top:30px}
@media (hover:none){
  /* Ohne Mauszeiger den Titel dauerhaft zeigen */
  .sv-foto__titel{opacity:1;transform:none}
}
@media (max-width:640px){
  ul.sv-fotos-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .sv-foto__titel{font-size:11.5px;padding:20px 10px 9px}
}

/* ---------- Bildreihe in Beitraegen ---------- */
.sv-bildreihe{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
  gap:14px;margin:26px 0}
.sv-bildreihe figure{margin:0;border-radius:12px;overflow:hidden;box-shadow:var(--sv-shadow);background:#fff}
.sv-bildreihe img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.sv-bildreihe figcaption{
  font-size:13px;color:var(--sv-grau);padding:9px 12px 11px;line-height:1.45}

/* Heim-Kennzeichnung in Terminlisten */
.sv-heim{
  display:inline-block;margin-left:6px;padding:2px 8px;border-radius:999px;
  background:var(--sv-gold);color:var(--sv-schwarz);
  font-family:var(--sv-display);font-weight:700;font-size:11.5px;
  text-transform:uppercase;letter-spacing:.08em;vertical-align:1px}
.sv-zeiten em{color:var(--sv-grau);font-style:normal;font-size:13.5px;white-space:nowrap}