@font-face{font-family:Inter;font-style:normal;font-weight:400 600;font-display:swap;src:url(../assets/fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:Inter;font-style:normal;font-weight:400 600;font-display:swap;src:url(../assets/fonts/inter-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+1E00-1EFF}
@font-face{font-family:Manrope;font-style:normal;font-weight:500 800;font-display:swap;src:url(../assets/fonts/manrope-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2212}
@font-face{font-family:Manrope;font-style:normal;font-weight:500 800;font-display:swap;src:url(../assets/fonts/manrope-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+1E00-1EFF}
:root{--g:#1A1D21;--g2:#22262B;--g3:#2C3137;--t:#F2F3F5;--m:#B4BAC2;--ice:#5FA8D3;--sage:#A9C2AE;--r:18px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--g);color:var(--t);font:400 1.0625rem/1.65 Inter,system-ui,sans-serif;overflow-x:hidden}
h1,h2{font-family:Manrope,Inter,sans-serif;font-weight:700;line-height:1.15;letter-spacing:-.01em;margin:0 0 .6em}
h1{font-size:clamp(1.9rem,1.2rem + 3vw,3.2rem)}
h2{font-size:clamp(1.45rem,1.1rem + 1.6vw,2.2rem)}
.h-hero{font-size:clamp(1.9rem,1.1rem + 3.4vw,3.4rem)}
p{margin:0 0 1em}
a{color:var(--ice)}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:1rem;top:-4rem;background:var(--t);color:var(--g);padding:.7rem 1rem;border-radius:8px;z-index:10}
.skip:focus{top:1rem}
:focus-visible{outline:3px solid var(--ice);outline-offset:3px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.demo-bar{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem 1rem;padding:.5rem 1.25rem;padding-top:max(.5rem,env(safe-area-inset-top));background:#5FA8D3;color:#111316;font-size:.9375rem;line-height:1.35}
.demo-bar p{margin:0}
.demo-bar-nav{display:flex;gap:.25rem}
.demo-bar-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 .7rem;color:#111316;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.demo-bar a:focus-visible{outline-color:#111316}
@media (max-width:600px){.demo-bar-sub{display:none}.demo-bar{padding-inline:.75rem}}
.eyebrow{color:var(--sage);font-weight:600;font-size:.875rem;letter-spacing:.06em;text-transform:uppercase}
.lead{font-size:clamp(1.05rem,1rem + .4vw,1.25rem);color:var(--m);max-width:62ch}
.intro{padding:clamp(3rem,8vw,6rem) 0 3rem}
.note-card{margin-top:2rem;padding:1.25rem 1.4rem;background:var(--g2);border-radius:var(--r);max-width:70ch}
.note-label{font-weight:600;color:var(--t)}
.fx{display:inline-block;margin-left:.35rem;padding:.1rem .55rem;border-radius:999px;background:#3A3F46;color:#F2F3F5;font:600 .75rem/1.5 Inter,sans-serif;letter-spacing:.02em;vertical-align:middle;white-space:nowrap}
.path{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:2rem 0 0;counter-reset:p}
.path li{counter-increment:p}
.path a{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:0 1rem;border-radius:999px;background:var(--g3);color:var(--t);text-decoration:none;font-weight:600}
.path a::before{content:counter(p);display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--ice);color:var(--g);font-size:.8rem}
.stage{margin:2rem auto;width:min(1200px,100% - 1rem);background:linear-gradient(180deg,#20242A,#1C1F24);border-radius:28px;padding:1rem 0 2rem;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.stage-tag{display:block;width:min(1120px,100% - 2.5rem);margin:1rem auto 0;color:var(--m);font-size:.875rem;font-weight:600}
.hero{display:grid;gap:2.5rem;padding:clamp(2rem,6vw,4.5rem) 0;align-items:center}
@media (min-width:900px){.hero{grid-template-columns:1.1fr .9fr}}
.brand-fx{font-family:Manrope,sans-serif;font-weight:700;color:var(--sage)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.75rem 1.4rem;border-radius:999px;background:var(--ice);color:#0F1215;font-weight:600;text-decoration:none;border:0;font-size:1rem;cursor:pointer;text-align:center}
.btn:hover{background:#7DBBE0}
.btn-ghost{background:transparent;color:var(--t);box-shadow:inset 0 0 0 2px var(--ice)}
.btn-ghost:hover{background:rgba(95,168,211,.12)}
.hero-visual{position:relative;aspect-ratio:1/1;max-width:460px;width:100%;justify-self:center}
.week{position:absolute;inset:0;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(7,1fr);gap:6px;padding:6px}
.wk-c{border-radius:6px;background:#2A2F35}
.wk-busy{background:#3B4249}
.wk-keep{background:var(--sage);box-shadow:0 0 24px rgba(169,194,174,.45)}
.portrait{position:absolute;right:-4%;bottom:-6%;width:46%;aspect-ratio:4/5;border-radius:20px}
.sec{padding:clamp(2.5rem,6vw,4.5rem) 0}
.cards{list-style:none;padding:0;margin:0 0 1.5rem;display:grid;gap:1rem}
@media (min-width:768px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--g3);border-radius:var(--r);padding:1.4rem}
.bridge{font-family:Manrope,sans-serif;font-weight:700;font-size:1.25rem;color:var(--sage)}
.freebie{display:grid;gap:2.5rem;align-items:center}
@media (min-width:900px){.freebie{grid-template-columns:.8fr 1.2fr}}
.ticks{list-style:none;padding:0;margin:0 0 1.75rem}
.ticks li{position:relative;padding-left:2rem;margin-bottom:.7rem}
.ticks li::before{content:"";position:absolute;left:0;top:.35em;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--sage)}
.about-text{font-size:clamp(1.15rem,1rem + .8vw,1.5rem);line-height:1.55;max-width:46ch;font-family:Manrope,sans-serif;font-weight:500}
.steps{list-style:none;padding:0;margin:0;display:grid;gap:1rem}
@media (min-width:768px){.steps{grid-template-columns:repeat(3,1fr)}}
.steps li{background:var(--g2);border-radius:var(--r);padding:1.4rem}
.step-n{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--ice);color:var(--g);font:800 1.1rem Manrope,sans-serif;margin-bottom:.8rem}
.faq{max-width:760px}
.faq details{background:var(--g2);border-radius:14px;margin-bottom:.6rem}
.faq summary{min-height:48px;display:flex;align-items:center;padding:.6rem 1.2rem;cursor:pointer;font-weight:600;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";margin-left:auto;padding-left:1rem;color:var(--ice);font-size:1.3rem}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 1.2rem 1rem;margin:0;color:var(--m)}
.form-sec{max-width:640px}
.demo-hint{display:inline-block;padding:.35rem .8rem;border-radius:8px;background:#5FA8D3;color:#111316;font-weight:700}
.lead-form{display:grid;gap:1rem;margin-top:.5rem}
.field label{display:block;font-weight:600;margin-bottom:.35rem}
.field input{width:100%;min-height:48px;padding:.6rem .9rem;border-radius:12px;border:1px solid #59616A;background:#14171A;color:var(--t);font:inherit}
.check{display:flex;gap:.75rem;align-items:flex-start;color:var(--m);font-size:.9375rem}
.check input{width:24px;height:24px;margin:.1rem 0 0;flex:none;accent-color:var(--ice)}
.check label{padding:.1rem 0}
.form-status{min-height:1.65em;margin:0;color:var(--sage);font-weight:600}
.legal{margin-top:1.25rem;font-size:.9rem;color:var(--m)}
.legal a{display:inline-flex;align-items:center;min-height:44px;padding:0 .25rem}
.thanks{text-align:center;max-width:760px}
.thanks .lead{margin-inline:auto}
.inbox{list-style:none;padding:0;margin:0;display:grid;gap:.75rem;max-width:760px}
.mail{display:grid;grid-template-columns:5.5rem 1fr;gap:.2rem 1rem;background:var(--g3);border-radius:14px;padding:1rem 1.2rem}
.mail-when{grid-row:span 2;color:var(--sage);font-weight:700}
.mail-subj{font-weight:600}
.mail-txt{color:var(--m);font-size:.9375rem}
.outro{padding:clamp(3rem,8vw,6rem) 0;text-align:center}
.outro .lead{margin-inline:auto}
.small{font-size:.875rem;color:var(--m);margin-top:1.5rem}
.foot{background:#15181B;padding:2rem 0 calc(2rem + env(safe-area-inset-bottom))}
.foot-in{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;color:var(--m);font-size:.9rem}
.foot-in p{margin:0}
.foot nav{display:flex;flex-wrap:wrap;gap:.25rem}
.foot a{display:inline-flex;align-items:center;min-height:44px;padding:0 .6rem;color:var(--t)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.surface{position:relative;display:grid;place-items:center;padding:1rem;background:#22262B;border:1px solid rgba(242,243,245,.08);text-align:center;overflow:hidden}
.surface>*{position:relative}
.glow-sage{background:radial-gradient(120% 80% at 30% 20%,rgba(169,194,174,.16),transparent 60%),#22262B}
.glow-ice{background:radial-gradient(90% 120% at 15% 0%,rgba(95,168,211,.14),transparent 60%),#22262B}
.portrait{align-content:end}
.freebie-fig{margin:0;justify-self:center;width:100%;max-width:300px;text-align:center}
.booklet{position:relative;display:flex;flex-direction:column;justify-content:flex-start;aspect-ratio:3/4;padding:1.6rem 1.4rem;border-radius:6px 14px 14px 6px;background:radial-gradient(110% 70% at 80% 10%,rgba(169,194,174,.22),transparent 60%),#22262B;border:1px solid rgba(242,243,245,.08);box-shadow:inset 10px 0 0 -4px #1A1D21,inset 12px 0 14px -10px rgba(0,0,0,.6),0 24px 50px rgba(0,0,0,.35);text-align:left;margin-bottom:.75rem}
.booklet-num{font:800 clamp(5rem,4rem + 4vw,7rem)/.9 Manrope,sans-serif;color:#A9C2AE}
.booklet-title{margin-top:.75rem;font:700 1.25rem/1.25 Manrope,sans-serif;color:#F2F3F5}
.booklet-lines{margin-top:auto;height:3.2rem;background:repeating-linear-gradient(180deg,rgba(242,243,245,.1) 0 2px,transparent 2px 14px)}
.stimmen-card{max-width:560px;justify-items:start;text-align:left;border-radius:14px;padding:1rem 1.25rem}
.stimmen-card p{margin:0 0 .25rem;color:#B4BAC2;font-size:.9375rem}
.btn[disabled]{cursor:not-allowed;opacity:.75}
.btn[disabled]:hover{background:transparent}
.demo-btn-row{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;align-items:center}
.portrait{padding-bottom:1.25rem}
.portrait-photo{margin:0;padding:0;display:block;overflow:visible;background:none;border:0}
.portrait-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%;border-radius:20px;border:1px solid rgba(242,243,245,.08)}
.portrait-photo figcaption{position:absolute;top:calc(100% + .5rem);left:0;width:max-content;max-width:15rem;padding:.3rem .7rem;border-radius:10px;border:1px solid rgba(242,243,245,.22);background:#15181B;color:#F2F3F5;box-shadow:0 6px 18px rgba(0,0,0,.35);font:600 .8125rem/1.4 Inter,sans-serif;letter-spacing:.01em;text-align:left}