/* Klickpfad v4 — geteiltes Chrome (Basis, Nav, Footer, Buttons, Labels).
   Quelle: dist/index.html (v4-Startseite). Für alle neuen v4-Unterseiten.
   Startseite behält ihr Inline-CSS — hier nichts löschen, ohne sie zu prüfen. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#FDFBF5;--ink:#111111;--accent:#E8302A;--hi:#F7CB46;--pink:#FE90E8;--blue:#C0F7FE;--green:#99E885;--muted:#6B6860;--surface:#F0EDE6;--cy:#00F5D4;--mg:#FF2D78;--or:#FF6B35;--night:#160B2E;--fh:'Space Grotesk',sans-serif;--fb:'Plus Jakarta Sans',sans-serif;--fm:'JetBrains Mono',monospace;--bdw:3px solid #111}
html{scroll-behavior:smooth}
body{background:var(--night);color:var(--ink);font-family:var(--fb);font-size:16px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:var(--ink)}
a:hover{color:var(--accent)}
img{max-width:100%;display:block}
.nav{position:fixed;top:8px;left:50%;z-index:300;height:64px;width:1200px;max-width:calc(100% - 24px);display:flex;align-items:center;justify-content:space-between;gap:32px;padding:0 14px 0 20px;background:rgba(253,251,245,.86);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border:var(--bdw);border-radius:12px;box-shadow:5px 5px 0 var(--ink);transition:transform .45s cubic-bezier(.2,.75,.25,1),background .3s,box-shadow .3s,border-color .3s;transform:translate(-50%,-160%)}
.nav.ready{transform:translate(-50%,0)}
.nav.hide{transform:translate(-50%,-100%)}
.nav.solid{background:var(--bg);border-bottom-color:rgba(17,17,17,.85);box-shadow:0 2px 0 rgba(17,17,17,.85),0 10px 28px rgba(17,17,17,.1)}
.nav-logo img{height:36px;width:auto;display:block}
.nav-links{display:flex;gap:2px;list-style:none;align-items:center;position:relative}
.nav-links li{display:flex}
.nav-links a{position:relative;z-index:2;font-family:var(--fh);font-size:14.5px;font-weight:700;color:var(--ink);text-decoration:none;padding:10px 16px;border-radius:5px;transition:color .3s}
.nav-links a.on{color:var(--ink)}
.nav-links a:hover{color:var(--mg)}
.nav-hl{position:absolute;z-index:1;top:50%;left:0;height:38px;transform:translate(0,-50%);background:var(--hi);border:2px solid var(--ink);border-radius:6px;transition:transform .42s cubic-bezier(.34,1.28,.5,1),width .42s cubic-bezier(.34,1.28,.5,1),opacity .3s;pointer-events:none;opacity:0}
.nav-hl.show{opacity:1}
.nav-cta{font-family:var(--fh);font-weight:700;font-size:14px;background:var(--hi);color:var(--ink);border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:8px 16px;border-radius:5px;text-decoration:none;white-space:nowrap;transform:translateY(-2px);transition:box-shadow .15s,transform .15s}
.nav-cta:hover{box-shadow:1px 1px 0 var(--ink);transform:translate(3px,1px);color:var(--ink)}
.nav-links li.m-cta{display:none}
.nav-burger{display:none;flex-direction:column;gap:5px;width:44px;height:44px;align-items:center;justify-content:center;background:none;border:2px solid var(--ink);border-radius:5px;cursor:pointer;padding:0}
.nav-burger span{display:block;width:20px;height:2.5px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .3s}
.nav-burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
@media(max-width:900px){
.nav-burger{display:flex}
.nav>.nav-cta{display:none}
.nav-links{position:fixed;top:80px;right:clamp(12px,4vw,24px);left:auto;width:min(300px,calc(100vw - 24px));flex-direction:column;gap:0;align-items:stretch;background:var(--bg);border:var(--bdw);border-radius:8px;box-shadow:8px 8px 0 var(--ink),0 20px 40px rgba(17,17,17,.2);padding:8px 14px 14px;transform:translateY(-12px) scale(.98);transform-origin:top right;opacity:0;visibility:hidden;transition:opacity .28s,transform .28s cubic-bezier(.2,.9,.3,1),visibility .28s}
.nav-links.open{opacity:1;visibility:visible;transform:none}
.nav-links li{display:block;opacity:0;transform:translateY(-10px);transition:opacity .35s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.nav-links.open li{opacity:1;transform:none}
.nav-links.open li:nth-of-type(1){transition-delay:.05s}
.nav-links.open li:nth-of-type(2){transition-delay:.10s}
.nav-links.open li:nth-of-type(3){transition-delay:.15s}
.nav-links.open li:nth-of-type(4){transition-delay:.20s}
.nav-links.open li:nth-of-type(5){transition-delay:.25s}
.nav-links.open li:nth-of-type(6){transition-delay:.32s}
.nav-links a{padding:15px 12px;border-bottom:1.5px solid rgba(17,17,17,.1);border-radius:0;font-size:17px}
.nav-links a.on{color:var(--mg)}
.nav-links li.m-cta{display:block;margin-top:18px}
.nav-links li.m-cta .nav-cta{display:block;white-space:normal;text-align:center;font-size:15px;line-height:1.3}
.nav-hl{display:none}
}
@keyframes pdot{0%,100%{opacity:1}50%{opacity:.25}}
.btn-main{font-family:var(--fh);font-weight:700;font-size:16px;background:var(--hi);color:var(--ink);border:var(--bdw);box-shadow:5px 5px 0 #111;padding:17px 34px;text-decoration:none;display:inline-block;cursor:pointer;transition:box-shadow .15s,transform .15s;position:relative;overflow:hidden}
.btn-play{display:inline-block;width:0;height:0;border-top:.6em solid transparent;border-bottom:.6em solid transparent;border-left:.85em solid currentColor;margin-right:.45em;vertical-align:-.08em}
.btn-main::after{content:'';position:absolute;inset:-40% -60%;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.65) 50%,transparent 58%);transform:translateX(-130%);animation:sweep 3.4s ease 3s infinite}
@keyframes sweep{0%{transform:translateX(-130%)}34%,100%{transform:translateX(130%)}}
.btn-main:hover{box-shadow:2px 2px 0 var(--ink);transform:translate(3px,3px);color:var(--ink)}
.btn-ghost{font-family:var(--fh);font-weight:700;font-size:16px;background:rgba(253,251,245,.94);color:var(--ink);border:var(--bdw);box-shadow:5px 5px 0 #111;padding:17px 34px;text-decoration:none;display:inline-block;transition:all .15s}
.btn-ghost:hover{background:var(--ink);color:#fff;box-shadow:2px 2px 0 #000;transform:translate(3px,3px)}
.lvl{font-family:var(--fm);font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;padding:6px 14px;margin-bottom:34px;border:2px solid var(--ink)}
.lvl.hi{background:var(--hi)}
.lvl.pink{background:var(--pink)}
.lvl.inv{background:var(--night);color:var(--cy);border-color:var(--cy);box-shadow:0 0 14px rgba(0,245,212,.35)}
.wrap{max-width:1200px;margin:0 auto;position:relative;z-index:2}
.sec-h2{font-family:var(--fh);font-size:clamp(32px,4.6vw,64px);font-weight:800;letter-spacing:-2px;line-height:1.02;text-wrap:balance}
.foot{background:var(--ink);color:rgba(253,251,245,.65)}
.foot-top{max-width:1200px;margin:0 auto;padding:clamp(48px,6vw,72px) clamp(20px,5vw,64px);display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:clamp(28px,4vw,56px);border-bottom:1.5px solid rgba(253,251,245,.18)}
.foot-brand{align-self:start;margin-top:-20px}
.foot-brand img{height:110px;width:auto;margin-bottom:12px;display:block}
.foot-brand p{font-size:14px;line-height:1.6;color:rgba(253,251,245,.55);max-width:38ch}
.foot-h{font-family:var(--fh);font-weight:700;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--bg);margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid var(--hi);display:inline-block}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot ul a{font-size:14px;color:rgba(253,251,245,.7);text-decoration:none;transition:color .15s,padding-left .15s}
.foot ul a:hover{color:var(--bg);padding-left:6px}
.foot-tag{max-width:1200px;margin:0 auto;padding:20px clamp(20px,5vw,64px);border-bottom:1.5px solid rgba(253,251,245,.18);font-family:var(--fm);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:rgba(253,251,245,.5)}
.foot-tag b{display:block;font-family:var(--fh);font-size:12px;letter-spacing:1.5px;color:rgba(247,203,70,.9);margin-top:5px}
.foot-bot{max-width:1200px;margin:0 auto;padding:20px clamp(20px,5vw,64px);display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.foot-copy,.foot-legal a{font-family:var(--fm);font-size:11px;letter-spacing:1px;color:rgba(253,251,245,.45);text-decoration:none}
.foot-legal{display:flex;gap:18px}
.foot-legal a:hover{color:var(--bg)}
@media(max-width:900px){
.foot-top{grid-template-columns:1fr 1fr}
.foot-brand{grid-column:1/-1}
}
@media(max-width:540px){
.foot-top{grid-template-columns:1fr}
}
@media(max-width:560px){
.foot-brand{margin-top:0}
}
.btn-main,.btn-ghost,.cta-btn,.mis-go,.mcard,.faq-item,.os-card,.mis-body,.crew-band,.crew-tag,.pfad-dot,.lvl,.hero-eyebrow,.sol-branchen span,.philo-kicker,.faq-item summary::after{border-radius:5px}
@media(prefers-reduced-motion:reduce){
.nav{transform:translate(-50%,0);transition:none}
.nav.hide{transform:translate(-50%,0)}
}