:root{
--paper:#fbfbfd;--paper-2:#f2f2f5;--ink:#1d1d1f;--ink-soft:#6e6e73;
--line:rgba(0,0,0,.10);--accent:#0071e3;
--display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter",system-ui,"Segoe UI",sans-serif;
--sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;font-size:17px}
a{color:inherit;text-decoration:none}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
section[id]{scroll-margin-top:74px}
.skip-link{position:fixed;left:18px;top:-60px;z-index:100;background:#fff;color:#111;padding:10px 16px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.18);transition:top .2s}
.skip-link:focus{top:14px}
/* Header (scroll-aware) */
header{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:-.02em;color:#fff;transition:.3s}
.navlinks{display:flex;gap:32px}
.navlinks a{font-size:14px;font-weight:400;color:#fff;opacity:.82;transition:.2s}
.navlinks a:hover{opacity:1}
.nav-right{display:flex;align-items:center;gap:18px}
.lang{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:500}
.lang button, .lang a{background:none;border:0;color:rgba(255,255,255,.65);cursor:pointer;padding:2px 3px;transition:.3s}
.lang button.on, .lang a.on{color:#fff}
.lang .sl{color:rgba(255,255,255,.4)}
.btn{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;cursor:pointer;transition:.25s;border-radius:99px}
.btn-primary{background:var(--accent);color:#fff;padding:9px 18px}
.btn-primary:hover{background:#0060c4}
header.scrolled{background:rgba(251,251,253,.8);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line)}
header.scrolled .brand{color:var(--ink)}
header.scrolled .navlinks a{color:var(--ink)}
header.scrolled .lang button, header.scrolled .lang a{color:var(--ink-soft)}
header.scrolled .lang button.on, header.scrolled .lang a.on{color:var(--ink)}
header.scrolled .lang .sl{color:var(--line)}
/* Full-bleed helpers */
.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.scrim{position:absolute;inset:0;z-index:1}
/* HERO full */
.hero-full{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden}
.hero-full .scrim{background:linear-gradient(180deg,rgba(6,9,18,.62) 0%,rgba(6,9,18,.5) 40%,rgba(6,9,18,.8) 100%)}
.hero-inner{position:relative;z-index:2;padding:120px 28px 90px;max-width:960px}
.avail{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:rgba(255,255,255,.85);margin-bottom:26px}
.avail .d{width:8px;height:8px;border-radius:50%;background:#30d158;box-shadow:0 0 0 0 rgba(48,209,88,.5);animation:p 2.4s infinite}
@keyframes p{0%{box-shadow:0 0 0 0 rgba(48,209,88,.5)}70%{box-shadow:0 0 0 10px rgba(48,209,88,0)}100%{box-shadow:0 0 0 0 rgba(48,209,88,0)}}
.hero-full h1{font-family:var(--display);font-weight:600;font-size:clamp(42px,7.4vw,88px);line-height:1.03;letter-spacing:-.035em;margin:0 auto 26px;max-width:16ch}
.hero-full h1 .grad{background:linear-gradient(120deg,#5ea0ff,#b79bff 55%,#5ff0e6);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-full .sub{font-size:clamp(18px,2.1vw,22px);color:rgba(255,255,255,.82);max-width:620px;margin:0 auto 36px;line-height:1.45}
.hero-cta{display:flex;gap:18px;justify-content:center;align-items:center;flex-wrap:wrap}
.btn-white{background:#fff;color:#111;padding:14px 28px;font-size:16px;font-weight:600}
.btn-white:hover{background:rgba(255,255,255,.88)}
.btn-lw{color:#fff;font-size:16px;font-weight:500}
.btn-lw::after{content:" ›"}
.btn-lw:hover{opacity:.8}
.scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.6);font-size:12px;letter-spacing:.14em;text-transform:uppercase;animation:bob 2.4s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}
/* Subtle hero interface */
.hero-hud{position:absolute;inset:0;z-index:2;pointer-events:none}
.hud-card{position:absolute;display:flex;align-items:center;gap:11px;padding:12px 15px;border:1px solid rgba(255,255,255,.14);border-radius:15px;background:rgba(6,9,18,.38);backdrop-filter:blur(16px);box-shadow:0 18px 45px rgba(0,0,0,.18);color:rgba(255,255,255,.78);font-size:12px}
.hud-card b{display:block;color:#fff;font-size:13px}
.hud-card i{width:9px;height:9px;border-radius:50%;background:#4d7cff;box-shadow:0 0 18px #4d7cff}
.hud-card:nth-child(1){left:6%;top:31%;animation:float 5s ease-in-out infinite}
.hud-card:nth-child(2){right:6%;top:37%;animation:float 5.8s ease-in-out infinite .7s}
.hud-card:nth-child(3){right:12%;bottom:18%;animation:float 6.4s ease-in-out infinite 1.2s}
.hud-card:nth-child(2) i{background:#00e0c6;box-shadow:0 0 18px #00e0c6}
.hud-card:nth-child(3) i{background:#a06bff;box-shadow:0 0 18px #a06bff}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
/* Stat band */
.band{background:var(--paper-2);border-bottom:1px solid var(--line)}
.band .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.band .cell{padding:38px 18px;text-align:center;border-right:1px solid var(--line)}
.band .cell:last-child{border-right:0}
.band .num{font-family:var(--display);font-weight:600;font-size:44px;line-height:1;letter-spacing:-.03em;background:linear-gradient(120deg,#0071e3,#7d4bff);-webkit-background-clip:text;background-clip:text;color:transparent}
.band .lbl{font-size:14px;color:var(--ink-soft);margin-top:10px}
/* Sections */
section{padding:100px 0}
.sec-alt{background:var(--paper-2)}
.kicker{font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--accent);margin-bottom:16px}
.h2{font-family:var(--display);font-weight:600;font-size:clamp(30px,4.6vw,52px);line-height:1.06;letter-spacing:-.03em;max-width:800px}
.h2 .soft{color:var(--ink-soft)}
.center{text-align:center}
.center .h2{margin:0 auto}
.h2.center{margin-left:auto;margin-right:auto}
/* Feature FULL-BLEED */
.feat-full{position:relative;overflow:hidden;color:#fff;min-height:82vh;display:flex;align-items:center}
.feat-full .scrim{background:linear-gradient(90deg,rgba(6,9,18,.9) 0%,rgba(6,9,18,.62) 45%,rgba(6,9,18,.15) 100%)}
.feat-full.right .scrim{background:linear-gradient(270deg,rgba(6,9,18,.9) 0%,rgba(6,9,18,.62) 45%,rgba(6,9,18,.15) 100%)}
.feat-inner{position:relative;z-index:2;max-width:540px;padding:80px 0}
.feat-full.right .wrap{display:flex;justify-content:flex-end}
.feat-full .kicker{color:#7fb2ff}
.feat-full h3{font-family:var(--display);font-weight:600;font-size:clamp(28px,3.6vw,42px);letter-spacing:-.025em;margin-bottom:18px;line-height:1.08}
.feat-full p{color:rgba(255,255,255,.82);font-size:17.5px;margin-bottom:22px}
.flist{list-style:none;display:flex;flex-direction:column;gap:12px}
.flist li{display:flex;gap:11px;font-size:16px;color:#fff}
.flist li::before{content:"";width:20px;height:20px;flex:0 0 20px;margin-top:2px;border-radius:50%;background:var(--accent);
-webkit-mask:url("data:image/svg+xml;utf8,") center/14px no-repeat;
mask:url("data:image/svg+xml;utf8,") center/14px no-repeat}
/* Services */
.svc{border-top:1px solid var(--line);margin-top:44px}
.svc .row{display:grid;grid-template-columns:60px 1.1fr 1.5fr;gap:24px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--line);transition:.3s}
.svc .row:hover{padding-left:12px}
.svc .idx{font-size:14px;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.svc .ttl{font-family:var(--display);font-weight:600;font-size:clamp(19px,2.2vw,25px);letter-spacing:-.02em}
.svc .dsc{color:var(--ink-soft);font-size:15.5px}
/* Visual delivery flow */
.flow-map{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:44px 0 8px;padding:34px;border:1px solid rgba(0,0,0,.08);border-radius:28px;background:linear-gradient(145deg,#fff,rgba(255,255,255,.58));box-shadow:0 24px 65px rgba(22,35,58,.07);overflow:hidden}
.flow-map::before{content:"";position:absolute;left:11%;right:11%;top:64px;height:1px;background:linear-gradient(90deg,#4d7cff,#a06bff 52%,#00cbb4)}
.flow-map::after{content:"";position:absolute;top:59px;left:11%;width:11px;height:11px;border-radius:50%;background:#fff;border:3px solid #4d7cff;box-shadow:0 0 0 8px rgba(77,124,255,.1);animation:travel 6s ease-in-out infinite}
@keyframes travel{0%,8%{left:11%}31%{left:36%}58%{left:61%}83%,100%{left:86%}}
.flow-step{position:relative;z-index:1;text-align:center}
.flow-step .dot{display:block;width:13px;height:13px;margin:23px auto 28px;border:3px solid #fff;border-radius:50%;background:#4d7cff;box-shadow:0 0 0 1px rgba(77,124,255,.28)}
.flow-step:nth-child(2) .dot{background:#766eff}.flow-step:nth-child(3) .dot{background:#a06bff}.flow-step:nth-child(4) .dot{background:#00cbb4}
.flow-step b{display:block;font-family:var(--display);font-size:17px;letter-spacing:-.02em;margin-bottom:5px}
.flow-step span{font-size:12.5px;color:var(--ink-soft)}
/* Program cockpit */
.control-section{background:#fff;overflow:hidden}
.control-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:72px;align-items:center}
.control-copy .h2{font-size:clamp(30px,4vw,48px)}
.control-copy p{font-size:17px;color:var(--ink-soft);margin:20px 0 28px}
.control-points{list-style:none;display:grid;gap:12px}
.control-points li{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:500}
.control-points li::before{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#4d7cff,#00e0c6);box-shadow:0 0 0 5px rgba(77,124,255,.08)}
.program-board{position:relative;border:1px solid rgba(255,255,255,.11);border-radius:28px;padding:24px;background:linear-gradient(150deg,#0b1020,#05070c 72%);color:#fff;box-shadow:0 42px 90px -36px rgba(5,14,33,.7);overflow:hidden}
.program-board::before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-170px;top:-190px;background:radial-gradient(circle,rgba(77,124,255,.38),transparent 65%)}
.board-head{position:relative;display:flex;align-items:center;justify-content:space-between;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}
.board-head b{font-size:15px}.board-head span{font-size:12px;color:#62e6a0;display:flex;align-items:center;gap:7px}.board-head span::before{content:"";width:7px;height:7px;border-radius:50%;background:#52e28b;box-shadow:0 0 12px #52e28b}
.board-grid{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:14px;margin-top:14px}
.board-panel{border:1px solid rgba(255,255,255,.09);border-radius:17px;background:rgba(255,255,255,.045);padding:18px}
.board-panel h4{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.45);margin-bottom:16px}
.milestone{display:grid;grid-template-columns:82px 1fr 35px;gap:10px;align-items:center;margin:12px 0;font-size:11px;color:rgba(255,255,255,.74)}
.bar{height:5px;border-radius:5px;background:rgba(255,255,255,.09);overflow:hidden}.bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4d7cff,#00e0c6)}
.milestone:nth-child(3) .bar i{background:linear-gradient(90deg,#4d7cff,#a06bff)}
.risk-stack{display:grid;gap:9px}.risk{padding:10px;border-radius:11px;background:rgba(255,255,255,.05);font-size:11px}.risk b{display:flex;justify-content:space-between;font-size:11px;margin-bottom:5px}.risk span{color:rgba(255,255,255,.42)}
.board-foot{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.mini-metric{border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.035);padding:14px}
.mini-metric b{display:block;font-size:21px;letter-spacing:-.03em}.mini-metric span{font-size:10.5px;color:rgba(255,255,255,.43)}
/* Projects */
.proj{border-top:1px solid var(--line);margin-top:44px}
.proj .row{display:grid;grid-template-columns:1fr auto;gap:14px 30px;align-items:end;padding:24px 22px;border-bottom:1px solid var(--line);border-radius:22px;transition:.3s}
.proj .row:hover{background:#fff;box-shadow:0 20px 46px rgba(15,23,42,.075);transform:translateY(-2px)}
.project-main{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;align-items:center}
.project-logo{--brand:#0b1220;--logo-scale:1;position:relative;width:150px;height:82px;display:flex;align-items:center;justify-content:center;padding:18px 20px;border:1px solid rgba(15,23,42,.09);border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(246,248,252,.92));box-shadow:0 14px 34px rgba(15,23,42,.08),inset 0 1px 0 #fff;overflow:hidden}
.project-logo::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 0%,var(--brand),transparent 56%);opacity:.055;pointer-events:none}
.project-logo::after{content:"";position:absolute;left:50%;bottom:0;width:42px;height:3px;border-radius:3px 3px 0 0;background:var(--brand);transform:translateX(-50%)}
.project-logo img{position:relative;z-index:1;display:block;width:112px;max-width:100%;height:44px;object-fit:contain;transform:scale(var(--logo-scale));transform-origin:center}
.project-logo.bechtle{--brand:#23a96a;--logo-scale:.96}
.project-logo.lufthansa{--brand:#05164d;--logo-scale:1.02}
.project-logo.audi{--brand:#bb0a30;--logo-scale:1;flex-direction:column;gap:5px}
.project-logo.audi .audi-rings{width:92px;height:29px;transform:none}
.project-logo.audi .audi-wordmark{width:34px;height:9px;transform:none}
.project-logo.amazon{--brand:#ff9900;--logo-scale:.92}
.project-logo.ing{--brand:#ff6200;--logo-scale:.92}
.project-logo.telefonica{--brand:#0066ff;--logo-scale:.98}
.project-logo.aldi{--brand:#001e78;--logo-scale:1.05}
.proj .cli{font-family:var(--display);font-weight:600;font-size:clamp(23px,3.2vw,36px);letter-spacing:-.03em}
.proj .role{font-size:15px;color:var(--ink-soft);margin-top:8px;max-width:660px;line-height:1.45}
.proj .year{font-size:14px;color:var(--ink-soft);white-space:nowrap;font-variant-numeric:tabular-nums}
/* About */
.about-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:56px;align-items:center;margin-top:44px}
.portrait{position:relative}
.portrait::before{content:"";position:absolute;inset:14% -8% -5% 14%;border-radius:30px;background:linear-gradient(145deg,rgba(0,113,227,.2),rgba(125,75,255,.14),rgba(0,194,199,.14));filter:blur(23px)}
.portrait img{position:relative;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:center 18%;border-radius:22px;display:block;box-shadow:0 30px 60px -30px rgba(0,0,0,.3)}
.portrait figcaption{font-size:13px;color:var(--ink-soft);margin-top:14px}
.about-lead{font-family:var(--display);font-weight:600;font-size:clamp(23px,2.7vw,32px);line-height:1.2;letter-spacing:-.02em;margin-bottom:24px}
.about-txt p.body{color:var(--ink-soft);font-size:16.5px;margin-bottom:16px}
.about-txt p.body strong{color:var(--ink);font-weight:600}
.quals-band{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);margin-top:60px}
.quals-band .q{padding:26px 22px 0 0;border-right:1px solid var(--line)}
.quals-band .q:last-child{border-right:0}
.quals-band .q b{display:block;font-family:var(--display);font-weight:600;font-size:16px;margin-bottom:6px}
.quals-band .q span{font-size:13.5px;color:var(--ink-soft)}
/* FAQ */
.faq{max-width:860px;margin:44px auto 0;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{position:relative;list-style:none;cursor:pointer;padding:24px 46px 24px 0;font-family:var(--display);font-size:clamp(18px,2.2vw,22px);font-weight:600;letter-spacing:-.015em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:26px;font-weight:400;color:var(--accent)}
.faq details[open] summary::after{content:"–"}
.faq .answer{padding:0 46px 24px 0;color:var(--ink-soft);font-size:16px;line-height:1.65}
/* CTA */
.cta{text-align:center;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;left:50%;top:45%;width:620px;height:300px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(0,113,227,.09),transparent 66%);pointer-events:none}
.cta .wrap{position:relative}
.cta .h2{margin:0 auto 20px}
.cta p{color:var(--ink-soft);max-width:520px;margin:0 auto 32px;font-size:18px}
.cta .actions{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.btn-soft{background:var(--ink);color:#fff;padding:13px 26px;font-size:16px}
.btn-soft:hover{opacity:.86}
.btn-line{color:var(--accent);font-size:16px;font-weight:500}
.btn-line::after{content:" ›"}
.btn-line:hover{text-decoration:underline}
.cta .meta{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin-top:34px;font-size:14.5px;color:var(--ink-soft)}
.cta .meta a:hover{color:var(--accent)}
footer{padding:40px 0;border-top:1px solid var(--line)}
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--ink-soft)}
.foot a:hover{color:var(--ink)}
.reveal{opacity:0;transform:translateY(20px);transition:.7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
/* V4 — cinematic depth system */
body{background:#f6f7fa}
.hero-full::before{content:"";position:absolute;z-index:2;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.62),transparent 72%);pointer-events:none}
.hero-full::after{content:"";position:absolute;z-index:2;left:50%;bottom:-290px;width:900px;height:500px;transform:translateX(-50%);border:1px solid rgba(125,157,255,.2);border-radius:50%;box-shadow:0 0 120px rgba(77,124,255,.14),inset 0 0 90px rgba(0,224,198,.05);pointer-events:none}
.hero-full .bg[data-depth],.feat-full .bg[data-depth]{transform:scale(1.1) translate3d(0,var(--depth-y,0),0);will-change:transform;transition:transform .08s linear}
.hero-inner{filter:drop-shadow(0 26px 55px rgba(0,0,0,.28))}
.hero-depth-orbit{position:absolute;z-index:2;left:50%;top:50%;width:min(1020px,82vw);aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.055);border-radius:50%;pointer-events:none}
.hero-depth-orbit::before,.hero-depth-orbit::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(100,143,255,.09)}
.hero-depth-orbit::before{inset:10%;transform:rotate(18deg)}.hero-depth-orbit::after{inset:23%;border-color:rgba(0,224,198,.07);transform:rotate(-14deg)}
.orbit-node{position:absolute;width:10px;height:10px;border-radius:50%;background:#74a0ff;box-shadow:0 0 20px #4d7cff,0 0 0 8px rgba(77,124,255,.08);animation:orbitPulse 2.8s ease-in-out infinite}
.orbit-node.one{left:13%;top:31%}.orbit-node.two{right:17%;top:24%;background:#00e0c6;box-shadow:0 0 20px #00e0c6,0 0 0 8px rgba(0,224,198,.07);animation-delay:.8s}.orbit-node.three{right:23%;bottom:18%;background:#a06bff;box-shadow:0 0 20px #a06bff,0 0 0 8px rgba(160,107,255,.07);animation-delay:1.5s}
@keyframes orbitPulse{50%{transform:scale(1.35);opacity:.55}}
.band{position:relative;z-index:8;margin-top:-48px;background:transparent;border:0;padding-bottom:38px}
.band .wrap{background:rgba(251,251,253,.84);backdrop-filter:blur(26px) saturate(150%);border:1px solid rgba(255,255,255,.78);border-radius:26px;box-shadow:0 32px 80px rgba(17,30,56,.15),inset 0 1px #fff;overflow:hidden}
.band .cell{position:relative}
.band .cell::after{content:"";position:absolute;left:20%;right:20%;bottom:0;height:2px;border-radius:3px;background:linear-gradient(90deg,transparent,#4d7cff,transparent);opacity:0;transition:.3s}
.band .cell:hover::after{opacity:1}
.feat-full{box-shadow:inset 0 1px rgba(255,255,255,.08),inset 0 -90px 140px rgba(0,0,0,.25)}
.feat-full::before{content:"";position:absolute;z-index:2;inset:28px;border:1px solid rgba(255,255,255,.09);border-radius:28px;pointer-events:none}
.feat-full::after{content:"";position:absolute;z-index:2;inset:auto 0 0;height:34%;background:linear-gradient(transparent,rgba(4,7,15,.5));pointer-events:none}
.feat-full .wrap{position:relative;z-index:3}
.feat-inner{filter:drop-shadow(0 24px 45px rgba(0,0,0,.28))}
.depth-rail{position:absolute;z-index:4;right:4%;top:50%;width:min(360px,30vw);transform:translateY(-50%);display:grid;gap:14px;perspective:1000px}
.feat-full.right .depth-rail{right:auto;left:4%}
.layer-card{position:relative;padding:18px 20px;border:1px solid rgba(255,255,255,.15);border-radius:18px;background:linear-gradient(145deg,rgba(14,21,38,.72),rgba(7,10,18,.45));backdrop-filter:blur(20px);box-shadow:0 25px 60px rgba(0,0,0,.23),inset 0 1px rgba(255,255,255,.08);transform:translateZ(0) rotateY(-5deg);transition:.35s}
.feat-full.right .layer-card{transform:translateZ(0) rotateY(5deg)}
.layer-card:nth-child(2){margin-left:42px}.feat-full.right .layer-card:nth-child(2){margin-left:0;margin-right:42px}
.layer-card:hover{transform:translateY(-5px) rotateY(0)}
.layer-card small{display:block;color:rgba(255,255,255,.42);font-size:10px;text-transform:uppercase;letter-spacing:.14em;margin-bottom:8px}
.layer-card b{display:flex;justify-content:space-between;align-items:center;font-size:14px}
.layer-card b em{font-style:normal;color:#79f2df;font-size:12px}
.layer-track{height:4px;border-radius:5px;background:rgba(255,255,255,.1);margin-top:12px;overflow:hidden}.layer-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4d7cff,#00e0c6)}
.layer-nodes{display:flex;align-items:center;margin-top:13px}.layer-nodes i{width:25px;height:25px;border-radius:50%;margin-right:-6px;border:2px solid #111827;background:linear-gradient(145deg,#4d7cff,#806bff)}.layer-nodes i:nth-child(2){background:linear-gradient(145deg,#00e0c6,#118fca)}.layer-nodes i:nth-child(3){background:linear-gradient(145deg,#a06bff,#4d7cff)}.layer-nodes span{margin-left:14px;font-size:11px;color:rgba(255,255,255,.52)}
.flow-map{transform:translateZ(0);box-shadow:0 34px 90px rgba(22,35,58,.1),0 1px 0 #fff inset}
.flow-map::before{box-shadow:0 0 18px rgba(77,124,255,.23)}
.svc{perspective:1100px}
.svc .row{position:relative;border-radius:18px;padding-left:14px;padding-right:14px}
.svc .row::before{content:"";position:absolute;inset:8px;border:1px solid transparent;border-radius:14px;pointer-events:none;transition:.3s}
.svc .row:hover{background:#fff;box-shadow:0 20px 50px rgba(21,35,60,.08);transform:translateZ(18px)}
.svc .row:hover::before{border-color:rgba(77,124,255,.1)}
.control-section{position:relative}
.control-section::before{content:"";position:absolute;left:-180px;top:8%;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(77,124,255,.09),transparent 66%);pointer-events:none}
.program-board{transform:perspective(1200px) rotateY(-5deg) rotateX(2deg);transform-origin:center;transition:.55s cubic-bezier(.2,.8,.2,1);box-shadow:42px 60px 100px -40px rgba(5,14,33,.78),-18px 24px 60px -36px rgba(77,124,255,.36)}
.program-board:hover{transform:perspective(1200px) rotateY(-1deg) rotateX(0) translateY(-5px)}
.program-board::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.06) 49%,transparent 62%);transform:translateX(-120%);animation:boardShine 7s ease-in-out infinite;pointer-events:none}
@keyframes boardShine{0%,62%{transform:translateX(-120%)}82%,100%{transform:translateX(120%)}}
#projekte{position:relative;background:radial-gradient(circle at 86% 12%,rgba(77,124,255,.07),transparent 26%),var(--paper)}
#projekte::before{content:"";position:absolute;left:0;top:220px;bottom:130px;width:1px;background:linear-gradient(transparent,rgba(77,124,255,.22),transparent)}
.proj{position:relative;border-top:0;display:grid;gap:12px}
.proj .row{border:1px solid rgba(15,23,42,.07);background:rgba(255,255,255,.68);backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(15,23,42,.035)}
.proj .row:nth-child(even){margin-left:22px}
.project-logo{transform:translateZ(20px);box-shadow:0 20px 42px rgba(15,23,42,.1),inset 0 1px #fff}
.about-grid{position:relative}
.about-grid::before{content:"";position:absolute;z-index:0;left:-5%;top:8%;width:44%;height:84%;border:1px solid rgba(77,124,255,.1);border-radius:34px;transform:rotate(-4deg);pointer-events:none}
.about-grid>*{position:relative;z-index:1}
.portrait{perspective:1000px}
.portrait img{transform:perspective(1000px) rotateY(3deg);transform-origin:left center;box-shadow:38px 42px 80px -36px rgba(20,34,61,.42)}
.portrait-badge{position:absolute;z-index:3;padding:11px 14px;border:1px solid rgba(255,255,255,.78);border-radius:14px;background:rgba(255,255,255,.82);backdrop-filter:blur(18px);box-shadow:0 20px 46px rgba(19,35,63,.14);font-size:12px;color:var(--ink-soft)}
.portrait-badge b{display:block;color:var(--ink);font-size:14px}
.portrait-badge.one{right:-30px;top:15%}.portrait-badge.two{left:-22px;bottom:17%}
.quals-band{position:relative;border:1px solid rgba(0,0,0,.07);border-radius:22px;background:rgba(255,255,255,.62);box-shadow:0 22px 60px rgba(20,35,60,.07);overflow:hidden}
.quals-band .q{padding:24px 20px}
.cta{padding-top:78px;padding-bottom:92px}
.cta::before{width:900px;height:500px;background:radial-gradient(circle,rgba(77,124,255,.16),transparent 64%)}
.cta-depth{position:relative;overflow:hidden;padding:84px 42px;border:1px solid rgba(255,255,255,.11);border-radius:34px;background:linear-gradient(145deg,#0b1120,#05070c 72%);color:#fff;box-shadow:0 55px 110px -45px rgba(8,19,43,.72)}
.cta-depth::before{content:"";position:absolute;right:-210px;top:-270px;width:620px;height:620px;border:1px solid rgba(77,124,255,.2);border-radius:50%;box-shadow:0 0 0 75px rgba(77,124,255,.025),0 0 0 150px rgba(0,224,198,.018)}
.cta-depth::after{content:"";position:absolute;left:-110px;bottom:-220px;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(160,107,255,.17),transparent 67%)}
.cta-depth>*{position:relative;z-index:2}
.cta-depth .h2{color:#fff}.cta-depth p{color:rgba(255,255,255,.62)}
.cta-depth .btn-soft{background:#fff;color:#10131a}.cta-depth .btn-line{color:#8cb3ff}
.cta-depth .meta{color:rgba(255,255,255,.52)}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
.reveal{opacity:1;transform:none}
}
@media(max-width:1100px){
.hero-hud{display:none}
.depth-rail{display:none}
}
@media(max-width:880px){
.navlinks{display:none}
.band .wrap{grid-template-columns:1fr 1fr}
.band .cell:nth-child(2){border-right:0}
.feat-full{min-height:auto;padding:20px 0}
.about-grid{grid-template-columns:1fr;gap:32px}
.portrait img{max-width:360px}
.svc .row{grid-template-columns:36px 1fr;gap:6px 14px}
.svc .dsc{grid-column:2}
.control-grid{grid-template-columns:1fr;gap:38px}
.flow-map{padding:25px 18px}
.program-board{transform:none}
.program-board:hover{transform:translateY(-3px)}
.band{margin-top:-32px}
.feat-full::before{inset:15px}
.about-grid::before{display:none}
.quals-band{grid-template-columns:1fr 1fr}
.quals-band .q:nth-child(2){border-right:0}
section{padding:66px 0}
}
@media(max-width:520px){
.wrap{padding:0 20px}
.proj .row{grid-template-columns:1fr}
.project-main{grid-template-columns:1fr;gap:18px}
.project-logo{width:138px;height:74px}
.project-logo img{width:104px;height:40px}
.proj .year{order:-1}
.quals-band{grid-template-columns:1fr}
.quals-band .q{border-right:0}
.hero-hud{display:none}
.flow-map{grid-template-columns:1fr;gap:0;padding:22px}
.flow-map::before{left:28px;right:auto;top:42px;bottom:42px;width:1px;height:auto;background:linear-gradient(#4d7cff,#a06bff,#00cbb4)}
.flow-map::after{display:none}
.flow-step{text-align:left;display:grid;grid-template-columns:28px 1fr;column-gap:12px;padding:13px 0}
.flow-step .dot{grid-row:1/3;margin:5px 0 0}
.flow-step b,.flow-step span{grid-column:2}
.board-grid{grid-template-columns:1fr}
.board-foot{grid-template-columns:1fr 1fr}
.program-board{padding:16px}
.milestone{grid-template-columns:72px 1fr 30px}
.hero-depth-orbit{width:125vw}
.band{margin-top:-20px;padding-bottom:20px}
.band .wrap{border-radius:20px}
.portrait-badge.one{right:-8px}.portrait-badge.two{left:-7px}
.proj .row:nth-child(even){margin-left:0}
.cta-depth{padding:58px 22px;border-radius:26px}
}
/* V5 — warm editorial transformation identity */
:root{
--paper:#f4f1ea;
--paper-2:#ebe5da;
--ink:#1b1916;
--ink-soft:#6d665c;
--line:rgba(43,35,25,.13);
--accent:#9a7b3f;
--accent-dark:#6f5627;
--green:#274838;
}
::selection{background:#d8c8a7;color:#181612}
body{background:var(--paper)}
.wrap{max-width:1180px}
header .brand,
header .navlinks a{color:var(--ink)}
header .lang button, header .lang a{color:rgba(27,25,22,.48)}
header .lang button.on, header .lang a.on{color:var(--ink)}
header .lang .sl{color:rgba(27,25,22,.22)}
header.scrolled{background:rgba(244,241,234,.86);border-color:var(--line)}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{background:var(--accent-dark)}
.hero-full.hero-signature{
min-height:900px;
padding:112px 0 118px;
justify-content:stretch;
text-align:left;
color:var(--ink);
background:
radial-gradient(circle at 8% 12%,rgba(154,123,63,.11),transparent 26%),
linear-gradient(135deg,#f7f4ed 0%,#f0ebe1 64%,#e7ded0 100%);
}
.hero-full.hero-signature::before{
content:"";
position:absolute;
z-index:0;
inset:0;
background-image:linear-gradient(rgba(63,53,40,.038) 1px,transparent 1px),linear-gradient(90deg,rgba(63,53,40,.038) 1px,transparent 1px);
background-size:84px 84px;
-webkit-mask-image:linear-gradient(90deg,#000,transparent 58%);
mask-image:linear-gradient(90deg,#000,transparent 58%);
pointer-events:none;
}
.hero-full.hero-signature::after{
content:"HP";
position:absolute;
z-index:0;
right:-.06em;
bottom:-.2em;
width:auto;
height:auto;
border:0;
border-radius:0;
box-shadow:none;
color:rgba(76,61,41,.035);
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(220px,34vw,520px);
font-weight:700;
line-height:1;
letter-spacing:-.12em;
pointer-events:none;
}
.hero-shell{
position:relative;
z-index:3;
display:grid;
grid-template-columns:minmax(0,1.05fr) minmax(390px,.82fr);
gap:clamp(52px,7vw,104px);
align-items:center;
}
.hero-copy{position:relative;padding:28px 0}
.hero-copy::before{
content:"";
position:absolute;
left:-28px;
top:30px;
width:2px;
height:110px;
background:linear-gradient(var(--accent),transparent);
}
.hero-signature .avail{
color:var(--green);
margin-bottom:24px;
text-transform:uppercase;
letter-spacing:.09em;
font-size:11px;
font-weight:700;
}
.hero-signature .avail .d{background:var(--green);box-shadow:0 0 0 0 rgba(39,72,56,.32)}
.hero-signature h1{
margin:0 0 28px;
max-width:12ch;
color:var(--ink);
font-size:clamp(50px,6.4vw,78px);
line-height:.98;
letter-spacing:-.052em;
}
.hero-signature h1 .grad{
background:linear-gradient(112deg,var(--accent-dark),#b49355 72%);
-webkit-background-clip:text;
background-clip:text;
color:transparent;
}
.hero-signature .sub{
margin:0 0 32px;
max-width:650px;
color:var(--ink-soft);
font-size:clamp(17px,1.65vw,20px);
line-height:1.58;
}
.hero-signature .hero-cta{justify-content:flex-start}
.hero-signature .btn-white{background:var(--ink);color:#fff;box-shadow:0 16px 34px rgba(36,29,21,.15)}
.hero-signature .btn-white:hover{background:var(--accent-dark)}
.hero-signature .btn-lw{color:var(--ink)}
.hero-tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:32px}
.hero-tags span{
padding:8px 12px;
border:1px solid rgba(58,47,34,.13);
border-radius:999px;
background:rgba(255,255,255,.42);
color:var(--ink-soft);
font-size:12px;
backdrop-filter:blur(10px);
}
.hero-visual{position:relative;min-width:0}
.hero-frame{
position:relative;
height:650px;
overflow:hidden;
border-radius:48px 48px 164px 48px;
background:#211e19;
box-shadow:0 42px 90px -38px rgba(38,30,20,.52);
transform:rotate(1.2deg);
}
.hero-frame::after{
content:"";
position:absolute;
inset:14px;
border:1px solid rgba(255,255,255,.26);
border-radius:36px 36px 150px 36px;
pointer-events:none;
}
.hero-frame img{width:100%;height:100%;object-fit:cover;object-position:center 23%;display:block}
.hero-monogram{
position:absolute;
right:-22px;
top:60px;
writing-mode:vertical-rl;
color:rgba(64,49,30,.46);
font-size:10px;
text-transform:uppercase;
letter-spacing:.24em;
font-weight:700;
}
.hero-identity{
position:absolute;
right:-26px;
bottom:44px;
z-index:3;
width:min(330px,82%);
padding:18px 20px;
border:1px solid rgba(255,255,255,.72);
border-radius:18px;
background:rgba(248,245,238,.86);
backdrop-filter:blur(18px);
box-shadow:0 20px 50px rgba(30,23,16,.2);
}
.hero-identity strong{display:block;font-family:var(--display);font-size:18px;letter-spacing:-.02em}
.hero-identity span{display:block;margin-top:3px;color:var(--ink-soft);font-size:12px}
.hero-bridge{
position:absolute;
z-index:4;
left:-44px;
top:86px;
padding:14px 16px;
border:1px solid rgba(255,255,255,.74);
border-radius:16px;
background:rgba(244,241,234,.9);
box-shadow:0 18px 45px rgba(38,29,19,.14);
color:var(--ink-soft);
font-size:11px;
}
.hero-bridge b{display:block;color:var(--ink);font-size:14px;margin-bottom:2px}
.scroll-hint{color:rgba(27,25,22,.44)}
.hero-depth-orbit,.hero-hud{display:none}
.band{margin-top:-72px;padding-bottom:44px}
.band .wrap{
background:rgba(248,245,238,.88);
border-color:rgba(255,255,255,.82);
box-shadow:0 30px 70px rgba(51,39,25,.12),inset 0 1px #fff;
}
.band .num{
background:none;
color:var(--accent-dark);
}
.band .cell::after{background:linear-gradient(90deg,transparent,var(--accent),transparent)}
.kicker{color:var(--accent-dark);text-transform:uppercase;letter-spacing:.1em;font-size:11px}
.sec-alt{background:var(--paper-2)}
.feat-full{min-height:760px}
.feat-full .bg[data-depth]{transform:scale(1.06) translate3d(0,var(--depth-y,0),0)}
.feat-full .scrim{background:linear-gradient(90deg,rgba(18,15,12,.9) 0%,rgba(24,19,14,.71) 44%,rgba(24,19,14,.08) 76%)}
.feat-full.right .scrim{background:linear-gradient(270deg,rgba(18,15,12,.91) 0%,rgba(24,19,14,.72) 43%,rgba(24,19,14,.07) 77%)}
.feat-full .kicker{color:#d5b974}
.feat-full::before{border-color:rgba(211,184,116,.2)}
.depth-rail{display:none}
.flow-map{background:linear-gradient(145deg,#f9f6ef,rgba(255,255,255,.38));box-shadow:0 28px 70px rgba(68,50,28,.08)}
.flow-map::before{background:linear-gradient(90deg,var(--accent-dark),#bc9b5d 52%,var(--green));box-shadow:0 0 18px rgba(154,123,63,.18)}
.flow-map::after{border-color:var(--accent);box-shadow:0 0 0 8px rgba(154,123,63,.1)}
.flow-step .dot{background:var(--accent);box-shadow:0 0 0 1px rgba(154,123,63,.25)}
.flow-step:nth-child(2) .dot{background:#b59355}.flow-step:nth-child(3) .dot{background:#806332}.flow-step:nth-child(4) .dot{background:var(--green)}
.svc .row:hover::before{border-color:rgba(154,123,63,.16)}
.control-section{background:#f7f4ed}
.control-section::before{background:radial-gradient(circle,rgba(154,123,63,.11),transparent 66%)}
.control-points li::before{background:linear-gradient(135deg,var(--accent),var(--green));box-shadow:0 0 0 5px rgba(154,123,63,.09)}
.program-board{background:linear-gradient(150deg,#252018,#12110f 72%);box-shadow:42px 60px 100px -40px rgba(33,25,17,.63),-18px 24px 60px -36px rgba(154,123,63,.24)}
.program-board::before{background:radial-gradient(circle,rgba(154,123,63,.32),transparent 65%)}
.bar i,.milestone:nth-child(3) .bar i{background:linear-gradient(90deg,var(--accent),#d0b373,var(--green))}
#projekte{background:radial-gradient(circle at 86% 12%,rgba(154,123,63,.08),transparent 26%),var(--paper)}
#projekte::before{background:linear-gradient(transparent,rgba(154,123,63,.25),transparent)}
.proj .row{background:rgba(250,248,242,.72)}
.proj .row:nth-child(even){margin-left:0}
.about-grid::before{border-color:rgba(154,123,63,.2)}
.portrait::before{background:linear-gradient(145deg,rgba(154,123,63,.24),rgba(69,54,34,.12),rgba(39,72,56,.12))}
.portrait img{border-radius:42px 42px 118px 42px;transform:perspective(1000px) rotateY(2deg);box-shadow:38px 42px 80px -36px rgba(51,39,25,.42)}
.portrait-badge{background:rgba(248,245,238,.88);border-color:rgba(255,255,255,.8)}
.quals-band{background:rgba(250,248,242,.64);box-shadow:0 22px 60px rgba(60,44,25,.07)}
.faq summary::after,.btn-line{color:var(--accent-dark)}
.cta::before{background:radial-gradient(circle,rgba(154,123,63,.17),transparent 64%)}
.cta-depth{background:linear-gradient(145deg,#28231c,#11100e 72%);box-shadow:0 55px 110px -45px rgba(43,32,20,.7)}
.cta-depth::before{border-color:rgba(211,184,116,.2);box-shadow:0 0 0 75px rgba(154,123,63,.035),0 0 0 150px rgba(39,72,56,.025)}
.cta-depth::after{background:radial-gradient(circle,rgba(154,123,63,.19),transparent 67%)}
.cta-depth .btn-line{color:#d5b974}
@media(max-width:980px){
.hero-full.hero-signature{min-height:auto;padding:104px 0 110px}
.hero-shell{grid-template-columns:1fr minmax(330px,.78fr);gap:46px}
.hero-frame{height:580px}
.hero-bridge{left:-24px}
}
@media(max-width:760px){
.hero-full.hero-signature{padding:92px 0 90px}
.hero-shell{grid-template-columns:1fr;gap:44px}
.hero-copy{padding-bottom:0}
.hero-copy::before{display:none}
.hero-signature h1{font-size:clamp(45px,13vw,66px);max-width:11ch}
.hero-frame{height:min(620px,132vw);max-width:480px;margin:0 auto;border-radius:38px 38px 118px 38px}
.hero-frame::after{border-radius:28px 28px 105px 28px}
.hero-bridge{left:2px;top:44px}
.hero-identity{right:-2px;bottom:32px}
.hero-monogram{display:none}
.band{margin-top:-28px}
}
@media(max-width:520px){
.hero-signature .hero-cta{align-items:flex-start;flex-direction:column;gap:13px}
.hero-tags{margin-top:26px}
.hero-frame{height:125vw}
.hero-bridge{padding:11px 13px}
.hero-identity{width:78%;padding:14px 16px}
.feat-full{min-height:650px}
.feat-full .scrim{background:linear-gradient(180deg,rgba(18,15,12,.58),rgba(18,15,12,.92) 70%)}
.feat-full.right .scrim{background:linear-gradient(180deg,rgba(18,15,12,.56),rgba(18,15,12,.93) 70%)}
}
/* V6 — clean white product-style system */
:root{
--paper:#fff;
--paper-2:#f5f5f7;
--ink:#1d1d1f;
--ink-soft:#6e6e73;
--line:rgba(0,0,0,.1);
--accent:#76613a;
--accent-dark:#574729;
--green:#315a46;
}
body{background:#fff}
header.scrolled{background:rgba(255,255,255,.86)}
.hero-full.hero-signature{
background:#fff;
min-height:880px;
padding-bottom:126px;
}
.hero-full.hero-signature::before,
.hero-full.hero-signature::after{display:none}
.hero-copy::before{background:linear-gradient(#b6b6bb,transparent)}
.hero-signature h1 .grad{
background:none;
-webkit-background-clip:initial;
background-clip:initial;
color:#6e6e73;
}
.hero-signature .sub{color:#6e6e73}
.hero-signature .btn-white{background:#1d1d1f;box-shadow:none}
.hero-signature .btn-white:hover{background:#424245}
.hero-tags span{background:#f5f5f7;border-color:transparent}
.hero-frame{
border-radius:32px;
transform:none;
box-shadow:0 24px 60px -34px rgba(0,0,0,.32);
}
.hero-frame::after{display:none}
.hero-bridge{
background:rgba(255,255,255,.9);
border-color:rgba(0,0,0,.08);
box-shadow:0 12px 34px rgba(0,0,0,.08);
}
.hero-identity{
background:rgba(255,255,255,.9);
border-color:rgba(0,0,0,.07);
box-shadow:0 16px 40px rgba(0,0,0,.1);
}
.hero-monogram{color:rgba(29,29,31,.34)}
.band .wrap{
background:#f5f5f7;
border:0;
box-shadow:none;
}
.band .num{color:#1d1d1f}
.band .cell::after{background:linear-gradient(90deg,transparent,#1d1d1f,transparent)}
.sec-alt{background:#f5f5f7}
.kicker{color:#6e6e73}
.feat-full{
color:#1d1d1f;
background:#f5f5f7;
box-shadow:none;
}
.feat-full::before{
inset:24px;
border-color:rgba(0,0,0,.07);
border-radius:28px;
}
.feat-full::after{display:none}
.feat-full .scrim{
background:linear-gradient(90deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.94) 37%,rgba(255,255,255,.34) 59%,transparent 76%);
}
.feat-full.right .scrim{
background:linear-gradient(270deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.94) 37%,rgba(255,255,255,.34) 59%,transparent 76%);
}
.feat-full .kicker{color:#6e6e73}
.feat-full h3,.feat-full p,.flist li{color:#1d1d1f;text-shadow:none}
.feat-full p{color:#6e6e73}
.feat-inner{filter:none}
.flist li::before{background:#1d1d1f}
.flow-map{
background:#fff;
box-shadow:none;
border-color:rgba(0,0,0,.08);
}
.flow-map::before{background:linear-gradient(90deg,#1d1d1f,#8e8e93 52%,#315a46);box-shadow:none}
.flow-map::after{border-color:#1d1d1f;box-shadow:0 0 0 8px rgba(0,0,0,.05)}
.flow-step .dot,.flow-step:nth-child(2) .dot,.flow-step:nth-child(3) .dot{background:#1d1d1f}
.control-section{background:#fff}
.control-section::before{display:none}
.control-points li::before{background:#1d1d1f;box-shadow:0 0 0 5px rgba(0,0,0,.05)}
.program-board{
color:#1d1d1f;
background:#fff;
border:1px solid rgba(0,0,0,.09);
box-shadow:0 30px 70px -42px rgba(0,0,0,.38);
}
.program-board::before{background:radial-gradient(circle,rgba(0,0,0,.035),transparent 65%)}
.program-board::after{display:none}
.board-head{border-color:rgba(0,0,0,.09)}
.board-head span{color:#315a46}
.board-head span::before{background:#34c759;box-shadow:none}
.board-panel{background:#f5f5f7;border-color:rgba(0,0,0,.06)}
.board-panel h4,.milestone,.risk span,.mini-metric span{color:#6e6e73}
.bar{background:#dedee2}
.bar i,.milestone:nth-child(3) .bar i{background:linear-gradient(90deg,#1d1d1f,#8e8e93)}
.risk{background:#fff;border:1px solid rgba(0,0,0,.06)}
.mini-metric{background:#f5f5f7;border-color:rgba(0,0,0,.06)}
#projekte{background:#fff}
#projekte::before{display:none}
.proj .row{background:#f9f9fb;border-color:rgba(0,0,0,.06);box-shadow:none}
.proj .row:hover{background:#fff;box-shadow:0 18px 44px rgba(0,0,0,.07)}
.project-logo{box-shadow:none;background:#fff}
.about-grid{grid-template-columns:1fr 1fr;gap:72px}
.about-grid::before,.portrait::before{display:none}
.about-visual img{
width:100%;
aspect-ratio:4/3;
object-fit:cover;
object-position:center;
border-radius:28px;
transform:none;
box-shadow:none;
}
.about-visual figcaption{margin-top:12px;color:#86868b}
.quals-band{background:#fff;box-shadow:none}
.cta::before{display:none}
.cta-depth{
background:#f5f5f7;
color:#1d1d1f;
border-color:transparent;
box-shadow:none;
}
.cta-depth::before,.cta-depth::after{display:none}
.cta-depth .h2{color:#1d1d1f}
.cta-depth p,.cta-depth .meta{color:#6e6e73}
.cta-depth .btn-soft{background:#1d1d1f;color:#fff}
.cta-depth .btn-line{color:#1d1d1f}
@media(max-width:760px){
.hero-frame{border-radius:26px}
.about-grid{grid-template-columns:1fr;gap:34px}
}
@media(max-width:520px){
.feat-full .scrim,
.feat-full.right .scrim{
background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.97) 57%);
}
.feat-full .feat-inner{padding-top:310px}
}
/* V7 — readable contrast and two-column project grid */
.hero-signature .sub,
.band .lbl,
.svc .dsc,
.control-copy p,
.proj .role,
.about-txt p.body,
.faq .answer,
.cta-depth p,
.cta-depth .meta{color:#515154}
.feat-full .scrim{
background:linear-gradient(90deg,rgba(255,255,255,.97),rgba(255,255,255,.72) 47%,rgba(255,255,255,.06) 74%);
}
.feat-full.right .scrim{
background:linear-gradient(270deg,rgba(255,255,255,.97),rgba(255,255,255,.72) 47%,rgba(255,255,255,.06) 74%);
}
.feat-inner{
max-width:570px;
padding:38px 40px;
border:1px solid rgba(0,0,0,.07);
border-radius:28px;
background:rgba(255,255,255,.9);
backdrop-filter:blur(18px) saturate(130%);
box-shadow:0 22px 55px rgba(0,0,0,.09);
}
.feat-full h3{color:#1d1d1f}
.feat-full p{color:#424245}
.flist li{color:#1d1d1f;font-weight:500}
#projekte .h2{max-width:720px}
.proj{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
margin-top:46px;
}
.proj .row{
position:relative;
grid-template-columns:1fr;
align-content:start;
gap:18px;
min-height:235px;
padding:26px;
border-radius:24px;
}
.project-main{
grid-template-columns:124px minmax(0,1fr);
gap:22px;
align-items:center;
}
.project-logo{width:124px;height:72px;padding:14px}
.project-logo img{width:94px;height:38px}
.proj .cli{font-size:clamp(22px,2.3vw,30px)}
.proj .role{font-size:14.5px;line-height:1.55}
.proj .year{
justify-self:end;
align-self:end;
padding:6px 10px;
border-radius:999px;
background:#fff;
color:#515154;
font-size:12px;
}
@media(max-width:900px){
.proj{grid-template-columns:1fr}
.proj .row{min-height:0}
}
@media(max-width:520px){
.feat-full .feat-inner{
margin-top:250px;
padding:28px 24px;
background:rgba(255,255,255,.95);
}
.project-main{grid-template-columns:1fr;gap:16px}
.proj .year{justify-self:start}
}
/* V8 — clear German program steering view */
.steering-view{padding:28px}
.phase-line{
position:relative;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
padding:30px 4px 28px;
}
.phase-line::before{
content:"";
position:absolute;
left:9%;
right:9%;
top:40px;
height:2px;
background:#d2d2d7;
}
.phase{
position:relative;
z-index:1;
display:grid;
justify-items:center;
text-align:center;
}
.phase i{
display:block;
width:20px;
height:20px;
margin-bottom:14px;
border:5px solid #fff;
border-radius:50%;
background:#c7c7cc;
box-shadow:0 0 0 1px #c7c7cc;
}
.phase.done i{background:#315a46;box-shadow:0 0 0 1px #315a46}
.phase.active i{background:#1d1d1f;box-shadow:0 0 0 5px rgba(29,29,31,.1)}
.phase b{font-size:12px}
.phase span{margin-top:3px;color:#6e6e73;font-size:10px}
.decision-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.decision-card{
min-height:132px;
padding:16px;
border:1px solid rgba(0,0,0,.06);
border-radius:16px;
background:#f5f5f7;
}
.decision-card.priority{background:#1d1d1f;color:#fff}
.decision-card small{
display:block;
margin-bottom:12px;
color:#6e6e73;
font-size:9px;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
}
.decision-card.priority small{color:rgba(255,255,255,.58)}
.decision-card b{display:block;font-size:12px;line-height:1.35}
.decision-card span{display:block;margin-top:8px;color:#6e6e73;font-size:10px;line-height:1.35}
.decision-card.priority span{color:rgba(255,255,255,.68)}
.steering-view .board-foot{margin-top:10px}
@media(max-width:520px){
.steering-view{padding:20px}
.phase-line{grid-template-columns:1fr 1fr;row-gap:22px}
.phase-line::before{display:none}
.decision-grid{grid-template-columns:1fr}
.decision-card{min-height:0}
}
/* V9 — editorial depth and substantive working-method content */
.method-section{
position:relative;
overflow:hidden;
background:#f5f5f7;
}
.method-section::before{
content:"";
position:absolute;
right:-180px;
top:-220px;
width:520px;
height:520px;
border-radius:50%;
background:radial-gradient(circle,rgba(0,0,0,.045),transparent 67%);
pointer-events:none;
}
.method-section .wrap{position:relative}
.method-intro{
display:grid;
grid-template-columns:1fr 1fr;
gap:36px;
max-width:1000px;
margin:36px 0 46px;
}
.method-intro p{
color:#515154;
font-size:17px;
line-height:1.7;
}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.method-card{
min-height:270px;
padding:30px;
border:1px solid rgba(0,0,0,.06);
border-radius:26px;
background:#fff;
box-shadow:0 18px 50px rgba(0,0,0,.055);
transition:transform .3s,box-shadow .3s;
}
.method-card:hover{transform:translateY(-5px);box-shadow:0 28px 65px rgba(0,0,0,.085)}
.method-card>span{
display:inline-flex;
align-items:center;
justify-content:center;
width:34px;
height:34px;
margin-bottom:34px;
border-radius:50%;
background:#1d1d1f;
color:#fff;
font-size:11px;
font-weight:700;
}
.method-card h3{
max-width:12ch;
margin-bottom:14px;
font-family:var(--display);
font-size:24px;
line-height:1.08;
letter-spacing:-.025em;
}
.method-card p{color:#515154;font-size:14.5px;line-height:1.62}
.project-intro{
max-width:850px;
margin-top:24px;
color:#515154;
font-size:17px;
line-height:1.7;
}
.proj .row{
box-shadow:0 14px 38px rgba(0,0,0,.045);
}
.proj .row:hover{
transform:translateY(-4px);
box-shadow:0 24px 58px rgba(0,0,0,.085);
}
.proj .year:empty{display:none}
@media(max-width:820px){
.method-intro{grid-template-columns:1fr;gap:18px}
.method-grid{grid-template-columns:1fr}
.method-card{min-height:0}
}
/* Multi-page SEO site */
.subpage-main{padding-top:64px}
.subpage-hero{position:relative;overflow:hidden;padding:96px 0 84px;background:#fff}
.subpage-hero.soft{background:#f5f5f7}
.breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:42px;color:#6e6e73;font-size:12px}
.breadcrumb a:hover{color:#1d1d1f}
.breadcrumb i{font-style:normal;color:#aeaeb2}
.page-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.75fr);gap:72px;align-items:center}
.page-hero-copy h1{max-width:12ch;margin:0 0 26px;font-family:var(--display);font-size:clamp(48px,6.3vw,76px);line-height:.98;letter-spacing:-.052em}
.page-hero-copy .lead{max-width:690px;color:#515154;font-size:clamp(18px,2vw,22px);line-height:1.58}
.page-hero-copy .actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:32px}
.page-visual{position:relative;overflow:hidden;min-height:520px;border-radius:32px;background:#f5f5f7}
.page-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-visual.landscape{min-height:420px}
.page-visual.square{min-height:0;aspect-ratio:1}
.page-visual.square img{object-position:center}
.page-visual.landscape img{object-position:center}
.page-visual.portrait img{object-position:center 22%}
.page-visual::after{content:"";position:absolute;inset:0;border:1px solid rgba(0,0,0,.07);border-radius:inherit;pointer-events:none}
.trust-line{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.trust-line span{padding:8px 12px;border-radius:999px;background:#f5f5f7;color:#515154;font-size:12px}
.content-section{padding:90px 0;background:#fff}
.content-section.soft{background:#f5f5f7}
.section-head{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px;align-items:start;margin-bottom:46px}
.section-head .h2{font-size:clamp(34px,4.2vw,52px)}
.section-head p{color:#515154;font-size:17px;line-height:1.72}
.content-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.content-grid.two{grid-template-columns:repeat(2,1fr)}
.content-card{padding:30px;border:1px solid rgba(0,0,0,.07);border-radius:26px;background:#fff;box-shadow:0 16px 44px rgba(0,0,0,.045)}
.content-section:not(.soft) .content-card{background:#f9f9fb;box-shadow:none}
.content-card .eyebrow{display:block;margin-bottom:30px;color:#86868b;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.content-card h3{margin-bottom:13px;font-family:var(--display);font-size:24px;line-height:1.12;letter-spacing:-.025em}
.content-card p{color:#515154;font-size:14.5px;line-height:1.65}
.content-card ul{display:grid;gap:10px;margin-top:18px;padding:0;list-style:none;color:#424245;font-size:14px}
.content-card li{display:flex;gap:9px}
.content-card li::before{content:"";width:6px;height:6px;flex:0 0 6px;margin-top:8px;border-radius:50%;background:#1d1d1f}
.split-copy{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}
.split-copy h2{font-family:var(--display);font-size:clamp(34px,4.2vw,52px);line-height:1.04;letter-spacing:-.035em}
.prose{display:grid;gap:20px}
.prose p{color:#515154;font-size:17px;line-height:1.72}
.prose h3{margin-top:14px;font-family:var(--display);font-size:25px}
.deliverable-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.deliverable{display:flex;gap:14px;padding:20px;border-radius:18px;background:#f5f5f7}
.deliverable b{display:block;font-size:15px}
.deliverable p{margin-top:4px;color:#6e6e73;font-size:13px;line-height:1.5}
.deliverable i{display:flex;align-items:center;justify-content:center;width:30px;height:30px;flex:0 0 30px;border-radius:50%;background:#1d1d1f;color:#fff;font-style:normal;font-size:11px}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.case-card{display:flex;flex-direction:column;padding:30px;border:1px solid rgba(0,0,0,.07);border-radius:28px;background:#fff;box-shadow:0 18px 50px rgba(0,0,0,.055);transition:.3s}
a.case-card:hover{transform:translateY(-5px);box-shadow:0 28px 65px rgba(0,0,0,.085)}
.case-card .tag{align-self:flex-start;padding:7px 10px;border-radius:999px;background:#f5f5f7;color:#515154;font-size:11px}
.case-card h3{margin:34px 0 14px;font-family:var(--display);font-size:28px;line-height:1.08;letter-spacing:-.03em}
.case-card p{color:#515154;font-size:14.5px;line-height:1.65}
.case-card .case-link{margin-top:auto;padding-top:26px;font-weight:600;font-size:14px}
.fact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:36px}
.fact{padding:20px;border-radius:18px;background:#f5f5f7}
.fact small{display:block;margin-bottom:8px;color:#86868b;font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.fact b{font-size:15px;line-height:1.35}
.result-panel{padding:42px;border-radius:30px;background:#1d1d1f;color:#fff}
.result-panel h2{max-width:13ch;font-family:var(--display);font-size:clamp(34px,4.4vw,54px);line-height:1.03;letter-spacing:-.04em}
.result-panel p{max-width:760px;margin-top:22px;color:rgba(255,255,255,.72);font-size:17px;line-height:1.7}
.related-pages{padding:70px 0;background:#f5f5f7}
.related-links{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}
.related-link{padding:24px;border-radius:20px;background:#fff;border:1px solid rgba(0,0,0,.06)}
.related-link small{display:block;color:#86868b;font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.related-link b{display:block;margin-top:10px;font-size:18px}
.related-link span{display:block;margin-top:8px;color:#6e6e73;font-size:13px}
.page-cta{padding:84px 0;background:#fff}
.page-cta-box{padding:64px 42px;border-radius:32px;background:#f5f5f7;text-align:center}
.page-cta-box h2{max-width:760px;margin:0 auto;font-family:var(--display);font-size:clamp(36px,4.8vw,58px);line-height:1.03;letter-spacing:-.04em}
.page-cta-box p{max-width:620px;margin:20px auto 30px;color:#515154;font-size:17px;line-height:1.65}
.site-map-footer{display:flex;gap:16px;flex-wrap:wrap}
.site-map-footer a:hover{color:#1d1d1f}
@media(max-width:900px){
.page-hero-grid,.section-head,.split-copy{grid-template-columns:1fr}
.page-hero-grid{gap:42px}
.page-visual{min-height:500px;max-width:560px}
.content-grid,.case-grid,.related-links{grid-template-columns:1fr}
.content-grid.two{grid-template-columns:1fr}
.fact-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
.subpage-hero{padding:70px 0 62px}
.page-hero-copy h1{font-size:clamp(43px,13vw,62px)}
.page-visual{min-height:120vw}
.page-visual.landscape{min-height:72vw}
.deliverable-list,.fact-grid{grid-template-columns:1fr}
.content-section{padding:66px 0}
.content-card,.case-card{padding:24px}
.result-panel,.page-cta-box{padding:42px 24px}
}
/* ══════════════════════════════════════════════════════════════════════════
Korrekturen – Desktop-Darstellung bleibt unverändert (alle Layoutregeln
greifen ausschließlich unterhalb von 900px)
══════════════════════════════════════════════════════════════════════════ */
/* Mobile Navigation – auf großen Bildschirmen unsichtbar, ändert dort nichts */
.menu-btn{display:none;width:42px;height:42px;flex:0 0 42px;align-items:center;justify-content:center;
background:none;border:0;padding:0;cursor:pointer;color:var(--ink);border-radius:12px}
.menu-btn svg{width:24px;height:24px;flex:0 0 24px;display:block}
.menu-btn:hover{background:rgba(0,0,0,.05)}
#mobilenav{display:none}
@media(max-width:880px){
.menu-btn{display:flex}
.nav-right>.btn-primary{display:none}
#mobilenav{display:block;position:absolute;top:100%;left:0;right:0;z-index:59;
background:rgba(255,255,255,.98);-webkit-backdrop-filter:saturate(180%) blur(20px);
backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line);
box-shadow:0 22px 44px -22px rgba(0,0,0,.22);
max-height:0;overflow:hidden;transition:max-height .32s cubic-bezier(.4,0,.2,1)}
#mobilenav.open{max-height:min(80vh,560px);overflow-y:auto}
#mobilenav ul{list-style:none;margin:0;padding:6px 28px 22px}
#mobilenav li{border-bottom:1px solid var(--line)}
#mobilenav li:last-child{border-bottom:0}
#mobilenav a{display:block;padding:15px 2px;font-family:var(--display);font-size:18px;
font-weight:600;letter-spacing:-.02em;color:var(--ink)}
#mobilenav a[aria-current="page"]{color:var(--ink-soft)}
#mobilenav .mn-cta{margin-top:16px;border-bottom:0}
#mobilenav .mn-cta a{background:var(--ink);color:#fff;text-align:center;
border-radius:999px;padding:14px;font-size:16px}
}
/* Lange deutsche Komposita brechen auf ALLEN Breiten sauber um */
h1,h2,.h2,h3{hyphens:none;-webkit-hyphens:none;text-wrap:balance}
.page-hero-copy,.page-hero-grid>*,.hero-copy,.split-copy>*{min-width:0}
/* Textüberlauf – ausschließlich auf schmalen Bildschirmen */
@media(max-width:900px){
nav,.brand,.nav-right,#mobilenav,#mobilenav ul,#mobilenav li,#mobilenav a{min-width:0}
main *,.hero-shell>*,.hero-copy,.hero-visual{min-width:0}
.page-hero-grid,.section-head,.split-copy{grid-template-columns:minmax(0,1fr)}
h1,h2,.h2,h3,p,li,b,strong,span,a,em,small{overflow-wrap:break-word}
h1,h2,.h2,h3{hyphens:none;-webkit-hyphens:none;text-wrap:balance}
.hero-full.hero-signature{padding:92px 0 90px}
.hero-shell{grid-template-columns:minmax(0,1fr);gap:44px}
.hero-copy{padding-bottom:0}
.hero-copy::before{display:none}
.hero-frame{height:min(620px,110vw);max-width:480px;margin:0 auto}
.hero-bridge{left:2px;top:44px}
.hero-identity{right:-2px;bottom:32px}
.hero-monogram{display:none}
}
@media(max-width:560px){
.hero-signature h1{font-size:clamp(33px,8.8vw,44px);max-width:100%}
.avail{font-size:10px;letter-spacing:.06em}
.hero-identity{width:auto;max-width:82%}
#mobilenav ul{padding:6px 20px 22px}
}
@media(max-width:360px){
header .wrap{padding:0 14px}
.brand{font-size:17px}
#mobilenav ul{padding:6px 14px 20px}
#mobilenav a{font-size:17px}
.band .wrap{grid-template-columns:1fr 1fr}
.band .cell{padding:28px 10px}
.band .num{font-size:34px}
.band .lbl{font-size:12.5px}
.hero-tags span{font-size:11px;padding:7px 10px}
}
/* Rechtstexte (Impressum / Datenschutz) */
.legal-prose{max-width:820px}
.legal-prose h2{font-family:var(--display);font-weight:600;font-size:22px;
letter-spacing:-.02em;margin:38px 0 12px}
.legal-prose h2:first-child{margin-top:0}
.legal-prose p,.legal-prose li{color:var(--ink-soft);font-size:16px;line-height:1.72;margin-bottom:12px}
.legal-prose ul{padding-left:22px;margin-bottom:12px}
.legal-prose a{color:var(--accent)}
.legal-note{border:1px solid #ffd9a8;background:#fff8ee;border-radius:14px;
padding:16px 18px;color:#7a4c00;font-size:15px;line-height:1.6;margin:0 0 26px}
.legal-note strong{color:#5c3900}
/* Karten ohne Beschriftung: Mindesthöhe entfällt, Innenabstand bleibt ruhig */
.case-card p:last-child{margin-bottom:2px}
/* Fix 4 · Karten-Grids: 1fr hat als Minimum die Inhaltsbreite, dadurch lief die
Seite bei ~1024px seitlich aus dem Bild. minmax(0,1fr) erlaubt echtes Schrumpfen.
Bei ausreichender Breite rechnet der Browser identisch – Darstellung unverändert. */
@media(min-width:901px){
.case-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.content-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.content-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
.content-grid,.case-grid,.related-links,.content-grid.two{grid-template-columns:minmax(0,1fr)}
}
.case-card,.content-card,.related-links>*{min-width:0}
.case-card h3,.content-card h3{hyphens:none;-webkit-hyphens:none}
.case-card p,.content-card p{overflow-wrap:break-word}
/* Textkarte im Vollflaechen-Block sicher rechtsbuendig */
.feat-full.right>.wrap{width:100%}
.feat-full.right .feat-inner{margin-left:auto;margin-right:0}
/* Kontakt: Verlauf spaeter einsetzen, Person links bleibt klar */
.feat-full.right.scrim-late .scrim{background:linear-gradient(270deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.9) 22%,rgba(255,255,255,.45) 40%,rgba(255,255,255,0) 55%)}
/* Seiten-Hero ohne Bild: Text nutzt die volle Breite statt in der halben Spalte zu kleben */
.page-hero-grid:has(> :only-child){grid-template-columns:minmax(0,1fr)}
.page-hero-grid:has(> :only-child) .page-hero-copy h1{max-width:20ch}
.page-hero-grid:has(> :only-child) .page-hero-copy .lead{max-width:78ch}
@supports not selector(:has(*)){
.hero-solo .page-hero-grid{grid-template-columns:minmax(0,1fr)}
.hero-solo .page-hero-copy h1{max-width:20ch}
.hero-solo .page-hero-copy .lead{max-width:78ch}
}
/* ===== Navigation: Rubriken, Aufklappmenü, Standortanzeige ===== */
.navgroup{position:relative;display:flex;align-items:center}
.navgroup-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;
font:inherit;font-size:14px;font-weight:400;color:inherit;opacity:.82;padding:0;transition:.2s}
.navgroup-btn i{font-style:normal;font-size:13px;transform:rotate(90deg);transition:transform .2s}
.navgroup-btn[aria-expanded="true"] i{transform:rotate(-90deg)}
.navgroup-btn:hover{opacity:1}
.navgroup-menu{position:absolute;top:calc(100% + 14px);left:-18px;min-width:272px;padding:10px;
background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:18px;
box-shadow:0 26px 60px -22px rgba(0,0,0,.32);opacity:0;visibility:hidden;transform:translateY(-6px);
transition:opacity .18s,transform .18s,visibility .18s;z-index:70}
.navgroup-btn[aria-expanded="true"] + .navgroup-menu{opacity:1;visibility:visible;transform:none}
.navgroup-menu a{display:block;padding:10px 14px;border-radius:12px;font-size:14.5px;
color:var(--ink);opacity:1;white-space:nowrap;transition:background .15s}
.navgroup-menu a:hover{background:#f2f2f4}
.navgroup-menu a[aria-current="page"]{background:#f2f2f4;font-weight:500}
/* aktueller Bereich klar markiert statt ausgegraut */
.navlinks a.is-section,.navlinks a[aria-current="page"],.navgroup-btn.is-section{opacity:1;font-weight:500}
.navlinks a.is-section::after,.navlinks a[aria-current="page"]::after,.navgroup-btn.is-section::after{
content:"";position:absolute;left:0;right:0;bottom:-9px;height:2px;border-radius:2px;background:currentColor}
.navlinks > a,.navgroup-btn{position:relative}
/* Mobiles Menü: Rubrik mit Unterpunkten */
#mobilenav .mn-label{display:block;padding:16px 2px 6px;font-size:11.5px;letter-spacing:.14em;
text-transform:uppercase;color:var(--ink-soft);font-weight:600}
#mobilenav .mn-sub{list-style:none;margin:0 0 8px;padding:0}
#mobilenav .mn-sub li{border-bottom:0}
#mobilenav .mn-sub a{padding:11px 0 11px 14px;font-size:16.5px;border-left:2px solid var(--line)}
#mobilenav a[aria-current="page"]{color:var(--ink);font-weight:600}
#mobilenav .mn-sub a[aria-current="page"]{border-left-color:var(--ink)}
/* ===== Theme-Toggle-Button ===== */
.theme-btn{background:rgba(255,255,255,.92);border:1.5px solid rgba(0,0,0,.2);border-radius:50%;cursor:pointer;width:36px;height:36px;padding:0;color:#1d1d1f;transition:background .25s,border-color .25s,box-shadow .25s;display:flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.theme-btn:hover{background:#fff;border-color:rgba(0,0,0,.35);box-shadow:0 2px 8px rgba(0,0,0,.18)}
header.scrolled .theme-btn{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.18);color:var(--ink);box-shadow:none}
header.scrolled .theme-btn:hover{background:rgba(0,0,0,.1);border-color:rgba(0,0,0,.3)}
html[data-theme="dark"] .theme-btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff;box-shadow:0 1px 4px rgba(0,0,0,.4)}
html[data-theme="dark"] .theme-btn:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.6)}
html[data-theme="dark"] header.scrolled .theme-btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#f5f5f7}
html[data-theme="dark"] header.scrolled .theme-btn:hover{background:rgba(255,255,255,.15)}
.icon-sun{display:none}
.icon-moon{display:block}
html[data-theme="dark"] .icon-sun{display:block}
html[data-theme="dark"] .icon-moon{display:none}
/* ===== Scroll-Hint auf Mobilgeräten ausblenden ===== */
@media(max-width:900px){.scroll-hint{display:none}}
/* ===== Dark Mode ===== */
html[data-theme="dark"]{--paper:#1c1c1e;--paper-2:#2c2c2e;--ink:#f5f5f7;--ink-soft:#aeaeb2;--line:rgba(255,255,255,.12);--accent:#b59355;--accent-dark:#d5b974;--green:#4a8c6a}
html[data-theme="dark"] body{background:#1c1c1e;color:#f5f5f7}
html[data-theme="dark"] header.scrolled{background:rgba(28,28,30,.94);border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .navgroup-menu{background:#2c2c2e;border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .navgroup-menu a{color:#f5f5f7}
html[data-theme="dark"] .navgroup-menu a:hover,html[data-theme="dark"] .navgroup-menu a[aria-current="page"]{background:#3a3a3c}
html[data-theme="dark"] #mobilenav{background:rgba(28,28,30,.98)}
html[data-theme="dark"] .skip-link{background:#2c2c2e;color:#f5f5f7}
html[data-theme="dark"] .hero-full.hero-signature{background:#1c1c1e}
html[data-theme="dark"] .hero-bridge,html[data-theme="dark"] .hero-identity{background:rgba(44,44,46,.9)!important;border-color:rgba(255,255,255,.12)!important}
html[data-theme="dark"] .hero-bridge b,html[data-theme="dark"] .hero-identity strong{color:#f5f5f7}
html[data-theme="dark"] .hero-tags span{background:#2c2c2e;border-color:rgba(255,255,255,.1);color:#aeaeb2}
html[data-theme="dark"] .hero-copy::before{background:linear-gradient(#5a5a5e,transparent)}
html[data-theme="dark"] .avail{color:rgba(245,245,247,.8)}
html[data-theme="dark"] .band{background:#2c2c2e;border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .band .wrap{background:#2c2c2e!important;border-color:rgba(255,255,255,.1)!important;box-shadow:none!important}
html[data-theme="dark"] .band .num{color:#f5f5f7!important}
html[data-theme="dark"] .band .lbl{color:#aeaeb2}
html[data-theme="dark"] .band .cell{border-color:rgba(255,255,255,.1)!important}
html[data-theme="dark"] .sec-alt{background:#2c2c2e!important}
html[data-theme="dark"] .feat-full{background:#2c2c2e!important;color:#f5f5f7!important}
html[data-theme="dark"] .feat-full h3{color:#f5f5f7!important}
html[data-theme="dark"] .feat-full p{color:#aeaeb2!important}
html[data-theme="dark"] .feat-inner{background:rgba(44,44,46,.95)!important;border-color:rgba(255,255,255,.08)!important}
html[data-theme="dark"] .feat-full .scrim{background:linear-gradient(90deg,rgba(28,28,30,.97),rgba(28,28,30,.72) 47%,rgba(28,28,30,.06) 74%)!important}
html[data-theme="dark"] .feat-full.right .scrim{background:linear-gradient(270deg,rgba(28,28,30,.97),rgba(28,28,30,.72) 47%,rgba(28,28,30,.06) 74%)!important}
html[data-theme="dark"] .feat-full.right.scrim-late .scrim{background:linear-gradient(270deg,rgba(28,28,30,.97),rgba(28,28,30,.9) 22%,rgba(28,28,30,.45) 40%,rgba(28,28,30,0) 55%)!important}
html[data-theme="dark"] .flist li{color:#f5f5f7!important}
html[data-theme="dark"] .flist li::before{background:#f5f5f7!important}
html[data-theme="dark"] .flow-map{background:#2c2c2e!important;border-color:rgba(255,255,255,.1)!important}
html[data-theme="dark"] .flow-map::before{background:linear-gradient(90deg,#f5f5f7,#8e8e93 52%,#4a8c6a);box-shadow:none}
html[data-theme="dark"] .flow-map::after{border-color:#f5f5f7;box-shadow:0 0 0 8px rgba(255,255,255,.06)}
html[data-theme="dark"] .flow-step .dot,html[data-theme="dark"] .flow-step:nth-child(2) .dot,html[data-theme="dark"] .flow-step:nth-child(3) .dot,html[data-theme="dark"] .flow-step:nth-child(4) .dot{background:#f5f5f7!important}
html[data-theme="dark"] .flow-step b{color:#f5f5f7}
html[data-theme="dark"] .flow-step span{color:#aeaeb2}
html[data-theme="dark"] .svc{border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .svc .row{border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .svc .row:hover{background:#2c2c2e!important;box-shadow:0 20px 46px rgba(0,0,0,.3)}
html[data-theme="dark"] .svc .ttl{color:#f5f5f7}
html[data-theme="dark"] .svc .idx{color:#aeaeb2}
html[data-theme="dark"] .control-section{background:#1c1c1e!important}
html[data-theme="dark"] .program-board{background:#2c2c2e!important;color:#f5f5f7!important;border-color:rgba(255,255,255,.1)!important;box-shadow:0 30px 70px -42px rgba(0,0,0,.7)!important}
html[data-theme="dark"] .program-board::before{background:radial-gradient(circle,rgba(255,255,255,.05),transparent 65%)}
html[data-theme="dark"] .board-head{border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .board-head b{color:#f5f5f7}
html[data-theme="dark"] .board-panel{background:#3a3a3c!important;border-color:rgba(255,255,255,.06)!important}
html[data-theme="dark"] .board-panel h4,html[data-theme="dark"] .milestone,html[data-theme="dark"] .risk span,html[data-theme="dark"] .mini-metric span{color:#aeaeb2!important}
html[data-theme="dark"] .milestone{color:#aeaeb2}
html[data-theme="dark"] .bar{background:#48484a!important}
html[data-theme="dark"] .bar i,html[data-theme="dark"] .milestone:nth-child(3) .bar i{background:linear-gradient(90deg,#f5f5f7,#8e8e93)!important}
html[data-theme="dark"] .risk{background:#2c2c2e!important;border-color:rgba(255,255,255,.06)!important}
html[data-theme="dark"] .risk b{color:#f5f5f7}
html[data-theme="dark"] .mini-metric{background:#3a3a3c!important;border-color:rgba(255,255,255,.06)!important}
html[data-theme="dark"] .mini-metric b{color:#f5f5f7}
html[data-theme="dark"] #projekte{background:#1c1c1e!important}
html[data-theme="dark"] .proj{border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .proj .row{background:#2c2c2e!important;border-color:rgba(255,255,255,.08)!important;box-shadow:none!important}
html[data-theme="dark"] .proj .row:hover{background:#3a3a3c!important;box-shadow:0 20px 46px rgba(0,0,0,.3)!important}
html[data-theme="dark"] .project-logo{background:#2c2c2e!important;border-color:rgba(255,255,255,.1)!important;box-shadow:none!important}
html[data-theme="dark"] .lw .m,html[data-theme="dark"] .lw .s{color:#f5f5f7}
html[data-theme="dark"] .proj .year{background:#3a3a3c!important;color:#aeaeb2!important}
html[data-theme="dark"] .proj .cli{color:#f5f5f7}
html[data-theme="dark"] .proj .role{color:#aeaeb2}
html[data-theme="dark"] .quals-band{background:#2c2c2e!important;box-shadow:none!important}
html[data-theme="dark"] .portrait img{filter:brightness(.86)}
html[data-theme="dark"] .portrait-badge{background:rgba(44,44,46,.9)!important;border-color:rgba(255,255,255,.1)!important}
html[data-theme="dark"] details>summary{color:#f5f5f7}
html[data-theme="dark"] .faq{border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] details[open]>summary{color:#f5f5f7}
html[data-theme="dark"] .cta-depth{background:#2c2c2e!important;color:#f5f5f7!important;border-color:rgba(255,255,255,.1)!important}
html[data-theme="dark"] .cta-depth .h2{color:#f5f5f7!important}
html[data-theme="dark"] .cta-depth p,html[data-theme="dark"] .cta-depth .meta{color:#aeaeb2!important}
html[data-theme="dark"] .cta-depth .btn-soft{background:#f5f5f7!important;color:#1c1c1e!important}
html[data-theme="dark"] .cta-depth .btn-line{color:#f5f5f7!important}
html[data-theme="dark"] footer{background:#1c1c1e!important;border-color:rgba(255,255,255,.1)!important;color:#aeaeb2}
html[data-theme="dark"] .foot-nav a,html[data-theme="dark"] .foot-legal a{color:#aeaeb2}
html[data-theme="dark"] .foot-brand{color:#f5f5f7}
/* Subpages */
html[data-theme="dark"] .subpage-hero,html[data-theme="dark"] .page-hero{background:#2c2c2e!important}
html[data-theme="dark"] .page-hero-copy h1{color:#f5f5f7}
html[data-theme="dark"] .page-hero-copy .lead{color:#aeaeb2}
html[data-theme="dark"] .page-visual{border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .content-section{background:#1c1c1e}
html[data-theme="dark"] .content-section.alt{background:#2c2c2e}
html[data-theme="dark"] .content-card,html[data-theme="dark"] .case-card{background:#2c2c2e!important;border-color:rgba(255,255,255,.08)!important}
html[data-theme="dark"] .content-card h3,html[data-theme="dark"] .case-card h3{color:#f5f5f7}
html[data-theme="dark"] .content-card p,html[data-theme="dark"] .case-card p{color:#aeaeb2}
html[data-theme="dark"] .result-panel,html[data-theme="dark"] .page-cta-box{background:#2c2c2e!important;border-color:rgba(255,255,255,.08)!important}
html[data-theme="dark"] .method-section{background:#2c2c2e!important}
html[data-theme="dark"] .steering-view{background:#1c1c1e}
html[data-theme="dark"] .decision-card{background:#2c2c2e!important;border-color:rgba(255,255,255,.06)!important}
html[data-theme="dark"] .decision-card b{color:#f5f5f7}
html[data-theme="dark"] .decision-card.priority{background:#3a3a3c!important}
html[data-theme="dark"] .phase-line::before{background:#48484a}
html[data-theme="dark"] .phase i{border-color:#1c1c1e}
html[data-theme="dark"] .legal-note{background:#2c2c2e!important;border-color:rgba(255,255,255,.12)!important;color:#aeaeb2!important}
html[data-theme="dark"] .legal-note strong{color:#f5f5f7!important}
html[data-theme="dark"] .about-visual img{filter:brightness(.85)}
html[data-theme="dark"] .split-copy h2,html[data-theme="dark"] .section-head h2{color:#f5f5f7}
html[data-theme="dark"] .fact-card{background:#2c2c2e!important;border-color:rgba(255,255,255,.08)!important}
html[data-theme="dark"] .fact-card h3{color:#f5f5f7}
html[data-theme="dark"] .deliverable-list li{border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .deliverable-list li strong{color:#f5f5f7}
html[data-theme="dark"] .related-links>*{background:#2c2c2e!important;border-color:rgba(255,255,255,.08)!important}
html[data-theme="dark"] .hero-signature .btn-white{background:#f5f5f7!important;color:#1c1c1e!important}
html[data-theme="dark"] .hero-signature .btn-lw{color:#f5f5f7!important}