/* Layout: mobil zuerst, eine Spalte; ab 860px zweispaltige Abschnitte. Farben + Schriften = GSG-Designsystem */
:root{
 --rose:#C4848C; --rose-d:#a9656e; --creme:#FAF6F2; --taupe:#9E8A7E; --braun:#4A3728; --weiss:#ffffff; --linie:#eadfd6; --soft:#f4e9e6;
 --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
 --body:"Jost","Helvetica Neue",Arial,sans-serif;
 --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--creme);color:var(--braun);font:17px/1.6 var(--body)}
img{max-width:100%;display:block}
a{color:var(--rose-d)}
.wrap{max-width:var(--max);margin:0 auto;padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.15;text-wrap:balance;margin:0}
h1{font-size:clamp(2.4rem,7vw,3.8rem)}
h1 em,h2 em{font-style:italic;color:var(--rose);font-weight:500}
h2{font-size:clamp(1.9rem,5vw,2.6rem)}
h3{font-size:1.45rem}
.eyebrow{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--taupe);margin:0 0 10px}
section{padding-block:56px}
.lead{font-size:1.1rem;max-width:56ch}
.btn{display:inline-block;background:var(--rose);color:#fff;text-decoration:none;font-weight:500;padding:14px 26px;border-radius:999px}
.btn:hover{background:var(--rose-d)}
.btn-ghost{background:transparent;color:var(--rose-d);border:1.5px solid var(--rose);padding:12.5px 24px}
.btn-ghost:hover{background:var(--soft)}
:focus-visible{outline:2px solid var(--rose-d);outline-offset:3px}

/* Kopfzeile */
header{background:var(--creme);border-bottom:1px solid var(--linie);position:sticky;top:0;z-index:20}
.head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px}
.logo{display:block;line-height:0}.logo img{height:52px;width:auto}@media(min-width:960px){.logo img{height:62px}}
.logo small{display:block;font-size:.95rem;font-style:italic;font-weight:500;color:var(--rose)}
/* TODO: Original-Logo von Wix als SVG/PNG einsetzen */
nav ul{list-style:none;margin:0;padding:0}
.menu{display:none}
.menu-btn{background:none;border:1px solid var(--linie);border-radius:8px;padding:8px 12px;font:500 15px var(--body);color:var(--braun)}
.mobile{display:none;background:var(--weiss);border-bottom:1px solid var(--linie)}
.mobile.open{display:block}
.mobile .wrap{padding-block:8px 18px}
.mobile details{border-bottom:1px solid var(--linie)}
.mobile summary,.mobile>.wrap>a{display:block;padding:14px 0;font-weight:500;color:var(--braun);text-decoration:none;cursor:pointer}
.mobile details a{display:block;padding:8px 0 8px 14px;color:var(--braun);text-decoration:none}
.mobile .btn{margin-top:14px;text-align:center;display:block}
@media(min-width:960px){
 .menu-btn,.mobile{display:none!important}
 .menu{display:flex;gap:26px;align-items:center}
 .menu>li{position:relative}
 .menu>li>a{color:var(--braun);text-decoration:none;font-weight:500;padding-block:10px;display:block}
 .menu .sub{position:absolute;top:100%;left:-16px;background:var(--weiss);border:1px solid var(--linie);border-radius:8px;padding:8px 0;min-width:250px;display:none;box-shadow:0 12px 30px rgba(74,55,40,.08)}
 .menu li:hover .sub,.menu li:focus-within .sub{display:block}
 .sub a{display:block;padding:8px 16px;color:var(--braun);text-decoration:none}
 .sub a:hover{background:var(--soft)}
}

/* Hero */
.hero{padding-block:36px 56px}
.hero-grid{display:grid;gap:28px}
.hero .sub-h{font-family:var(--display);font-size:1.25rem;color:var(--taupe);margin:0 0 6px}
.hero p.lead{margin:18px 0 26px}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero figure{margin:0;border-radius:6px;overflow:hidden;aspect-ratio:4/3;background:var(--soft)}
.hero figure img{width:100%;height:100%;object-fit:cover}
.rating{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:.95rem;color:var(--taupe)}
.rating b{color:var(--braun);font-size:1.05rem}
.stars{color:#e0a43a;letter-spacing:2px}
@media(min-width:860px){.hero-grid{grid-template-columns:1fr 1.15fr;align-items:center}}

/* Zwei Türen */
.doors{background:var(--weiss)}
.door-grid{display:grid;gap:18px;margin-top:28px}
.door{border:1px solid var(--linie);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;background:var(--creme)}
.door img{aspect-ratio:16/10;object-fit:cover;width:100%}
.door .in{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.door .in p{margin:0}
.door .in .btn{align-self:flex-start;margin-top:auto}
@media(min-width:760px){.door-grid{grid-template-columns:1fr 1fr}}

/* Lebensphasen */
.phases{background:var(--soft)}
.phase-head{text-align:center;max-width:640px;margin:0 auto 30px}
.phase-head p{margin:10px 0 0}
.phase-list{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.phase{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;background:var(--weiss);border-radius:6px;padding:18px 20px;text-decoration:none;color:var(--braun);border:1px solid transparent}
.phase:hover{border-color:var(--rose)}
.phase .n{width:42px;height:42px;border-radius:50%;background:var(--rose);color:#fff;display:grid;place-items:center;font-family:var(--display);font-size:1.4rem;font-weight:600}
.phase h3{margin-bottom:2px}
.phase p{margin:0;font-size:.97rem}
.phase .go{color:var(--rose-d);font-weight:500;font-size:.92rem}
.phase-note{text-align:center;font-family:var(--display);font-style:italic;font-size:1.35rem;color:var(--rose-d);margin:28px 0 0}
@media(min-width:760px){.phase-list{grid-template-columns:1fr 1fr}}

/* Drei Säulen */
.pillars{display:grid;gap:14px;margin-top:26px}
.pillar{border-top:2px solid var(--rose);padding-top:14px}
.pillar p{margin:6px 0 0}
@media(min-width:760px){.pillars{grid-template-columns:repeat(3,1fr);gap:28px}}

/* Unter die Haut */
.udh{background:var(--braun);color:var(--creme)}
.udh .eyebrow{color:#d9c3b6}
.udh h2 em{color:#e7b3b9}
.udh-grid{display:grid;gap:28px;align-items:center}
.udh figure{margin:0;border-radius:6px;overflow:hidden;aspect-ratio:4/3}
.udh figure img{width:100%;height:100%;object-fit:cover}
.udh p{max-width:54ch}
.udh .btn{background:var(--rose)}
@media(min-width:860px){.udh-grid{grid-template-columns:1.1fr 1fr}}

/* Video-Platz */
.video-slot{margin:0;border-radius:6px;overflow:hidden;aspect-ratio:16/9;background:var(--soft);position:relative}
.video-slot img{width:100%;height:100%;object-fit:cover}
.video-slot figcaption{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,.9);padding:4px 10px;border-radius:999px;font-size:.8rem}

/* Team */
.team-grid{display:grid;gap:26px;align-items:center}
@media(min-width:860px){.team-grid{grid-template-columns:1fr 1fr}}

/* Abgrenzung */
.diff{background:var(--weiss)}
.diff-list{display:grid;gap:12px;margin:24px 0 0;padding:0;list-style:none}
.diff-list li{background:var(--creme);border-radius:6px;padding:16px 18px}
.diff-list b{display:block;font-family:var(--display);font-size:1.25rem}
.diff-list .us{background:var(--soft);border:1px solid var(--rose)}
@media(min-width:760px){.diff-list{grid-template-columns:repeat(3,1fr)}}

/* FAQ – immer offen */
.faq-list{display:grid;gap:22px;margin-top:24px;max-width:780px}
.faq-list h3{font-size:1.3rem}
.faq-list p{margin:6px 0 0}

/* Standorte */
.loc-grid{display:grid;gap:18px;margin-top:24px}
.loc{background:var(--weiss);border:1px solid var(--linie);border-radius:6px;padding:22px}
.loc h3{margin-bottom:6px}
.loc p{margin:0 0 4px}
.loc .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
@media(min-width:760px){.loc-grid{grid-template-columns:1fr 1fr}}

footer{background:var(--braun);color:#e9ddd4;padding-block:36px 110px;font-size:.92rem}
footer a{color:#f1e4dc}
.foot{display:flex;flex-wrap:wrap;gap:12px 26px}


/* Entwurf 2: Zwei-Ebenen-Überschriften (H = SEO, .display = Gefühl) */
.h-seo{font-family:var(--body);font-size:.95rem;font-weight:500;letter-spacing:.02em;color:var(--taupe);margin:0 0 8px;line-height:1.4}
.display{font-family:var(--display);font-weight:600;font-size:clamp(2.6rem,8vw,4.2rem);line-height:1.05;margin:0}
.display em{font-style:italic;color:var(--rose);font-weight:500}
.display.m{font-size:clamp(2rem,6vw,2.9rem)}
.claim{font-family:var(--display);font-size:1.35rem;line-height:1.45;margin:18px 0 0;max-width:30ch}
.rosa{background:var(--rose);color:#fff;text-align:center}
.rosa .h-seo{color:#f7e3e5}
.rosa .display em{color:#fff}
.rosa p.lead{margin:14px auto 0;color:#fff}
.treat{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:10px}
.treat a{display:flex;justify-content:space-between;gap:12px;align-items:center;background:var(--weiss);border:1px solid var(--linie);border-radius:6px;padding:16px 18px;text-decoration:none;color:var(--braun)}
.treat a:hover{border-color:var(--rose)}
.treat b{font-family:var(--display);font-size:1.3rem;font-weight:600;display:block}
.treat span.s{font-size:.95rem;color:var(--taupe)}
.treat .arr{color:var(--rose-d);font-size:1.3rem}
@media(min-width:760px){.treat{grid-template-columns:1fr 1fr}}


/* Slider: Desktop nach dem Inhalt, mobil davor */
.with-gal{display:flex;flex-direction:column}
.slider{order:-1;margin:0 0 28px;position:relative}
.track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;border-radius:6px;scrollbar-width:none}
.track::-webkit-scrollbar{display:none}
.sl{margin:0;flex:0 0 100%;min-width:0;scroll-snap-align:start;position:relative;background:var(--braun)}
.sl img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.sl figcaption{background:var(--weiss);padding:16px 18px 18px;border:1px solid var(--linie);border-top:0;border-radius:0 0 6px 6px}
.sl figcaption b{display:block;font-family:var(--display);font-size:1.45rem;font-weight:600}
.sl figcaption span{display:block;margin-top:2px}
.sl figcaption a{display:inline-block;margin-top:8px;font-weight:500;text-decoration:none}
.sl-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:12px}
.sl-nav button{width:40px;height:40px;border-radius:50%;border:1px solid var(--linie);background:var(--weiss);color:var(--braun);font-size:1.1rem;cursor:pointer}
.dots{display:flex;gap:8px}
.dots i{width:8px;height:8px;border-radius:50%;background:var(--linie);display:block}
.dots i.on{background:var(--rose)}
@media(min-width:860px){
 .slider{order:1;margin:40px 0 0}
 .sl{display:grid;grid-template-columns:1.4fr 1fr}
 .sl img{aspect-ratio:16/10;height:100%;min-height:420px}
 .sl figcaption{border:0;border-radius:0;background:var(--braun);color:var(--creme);display:flex;flex-direction:column;justify-content:center;padding:36px}
 .sl figcaption b{font-size:2rem}
 .sl figcaption a{color:#e7b3b9}
}


/* Mobil: Behandlungen nur als Slider (Liste ausgeblendet), Überschrift zuerst */
@media(max-width:859px){
 #behandlungen .treat{display:none}
 #behandlungen .slider{order:2;margin:20px 0 0}
 #behandlungen .all-b{order:3}
}

/* WhatsApp fix am Handy */
.wa-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--weiss);border-top:1px solid var(--linie);display:flex;gap:10px;padding:10px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}
.wa-bar a{flex:1;text-align:center;text-decoration:none;font-weight:500;border-radius:999px;padding:12px 8px;font-size:.95rem}
.wa-bar .wa{background:var(--braun);color:var(--creme)}
.wa-bar .bk{background:var(--rose);color:#fff}
@media(min-width:960px){.wa-bar{left:auto;right:24px;bottom:24px;border:1px solid var(--linie);border-radius:999px;box-shadow:0 10px 30px rgba(74,55,40,.12)} .wa-bar a{flex:none;padding:12px 20px}}

/* Cookie-Hinweis */
.consent{position:fixed;left:12px;right:12px;bottom:84px;z-index:40;background:var(--weiss);border:1px solid var(--linie);border-radius:10px;padding:16px;box-shadow:0 10px 30px rgba(74,55,40,.15);max-width:520px}
.consent p{margin:0 0 12px;font-size:.92rem}
.consent .row{display:flex;gap:10px;flex-wrap:wrap}
.consent button{font:500 15px var(--body);border-radius:999px;padding:10px 18px;cursor:pointer;border:1.5px solid var(--rose)}
#consent-yes{background:var(--rose);color:#fff}
#consent-no{background:transparent;color:var(--rose-d)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ===== Behandlungsseite (Typ A) ===== */
.t-hero{padding-block:30px 50px}
.t-hero .grid{display:grid;gap:26px;align-items:center}
.t-hero .price-hint{font-size:.95rem;color:var(--taupe);margin:12px 0 0}
.t-hero figure{margin:0;border-radius:6px;overflow:hidden;aspect-ratio:4/3;background:var(--soft)}
.t-hero figure img{width:100%;height:100%;object-fit:cover}
@media(min-width:860px){.t-hero .grid{grid-template-columns:1fr 1.1fr;gap:48px}}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

.video-box{margin:0;position:relative;border-radius:6px;overflow:hidden;aspect-ratio:16/9;background:var(--braun)}
.video-box img{width:100%;height:100%;object-fit:cover;opacity:.75}
.video-box .play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff;text-align:center;padding:16px}
.video-box .play span{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--rose-d);font-size:1.5rem;padding-left:4px}
.video-box figcaption{font-weight:500;text-shadow:0 1px 6px rgba(0,0,0,.4)}

.chips{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.chips li{background:var(--weiss);border:1px solid var(--linie);border-radius:999px;padding:8px 14px;font-size:.95rem}
.note{margin-top:16px;font-size:.95rem;color:var(--taupe)}

.flow{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px;counter-reset:f}
.flow li{background:var(--weiss);border-radius:6px;padding:20px;position:relative}
.flow li::before{counter-increment:f;content:counter(f);font-family:var(--display);font-size:2.2rem;line-height:1;color:var(--rose);display:block;margin-bottom:6px}
.flow h3{margin-bottom:4px}
.flow p{margin:0}
@media(min-width:760px){.flow{grid-template-columns:repeat(3,1fr)}}

.prices{width:100%;border-collapse:collapse;margin-top:20px;font-variant-numeric:tabular-nums;max-width:720px}
.prices td{padding:14px 0;border-bottom:1px solid var(--linie);vertical-align:top}
.prices td:last-child{text-align:right;white-space:nowrap;font-family:var(--display);font-size:1.35rem;font-weight:600;padding-left:16px}
.prices small{display:block;color:var(--taupe);font-size:.88rem}
.prices tr.hl td{color:var(--rose-d)}

.why{display:grid;gap:18px;margin-top:22px}
.why div{border-top:2px solid var(--rose);padding-top:12px}
.why p{margin:4px 0 0}
@media(min-width:760px){.why{grid-template-columns:repeat(3,1fr);gap:28px}}

.voices{display:grid;gap:14px;margin-top:22px}
.voices figure{margin:0;background:var(--weiss);border-radius:6px;padding:20px}
.voices blockquote{margin:0;font-family:var(--display);font-style:italic;font-size:1.3rem;line-height:1.35}
.voices figcaption{margin-top:8px;color:var(--taupe);font-size:.9rem}
.voices .todo{border:1px dashed var(--rose);background:transparent}
@media(min-width:760px){.voices{grid-template-columns:repeat(3,1fr)}}

.end-cta{background:var(--rose);color:#fff;text-align:center}
.end-cta .display em{color:#fff}
.end-cta p{margin:12px auto 0;max-width:46ch}
.end-cta .ctas{justify-content:center}
.end-cta .btn{background:var(--braun)}
.end-cta .btn-ghost{background:transparent;border-color:#fff;color:#fff}
.split-in{display:grid;gap:26px;align-items:center}
.side-img{margin:0;border-radius:6px;overflow:hidden;aspect-ratio:9/10;max-height:520px}
.side-img img{width:100%;height:100%;object-fit:cover}
@media(min-width:860px){.split-in{grid-template-columns:.9fr 1.1fr;gap:48px}}
.flow li{padding:0 0 20px;overflow:hidden}
.flow li img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:14px}
.flow li::before,.flow h3,.flow p{margin-inline:20px}
.team-row{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.team-row img{width:100%;aspect-ratio:5/6;object-fit:cover;border-radius:6px}
.team-row b{display:block;font-family:var(--display);font-size:1.2rem;margin-top:8px}
.team-row span{font-size:.85rem;color:var(--taupe)}
@media(min-width:860px){.team-row{max-width:760px;gap:20px}}
.flow li{display:flex;flex-direction:column}
.flow li img{order:-1}
.split-in .why{grid-template-columns:1fr;gap:16px}
.side-img.device{background:#fff}.side-img.device img{object-fit:contain}
.pains{background:var(--soft);padding-block:40px}
.pains .h-seo{text-align:center}
.pains ul{list-style:none;margin:10px auto 0;padding:0;display:grid;gap:10px;max-width:880px}
.pains li{font-family:var(--display);font-style:italic;font-size:clamp(1.35rem,4vw,1.7rem);line-height:1.3;text-align:center;color:var(--braun)}
.pains li::before{content:"„";color:var(--rose)}
.pains li::after{content:"“";color:var(--rose)}
@media(min-width:860px){.pains ul{grid-template-columns:repeat(3,1fr);gap:24px}}
/* Painpoints mobil als wischbare Karten */
@media(max-width:859px){
 .pains ul{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;max-width:none;margin:14px calc(-1*max(18px,env(safe-area-inset-left))) 0;padding:4px max(18px,env(safe-area-inset-left)) 10px;scrollbar-width:none}
 .pains ul::-webkit-scrollbar{display:none}
 .pains li{flex:0 0 82%;scroll-snap-align:center;background:var(--weiss);border-radius:6px;padding:28px 20px;display:flex;align-items:center;justify-content:center;min-height:140px}
 .pains .swipe{display:block;text-align:center;font-size:.85rem;color:var(--taupe);margin-top:6px}
}
.pains .swipe{display:none}
@media(max-width:859px){.pains li{display:block;padding:40px 22px;min-height:0}}
/* YouTube-Short (Hochformat), Klick-zum-Laden */
.vid-row{display:grid;gap:22px;align-items:center}
.yt{position:relative;width:100%;max-width:340px;margin:0 auto;aspect-ratio:9/16;border-radius:10px;overflow:hidden;background:var(--braun)}
.yt img,.yt iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.yt-play{position:absolute;inset:0;margin:auto;width:72px;height:72px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--rose-d);font-size:1.6rem;cursor:pointer;padding-left:5px}
.yt-play:hover{background:#fff}
@media(min-width:860px){.vid-row{grid-template-columns:340px 1fr;gap:56px}.yt{margin:0}}
/* ===== Anliegen-Kacheln + Panels (Übersichtsseite) ===== */
.anliegen{background:var(--soft)}
.a-tiles{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}
.a-tile{font:italic 500 clamp(1.25rem,2.4vw,1.55rem)/1.3 var(--display);color:var(--braun);background:var(--weiss);border:1.5px solid transparent;border-radius:8px;padding:26px 22px;text-align:left;cursor:pointer;min-height:120px}
.a-tile:hover{border-color:var(--linie)}
.a-tile[aria-selected="true"]{border-color:var(--rose);background:var(--rose);color:#fff}
.anliegen .swipe{display:none}
.a-panel{margin-top:22px;display:grid;gap:12px}
.js .a-panel[hidden]{display:none}
.tr{background:var(--weiss);border-radius:8px;padding:20px;display:grid;gap:14px}
.tr h3{margin-bottom:4px}
.tr p{margin:0}
.tr-buy{display:flex;flex-direction:column;gap:10px}
.tr-buy b{font-family:var(--display);font-size:1.3rem;font-variant-numeric:tabular-nums}
.tr-buy small{font-size:.9rem;font-family:var(--body);font-weight:400;color:var(--taupe)}
.tr-buy span{display:flex;flex-wrap:wrap;gap:8px}
.btn-sm{padding:9px 16px;font-size:.92rem}
.btn-ghost.btn-sm{padding:7.5px 14.5px}
@media(min-width:760px){.tr{grid-template-columns:1fr auto;align-items:center;gap:28px}.tr-buy{align-items:flex-end;text-align:right}}
@media(max-width:759px){
 .a-tiles{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1*max(18px,env(safe-area-inset-left)));padding:4px max(18px,env(safe-area-inset-left)) 8px;scrollbar-width:none}
 .a-tiles::-webkit-scrollbar{display:none}
 .a-tile{flex:0 0 78%;scroll-snap-align:center;text-align:center}
 .anliegen .swipe{display:block;text-align:center;font-size:.85rem;color:var(--taupe);margin:6px 0 0}
}
.haltung{background:var(--rose);color:#fff;text-align:center}
.haltung .h-seo{color:#f7e3e5}
.haltung .display em{color:#fff}
.haltung p{max-width:56ch;margin:14px auto 0;font-size:1.08rem}
.haltung .btn{background:var(--braun);margin-top:24px}
.k-slider .slider{order:0;margin:0}