@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{--ink:#10171b;--ink2:#19252b;--paper:#f4f2ec;--paper2:#e8e5dc;--text:#f5f3ed;--muted:#aab5b7;--accent:#bbdf93;--copper:#e6a374;--electric:#8fd4d3;--violet:#a8a1ec;--line:rgba(255,255,255,.18);--font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}::selection{background:#bbdf93;color:#12191b}
.topbar{z-index:30;position:absolute;top:0;left:0;right:0;height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5vw,90px);color:white}.brand{display:flex;align-items:center;gap:14px;min-width:0}.brand-mark{width:62px;height:62px;display:block;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(0,0,0,.35))}.brand-text{display:flex;flex-direction:column;gap:3px;min-width:0}.brand-name{font-weight:850;letter-spacing:-.07em;font-size:28px;line-height:1;color:var(--text)}.brand-tag{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#a9b7b3;white-space:nowrap}.navright{display:flex;gap:30px;align-items:center;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.navright a{opacity:.85}.navright a:hover{opacity:1}.navright .outline{padding:13px 19px;border:1px solid #95a2a5;border-radius:100px}
.scroll-stage{height:330vh;background:var(--ink);position:relative}.sticky{height:100svh;min-height:580px;position:sticky;top:0;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse 45% 48% at 82% 34%,#254346 0%,transparent 72%),radial-gradient(ellipse 42% 45% at 2% 88%,#40372e 0%,transparent 78%),#10171b}
.grain{pointer-events:none;position:absolute;inset:0;z-index:17;opacity:.20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.19'/%3E%3C/svg%3E")}
.stage-grid{position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(219,235,227,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(219,235,227,.045) 1px,transparent 1px);background-size:76px 76px;mask-image:linear-gradient(to bottom,transparent,black 20%,black 90%,transparent);transform:perspective(600px) rotateX(11deg) scale(1.2);transform-origin:center center}
.orb{position:absolute;border-radius:50%;filter:blur(3px);pointer-events:none}.orb.one{width:45vw;height:45vw;background:radial-gradient(circle,rgba(123,211,203,.25),transparent 70%);top:10%;right:2%}.orb.two{width:37vw;height:37vw;background:radial-gradient(circle,rgba(232,146,100,.20),transparent 70%);bottom:-15%;left:-6%}
.panel{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:110px clamp(24px,9vw,160px) 70px;pointer-events:none}.panel>*{max-width:920px}.eyebrow{color:var(--accent);font-size:11px;letter-spacing:.25em;font-weight:750;text-transform:uppercase;margin:0 0 24px}.panel h1,.panel h2{color:var(--text);letter-spacing:-.067em;font-weight:650;line-height:1.02;margin:0;font-size:clamp(46px,7.1vw,116px)}.panel .line-em{display:block;color:var(--copper)}.panel .intro{color:#c8d0cc;font-size:clamp(14px,1.25vw,18px);line-height:1.65;max-width:520px;margin:32px 0 0}.panel .index{position:absolute;bottom:38px;left:clamp(24px,9vw,160px);color:#acb8b4;font-size:11px;letter-spacing:.2em}.panel .scroll-note{position:absolute;bottom:38px;right:clamp(24px,5vw,90px);color:#acb8b4;font-size:11px;letter-spacing:.16em;display:flex;gap:12px;align-items:center}.scroll-note .line{height:1px;width:46px;background:#a7b6b1}
#problem{opacity:1;transform:translateY(0)}#diagnosis,#resolution{opacity:0;transform:translateY(35px)}#diagnosis h2{font-size:clamp(44px,6.7vw,98px)}#resolution h2{font-size:clamp(49px,7vw,104px)}
.nodes{position:absolute;inset:0;z-index:3;pointer-events:none;perspective:1000px}.node{position:absolute;left:50%;top:50%;padding:18px 22px;border:1px solid rgba(209,230,219,.29);border-radius:8px;background:linear-gradient(130deg,rgba(105,142,145,.16),rgba(25,40,44,.6));box-shadow:0 24px 70px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.10);color:#e4eeeb;white-space:nowrap;letter-spacing:.14em;text-transform:uppercase;font-size:11px;font-weight:750;backdrop-filter:blur(9px);will-change:transform,opacity}.node[data-id="social"]{font-size:10px;letter-spacing:.075em;padding:16px 18px;border-color:rgba(187,223,147,.6)}.node:nth-child(2){border-color:rgba(143,212,211,.52)}.node:nth-child(3){border-color:rgba(230,163,116,.6)}.node:nth-child(4){border-color:rgba(168,161,236,.6)}.node .dot{width:6px;height:6px;display:inline-block;background:var(--electric);border-radius:50%;margin-right:14px;vertical-align:middle}.node::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 45px rgba(182,224,194,.05)}
.connector{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible;opacity:0;pointer-events:none}.connector line{stroke:#b2cfbc;stroke-width:1.15;stroke-dasharray:4 8;opacity:.65}.connector circle{fill:#c8dbcb}.core{position:absolute;top:50%;left:50%;z-index:5;transform:translate(-50%,-50%) scale(.45);opacity:0;width:min(30vw,290px);height:min(30vw,290px);min-width:180px;min-height:180px;border:1px solid rgba(211,232,214,.40);background:radial-gradient(circle at 35% 25%,rgba(55,84,78,.72),rgba(20,37,42,.92) 70%);border-radius:24px;box-shadow:0 0 110px #a9d0b622,0 40px 100px #0008;display:grid;place-items:center;will-change:transform,opacity;overflow:hidden;padding:18px}.core:before{content:"";position:absolute;inset:-18px;border:1px solid rgba(190,218,200,.16);border-radius:24%;transform:rotate(16deg)}.core img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 18px rgba(0,0,0,.28))}
.rail{height:3px;position:absolute;bottom:0;left:0;right:0;background:#ffffff21;z-index:20}.rail>span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--electric),var(--accent),var(--copper))}
.paper{position:relative;background:radial-gradient(circle at 97% 13%,rgba(143,212,211,.16),transparent 30%),var(--paper);padding:clamp(90px,10vw,175px) clamp(24px,9vw,160px)}.paper-header{font-size:11px;font-weight:760;letter-spacing:.23em;text-transform:uppercase;color:#6e8078;margin-bottom:26px}.paper h2{font-size:clamp(42px,6.1vw,90px);max-width:1060px;line-height:1.06;letter-spacing:-.065em;font-weight:650;margin:0 0 45px}.paper .lead{font-size:clamp(17px,2vw,26px);line-height:1.5;color:#56635e;max-width:760px}.pill{border:1px solid #52605d;border-radius:999px;display:inline-flex;align-items:center;gap:25px;padding:16px 22px;font-size:12px;letter-spacing:.07em;text-transform:uppercase;font-weight:720;margin-top:26px;transition:background .2s,color .2s}.pill:hover{background:var(--ink);color:white}.pill{background:var(--accent);border-color:var(--accent);color:var(--ink)}
.services{display:grid;grid-template-columns:repeat(3,1fr);margin-top:100px;border-top:1px solid #bfc5bc}.service:nth-child(1) h3:before{background:var(--accent)}.service:nth-child(2) h3:before{background:var(--electric)}.service:nth-child(3) h3:before{background:var(--copper)}.service h3:before{content:"";display:block;width:35px;height:5px;border-radius:6px;margin-bottom:24px}.service{padding:30px 28px 70px 0;border-right:1px solid #c6cbc3;margin-right:28px}.service:last-child{border-right:0;margin-right:0}.num{color:#798a80;font-size:12px;margin-bottom:65px}.service h3{font-size:clamp(23px,2.6vw,36px);letter-spacing:-.045em;line-height:1.12;margin:0 0 18px}.service p{font-size:15px;line-height:1.7;color:#626e68;max-width:280px}.end{background:var(--ink);color:white;padding:100px clamp(24px,9vw,160px)}.end h2{letter-spacing:-.06em;font-weight:650;font-size:clamp(40px,6vw,82px);line-height:1.1;max-width:940px;margin:0 0 30px}.end a{display:inline-block;border-bottom:1px solid var(--accent);padding:10px 0;color:var(--accent)}.footer{display:flex;justify-content:space-between;gap:16px;padding-top:100px;font-size:11px;letter-spacing:.1em;color:#b0c2b8;text-transform:uppercase}
@media(max-width:760px){
.topbar{height:70px;padding:0 20px}.navright{gap:0}.navright a:not(.outline){display:none}.navright .outline{padding:10px 13px;font-size:9px}.brand{gap:10px}.brand-mark{width:46px;height:46px}.brand-name{font-size:21px}.brand-tag{font-size:8px;letter-spacing:.14em}
.scroll-stage{height:275svh}.sticky{height:100svh;min-height:0;overflow:hidden}.stage-grid{opacity:.45;background-size:48px 48px}.panel{justify-content:center;padding:86px 22px 68px;max-width:100%;width:100%;align-items:flex-start}.panel>*{max-width:100%}.panel h1,.panel h2,#diagnosis h2,#resolution h2{font-size:clamp(34px,8.5vw,58px);line-height:1.07;max-width:100%;letter-spacing:-.065em;overflow-wrap:normal}.panel .eyebrow{font-size:9px;line-height:1.5;letter-spacing:.16em;margin-bottom:18px;max-width:285px}.panel .intro{max-width:34ch;font-size:clamp(12px,3.3vw,15px);line-height:1.55;margin-top:22px}.panel .index{left:22px;bottom:max(21px,env(safe-area-inset-bottom))}.panel .scroll-note{right:22px;bottom:max(21px,env(safe-area-inset-bottom));font-size:8px;letter-spacing:.06em;gap:6px}.scroll-note .line{width:14px}
.nodes,.connector,.core{display:none!important}.orb.one{width:110vw;height:110vw;right:-45%;top:2%;filter:blur(14px)}.orb.one{animation:softfloat 11s ease-in-out infinite alternate}.orb.two{animation:softfloat 13s ease-in-out infinite alternate-reverse}@keyframes softfloat{from{transform:translate3d(0,-8px,0) scale(.95)}to{transform:translate3d(20px,18px,0) scale(1.12)}}.orb.two{width:110vw;height:110vw;left:-53%;bottom:-10%;filter:blur(20px)}
.paper{padding:80px 22px}.paper h2{font-size:clamp(37px,10vw,60px)}.paper .lead{font-size:17px}.services{grid-template-columns:1fr;margin-top:64px}.service{padding:24px 0 30px;border-right:0;border-bottom:1px solid #c6cbc3;margin:0}.num{margin-bottom:24px}.end{padding:78px 22px}.footer{padding-top:70px;flex-direction:column}
}
@media(max-width:380px){.panel h1,.panel h2,#diagnosis h2,#resolution h2{font-size:clamp(30px,8vw,38px)}.panel{padding-top:76px;padding-bottom:55px}.panel .intro{font-size:12px;line-height:1.45;margin-top:16px}.panel .eyebrow{margin-bottom:12px}.scroll-note .line{display:none}}
@media(max-height:610px) and (max-width:760px){.panel{justify-content:center;padding-top:70px;padding-bottom:43px}.panel h1,.panel h2,#diagnosis h2,#resolution h2{font-size:clamp(29px,7.6vw,42px)}.panel .intro{font-size:12px;line-height:1.38;margin-top:12px}.panel .eyebrow{margin-bottom:8px}.panel .index,.panel .scroll-note{bottom:12px}}
@media(prefers-reduced-motion:reduce){.orb{animation:none!important}html{scroll-behavior:auto}.node,.core,.panel{transition:none!important}.pill{transition:none}}
@media(prefers-reduced-motion:reduce){.scroll-stage{height:auto!important}.sticky{position:relative!important;height:auto!important;min-height:0!important;padding-top:66px}.panel{position:relative!important;opacity:1!important;visibility:visible!important;transform:none!important;min-height:68svh;pointer-events:auto}.nodes,.core,.connector,.rail{display:none!important}.panel .scroll-note{display:none}}

/* Founder: editorial warmth between problem-solving and capabilities */
.founder{background:#eae5dc;padding:clamp(76px,8vw,132px) clamp(24px,9vw,160px);display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1fr);gap:clamp(36px,7vw,120px);align-items:center;position:relative;overflow:hidden}
.founder::before{content:"";position:absolute;width:480px;height:480px;right:-220px;bottom:-230px;border-radius:50%;background:radial-gradient(circle,rgba(168,161,236,.22),transparent 70%);pointer-events:none}
.founder-photo{margin:0;position:relative;border-radius:6px;overflow:hidden;aspect-ratio:4/4.3;background:#cfb49c;box-shadow:25px 30px 0 rgba(207,157,113,.17)}
.founder-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:53% 28%}
.founder-copy{position:relative;max-width:660px}.founder-kicker{font-size:11px;font-weight:800;letter-spacing:.21em;text-transform:uppercase;color:#8a655b;margin:0 0 22px}
.founder h2{font-weight:650;font-size:clamp(40px,5vw,78px);letter-spacing:-.065em;line-height:1.06;margin:0 0 24px}
.founder h2 em{font-style:normal;color:#9a6654}.founder p{font-size:clamp(16px,1.45vw,19px);color:#4d5551;line-height:1.65;max-width:52ch}
.founder-signature{display:flex;align-items:center;gap:14px;margin-top:34px;padding-top:24px;border-top:1px solid #c4c1b9}.founder-rule{width:37px;height:3px;background:#c98e6e}
.founder-signature strong{display:block;font-size:15px}.founder-signature span{font-size:12px;color:#66706a;display:block;margin-top:3px}
@media(max-width:760px){
/* Mobile: true sticky, scroll-linked crossfades; no normal-flow panel fallback. */
.scroll-stage{height:300vh;height:300svh;position:relative}
.sticky{position:sticky!important;top:0;height:100vh;height:100svh;min-height:0!important;overflow:hidden!important;display:block;padding-top:0;background:#10171b;isolation:isolate}
.panel{position:absolute!important;inset:0!important;display:flex;justify-content:center;min-height:0!important;height:100%;padding:calc(78px + env(safe-area-inset-top,0px)) 22px calc(70px + env(safe-area-inset-bottom,0px))!important;pointer-events:none!important;isolation:isolate;will-change:opacity,transform;overflow:visible}
.panel#problem,.panel#diagnosis,.panel#resolution{background:transparent}
.panel .index{left:22px;bottom:calc(20px + env(safe-area-inset-bottom,0px))}.panel .scroll-note{bottom:calc(20px + env(safe-area-inset-bottom,0px))}
.grain{z-index:1;opacity:.12}.stage-grid{opacity:.35}.orb{display:block;opacity:.6;animation:none!important}.rail{display:block}
/* Keep decorative depth behind content and preserve readable contrast. */
.nodes,.connector{display:none!important}.core{display:grid!important;z-index:3;width:142px;height:142px;min-width:0;min-height:0;top:74%;left:70%;opacity:0;pointer-events:none}
.panel{z-index:9}.grain{pointer-events:none}

.founder{grid-template-columns:1fr;padding:76px 22px 78px;gap:38px}
.founder-photo{aspect-ratio:4/3.8;max-width:540px;width:100%;box-shadow:14px 16px 0 rgba(207,157,113,.15)}
.founder h2{font-size:clamp(38px,10vw,60px)}.founder p{font-size:16px}.founder-kicker{font-size:10px}
}
@media(max-width:380px){.panel{padding-top:calc(68px + env(safe-area-inset-top,0px))!important;padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))!important}.founder{padding-inline:20px}}
@media(prefers-reduced-motion:reduce){.panel{min-height:65svh}}
/* Mobile Safari: preserve the full scene while positioning copy in an independent layer. */
@media(max-width:760px){
 html{overflow-x:clip}body{overflow-x:clip}
 .scroll-stage{height:320svh;contain:none!important;overflow:visible!important}
 .sticky{height:100svh;position:-webkit-sticky!important;position:sticky!important;top:0!important;contain:none!important}
 .panel{transform:translateZ(0);backface-visibility:hidden}
 .panel .eyebrow,.panel h1,.panel h2,.panel .intro{position:relative;z-index:12}
 .panel .intro{max-width:min(35ch,100%)}
 .grain{opacity:.06}
}
@media(max-width:760px) and (max-height:540px){.panel .intro{font-size:11px!important;line-height:1.32!important}}

/* V8: permanently floating light navigation, safe on narrow screens. */
.topbar{position:fixed!important;top:14px!important;left:clamp(12px,2.3vw,36px)!important;right:clamp(12px,2.3vw,36px)!important;width:auto!important;height:74px!important;padding:8px 18px!important;border:1px solid rgba(255,255,255,.78);border-radius:17px;background:rgba(244,242,236,.93);box-shadow:0 12px 45px rgba(12,21,25,.17);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:#10171b!important;z-index:100!important;isolation:isolate}
.brand-name{color:#10171b!important}.brand-tag{color:#485b59!important}.topbar .navright a{color:#182a2c!important;opacity:1}.topbar .navright .outline{background:#1b3132;color:#f4f2ec!important;border-color:#1b3132;white-space:nowrap}.topbar .navright .outline:hover{background:#365558}.topbar .brand-mark{width:53px;height:53px;filter:none}
@media(max-width:760px){
 .topbar{top:calc(8px + env(safe-area-inset-top,0px))!important;left:10px!important;right:10px!important;height:61px!important;padding:6px 9px!important;border-radius:13px;gap:6px}
 .topbar .brand{gap:7px}.topbar .brand-mark{width:39px;height:39px}.topbar .brand-name{font-size:19px}.topbar .brand-tag{font-size:7px;letter-spacing:.05em;white-space:nowrap}.topbar .navright .outline{padding:10px 10px;font-size:9px;letter-spacing:.03em}
 .scroll-stage{height:385svh!important}
 .panel{padding-top:calc(114px + env(safe-area-inset-top,0px))!important;padding-bottom:calc(60px + env(safe-area-inset-bottom,0px))!important}
}
@media(max-width:380px){.topbar .brand-tag{display:none}.topbar .brand-mark{width:36px;height:36px}.panel{padding-top:calc(94px + env(safe-area-inset-top,0px))!important}}
@media(min-width:761px){.scroll-stage{height:355vh!important}}
@media(prefers-reduced-motion:reduce){.scroll-stage{height:auto!important}}

/* V9 — Guided eye movement. Preserve established scroll timeline. */
@media (min-width: 761px) {
  #problem {align-items:flex-start;padding-left:clamp(42px,8vw,145px);padding-right:38vw;}
  #problem > :not(.index):not(.scroll-note) {max-width:790px;}
  #diagnosis {align-items:center;text-align:center;padding-left:18vw;padding-right:18vw;}
  #diagnosis > :not(.index):not(.scroll-note) {max-width:850px;}
  #diagnosis .intro {margin-left:auto;margin-right:auto;}
  #resolution {align-items:flex-end;text-align:left;padding-left:53vw;padding-right:clamp(42px,7vw,130px);}
  #resolution > :not(.index):not(.scroll-note) {width:100%;max-width:650px;}
  #resolution .intro {max-width:550px;}
  #resolution .index,#diagnosis .index {left:clamp(42px,8vw,145px);}
  /* Shift the focal 3D core left as the final message enters from the right. */
  .core {left:32%;}
}
@media (max-width: 760px) {
  .panel#problem,.panel#diagnosis,.panel#resolution {padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right));}
  .panel#problem {align-items:flex-start;text-align:left;}
  .panel#diagnosis {align-items:center;text-align:center;}
  .panel#diagnosis .intro {margin-left:auto;margin-right:auto;}
  .panel#resolution {align-items:flex-start;text-align:left;}
  .panel#resolution .eyebrow {color:var(--electric);}
  .panel#resolution .line-em {color:var(--accent);}
  .panel#diagnosis .line-em {color:var(--violet);}
  .panel#problem > :not(.index):not(.scroll-note),
  .panel#diagnosis > :not(.index):not(.scroll-note),
  .panel#resolution > :not(.index):not(.scroll-note) {max-width:100%;}
  .panel#resolution h2,.panel#diagnosis h2 {overflow-wrap:break-word;}
}

/* V10: Erste Botschaft zentral, mobile-first und visuell frei von Dekoration */
#problem{align-items:center!important;text-align:center!important;padding-inline:clamp(22px,7vw,110px)!important}
#problem > :not(.index):not(.scroll-note){max-width:1100px!important;width:auto!important}
#problem h1{font-size:clamp(48px,7.7vw,124px);max-width:1040px!important;text-wrap:balance}
#problem .eyebrow{margin-inline:auto}
#problem .intro{margin:clamp(20px,3vw,30px) auto 0!important;max-width:630px!important;text-wrap:pretty}
#problem .index{text-align:left}
@media(max-width:760px){
 #problem{padding:calc(106px + env(safe-area-inset-top,0px)) 20px calc(75px + env(safe-area-inset-bottom,0px))!important}
 #problem h1{font-size:clamp(36px,9.4vw,60px)!important;line-height:1.06;max-width:100%!important;overflow-wrap:normal;hyphens:auto}
 #problem .eyebrow{max-width:340px;line-height:1.5}
 #problem .intro{font-size:clamp(13px,3.45vw,16px);max-width:34ch!important;line-height:1.56}
}
@media(max-width:380px){#problem h1{font-size:clamp(32px,9vw,41px)!important}#problem .intro{font-size:12px}}
@media(max-width:760px) and (max-height:610px){#problem{padding-top:90px!important;padding-bottom:46px!important}#problem h1{font-size:clamp(28px,7.6vw,39px)!important}#problem .intro{font-size:12px;margin-top:12px!important}}

/* V11 specialized high-trust visual language */
.trust{background:#e8e5dc;padding:clamp(82px,9vw,145px) clamp(24px,9vw,160px);scroll-margin-top:115px}.trust-top{max-width:1040px}.trust .paper-header{color:#4f7367}.trust h2,.selected h2{font-size:clamp(45px,6.8vw,96px);letter-spacing:-.072em;line-height:1.05;font-weight:650;margin:0 0 28px}.trust h2 em,.selected h2 em{font-style:normal;color:#3a655c}.trust-top>p:last-child,.selected-inner>p{max-width:750px;font-size:clamp(17px,2vw,24px);line-height:1.55;color:#52615b}.trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:65px}.trust-card{background:#f4f2ec;min-height:365px;border-radius:16px;padding:27px;display:flex;flex-direction:column;align-items:flex-start;box-shadow:0 10px 35px #1b322010}.trust-no{font-size:12px;font-weight:750;letter-spacing:.13em;color:#66837b}.trust-visual{font-size:58px;line-height:1;display:grid;place-items:center;margin:26px 0 25px;width:82px;height:82px;border-radius:18px;background:#d4e4c8;color:#28463c}.visual-finance{background:#c6e4e1}.visual-premium{background:#ecd2bd}.trust-card h3{font-size:clamp(23px,2.2vw,31px);line-height:1.12;letter-spacing:-.045em;margin:auto 0 12px}.trust-card p{color:#586660;font-size:15px;line-height:1.6;margin:0}.selected{background:#f4f2ec;padding:clamp(85px,10vw,155px) clamp(24px,9vw,160px)}.selected-inner{max-width:1350px;margin:auto}.case-frame{margin-top:55px;background:#192b2e;border-radius:20px;color:#f5f3ed;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;min-height:390px}.case-symbol{position:relative;display:grid;place-items:center;background:radial-gradient(circle at 50% 55%,#456761,#1a2e32 58%,#111b1e);isolation:isolate;overflow:hidden}.case-symbol>span{position:relative;z-index:2;font-size:clamp(45px,7vw,100px);font-weight:850;letter-spacing:-.09em;color:#d5e8ce}.case-lines{position:absolute;width:340px;height:340px;border:1px solid #b8dbc055;border-radius:50%;box-shadow:0 0 0 50px #9fc5b014,0 0 0 110px #9fc5b00a;transform:rotateX(60deg) rotate(-20deg)}.case-copy{padding:clamp(30px,4vw,67px);display:flex;flex-direction:column;justify-content:center}.case-copy>span{font-size:11px;letter-spacing:.19em;color:#bcdda1}.case-copy h3{font-size:clamp(28px,3.1vw,46px);line-height:1.12;letter-spacing:-.05em;margin:27px 0 19px}.case-copy p{line-height:1.65;color:#ccd9d3;font-size:15px}.case-copy a{margin-top:20px;color:#c9e8ac;align-self:flex-start;border-bottom:1px solid #c9e8ac;padding-bottom:8px}.trust-card,.case-frame{transition:transform .25s ease}.trust-card:hover{transform:translateY(-4px)}
@media(max-width:760px){.trust{padding:78px 22px}.trust h2,.selected h2{font-size:clamp(37px,9.3vw,58px)}.trust-grid{grid-template-columns:1fr;gap:13px;margin-top:38px}.trust-card{min-height:0;padding:25px}.trust-visual{font-size:46px;width:68px;height:68px;margin:20px 0}.trust-card h3{font-size:27px;margin:0 0 10px}.trust-card p{font-size:15px}.selected{padding:85px 22px}.case-frame{grid-template-columns:1fr;margin-top:38px}.case-symbol{min-height:240px}.case-copy{padding:30px}.case-copy h3{font-size:32px}.panel .intro{max-width:34ch}.panel .eyebrow{max-width:35ch}}
@media(prefers-reduced-motion:reduce){.trust-card{transition:none}.trust-card:hover{transform:none}}

/* V16: High-Trust-Angebotsarchitektur */
.trust-card{min-height:0}
.trust-card h3{margin:0 0 23px}
.trust-card p + p{margin-top:18px}
.trust-card p strong{color:#253d35;font-weight:730}
.difference{margin-top:clamp(76px,9vw,130px);border-top:1px solid #b7c3b7;padding-top:55px}
.difference h3{font-size:clamp(35px,5.1vw,66px);letter-spacing:-.055em;line-height:1.08;margin:14px 0 42px;font-weight:650}
.difference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.difference-grid article{display:flex;align-items:flex-start;gap:22px;background:rgba(244,242,236,.82);padding:clamp(23px,2.8vw,39px);border:1px solid #d3d9d0;border-radius:15px}
.difference-grid article>span{font-size:12px;font-weight:750;letter-spacing:.1em;color:#4e7467;padding-top:5px}
.difference-grid h4{font-size:clamp(20px,2vw,27px);line-height:1.2;letter-spacing:-.035em;margin:0 0 14px;font-weight:680}
.difference-grid p{margin:0;color:#56665e;line-height:1.62;font-size:15px}
.trust-cta{margin-top:clamp(65px,7vw,100px);padding:clamp(28px,5vw,65px);border-radius:20px;background:#192b2e;color:#f4f2ec;display:flex;align-items:center;justify-content:space-between;gap:30px}
.trust-cta h3{font-size:clamp(31px,4vw,54px);line-height:1.1;letter-spacing:-.05em;margin:0 0 15px}
.trust-cta p{font-size:17px;line-height:1.6;max-width:570px;color:#c6d5d0;margin:0}
.trust-cta a{background:#bbdf93;color:#14221d;border-radius:100px;font-size:13px;font-weight:750;line-height:1.3;padding:17px 23px;white-space:nowrap;display:inline-flex;gap:18px;align-items:center;justify-content:center;min-height:48px}
.trust-cta a:focus-visible{outline:3px solid #e6a374;outline-offset:4px}
@media(max-width:900px){.trust-cta{flex-direction:column;align-items:flex-start}}
@media(max-width:760px){.trust-grid{gap:15px}.trust-card{padding:24px}.difference{padding-top:36px;margin-top:75px}.difference-grid{grid-template-columns:1fr;gap:12px}.difference-grid article{padding:23px;gap:15px}.difference h3{margin-bottom:27px}.trust-cta{padding:30px 25px}.trust-cta a{white-space:normal;width:100%}}


.trust-cta>div{min-width:0;flex:1}.trust-cta h3{max-width:850px;font-size:clamp(30px,3.5vw,50px);overflow-wrap:break-word}.trust-cta p{max-width:700px}.trust-cta a{flex-shrink:0}@media(max-width:900px){.trust-cta>div{width:100%}.trust-cta a{flex-shrink:1}}


/* V20: Ruhigeres Scroll-Timing und klare Flächen für Text und Grafik */
.scroll-stage{height:470vh!important}
@media(max-width:760px){.scroll-stage{height:470svh!important}}
.core{transition:none}
@media(min-width:1100px){
 #resolution{align-items:flex-start!important;padding:110px clamp(40px,6vw,120px) 80px 55vw!important}
 #resolution > :not(.index):not(.scroll-note){max-width:600px!important;width:100%}
 #resolution h2{font-size:clamp(36px,min(4.3vw,7.2vh),74px)!important;line-height:1.04;text-wrap:balance}
 #resolution .intro{font-size:clamp(14px,min(1.15vw,2.1vh),18px)!important;margin-top:clamp(16px,2.6vh,28px)!important;max-width:520px!important}
 #resolution .eyebrow{margin-bottom:clamp(14px,2.4vh,24px)}
}
@media(min-width:761px) and (max-width:1099px){
 #resolution{align-items:flex-start!important;text-align:left;padding-left:clamp(32px,8vw,90px)!important;padding-right:clamp(32px,8vw,90px)!important}
 #resolution > :not(.index):not(.scroll-note){max-width:720px!important}
 #resolution h2{font-size:clamp(40px,6.4vw,70px)!important}
 .nodes,.connector{display:none!important}
}
@media(prefers-reduced-motion:reduce){.scroll-stage{height:auto!important}}

/* V21: Sternmatrix auch auf Handy und Tablet */
@media(max-width:1099px){
 .nodes,.connector{display:block!important}
 .nodes .node,.nodes .node[data-id="social"]{padding:8px 11px;font-size:9px;letter-spacing:.1em;border-radius:7px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
 .node .dot{width:5px;height:5px;margin-right:7px}
 .core{z-index:5!important}.core:before{inset:-10px}
}
@media(max-width:760px){.scroll-stage{height:520svh!important}}
@media(min-width:761px) and (max-width:1099px){.nodes .node,.nodes .node[data-id="social"]{padding:12px 16px;font-size:11px;letter-spacing:.12em}.node .dot{width:6px;height:6px;margin-right:10px}}

/* V22: Menüpunkt "Leistungen" landet genau auf "06 / Unser Ansatz", knapp unter der Navigation */
#leistungen{scroll-margin-top:122px}
@media(max-width:760px){#leistungen{scroll-margin-top:calc(100px + env(safe-area-inset-top,0px))}}
#approach .lead{margin-bottom:0}

/* V26: 07 / Content als freie 3D-Inszenierung. Ein Reel pro Phase, Überschrift schwebt darüber. */
.content-sec{--p1:var(--electric);--p2:var(--accent);--p3:var(--copper);position:relative;background:radial-gradient(ellipse 55% 30% at 85% 4%,rgba(143,212,211,.12),transparent 70%),radial-gradient(ellipse 45% 25% at 8% 99%,rgba(230,163,116,.10),transparent 70%),var(--ink);color:var(--text);padding:clamp(85px,10vw,160px) 0 0;overflow-x:clip}
.content-head{padding:0 clamp(24px,9vw,160px);max-width:1200px}
.content-sec .paper-header{color:#8fa59c}
.content-sec h2{font-size:clamp(40px,6vw,88px);line-height:1.04;letter-spacing:-.065em;font-weight:650;margin:0 0 30px;max-width:1050px;text-wrap:balance}
.content-sec h2 em{font-style:normal;color:var(--electric)}
.content-sec .lead{font-size:clamp(16px,1.7vw,22px);line-height:1.55;color:#bfc9c5;max-width:760px;margin:0}
[data-phase="1"]{--pc:var(--p1)}[data-phase="2"]{--pc:var(--p2)}[data-phase="3"]{--pc:var(--p3)}
.cdot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--pc,var(--electric));flex:none}
.cflow{position:relative;height:480vh;height:480svh}
.cflow-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;perspective:1500px;perspective-origin:50% 45%}
.cp-text{position:absolute;left:50%;top:0;width:min(820px,calc(100% - 44px));transform:translateX(-50%);text-align:center;will-change:opacity,transform;pointer-events:none}
.cp-label{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:750;letter-spacing:.22em;color:var(--pc);margin-bottom:16px}
.cp-text h3{margin:0;font-size:clamp(30px,4.4vw,64px);line-height:1.04;letter-spacing:-.058em;font-weight:650;color:var(--text);text-wrap:balance}
.cp-text h3 span{color:var(--pc)}
.cp-text p{margin:16px auto 0;max-width:520px;font-size:clamp(14px,1.2vw,17px);line-height:1.55;color:#b4c0bc;text-wrap:pretty}
.box3d{--w:220px;--h:391px;--d:18px;position:absolute;left:0;top:0;width:var(--w);height:var(--h);transform-style:preserve-3d;will-change:transform}
.bx{position:absolute;margin:0;backface-visibility:hidden}
.bx-front{inset:0;transform:translateZ(calc(var(--d) / 2));border-radius:10px;overflow:hidden;background:#16232a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)}
.bx-back{inset:0;transform:rotateY(180deg) translateZ(calc(var(--d) / 2));border-radius:10px;background:#0c1417}
.bx-right,.bx-left{top:6px;bottom:6px;width:var(--d);left:calc(50% - var(--d) / 2);background:linear-gradient(180deg,color-mix(in srgb,var(--pc) 55%,#1a2a2f),color-mix(in srgb,var(--pc) 22%,#0e171a))}
.bx-right{transform:rotateY(90deg) translateZ(calc(var(--w) / 2))}
.bx-left{transform:rotateY(-90deg) translateZ(calc(var(--w) / 2));filter:brightness(.6)}
.bx-top,.bx-bottom{left:6px;right:6px;height:var(--d);top:calc(50% - var(--d) / 2);background:color-mix(in srgb,var(--pc) 40%,#152227)}
.bx-top{transform:rotateX(90deg) translateZ(calc(var(--h) / 2))}
.bx-bottom{transform:rotateX(-90deg) translateZ(calc(var(--h) / 2));filter:brightness(.5)}
.bx-front img,.bx-front video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.bx-front .ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px;text-align:center;background:linear-gradient(155deg,color-mix(in srgb,var(--pc) 26%,#1d2c31),#111a1e 72%);color:#a9b9b4;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase}
.bx-front .ph::after{content:"Platzhalter";position:absolute;top:11px;right:11px;font-size:8.5px;letter-spacing:.16em;color:#73867f;border:1px dashed #4b5d59;border-radius:5px;padding:3px 6px}
.ph-icon{width:42px;height:42px;border-radius:50%;border:1px solid rgba(209,230,219,.4);position:relative}
.ph-icon.video::before{content:"";position:absolute;left:16px;top:12px;border-left:13px solid #d6e5df;border-top:8px solid transparent;border-bottom:8px solid transparent}
.ph-fmt{font-size:9px;letter-spacing:.18em;color:#73867f}
.bx-front .clabel{position:absolute;left:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;background:rgba(16,23,27,.74);border:1px solid rgba(255,255,255,.14);color:#eef3f0;font-size:9.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}
.shade{position:absolute;inset:0;background:#081014;opacity:0;pointer-events:none;z-index:3}
.box3d::after{content:"";position:absolute;left:8%;right:8%;bottom:-38px;height:30px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);transform:translateZ(-40px) rotateX(90deg);opacity:.7}
.cflow-steps{position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;gap:22px;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#6f817c;white-space:nowrap}
.cflow-steps span{display:inline-flex;align-items:center;gap:8px;transition:color .3s}
.cflow-steps i{width:22px;height:2px;border-radius:2px;background:#33444a;position:relative;overflow:hidden}
.cflow-steps i::after{content:"";position:absolute;inset:0;background:var(--pc);transform-origin:0 50%;transform:scaleX(var(--fill,0))}
.cflow-steps span.on{color:#e4eeeb}
@media(max-width:760px){.content-sec{padding-top:78px}.content-head{padding:0 22px}.content-sec h2{font-size:clamp(34px,9vw,52px)}.cflow-steps{gap:12px;font-size:8.5px;letter-spacing:.12em}.cflow-steps i{width:14px}}
@media(max-width:360px){.cflow-steps{display:none}}
/* Ohne Animation (kein JS oder "Bewegung reduzieren"): ruhige Liste */
html:not(.js-scroll) .cflow{height:auto}
html:not(.js-scroll) .cflow-stage{position:relative;height:auto;overflow:visible;perspective:none;padding:40px 22px 80px;display:flex;flex-direction:column;gap:70px;align-items:center}
html:not(.js-scroll) .cp-text{position:relative;left:auto;transform:none;opacity:1!important}
html:not(.js-scroll) .box3d{position:relative;transform:none!important;margin:26px auto 0;--w:200px;--h:356px}
html:not(.js-scroll) .box3d .bx:not(.bx-front),html:not(.js-scroll) .box3d::after,html:not(.js-scroll) .cflow-steps{display:none}
html:not(.js-scroll) .bx-front{transform:none}

/* Verbindung zum Hero: Punktfarben der Bausteine passend zu den drei Phasen */
.node[data-id="content"] .dot{background:var(--electric)}
.node[data-id="brand"] .dot,.node[data-id="social"] .dot{background:var(--accent)}
.node[data-id="performance"] .dot{background:var(--copper)}
.node[data-id="data"] .dot,.node[data-id="website"] .dot,.node[data-id="crm"] .dot{background:#c9d6d2}



/* V30: Scroll-Hinweis in der Content-Sektion, gut sichtbar auch für weniger geübte Nutzer */
.cflow-hint{position:absolute;left:50%;bottom:calc(52px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:8px 14px 8px 16px;border-radius:999px;border:1px solid rgba(209,230,219,.28);background:rgba(16,23,27,.6);color:#e4eeeb;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;z-index:30;pointer-events:none}
.cflow-hint i{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px;animation:cflowBob 1.6s ease-in-out infinite}
@keyframes cflowBob{0%,100%{transform:translateY(0) rotate(45deg)}50%{transform:translateY(4px) rotate(45deg)}}
@media(max-width:760px){.cflow-hint{bottom:calc(46px + env(safe-area-inset-bottom,0px));font-size:10px}}
@media(prefers-reduced-motion:reduce){.cflow-hint i{animation:none}}
html:not(.js-scroll) .cflow-hint{display:none}
/* V19: Fallback ohne Scroll-Animation (kein JS oder "Bewegung reduzieren"). Muss als letzte Regel stehen. */
html:not(.js-scroll) .scroll-stage{height:auto!important}
html:not(.js-scroll) .sticky{position:relative!important;top:auto!important;height:auto!important;min-height:0!important;overflow:hidden!important}
html:not(.js-scroll) .panel{position:relative!important;inset:auto!important;height:auto!important;min-height:86svh!important;opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto!important}
html:not(.js-scroll) .panel+.panel{min-height:70svh!important;padding-top:70px!important}
html:not(.js-scroll) .nodes,html:not(.js-scroll) .connector,html:not(.js-scroll) .core,html:not(.js-scroll) .rail,html:not(.js-scroll) .panel .scroll-note{display:none!important}

/* Footer & Navigation Ergänzungen */
.footer{flex-wrap:wrap;align-items:center}
.footer nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.footer a,.footer button{color:#b0c2b8;background:none;border:0;padding:0;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;border-bottom:0!important;display:inline}
.footer a:hover,.footer button:hover{color:#fff}
.navright a.nav-check{color:var(--accent)}
.end .mail-line{margin:26px 0 0;font-size:16px;color:#c8d0cc}.end .mail-line strong{color:#f5f3ed;user-select:all}
.end .copy-mail{margin-left:10px;background:none;border:1px solid rgba(209,230,219,.35);color:#f5f3ed;border-radius:999px;padding:7px 14px;font:600 12px Inter,system-ui,sans-serif;cursor:pointer}
.end .copy-mail:hover{border-color:var(--accent);color:var(--accent)}

.end .kf{max-width:640px;margin-top:34px;display:grid;gap:16px;text-align:left}
.kf-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.kf label{display:block;font:600 12px Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#b0c2b8;margin-bottom:7px}.kf label i{color:var(--accent);font-style:normal}
.kf input,.kf textarea{width:100%;box-sizing:border-box;background:rgba(255,255,255,.05);border:1px solid rgba(209,230,219,.28);border-radius:12px;color:#f5f3ed;padding:14px 16px;font:400 16px Inter,system-ui,sans-serif}
.kf textarea{resize:vertical;min-height:130px}
.kf input:focus,.kf textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.kf button[type=submit]{justify-self:start;background:var(--accent);color:#0f1a17;border:0;border-radius:999px;padding:15px 28px;font:700 14px Inter,system-ui,sans-serif;cursor:pointer}
.kf button[type=submit]:disabled{opacity:.6;cursor:wait}
.kf-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.kf-msg{margin:0;font-size:15px;line-height:1.5}.kf-msg.err{color:#ffb4a3}.kf-msg.ok{color:var(--accent);font-weight:600}
.kf-privacy{margin:0;font-size:13px;color:#9fb0a7}.kf-privacy a{color:#c8d0cc}
@media(max-width:640px){.kf-row{grid-template-columns:1fr}}

/* Kontakt hell */
.end{background:radial-gradient(circle at 97% 13%,rgba(143,212,211,.16),transparent 30%),var(--paper);color:var(--ink)}
.end .paper-header{color:#5b6a66}
.end h2{color:var(--ink)}
.end .mail-line{color:#44524e}.end .mail-line strong{color:var(--ink)}
.end .copy-mail{border-color:rgba(16,23,27,.35);color:var(--ink)}.end .copy-mail:hover{border-color:#3d6b66;color:#3d6b66}
.end a{color:#2f5d57;border-bottom-color:#2f5d57}
.kf label{color:#44524e}.kf label i{color:#b4651f}
.kf input,.kf textarea{background:#fff;border-color:rgba(16,23,27,.28);color:var(--ink)}
.kf input:focus,.kf textarea:focus{outline-color:#2f5d57}
.end .kf button[type=submit]{background:var(--ink);color:#fff}
.kf-msg.err{color:#a3321c}.kf-msg.ok{color:#2f5d57}
.kf-privacy{color:#5b6a66}.kf-privacy a{color:#2f5d57}
.end .footer{border-top:1px solid rgba(16,23,27,.15);color:#5b6a66}
.end .footer a,.end .footer button{color:#44524e;border-bottom:0!important}.end .footer a:hover,.end .footer button:hover{color:var(--ink)}
