/* alethics – Relaunch Oktober 2026 (Textmarker-Stil). Erzeugt aus dem Entwurf (scratchpad/dist/style.css).
   Schriften liegen auf dem eigenen Server: kein Google-Fonts-Abruf. */
@font-face{font-family:"Archivo Black";src:url("../fonts/archivo-black-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-400.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-700.woff2") format("woff2");font-weight:700 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-400-italic.woff2") format("woff2");font-weight:400 600;font-style:italic;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-700-italic.woff2") format("woff2");font-weight:700 900;font-style:italic;font-display:swap}
html{margin:0;padding:0}body{margin:0}
.skip-link{position:absolute;left:-9999px;top:8px;background:#000;color:#fff;padding:10px 14px;z-index:999}
.skip-link:focus{left:16px}

:root{
  --paper:#ffffff; --ink:#000000; --pink:#FF00B7; --yellow:#FFFF62; --green:#00FF85;
  --band:#F0F0F0; --grey:#949494;
  --soft:rgba(0,0,0,.62); --soft2:rgba(0,0,0,.42); --line:rgba(0,0,0,.14);
  --display:"Archivo Black","Arial Black",Arial,sans-serif;
  --body:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);
  --nav:62px; --section:clamp(96px,12vw,180px); --gutter:clamp(18px,4vw,56px);
  --bw:3px;
}
*{box-sizing:border-box}
[id]{scroll-margin-top:calc(var(--nav) + 20px)}
html{scroll-behavior:smooth;background:var(--paper)}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .4s,color .4s}
a{color:inherit}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px}
img{max-width:100%}
.wrap{max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.035em;line-height:.95;margin:0;text-wrap:balance}
h2{font-size:clamp(36px,5.8vw,80px)}
h3{font-size:clamp(21px,2.1vw,27px);letter-spacing:-.025em;line-height:1.08}
p{margin:0}
.kicker{font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--soft2)}
.lead{font-size:clamp(17px,1.5vw,20px);color:var(--soft);max-width:46ch;line-height:1.6}
.pad{padding-block:var(--section)}
.band{background:var(--band)}
.head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:clamp(44px,6vw,88px)}
@media (max-width:820px){.head{grid-template-columns:1fr}}

/* ---- Textmarker-Werkzeuge ---- */
.mk{color:#000;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'><path d='M2 9 C 38 5 78 12 118 7 S 176 10 198 8 L 199 30 C 162 35 120 28 82 33 S 24 30 3 33 Z' fill='%23FFFF62' opacity='.92'/><path d='M6 14 C 60 11 120 16 196 13 L 196 26 C 130 29 70 25 6 27 Z' fill='%23FFFF62' opacity='.6'/></svg>") no-repeat 0 62%/var(--mk,0%) .62em;padding-inline:.08em;transition:background-size .9s var(--ease)}
.mk.on,.mk:hover{--mk:100%}
.mk.pk{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'><path d='M2 9 C 38 5 78 12 118 7 S 176 10 198 8 L 199 30 C 162 35 120 28 82 33 S 24 30 3 33 Z' fill='%23FF00B7' opacity='.92'/><path d='M6 14 C 60 11 120 16 196 13 L 196 26 C 130 29 70 25 6 27 Z' fill='%23FF00B7' opacity='.6'/></svg>");color:#fff;background-position:0 50%;background-size:var(--mk,0%) .95em}
.blk{background:var(--ink);color:var(--paper);padding:.04em .18em .08em;display:inline-block;box-shadow:6px 6px 0 var(--pink);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.blk:hover{transform:translate(-2px,-2px);box-shadow:9px 9px 0 var(--pink)}
.stroke{position:relative;display:inline-block}
.stroke::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-.08em;height:.14em;background:var(--pink);border-radius:2px;transform:scaleX(var(--mk,0));transform-origin:left;transition:transform .8s var(--ease) .2s}
.stroke.on::after{--mk:1}
.sticker{display:inline-grid;place-items:center;text-align:center;font-family:var(--display);line-height:1;border-radius:50%;transform:rotate(var(--r,-4deg));box-shadow:0 10px 24px -14px rgba(0,0,0,.6)}
.tape{position:absolute;width:92px;height:26px;background:var(--yellow);opacity:.92;transform:rotate(var(--r,-3deg));box-shadow:0 2px 6px rgba(0,0,0,.18);mix-blend-mode:multiply}

.pill{display:inline-flex;align-items:center;gap:.5em;border-radius:999px;font-weight:700;font-size:15px;padding:15px 26px;text-decoration:none;white-space:nowrap;border:var(--bw) solid var(--ink);cursor:pointer;font-family:var(--body);position:relative;overflow:hidden;isolation:isolate;transition:transform .25s var(--ease),box-shadow .25s var(--ease),color .25s}
.pill::before{content:"";position:absolute;inset:0;background:var(--pink);transform:translateX(-101%);transition:transform .35s var(--ease);z-index:-1}
.pill:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink);color:#fff}
.pill:hover::before{transform:none}
.pill.cta{background:var(--pink);color:#fff;border-color:var(--pink)}
.pill.cta::before{background:var(--ink)}
.pill.cta:hover{box-shadow:5px 5px 0 var(--pink);border-color:var(--ink)}
.pill.ghost{background:transparent;color:var(--ink)}
.pill.yellow{background:var(--yellow);color:#000;border-color:#000}
.pill.yellow:hover{color:#fff;box-shadow:5px 5px 0 #000}
.more{display:inline-flex;align-items:center;gap:.5em;font-weight:700;font-size:15px;text-decoration:none;background:linear-gradient(var(--yellow),var(--yellow)) no-repeat 0 100%/100% 3px;transition:background-size .3s var(--ease)}
.more:hover{background-size:100% 55%}
.more span{transition:transform .25s var(--ease)}
.more:hover span{transform:translateX(5px)}

/* logo */
.logo{display:block;line-height:0}
.logo svg{height:24px;width:auto;color:var(--ink);display:block;clip-path:inset(0 100% 0 0);animation:wipe 1.1s var(--ease) .15s forwards;transition:color .4s}
@keyframes wipe{to{clip-path:inset(0 0 0 0)}}
.logo:hover svg .wm-mark{animation:bounce .6s var(--ease)}
@keyframes bounce{30%{transform:translateY(-14px) rotate(-12deg)}}
.logo svg .wm-mark{transform-box:fill-box;transform-origin:center}
footer .logo svg{height:44px;animation:none;clip-path:none}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:color-mix(in srgb,var(--paper) 84%,transparent);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);border-bottom:var(--bw) solid var(--ink)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:var(--nav)}
.nav ul{display:flex;gap:6px;list-style:none;margin:0 auto 0 18px;padding:0}
.nav ul a{text-decoration:none;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:8px 10px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'><path d='M2 9 C 38 5 78 12 118 7 S 176 10 198 8 L 199 30 C 162 35 120 28 82 33 S 24 30 3 33 Z' fill='%23FFFF62' opacity='.92'/><path d='M6 14 C 60 11 120 16 196 13 L 196 26 C 130 29 70 25 6 27 Z' fill='%23FFFF62' opacity='.6'/></svg>") no-repeat 0 55%/0% 80%;transition:background-size .3s var(--ease);color:var(--ink)}
.nav ul a:hover{background-size:100% 100%;color:#000}
.nav .pill{padding:10px 18px;font-size:13px;margin-left:auto}
.nav ul ~ .pill{margin-left:0}
@media (max-width:980px){.nav ul{display:none}}

/* hero */
.hero{position:relative;overflow:hidden}
.hero .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,80px);align-items:center;padding-block:clamp(56px,8vw,120px)}
.hero h1{font-size:clamp(50px,7.8vw,116px);line-height:.92}
.hero h1 span{display:block;animation:up 1s var(--ease) both}
.hero h1 .l2{animation-delay:.1s}
.hero h1 .l3{animation-delay:.2s;margin-top:.12em}
@keyframes up{from{opacity:0;transform:translateY(.4em)}to{opacity:1;transform:none}}
.hero .lead{margin-top:28px}
.hero .ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero .right{position:relative}
.card-ink{position:relative;background:#000;color:#fff;border:var(--bw) solid var(--ink);box-shadow:12px 12px 0 var(--yellow);aspect-ratio:4/4.2;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.hero .right:hover .card-ink{transform:translate(-3px,-3px);box-shadow:16px 16px 0 var(--pink)}
.card-ink .ph{position:absolute;inset:0;overflow:hidden}
.card-ink .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;animation:kb 30s ease-in-out infinite alternate}
.who{margin-top:34px;display:grid;gap:12px}
.who .blk{font-family:var(--display);font-size:clamp(18px,1.7vw,24px);letter-spacing:-.02em;box-shadow:5px 5px 0 var(--pink);justify-self:start}
.who .sub{font-size:14.5px;font-weight:600;color:var(--soft);max-width:36ch}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.14)}}
.rings{display:inline-block;width:52px;height:52px;background:#000;border-radius:50%;padding:5px;margin-right:4px;animation:breathe 6s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.035)}}
.rings svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.rt{fill:none;stroke-width:30}
.rr{fill:none;stroke-width:30;stroke-linecap:round}
.rr.k{stroke:var(--pink);stroke-dasharray:924;animation:fk 2.1s var(--ease) .3s both}
.rr.a{stroke:var(--yellow);stroke-dasharray:678;animation:fa 2.1s var(--ease) .6s both}
.rr.n{stroke:var(--green);stroke-dasharray:433;animation:fn 2.1s var(--ease) .9s both}
@keyframes fk{from{stroke-dashoffset:924}to{stroke-dashoffset:0}}
@keyframes fa{from{stroke-dashoffset:678}to{stroke-dashoffset:0}}
@keyframes fn{from{stroke-dashoffset:433}to{stroke-dashoffset:0}}
.legend{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px 18px;font-size:12.5px;font-weight:600;color:var(--soft);margin-top:22px}
.legend .lg-note{flex-basis:100%;font-weight:500;color:var(--soft2)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:-1px}
.st1{position:absolute;right:-22px;top:-30px;width:132px;height:132px;background:var(--yellow);color:#000;font-size:15px;z-index:3;--r:6deg;animation:sway 7s ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-6deg)}}
.hero .specs{display:grid;grid-template-columns:repeat(4,1fr);border-top:var(--bw) solid var(--ink);border-bottom:var(--bw) solid var(--ink)}
.spec{padding:26px var(--gutter);border-right:1px solid var(--line);transition:background .3s}
.spec:last-child{border-right:0}
.spec:hover{background:var(--yellow);color:#000}
.spec .k{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft2)}
.spec:hover .k{color:rgba(0,0,0,.55)}
.spec .v{font-family:var(--display);font-weight:400;font-size:clamp(15px,1.5vw,20px);letter-spacing:-.025em;margin-top:9px}
.spec .v.g{color:var(--pink);font-variant-numeric:tabular-nums}
@media (max-width:900px){.hero .grid{grid-template-columns:1fr}.card-ink{aspect-ratio:4/4}}
@media (max-width:620px){.hero .specs{grid-template-columns:1fr 1fr}.spec:nth-child(2){border-right:0}.spec:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* marquee */



/* myth */
.myth{height:240vh;position:relative}
.myth .stick{position:sticky;top:var(--nav);min-height:calc(100vh - var(--nav));display:flex;align-items:center;padding-block:clamp(56px,8vw,110px)}
.myth .kicker{color:var(--pink);margin-bottom:34px}
.claim-wrap{font-family:var(--display);font-size:clamp(28px,5.6vw,80px);line-height:1.12;letter-spacing:-.035em;max-width:16ch}
.claim{display:block;position:relative}
.claim .t{opacity:calc(1 - var(--s,1)*.62)}
.claim::after{content:attr(data-text);position:absolute;inset:0;color:transparent;text-decoration:line-through;text-decoration-color:var(--pink);text-decoration-thickness:.1em;clip-path:inset(0 calc((1 - var(--s,1))*100%) 0 0);pointer-events:none}
.myth .answer{margin-top:clamp(40px,6vw,80px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:start;border-top:var(--bw) solid var(--ink);padding-top:clamp(32px,4vw,52px)}
.myth .answer h3{font-size:clamp(26px,3.4vw,46px);max-width:14ch}
@media (max-width:820px){.myth{height:auto}.myth .stick{position:static;min-height:0}.myth .answer{grid-template-columns:1fr}}

/* audience */
.aud .grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,7vw,120px)}
.aud h2{margin-bottom:clamp(32px,4vw,52px)}
.aud ul{list-style:none;margin:0;padding:0}
.aud li{display:grid;grid-template-columns:26px 1fr;gap:18px;padding:24px 10px;border-top:1px solid var(--line);font-size:clamp(17px,1.7vw,21px);line-height:1.45;transition:transform .3s var(--ease)}
.aud li:last-child{border-bottom:1px solid var(--line)}
.aud li:hover{transform:translateX(8px)}
.aud li .mk{background-position:0 70%}
.aud li svg{width:24px;height:24px;margin-top:5px;transition:transform .4s var(--ease)}
.aud li:hover svg{transform:rotate(-12deg) scale(1.15)}
.aud .facts{display:grid;gap:34px;align-content:start;position:sticky;top:calc(var(--nav) + 40px)}
.aud .fact b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(40px,5.4vw,72px);line-height:1;letter-spacing:-.04em}
.aud .fact span{display:block;margin-top:8px;color:var(--soft);font-size:14.5px}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--pink);margin-left:10px;vertical-align:middle;animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 10px rgba(255,0,183,0)}0%{box-shadow:0 0 0 0 rgba(255,0,183,.55)}}
@media (max-width:900px){.aud .grid{grid-template-columns:1fr}.aud .facts{position:static;grid-template-columns:repeat(3,auto);justify-content:start;gap:34px}}
@media (max-width:520px){.aud .facts{grid-template-columns:1fr 1fr}}

/* cards (pillars, posts, tiles) */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,32px)}
.card{background:var(--paper);border:var(--bw) solid var(--ink);box-shadow:8px 8px 0 var(--ink);display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.card:hover{transform:translate(-4px,-6px);box-shadow:14px 14px 0 var(--pink)}
.card .media{aspect-ratio:4/5;overflow:hidden;border-bottom:var(--bw) solid var(--ink);background:#000}
.card .media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .6s}
.card:hover .media img{transform:scale(1.07)}
.card .txt{padding:clamp(20px,2.4vw,30px);display:flex;flex-direction:column;gap:12px;flex:1}
.card p{color:var(--soft);font-size:15px;line-height:1.55}
.card .viz{aspect-ratio:4/5;border-bottom:var(--bw) solid var(--ink);display:grid;place-items:center;padding:28px;background:var(--band)}
.card .viz svg{width:100%;max-width:190px;overflow:visible}
.bar{transform-box:fill-box;transform-origin:bottom;animation:grow 4.4s var(--ease) infinite}
.plate{transform-box:fill-box;transform-origin:center;animation:plate 3.8s var(--ease) infinite}
.plate.p2{animation-delay:.2s}.plate.p3{animation-delay:.4s}
@keyframes plate{0%,8%{transform:scaleY(0)}28%,78%{transform:scaleY(1)}92%,100%{transform:scaleY(0)}}
@keyframes grow{0%,5%{transform:scaleY(.06)}42%,84%{transform:scaleY(1)}100%{transform:scaleY(.06)}}
.card .arrow{margin-top:auto;font-weight:700;font-size:14px;padding-top:10px}
.card .cat{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--pink);font-weight:700}
@media (max-width:1000px){.cards{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cards{grid-template-columns:1fr}.card .media,.card .viz{aspect-ratio:16/10}}

/* coaching flow */
.flow .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,32px)}
.step{position:relative;padding:clamp(26px,3vw,38px) clamp(22px,2.6vw,32px);border:var(--bw) dashed var(--ink);display:flex;flex-direction:column;gap:14px;min-height:320px;transition:background .3s,border-style .3s}
.step:hover{background:var(--band);border-style:solid}
.step .n{position:absolute;top:-22px;left:18px;width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--pink);font-family:var(--display);font-size:22px;display:grid;place-items:center;transition:transform .4s var(--ease)}
.step:hover .n{transform:scale(1.12)}
.step h3{margin-top:14px}
.step p{color:var(--soft);font-size:15px;line-height:1.55}
.step .price{margin-top:auto;padding-top:20px;font-family:var(--display);font-size:24px;letter-spacing:-.02em}
.step .price small{display:block;font-family:var(--body);font-size:12.5px;color:var(--soft2);letter-spacing:0;margin-top:4px}
.flow .incl{margin-top:clamp(48px,6vw,88px);display:grid;grid-template-columns:1fr 2fr;gap:clamp(24px,4vw,64px);align-items:start}
.flow .incl ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,3vw,48px)}
.flow .incl li{padding:18px 8px;border-top:1px solid var(--line);display:grid;gap:4px;transition:transform .3s var(--ease)}
.flow .incl li:hover{transform:translateX(6px)}
.flow .incl li b{font-size:15.5px}
.flow .incl li span{color:var(--soft);font-size:14px}
.cta-row{margin-top:clamp(36px,4vw,56px);display:flex;flex-wrap:wrap;gap:18px 28px;align-items:center}
@media (max-width:1000px){.flow .steps{grid-template-columns:1fr 1fr}}
@media (max-width:860px){.flow .incl{grid-template-columns:1fr}}
@media (max-width:600px){.flow .steps{grid-template-columns:1fr}.step{min-height:0}.flow .incl ul{grid-template-columns:1fr}}

/* transformations */
.trans .scroller{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,320px);gap:clamp(22px,3vw,40px);overflow-x:auto;scroll-snap-type:x mandatory;padding:24px 8px 28px;scrollbar-width:thin;scrollbar-color:var(--ink) transparent}
.tcard{scroll-snap-align:start;display:flex;flex-direction:column;gap:16px;margin:0;position:relative;animation:float 6s ease-in-out infinite;animation-delay:calc(var(--i)*-1.1s)}
@keyframes float{50%{transform:translateY(-8px)}}
.tcard .img{position:relative;aspect-ratio:1;overflow:hidden;background:#fff;border:var(--bw) solid var(--ink);box-shadow:8px 8px 0 var(--ink);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.tcard:hover .img{transform:scale(1.03);box-shadow:12px 12px 0 var(--pink)}
.tcard .img img{width:100%;height:100%;object-fit:cover}
.tcard .img::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 35%,rgba(255,0,183,.45) 50%,transparent 65%);transform:translateX(-120%);transition:transform .9s var(--ease)}
.tcard:hover .img::after{transform:translateX(120%)}
.tcard .badge{position:absolute;right:-14px;top:-16px;background:var(--ink);color:var(--pink);font-family:var(--display);font-size:15px;border-radius:999px;padding:9px 14px;animation:pulse2 2.4s ease-in-out infinite}
@keyframes pulse2{50%{transform:scale(1.08)}}
.tcard .tape{top:-12px;left:50%;margin-left:-46px;--r:-3deg;z-index:2}
.tcard figcaption b{display:block;font-size:16px}
.tcard figcaption span{display:block;color:var(--soft2);font-size:13px;margin-top:2px}
.tcard q{display:block;margin-top:10px;color:var(--soft);font-size:14.5px;line-height:1.5;quotes:"„" "“"}
.trans .note{margin-top:12px;font-size:12.5px;color:var(--soft2)}

/* numbers */
.nums{border-top:var(--bw) solid var(--ink);border-bottom:var(--bw) solid var(--ink)}
.nums .row{display:grid;grid-template-columns:repeat(4,1fr)}
.num{padding:clamp(40px,5vw,72px) var(--gutter);border-right:1px solid var(--line);transition:background .3s}
.num:hover{background:var(--band)}
.num:last-child{border-right:0}
.num b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(36px,5.4vw,76px);letter-spacing:-.04em;line-height:1;color:var(--pink);font-variant-numeric:tabular-nums}
.num b.w{color:var(--ink)}
.num span{display:block;margin-top:12px;color:var(--soft);font-size:14px}
@media (max-width:700px){.nums .row{grid-template-columns:1fr 1fr}.num:nth-child(2){border-right:0}.num:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* koch — schwarzer Akzentblock */
.koch{background:#000;color:#fff}
.koch .band-ph{position:relative;min-height:min(80vh,680px);display:grid;align-items:end;overflow:hidden}
.koch .band-ph .ph{position:absolute;inset:0}
.koch .band-ph .ph img{width:100%;height:100%;object-fit:cover;opacity:.5;animation:kb 30s ease-in-out infinite alternate}
.koch .band-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.92) 100%)}
.koch .inner{position:relative;z-index:2;padding-block:clamp(48px,7vw,96px)}
.koch .kicker{color:rgba(255,255,255,.5)}
.koch h2{max-width:14ch;margin-top:18px}
.koch .mk{background-size:var(--mk,0%) 1.02em;background-position:0 52%;padding-inline:.12em}
.koch .lead{margin-top:24px;color:rgba(255,255,255,.7)}
.koch .pair{display:grid;grid-template-columns:1fr 1.4fr;gap:3px;background:#fff}
.koch .pair figure{margin:0;background:#000;position:relative;overflow:hidden;aspect-ratio:4/3}
.koch .pair img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),filter .6s}
.koch .pair figure:hover img{transform:scale(1.05)}
.koch .pair figcaption{position:absolute;left:0;right:0;bottom:0;padding:20px 24px;font-size:13.5px;font-weight:600;background:linear-gradient(transparent,rgba(0,0,0,.85));transform:translateY(8px);opacity:.85;transition:transform .5s var(--ease),opacity .5s}
.koch .pair figure:hover figcaption{transform:none;opacity:1}
@media (max-width:760px){.koch .pair{grid-template-columns:1fr}}

/* about */
.about .grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,7vw,120px);align-items:center}
.about figure{margin:0;position:relative;border:var(--bw) solid var(--ink);aspect-ratio:3/4;box-shadow:10px 10px 0 var(--yellow);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.about figure:hover{transform:translate(-3px,-3px);box-shadow:14px 14px 0 var(--yellow)}
.about figure img{width:100%;height:100%;object-fit:cover;display:block}
.about figure .tape{top:-13px;left:22px;--r:-7deg}
.about figure .tape.b{top:auto;left:auto;right:18px;bottom:-12px;--r:5deg}
.about .kicker{color:var(--pink)}
.about h2{margin:20px 0 28px}
.about p{color:var(--soft);max-width:50ch}
.about p + p{margin-top:16px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.chips span{border:2px solid var(--ink);border-radius:999px;padding:8px 14px;font-size:13.5px;font-weight:700;transition:background .25s,transform .25s var(--ease)}
.chips span:hover{background:var(--yellow);color:#000;transform:translateY(-2px)}
.about .more{margin-top:34px}
@media (max-width:860px){.about .grid{grid-template-columns:1fr}}

/* blog + downloads */
.cards.three{grid-template-columns:repeat(3,1fr)}
.card.post{min-height:280px}
.card.post .txt{gap:16px}
.card.tile{min-height:300px}
.card.tile .cat{color:var(--soft2)}
.card.ebook .txt{display:grid;grid-template-columns:1fr 140px;gap:20px;align-items:center}
.card.ebook .txt > div{display:flex;flex-direction:column;gap:12px;height:100%}
.card.ebook img{width:140px;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--pink);animation:float 5s ease-in-out infinite;transition:transform .5s var(--ease)}
.card.ebook:hover img{transform:scale(1.04)}
@media (max-width:900px){.cards.three{grid-template-columns:1fr}}

/* faq */
.faq .grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(32px,6vw,100px)}
details{border-top:1px solid var(--line)}
details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:26px 8px;font-weight:700;font-size:clamp(16.5px,1.6vw,19px);transition:transform .3s var(--ease)}
summary:hover{transform:translateX(6px)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--display);color:var(--pink);font-size:24px;line-height:1;transition:transform .3s var(--ease)}
details[open] summary::after{transform:rotate(45deg)}
details p{color:var(--soft);padding:0 8px 26px;max-width:58ch}
@media (max-width:860px){.faq .grid{grid-template-columns:1fr}}

/* final */
.final{background:var(--pink);color:#fff;padding-block:clamp(80px,10vw,150px);position:relative;overflow:hidden}
.final h2{font-size:clamp(42px,7.6vw,104px)}
.final h2 .blk{box-shadow:6px 6px 0 var(--yellow)}
.final p{margin-top:22px;font-size:clamp(17px,1.6vw,20px)}
.final .ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
.final .pill{border-color:#000}
.final .pill.black{background:#000;color:#fff}
.final .pill.black::before{background:var(--yellow)}
.final .pill.black:hover{color:#000;box-shadow:5px 5px 0 #000}
.final .pill.line-w{border-color:#fff;color:#fff;background:transparent}
.final .pill.line-w::before{background:#fff}
.final .pill.line-w:hover{color:var(--pink);box-shadow:5px 5px 0 #000}

footer.site{padding-block:clamp(48px,6vw,80px);border-top:var(--bw) solid var(--ink)}
footer.site .top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px;align-items:center}
footer.site nav{display:flex;flex-wrap:wrap;gap:22px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
footer.site nav a{text-decoration:none;background:linear-gradient(var(--yellow),var(--yellow)) no-repeat 0 100%/0% 40%;transition:background-size .3s var(--ease)}
footer.site nav a:hover{background-size:100% 40%;color:#000}
footer.site .sig{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--soft2)}
footer.site .sig i{font-style:normal;color:var(--pink)}

/* Entwurfs-Schalter */

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .logo svg{clip-path:none}
  .mk{--mk:100%}.stroke{--mk:1}
  .myth{height:auto}.myth .stick{position:static;min-height:0}
}

/* v6: Ziele, Prinzipien, Ablauf 3er, Inhalte, Reinschnuppern */
.card .foot{margin-top:auto;padding-top:14px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--soft2)}
.card .txt .cat + h3{margin-top:2px}
.steps.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.steps.three{grid-template-columns:1fr}}
.princ .grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,6vw,96px);align-items:start}
.princ .side{position:sticky;top:calc(var(--nav) + 32px)}
.rings-lg{width:min(100%,300px);aspect-ratio:1;margin-top:34px;animation:breathe 6s ease-in-out infinite}
.rings-lg svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.princ .legend{margin-top:22px}
.princ .list{display:grid;gap:0}
.princ .list article{padding:clamp(22px,2.6vw,34px) 10px;border-top:1px solid var(--line);transition:transform .3s var(--ease)}
.princ .list article:last-child{border-bottom:1px solid var(--line)}
.princ .list article:hover{transform:translateX(8px)}
.princ .list h3{margin-bottom:10px}
.princ .list p{color:var(--soft);max-width:56ch}
@media (max-width:860px){.princ .grid{grid-template-columns:1fr}.princ .side{position:static}}
.incl-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
.incl-grid li{border:var(--bw) solid var(--ink);background:var(--paper);padding:clamp(20px,2.4vw,28px);display:grid;gap:8px;box-shadow:6px 6px 0 var(--ink);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.incl-grid li:hover{transform:translate(-3px,-4px);box-shadow:10px 10px 0 var(--yellow)}
.incl-grid b{font-size:16.5px}
.incl-grid span{color:var(--soft);font-size:14.5px;line-height:1.5}
@media (max-width:900px){.incl-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.incl-grid{grid-template-columns:1fr}}
.trans .nums{margin-top:clamp(48px,6vw,88px)}
.koch .about-txt{margin-top:24px;display:grid;gap:14px;max-width:58ch}
.koch .about-txt p{color:rgba(255,255,255,.78);font-size:clamp(16px,1.4vw,18px);line-height:1.6}
.chips.light span{border-color:rgba(255,255,255,.5);color:#fff}
.chips.light span:hover{background:var(--yellow);color:#000;border-color:var(--yellow)}
.koch .more.light{color:#fff;margin-top:30px;display:inline-flex}
.koch .more.light:hover{color:#000}
.snack-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,5vw,80px);align-items:start}
.snack-grid .kicker{margin-bottom:18px}
.posts{display:grid;gap:0;border-top:var(--bw) solid var(--ink)}
.post{display:grid;gap:8px;padding:22px 8px;border-bottom:1px solid var(--line);text-decoration:none;transition:transform .3s var(--ease),background .3s}
.post:hover{transform:translateX(8px)}
.post h3{font-size:clamp(17px,1.5vw,21px);line-height:1.2}
.post .arrow{font-weight:700;font-size:13.5px}
.dls{display:grid;gap:clamp(16px,2vw,24px)}
.dls .card{min-height:0}
@media (max-width:860px){.snack-grid{grid-template-columns:1fr}}

/* ===== Unterseiten ===== */
.nav ul a[aria-current="page"]{background-size:100% 80%;color:#000}
.hero.sub .grid{padding-block:clamp(48px,7vw,100px)}
.hero.slim .wrap{padding-block:clamp(56px,8vw,120px) clamp(40px,6vw,80px)}
.hero.slim h1{font-size:clamp(44px,7vw,104px)}
.hero.slim .lead{margin-top:28px;max-width:52ch}
.cards.two{grid-template-columns:1fr 1fr}
@media (max-width:860px){.cards.two{grid-template-columns:1fr}}
.card.tile{min-height:0}
.grid2{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,80px);align-items:start}
.lead-col{display:grid;gap:18px}
@media (max-width:860px){.grid2{grid-template-columns:1fr}}

/* Über mich */
blockquote.big{margin:0 0 clamp(40px,6vw,80px);font-family:var(--display);font-size:clamp(26px,3.6vw,52px);line-height:1.12;letter-spacing:-.03em;max-width:22ch}
.story-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,6vw,96px);align-items:start}
.story-txt h2{margin-bottom:28px}
.story-txt p{color:var(--soft);font-size:clamp(16.5px,1.4vw,19px);line-height:1.65;margin-bottom:18px;max-width:56ch}
.story-img{margin:0;position:relative;border:var(--bw) solid var(--ink);box-shadow:10px 10px 0 var(--yellow);aspect-ratio:3/4;position:sticky;top:calc(var(--nav) + 32px)}
.story-img img{width:100%;height:100%;object-fit:cover;display:block}
.story-img .tape{top:-13px;left:24px}
@media (max-width:860px){.story-grid{grid-template-columns:1fr}.story-img{position:static}}
.koch h2 .mk{color:#000}

/* Blog */
.feature-post{display:grid;grid-template-columns:1.2fr 1fr;align-items:stretch}
.feature-post .media.wide{aspect-ratio:auto;min-height:320px;border-bottom:0;border-right:var(--bw) solid var(--ink)}
.feature-post .txt{gap:16px;padding:clamp(26px,3vw,40px)}
@media (max-width:860px){.feature-post{grid-template-columns:1fr}.feature-post .media.wide{min-height:240px;border-right:0;border-bottom:var(--bw) solid var(--ink)}}
.filters{display:flex;flex-wrap:wrap;gap:8px;justify-self:end}
.chip{display:inline-flex;align-items:center;border:2px solid var(--ink);border-radius:999px;padding:8px 14px;font:700 13px/1 var(--body);background:none;color:var(--ink);cursor:pointer;text-decoration:none;transition:background .2s,color .2s}
.chip.on,.chip:hover{background:var(--ink);color:var(--paper)}
.posts .post p{color:var(--soft);font-size:14.5px;max-width:64ch}
.pager{display:flex;gap:8px;margin-top:30px}
.newsletter{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,80px);align-items:center;border:var(--bw) solid var(--ink);box-shadow:10px 10px 0 var(--yellow);padding:clamp(26px,3.4vw,48px)}
.nl-form{display:flex;gap:10px;flex-wrap:wrap}
.nl-form input,.login-form input,.contact-form input[type=text],.contact-form input[type=email],.contact-form input[type=tel]{flex:1;min-width:200px;border:var(--bw) solid var(--ink);background:var(--paper);color:var(--ink);font:500 16px var(--body);padding:13px 16px;border-radius:999px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:860px){.newsletter{grid-template-columns:1fr}}

/* Blog-Beitrag */
.post-head .wrap{padding-block:clamp(40px,6vw,80px) clamp(28px,4vw,48px);max-width:900px}
.post-title{font-size:clamp(34px,5.2vw,68px);line-height:1;margin-top:18px}
.post-head .lead{margin-top:24px;max-width:60ch}
.byline{display:flex;align-items:center;gap:14px;margin-top:28px}
.byline img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--ink)}
.byline b{display:block;font-size:15px}.byline span{font-size:13px;color:var(--soft2)}
.post-hero{margin:0;max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
.post-hero img{width:100%;aspect-ratio:21/9;object-fit:cover;border:var(--bw) solid var(--ink);box-shadow:10px 10px 0 var(--yellow)}
.post-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(32px,5vw,80px);padding-block:clamp(48px,6vw,88px)}
.post-body{max-width:68ch}
.post-body p{font-size:clamp(17px,1.35vw,19px);line-height:1.7;margin-bottom:22px;color:rgba(0,0,0,.84)}
:root[data-paper="dark"] .post-body p{color:rgba(255,255,255,.84)}
.post-body h2{font-size:clamp(24px,2.6vw,34px);margin:44px 0 16px;letter-spacing:-.03em}
.post-body ol{padding-left:22px;margin:0 0 22px;display:grid;gap:8px;font-size:17px;line-height:1.6}
.callout{border-left:6px solid var(--yellow);background:var(--band);padding:18px 22px;margin:0 0 22px}
.callout b{display:block;margin-bottom:6px}.callout p{margin:0;font-size:16px}
.post-side{display:grid;gap:20px;align-content:start;position:sticky;top:calc(var(--nav) + 24px)}
.side-card{border:var(--bw) solid var(--ink);padding:22px;display:grid;gap:12px}
.side-card.ink{background:var(--ink);color:var(--paper);box-shadow:8px 8px 0 var(--pink)}
.side-card.ink .kicker{color:rgba(255,255,255,.55)}
.side-card.ink p{color:rgba(255,255,255,.75);font-size:15px}
.side-card .pill{justify-self:start}
ul.plain{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:15px}
ul.plain li{padding-left:18px;position:relative}
ul.plain li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;background:var(--pink);border-radius:50%}
.more.back{font-size:14px}
@media (max-width:900px){.post-grid{grid-template-columns:1fr}.post-side{position:static}}

/* Downloads */
.login{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:start}
.login-form{display:grid;gap:8px;border:var(--bw) solid var(--ink);padding:clamp(22px,3vw,34px);background:var(--paper);box-shadow:8px 8px 0 var(--ink)}
.login-form label,.contact-form label{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--soft2);margin-top:8px}
.login-form .pill{justify-self:start;margin-top:14px}
@media (max-width:860px){.login{grid-template-columns:1fr}}

/* Anfrage-Quiz */
.quiz{max-width:860px}
.progress{height:6px;background:var(--band);border:2px solid var(--ink);border-radius:999px;overflow:hidden;margin-bottom:18px}
.progress i{display:block;height:100%;width:var(--p,20%);background:var(--pink);transition:width .5s var(--ease)}
.q h2{margin:18px 0 28px}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.choice{text-align:left;border:var(--bw) solid var(--ink);background:var(--paper);color:var(--ink);font:600 16px/1.35 var(--body);padding:18px 20px;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s}
.choice:hover{transform:translate(-2px,-3px);box-shadow:6px 6px 0 var(--yellow)}
.choice.sel{background:var(--ink);color:var(--paper);box-shadow:6px 6px 0 var(--pink)}
@media (max-width:620px){.choices{grid-template-columns:1fr}}
.contact-form{display:grid;gap:8px;max-width:620px}
.contact-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form .row2>div{display:grid;gap:8px}
.contact-form .check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--soft);margin-top:14px;text-transform:none;letter-spacing:0;font-weight:500}
.contact-form .check input{margin-top:4px;accent-color:var(--pink);width:18px;height:18px}
.contact-form .pill{justify-self:start;margin-top:16px}
.quiz-nav{margin-top:28px}
.q.done .lead{max-width:60ch}
@media (max-width:620px){.contact-form .row2{grid-template-columns:1fr}}

/* Blog-Liste mit Bildern */
.post.with-img{grid-template-columns:200px 1fr;gap:22px;align-items:start}
.post .thumb{display:block;aspect-ratio:4/3;overflow:hidden;border:var(--bw) solid var(--ink);background:var(--band)}
.post .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.1s var(--ease)}
.post:hover .thumb img{transform:scale(1.05)}
.post .body{display:grid;gap:8px}
.danke-text{margin-top:24px;max-width:56ch}
.danke-text p{margin-bottom:12px}
.danke-termin{margin-top:40px;border:var(--bw) solid var(--ink);padding:24px;box-shadow:var(--sh)}
.post-body.legal{max-width:76ch}
.post-body.legal h2{font-size:clamp(20px,2.2vw,28px);margin:36px 0 12px}
.post-body.legal h3{font-size:18px}
.post-body.legal p,.post-body.legal li{font-size:16px;line-height:1.6}
.post-body.legal ul{display:block}
@media (max-width:620px){.post.with-img{grid-template-columns:1fr}.post .thumb{aspect-ratio:16/9}}

/* ===== Design-Review ===== */
/* Verbindliche Skala: Radien 0|999 · Rahmen 3px (Pills/Chips 2px, Listen 1px) · Schatten 8px Ink in Ruhe, 12px Pink nur bei klickbarem Hover · Display 112/80/48/28/22 · Text 20/17/15/13/11 */
:root{--sh:8px 8px 0 var(--ink);--sh-hover:12px 12px 0 var(--pink);--ease-mk:cubic-bezier(.4,0,.2,1)}

/* Laden: nur die Headline bewegt sich, Marke steht ab Frame 0 */
.logo svg{animation:none;clip-path:none}
@keyframes bounce{30%{transform:translateY(-8px)}}
.logo:hover svg .wm-mark{animation-duration:.45s}
@keyframes up{from{opacity:0;transform:translateY(.25em)}to{opacity:1;transform:none}}
.hero h1 span{animation-duration:.7s}
.hero h1 .l2{animation-delay:.08s}
.hero h1 .l3{animation-delay:.16s}

/* Marker: ein Strich pro Abschnitt, Handbewegung statt UI-Tween */
.mk{transition:background-size .6s var(--ease-mk)}
.mk:not(.on):hover{--mk:0%}
.stroke::after{border-radius:0}

/* Blöcke, Porträt, Eckdaten: nichts hebt sich, was nicht klickbar ist */
.blk:hover{transform:none;box-shadow:6px 6px 0 var(--pink)}
.card-ink{box-shadow:var(--sh)}
.hero .right:hover .card-ink{transform:none;box-shadow:var(--sh)}
.card-ink .ph img{animation:none}
.who .blk .mk{background:none;color:var(--pink);padding-inline:0}
.spec:hover{background:transparent;color:inherit}
.spec:hover .k{color:var(--soft2)}

/* Karten: Lift + Schatten, nur wenn klickbar */
.card{box-shadow:var(--sh)}
.card:hover{transform:translate(-4px,-6px);box-shadow:var(--sh-hover)}
.card:hover .media img{transform:none}
article.card:hover{transform:none;box-shadow:var(--sh)}
.card.ebook img{animation:none;border:var(--bw) solid var(--ink);box-shadow:var(--sh)}
.card.ebook:hover img{transform:none}
.incl-grid li{box-shadow:var(--sh)}
.incl-grid li:hover{transform:none;box-shadow:var(--sh)}
.post:hover{transform:translateX(6px)}
.princ .list article:hover{transform:translateX(6px)}

/* Hantel lädt einmal, wenn sie ins Bild kommt */
.plate{animation:none;transform:scaleY(0)}
.on .plate{animation:plate 3.8s var(--ease) 1 both}
@keyframes plate{0%,8%{transform:scaleY(0)}28%,100%{transform:scaleY(1)}}

/* Mythos: ungestrichen als Grundzustand, robust ohne JS und auf Mobil */
.claim .t{opacity:calc(1 - var(--s,0)*.62);transition:opacity .8s var(--ease)}
.claim::after{clip-path:inset(0 calc((1 - var(--s,0))*100%) 0 0);transition:clip-path .8s var(--ease)}
.claim.on{--s:1}
.myth{height:180vh}
@media (max-width:820px){.myth{height:auto}}
.myth .answer h3{font-size:clamp(26px,3.4vw,48px)}

/* Die drei Ringe: schwarze Bühne im Kartensystem */
.rings-lg{width:min(100%,320px);aspect-ratio:1;padding:11%;background:#000;border:var(--bw) solid var(--ink);box-shadow:var(--sh);margin-top:32px;animation:none;box-sizing:border-box}
.rings-lg svg{animation:breathe 6s ease-in-out infinite}
.rt{stroke-width:28}.rr{stroke-width:28}
.rr.k{stroke-dasharray:942;animation-name:fk2}.rr.a{stroke-dasharray:672;animation-name:fa2}.rr.n{stroke-dasharray:402;animation-name:fn2}
@keyframes fk2{from{stroke-dashoffset:942}to{stroke-dashoffset:0}}
@keyframes fa2{from{stroke-dashoffset:672}to{stroke-dashoffset:0}}
@keyframes fn2{from{stroke-dashoffset:402}to{stroke-dashoffset:0}}
.legend{font-size:14px;margin-top:24px}
.legend i{width:12px;height:12px}
.legend .lg-note{font-size:13px}
@media (max-width:620px){.rings-lg{width:min(100%,260px)}}

/* Ablauf: solide Rahmen, Schritt 2 ist die einzige Akzentfläche */
.step{border-style:solid}
.step:hover{background:transparent}
.step:nth-child(2){background:var(--yellow);color:#000}
.step:nth-child(2):hover{background:var(--yellow)}
.step:nth-child(2) p{color:rgba(0,0,0,.72)}
.step:nth-child(2) .price small{color:rgba(0,0,0,.55)}
.step .price{font-size:22px}

/* Transformationen: Dokumentation, keine Werbung */
.tcard{animation:none}
.tcard .img{box-shadow:var(--sh)}
.tcard .img::after{display:none}
.tcard:hover .img{transform:none;box-shadow:var(--sh)}
.tcard .badge{animation:none}
.trans .scroller{scroll-padding-inline:18px}
@media (max-width:620px){.trans .scroller{grid-auto-columns:minmax(260px,78vw)}}

/* Koch-Band: ruhige Drift */
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.06)}}

/* Zahlen und Schluss: Typo-Skala */
.num b{font-size:clamp(36px,5.4vw,80px)}
.final h2{font-size:clamp(36px,5.8vw,80px)}
.final h2 .blk{box-shadow:6px 6px 0 #fff}

/* Schatten ohne Gelb, überall */
.story-img,.newsletter,.post-hero img,.login-form{box-shadow:var(--sh)}
.choice:hover{box-shadow:8px 8px 0 var(--pink)}
.choice.sel{box-shadow:8px 8px 0 var(--pink)}

/* Abstände auf der 8er-Skala */
.head{margin-bottom:clamp(48px,6vw,64px)}
.hero .lead{margin-top:24px}
.hero .ctas{margin-top:32px}

/* Reveal: Startzustand im CSS, kein Blitz */
.js [data-rv]{opacity:0}
.js [data-rv].in{opacity:1}

/* Mobil */
.hero .grid>*{min-width:0}
.hero h1{font-size:min(clamp(38px,6.4vw,78px),11vw);overflow-wrap:normal;word-break:keep-all}
@media (max-width:900px){.hero h1{font-size:min(clamp(38px,9vw,78px),11vw)}}
.hero.slim h1{font-size:min(clamp(36px,7vw,104px),10.5vw)}
@media (max-width:620px){
  .kicker{font-size:10.5px;letter-spacing:.12em}
  .lead{font-size:16px;line-height:1.5}
  .card-ink{box-shadow:var(--sh)}
}

/* Mobil-Menü */
.menu-btn{display:none;margin-left:auto;border:2px solid var(--ink);background:none;color:var(--ink);font:700 11.5px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;padding:9px 12px;border-radius:999px;cursor:pointer}
@media (max-width:980px){
  .menu-btn{display:inline-flex}
  .nav .pill{display:none}
  .nav.open ul{display:grid;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:var(--bw) solid var(--ink);padding:12px var(--gutter) 20px;gap:4px;margin:0}
  .nav.open ul a{display:block;padding:12px 10px;font-size:13px}
  .nav{position:sticky}
}

/* ===== Auftakt: Wortmarke zeichnet sich, das Dreieck fliegt ein, dann hebt sich der Vorhang ===== */
.intro{position:fixed;inset:0;z-index:200;background:var(--paper);display:grid;place-items:center;animation:introOut .55s var(--ease) 1.75s both;pointer-events:none}
@keyframes introOut{to{opacity:0;visibility:hidden}}
.intro-logo{width:min(72vw,760px)}
.intro-logo svg{width:100%;height:auto;color:var(--ink);display:block;overflow:visible}
.intro-logo .wm-type{clip-path:inset(0 100% 0 0);animation:wipe .9s var(--ease) .15s forwards}
.intro-logo .wm-mark{transform-box:fill-box;transform-origin:center;opacity:0;animation:flyin .75s cubic-bezier(.2,.7,.1,1) .85s forwards}
@keyframes flyin{0%{opacity:0;transform:translate(520px,-640px) rotate(-220deg) scale(3.2)}65%{opacity:1;transform:translate(0,-14px) rotate(10deg) scale(1.15)}85%{transform:translate(0,4px) rotate(-3deg) scale(.96)}100%{opacity:1;transform:none}}
.has-intro .hero h1 span{animation-delay:1.85s}
.has-intro .hero h1 .l2{animation-delay:1.93s}
.has-intro .hero h1 .l3{animation-delay:2.01s}
.intro-done .intro,.no-intro .intro{display:none}
@media (prefers-reduced-motion:reduce){.intro{display:none}}
.hero{position:relative;overflow:hidden}
.hero .wrap,.hero .specs{position:relative;z-index:1}
.hero-wm{position:absolute;left:-2%;bottom:-7%;width:64%;pointer-events:none;z-index:0;color:var(--ink)}
.hero-wm svg{width:100%;height:auto;display:block;overflow:visible}
.hero-wm .wm-type{opacity:.055}
.hero-wm .wm-mark{opacity:.5}
@media (max-width:900px){.hero-wm{width:120%;left:-10%;bottom:-3%}}

/* Alex, 06.10.: Pink als Schlagschatten für die Ringbühne und die Coaching-Kacheln */
.rings-lg{box-shadow:8px 8px 0 var(--pink)}
.incl-grid li{box-shadow:8px 8px 0 var(--pink)}
.incl-grid li:hover{transform:translate(-3px,-4px);box-shadow:12px 12px 0 var(--pink)}

/* ===== Kirby-Blöcke im Beitrag ===== */
.post-body h2{font-size:clamp(24px,2.6vw,34px);margin:44px 0 16px;letter-spacing:-.03em}
.post-body h3{font-size:clamp(20px,2vw,26px);margin:32px 0 12px}
.post-body ul,.post-body ol{padding-left:22px;margin:0 0 22px;display:grid;gap:8px;font-size:17px;line-height:1.6}
.post-body figure{margin:0 0 26px}
.post-body figure img{width:100%;height:auto;border:var(--bw) solid var(--ink);box-shadow:var(--sh)}
.post-body figcaption{font-size:13px;color:var(--soft2);margin-top:8px}
.post-body blockquote{border-left:6px solid var(--yellow);background:var(--band);padding:18px 22px;margin:0 0 22px;font-size:16px}
.post-body blockquote p{margin:0}
.post-body a{background:linear-gradient(var(--yellow),var(--yellow)) no-repeat 0 100%/100% 3px;text-decoration:none;transition:background-size .3s var(--ease)}
.post-body a:hover{background-size:100% 55%}
.post-body pre{overflow-x:auto;background:var(--band);padding:16px;font-size:14px}
.post-body em{font-style:italic}
.nl-consent{max-width:60ch;margin-top:10px}
.nl-status:empty{display:none}
.nl-status{font-weight:600;color:var(--ink)}