/* Energy-Coach: die geteilte Bühne. Links liest man, rechts bleibt der Weg im Nebel stehen. */
@font-face{font-family:"Clash Grotesk";font-weight:400;src:url(/assets/fonts/clash-grotesk-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Clash Grotesk";font-weight:500;src:url(/assets/fonts/clash-grotesk-500.woff2) format("woff2");font-display:swap}

:root{
  --bg:#0f1f10;--surface:#162a17;--ink:#fff;--soft:#c3cbc2;
  --accent:#c6f19d;--accent-ink:#0f1f10;--paper:#e9eee4;
  --t-s:clamp(.8125rem,.79rem + .1vw,.875rem);
  --t-b:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --t-l:clamp(1.25rem,1.1rem + .7vw,1.625rem);
  --t-h:clamp(1.75rem,1.25rem + 1.5vw,2.75rem);
  --t-d:clamp(2.25rem,1.2rem + 2.9vw,4rem);
  --gap:12px;--pad:clamp(24px,4.5vw,72px);--edge:calc(var(--gap) + var(--pad));
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--t-b)/1.5 "Clash Grotesk",system-ui,sans-serif;text-rendering:optimizeLegibility;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-weight:500;margin:0;letter-spacing:-.02em;text-wrap:balance}
h1{font-size:var(--t-h);line-height:1.02;letter-spacing:-.03em}
h2{font-size:var(--t-h);line-height:1.05}
h3{font-size:var(--t-l);line-height:1.15}
p,ul,ol{margin:0}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px;transition:color .2s,text-decoration-color .2s}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--accent-ink)}
.skip{position:absolute;left:-999px;top:8px;z-index:9;background:var(--accent);color:var(--accent-ink);padding:10px 16px}
.skip:focus{left:var(--edge)}

/* Knöpfe: flach, eckig, eine Farbe */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;background:var(--accent);color:var(--accent-ink);font:500 var(--t-b)/1 inherit;text-decoration:none;border:0;cursor:pointer;transition:transform .25s var(--ease),background .2s,color .2s}
.btn:hover{color:var(--accent-ink);background:#fff;transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn.sm{min-height:42px;padding:0 18px;font-size:var(--t-s)}
.more{font-weight:500;text-decoration:underline;text-decoration-color:var(--accent)}
.acts{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}

/* Die geteilte Bühne */
.split{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"bar stage" "read stage";grid-template-rows:auto 1fr;column-gap:var(--gap);padding:var(--gap)}
.bar{grid-area:bar;display:flex;align-items:center;gap:24px;padding:22px var(--pad);position:relative;z-index:5}
.brand{font:500 var(--t-l)/1 inherit;letter-spacing:-.03em;text-decoration:none;margin-right:auto;white-space:nowrap}
.nav{display:flex;gap:18px;font-size:var(--t-s);white-space:nowrap}
.nav a{text-decoration:none;padding:6px 0}
.nav a[aria-current]{text-decoration:underline;text-decoration-color:var(--accent)}
.menu{display:none}
.menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;min-height:42px;padding:0 18px;background:var(--surface);font-weight:500;font-size:var(--t-s)}
.menu summary::-webkit-details-marker{display:none}
.menu[open] summary{background:var(--accent);color:var(--accent-ink)}
.menu:not([open]) nav{display:none}
.menu nav{position:absolute;left:var(--pad);right:var(--pad);top:76px;display:flex;flex-direction:column;padding:16px 24px;background:var(--paper);color:var(--accent-ink);box-shadow:0 18px 40px rgb(0 0 0 / .35)} /* taste-skill-ignore: offenes Menü schwebt */
.menu nav a{padding:10px 0;font-size:var(--t-l);text-decoration:none}

.stage{grid-area:stage;position:sticky;top:var(--gap);height:calc(100svh - 2 * var(--gap));align-self:start;overflow:hidden;background:var(--surface)}
.stage-i,.stage-i img{position:absolute;inset:0}
.stage-i img{width:100%;height:100%;object-fit:cover}
.stage.fade .stage-i img{opacity:0;animation:xf 21s linear infinite}
.stage.fade .stage-i img:first-child{opacity:1;animation-delay:-1.7s}
.stage.fade .stage-i img:nth-child(2){animation-delay:5.3s}
.stage.fade .stage-i img:nth-child(3){animation-delay:12.3s}
@keyframes xf{0%{opacity:0;transform:scale(1.06)}8%{opacity:1}33%{opacity:1}41%{opacity:0}100%{opacity:0;transform:scale(1)}}
.stage-bar{position:absolute;left:0;right:0;bottom:0;min-height:56px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:0 20px;background:var(--paper);color:var(--accent-ink);font-size:var(--t-s);font-weight:500}

.read{grid-area:read;padding:0 var(--pad) 120px;min-width:0}
.read>*+*{margin-top:clamp(96px,10vw,160px)}

/* Erster Bildschirm */
.hero{min-height:calc(100svh - 2 * var(--gap) - 92px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:28px;margin-inline:calc(-1 * var(--pad));padding:56px var(--pad) 12vh;background:var(--accent);color:var(--accent-ink)}
.hero .btn{background:var(--accent-ink);color:var(--accent)}
.hero .btn:hover{background:#000;color:var(--accent)}
.hero a:not(.btn):hover{color:var(--accent-ink)}
.hero .more{text-decoration-color:var(--accent-ink)}
.hero :focus-visible{outline-color:var(--accent-ink)}
.hero h1{font-size:var(--t-d);line-height:.98;max-width:13ch}
.hero p:not(.acts){font-size:var(--t-l);line-height:1.35;max-width:36ch}
.hero .acts{justify-content:center}

.intro{max-width:340px}
.intro h2{font-size:var(--t-l);margin-bottom:24px}
.intro p+p{margin-top:1em;color:var(--soft)}
.intro p:first-of-type{font-weight:500}

/* Kompass: das Lebendige */
.kompass>h2{margin-bottom:16px}
.kompass>p{max-width:46ch;color:var(--soft)}
.k-in{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none} /* taste-skill-ignore: unsichtbares Radio */
.k-g{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px;align-items:center;margin-top:36px}
.k-opts{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.k-opts legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.k-l{display:block;padding:14px 18px;background:var(--surface);cursor:pointer;transition:background .25s,color .25s,transform .25s var(--ease)}
.k-l:hover{transform:translateX(6px)}
.k-dial{width:260px;height:260px;position:relative}
.k-face{position:absolute;inset:34px;border-radius:50%;background:var(--surface)}
.k-m{position:absolute;left:50%;top:50%;font-size:var(--t-s);font-weight:500;white-space:nowrap;color:var(--soft);transition:color .3s}
.m0{transform:translate(-50%,-50%) rotate(0deg) translateY(-112px) rotate(0deg)}
.m1{transform:translate(-50%,-50%) rotate(72deg) translateY(-112px) rotate(-72deg)}
.m2{transform:translate(-50%,-50%) rotate(144deg) translateY(-112px) rotate(-144deg)}
.m3{transform:translate(-50%,-50%) rotate(216deg) translateY(-112px) rotate(-216deg)}
.m4{transform:translate(-50%,-50%) rotate(288deg) translateY(-112px) rotate(-288deg)}
.k-n{position:absolute;left:calc(50% - 9px);top:calc(50% - 74px);width:18px;height:74px;background:var(--accent);clip-path:polygon(50% 0,100% 100%,0 100%);transform-origin:50% 100%;transition:transform .9s var(--ease)}
.k-hub{position:absolute;left:calc(50% - 10px);top:calc(50% - 10px);width:20px;height:20px;border-radius:50%;background:var(--paper)}
.k-r{display:none;margin-top:32px;padding:28px;background:var(--paper);color:var(--accent-ink)}
.k-r h3{margin-bottom:10px}
.k-go{margin-top:28px}
.kompass:has(#k0:checked) label[for=k0],.kompass:has(#k1:checked) label[for=k1],.kompass:has(#k2:checked) label[for=k2],.kompass:has(#k3:checked) label[for=k3],.kompass:has(#k4:checked) label[for=k4]{background:var(--accent);color:var(--accent-ink);transform:none}
.kompass:has(#k0:focus-visible) label[for=k0],.kompass:has(#k1:focus-visible) label[for=k1],.kompass:has(#k2:focus-visible) label[for=k2],.kompass:has(#k3:focus-visible) label[for=k3],.kompass:has(#k4:focus-visible) label[for=k4]{outline:2px solid var(--accent);outline-offset:3px}
.kompass:has(#k0:checked) .r0,.kompass:has(#k1:checked) .r1,.kompass:has(#k2:checked) .r2,.kompass:has(#k3:checked) .r3,.kompass:has(#k4:checked) .r4{display:block;animation:pop .5s var(--ease)}
.kompass:has(#k0:checked) .m0,.kompass:has(#k1:checked) .m1,.kompass:has(#k2:checked) .m2,.kompass:has(#k3:checked) .m3,.kompass:has(#k4:checked) .m4{color:var(--accent)}
.kompass:has(#k1:checked) .k-n{transform:rotate(72deg)}
.kompass:has(#k2:checked) .k-n{transform:rotate(144deg)}
.kompass:has(#k3:checked) .k-n{transform:rotate(216deg)}
.kompass:has(#k4:checked) .k-n{transform:rotate(288deg)}
@keyframes pop{from{opacity:0;transform:translateY(12px)}}

/* Der Weg als Zettel */
.route-t{max-width:30ch}
.route-t h2{margin-bottom:16px}
.route-t p{color:var(--soft)}
.slip{margin-top:36px;max-width:480px;background:var(--paper);color:var(--accent-ink);padding:28px 28px 46px;font-variant-numeric:tabular-nums;clip-path:polygon(0 0,100% 0,100.00% calc(100% - 10px),95.45% 100%,90.91% calc(100% - 10px),86.36% 100%,81.82% calc(100% - 10px),77.27% 100%,72.73% calc(100% - 10px),68.18% 100%,63.64% calc(100% - 10px),59.09% 100%,54.55% calc(100% - 10px),50.00% 100%,45.45% calc(100% - 10px),40.91% 100%,36.36% calc(100% - 10px),31.82% 100%,27.27% calc(100% - 10px),22.73% 100%,18.18% calc(100% - 10px),13.64% 100%,9.09% calc(100% - 10px),4.55% 100%,0.00% calc(100% - 10px))}
.slip h3{font-size:var(--t-b);font-weight:500;letter-spacing:0;margin-top:28px}
.slip h3:first-child{margin-top:0}
.slip ul{list-style:none;padding:0;margin-top:8px}
.slip li{display:flex;align-items:baseline;gap:10px;padding:4px 0}
.slip li span:first-child{flex:0 1 auto}
.slip li i{flex:1;min-width:24px;border-bottom:3px dotted currentColor;opacity:.5;transform:translateY(-4px)}
.slip li span:last-child{white-space:nowrap}
.slip-end{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:44px;margin:28px -28px 0;padding:8px 28px;background:var(--accent-ink);color:var(--paper);font-weight:500}

/* Brief */
.letter{max-width:520px}
.letter-p{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 12%;background:var(--paper);margin-bottom:24px}
.letter h2{margin-bottom:24px}
.letter p+p{margin-top:1em}
.letter .sig{font-size:var(--t-l);font-weight:500;margin-top:28px}
.letter .sig span{display:block;font-size:var(--t-s);font-weight:400;color:var(--soft)}

/* Unterseiten */
.phead{padding:clamp(48px,10vh,120px) 0 0;display:flex;flex-direction:column;gap:24px}
.phead h1{max-width:20ch}
.lead{font-size:var(--t-l);line-height:1.35;max-width:36ch}
.meta{font-size:var(--t-s);color:var(--soft)}
.prose{max-width:62ch}
.prose>*+*{margin-top:1em}
.prose h2{font-size:var(--t-l);margin-top:2.2em;line-height:1.2}
.prose h2:first-child{margin-top:0}
.prose ul,.prose ol{padding-left:1.2em}
.prose li+li{margin-top:.45em}
.prose li::marker{color:var(--accent)}
.prose blockquote{margin:1.6em 0;padding:24px 28px;background:var(--surface);font-size:var(--t-l);line-height:1.3}
.prose a{text-decoration-color:var(--accent)}
.read>.prose{margin-top:64px}
.read>.prose+.prose{margin-top:56px}
.read>.route{margin-top:120px}
.offers{display:flex;flex-direction:column;gap:12px}
.offer{padding:28px;background:var(--surface);display:flex;flex-direction:column;gap:12px;transition:background .25s}
.offer:hover{background:#1d361e}
.offer h2{font-size:var(--t-l)}
.offer h2 a{text-decoration:none}
.rel h2{font-size:var(--t-l);margin-bottom:16px}
.rel ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.rel li{padding:20px 24px;background:var(--surface)}
.rel li a{font-weight:500;font-size:var(--t-l)}
.rel li span{display:block;color:var(--soft);margin-top:6px}
.note{padding:20px 24px;background:var(--surface);color:var(--soft);max-width:62ch}
.case h2{font-size:var(--t-l);margin-bottom:16px}
.case p{margin-top:1em;max-width:62ch}
.case .more{display:inline-block;margin-top:20px}
.facts{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.facts li{padding:6px 12px;background:var(--surface);font-size:var(--t-s)}
.qgroup h2{font-size:var(--t-l);margin-bottom:20px}
.qgroup .qa+.qa{margin-top:20px}
.read>.qgroup{margin-top:72px}

/* Was du bekommst: Überschrift bleibt stehen */
.pinned{background:var(--accent);color:var(--accent-ink);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding:clamp(96px,11vw,180px) var(--edge);margin-top:clamp(120px,12vw,200px)}
.pinned-h{grid-column:1/5;align-self:start;display:flex;flex-direction:column;gap:24px}
.pinned h2{font-size:var(--t-d);line-height:.98}
.pinned .btn{background:var(--accent-ink);color:var(--accent);align-self:flex-start}
.pinned .btn:hover{background:#000;color:var(--accent)}
.pinned-h p{max-width:30ch;font-size:var(--t-l);line-height:1.3}
.pinned-l{grid-column:6/13;display:grid;grid-template-columns:1fr 1fr;gap:64px 32px}
.feat h3{margin-bottom:20px}
.feat-r{display:flex;flex-direction:column;gap:20px}
.feat-r img{width:100%;aspect-ratio:4/3;object-fit:cover}
.feat-r ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;font-size:var(--t-b)}
.feat.flip{margin-top:72px}

/* Zwei Angebote, zwei Felder */
.plans{display:grid;grid-template-columns:5fr 7fr}
.plan{min-height:min(72svh,720px);padding:40px var(--pad) 48px;display:flex;flex-direction:column;gap:20px}
.plan:first-child{padding-left:var(--edge)}
.plan:last-child{padding-right:var(--edge)}
.plan-a{background:#fff;color:var(--accent-ink)}
.plan-b{background:#000;color:#fff}
.plan h2{font-size:var(--t-d);line-height:.98}
.plan>p:not(.plan-in){font-size:var(--t-l);line-height:1.3;max-width:26ch}
.plan-in{max-width:42ch}
.plan-f{margin-top:auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px}
.plan-p{font-size:var(--t-h);font-weight:500;letter-spacing:-.02em;line-height:1}
.plan-a .btn{background:var(--accent-ink);color:var(--accent)}
.plan-a .btn:hover{background:var(--accent);color:var(--accent-ink)}
.plans-note{padding:28px var(--edge) 0;color:var(--soft);max-width:calc(62ch + 2 * var(--edge))}
.plans-note a{color:var(--ink)}

/* Brücke zum Berg */
.bridge{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:center;margin:clamp(120px,12vw,200px) var(--gap) 0;padding:clamp(72px,8vw,120px) var(--pad);background:var(--surface)}
.bridge-p{grid-column:1/7}
.bridge-p img{width:100%;aspect-ratio:3/2;object-fit:cover}
.bridge-t{grid-column:8/13;display:flex;flex-direction:column;gap:20px}
.bridge-t p:not(.acts){max-width:46ch}

/* Notizen */
.notes-s{padding:0 var(--edge);margin-top:clamp(120px,12vw,200px)}
.notes-s h2{margin-bottom:36px}
.notes{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.notes a{display:grid;grid-template-columns:clamp(120px,16vw,240px) minmax(0,1fr);gap:28px;align-items:center;padding:12px;background:var(--surface);text-decoration:none;transition:background .25s}
.notes a:hover{background:#1d361e;color:var(--ink)}
.notes img{width:100%;aspect-ratio:3/2;object-fit:cover}
.notes h3{margin-bottom:8px}
.notes p{color:var(--soft);max-width:60ch}
.read .notes a{grid-template-columns:180px minmax(0,1fr);gap:24px}
.read .notes h3{font-size:var(--t-b)}
.faq-more{margin-top:28px}
.faq-more a{font-weight:500;text-decoration-color:var(--accent)}

/* Fragen als Lesetext */
.faq{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding:0 var(--edge);margin-top:clamp(120px,12vw,200px)}
.faq h2{grid-column:1/4;font-size:var(--t-l);line-height:1.15}
.faq-c{grid-column:5/13;columns:2;column-gap:56px}
.faq .faq-more{grid-column:5/13}
.qa{break-inside:avoid;margin-bottom:20px;color:var(--soft)}
.qa strong{font-weight:500;color:var(--ink)}
.qa a{color:var(--ink);text-decoration-color:var(--accent)}

/* Kontakt */
.contact{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:40px;padding:0 var(--edge);margin:clamp(120px,12vw,200px) 0}
.contact-t{grid-column:1/6;display:flex;flex-direction:column;gap:20px}
.contact-t ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:6px;font-weight:500}
.form{grid-column:7/13;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.f{display:flex;flex-direction:column;gap:8px;font-weight:500}
.f.full{grid-column:1/-1}
.f input,.f select,.f textarea{font:inherit;font-size:var(--t-b);font-weight:400;color:var(--ink);background:var(--surface);border:1px solid #2e4630;border-radius:0;padding:14px 16px;min-height:52px;width:100%}
.f textarea{min-height:140px;resize:vertical}
.f select{appearance:none}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--accent);outline:none}
.form .btn{justify-self:start}
.form small{grid-column:1/-1;font-size:var(--t-s);color:var(--soft)}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Fusszeile: Foto und Menü */
.foot{display:grid;grid-template-columns:1fr 1fr;min-height:90svh;background:#000}
.foot-p img{width:100%;height:100%;object-fit:cover;object-position:40% 70%}
.foot-t{padding:64px var(--edge) 40px var(--pad);display:flex;flex-direction:column;gap:40px}
.foot-brand{font-size:var(--t-l);font-weight:500;text-decoration:none}
.foot-menu{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}
.foot-menu a{display:inline-block;font-size:var(--t-h);font-weight:500;letter-spacing:-.02em;line-height:1.05;text-decoration:none;transition:transform .3s var(--ease),color .2s}
.foot-menu:hover a{color:var(--soft)}
.foot-menu a:hover{transform:translateX(12px);color:var(--accent)}
.foot-c{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.foot-c h2{font-size:var(--t-b);margin-bottom:8px;letter-spacing:0}
.foot-c p{line-height:1.7}
.crumbs{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-size:var(--t-s);color:var(--soft)}
.crumbs li+li::before{content:"/";margin-right:6px}
.foot-end{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:var(--t-s);color:var(--soft)}
.credits{font-size:var(--t-s);color:var(--soft)}
.credits summary{cursor:pointer}
.credits ul{list-style:none;padding:0;margin-top:10px;display:flex;flex-direction:column;gap:4px}

/* Bewegung */
@media(prefers-reduced-motion:no-preference){
  @supports(animation-timeline:view()){
    .read>*,.prose>*,.offer,.rel li,.case,.qa,.feat,.feat-r img,.plan>*,.bridge-p,.bridge-t>*,.notes li,.contact-t>*,.form>*,.foot-menu li,.slip li,.faq h2,.notes-s h2{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 28%}
    .pinned h2{animation:none}
    .bridge-p img{animation:drift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  }
}
@keyframes rise{from{opacity:.3;transform:translateY(26px)}}
@keyframes drift{from{transform:scale(1.12) translateY(-3%)}to{transform:scale(1.02) translateY(3%)}}
.bridge-p{overflow:hidden}
.hero>*{animation:up .9s var(--ease) both}
.hero>*:nth-child(2){animation-delay:.08s}
.hero>*:nth-child(3){animation-delay:.16s}
@keyframes up{from{opacity:0;transform:translateY(22px)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .stage.fade .stage-i img{opacity:0}
  .stage.fade .stage-i img:first-child{opacity:1}
}

/* Tablet und Telefon */
@media(max-width:1320px){
  .nav{display:none}
  .menu{display:block}
}
@media(max-width:959px){
  .split{grid-template-columns:1fr;grid-template-areas:"bar" "stage" "read";grid-template-rows:auto;padding:0}
  .bar{padding:14px 20px;background:var(--bg)}
  .bar .act{display:none}
  .stage-bar{min-height:44px;padding:8px 20px}
  .menu nav{left:12px;right:12px;top:66px}
  .stage{position:sticky;top:0;height:56svh;z-index:0}
  .read{position:relative;z-index:1;background:var(--bg);padding:0 20px 96px}
  .read>*+*{margin-top:96px}
  .hero{min-height:0;padding:56px 20px 64px;gap:22px}
  .phead{padding-top:44px}
  :root{--edge:20px;--pad:20px}
  .k-g{grid-template-columns:1fr;justify-items:center}
  .k-opts{width:100%}
  .k-dial{order:-1}
  .pinned{display:block;padding:0 20px 96px}
  .pinned-h{position:static;padding:72px 0 40px}
  .pinned h2{font-size:9vw}
  .pinned-l{gap:72px}
  .pinned-l{display:flex;flex-direction:column}
  .feat.flip{margin-top:0}
  .plans{grid-template-columns:1fr}
  .plan-b{order:-1}
  .plan{min-height:70svh;padding:32px 20px!important}
  .plan-f .btn{width:100%}
  .bridge{display:flex;flex-direction:column;align-items:stretch;gap:32px;margin:96px 0 0;padding:0 0 64px}
  .bridge-t{padding:0 20px}
  .notes-s,.faq,.contact{margin-top:96px}
  .notes a,.read .notes a{grid-template-columns:96px minmax(0,1fr);gap:16px;padding:10px}
  .read .notes img{aspect-ratio:1}
  .faq{display:block}
  .faq h2{margin-bottom:24px}
  .faq-c{columns:1}
  .contact{display:flex;flex-direction:column;margin-bottom:96px}
  .form{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
  .foot-p{height:50svh}
  .foot-t{padding:48px 20px 32px}
  .foot-menu a{font-size:8vw}
  .foot-c{grid-template-columns:1fr}
  .slip{padding:22px 18px 40px}
  .slip-end{margin:24px -18px 0;padding:8px 18px}
}

/* Landingpage für den Instagram-Link: eine Frage, ein Ziel */
.lp{--w:min(1120px,100%)}
.lp-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px var(--edge);background:var(--accent);color:var(--accent-ink)}
.lp-bar a:hover{color:var(--accent-ink)}
.lp-hero{min-height:calc(100svh - 64px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:26px;padding:40px var(--edge) 12vh;background:var(--accent);color:var(--accent-ink)}
.lp-hero h1{font-size:clamp(2.6rem,1.4rem + 5vw,6rem);line-height:.95;letter-spacing:-.035em;max-width:13ch}
.lp-hero>p:not(.acts){font-size:var(--t-l);line-height:1.35;max-width:34ch}
.lp-hero .acts{justify-content:center}
.lp-hero .btn{background:var(--accent-ink);color:var(--accent);min-height:58px;padding:0 32px}
.lp-hero .btn:hover{background:#000;color:var(--accent)}
.lp-hero a:not(.btn):hover{color:var(--accent-ink)}
.lp-hero .more,.lp-bar .more{text-decoration-color:var(--accent-ink)}
.lp-hero :focus-visible,.lp-bar :focus-visible{outline-color:var(--accent-ink)}
.lp-face{width:84px;height:84px;border-radius:50%;object-fit:cover;object-position:50% 15%;box-shadow:0 0 0 3px var(--accent-ink)}
.lp-small{font-size:var(--t-s)!important;opacity:.75}
.lp-hooks{padding:clamp(88px,10vw,150px) var(--edge)}
.lp-k{color:var(--soft);margin-bottom:40px}
.lp-hooks ol{list-style:none;padding:0;margin:0;border-top:1px solid #2e4630}
.lp-hooks li{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:12px 48px;align-items:baseline;padding:28px 0;border-bottom:1px solid #2e4630}
.lp-hooks h2{font-size:var(--t-h);line-height:1.05}
.lp-hooks p{color:var(--soft);max-width:44ch}
.lp-why{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:center;margin:0 var(--gap);padding:clamp(64px,8vw,120px) var(--pad);background:var(--surface)}
.lp-p{width:100%;max-width:380px;aspect-ratio:4/5;object-fit:cover;object-position:50% 15%}
.lp-why h2{margin-bottom:24px}
.lp-why p+p{margin-top:1em}
.lp-why .sig{font-size:var(--t-l);font-weight:500;margin-top:28px}
.lp-why .sig span{display:block;font-size:var(--t-s);font-weight:400;color:var(--soft)}
.lp-steps{padding:clamp(88px,10vw,150px) var(--edge)}
.lp-steps h2{margin-bottom:40px}
.lp-steps ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;counter-reset:s}
.lp-steps li{counter-increment:s;padding:28px;background:var(--surface);display:flex;flex-direction:column;gap:12px}
.lp-steps li::before{content:counter(s);font-size:var(--t-d);font-weight:500;line-height:1;color:var(--accent)}
.lp-steps p{color:var(--soft)}
.lp-form{background:var(--accent);color:var(--accent-ink);padding:clamp(80px,9vw,140px) var(--edge)}
.lp-form h2{font-size:var(--t-d);line-height:.98;margin-bottom:36px}
.lp-form .form{max-width:820px}
.lp-form .f input,.lp-form .f textarea{background:#fff;color:var(--accent-ink);border-color:#9fc77c}
.lp-form .f input:focus,.lp-form .f textarea:focus{border-color:var(--accent-ink)}
.lp-form .btn{background:var(--accent-ink);color:var(--accent);min-height:58px}
.lp-form .btn:hover{background:#000;color:var(--accent)}
.lp-form small,.lp-form a{color:var(--accent-ink)}
.lp-form :focus-visible{outline-color:var(--accent-ink)}
.picks{grid-column:1/-1;border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.picks legend{font-weight:500;margin-bottom:12px;padding:0}
.pick{position:relative;display:block;cursor:pointer}
.pick input{position:absolute;opacity:0;inset:0;margin:0}
.pick span{display:block;padding:16px 20px 16px 52px;background:rgb(255 255 255 / .55);border:1px solid #9fc77c;font-size:var(--t-l);line-height:1.25;position:relative;transition:background .2s}
.pick span::before{content:"";position:absolute;left:18px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;border:2px solid var(--accent-ink)}
.pick:hover span{background:#fff}
.pick input:checked+span{background:var(--accent-ink);color:var(--accent);border-color:var(--accent-ink)}
.pick input:checked+span::before{border-color:var(--accent);background:radial-gradient(var(--accent) 40%,transparent 45%)}
.pick input:focus-visible+span{outline:2px solid var(--accent-ink);outline-offset:3px}
.lp-starts{grid-column:1/-1}
.lp-start{display:none;padding:18px 20px;border-left:3px solid var(--accent-ink);font-size:var(--t-b)}
.lp-form:has(.pick:nth-of-type(1) input:checked) .s0,.lp-form:has(.pick:nth-of-type(2) input:checked) .s1,.lp-form:has(.pick:nth-of-type(3) input:checked) .s2,.lp-form:has(.pick:nth-of-type(4) input:checked) .s3,.lp-form:has(.pick:nth-of-type(5) input:checked) .s4{display:block;animation:up .5s var(--ease)}
.lp-wa{margin-top:28px;font-weight:500}
.lp-faq{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:24px 56px;padding:clamp(80px,9vw,140px) var(--edge)}
.lp-faq h2{font-size:var(--t-l)}
.lp-foot{display:flex;flex-wrap:wrap;gap:12px 28px;padding:28px var(--edge) 40px;font-size:var(--t-s);color:var(--soft);border-top:1px solid #2e4630}
@media(max-width:959px){
  .lp-hero{min-height:0;padding:48px 20px 80px;gap:22px}
  .lp-hooks li,.lp-why,.lp-faq{grid-template-columns:1fr}
  .lp-why{margin:0;padding:64px 20px}
  .lp-p{max-width:260px}
  .lp-steps ol{grid-template-columns:1fr}
  .lp-form .form{grid-template-columns:1fr}
}