@font-face{font-family:"Cormorant Garamond";src:url(../assets/schriften/cormorant-garamond-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Raleway";src:url(../assets/schriften/raleway-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Raleway";src:url(../assets/schriften/raleway-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Raleway";src:url(../assets/schriften/raleway-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Alex Brush";src:url(../assets/schriften/alex-brush-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}

/* Tokens */
:root{
  --weiss:#fff;--rose:#f4dbe7;--rose-hell:#fdf6f9;--beere:#cb317f;--beere-tief:#a6246a;--tuerkis:#358a95;--titel:#262626;--text:#3d3d3d;
  --schatten:0 28px 70px rgba(120,60,90,.18);--schatten-klein:0 10px 30px rgba(120,60,90,.08);
  --titelschrift:"Cormorant Garamond",Georgia,serif;--textschrift:"Raleway","Helvetica Neue",Arial,sans-serif;--akzentschrift:"Alex Brush",cursive;
  --rand:20px;--abstand:80px;--kopfhoehe:60px;--breite:1180px;
  --weich:cubic-bezier(.22,.61,.36,1);--dauer:.6s
}

/* Grundlagen */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--kopfhoehe) + 12px)}
body{margin:0;background:var(--weiss);color:var(--text);font:400 17px/1.7 var(--textschrift);font-variant-numeric:lining-nums}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--beere);outline-offset:3px}
h1,h2{font-family:var(--titelschrift);font-weight:700;color:var(--titel);margin:0;font-variant-numeric:lining-nums;text-wrap:balance}
h2{font-size:clamp(2.15rem,5.4vw,3.4rem);line-height:1.1}
h3{font:600 1.15rem/1.35 var(--textschrift);color:var(--titel);margin:0 0 .4em}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
.sprung{position:absolute;left:12px;top:-60px;z-index:60;padding:10px 16px;background:#fff;border-radius:8px}
.sprung:focus{top:10px}
[data-kit=service] [data-nur=coaching],[data-kit=coaching] [data-nur=service]{display:none}
.dachzeile{font:600 .78rem/1.4 var(--textschrift);letter-spacing:.16em;text-transform:uppercase;color:var(--beere);margin:0 0 1em}

/* Knöpfe */
.knopf{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:12px 32px;border-radius:99px;border:1px solid var(--beere);color:var(--beere);font-weight:600;font-size:1rem;text-decoration:none;text-align:center;transition:background .3s,color .3s,transform .3s var(--weich),box-shadow .3s}
.knopf--voll{background:var(--beere);color:#fff}
.knopf--voll:hover{background:var(--beere-tief);border-color:var(--beere-tief);transform:translateY(-2px);box-shadow:0 10px 24px rgba(203,49,127,.28)}
.knopf:active{transform:scale(.98)}
.knopf--klein{min-height:46px;padding:8px 20px;font-size:.92rem}
.knopf--wartet{background:#fff;color:var(--text);border:1px dashed var(--beere);cursor:not-allowed;width:100%}

/* Kopfzeile */
.kopf{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:var(--kopfhoehe);padding:6px var(--rand);background:#fff;border-bottom:1px solid var(--rose)}
.kopf__logo img{width:84px}
.wahlschalter{display:inline-flex;padding:3px;border:1px solid var(--rose);border-radius:99px;background:var(--rose-hell)}
.wahlschalter button{min-height:44px;padding:4px 12px;border-radius:99px;font-size:.8rem;font-weight:600;line-height:1.15;transition:background .3s,color .3s}
.wahlschalter button[aria-pressed=true]{background:var(--beere);color:#fff}
html:not(.js) .wahlschalter,html:not(.js) .wahl,html:not(.js) .kaufleiste,html:not(.js) .wandel__reiter,html:not(.js) .demobereich{display:none}

/* Hero */
.hero{position:relative;display:grid;gap:30px;padding:26px var(--rand) 34px;overflow:hidden;background:radial-gradient(90% 55% at 60% 72%,var(--rose) 0,var(--rose-hell) 55%,#fff 100%)}
.hero .dachzeile{font:400 1.75rem/1.1 var(--akzentschrift);letter-spacing:0;text-transform:none;margin-bottom:.3em}
h1{font-size:clamp(2.6rem,11vw,5rem);line-height:1.03}
.z{display:block;animation:zeile .8s var(--weich) both}
.z:nth-child(2){animation-delay:.12s}
.z--klein{margin-top:.4em;font-size:.56em;line-height:1.16;color:var(--beere);animation-delay:.24s}
@keyframes zeile{from{opacity:.35;transform:translateY(14px)}to{opacity:1;transform:none}}
.hero__unter{font-size:1.05rem;line-height:1.6;margin:14px 0 18px;max-width:34em}
.hero__anders{margin:12px 0 0;font-size:.95rem;font-weight:600;color:var(--titel)}
.buehne{position:relative;display:flex;justify-content:center;transition:transform .2s linear}
.laptop{display:none;margin:0}
.handy{position:relative;width:min(72vw,270px);margin:0;padding:7px;background:var(--titel);border-radius:34px;box-shadow:var(--schatten)}
.handy__bild{position:relative;overflow:hidden;border-radius:28px;aspect-ratio:390/780;background:#fff}
.handy__bild img{width:100%;height:100%;object-fit:cover;object-position:top}
.handy__meldung{position:absolute;left:50%;bottom:9%;transform:translate(-50%,8px);padding:7px 15px;border-radius:99px;background:var(--titel);color:#fff;font-size:.82rem;font-weight:600;white-space:nowrap;opacity:0;animation:meldung 6s ease infinite}
@keyframes meldung{0%,55%,100%{opacity:0;transform:translate(-50%,8px)}62%,85%{opacity:1;transform:translate(-50%,0)}}
.hero__punkte{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;text-align:center;font-size:.9rem;line-height:1.3;color:var(--titel)}
.hero__punkte b{display:block;font:700 2.2rem/1 var(--titelschrift);color:var(--beere)}

/* Wahl */
.wahl{max-width:760px;margin:0 auto;padding:30px var(--rand) 34px;text-align:center}
.wahl h2{margin-bottom:18px;font-size:clamp(1.8rem,5vw,2.4rem)}
.wahl__karten{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.wahlkarte{display:grid;align-content:center;gap:0;min-height:96px;padding:14px;text-align:left;background:#fff;border:1px solid var(--rose);border-radius:16px;box-shadow:var(--schatten-klein);transition:border-color .3s,transform .3s var(--weich),background .3s}
.wahlkarte:hover{border-color:var(--beere);transform:translateY(-2px)}
.wahlkarte[aria-pressed=true]{border-color:var(--beere);background:var(--rose-hell);box-shadow:inset 0 0 0 1px var(--beere)}
.wahlkarte__klein{font-size:.85rem}
.wahlkarte__gross{font:700 1.4rem/1.12 var(--titelschrift);color:var(--titel)}
.wahl__status{min-height:1.5em;margin:12px 0 0;font-size:.92rem;font-weight:500;color:var(--beere-tief)}

/* Demo: der dunkle Höhepunkt */
.demobereich{background:var(--titel);color:#fff;padding:64px var(--rand) 70px}
.demobereich__kopf{max-width:680px;margin:0 auto 30px;text-align:center}
.demobereich h2{color:#fff}
.demobereich .dachzeile{color:var(--rose)}
.demobereich__kopf p:last-child{margin-top:12px;color:var(--rose)}
.demo{max-width:960px;margin:0 auto}
.demo__ohne{text-align:center}
.demo__schritte{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.demo__schritte button{display:grid;justify-items:center;gap:4px;width:100%;min-height:58px;padding:4px 0;color:var(--rose);font-size:.68rem;font-weight:600;transition:color .3s}
.demo__schritte b{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--rose);border-radius:50%;font:700 1.05rem/1 var(--titelschrift);transition:background .3s,color .3s,border-color .3s}
.demo__schritte [aria-current=step]{color:#fff}
.demo__schritte [aria-current=step] b{background:var(--beere);border-color:var(--beere);color:#fff}
.demo__leiste{height:2px;margin:10px 0 18px;background:rgba(244,219,231,.25);border-radius:2px;overflow:hidden}
.demo__leiste span{display:block;height:100%;background:var(--beere);transition:width var(--dauer) var(--weich)}
.demo__kopf{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.demo__kopf p{margin:0;font-size:1rem;line-height:1.45;min-height:4.3em}
.demo__pause{flex:none;min-height:44px;padding:4px 14px;border:1px solid var(--rose);border-radius:99px;color:#fff;font-size:.82rem;font-weight:600;transition:background .3s}
.demo__pause:hover{background:rgba(244,219,231,.15)}
.demo__flaeche{min-height:650px;padding:16px;background:#fff;color:var(--text);border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.35);animation:flaeche .45s var(--weich)}
@keyframes flaeche{from{opacity:.25;transform:translateY(6px)}to{opacity:1;transform:none}}
.demo__chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.demo__chips button{min-height:44px;padding:4px 15px;border:1px solid var(--rose);border-radius:99px;font-size:.9rem;transition:border-color .25s,color .25s}
.demo__chips [aria-pressed=true]{border-color:var(--beere);color:var(--beere-tief);font-weight:600}
.demo__raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.demo__karte{display:grid;gap:3px;padding:0 0 10px;text-align:left;border:1px solid var(--rose);border-radius:12px;overflow:hidden;font-size:.9rem;font-weight:600;line-height:1.3;color:var(--titel);transition:transform .3s var(--weich),box-shadow .3s,border-color .3s}
.demo__karte:hover{transform:translateY(-3px);box-shadow:var(--schatten-klein)}
.demo__karte.ist-gewaehlt{border-color:var(--beere)}
.demo__karte img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top;margin-bottom:6px}
.demo__karte span,.demo__karte small{padding-inline:10px}
.demo__karte small{font-weight:400;color:var(--text)}
.demo__zwei{display:grid;gap:16px}
.demo__medien{display:grid;justify-items:center}
.demo__medien img,.demo__medien video{width:100%;max-width:270px;max-height:340px;border-radius:12px;object-fit:cover;object-position:top;background:var(--rose-hell)}
.demo__titel{margin:0 0 2px;font-weight:600;font-size:1.08rem;color:var(--titel)}
.demo__nummer{margin:0 0 12px;font-size:.9rem}
.demo__knopfnachbau{display:flex;align-items:center;justify-content:center;min-height:46px;margin:0 0 8px;padding:6px 14px;border-radius:99px;background:var(--beere);color:#fff;font-size:.92rem;font-weight:600}
.demo__hooks{margin:0 0 12px;padding:0;border:0}
.demo__hooks legend{padding:0;margin:0 0 4px;font:600 .78rem/1.4 var(--textschrift);letter-spacing:.08em;text-transform:uppercase;color:var(--titel)}
.demo__hooks label{display:flex;gap:10px;align-items:flex-start;min-height:44px;padding:9px 0;border-bottom:1px solid var(--rose);line-height:1.4;cursor:pointer}
.demo__hooks input{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--beere)}
.demo__caption{max-height:210px;overflow-y:auto;margin:0 0 12px;padding:12px 14px;border-radius:12px;background:var(--rose-hell);font-size:.92rem;line-height:1.55;white-space:pre-line}
.demo__aktionen{display:flex;flex-wrap:wrap;gap:8px}
.kopier{min-height:44px;padding:6px 16px;border:1px solid var(--beere);border-radius:99px;color:var(--beere-tief);font-size:.92rem;font-weight:600;transition:background .25s,color .25s,transform .2s var(--weich)}
.kopier:hover{background:var(--rose-hell)}
.kopier:active{transform:scale(.97)}
.kopier--breit{width:100%}
.kopier--voll{background:var(--beere);color:#fff}
.kopier--voll:hover{background:var(--beere-tief)}
.kopier.kopiert{background:var(--titel);border-color:var(--titel);color:#fff;animation:kopiert .35s var(--weich)}
@keyframes kopiert{40%{transform:scale(1.05)}}
.demo__liste li{padding:10px 0 10px 22px;position:relative;border-bottom:1px solid var(--rose);line-height:1.4}
.demo__liste li::before{content:"";position:absolute;left:0;top:1.05em;width:7px;height:7px;border-radius:50%;background:var(--beere)}
.demo__zitat{margin:6px 0 12px;font:700 1.55rem/1.2 var(--titelschrift);color:var(--titel)}
.demo__hinweis{margin:0 0 14px;font-size:.9rem;line-height:1.5}

/* Vorher und Nachher */
.abschnitt{max-width:var(--breite);margin:0 auto;padding:var(--abstand) var(--rand)}
.abschnitt--schmal{max-width:820px}
.abschnitt__kopf{max-width:720px;margin:0 auto 34px;text-align:center}
.abschnitt__kopf p:not(.dachzeile){margin-top:14px;margin-bottom:0}
.abschnitt__kopf--links{margin-left:0;text-align:left}
.wandel__reiter{display:flex;justify-content:center;gap:6px;margin-bottom:16px}
.wandel__reiter button{min-height:44px;padding:4px 18px;border-radius:99px;font-size:.92rem;font-weight:600;transition:background .3s,color .3s}
.wandel__reiter [aria-pressed=true]{background:var(--rose);color:var(--titel)}
.wandel__paar{display:none;gap:10px}
.wandel__paar.ist-aktiv{display:grid;animation:flaeche .45s var(--weich)}
html:not(.js) .wandel__paar{display:grid;margin-bottom:14px}
.vorher,.nachher{margin:0;padding:22px 20px;border-radius:16px;font:700 1.5rem/1.22 var(--titelschrift)}
.vorher span,.nachher span{display:block;margin-bottom:8px;font:600 .75rem/1.4 var(--textschrift);letter-spacing:.12em;text-transform:uppercase}
.vorher{background:var(--rose-hell);color:var(--titel)}
.nachher{background:var(--beere);color:#fff}

/* Vitrine */
.vitrine{padding:var(--abstand) var(--rand);background:var(--rose-hell)}
.vitrine h3{font:700 clamp(1.8rem,5vw,2.4rem)/1.12 var(--titelschrift);margin:0 0 .35em}
.vitrine__block{max-width:880px;margin:0 auto}
.feed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.feed li{overflow:hidden;border-radius:6px;box-shadow:var(--schatten-klein)}
.feed img{width:100%;transition:transform .7s var(--weich)}
.feed__mehr{display:none}
.vitrine__zahl{margin:14px 0 0;text-align:center;color:var(--titel)}
.vitrine__zahl b{font:700 1.5rem/1 var(--titelschrift);color:var(--beere)}
.faecher{display:grid;gap:24px;max-width:980px;margin:64px auto 0}
.faecher__buehne{position:relative}
.faecher__stapel{position:relative;width:100%;max-width:440px;aspect-ratio:1/.9;margin:0 auto}
.faecher__stapel li{position:absolute;left:21%;top:5%;width:58%;transition:transform .7s var(--weich);z-index:calc(5 - var(--ebene,0))}
.faecher__stapel button{display:block;width:100%;cursor:pointer}
.faecher__stapel img{width:100%;border-radius:8px;box-shadow:var(--schatten)}
.faecher__stapel [data-pos="0"]{--ebene:0;transform:none}
.faecher__stapel [data-pos="1"]{--ebene:1;transform:translateX(24%) rotate(4deg) scale(.92)}
.faecher__stapel [data-pos="2"]{--ebene:2;transform:translateX(-24%) rotate(-4deg) scale(.92)}
.faecher__stapel [data-pos="3"]{--ebene:3;transform:translateX(34%) rotate(8deg) scale(.84)}
.faecher__stapel [data-pos="4"]{--ebene:4;transform:translateX(-34%) rotate(-8deg) scale(.84)}
html:not(.js) .faecher__stapel{aspect-ratio:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
html:not(.js) .faecher__stapel li{position:static;width:auto;transform:none}
html:not(.js) [data-faecher-weiter],html:not(.js) .profil__wahl{display:none}
.hoch{max-width:var(--breite);margin:64px auto 0}
.hoch__kopf{max-width:640px;margin-bottom:18px}
.hoch__liste{display:flex;gap:12px;margin-inline:calc(var(--rand) * -1);padding:4px var(--rand) 10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--rand);scrollbar-width:none}
.hoch__liste::-webkit-scrollbar{display:none}
.hoch__liste li{flex:0 0 58vw;max-width:240px;scroll-snap-align:start}
.hoch figure{margin:0}
.hoch img{width:100%;border-radius:12px;box-shadow:var(--schatten-klein);transition:transform .5s var(--weich)}
.hoch figcaption{padding-top:8px;font-size:.88rem;color:var(--titel)}
.hoch__hinweis{display:flex;align-items:center;gap:12px;margin:6px 0 0;font-size:.88rem;font-weight:600;color:var(--beere-tief)}
.hoch__hinweis i{flex:1;height:3px;background:var(--rose);border-radius:3px;overflow:hidden}
.hoch__hinweis b{display:block;width:30%;height:100%;background:var(--beere);transform:translateX(var(--stand,0));}
.profil{display:grid;gap:26px;max-width:980px;margin:64px auto 0;align-items:center}
.profil__wahl{display:inline-flex;margin:4px 0 12px;padding:3px;border:1px solid var(--rose);border-radius:99px;background:#fff}
.profil__wahl button{min-height:44px;padding:4px 18px;border-radius:99px;font-size:.92rem;font-weight:600;transition:background .3s,color .3s}
.profil__wahl [aria-pressed=true]{background:var(--beere);color:#fff}
.profil__handy[data-variante="1"]{--pa:var(--tuerkis)}
.profil__handy[data-variante="2"]{--pa:var(--beere)}
.profil__handy{justify-self:center;width:min(86vw,320px);margin:0;padding:8px;background:var(--titel);border-radius:36px;box-shadow:var(--schatten)}
.profil__bildschirm{overflow:hidden;padding:20px 0 0;background:#fff;border-radius:29px}
.profil__kopf{display:flex;align-items:center;gap:12px;padding:0 14px 12px;line-height:1.3;font-size:.8rem}
.profil__kopf b{display:block;font-size:.98rem;color:var(--titel)}
.profil__bild{flex:none;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--pa);color:#fff;transition:background .45s var(--weich);font-size:.66rem;font-weight:600;text-align:center}
.profil__kreise{display:flex;gap:12px;padding:0 14px 14px;overflow-x:auto;scrollbar-width:none}
.profil__kreise::-webkit-scrollbar{display:none}
.profil__kreise li{flex:0 0 62px;text-align:center;font-size:.66rem;line-height:1.2;color:var(--titel)}
.profil__kreise img{width:62px;height:62px;padding:2px;border:1px solid var(--pa);border-radius:50%;object-fit:cover;object-position:center;margin-bottom:5px}
.profil__kreise span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profil__saetze{display:grid}
.profil__satz{grid-area:1/1;min-width:0;opacity:0;visibility:hidden;transition:opacity .5s var(--weich),visibility 0s linear .5s}
.profil__handy[data-variante="1"] .profil__satz[data-variante="1"],.profil__handy[data-variante="2"] .profil__satz[data-variante="2"]{opacity:1;visibility:visible;transition:opacity .5s var(--weich)}
.profil__feed li{transform:translateY(7px);transition:transform .55s var(--weich)}
.profil__handy[data-variante="1"] [data-variante="1"] .profil__feed li,.profil__handy[data-variante="2"] [data-variante="2"] .profil__feed li{transform:none}
.profil__feed li:nth-child(2){transition-delay:40ms}.profil__feed li:nth-child(3){transition-delay:80ms}.profil__feed li:nth-child(4){transition-delay:120ms}.profil__feed li:nth-child(5){transition-delay:160ms}.profil__feed li:nth-child(6){transition-delay:200ms}
html:not(.js) .profil__satz[data-nur=coaching]{display:none}
.profil__feed{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
.profil__feed img{width:100%}

/* Content-Plan */
.plan{padding:var(--abstand) var(--rand) 0;background:#fff}
.plan__inhalt{display:grid;gap:26px;max-width:980px;margin:0 auto}
.plan__wochen{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:3px}
.plan__woche{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;min-width:0;gap:3px;padding:4px 1px;border-radius:6px;cursor:pointer;transition:background .25s,box-shadow .25s}
.plan__woche[aria-pressed=true]{background:var(--rose);box-shadow:0 0 0 1px var(--beere)}
.plan__woche i{display:block;aspect-ratio:1;border-radius:3px;background:var(--beere)}
.plan__woche i[data-f=Reel]{background:var(--titel)}
.plan__woche i[data-f=Story]{background:var(--tuerkis)}
.plan__woche i[data-f=Karussell]{background:var(--rose);box-shadow:inset 0 0 0 1px var(--beere)}
.plan__legende{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 0;font-size:.88rem;color:var(--titel)}
.plan__legende li{display:flex;align-items:center;gap:6px}
.plan__legende i{width:12px;height:12px;border-radius:3px;background:var(--beere)}
.plan__legende [data-f=Reel]{background:var(--titel)}
.plan__legende [data-f=Story]{background:var(--tuerkis)}
.plan__legende [data-f=Karussell]{background:var(--rose);box-shadow:inset 0 0 0 1px var(--beere)}
.plan__tipp{margin:10px 0 0;font-size:.88rem}
.plan__detail{border:1px solid var(--rose);border-radius:18px;box-shadow:var(--schatten-klein);overflow:hidden;animation:flaeche .45s var(--weich)}
.plan__detail h3{margin:0;padding:14px 16px;background:var(--rose-hell);font:700 1.5rem/1.1 var(--titelschrift)}
.plan__tage li{display:grid;grid-template-columns:30px 44px minmax(0,1fr);gap:10px;align-items:center;padding:8px 14px;border-top:1px solid var(--rose)}
.plan__tage b{font:700 1.2rem/1 var(--titelschrift);color:var(--beere)}
.plan__tage img{width:44px;height:55px;object-fit:cover;object-position:top;border-radius:4px}
.plan__tage p{margin:0;line-height:1.3;font-size:.95rem;font-weight:600;color:var(--titel);overflow-wrap:anywhere}
.plan__tage small{display:block;font-weight:400;font-size:.82rem;color:var(--text)}

/* PDF oder Atelier */
.pdf{display:grid;gap:30px;max-width:var(--breite);margin:0 auto;padding:var(--abstand) var(--rand);align-items:center}
.pdf h2{margin-bottom:22px}
.pdf__liste{margin:0}
.pdf__liste div{padding:13px 0;border-bottom:1px solid var(--rose)}
.pdf__liste dt{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--titel)}
.pdf__liste dd{margin:2px 0 0;font-weight:500;color:var(--titel)}
.pdf__liste s{display:block;font-weight:400;font-size:.92rem;color:var(--text)}
.pdf__handy{justify-self:center;transition:transform .2s linear}

/* Geschichte */
.geschichte{display:grid;gap:0;background:var(--rose)}
.geschichte__bild img{width:100%;height:auto}
.geschichte__text{padding:40px var(--rand) 48px;color:var(--titel)}
.geschichte h2{margin-bottom:16px}
.geschichte .dachzeile{color:var(--beere-tief)}
.unterschrift{font:400 2.5rem/1 var(--akzentschrift);color:var(--beere-tief);margin-top:10px}

/* Preis */
.preisbereich{padding:var(--abstand) var(--rand);background:#fff}
.umfang{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;max-width:760px;margin:0 auto 28px;font-size:.95rem;color:var(--titel)}
.umfang b{font:700 1.4rem/1 var(--titelschrift);color:var(--beere)}
.preise{display:grid;gap:16px;max-width:940px;margin:0 auto}
.preiskarte{display:flex;flex-direction:column;padding:26px 22px;background:#fff;border:1px solid var(--rose);border-radius:20px;box-shadow:var(--schatten-klein);transition:border-color .3s,box-shadow .3s,transform .3s var(--weich)}
.preiskarte:hover{transform:translateY(-3px)}
.preiskarte--passend{order:-1;border-color:var(--beere);box-shadow:inset 0 0 0 1px var(--beere),var(--schatten-klein)}
.preiskarte h3{font:700 1.7rem/1.14 var(--titelschrift)}
.preiskarte__fuer{margin:4px 0 12px;font-weight:500;color:var(--titel)}
.preiskarte__liste{margin-bottom:16px;font-size:.96rem;line-height:1.5}
.preiskarte__liste li{padding:6px 0 6px 18px;position:relative}
.preiskarte__liste li::before{content:"";position:absolute;left:0;top:.95em;width:6px;height:6px;border-radius:50%;background:var(--beere)}
.preis{margin:auto 0 0}
.preis b{font:700 3.4rem/1 var(--titelschrift);color:var(--titel);font-variant-numeric:lining-nums}
.preis span{font-size:.92rem}
.preis__danach{font-size:.95rem;margin:4px 0 14px}
.preiskarte .knopf{width:100%}
.pflicht{max-width:940px;margin:18px auto 0;padding:15px 18px;border-radius:14px;background:var(--rose);color:var(--titel);font-weight:600;text-align:center}
.klarheit{display:grid;gap:14px;max-width:940px;margin:22px auto 0;font-size:.96rem;line-height:1.6}
.klarheit p{margin:0}
.klarheit strong{color:var(--titel)}

/* Fragen */
.fragen details{border-bottom:1px solid var(--rose)}
.fragen summary{display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:56px;padding:12px 0;font-weight:600;color:var(--titel);cursor:pointer;list-style:none}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";flex:none;font-size:1.5rem;font-weight:400;color:var(--beere);transition:transform .3s var(--weich)}
.fragen details[open] summary::after{transform:rotate(45deg)}
.fragen details p{padding-bottom:18px}
.fragen details p:has(+.fragen__wichtig){padding-bottom:0}
.fragen details .fragen__wichtig{margin-bottom:18px;padding:13px 16px;border-radius:12px;background:var(--rose-hell)}
.fragen__wichtig strong{color:var(--titel)}

/* Abschluss */
.abschluss{max-width:760px;margin:0 auto;padding:30px var(--rand) var(--abstand);text-align:center}
.abschluss img{width:170px;margin:0 auto 24px}
.abschluss h2{margin-bottom:26px}
.fuss{padding:28px var(--rand) 30px;background:var(--rose-hell);font-size:.9rem;text-align:center}
.fuss nav{display:flex;justify-content:center;gap:22px;margin-bottom:8px}
.fuss a{display:inline-flex;align-items:center;min-height:44px}

/* Kaufleiste */
.kaufleiste{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px var(--rand) calc(6px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--rose);box-shadow:0 -6px 20px rgba(120,60,90,.08)}
.kaufleiste[hidden]{display:none}
.kaufleiste p{margin:0;font-size:.8rem;line-height:1.25;font-weight:500}
.kaufleiste b{color:var(--titel)}
.kaufleiste .knopf{flex:none;min-height:44px;padding:6px 18px;font-size:.88rem}

/* Einblenden */
.sanft{opacity:0;transform:translateY(16px);transition:opacity var(--dauer) var(--weich),transform var(--dauer) var(--weich)}
.sanft.da{opacity:1;transform:none}

/* Wechsel zwischen den Ateliers */
::view-transition-old(root),::view-transition-new(root){animation-duration:.4s}

@media (min-width:600px){
  .wahlschalter button{padding:4px 18px;font-size:.88rem}
  .kopf__logo img{width:108px}
  .wahl__karten,.preise{grid-template-columns:repeat(2,minmax(0,1fr))}
  .preiskarte--passend{order:0}
  .demo__schritte button{font-size:.82rem}
  .demo__raster{grid-template-columns:repeat(3,minmax(0,1fr))}
  .demo__zwei{grid-template-columns:minmax(0,270px) minmax(0,1fr);gap:28px}
  .demo__flaeche{min-height:470px;padding:26px}
  .demo__caption{max-height:150px}
  .demo__kopf p{min-height:0}
  .wandel__reiter{display:none}
  .wandel__liste{display:grid;gap:14px;max-width:940px;margin:0 auto}
  .wandel__paar,.wandel__paar.ist-aktiv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);animation:none}
  .klarheit{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feed{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .feed__mehr{display:block}
  .hoch__liste li{flex-basis:200px}
  .plan__tage li{grid-template-columns:36px 44px minmax(0,1fr)}
}
@media (min-width:900px){
  :root{--rand:32px;--abstand:116px;--kopfhoehe:72px}
  h1{font-size:clamp(3rem,4.6vw,4.1rem)}
  .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:24px 50px;padding:48px max(var(--rand),calc((100% - var(--breite)) / 2)) 56px;overflow:hidden}
  .buehne{grid-row:span 2;display:block;padding-bottom:36px;padding-right:40px}
  .laptop{display:block;position:relative;padding:9px 9px 0;background:var(--titel);border-radius:14px 14px 0 0;box-shadow:var(--schatten)}
  .laptop::after{content:"";position:absolute;left:-14px;right:-14px;bottom:-11px;height:11px;background:#fff;border-radius:0 0 12px 12px;box-shadow:var(--schatten-klein)}
  .laptop__bild{aspect-ratio:16/10.6;overflow:hidden;background:#fff;border-radius:3px 3px 0 0}
  .laptop__bild img{width:100%;height:100%;object-fit:cover;object-position:top}
  .buehne .handy{position:absolute;right:0;bottom:0;width:190px}
  .hero__punkte{justify-content:start;grid-template-columns:repeat(3,auto);gap:34px;text-align:left}
  .demobereich{padding-block:104px 112px}
  .demo__flaeche{padding:34px}
  .feed li:hover img{transform:scale(1.03)}
  .hoch img:hover{transform:translateY(-4px)}
  .faecher{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:50px}
  .faecher__stapel li:not([data-pos="0"]):hover{filter:brightness(1.03)}
  .hoch__liste{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin:0;padding:4px 0 0;overflow:visible}
  .hoch__liste li{flex:none;max-width:none}
  .hoch__hinweis{display:none}
  .profil{grid-template-columns:minmax(0,1fr) auto;gap:60px}
  .plan__inhalt{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:start}
  .pdf{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:70px}
  .geschichte{grid-template-columns:minmax(0,440px) minmax(0,660px);justify-content:center;align-items:center}
  .geschichte__text{align-self:center;max-width:620px;padding:60px 56px}
  .kaufleiste{display:none}
  .kaufleiste[hidden]{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .handy__meldung{opacity:1;transform:translate(-50%,0)}
}