:root{
  --tinte:#1F2937;
  --papier:#FFF9F0;
  --flieder:#D9F0E1;
  --minze:#10B981;
  --sonne:#FDE68A;
  --koralle:#F97316;
  --grau:#5B6470;
  --linie:#E5E7EB;

  --rund:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold","Trebuchet MS",system-ui,sans-serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--papier);color:var(--tinte);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid var(--koralle);outline-offset:3px;border-radius:6px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--rund);font-weight:800;line-height:1.1;letter-spacing:-.02em}
h1{font-size:clamp(2.3rem,5.6vw,4.1rem)}
h2{font-size:clamp(1.8rem,3.6vw,2.6rem);margin-bottom:14px}
h3{font-size:1.3rem;margin-bottom:8px}
p.lead{font-size:1.15rem;color:var(--grau);max-width:56ch}

/* Header */
header{position:sticky;top:0;z-index:30;background:rgba(255,251,239,.94);backdrop-filter:blur(8px);border-bottom:2px solid var(--flieder)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-family:var(--rund);font-weight:800;font-size:1.6rem;text-decoration:none;display:flex;align-items:center;gap:8px;letter-spacing:-.03em}
.logo .vogel{width:58px;height:58px;flex:none;display:block;object-fit:contain}
.logo .dot{width:30px;height:30px;border-radius:50% 50% 50% 8px;background:var(--koralle);display:inline-block;position:relative}
.logo .dot::after{content:"";position:absolute;inset:8px;background:var(--sonne);border-radius:50%}
.logo b{color:var(--koralle);font-weight:800}
nav ul{display:flex;gap:26px;list-style:none;align-items:center}
nav a{text-decoration:none;font-size:.97rem;color:var(--grau);font-weight:600}
nav a:hover{color:var(--tinte)}
.btn{display:inline-block;font-family:var(--rund);font-weight:800;font-size:1.02rem;background:var(--koralle);color:#fff;text-decoration:none;padding:15px 28px;border:0;border-radius:999px;cursor:pointer;box-shadow:0 4px 0 #17522F;transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translateY(2px);box-shadow:0 2px 0 #17522F}
.btn.hell{background:#fff;color:var(--tinte);box-shadow:0 4px 0 var(--linie);border:2px solid var(--linie)}
.btn.hell:hover{box-shadow:0 2px 0 var(--linie)}
nav .btn{padding:10px 20px;font-size:.95rem;color:#fff}

/* Hero */
.hero{padding:64px 0 88px;background:
  radial-gradient(circle at 92% 12%,#3F7FCB 0 90px,transparent 91px),
  radial-gradient(circle at 4% 92%,#3F7FCB 0 120px,transparent 121px),
  var(--sonne);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.sticker{display:inline-block;font-family:var(--rund);font-weight:800;font-size:.95rem;background:#FFF3C2;padding:8px 16px;border-radius:999px;transform:rotate(-3deg);margin-bottom:20px;box-shadow:0 3px 0 rgba(58,38,24,.15)}
.hero p.lead{margin:20px 0 30px;color:#4B3A2D}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero .stadt{margin-top:22px;font-size:.95rem;color:var(--tinte);font-weight:600}

/* Wochenplaner */
.plan{background:#fff;border:3px solid var(--tinte);border-radius:28px;padding:24px;box-shadow:8px 8px 0 var(--tinte)}
.plan h2{font-size:1.2rem;margin-bottom:12px}
.alter{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.al{font-family:var(--rund);font-weight:800;font-size:.98rem;padding:9px 16px;border-radius:999px;border:2px solid var(--linie);background:#fff;color:var(--tinte);cursor:pointer}
.al:hover{border-color:var(--tinte)}
.al[aria-pressed=true]{background:var(--tinte);border-color:var(--tinte);color:#fff}
.status{display:inline-block;font-size:.82rem;font-weight:700;padding:3px 12px;border-radius:999px;margin-bottom:12px}
.status.jetzt{background:var(--minze);color:#0F3D26}
.status.bald{background:var(--sonne);color:#4A3500}
.tage{list-style:none}
.tage li{display:flex;gap:14px;align-items:center;padding:11px 0;border-top:2px dashed var(--linie)}
.tage .tag{flex:none;width:42px;height:42px;border-radius:12px;background:var(--flieder);display:grid;place-items:center;font-family:var(--rund);font-weight:800;font-size:.95rem}
.tage li:nth-child(2) .tag{background:#D5F0DF}
.tage li:nth-child(3) .tag{background:#D6E6F7}
.tage li:nth-child(4) .tag{background:#EBD9CE}
.tage strong{display:block;font-family:var(--rund);line-height:1.2}
.tage span.s{font-size:.9rem;color:var(--grau)}
.plan .hinweis{margin-top:12px;font-size:.85rem;color:var(--grau)}

.feld .zustimmung{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.9rem;line-height:1.4}
.feld .zustimmung input{width:auto;margin-top:3px;accent-color:var(--koralle);flex:none}
.feld .zustimmung a{color:var(--tinte);font-weight:700}
footer a{color:var(--grau)}

/* Welten */
.welten{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.welt{background:#fff;border:3px solid var(--tinte);border-radius:24px;padding:26px}
.welt i{display:block;width:44px;height:44px;border-radius:14px 14px 14px 4px;margin-bottom:14px;border:3px solid var(--tinte)}
.welt p{color:var(--grau);font-size:.98rem}
.welten-text{margin-top:30px;font-family:var(--rund);font-weight:800;font-size:1.25rem;max-width:56ch;line-height:1.3}
@media (max-width:960px){.welten{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.welten{grid-template-columns:1fr}}

/* Anmeldung */
.anm-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.builder{background:#fff;border:3px solid var(--tinte);border-radius:28px;padding:28px;box-shadow:8px 8px 0 var(--tinte)}
.av-vorschau{width:150px;height:150px;margin:14px auto 18px;border-radius:50%;overflow:hidden;background:var(--flieder);border:3px solid var(--tinte)}
.av-vorschau svg,.av-klein svg{display:block;width:100%;height:100%}
.opt-zeile{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.opt-label{flex:none;width:106px;font-weight:700;font-size:.93rem}
.swatches,.stile{display:flex;gap:8px;flex-wrap:wrap}
.sw{width:34px;height:34px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px var(--linie);cursor:pointer}
.sw[aria-pressed=true]{box-shadow:0 0 0 3px var(--tinte)}
.st{font-family:var(--rund);font-weight:800;font-size:.88rem;padding:7px 13px;border-radius:999px;border:2px solid var(--linie);background:#fff;color:var(--tinte);cursor:pointer}
.st[aria-pressed=true]{background:var(--tinte);border-color:var(--tinte);color:#fff}
.kleiner{font-size:.85rem;color:var(--grau);margin-top:6px}
.tablet{background:var(--tinte);color:#fff;border-radius:24px;padding:22px;border:6px solid #754739}
.t-kopf{font-size:.85rem;color:#EAD7AE;margin-bottom:12px;font-weight:600}
.t-ok{background:var(--minze);color:#0F3D26;font-family:var(--rund);font-weight:800;padding:10px 16px;border-radius:14px;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.t-ok::before{content:"✓";font-size:1.2rem}
.t-kind{display:flex;gap:14px;align-items:center;background:#5A3A2D;border-radius:16px;padding:14px;margin-bottom:12px}
.av-klein{width:64px;height:64px;border-radius:50%;overflow:hidden;flex:none;background:var(--flieder)}
.t-kind strong{display:block;font-family:var(--rund);font-size:1.3rem;line-height:1.2}
.t-kind span{font-size:.88rem;color:#EAD7AE}
.t-zeile{display:flex;justify-content:space-between;padding:8px 4px;border-top:1px dashed #8A6450;font-size:.95rem}
.t-nicht{margin-top:12px;font-size:.82rem;color:#EAD7AE}
.checkin{list-style:none;margin-top:24px;counter-reset:c}
.checkin li{counter-increment:c;padding:12px 0 12px 46px;position:relative;border-top:2px dashed var(--linie);color:var(--grau);font-size:.97rem}
.checkin li::before{content:counter(c);position:absolute;left:0;top:12px;width:32px;height:32px;border-radius:50%;background:var(--sonne);color:var(--tinte);display:grid;place-items:center;font-family:var(--rund);font-weight:800}
.checkin strong{display:block;color:var(--tinte);font-family:var(--rund)}
.datenschutz{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.datenschutz li{background:#fff;border-radius:20px;padding:20px;font-size:.93rem;color:var(--grau);border:2px solid var(--linie)}
.datenschutz strong{display:block;color:var(--tinte);font-family:var(--rund);font-size:1.02rem;margin-bottom:4px}
@media (max-width:960px){.anm-grid{grid-template-columns:1fr}.datenschutz{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.datenschutz{grid-template-columns:1fr}.builder{padding:22px 18px;box-shadow:5px 5px 0 var(--tinte)}.opt-label{width:100%}}

/* Sektionen */
section{padding:84px 0}
.weiss{background:#fff}
.sec-head{margin-bottom:44px}

/* Schritte */
.schritte{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
.schritt{counter-increment:s;background:var(--flieder);border-radius:24px;padding:26px 24px}
.schritt::before{content:counter(s);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--tinte);color:#fff;font-family:var(--rund);font-weight:800;margin-bottom:14px}
.schritt:nth-child(2){background:#D5F0DF}
.schritt:nth-child(3){background:#D6E6F7}
.schritt:nth-child(4){background:#EBD9CE}
.schritt p{color:#5A4638;font-size:.98rem}

/* Eltern dabei */
.eltern{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.vorteile{list-style:none}
.vorteile li{padding:16px 0 16px 48px;border-top:2px dashed var(--linie);position:relative}
.vorteile li:last-child{border-bottom:2px dashed var(--linie)}
.vorteile li::before{content:"";position:absolute;left:4px;top:19px;width:26px;height:26px;border-radius:50%;background:var(--minze)}
.vorteile li::after{content:"";position:absolute;left:12px;top:26px;width:10px;height:6px;border-left:3px solid var(--tinte);border-bottom:3px solid var(--tinte);transform:rotate(-45deg)}
.vorteile strong{display:block;font-family:var(--rund);font-size:1.1rem}
.vorteile span{color:var(--grau);font-size:.98rem}

/* Altersgruppen */
.gruppen{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.gruppe{border:3px solid var(--tinte);border-radius:28px;padding:30px;background:#fff;display:flex;flex-direction:column}
.gruppe.start{background:var(--sonne)}
.gruppe .gross{font-family:var(--rund);font-weight:800;font-size:2.6rem;line-height:1;letter-spacing:-.04em}
.gruppe .gross small{font-size:1rem;letter-spacing:0}
.gruppe .status{align-self:flex-start;margin:12px 0}
.gruppe ul{list-style:none;margin-top:8px;font-size:.98rem}
.gruppe li{padding:8px 0;border-top:2px dashed rgba(58,38,24,.2)}

/* Orte */
.orte{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ort{background:#fff;border:2px solid var(--linie);border-radius:20px;padding:22px 20px}
.ort h3{font-size:1.08rem;margin-bottom:4px}
.ort p{font-size:.92rem;color:var(--grau);line-height:1.45}
.ort i{display:block;width:34px;height:34px;border-radius:10px;margin-bottom:12px}
.ort:nth-child(4n+1) i{background:var(--koralle)}
.ort:nth-child(4n+2) i{background:var(--sonne)}
.ort:nth-child(4n+3) i{background:var(--minze)}
.ort:nth-child(4n) i{background:var(--tinte)}
.orte-hinweis{margin-top:20px;color:var(--grau);font-size:.95rem}

/* Preise */
.preise{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.preis{border:3px solid var(--tinte);border-radius:28px;padding:30px;background:#fff;display:flex;flex-direction:column;position:relative}
.preis.top{background:var(--tinte);color:#fff;box-shadow:8px 8px 0 var(--sonne)}
.preis .tag{position:absolute;top:-16px;left:24px;background:var(--sonne);color:var(--tinte);font-family:var(--rund);font-weight:800;font-size:.85rem;padding:5px 14px;border-radius:999px;transform:rotate(-2deg)}
.preis .p{font-family:var(--rund);font-weight:800;font-size:2.6rem;letter-spacing:-.04em;margin:6px 0 0}
.preis .p small{font-size:.95rem;font-weight:600;letter-spacing:0;opacity:.7}
.preis .sub{font-size:.95rem;opacity:.8;margin-bottom:18px}
.preis ul{list-style:none;flex:1;margin-bottom:24px;font-size:.97rem}
.preis li{padding:9px 0;border-top:2px dashed rgba(138,100,80,.4)}
.preis .btn{text-align:center}
.preis.top .btn{box-shadow:0 4px 0 #17522F}
.preise-hinweis{margin-top:22px;font-size:.92rem;color:var(--grau)}

/* Partner */
.partner{background:var(--tinte);color:#fff}
.partner-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.partner p.lead{color:#EAD7AE}
.partner ul{list-style:none;margin:20px 0 28px}
.partner li{padding:12px 0 12px 30px;border-top:2px dashed rgba(255,255,255,.2);position:relative}
.partner li::before{content:"";position:absolute;left:2px;top:19px;width:12px;height:12px;border-radius:50%;background:var(--minze)}
.partner .btn{background:var(--sonne);color:var(--tinte);box-shadow:0 4px 0 #C48A12}
.partner .btn:hover{box-shadow:0 2px 0 #C48A12}

/* FAQ */
.faq{max-width:800px}
details{border-top:2px solid var(--flieder);padding:20px 0}
details:last-child{border-bottom:2px solid var(--flieder)}
summary{cursor:pointer;font-family:var(--rund);font-weight:800;font-size:1.15rem;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";width:32px;height:32px;flex:none;border-radius:50%;background:var(--flieder);display:grid;place-items:center;font-size:1.4rem;line-height:1;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg);background:var(--sonne)}
details p{margin-top:12px;color:var(--grau);max-width:62ch}

/* Warteliste */
.warte{background:var(--flieder)}
.warte-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.form{background:#fff;border:3px solid var(--tinte);border-radius:28px;padding:30px;box-shadow:8px 8px 0 var(--tinte)}
.feld{margin-bottom:16px}
.feld label{display:block;font-weight:700;font-size:.95rem;margin-bottom:6px}
.feld input,.feld select{width:100%;font:inherit;padding:12px 14px;border:2px solid var(--linie);border-radius:14px;background:var(--papier)}
.feld input:focus,.feld select:focus{outline:3px solid var(--koralle);outline-offset:0;border-color:var(--tinte)}
.checks{display:flex;gap:10px;flex-wrap:wrap}
.checks label{font-weight:700;font-size:.92rem;display:flex;gap:6px;align-items:center;border:2px solid var(--linie);padding:8px 14px;border-radius:999px;cursor:pointer;margin:0;background:var(--papier)}
.checks input{width:auto;accent-color:var(--koralle)}
.form .btn{width:100%}
.danke{display:none;text-align:center;padding:20px 0}
.danke .ball{width:72px;height:72px;border-radius:50%;background:var(--minze);margin:0 auto 16px;display:grid;place-items:center;font-size:2rem;font-weight:800}

footer{padding:34px 0;font-size:.9rem;color:var(--grau)}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer p{max-width:62ch}

@media (max-width:960px){
  .hero-grid,.eltern,.partner-grid,.warte-grid{grid-template-columns:1fr}
  .schritte{grid-template-columns:1fr 1fr}
  .gruppen,.preise{grid-template-columns:1fr}
  .orte{grid-template-columns:1fr 1fr}
  nav ul li:not(:last-child){display:none}
  section{padding:64px 0}
  .hero{padding:44px 0 64px}
}
@media (max-width:520px){
  .schritte,.orte{grid-template-columns:1fr}
  .plan,.form,.gruppe,.preis{padding:22px 18px}
  .plan,.form{box-shadow:5px 5px 0 var(--tinte)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}