:root{
  --primary-navy:#082A55;
  --deep-navy:#061E3F;
  --allianz-blue:#003781;
  --action-blue:#0875E1;
  --text:#182433;
  --text-sekundaer:#586574;
  --off-white:#F7F8FA;
  --light-blue:#EEF4F9;
  --border:#D8E0E7;
  --white:#FFFFFF;
  --gruen:#3FA76B;
  --radius:14px;
  --radius-sm:10px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
}
body{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:var(--text);
  background:var(--white);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block}
a{color:inherit}
button{font-family:inherit}

/* ---------- Marken-Lockup ---------- */
.marke{display:flex;align-items:center;gap:12px;text-decoration:none}
.marke-logo{height:28px;width:auto;flex:none}
.marke-trenner{width:1px;height:22px;background:var(--border);flex:none}
.marke-agentur{font-weight:600;font-size:1.02rem;color:var(--text);line-height:1;white-space:nowrap}
.hell .marke-trenner{background:rgba(255,255,255,.28)}
.hell .marke-agentur{color:#dbe7f6}

/* ---------- Navigation ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}
.nav-inner{
  max-width:1180px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 20px;height:68px;
}
.nav .marke{flex:none}
.nav-links{display:flex;gap:2px;list-style:none;align-items:center;flex-wrap:nowrap}
.nav-links a{
  text-decoration:none;font-size:.92rem;font-weight:500;color:var(--text-sekundaer);
  padding:9px 12px;border-radius:8px;transition:color .15s,background .15s;
  white-space:nowrap;display:inline-block;
}
.nav-links a:hover{color:var(--allianz-blue);background:var(--light-blue)}
.nav-links a:focus-visible{outline:2px solid var(--action-blue);outline-offset:2px}
.nav-cta{background:var(--allianz-blue)!important;color:#fff!important;font-weight:600!important;margin-left:8px}
.nav-cta:hover{background:var(--action-blue)!important}
.burger{display:none;background:none;border:0;cursor:pointer;padding:10px}
.burger span{display:block;width:22px;height:2px;background:var(--text);margin:5px 0;border-radius:2px;transition:transform .2s,opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:900px){
  .burger{display:block}
  .nav-links{
    position:fixed;top:68px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);
    flex-direction:column;align-items:stretch;gap:0;padding:10px 16px 18px;
    transform:translateY(-8px);opacity:0;pointer-events:none;
    transition:transform .18s ease,opacity .18s ease;
  }
  .nav-links.offen{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav-links a{padding:14px 12px;font-size:1.05rem;border-radius:10px}
  .nav-cta{margin:8px 0 0;text-align:center}
}

/* ---------- Dunkle Navy-Flächen ---------- */
.navy-flaeche{
  position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(150deg,#0d3a72 0%,var(--primary-navy) 45%,var(--deep-navy) 100%);
}
.deko-kreis{position:absolute;border:2px solid rgba(255,255,255,.07);border-radius:50%;pointer-events:none}
.deko-kreis.gefuellt{background:rgba(255,255,255,.04);border:0}

/* ---------- Hero ---------- */
.hero{padding:148px 20px 80px}
.hero-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;position:relative;z-index:1}
.hero-kicker{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;
  font-size:.85rem;font-weight:600;padding:7px 14px;border-radius:100px;margin-bottom:22px;
}
.hero-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gruen)}
.hero h1{
  font-size:clamp(2.15rem,4.4vw,3.6rem);
  line-height:1.08;letter-spacing:-.02em;font-weight:700;margin-bottom:16px;
}
.hero-sub{font-size:1.18rem;color:#c9dbf0;margin-bottom:24px;max-width:34rem}
.foerder-highlights{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;max-width:30rem}
.fh-zeile{
  display:flex;align-items:center;gap:12px;font-size:.98rem;font-weight:500;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:100px;padding:11px 18px;color:#fff;
}
.fh-zeile svg{flex:none;color:var(--gruen)}
.hero-hinweis{font-size:.85rem;color:#9fb7d4;margin-bottom:26px;max-width:30rem}
.knopfzeile{display:flex;gap:12px;flex-wrap:wrap}
.knopf{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:inherit;font-size:1rem;font-weight:600;
  padding:15px 28px;border-radius:100px;border:0;cursor:pointer;
  text-decoration:none;transition:background .15s,border-color .15s,transform .1s;
}
.knopf:active{transform:translateY(1px)}
.knopf:focus-visible{outline:2px solid #fff;outline-offset:3px}
.knopf-weiss{background:#fff;color:var(--allianz-blue)}
.knopf-weiss:hover{background:var(--light-blue)}
.knopf-umriss{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4)}
.knopf-umriss:hover{border-color:#fff}
.knopf-primar{background:var(--action-blue);color:#fff}
.knopf-primar:hover{background:#0868c9}
.knopf-primar:focus-visible{outline-color:var(--action-blue)}
.knopf.breit{width:100%}

/* Hero-Karte */
.hero-karte{
  background:#fff;border-radius:18px;color:var(--text);
  box-shadow:0 30px 70px -25px rgba(0,10,35,.5);
  padding:26px 26px 22px;
}
.hk-eyebrow{display:block;font-size:.85rem;font-weight:700;color:var(--primary-navy);letter-spacing:-.005em;margin-bottom:14px}
.hk-reihe{display:flex;gap:16px;align-items:center;padding:14px 2px;border-bottom:1px solid var(--light-blue)}
.hk-kreis{
  flex:none;width:58px;height:58px;border-radius:50%;background:var(--allianz-blue);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:.95rem;letter-spacing:-.02em;
}
.hk-kreis.klein{font-size:.82rem}
.hk-reihe b{display:block;font-size:.98rem;font-weight:700;line-height:1.35;color:var(--text)}
.hk-reihe span{font-size:.88rem;font-weight:500;color:var(--text-sekundaer)}
.hk-fuss{margin-top:14px;background:var(--light-blue);border-radius:12px;padding:14px 16px;display:flex;align-items:center;gap:14px}
.hk-muenze{flex:none;width:32px;height:32px;border-radius:50%;background:var(--allianz-blue);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.8rem}
.hk-fuss small{display:block;font-size:.85rem;font-weight:500;color:var(--text-sekundaer)}
.hk-fuss b{font-size:1.12rem;font-weight:700;color:var(--allianz-blue);letter-spacing:-.01em}
@media (max-width:900px){
  .hero{padding:112px 20px 56px}
  .hero-inner{grid-template-columns:1fr;gap:36px}
}

/* ---------- Abschnitte ---------- */
.abschnitt{padding:76px 20px}
.abschnitt-eng{max-width:1180px;margin:0 auto;position:relative;z-index:1}
.abschnitt-kopf{max-width:44rem;margin-bottom:40px}
.abschnitt-kopf h2{
  font-size:clamp(1.6rem,2.8vw,2.15rem);letter-spacing:-.015em;line-height:1.18;
  font-weight:700;margin-bottom:12px;
}
.abschnitt-kopf p{color:var(--text-sekundaer);font-size:1.05rem}
.navy-flaeche .abschnitt-kopf p{color:#c9dbf0}
.getont{background:var(--off-white)}
@media (max-width:640px){.abschnitt{padding:56px 18px}}

/* ---------- Key Facts ---------- */
.facts{padding-top:52px;padding-bottom:52px}
.fact-raster{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.fact-karte{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:22px 20px;text-align:left;
}
.fact-zahl{font-size:1.35rem;font-weight:700;color:var(--allianz-blue);letter-spacing:-.01em;margin-bottom:6px;font-variant-numeric:tabular-nums}
.fact-karte p{font-size:.92rem;font-weight:500;color:var(--text-sekundaer)}
@media (max-width:900px){.fact-raster{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.fact-raster{grid-template-columns:1fr}}

/* ---------- Reform-Punkte ---------- */
.reform-raster{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.reform-punkt{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  padding:26px 22px;
}
.reform-punkt .rp-icon{
  width:48px;height:48px;border-radius:12px;background:var(--light-blue);color:var(--allianz-blue);
  display:grid;place-items:center;margin-bottom:16px;
}
.reform-punkt h3{font-size:1.02rem;font-weight:700;margin-bottom:8px;line-height:1.3;color:var(--primary-navy)}
.reform-punkt p{font-size:.92rem;font-weight:500;color:var(--text-sekundaer)}
@media (max-width:1024px){.reform-raster{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.reform-raster{grid-template-columns:1fr}}

/* ---------- Allianz 2027 ---------- */
.allianz-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.allianz-karte{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius);padding:24px 20px;
}
.allianz-karte h3{font-size:1rem;margin-bottom:8px;color:#fff}
.allianz-karte p{font-size:.9rem;color:#c9dbf0}
@media (max-width:1024px){.allianz-raster{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.allianz-raster{grid-template-columns:1fr}}

/* ---------- Förderrechner ---------- */
.rechner{
  display:grid;grid-template-columns:.92fr 1.08fr;gap:0;
  background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;
  box-shadow:0 20px 50px -30px rgba(8,42,85,.25);
}
.rechner-links{padding:34px 32px;display:flex;flex-direction:column;gap:30px}
.feld label{display:block;font-size:.95rem;font-weight:600;margin-bottom:12px;color:var(--text)}
.feld-wert-gross{font-size:clamp(2rem,4vw,2.6rem);font-weight:700;color:var(--allianz-blue);letter-spacing:-.02em;margin-bottom:10px;font-variant-numeric:tabular-nums}
input[type="range"]{
  width:100%;height:6px;border-radius:100px;background:var(--border);
  -webkit-appearance:none;appearance:none;outline:none;cursor:pointer;
}
input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;width:26px;height:26px;border-radius:50%;
  background:var(--action-blue);border:3px solid #fff;box-shadow:0 2px 8px rgba(8,42,85,.35);cursor:pointer;
}
input[type="range"]::-moz-range-thumb{
  width:26px;height:26px;border-radius:50%;border:3px solid #fff;
  background:var(--action-blue);box-shadow:0 2px 8px rgba(8,42,85,.35);cursor:pointer;
}
input[type="range"]:focus-visible{outline:2px solid var(--action-blue);outline-offset:4px}
.slider-skala{display:flex;justify-content:space-between;font-size:.82rem;color:var(--text-sekundaer);margin-top:8px}
.kinder-wahl{display:flex;gap:8px;flex-wrap:wrap}
.kinder-wahl button{
  min-width:52px;padding:12px 0;border-radius:100px;border:1.5px solid var(--border);
  background:#fff;color:var(--text);font-weight:600;font-size:.98rem;cursor:pointer;
  transition:background .15s,border-color .15s,color .15s;
}
.kinder-wahl button:hover{border-color:var(--action-blue)}
.kinder-wahl button[aria-pressed="true"]{background:var(--action-blue);border-color:var(--action-blue);color:#fff}
.kinder-wahl button:focus-visible{outline:2px solid var(--action-blue);outline-offset:2px}

.rechner-rechts{
  position:relative;overflow:hidden;
  background:linear-gradient(150deg,#0d3a72 0%,var(--primary-navy) 45%,var(--deep-navy) 100%);
  color:#fff;padding:34px 32px;display:flex;flex-direction:column;gap:14px;
}
.ergebnis-reihe{display:flex;justify-content:space-between;align-items:baseline;font-size:.98rem;color:#c9dbf0;position:relative;z-index:1}
.ergebnis-reihe .er-wert{font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.ergebnis-trenner{height:1px;background:rgba(255,255,255,.18);margin:6px 0;position:relative;z-index:1}
.ergebnis-gross{position:relative;z-index:1}
.er-summe{font-size:clamp(1.9rem,4vw,2.5rem);font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-bottom:6px}
.ergebnis-gross p{font-size:.98rem;color:#c9dbf0;margin-bottom:4px}
.er-sub b{color:#fff;font-variant-numeric:tabular-nums}
.rechner-rechts .knopf{margin-top:8px;position:relative;z-index:1}
.rechner-fussnote{font-size:.84rem;color:var(--text-sekundaer);margin-top:20px;max-width:52rem}
@media (max-width:900px){
  .rechner{grid-template-columns:1fr}
  .rechner-links,.rechner-rechts{padding:26px 22px}
}

/* ---------- FAQ ---------- */
.faq-liste{display:flex;flex-direction:column;gap:10px}
.faq-liste details{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:4px 20px;
}
.faq-liste summary{
  list-style:none;cursor:pointer;padding:16px 28px 16px 0;font-weight:600;font-size:1rem;
  position:relative;display:flex;align-items:center;justify-content:space-between;
}
.faq-liste summary::-webkit-details-marker{display:none}
.faq-icon{
  position:absolute;right:0;top:50%;transform:translateY(-50%);width:20px;height:20px;flex:none;
}
.faq-icon::before,.faq-icon::after{
  content:"";position:absolute;background:var(--allianz-blue);border-radius:2px;
}
.faq-icon::before{width:14px;height:2px;top:9px;left:3px}
.faq-icon::after{width:2px;height:14px;top:3px;left:9px;transition:transform .15s}
.faq-liste details[open] .faq-icon::after{transform:scaleY(0)}
.faq-text{padding:0 0 18px;color:var(--text-sekundaer);font-size:.96rem;line-height:1.6}

/* ---------- Lead Section ---------- */
.lead{display:grid;grid-template-columns:.85fr 1.15fr;gap:0;border-radius:18px;overflow:hidden;box-shadow:0 20px 50px -30px rgba(8,42,85,.25)}
.lead-info{padding:40px 36px}
.lead-info h2{font-size:clamp(1.5rem,2.6vw,1.9rem);letter-spacing:-.015em;margin-bottom:14px;line-height:1.2}
.lead-info p{color:#c9dbf0;font-size:1rem;margin-bottom:24px}
.lead-vorteile{list-style:none;display:grid;gap:14px}
.lead-vorteile li{display:flex;align-items:center;gap:12px;font-size:.96rem;color:#fff}
.lead-vorteile svg{flex:none;color:var(--gruen)}
.lead-kontakt{margin-top:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.16)}
.lead-kontakt p{color:#c9dbf0;font-size:.9rem;margin-bottom:6px}
.lead-kontakt a{display:block;color:#fff;font-weight:600;font-size:.98rem;text-decoration:none;line-height:1.5}
.lead-kontakt a:hover{text-decoration:underline}
.lead-form-huelle{background:#fff;padding:40px 36px;position:relative}
.formular-raster{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.f-feld{display:flex;flex-direction:column;gap:7px}
.f-feld.breit{grid-column:1/-1}
.f-feld label{font-size:.9rem;font-weight:600}
.f-feld input,.f-feld select,.f-feld textarea{
  border:1.5px solid var(--border);border-radius:10px;padding:12px 14px;font-size:.98rem;
  font-family:inherit;color:var(--text);background:#fff;
}
.f-feld input:focus-visible,.f-feld select:focus-visible,.f-feld textarea:focus-visible{
  outline:2px solid var(--action-blue);outline-offset:1px;border-color:var(--action-blue);
}
.f-feld input.beruehrt:invalid{border-color:#d64545}
.f-fehler{font-size:.82rem;color:#d64545;min-height:1em;display:block}
.f-fehler.breit{grid-column:1/-1;margin-top:-8px}
.riester-wahl{display:flex;gap:10px;flex-wrap:wrap}
.riester-wahl label{
  display:flex;align-items:center;gap:8px;border:1.5px solid var(--border);border-radius:100px;
  padding:10px 18px;cursor:pointer;font-size:.94rem;
}
.riester-wahl input{accent-color:var(--action-blue)}
.hp-feld{position:absolute;opacity:0;height:0;width:0;overflow:hidden;pointer-events:none}
.f-zustimmung{display:flex;align-items:flex-start;gap:12px;font-size:.87rem;color:var(--text-sekundaer);cursor:pointer;line-height:1.5}
.f-zustimmung input{margin-top:3px;accent-color:var(--action-blue);flex:none}
.f-zustimmung a{color:var(--allianz-blue);text-decoration:underline}
.f-status{grid-column:1/-1;font-size:.92rem;min-height:1.2em}
.f-status.fehler{color:#d64545}
.f-status-kontakt{display:flex;gap:16px;flex-wrap:wrap;margin-top:-6px;margin-bottom:4px}
.f-status-kontakt[hidden]{display:none}
.f-status-kontakt a{font-size:.92rem;font-weight:600;color:var(--allianz-blue);text-decoration:none}
.f-status-kontakt a:hover{text-decoration:underline}
.f-rechtstexte{font-size:.8rem;color:var(--text-sekundaer);text-align:center}
.f-rechtstexte a{color:var(--allianz-blue);text-decoration:underline}

.erfolg-karte{text-align:center;padding:40px 10px}
.erfolg-icon{
  width:56px;height:56px;border-radius:50%;background:var(--light-blue);color:var(--allianz-blue);
  display:grid;place-items:center;margin:0 auto 18px;
}
.erfolg-karte h3{font-size:1.3rem;margin-bottom:10px}
.erfolg-karte p{color:var(--text-sekundaer);font-size:.98rem;margin-bottom:6px}
.erfolg-signatur{font-weight:600;color:var(--text)}

@media (max-width:900px){
  .lead{grid-template-columns:1fr}
  .lead-info,.lead-form-huelle{padding:30px 22px}
  .formular-raster{grid-template-columns:1fr}
}

/* ---------- Footer ---------- */
.fuss{background:var(--off-white);padding:44px 20px;border-top:1px solid var(--border)}
.fuss-inner{display:flex;flex-direction:column;gap:16px}
.fuss-links{display:flex;gap:18px;flex-wrap:wrap}
.fuss-links a{font-size:.9rem;color:var(--text-sekundaer);text-decoration:none}
.fuss-links a:hover{color:var(--allianz-blue)}
.fuss-copy{font-size:.8rem;color:var(--text-sekundaer);line-height:1.6;max-width:60rem}
.fuss-kontakt{display:flex;gap:16px;flex-wrap:wrap;align-items:baseline;font-size:.88rem}
.fuss-kontakt b{color:var(--text);font-weight:600}
.fuss-kontakt a{color:var(--allianz-blue);text-decoration:none}
.fuss-kontakt a:hover{text-decoration:underline}
