/* ============================================================
   SNOW & FUN HOHENBERG e.V. – Custom CSS für Helix Ultimate
   Eintragen unter: Template-Optionen → Custom Code → Custom CSS
   ============================================================ */

/* ----------------------------------------------------------
   1. CSS VARIABLEN (Vereinsfarben)
   ---------------------------------------------------------- */
:root {
  --saf-blau:    #1E90D5;
  --saf-rot:     #CC2222;
  --saf-schwarz: #1A1A1A;
  --saf-gruen:   #4a8a28;
  --saf-winter:  #07223a;
  --saf-sommer:  #1c3a0a;
  --saf-footer:  #111111;
}

/* ----------------------------------------------------------
   2. GOOGLE FONTS
   Später ersetzen durch @font-face mit lokal gehosteten Dateien (DSGVO)
   ---------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800&family=Source+Sans+3:wght@400;600&display=swap');

body {
  font-family: 'Source Sans 3', sans-serif;
  font-size: 16px;
  color: var(--saf-schwarz);
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  color: var(--saf-schwarz);
}

/* ----------------------------------------------------------
   3. HEADER
   ---------------------------------------------------------- */
#sp-header {
  background-color: #ffffff !important;
  padding: 0 !important;
}

#sp-header .container-fluid .container-inner .row {
  flex-wrap: wrap;
}

#sp-logo {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 10px 20px 0;
}

#sp-menu {
  flex: 1;
  background-color: var(--saf-blau) !important;
  order: 10;
  min-height: 44px;
  max-height: 44px;
}

#sp-menu .sp-column {
  background-color: var(--saf-blau) !important;
  padding: 0 20px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#sp-menu .sp-megamenu-wrapper {
  height: 44px;
}

#menu-right {
  order: 11;
  background-color: var(--saf-blau) !important;
  padding: 0 15px;
  display: flex;
  align-items: center;
  height: 44px;
  margin-left: 0 !important;
}

#offcanvas-toggler .burger-icon span {
  background-color: #ffffff !important;
}

.sticky-header-placeholder {
  height: 10px !important;
}

#sp-main-body {
  padding-top: 80px !important;
}

/* ----------------------------------------------------------
   4. NAVIGATION / MENÜ-LINKS
   ---------------------------------------------------------- */
.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span {
  color: #ffffff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 0 14px;
  line-height: 44px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.sp-megamenu-parent > li > a:hover,
.sp-megamenu-parent > li.active > a,
.sp-megamenu-parent > li.current > a {
  background-color: var(--saf-rot) !important;
  color: #ffffff !important;
}

.sp-megamenu-parent .sp-dropdown {
  background: #ffffff;
  border-top: 3px solid var(--saf-blau);
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a {
  color: var(--saf-schwarz) !important;
  font-family: 'Source Sans 3', sans-serif !important;
  padding: 8px 20px;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover {
  color: var(--saf-blau) !important;
  background: #f0f7fd;
}

/* ----------------------------------------------------------
   5. STATUSBANNER
   ---------------------------------------------------------- */
.saf-statusbanner {
  width: 100%;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.saf-banner-winter {
  background-color: var(--saf-winter);
  color: #ffffff;
}

.saf-banner-sommer {
  background-color: var(--saf-sommer);
  color: #ffffff;
}

.saf-statusbanner .saf-status-item {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.saf-statusbanner .saf-badge-open {
  background: #2ecc71;
  color: #fff;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.saf-statusbanner .saf-badge-closed {
  background: var(--saf-rot);
  color: #fff;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.saf-schnee-balken {
  display: flex;
  align-items: center;
  gap: 6px;
}
.saf-schnee-balken .balken-bg {
  width: 80px;
  height: 8px;
  background: rgba(255,255,255,0.25);
  border-radius: 4px;
  overflow: hidden;
}
.saf-schnee-balken .balken-fill {
  height: 100%;
  background: #ffffff;
  border-radius: 4px;
}

/* ----------------------------------------------------------
   6. SPLIT-HERO
   ---------------------------------------------------------- */
.sppb-section-stretched {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.saf-hero-winter {
  background: linear-gradient(135deg, #07223a 0%, #1E90D5 100%) !important;
}
.saf-hero-sommer {
  background: linear-gradient(135deg, #1c3a0a 0%, #4a8a28 100%) !important;
}

.saf-hero-winter .sppb-btn {
  background-color: #ffffff !important;
  color: #07223a !important;
  border-color: #ffffff !important;
}
.saf-hero-winter .sppb-btn:hover {
  background-color: var(--saf-rot) !important;
  color: #ffffff !important;
}
.saf-hero-sommer .sppb-btn {
  background-color: #ffffff !important;
  color: #1c3a0a !important;
  border-color: #ffffff !important;
}
.saf-hero-sommer .sppb-btn:hover {
  background-color: var(--saf-rot) !important;
  color: #ffffff !important;
}

.saf-hero-winter h1, .saf-hero-winter h2,
.saf-hero-sommer h1, .saf-hero-sommer h2 {
  color: #ffffff !important;
  font-weight: 800 !important;
}
.saf-hero-winter p,
.saf-hero-sommer p {
  color: rgba(255,255,255,0.9) !important;
}

/* ----------------------------------------------------------
   7. STATS-BAND
   ---------------------------------------------------------- */
.saf-stats {
  background: var(--saf-blau);
  padding: 20px 0;
  display: flex;
  justify-content: center;
  gap: 60px;
  flex-wrap: wrap;
  color: #ffffff;
  text-align: center;
}

.saf-stats .saf-stat-item strong {
  display: block;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
}

.saf-stats .saf-stat-item span {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.85;
}

/* ----------------------------------------------------------
   8. BUTTONS
   ---------------------------------------------------------- */
.saf-btn-primary {
  display: inline-block;
  background: var(--saf-blau);
  color: #ffffff !important;
  padding: 11px 26px;
  border-radius: 4px;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none !important;
  transition: background 0.2s;
}
.saf-btn-primary:hover {
  background: var(--saf-rot) !important;
}

.saf-btn-secondary {
  display: inline-block;
  background: transparent;
  color: var(--saf-blau) !important;
  border: 2px solid var(--saf-blau);
  padding: 9px 24px;
  border-radius: 4px;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none !important;
  transition: all 0.2s;
}
.saf-btn-secondary:hover {
  background: var(--saf-blau) !important;
  color: #ffffff !important;
}

.saf-link-btn {
  display: inline-block;
  background: #1E90D5;
  color: #ffffff;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 4px;
  text-decoration: none;
  transition: background 0.2s;
}
.saf-link-btn:hover {
  background: #1670aa;
  text-decoration: none;
  color: #ffffff;
}

.saf-whatsapp-btn {
  display: inline-block;
  background: #25d366;
  color: #ffffff;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 4px;
  text-decoration: none;
  margin: 4px 0 20px;
  transition: background 0.2s;
}
.saf-whatsapp-btn:hover {
  background: #1ebe5d;
  text-decoration: none;
  color: #ffffff;
}

/* ----------------------------------------------------------
   9. NEUIGKEITEN / AKTUELLES WIDGET
   ---------------------------------------------------------- */
.saf-news-item {
  display: flex;
  gap: 16px;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e8e8e8;
}

.saf-news-date {
  background: var(--saf-rot);
  color: #ffffff;
  min-width: 52px;
  height: 52px;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: 'Barlow Condensed', sans-serif;
}

.saf-news-date .day {
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1;
}

.saf-news-date .month {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  opacity: 0.9;
}

.saf-news-content h4 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.05rem;
  margin-bottom: 4px;
  color: var(--saf-schwarz);
}

.saf-news-content p {
  font-size: 0.88rem;
  color: #555;
  margin-bottom: 4px;
}

.saf-news-content a.readmore {
  font-size: 0.85rem;
  color: var(--saf-blau);
  font-weight: 600;
  text-decoration: none;
}

.saf-news-content a.readmore:hover {
  color: var(--saf-rot);
}

.saf-news-content h4 a {
  color: var(--saf-schwarz) !important;
  text-decoration: none !important;
}
.saf-news-content h4 a:hover {
  color: var(--saf-blau) !important;
}

/* ----------------------------------------------------------
   10. BEITRÄGE-ERWEITERUNG (SP Page Builder)
   ---------------------------------------------------------- */
.sppb-addon-articles .sppb-article-title a,
.sppb-addon-articles .sppb-read-more a,
.sppb-addon-articles a {
  color: var(--saf-blau) !important;
}
.sppb-addon-articles .sppb-article-title a:hover,
.sppb-addon-articles .sppb-read-more a:hover {
  color: var(--saf-rot) !important;
}

.sppb-addon-articles .sppb-addon-article-layout-editorial-content {
  display: flex !important;
  gap: 16px !important;
  margin-bottom: 20px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #e8e8e8 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.sppb-addon-articles .sppb-article-meta .sppb-article-date {
  background: var(--saf-rot) !important;
  color: #ffffff !important;
  min-width: 52px !important;
  height: 52px !important;
  border-radius: 4px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  padding: 4px !important;
}

.sppb-addon-articles .sppb-article-title a {
  color: var(--saf-schwarz) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
}

.sppb-addon-articles .sppb-readmore {
  color: var(--saf-blau) !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
}
.sppb-addon-articles .sppb-readmore:hover {
  color: var(--saf-rot) !important;
}

/* ----------------------------------------------------------
   11. ABSCHNITTSÜBERSCHRIFTEN (Aktuelles/Termine/Mitmachen)
   ---------------------------------------------------------- */
.saf-aktuelles-heading,
.saf-modul-aktuelles .moduletitle,
.saf-modul-aktuelles h3,
.saf-section-news .sppb-addon-title {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 1.3rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--saf-blau) !important;
  border-bottom: 2px solid var(--saf-blau) !important;
  padding-bottom: 8px !important;
  margin-bottom: 20px !important;
}

.saf-section-news .sppb-addon-title::before {
  content: '— ';
}
.saf-section-news .sppb-addon-title {
  display: block !important;
  width: 100% !important;
}

/* ----------------------------------------------------------
   12. UNTERSEITEN – TYPOGRAFIE
   ---------------------------------------------------------- */
.saf-sektion-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #CC2222;
  margin-bottom: 6px;
}
.saf-seite-titel {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.2rem;
  font-weight: 800;
  color: #1A1A1A;
  margin: 0 0 6px;
  line-height: 1.1;
}
.saf-seite-untertitel {
  font-family: 'Source Sans 3', sans-serif;
  font-size: 1rem;
  color: #555;
  border-left: 3px solid #1E90D5;
  padding-left: 10px;
  margin: 0 0 22px;
}
.saf-abschnitt-titel {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: #1A1A1A;
  margin: 1.6rem 0 0.7rem;
  padding-bottom: 5px;
  border-bottom: 1px solid #e5e5e5;
}

/* ----------------------------------------------------------
   13. UNTERSEITEN – TABELLEN
   ---------------------------------------------------------- */
.saf-tabelle {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.9rem;
  margin: 4px 0 18px;
}
.saf-tabelle td,
.saf-tabelle th {
  padding: 8px 12px;
  border-bottom: 1px solid #eeeeee;
  color: #333;
  vertical-align: top;
}
.saf-tabelle-key {
  font-weight: 600;
  color: #444;
  width: 38%;
  background: #f8f8f8;
}
.saf-tabelle tr:last-child td {
  border-bottom: none;
}
.saf-tabelle a {
  color: #1E90D5;
  text-decoration: none;
}
.saf-tabelle a:hover {
  text-decoration: underline;
}

/* Preistabelle */
.saf-preistabelle thead tr {
  background: #07223a;
}
.saf-preis-kopf {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #ffffff;
  padding: 9px 12px;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,0.15);
}
.saf-preis-kopf:last-child {
  border-right: none;
}
.saf-preis-zelle {
  text-align: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: #1E90D5;
  padding: 9px 12px;
}

/* Stat-Tabelle */
.saf-stats-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #e0e0e0;
  margin: 10px 0 16px;
}
.saf-stat-zelle {
  text-align: center;
  padding: 14px 12px;
  border-right: 1px solid #e0e0e0;
  width: 33.33%;
}
.saf-stat-zelle--last {
  border-right: none;
}
.saf-stat-val {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.6rem;
  font-weight: 800;
  color: #1E90D5;
}
.saf-stat-lbl {
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.78rem;
  color: #888;
  margin-top: 3px;
}

/* ----------------------------------------------------------
   14. UNTERSEITEN – HINWEIS- & KONTAKT-BOXEN
   ---------------------------------------------------------- */
.saf-hinweis-table {
  width: 100%;
  border-collapse: collapse;
  background: #fffbeb;
  border-left: 3px solid #d97706;
  margin: 10px 0 18px;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.9rem;
  color: #78350f;
  line-height: 1.55;
}
.saf-hinweis-table--info {
  background: #f0f7ff;
  border-left-color: #1E90D5;
}
.saf-hinweis-icon-zelle {
  padding: 12px 12px 12px 14px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: #d97706;
  white-space: nowrap;
  vertical-align: top;
}
.saf-hinweis-table--info .saf-hinweis-icon-zelle {
  color: #1E90D5;
}
.saf-hinweis-text-zelle {
  padding: 12px 14px 12px 0;
  vertical-align: top;
}
.saf-hinweis-text-zelle strong {
  display: block;
  font-weight: 700;
  margin-bottom: 3px;
  color: #92400e;
}
.saf-hinweis-table--info .saf-hinweis-text-zelle {
  color: #1a3d5c;
}
.saf-hinweis-table--info .saf-hinweis-text-zelle strong {
  color: #0c2d47;
}

.saf-kontakt {
  background: #f4f8fd;
  border-left: 3px solid #1E90D5;
  padding: 12px 16px;
  margin: 4px 0 20px;
  font-family: 'Source Sans 3', sans-serif;
}
.saf-kontakt-zeile {
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 7px;
}
.saf-kontakt-zeile:last-child { margin-bottom: 0; }
.saf-kontakt a { color: #1E90D5; text-decoration: none; }
.saf-kontakt a:hover { text-decoration: underline; }

/* ----------------------------------------------------------
   15. UNTERSEITEN – SIDEBAR
   ---------------------------------------------------------- */
.saf-sb-box {
  border: 1px solid #e0e8f0;
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 16px;
  background: #fff;
}
.saf-sb-box--blau  { background: #1565a8; }
.saf-sb-box--rot   { background: #a81a1a; }
.saf-sb-box--gruen { background: #1c5c20; }

.saf-sb-kopf {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #fff;
  padding: 9px 14px;
}
.saf-sb-kopf--dunkel { background: #07223a; }
.saf-sb-kopf--blau   { background: #1E90D5; }
.saf-sb-kopf--rot    { background: #CC2222; }
.saf-sb-kopf--gruen  { background: #4a8a28; }

.saf-sb-liste {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.88rem;
}
.saf-sb-liste td {
  padding: 8px 14px;
  border-bottom: 1px solid #f0f0f0;
}
.saf-sb-liste tr:last-child td { border-bottom: none; }
.saf-sb-lbl { color: #777; width: 55%; }
.saf-sb-val { font-weight: 600; color: #1A1A1A; text-align: right; }

.saf-sb-text {
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.85);
  line-height: 1.5;
  padding: 10px 14px 6px;
  margin: 0;
}
.saf-sb-btn {
  display: block;
  margin: 8px 14px 12px;
  padding: 7px 12px;
  border: 1px solid rgba(255,255,255,0.4);
  border-radius: 4px;
  background: rgba(255,255,255,0.12);
  color: #fff;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
}
.saf-sb-btn:hover {
  background: rgba(255,255,255,0.25);
  text-decoration: none;
  color: #fff;
}

/* ----------------------------------------------------------
   16. FOOTER
   ---------------------------------------------------------- */
body #sp-footer,
html body #sp-footer {
  background: var(--saf-footer) !important;
  color: #cccccc;
  padding: 24px 0 20px !important;
}

/* Leerer Footer-Container (Helix Ultimate rendert ihn trotzdem) */
#sp-footer .container-inner:empty {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
#sp-footer .container:has(.container-inner:empty) {
  padding: 0 !important;
  margin: 0 !important;
}

/* template.css überschreiben: #sp-footer .container-inner { padding: 30px 0 } */
#sp-footer .container-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

@media (max-width: 992px) {
  body #sp-footer,
  html body #sp-footer {
    padding: 0 0 16px !important;
  }
  .saf-footer-divider {
    margin: 12px 0 10px !important;
  }
}

#sp-footer h3,
#sp-footer h4 {
  color: #ffffff;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 14px;
}

#sp-footer a {
  color: #aaaaaa;
  text-decoration: none;
  transition: color 0.2s;
}

#sp-footer a:hover {
  color: var(--saf-blau);
}

.saf-footer-logo {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 12px;
}

.saf-footer-logo .snow { color: var(--saf-blau); }
.saf-footer-logo .and  { color: #ffffff; }
.saf-footer-logo .fun  { color: var(--saf-rot); }

.saf-footer-divider {
  border: none;
  border-top: 1px solid #333;
  margin: 24px 0 16px;
}

/* ----------------------------------------------------------
   17. ALLGEMEIN / UTILITY
   ---------------------------------------------------------- */
.breadcrumb .divider.fas.fa-map-marker-alt {
  display: none;
}

.article-list .article .featured-article-badge,
.article-details .featured-article-badge {
  display: none;
  visibility: hidden;
}

/* ----------------------------------------------------------
   18. RESPONSIVE – MOBILE
   ---------------------------------------------------------- */
@media screen and (max-width: 992px) {
  .saf-hero {
    flex-direction: column;
    min-height: auto;
  }

  .saf-hero-winter .sppb-column-addons,
  .saf-hero-sommer .sppb-column-addons {
    padding: 40px 20px !important;
  }

  .saf-hero-winter h1, .saf-hero-winter h2,
  .saf-hero-sommer h1, .saf-hero-sommer h2 {
    font-size: 2rem !important;
  }

  .saf-statusbanner {
    gap: 14px;
    padding: 8px 14px;
    font-size: 13px;
  }

  .saf-stats {
    gap: 30px;
    padding: 16px 0;
  }

  #sp-menu {
    display: none;
  }

  /* ── MOBILE HEADER: Logo links, Hamburger rechts ── */
  #sp-header {
    position: relative;
    height: auto !important;
    min-height: 60px;
    padding: 0 !important;
  }

  #sp-header .container,
  #sp-header .container-fluid,
  #sp-header .container-inner,
  #sp-header .container-inner > .row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 15px !important;
  }

  #sp-logo {
    flex: 1 1 auto !important;
    max-width: none !important;
    padding: 0 !important;
    order: 1;
  }

  #sp-logo img,
  .sp-logo img,
  .logo-image,
  .logo-image-phone {
    max-height: 48px !important;
    height: 48px !important;
    width: auto !important;
    display: block;
  }

  #menu-right {
    flex: 0 0 auto !important;
    order: 2;
    background-color: transparent !important;
    margin: 0 0 0 10px !important;
    padding: 0 !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
  }

  #offcanvas-toggler {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 6px !important;
  }

  #offcanvas-toggler .burger-icon span {
    background-color: var(--saf-schwarz) !important;
  }

  .saf-stats-table,
  .saf-stats-table tbody,
  .saf-stats-table tr,
  .saf-stat-zelle {
    display: block;
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #e0e0e0;
  }
  .saf-stat-zelle--last { border-bottom: none; }
}

@media screen and (max-width: 600px) {
  .saf-hero-winter h1, .saf-hero-winter h2,
  .saf-hero-sommer h1, .saf-hero-sommer h2 {
    font-size: 1.7rem !important;
  }

  .saf-stats {
    gap: 20px;
  }

  .saf-stats .saf-stat-item strong {
    font-size: 1.5rem;
  }
}
/* ── Genussradler Infoseite ───────────────────────── */
.gr-saison-badge {
  display: inline-block;
  background: #1c3a0a;
  color: #c6e8a0;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 12px;
  border-radius: 3px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

.gr-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #4a8a28;
  margin: 0 0 0.2rem;
  line-height: 1.1;
}

.gr-page-sub {
  font-size: 1.1rem;
  color: #555;
  margin: 0 0 1rem;
}

.gr-divider-line {
  width: 48px;
  height: 3px;
  background: #4a8a28;
  margin: 0 0 1.25rem;
  border-radius: 2px;
}

.gr-highlight-box {
  background: #edf7e0;
  border-left: 4px solid #4a8a28;
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  font-size: 0.97rem;
  color: #1c3a0a;
  line-height: 1.6;
}

.saf-status-widget.gr-green .saf-widget-header {
  background: #4a8a28;
}

.saf-status-badge.green {
  background: #4a8a28;
  color: #ffffff;
  padding: 2px 10px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 600;
}

.saf-hint-box {
  background: #f5f5f0;
  border-radius: 6px;
  padding: 0.9rem 1rem;
  font-size: 0.88rem;
  color: #555;
  line-height: 1.5;
}

.saf-hint-box p { margin: 0; }
.gr-highlight-box,
.gr-highlight-box p,
.gr-highlight-box strong {
  color: #1c3a0a !important;
}

.gr-highlight-box a {
  color: #4a8a28 !important;
}
/* ══════════════════════════════════════════
   Snow & Fun Hohenberg – Vereinsseite CSS
   Anhängen an: snowfun-custom-komplett.css
   ══════════════════════════════════════════ */

/* ── Badge ── */
.v-saison-badge {
  display: inline-block;
  background: #07223a;
  color: #8ab4d4;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 12px;
  border-radius: 3px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

/* ── Seitentitel ── */
.v-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #1E90D5;
  margin: 0 0 0.2rem;
  line-height: 1.1;
}

.v-page-sub {
  font-size: 1.1rem;
  color: #555;
  margin: 0 0 1rem;
}

.v-divider-line {
  width: 48px;
  height: 3px;
  background: #1E90D5;
  margin: 0 0 1.25rem;
  border-radius: 2px;
}

/* ── Highlight-Box ── */
.v-highlight-box {
  background: #e8f2fb;
  border-left: 4px solid #1E90D5;
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  font-size: 0.97rem;
  color: #07223a;
  line-height: 1.6;
}

.v-highlight-box strong {
  color: #07223a;
}

/* ── Fakten-Kacheln ── */
.v-facts-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin: 1.5rem 0;
}

.v-fact-card {
  background: #f0f4f8;
  border-radius: 8px;
  padding: 0.85rem 0.75rem;
  text-align: center;
}

.v-fact-value {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: #1E90D5;
  line-height: 1.1;
}

.v-fact-label {
  font-size: 11px;
  color: #777;
  margin-top: 3px;
  line-height: 1.3;
}

/* ── Abschnittsüberschrift ── */
.v-section-heading {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: #1A1A1A;
  margin: 1.5rem 0 0.75rem;
}

/* ── Aktivitäten-Grid ── */
.v-activities-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 1.5rem;
}

.v-act-card {
  border-radius: 10px;
  padding: 1rem 1.1rem;
  border: 1px solid #e0e0da;
  background: #ffffff;
}

.v-act-card p {
  font-size: 13px;
  color: #555;
  margin: 0;
  line-height: 1.5;
}

.v-act-blue  { border-top: 3px solid #1E90D5; }
.v-act-green { border-top: 3px solid #4a8a28; }
.v-act-red   { border-top: 3px solid #CC2222; }

.v-act-title {
  font-size: 14px;
  font-weight: 700;
  color: #1A1A1A;
  margin-bottom: 6px;
}

/* ── CTA-Box ── */
.v-cta-box {
  background: #1E90D5;
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.v-cta-title {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 700;
}

.v-cta-sub {
  color: #c8e4f7;
  font-size: 13px;
  margin-top: 2px;
}

.v-cta-btn {
  background: #ffffff;
  color: #1E90D5 !important;
  font-weight: 700;
  font-size: 14px;
  padding: 8px 20px;
  border-radius: 6px;
  text-decoration: none !important;
  white-space: nowrap;
  display: inline-block;
}

.v-cta-btn:hover {
  background: #e8f2fb;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .v-facts-grid      { grid-template-columns: repeat(2, 1fr); }
  .v-activities-grid { grid-template-columns: 1fr; }
  .v-cta-box         { flex-direction: column; text-align: center; }
}
/* ══════════════════════════════════════════
   Snow & Fun Hohenberg – Vorstandsseite CSS
   Anhängen an: snowfun-custom-komplett.css
   ══════════════════════════════════════════ */

/* ── Badge ── */
.vs-badge {
  display: inline-block;
  background: #07223a;
  color: #8ab4d4;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 12px;
  border-radius: 3px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

/* ── Seitentitel ── */
.vs-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #1E90D5;
  margin: 0 0 0.2rem;
  line-height: 1.1;
}

.vs-page-sub {
  font-size: 1.1rem;
  color: #555;
  margin: 0 0 1rem;
}

.vs-divider-line {
  width: 48px;
  height: 3px;
  background: #1E90D5;
  margin: 0 0 1.5rem;
  border-radius: 2px;
}

/* ── Abschnitts-Label ── */
.vs-section-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #1E90D5;
  margin: 0 0 0.75rem;
}

/* ── Vorstandschaft – große Karten ── */
.vs-board-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px;
  margin-bottom: 2rem;
}

.vs-person-card {
  background: #ffffff;
  border: 1px solid #e0e0da;
  border-top: 3px solid #1E90D5;
  border-radius: 12px;
  padding: 1.25rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.vs-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #e8f2fb;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 700;
  color: #1E90D5;
  margin-bottom: 0.75rem;
  flex-shrink: 0;
}

.vs-person-name {
  font-size: 15px;
  font-weight: 600;
  color: #1A1A1A;
  margin-bottom: 6px;
  line-height: 1.3;
}

.vs-person-role {
  font-size: 12px;
  color: #1E90D5;
  font-weight: 600;
  background: #e8f2fb;
  padding: 2px 10px;
  border-radius: 4px;
  display: inline-block;
}

/* ── Beirat – kompakte Karten ── */
.vs-beirat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin-bottom: 1.5rem;
}

.vs-beirat-card {
  background: #f5f5f0;
  border-radius: 8px;
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  gap: 10px;
}

.vs-beirat-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #dce8f5;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #1E90D5;
  flex-shrink: 0;
}

.vs-beirat-name {
  font-size: 13px;
  font-weight: 600;
  color: #1A1A1A;
  line-height: 1.3;
}

.vs-beirat-role {
  font-size: 11px;
  color: #888;
}

/* ── Hinweis-Box ── */
.vs-hint-box {
  background: #f5f5f0;
  border-radius: 8px;
  padding: 0.9rem 1rem;
  font-size: 13px;
  color: #666;
  line-height: 1.6;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .vs-board-grid  { grid-template-columns: repeat(2, 1fr); }
  .vs-beirat-grid { grid-template-columns: 1fr; }
}
/* ══════════════════════════════════════════
   Snow & Fun Hohenberg – Mitgliedschaft CSS
   Anhängen an: snowfun-custom-komplett.css
   ══════════════════════════════════════════ */

/* ── Badge ── */
.ms-badge {
  display: inline-block;
  background: #07223a;
  color: #8ab4d4;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 12px;
  border-radius: 3px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

/* ── Seitentitel ── */
.ms-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #1E90D5;
  margin: 0 0 0.2rem;
  line-height: 1.1;
}

.ms-page-sub {
  font-size: 1.1rem;
  color: #555;
  margin: 0 0 1rem;
}

.ms-divider-line {
  width: 48px;
  height: 3px;
  background: #1E90D5;
  margin: 0 0 1.25rem;
  border-radius: 2px;
}

/* ── Abschnitts-Label ── */
.ms-section-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #1E90D5;
  margin: 1.5rem 0 0.75rem;
}

/* ── Highlight-Box ── */
.ms-highlight-box {
  background: #e8f2fb;
  border-left: 4px solid #1E90D5;
  padding: 1rem 1.25rem;
  margin: 1.25rem 0;
  font-size: 0.97rem;
  color: #07223a;
  line-height: 1.6;
}

.ms-highlight-box strong {
  color: #07223a;
}

/* ── Preis-Karten ── */
.ms-pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin: 1rem 0 1.75rem;
}

.ms-price-card {
  background: #ffffff;
  border: 1px solid #e0e0da;
  border-radius: 12px;
  padding: 1.5rem 1.25rem;
  text-align: center;
}

.ms-price-featured {
  border: 2px solid #1E90D5;
}

.ms-featured-badge {
  background: #1E90D5;
  color: #ffffff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 10px;
  border-radius: 4px;
  display: inline-block;
  margin-bottom: 0.75rem;
}

.ms-price-icon {
  font-size: 2rem;
  margin-bottom: 0.6rem;
}

.ms-price-type {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #888;
  margin-bottom: 0.5rem;
}

.ms-price-amount {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: #1E90D5;
  line-height: 1;
}

.ms-price-period {
  font-size: 13px;
  color: #888;
  margin-top: 3px;
}

.ms-price-desc {
  font-size: 13px;
  color: #666;
  margin-top: 0.75rem;
  line-height: 1.5;
  border-top: 1px solid #f0f0ea;
  padding-top: 0.75rem;
}

/* ── Vorteile-Liste ── */
.ms-benefits {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0.5rem 0 1.5rem;
}

.ms-benefit-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #1A1A1A;
}

.ms-benefit-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #e8f2fb;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 2px;
  color: #1E90D5;
  font-weight: 700;
}

/* ── Download-Buttons ── */
.ms-downloads {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0.75rem 0 1.5rem;
}

.ms-dl-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f5f5f0;
  border: 1px solid #e0e0da;
  border-radius: 8px;
  padding: 0.85rem 1rem;
  text-decoration: none !important;
  color: #1A1A1A;
  font-size: 14px;
  font-weight: 500;
  transition: background 0.15s, border-color 0.15s;
}

.ms-dl-btn:hover {
  background: #e8f2fb;
  border-color: #1E90D5;
}

.ms-dl-icon {
  width: 36px;
  height: 36px;
  background: #e8f2fb;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.ms-dl-info {
  flex: 1;
}

.ms-dl-title {
  font-weight: 600;
  color: #1A1A1A;
  font-size: 14px;
}

.ms-dl-sub {
  font-size: 12px;
  color: #888;
}

.ms-dl-arrow {
  color: #1E90D5;
  font-size: 16px;
  font-weight: 700;
}

/* ── CTA-Box ── */
.ms-cta-box {
  background: #1E90D5;
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.ms-cta-title {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 700;
}

.ms-cta-sub {
  color: #c8e4f7;
  font-size: 13px;
  margin-top: 2px;
}

.ms-cta-btn {
  background: #ffffff;
  color: #1E90D5 !important;
  font-weight: 700;
  font-size: 14px;
  padding: 8px 20px;
  border-radius: 6px;
  text-decoration: none !important;
  white-space: nowrap;
  display: inline-block;
}

.ms-cta-btn:hover {
  background: #e8f2fb;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .ms-pricing-grid { grid-template-columns: 1fr; }
  .ms-cta-box      { flex-direction: column; text-align: center; }
}
/* ══════════════════════════════════════════
   Snow & Fun Hohenberg – Kontaktseite CSS
   Anhängen an: snowfun-custom-komplett.css
   ══════════════════════════════════════════ */

/* ── Badge ── */
.ks-badge {
  display: inline-block;
  background: #07223a;
  color: #8ab4d4;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 12px;
  border-radius: 3px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

/* ── Seitentitel ── */
.ks-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #1E90D5;
  margin: 0 0 0.2rem;
  line-height: 1.1;
}

.ks-page-sub {
  font-size: 1.1rem;
  color: #555;
  margin: 0 0 1rem;
}

.ks-divider-line {
  width: 48px;
  height: 3px;
  background: #1E90D5;
  margin: 0 0 1.5rem;
  border-radius: 2px;
}

/* ── Abschnitts-Label ── */
.ks-section-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #1E90D5;
  margin: 0 0 0.75rem;
}

/* ── Kontakt-Kacheln ── */
.ks-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 12px;
  margin-bottom: 1.5rem;
}

.ks-card {
  background: #ffffff;
  border: 1px solid #e0e0da;
  border-radius: 10px;
  padding: 1rem;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.ks-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: #e8f2fb;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.ks-label {
  font-size: 11px;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

.ks-value {
  font-size: 14px;
  font-weight: 500;
  color: #1A1A1A;
  line-height: 1.4;
}

.ks-value a {
  color: #1E90D5;
  text-decoration: none;
}

.ks-value a:hover {
  text-decoration: underline;
}

/* ── Karte ── */
.ks-map {
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #e0e0da;
  margin-bottom: 1.25rem;
}

.ks-map iframe {
  display: block;
  width: 100%;
  height: 320px;
  border: none;
}

/* ── Hinweis-Box ── */
.ks-hint-box {
  background: #f5f5f0;
  border-radius: 8px;
  padding: 0.9rem 1rem;
  font-size: 13px;
  color: #666;
  line-height: 1.5;
}

/* ── Social Buttons ── */
.ks-social {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.ks-social-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 6px;
  text-decoration: none !important;
  color: #ffffff !important;
  transition: opacity 0.15s;
}

.ks-social-btn:hover {
  opacity: 0.88;
}

.ks-btn-fb { background: #1877f2; }
.ks-btn-ig { background: #c13584; }
.ks-btn-wa { background: #25d366; }

/* ── Responsive ── */
@media (max-width: 600px) {
  .ks-grid   { grid-template-columns: 1fr 1fr; }
  .ks-social { flex-direction: column; }
}
/* ══════════════════════════════════════════
   Snow & Fun Hohenberg – Mobile Fixes
   Anhängen an: snowfun-custom-komplett.css
   ══════════════════════════════════════════ */

/* ── 1. padding-top Mobile ── */
@media (max-width: 992px) {
  #sp-main-body {
    padding-top: 16px !important;
  }
}

/* ── 2. Logo-Höhe Mobile ── */
@media (max-width: 992px) {
  .logo-image,
  .logo-image-phone {
    height: 48px !important;
  }
}

/* ── 3. Split-Hero Mobile – Höhe begrenzen ── */
@media (max-width: 992px) {
  .saf-hero-winter .sppb-column-addons,
  .saf-hero-sommer .sppb-column-addons {
    padding: 28px 20px !important;
    min-height: auto !important;
  }

  .saf-hero-winter h1, .saf-hero-winter h2,
  .saf-hero-sommer h1, .saf-hero-sommer h2 {
    font-size: 1.8rem !important;
    margin-bottom: 0.5rem !important;
  }

  .saf-hero-winter p,
  .saf-hero-sommer p {
    font-size: 0.9rem !important;
    margin-bottom: 1rem !important;
  }

  /* Buttons untereinander auf Mobile */
  .saf-hero-winter .sppb-btn-wrapper,
  .saf-hero-sommer .sppb-btn-wrapper {
    flex-direction: column !important;
    gap: 8px !important;
  }

  .saf-hero-winter .sppb-btn,
  .saf-hero-sommer .sppb-btn {
    width: 100% !important;
    text-align: center !important;
  }
}

/* ── 4. Statusbanner Mobile – untereinander ── */
@media (max-width: 600px) {
  .saf-statusbanner {
    flex-direction: column !important;
    gap: 8px !important;
    padding: 10px 16px !important;
    text-align: center;
  }

  .saf-statusbanner .saf-status-item {
    justify-content: center;
  }
}

/* ── 5. Aktuelles Grid – einspaltig ab 560px ── */
@media (max-width: 560px) {
  .article-list.cols-2 .row {
    grid-template-columns: 1fr !important;
  }
}

/* ── 6. Fakten-Kacheln Vereinsseite ── */
@media (max-width: 600px) {
  .v-facts-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ── 7. Kontakt-Kacheln einspaltig ab 480px ── */
@media (max-width: 480px) {
  .ks-grid {
    grid-template-columns: 1fr !important;
  }

  .ks-social {
    flex-direction: column !important;
  }

  .ks-social-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ── 8. Preistabelle Mobile ── */
@media (max-width: 600px) {
  .ms-pricing-grid {
    grid-template-columns: 1fr !important;
  }

  .ms-cta-box {
    flex-direction: column !important;
    text-align: center !important;
  }

  .ms-cta-btn {
    width: 100% !important;
    text-align: center !important;
  }
}

/* ── 9. Tabellen auf Skilift-Seiten Mobile ── */
@media (max-width: 600px) {
  .saf-tabelle,
  .saf-preistabelle,
  .saf-stats-table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .saf-stats-table tbody,
  .saf-stats-table tr,
  .saf-stat-zelle {
    display: block !important;
    width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid #e0e0e0 !important;
    text-align: center !important;
  }

  .saf-stat-zelle--last {
    border-bottom: none !important;
  }
}

/* ── 10. Vorstandskarten Mobile ── */
@media (max-width: 480px) {
  .vs-board-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .vs-beirat-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ── 11. Aktivitäten-Grid Vereinsseite ── */
@media (max-width: 480px) {
  .v-activities-grid {
    grid-template-columns: 1fr !important;
  }

  .v-cta-box {
    flex-direction: column !important;
    text-align: center !important;
  }

  .v-cta-btn {
    width: 100% !important;
    text-align: center !important;
  }
}

/* ── 12. Footer-Links größere Tap-Targets ── */
#sp-footer ul li a,
.saf-footer-links a {
  padding: 8px 12px !important;
  display: inline-block;
}

/* ── 13. Seitenbreite auf Mobile ── */
@media (max-width: 992px) {
  .saf-genussradler-content,
  .saf-verein-content,
  .saf-vorstand-content,
  .saf-mitglied-content,
  .saf-kontakt-content,
  .saf-legal-content {
    padding: 0 4px;
  }
}

/* ── 14. Sidebar auf Mobile ausblenden / unter Content ── */
@media (max-width: 992px) {
  .saf-sidebar {
    margin-top: 1.5rem;
  }

  .saf-status-widget {
    margin-bottom: 1rem;
  }
}

/* ── 15. Hero-Buttons auf kleinen Screens ── */
@media (max-width: 400px) {
  .saf-btn-primary,
  .saf-btn-secondary {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-bottom: 8px;
  }
}
/* ══════════════════════════════════════════
   Snow & Fun Hohenberg – Aktuelles v4
   Verbessertes Design mit Datums-Box
   Anhängen an: snowfun-custom.css
   ══════════════════════════════════════════ */

/* ── Autor und Kategorie ausblenden ── */
.article-info .createdby,
.article-info .category-name {
  display: none !important;
}

/* Trennzeichen die übrig bleiben ausblenden */
.article-info .separator {
  display: none !important;
}

/* ── Führender Beitrag als Card mit blauem Akzent ── */
.com-content-category-blog__items.articles-leading .article {
  background: var(--color-background-primary, #ffffff);
  border: 1px solid #e0e0da;
  border-top: 3px solid #1E90D5;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
}

/* Datums-Box führender Beitrag */
.com-content-category-blog__items.articles-leading .article::before {
  content: attr(data-date-day) "\a" attr(data-date-mon);
  display: none; /* via JS gesetzt */
}

.saf-date-box {
  background: #CC2222;
  color: #ffffff;
  border-radius: 6px;
  padding: 0.5rem 0.6rem;
  text-align: center;
  flex-shrink: 0;
  width: 52px;
  line-height: 1;
}

.saf-date-box .saf-day {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  display: block;
}

.saf-date-box .saf-mon {
  font-size: 11px;
  display: block;
  margin-top: 2px;
  opacity: 0.9;
  text-transform: uppercase;
}

.saf-article-body {
  flex: 1;
  min-width: 0;
}

/* ── Grid-Karten ── */
.article-list.cols-2 .article {
  display: flex !important;
  flex-direction: column !important;
}

.article-list.cols-2 .article .article-body {
  display: flex;
  gap: 10px;
  flex: 1;
  flex-direction: column;
}

.saf-card-inner {
  display: flex;
  gap: 10px;
  flex: 1;
}

/* Datums-Box Grid-Karten */
.saf-date-box-small {
  background: #f0f4f8;
  color: #1A1A1A;
  border-radius: 6px;
  padding: 0.4rem 0.5rem;
  text-align: center;
  flex-shrink: 0;
  width: 44px;
  line-height: 1;
  align-self: flex-start;
}

.saf-date-box-small .saf-day {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  display: block;
  color: #1E90D5;
}

.saf-date-box-small .saf-mon {
  font-size: 10px;
  display: block;
  margin-top: 2px;
  color: #888;
  text-transform: uppercase;
}

/* ── Titel in Karten ── */
.article-header h2,
.article-header h2 a {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #1A1A1A !important;
  text-decoration: none !important;
  line-height: 1.3 !important;
  margin: 6px 0 0 !important;
}

.article-header h2 a:hover {
  color: #1E90D5 !important;
}

/* Führender Beitrag – größerer Titel */
.articles-leading .article-header h2,
.articles-leading .article-header h2 a {
  font-size: 1.4rem !important;
  margin: 0 0 4px !important;
}

/* ── Weiterlesen-Link ── */
.article-more-link,
.readmore {
  margin-top: 0.6rem !important;
}

.article-more-link a,
.readmore a,
.saf-readmore-auto {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1E90D5 !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.article-more-link a:hover,
.readmore a:hover,
.saf-readmore-auto:hover {
  text-decoration: underline !important;
}

/* Joomla nativer "Weiterlesen: Titel" Text – nur Pfeil zeigen */
.article-more-link a .article-more-title {
  display: none !important;
}

.article-more-link a::after {
  content: "Weiterlesen →" !important;
}

/* ── Linkliste unten als Kacheln ── */
.blog-links {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 8px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0.5rem 0 1.5rem !important;
  counter-reset: none !important;
}

.blog-links li {
  background: #f5f5f0;
  border-radius: 8px;
  padding: 0.6rem 0.85rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.blog-links li::before {
  content: "" !important;
  display: none !important;
}

.blog-links li a {
  font-size: 13px !important;
  color: #1E90D5 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.blog-links li a:hover {
  text-decoration: underline !important;
}

/* ── Tag-Badges (bereits in v3, hier verfeinert) ── */
ul.tags.list-inline {
  margin: 0 0 0.5rem !important;
}

ul.tags.list-inline a {
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 3px 9px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  text-decoration: none !important;
  display: inline-block !important;
  background: #f0f0ea !important;
  color: #666 !important;
}

ul.tags a[href*="/skilift"]       { background: #e8f2fb !important; color: #0C447C !important; }
ul.tags a[href*="/winter"]        { background: #e8f2fb !important; color: #0C447C !important; }
ul.tags a[href*="/genussradler"]  { background: #eaf3de !important; color: #27500A !important; }
ul.tags a[href*="/sommer"]        { background: #eaf3de !important; color: #27500A !important; }
ul.tags a[href*="/verein"]        { background: #f5f0e8 !important; color: #633806 !important; }

/* ── Pagination verfeinert ── */
.pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 1rem 0 !important;
}

.pagination li > a,
.pagination li > span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 8px !important;
  border-radius: 6px !important;
  border: 1px solid #e0e0da !important;
  background: #ffffff !important;
  font-size: 13px !important;
  color: #1A1A1A !important;
  text-decoration: none !important;
}

.pagination li > a:hover {
  background: #e8f2fb !important;
  border-color: #1E90D5 !important;
  color: #1E90D5 !important;
}

.pagination li.active > a,
.pagination li.active > span {
  background: #1E90D5 !important;
  border-color: #1E90D5 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.pagination li.disabled > span,
.pagination li.disabled > a {
  color: #ccc !important;
  border-color: #f0f0ea !important;
  background: #fafafa !important;
  pointer-events: none !important;
}

.pagination .counter {
  font-size: 12px !important;
  color: #888 !important;
  border: none !important;
  background: none !important;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .com-content-category-blog__items.articles-leading .article {
    flex-direction: column !important;
    gap: 0.75rem !important;
  }

  .saf-date-box {
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px !important;
  }

  .saf-date-box .saf-day,
  .saf-date-box .saf-mon {
    display: inline !important;
    font-size: 13px !important;
  }

  .blog-links {
    grid-template-columns: 1fr !important;
  }
}