
:root{
  --ink:#f1eee8; --muted:#a9afb9; --paper:#08090d; --paper2:#0b0d12;
  --gold:#b69cf2; --gold2:#e2d6ff; /* HAUSFARBE_20261010 (KEES): Lilac statt Gold */ --blue:#8fb7dd; --violet:#74658b;
  --line:rgba(255,255,255,.12); --line2:rgba(255,255,255,.065);
  --max:1380px; --pad:clamp(20px,4vw,58px);
  --serif:"Iowan Old Style","Baskerville","Times New Roman",serif;
  --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#07080b}
body{margin:0;color:var(--ink);background:
radial-gradient(1000px 500px at 80% -10%,rgba(65,78,113,.12),transparent 70%),
linear-gradient(180deg,#07080b 0%,#0a0c11 38%,#07080b 100%);
font-family:var(--sans);line-height:1.5;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' 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='.12'/%3E%3C/svg%3E")}
img{max-width:100%} a{color:inherit}
.wrap{width:min(calc(100% - 2*var(--pad)),var(--max));margin-inline:auto}
.topbar{position:fixed;left:0;right:0;top:0;z-index:60;border-bottom:1px solid var(--line2);background:linear-gradient(180deg,rgba(7,8,11,.86),rgba(7,8,11,.58));backdrop-filter:blur(22px) saturate(125%)}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:15px;text-decoration:none}.brand b{font-size:13px;letter-spacing:.34em}.brand span{font-size:9px;letter-spacing:.18em;color:#989ca5;text-transform:uppercase}
.navlinks{display:flex;align-items:center;gap:25px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#c2c5cb}.navlinks a{text-decoration:none;position:relative}.navlinks>a:not(.btn):after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--gold);transition:.25s}.navlinks>a:hover:after{right:0}
.menu-btn{display:none;color:#fff;border:1px solid var(--line);background:rgba(255,255,255,.03);height:42px;padding:0 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border:1px solid rgba(182,156,242,.7);text-decoration:none;text-transform:uppercase;font-size:10px;letter-spacing:.15em;transition:.22s ease;background:rgba(8,9,13,.1);color:#f0e5cf}
.btn:hover{background:#b69cf2;color:#111;border-color:#b69cf2;transform:translateY(-1px)}
.btn.solid{background:#b69cf2;color:#101010;border-color:#b69cf2}

/* EDITORIAL HERO */
.hero{min-height:100svh;padding:124px 0 54px;position:relative;display:grid;align-items:stretch;overflow:hidden;border:0}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:58% center;filter:contrast(1.04) saturate(.88)}
.hero-media:after{content:"";position:absolute;inset:0;background:
linear-gradient(90deg,rgba(5,6,8,.99) 0%,rgba(5,6,8,.91) 31%,rgba(5,6,8,.51) 57%,rgba(5,6,8,.18) 76%,rgba(5,6,8,.55) 100%),
linear-gradient(180deg,rgba(5,6,8,.45) 0%,transparent 30%,rgba(5,6,8,.7) 100%)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.55fr);gap:7vw;align-items:end;height:100%}
.hero-main{padding-top:13vh}.eyebrow,.kicker{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold2);margin-bottom:19px}
.hero h1{font-family:var(--serif);font-size:clamp(72px,10.6vw,164px);font-weight:400;line-height:.78;letter-spacing:-.055em;margin:0;text-wrap:balance}
.hero h1 .thin{font-style:italic;font-weight:400;color:#d9d5cc}
.hero-copy{font-size:clamp(18px,1.7vw,27px);line-height:1.35;max-width:760px;margin:42px 0 0;color:#ece8e0}
.hero-copy strong{font-weight:550}
.hero-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:32px}
.hero-aside{border-left:1px solid rgba(255,255,255,.22);padding-left:28px;margin-bottom:4vh}
.hero-aside .number{font-family:var(--serif);font-size:clamp(70px,7vw,108px);line-height:.85;color:var(--gold2)}
.hero-aside p{max-width:330px;color:#d0d1d4;font-size:14px}
.hero-aside .micro{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:#9da2aa}
.hero-bottom{position:absolute;z-index:3;left:var(--pad);right:var(--pad);bottom:24px;display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid rgba(255,255,255,.18);padding-top:14px;color:#c6c8cc;font-size:10px;letter-spacing:.10em;text-transform:uppercase}
.hero-bottom div:nth-child(2){text-align:center}.hero-bottom div:last-child{text-align:right}

/* TYPOGRAPHIC SECTIONS */
section{position:relative;padding:clamp(92px,10vw,154px) 0;border-top:1px solid var(--line2)}
h1,h2,.display,.statement,.quote{font-family:var(--serif);font-weight:400}
h2{font-size:clamp(46px,6.4vw,92px);line-height:.96;letter-spacing:-.045em;margin:0 0 34px;max-width:1100px}
.lead{font-family:var(--serif);font-size:clamp(23px,2.6vw,37px);line-height:1.26;color:#ddd9d1;max-width:960px}
.copy{font-size:15px;line-height:1.8;color:#bfc3ca;max-width:720px}
.statement{font-size:clamp(37px,5.2vw,78px);line-height:1.04;letter-spacing:-.035em;max-width:1180px}
.statement em{font-style:normal;color:var(--gold2)}
.section-index{position:absolute;right:var(--pad);top:36px;color:#626772;font-family:var(--serif);font-size:12px}

/* ASYMMETRIC VISUAL EDITORIAL */
.editorial-split{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(36px,7vw,110px);align-items:center}
.editorial-split.reverse{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
.visual-frame{position:relative;min-height:620px;overflow:hidden;background:#0c0e12}
.visual-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.visual-frame:hover img{transform:scale(1.025)}
.visual-frame:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.09),inset 0 -140px 160px rgba(4,5,7,.35)}
.visual-cap{position:absolute;z-index:2;left:21px;right:21px;bottom:18px;display:flex;justify-content:space-between;gap:20px;font-size:9px;text-transform:uppercase;letter-spacing:.15em;color:#d7d5cf}
.visual-cap span:last-child{color:#b7a27c}
.pullquote{border-top:1px solid rgba(182,156,242,.52);padding-top:23px;margin-top:44px;font-family:var(--serif);font-size:clamp(28px,3vw,44px);line-height:1.16;color:#f0ece5}

/* BAND / TYPOGRAPHIC INTERRUPTION */
.black-band{padding:0;border:0;background:#050608;overflow:hidden}
.band-grid{display:grid;grid-template-columns:1.2fr .8fr;min-height:86vh}
.band-visual{position:relative;overflow:hidden}.band-visual img{width:100%;height:100%;object-fit:cover;display:block}
.band-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,#050608 100%)}
.band-copy{display:flex;flex-direction:column;justify-content:center;padding:9vw 6vw 9vw 2vw}
.band-copy h2{font-size:clamp(52px,6.2vw,94px)}
.band-copy .accent{color:var(--gold2)}

/* THREE PILLARS — not cards */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:72px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pillar{min-height:360px;padding:34px 34px 40px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(180deg,rgba(255,255,255,.015),transparent)}
.pillar:last-child{border-right:0}.pillar .n{font-family:var(--serif);font-size:62px;color:#b69cf2}.pillar h3{font-family:var(--serif);font-size:34px;font-weight:400;margin:0}.pillar p{color:#adb2bb;max-width:320px}

/* HORIZONTAL PROCESS */
.process{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);margin-top:62px}
.step{padding:26px 26px 48px;border-right:1px solid var(--line);min-height:250px}.step:last-child{border-right:0}
.step .tag{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#8e939c}.step b{display:block;font-family:var(--serif);font-size:32px;font-weight:400;margin:60px 0 10px;color:#f3eee4}.step p{font-size:12px;color:#a8adb6}

/* SEASON 4 */
.season{background:#090a0e}
.season-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;align-items:end}
.season-number{font-family:var(--serif);font-size:clamp(120px,19vw,280px);line-height:.7;color:transparent;-webkit-text-stroke:1px rgba(226,214,255,.45);text-align:right}
.domain-list{margin-top:68px;border-top:1px solid var(--line)}
.domain-row{display:grid;grid-template-columns:110px 1fr 220px;gap:28px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:.2s}
.domain-row:hover{padding-left:14px;background:linear-gradient(90deg,rgba(182,156,242,.07),transparent)}
.domain-row .idx{font-family:var(--serif);font-size:24px;color:#84765f}.domain-row .domain{font-family:var(--serif);font-size:clamp(31px,4vw,58px);letter-spacing:-.03em}
.domain-row .segment{text-align:right;color:#aeb3bc;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.exclusivity{display:grid;grid-template-columns:.72fr 1.28fr;gap:6vw;margin-top:92px;padding-top:34px;border-top:1px solid rgba(226,214,255,.38)}
.exclusivity .big{font-family:var(--serif);font-size:clamp(46px,6vw,84px);line-height:.98;color:var(--gold2)}

/* OFFER */
.offer-stage{background:
linear-gradient(180deg,rgba(8,9,13,.5),#08090d),
url('../img/season4/boardroom-analysis.png') center/cover fixed}
.offer-glass{display:grid;grid-template-columns:1.08fr .92fr;gap:0;border:1px solid rgba(255,255,255,.14);background:rgba(8,9,13,.73);backdrop-filter:blur(16px)}
.offer-copy{padding:clamp(35px,5vw,74px)}
.offer-panel{padding:clamp(35px,5vw,74px);border-left:1px solid var(--line);background:linear-gradient(180deg,rgba(182,156,242,.08),rgba(255,255,255,.01))}
.price{font-family:var(--serif);font-size:clamp(72px,9vw,130px);line-height:.86;letter-spacing:-.04em}
.offer-panel ul{list-style:none;padding:0;margin:34px 0}.offer-panel li{padding:13px 0;border-bottom:1px solid var(--line);color:#c4c7cd}

/* SUBPAGES */
.pagehead{padding:160px 0 88px;min-height:62vh;display:flex;align-items:flex-end;position:relative;overflow:hidden}
.pagehead:before{content:"";position:absolute;inset:0;background:radial-gradient(700px 350px at 75% 40%,rgba(92,113,154,.15),transparent 65%)}
.pagehead .wrap{position:relative;z-index:1}.pagehead h1{font-family:var(--serif);font-size:clamp(60px,9vw,132px);line-height:.85;letter-spacing:-.05em;margin:0}
.breadcrumbs{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:#858a92;margin-bottom:26px}.breadcrumbs a{text-decoration:none}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{border-top:1px solid var(--line);padding:28px 0;min-height:220px;background:none}.card .n{font-family:var(--serif);font-size:56px;color:var(--gold2)}.card h3{font-family:var(--serif);font-size:30px;font-weight:400}.card p{color:var(--muted)}
.darkpanel{border:1px solid var(--line);background:rgba(16,20,29,.84);padding:44px}.quote{font-size:clamp(34px,4vw,62px);line-height:1.07;margin:0}
.rulelist{border-top:1px solid var(--line);margin-top:32px}.rule{display:grid;grid-template-columns:180px 1fr;gap:22px;padding:18px 0;border-bottom:1px solid var(--line)}.rule b{color:var(--gold2)}.rule span{color:#c8cbd1}
.metric{padding:20px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:230px 1fr;gap:20px}.metric b{color:var(--gold2)}
.visual{position:relative;overflow:hidden;border:1px solid var(--line);background:#050608}.visual img{display:block;width:100%;height:auto}.cap{position:absolute;left:18px;bottom:15px;background:rgba(7,8,11,.72);padding:9px 11px;font-size:9px;letter-spacing:.14em;text-transform:uppercase}
.svgpanel{border-top:1px solid var(--line);padding-top:26px}.svgpanel img{width:100%}
.note{border-left:1px solid var(--gold);padding:6px 0 6px 20px;color:#d7d8dc}
.small{font-size:11px;color:var(--muted)}.sticky-cta{position:fixed;right:22px;bottom:20px;z-index:50}
footer{padding:48px 0;border-top:1px solid var(--line);font-size:10px;letter-spacing:.05em;color:#8e939c}.footergrid{display:grid;grid-template-columns:1fr auto;gap:24px}.footerlinks{display:flex;gap:18px}.footerlinks a{text-decoration:none}
.legal p{max-width:920px;color:#c4c7cd}.legal h3{font-family:var(--serif);font-size:28px;font-weight:400;margin-top:38px}

/* reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .85s ease,transform .85s cubic-bezier(.2,.8,.2,1)}.reveal.on{opacity:1;transform:none}

@media(max-width:980px){
 .navlinks{display:none}.menu-btn{display:inline-flex;align-items:center}.nav.open .navlinks{display:flex;position:absolute;top:76px;left:0;right:0;background:#090a0e;border-bottom:1px solid var(--line);padding:26px;flex-direction:column;align-items:flex-start}
 .hero-grid,.editorial-split,.editorial-split.reverse,.band-grid,.season-intro,.exclusivity,.offer-glass,.grid2,.grid3,.grid4{grid-template-columns:1fr}
 .hero{min-height:920px}.hero-main{padding-top:18vh}.hero-aside{margin-top:50px;margin-bottom:60px}.hero-bottom{grid-template-columns:1fr;gap:6px}.hero-bottom div:nth-child(n){text-align:left}
 .visual-frame{min-height:520px}.band-grid{min-height:auto}.band-visual{min-height:500px}.band-visual:after{background:linear-gradient(180deg,transparent 45%,#050608 100%)}.band-copy{padding:70px var(--pad)}
 .pillars,.process{grid-template-columns:1fr}.pillar,.step{border-right:0;border-bottom:1px solid var(--line)}.step b{margin-top:28px}
 .domain-row{grid-template-columns:54px 1fr}.domain-row .segment{grid-column:2;text-align:left}.season-number{text-align:left}
 .offer-panel{border-left:0;border-top:1px solid var(--line)}.rule,.metric{grid-template-columns:1fr}.sticky-cta{right:14px;bottom:14px}
}
@media(max-width:620px){
 :root{--pad:20px}.brand span{display:none}.hero h1{font-size:clamp(64px,24vw,104px)}.hero-copy{font-size:19px}.hero{padding-top:90px}.hero-main{padding-top:16vh}.hero-aside{display:none}.visual-frame{min-height:390px}.domain-row .domain{font-size:32px}.btn{min-height:46px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.visual-frame img{transition:none}}

/* LOOK_V3_20261010 (KEES, Marcus: "die Website vorher war richtig cool - Aufteilung gut, Look & Feel gar nicht"):
   V3-HIGHEND-Gestaltung auf die aktuellen Inhalte gelegt. Ergaenzt: Engine-Screenshots und Metasemantics-Upgrade. */
.shots{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:22px;margin-top:34px;align-items:start}
.shot{margin:0;background:#0d0e14;border:1px solid var(--line);box-shadow:0 24px 60px rgba(0,0,0,.45);border-radius:8px;overflow:hidden}
.shot img{display:block;width:100%;height:auto}
.shot figcaption{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:12px 14px;border-top:1px solid var(--line2)}
.upgrade{padding:clamp(70px,9vw,130px) 0;border-top:1px solid var(--line2)}
@media (max-width:900px){.shots{grid-template-columns:1fr}}
