.elementor-1603 .elementor-element.elementor-element-c306605{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-f502ab8 *//* Elementor → Custom CSS (oder in den HTML-Widget <style> Block ganz unten einfügen) */

/* 1) Grundsätzlich: Textkontrast + bessere Lesbarkeit */
#mitgliedsbeitrag-seite{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#mitgliedsbeitrag-seite .tw-h1{
  color: rgba(255,255,255,.98) !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.55);
}

#mitgliedsbeitrag-seite p,
#mitgliedsbeitrag-seite .tw-lead,
#mitgliedsbeitrag-seite .tw-sub,
#mitgliedsbeitrag-seite .tw-li span{
  color: rgba(255,255,255,.86) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.45);
}

#mitgliedsbeitrag-seite .tw-muted,
#mitgliedsbeitrag-seite .tw-brandline{
  color: rgba(255,255,255,.72) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.45);
}

/* 2) Glass Cards: Hintergrund etwas dunkler/kräftiger (mehr Kontrast) */
#mitgliedsbeitrag-seite .tw-glass{
  background: linear-gradient(180deg, rgba(15,20,18,.62), rgba(15,20,18,.46)) !important;
  border-color: rgba(255,255,255,.22) !important;
}

/* 3) HERO: dunkles Overlay über dem Hintergrundbild (macht alles sofort lesbarer) */
#mitgliedsbeitrag-hero{
  position: relative;
}

#mitgliedsbeitrag-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  /* dunkler Verlauf + vignette */
  background:
    radial-gradient(900px 420px at 20% 15%, rgba(0,0,0,.35), transparent 60%),
    radial-gradient(900px 420px at 80% 20%, rgba(0,0,0,.30), transparent 62%),
    linear-gradient(180deg, rgba(0,0,0,.52) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.58) 100%);
}

#mitgliedsbeitrag-hero > *{
  position: relative; /* Inhalt über Overlay */
  z-index: 1;
}

/* 4) Mini-Karten rechts: Text noch etwas stärker */
#mitgliedsbeitrag-seite .tw-mini strong{
  color: rgba(255,255,255,.96) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.45);
}
#mitgliedsbeitrag-seite .tw-mini span{
  color: rgba(255,255,255,.82) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.45);
}

/* 5) Optional: Falls dir der Lead-Text immer noch zu hell ist */
#mitgliedsbeitrag-seite .tw-lead{
  font-weight: 500;
  line-height: 1.7;
}
/* =========================================================
   VereinsVereint – Lesbarkeit „Global Fix“
   (Einfügen in Elementor → Custom CSS oder <style> im HTML-Widget)
   Ziel: mehr Kontrast, größere Schrift, klarere Karten, bessere Abstände
   ========================================================= */

/* 0) Basis: Rendering + Mindest-Kontrast */
#mitgliedsbeitrag-seite{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* 1) Globaler „Dark Overlay“-Layer über ALLES (macht Background nicht mehr „durchballern“) */
#mitgliedsbeitrag-seite{
  position: relative;
}
#mitgliedsbeitrag-seite::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(1200px 520px at 20% 0%, rgba(0,0,0,.46), transparent 62%),
    radial-gradient(1100px 520px at 80% 10%, rgba(0,0,0,.40), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.52) 0%, rgba(0,0,0,.44) 45%, rgba(0,0,0,.58) 100%);
}
#mitgliedsbeitrag-seite > *{
  position: relative;
  z-index: 1;
}

/* 2) Typo: allgemein größer + höhere Kontraste */
#mitgliedsbeitrag-seite h1,
#mitgliedsbeitrag-seite h2,
#mitgliedsbeitrag-seite h3{
  color: rgba(255,255,255,.98) !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.55);
  letter-spacing: -0.01em;
}

#mitgliedsbeitrag-seite p,
#mitgliedsbeitrag-seite li,
#mitgliedsbeitrag-seite .tw-sub,
#mitgliedsbeitrag-seite .tw-li span,
#mitgliedsbeitrag-seite .tw-mini span{
  color: rgba(255,255,255,.90) !important;
  text-shadow: 0 1px 12px rgba(0,0,0,.45);
  line-height: 1.75;
  font-size: 16px;
}

@media (min-width: 768px){
  #mitgliedsbeitrag-seite p,
  #mitgliedsbeitrag-seite li,
  #mitgliedsbeitrag-seite .tw-sub,
  #mitgliedsbeitrag-seite .tw-li span,
  #mitgliedsbeitrag-seite .tw-mini span{
    font-size: 17px;
  }
}

#mitgliedsbeitrag-seite .tw-lead{
  color: rgba(255,255,255,.90) !important;
  font-weight: 500;
  font-size: clamp(16px, 1.35vw, 19px) !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.55);
}

/* 3) Karten/Glas: dunkler + weniger transparent + klarere Konturen */
#mitgliedsbeitrag-seite .tw-glass{
  background: linear-gradient(180deg, rgba(14,18,16,.78), rgba(14,18,16,.62)) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  box-shadow: 0 18px 70px rgba(0,0,0,.45) !important;
  backdrop-filter: blur(16px) saturate(120%);
  -webkit-backdrop-filter: blur(16px) saturate(120%);
}

/* 4) Modelle-Kacheln: Überschriften in den Cards waren zu dunkel → explizit hochziehen */
#mitgliedsbeitrag-seite .tw-card h3,
#mitgliedsbeitrag-seite .tw-card .tw-sub{
  color: rgba(255,255,255,.92) !important;
}

/* 5) Vorteil/Nachteil-Zeilen: noch mehr Kontrast */
#mitgliedsbeitrag-seite .tw-li{
  background: rgba(0,0,0,.26) !important;
  border-color: rgba(255,255,255,.16) !important;
}
#mitgliedsbeitrag-seite .tw-li b{
  color: rgba(255,255,255,.96) !important;
}

/* 6) Code/Beispiel-Blöcke: aktuell zu dunkel + zu wenig Kontrast */
#mitgliedsbeitrag-seite .tw-code{
  background: rgba(0,0,0,.48) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
#mitgliedsbeitrag-seite .tw-code .hl{
  color: rgba(255,210,0,.98) !important;
  font-weight: 700;
}
#mitgliedsbeitrag-seite .tw-code .ok{
  color: rgba(40,167,69,.98) !important;
  font-weight: 700;
}

/* 7) Section-Titel („Rechen-Schablone…“) war bei dir sehr dunkel → klarer machen */
#mitgliedsbeitrag-seite .tw-section > h2{
  color: rgba(255,255,255,.98) !important;
  font-weight: 800;
}

/* 8) Buttons: Text & Kontrast verbessern (ohne Layout zu zerstören) */
#mitgliedsbeitrag-seite .tw-btn{
  font-size: 15px;
  font-weight: 700;
  border-color: rgba(255,255,255,.20) !important;
  box-shadow: 0 10px 34px rgba(0,0,0,.35);
}
#mitgliedsbeitrag-seite .tw-btn-primary{
  color: rgba(11,15,12,.96) !important;
  text-shadow: none !important;
  box-shadow: 0 14px 38px rgba(0,0,0,.40);
}

/* 9) Optional: wenn dir die rechte Mini-Boxen immer noch zu „blass“ sind */
#mitgliedsbeitrag-seite .tw-mini{
  background: rgba(0,0,0,.28) !important;
  border-color: rgba(255,255,255,.16) !important;
}
#mitgliedsbeitrag-seite .tw-mini strong{
  color: rgba(255,255,255,.97) !important;
}
/* =========================================================
   VereinsVereint – Friendly / Bright Glass Style (REWORK)
   Ziel: deutlich heller, freundlicher, luftiger
   → NACH deinem bisherigen CSS einfügen
   ========================================================= */

/* 1) Global: dunkles Overlay stark abschwächen */
#mitgliedsbeitrag-seite::before{
  background:
    radial-gradient(1200px 520px at 20% 0%, rgba(255,255,255,.10), transparent 65%),
    radial-gradient(1100px 520px at 80% 10%, rgba(255,255,255,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.12) 45%, rgba(255,255,255,.20) 100%);
}

/* 2) Grundschrift: heller, weniger Schatten */
#mitgliedsbeitrag-seite p,
#mitgliedsbeitrag-seite li,
#mitgliedsbeitrag-seite .tw-sub,
#mitgliedsbeitrag-seite .tw-li span,
#mitgliedsbeitrag-seite .tw-mini span{
  color: rgba(255,255,255,.94) !important;
  text-shadow: 0 1px 6px rgba(0,0,0,.25);
}

/* 3) Headlines: freundlich, klar, weniger „dramatisch“ */
#mitgliedsbeitrag-seite h1,
#mitgliedsbeitrag-seite h2,
#mitgliedsbeitrag-seite h3{
  color: #ffffff !important;
  text-shadow: 0 1px 6px rgba(0,0,0,.28);
  font-weight: 700;
}

/* 4) Lead-Text: heller + entspannter */
#mitgliedsbeitrag-seite .tw-lead{
  color: rgba(255,255,255,.95) !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.30);
  font-weight: 500;
}

/* 5) Glass Cards: mehr „Frost“, weniger Dunkelheit */
#mitgliedsbeitrag-seite .tw-glass{
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.22),
    rgba(255,255,255,.14)
  ) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  box-shadow: 0 14px 48px rgba(0,0,0,.25) !important;
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}

/* 6) Modell-Karten Innenflächen */
#mitgliedsbeitrag-seite .tw-li{
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.28) !important;
}
#mitgliedsbeitrag-seite .tw-li b{
  color: #ffffff !important;
}

/* 7) Code-/Beispielblöcke: helles Glas statt Dark-Code */
#mitgliedsbeitrag-seite .tw-code{
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  color: rgba(255,255,255,.96) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
#mitgliedsbeitrag-seite .tw-code .hl{
  color: #FFD200 !important;
}
#mitgliedsbeitrag-seite .tw-code .ok{
  color: #28A745 !important;
}

/* 8) Mini-Karten rechts: extra freundlich */
#mitgliedsbeitrag-seite .tw-mini{
  background: rgba(255,255,255,.16) !important;
  border-color: rgba(255,255,255,.30) !important;
}
#mitgliedsbeitrag-seite .tw-mini strong{
  color: #ffffff !important;
}

/* 9) Buttons: weicher, weniger Kontrast-Härte */
#mitgliedsbeitrag-seite .tw-btn{
  background: rgba(255,255,255,.22) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.35) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.22);
}
#mitgliedsbeitrag-seite .tw-btn:hover{
  background: rgba(255,255,255,.30) !important;
}

#mitgliedsbeitrag-seite .tw-btn-primary{
  background: linear-gradient(
    135deg,
    rgba(40,167,69,.95),
    rgba(255,210,0,.95)
  ) !important;
  color: rgba(10,20,15,.95) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.28);
}

/* 10) Section-Abstände etwas luftiger */
#mitgliedsbeitrag-seite .tw-section{
  padding-top: 42px;
  padding-bottom: 42px;
}/* End custom CSS */