/* Schriften lokal eingebunden (keine Verbindung zu Google) */
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 900;font-display:swap;src:url(/assets/fonts/schibsted-grotesk-latin-wght-normal.woff2) format("woff2-variations"),url(/assets/fonts/schibsted-grotesk-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
/* Layout: Executive-Dossier – ruhige Schieferflächen, ein Messing-Akzent, Mono-Labels für Fakten; Seiten als umschaltbare Ansichten */
:root{
  --bg:#0E151E; --panel:#151F2B; --raise:#1B2735; --line:#26344430; --rule:#2A3949;
  --fg:#E9EDF2; --muted:#9BA8B7; --faint:#8794A3;
  --brass:#CDA75E; --brass-ink:#1A1408; --brass-soft:#CDA75E1F;
  --ok:#4FC38C; --warn:#E3A33B; --crit:#E46A5E;
  --display:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --body:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --max:1160px; --r:14px;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){
  --bg:#F2F4F7; --panel:#FFFFFF; --raise:#E9EDF2; --line:#16202B14; --rule:#D5DCE4;
  --fg:#111923; --muted:#4F5D6C; --faint:#5D6977;
  --brass:#8C6A24; --brass-ink:#FFFFFF; --brass-soft:#8C6A2414;
  --ok:#167147; --warn:#A86A0C; --crit:#B83E33; color-scheme:light}}
:root[data-theme="light"]{
  --bg:#F2F4F7; --panel:#FFFFFF; --raise:#E9EDF2; --line:#16202B14; --rule:#D5DCE4;
  --fg:#111923; --muted:#4F5D6C; --faint:#5D6977;
  --brass:#8C6A24; --brass-ink:#FFFFFF; --brass-soft:#8C6A2414;
  --ok:#167147; --warn:#A86A0C; --crit:#B83E33; color-scheme:light}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1rem/1.6 var(--body);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
a{color:inherit}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:-.025em}
h1{font-size:clamp(2.2rem,5vw,3.8rem);line-height:.98;font-weight:800}
h2{font-size:clamp(1.5rem,2.8vw,2.1rem);line-height:1.08;font-weight:700}
h3{font-size:1.18rem;line-height:1.25;font-weight:700}
p{margin:0}
.wrap{max-width:var(--max);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.label{font:500 .72rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.muted{color:var(--muted)}
.lead{font-size:clamp(1rem,1.4vw,1.1rem);color:var(--muted);max-width:62ch}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:6px}
.ph{color:var(--brass);border-bottom:1px dashed var(--brass);cursor:help}

/* Header */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--rule)}
.hdr .wrap{display:flex;align-items:center;gap:20px;min-height:60px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font:700 1rem/1 var(--display);letter-spacing:-.01em}
.mono{width:34px;height:34px;border:1.5px solid var(--brass);border-radius:8px;display:flex;align-items:center;justify-content:center;gap:1px;font:600 .78rem/1 var(--mono);color:var(--brass);letter-spacing:-.04em;flex:none}
.mono b{font-weight:600;transform:translateY(-3px)}.mono i{font-style:normal;transform:translateY(3px)}
.brand small{display:block;font:500 .66rem/1 var(--mono);letter-spacing:.12em;color:var(--faint);margin-top:4px;text-transform:uppercase}
.nav{display:flex;gap:4px;margin-left:auto;align-items:center}
.nav a{text-decoration:none;color:var(--muted);font-weight:500;font-size:.95rem;padding:8px 12px;border-radius:8px}
.nav a:hover{color:var(--fg);background:var(--raise)}
.nav a[aria-current="page"]{color:var(--fg);box-shadow:inset 0 -2px 0 var(--brass);border-radius:0}
.btn{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 18px;border-radius:10px;font:600 .95rem/1 var(--body);text-decoration:none;border:1px solid var(--rule);background:transparent;color:var(--fg);cursor:pointer;transition:transform .2s,background .2s,border-color .2s}
.btn:hover{border-color:var(--brass);transform:translateY(-1px)}
.btn.pri{background:var(--brass);color:var(--brass-ink);border-color:var(--brass)}
.btn.pri:hover{filter:brightness(1.06)}
.btn.sm{min-height:38px;padding:0 14px;font-size:.88rem}
.icon-btn{width:38px;height:38px;border-radius:9px;border:1px solid var(--rule);background:transparent;color:var(--fg);cursor:pointer;display:grid;place-items:center}
.icon-btn:hover{border-color:var(--brass)}
.menu-btn{display:none}
@media (max-width:1080px){
  .menu-btn{display:grid;margin-left:auto}
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;background:var(--panel);border-bottom:1px solid var(--rule);padding:10px max(16px,env(safe-area-inset-right,0px)) 16px max(16px,env(safe-area-inset-left,0px));display:none}
  .nav.open{display:flex}
  .nav a{padding:12px}
  .nav a[aria-current="page"]{box-shadow:inset 3px 0 0 var(--brass)}
  .hdr .cta-head{justify-content:center;margin-top:8px;min-height:46px}
  .nav #themeBtn{width:auto;height:44px;padding:0 14px;gap:10px;display:flex;justify-content:flex-start;margin-top:4px}
  .nav #themeBtn::after{content:"Hell / Dunkel umschalten";font:500 .92rem/1 var(--body);color:var(--muted)}
}

/* Sections */
section.blk{padding-block:clamp(40px,5.5vw,64px)}
section.blk+section.blk{border-top:1px solid var(--rule)}
.head{display:grid;gap:10px;max-width:760px;margin-bottom:28px}
.alt{background:var(--panel)}

/* Hero */
.hero{padding-block:clamp(32px,5vw,56px) clamp(36px,5vw,56px)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.85fr);gap:clamp(24px,4vw,48px);align-items:center}
.status{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:7px 14px 7px 12px;border:1px solid var(--rule);border-radius:999px;font-size:.85rem;margin-bottom:18px;background:var(--panel)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 22%,transparent);animation:pulse 2.4s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--ok) 0%,transparent)}}
.status span.m{font-family:var(--mono);font-size:.75rem;color:var(--muted)}
.hero h1 em{font-style:normal;color:var(--brass)}
.hero .lead{margin-top:16px}
.checks{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:6px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-weight:500}
.checks li::before{content:"✓";flex:none;width:20px;height:20px;margin-top:2px;border-radius:5px;background:var(--brass-soft);border:1px solid var(--brass);color:var(--brass);display:grid;place-items:center;font-size:.72rem;font-weight:700}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.card-p{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);overflow:hidden}
.card-p img{display:block;width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;object-position:50% 18%;max-width:100%}
.card-p .in{padding:16px 18px 18px;display:grid;gap:10px}
.cred{list-style:none;margin:0;padding:0;display:grid}
.cred li{display:grid;grid-template-columns:auto 1fr;gap:0 12px;padding:7px 0;border-top:1px solid var(--rule)}
.cred .k{font:500 .7rem/1.5 var(--mono);color:var(--faint);letter-spacing:.08em;text-transform:uppercase;padding-top:2px;min-width:62px}
.cred strong{font-weight:600;font-size:.95rem}
.cred span.d{grid-column:2;color:var(--muted);font-size:.84rem}
.soc{display:flex;gap:8px}
.soc a{flex:1;justify-content:center}
.hero .wrap.slim{grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr)}
.portrait img{aspect-ratio:4/5}
@media (max-width:860px){.hero .wrap,.hero .wrap.slim{grid-template-columns:1fr}.card-p{max-width:440px}.card-p.portrait{max-width:260px}}

/* Facts strip */
.facts{border-block:1px solid var(--rule);background:var(--panel)}
.facts .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.fact{padding:18px 20px;border-left:1px solid var(--rule);display:grid;gap:4px}
.fact:first-child{border-left:0;padding-left:0}
.fact b{font:700 clamp(1.7rem,3vw,2.3rem)/1 var(--display);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.fact span{font-weight:600;font-size:.92rem}
.fact small{color:var(--muted);font-size:.82rem;line-height:1.4}
@media (max-width:760px){.facts .wrap{grid-template-columns:1fr 1fr}.fact{padding:20px 16px}.fact:nth-child(3){border-left:0;padding-left:0}.fact:nth-child(n+3){border-top:1px solid var(--rule)}}

/* Levers */
.levers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.lever{padding:20px 24px 4px 0;display:grid;gap:8px;align-content:start}
.lever+.lever{padding-left:24px;border-left:1px solid var(--rule)}
.lever .label{color:var(--faint)}
.lever p{color:var(--muted)}
.lever .kpi{font:500 .78rem/1.5 var(--mono);color:var(--fg);padding-top:10px}
.lever .kpi i{font-style:normal;color:var(--brass)}
@media (max-width:820px){.levers{grid-template-columns:1fr}.lever,.lever+.lever{padding:24px 0;border-left:0;border-top:1px solid var(--rule)}.lever:first-child{border-top:0}}

/* Cases */
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.case{background:var(--bg);border:1px solid var(--rule);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:12px;min-width:0}
.case dl{margin:0;display:grid;gap:8px}
.case dt{font:500 .68rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.case dd{margin:2px 0 0;color:var(--muted);font-size:.93rem}
.case .res{margin-top:auto;padding-top:12px;border-top:1px solid var(--rule)}
.case .res b{font:700 1.4rem/1.1 var(--display);color:var(--brass);display:block}
@media (max-width:900px){.cases{grid-template-columns:1fr}}

/* Competences */
.comp{display:grid;gap:24px}
.comp-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.comp-col{display:grid;gap:12px;align-content:start}
.comp-col h3{padding-bottom:8px;border-bottom:2px solid var(--brass)}
.comp-col ul{list-style:none;margin:0;padding:0;display:grid}
.comp-col li{padding:6px 0;border-bottom:1px solid var(--rule);font-size:.95rem}
@media (max-width:640px){.comp-cols{grid-template-columns:1fr;gap:36px}}

/* 100 days */
.days{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(20px,4vw,48px);align-items:start}
.track{position:relative;margin:8px 0 18px}
.bar{display:grid;grid-template-columns:30fr 30fr 40fr;gap:4px;height:12px}
.bar i{border-radius:3px;background:var(--raise);transition:background .2s}
.bar i.on{background:var(--brass)}
.ticks{display:grid;grid-template-columns:30fr 30fr 40fr;font:500 .72rem/1 var(--mono);color:var(--faint);margin-top:8px}
.ticks span:last-child{text-align:right}
input[type=range]{width:100%;accent-color:var(--brass);margin:18px 0 6px}
.dayout{font:500 .85rem/1 var(--mono);color:var(--muted)}
.dayout b{color:var(--fg);font-size:1.6rem;font-family:var(--display);font-variant-numeric:tabular-nums}
.phases{display:grid;gap:10px}
.phase{width:100%;text-align:left;font:inherit;color:inherit;background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);padding:14px 18px;cursor:pointer;display:grid;grid-template-columns:110px minmax(0,1fr);gap:4px 18px;transition:border-color .2s,background .2s}
.phase .label{grid-row:span 2;color:var(--faint);padding-top:4px}
.phase p{color:var(--muted);font-size:.93rem}
.phase[aria-pressed="true"]{border-color:var(--brass);background:var(--brass-soft)}
.phase[aria-pressed="true"] .label{color:var(--brass)}
@media (max-width:820px){.days{grid-template-columns:1fr}.phase{grid-template-columns:1fr}.phase .label{grid-row:auto}}

/* Quote + pubs */
.quote{font:700 clamp(1.35rem,2.6vw,1.9rem)/1.2 var(--display);letter-spacing:-.025em;max-width:24ch}
.quote q{quotes:"„" "“"}
.pubs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:28px}
.pub{display:grid;gap:6px;align-content:start;text-decoration:none;padding:18px;border:1px solid var(--rule);border-radius:var(--r);background:var(--panel);transition:border-color .2s}
.pub:hover{border-color:var(--brass)}
.pub p:not(.label){color:var(--muted);font-size:.93rem}
.pub .go{font-weight:600;color:var(--brass);font-size:.9rem}
@media (max-width:820px){.pubs{grid-template-columns:1fr}}

/* CTA band */
.cta{background:var(--panel);border-block:1px solid var(--rule)}
.cta .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:24px;align-items:end;padding-block:clamp(36px,5vw,56px)}
.cta .note{font:500 .78rem/1.5 var(--mono);color:var(--faint);margin-top:14px}
@media (max-width:820px){.cta .wrap{grid-template-columns:1fr}}

/* Profile */
.tl{list-style:none;margin:0;padding:0;display:grid}
.tl li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;padding:15px 0;border-top:1px solid var(--rule)}
.tl .when{font:500 .8rem/1.5 var(--mono);color:var(--brass);padding-top:3px}
.tl h3{margin-bottom:4px}
.tl p{color:var(--muted)}
.tl .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tag{font:500 .72rem/1 var(--mono);padding:6px 9px;border-radius:6px;background:var(--raise);color:var(--muted)}
@media (max-width:640px){.tl li{grid-template-columns:1fr;gap:6px}}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,56px)}
.two.form-split{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
@media (max-width:820px){.two,.two.form-split{grid-template-columns:1fr}}

/* Leadership model */
.model{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(20px,3vw,32px);align-items:stretch}
.svgbox{background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);padding:clamp(14px,2vw,22px);display:grid;gap:14px;min-width:0}
.svgbox .bar-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.svgbox svg{display:block;width:100%;height:auto}
.svgbox text{font-family:var(--mono);fill:var(--muted);font-size:12px}
.svgbox .axis{fill:none;stroke:var(--faint);stroke-width:1.2}
.svgbox .axis-head{fill:var(--faint)}
.svgbox .cap{font-size:11.5px;letter-spacing:.08em;fill:var(--faint)}
.q rect{fill:var(--bg);stroke:var(--rule);transition:fill .3s,stroke .3s}
.q text.code{font:800 26px var(--display);fill:var(--faint);transition:fill .3s}
.q text.nm{font-size:11.5px;fill:var(--faint);letter-spacing:.1em;transition:fill .3s}
.q:hover rect{stroke:var(--brass)}
.q.on rect{fill:var(--brass-soft);stroke:var(--brass)}
.q.on text.code,.q.on text.nm{fill:var(--brass)}
.r rect{fill:var(--raise);stroke:var(--rule);transition:fill .3s}
.r text{font-size:13px;fill:var(--fg);font-weight:500}
.r text.sub{font-size:10.5px;fill:var(--faint);font-weight:400}
.r:hover rect{stroke:var(--brass)}
.r.on rect{fill:var(--brass);stroke:var(--brass)}
.r.on text,.r.on text.sub{fill:var(--brass-ink)}
.curve{fill:none;stroke:var(--fg);stroke-width:2.2;stroke-linecap:round;opacity:.85}
.guide{stroke:var(--brass);stroke-width:1.4;stroke-dasharray:4 4}
#mk{transition:transform .5s cubic-bezier(.3,.7,.2,1)}
.mk-halo{fill:var(--brass);opacity:.22}
.mk-dot{fill:var(--brass);stroke:var(--panel);stroke-width:3}
.q,.r{cursor:pointer}
.seg{display:flex;gap:4px;padding:4px;border:1px solid var(--rule);border-radius:10px;background:var(--bg)}
.seg button{font:600 .85rem/1 var(--body);min-width:44px;padding:9px 12px;border-radius:7px;border:0;background:transparent;color:var(--muted);cursor:pointer}
.seg button:hover{color:var(--fg)}
.seg button[aria-pressed="true"]{background:var(--brass);color:var(--brass-ink)}
.style-card{border:1px solid var(--brass);border-radius:var(--r);padding:clamp(16px,2vw,22px);display:grid;gap:14px;align-content:start;background:var(--panel)}
.sc-head{display:flex;gap:16px;align-items:center}
.sc-code{font:800 2.6rem/1 var(--display);color:var(--brass);letter-spacing:-.03em}
.sc-head h3{font-size:1.4rem}
.sc-head p{font:500 .76rem/1.4 var(--mono);color:var(--faint);margin-top:4px}
.meters{display:grid;gap:10px;padding-block:14px;border-block:1px solid var(--rule)}
.meter{display:grid;grid-template-columns:110px minmax(0,1fr) 56px;gap:12px;align-items:center;font-size:.86rem}
.meter .track2{height:8px;border-radius:99px;background:var(--raise);overflow:hidden}
.meter .fill{height:100%;background:var(--brass);border-radius:99px;transition:width .5s}
.meter b{font:500 .74rem/1 var(--mono);color:var(--muted);text-align:right}
.style-card ul{margin:6px 0 0;padding-left:18px;color:var(--muted);display:grid;gap:4px}
.scen-wrap{margin-top:clamp(16px,2vw,22px);display:grid;gap:12px}
.scen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.scen button{text-align:left;font:inherit;font-size:.92rem;line-height:1.45;color:var(--muted);background:var(--bg);border:1px solid var(--rule);border-radius:12px;padding:14px 16px;cursor:pointer;display:grid;gap:8px;align-content:start;transition:border-color .2s,background .2s}
.scen button b{font:500 .7rem/1 var(--mono);letter-spacing:.08em;color:var(--faint)}
.scen button:hover{border-color:var(--brass);color:var(--fg)}
.scen button[aria-pressed="true"]{border-color:var(--brass);background:var(--brass-soft);color:var(--fg)}
.scen button[aria-pressed="true"] b{color:var(--brass)}
@media (max-width:980px){.model{grid-template-columns:1fr}.scen{grid-template-columns:1fr 1fr}}
@media (max-width:600px){
  .svgbox text{font-size:19px}.svgbox .cap{font-size:16px}
  .q text.code{font-size:34px}.q text.nm{font-size:17px}
  .r text{font-size:22px}.r text.sub{display:none}
  .scen{grid-template-columns:1fr}
  .meter{grid-template-columns:96px minmax(0,1fr) 50px}
}
.princ{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--rule)}
.princ div{padding:16px 16px 0 0;display:grid;gap:8px;align-content:start}
.princ div+div{padding-left:18px;border-left:1px solid var(--rule)}
.princ p{color:var(--muted);font-size:.92rem}
@media (max-width:900px){.princ{grid-template-columns:1fr 1fr}.princ div,.princ div+div{padding:18px 0;border-left:0;border-bottom:1px solid var(--rule)}}
@media (max-width:520px){.princ{grid-template-columns:1fr}}

/* News */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.chip{font:500 .85rem/1 var(--body);padding:9px 14px;border-radius:999px;border:1px solid var(--rule);background:transparent;color:var(--muted);cursor:pointer}
.chip[aria-pressed="true"]{border-color:var(--brass);color:var(--fg);background:var(--brass-soft)}
.news{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;padding:18px 0;border-top:1px solid var(--rule)}
.item .src{font:500 .7rem/1.6 var(--mono);color:var(--brass);letter-spacing:.06em;text-transform:uppercase;min-width:84px}
.item .src.own{color:var(--ok)}
.item h3{font-size:1.02rem;font-weight:600}
.item time{grid-column:2;font:400 .76rem/1 var(--mono);color:var(--faint)}
@media (max-width:760px){.news{grid-template-columns:1fr}}
.notice{border:1px dashed var(--rule);border-radius:10px;padding:10px 14px;color:var(--muted);font-size:.85rem;margin-top:16px}

/* Contact */
.form{display:grid;gap:12px;background:var(--panel);border:1px solid var(--rule);border-radius:var(--r);padding:clamp(20px,3vw,32px)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:600px){.grid2{grid-template-columns:1fr}}
.field{display:grid;gap:6px;min-width:0}
.field label,.legend{font-weight:600;font-size:.88rem}
.field input,.field select,.field textarea{font:inherit;color:var(--fg);background:var(--bg);border:1px solid var(--rule);border-radius:9px;padding:11px 13px;width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-soft)}
.field .err{color:var(--crit);font-size:.8rem}
.field .err:empty{display:none}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--crit)}
.radios{display:flex;flex-wrap:wrap;gap:8px}
.radios label{display:flex;align-items:center;gap:8px;border:1px solid var(--rule);border-radius:9px;padding:10px 14px;cursor:pointer;font-size:.92rem}
.radios input{accent-color:var(--brass)}
.radios label:has(input:checked){border-color:var(--brass);background:var(--brass-soft)}
.consent{display:flex;gap:10px;font-size:.88rem;color:var(--muted);align-items:flex-start}
.consent input{margin-top:4px;accent-color:var(--brass)}
.ok-box{border:1px solid var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent);border-radius:10px;padding:14px 16px;font-size:.92rem}
.aside{display:grid;gap:16px;align-content:start}
.aside .box{border:1px solid var(--rule);border-radius:var(--r);padding:18px;display:grid;gap:10px}
.aside ol{margin:0;padding-left:20px;color:var(--muted);display:grid;gap:6px}

/* Legal */
.legal{max-width:720px;display:grid;gap:18px}
.legal h3{margin-top:10px}


/* Blocksatz für längere Absätze */
/* erst ab Tablet-Breite: auf schmalen Spalten entstehen sonst Lücken */
@media (min-width:700px){
.jt,.lead,.lever p:not(.kpi):not(.label),.case dd,.phase p,.tl p,.legal p,.head p.muted,.days p.muted,.cta p.muted,.find li p{text-align:justify;hyphens:auto;-webkit-hyphens:auto;text-wrap:pretty}}
@media (min-width:700px) and (max-width:900px){.princ p{text-align:justify;hyphens:auto;-webkit-hyphens:auto}}

/* Buch */
:root{--cover:#14263A;--cover-2:#0B1826;--cover-fg:#EEF1F5;--cover-brass:#D2AE68}
.soon{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 12px;border:1px solid var(--brass);border-radius:999px;font-size:.85rem;font-weight:600;background:var(--brass-soft);margin-bottom:24px}
.soon .dot{background:var(--brass);box-shadow:0 0 0 4px var(--brass-soft)}
.book-hero .wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.9fr);gap:clamp(32px,6vw,80px);align-items:center}
.book-hero h1{font-size:clamp(2rem,4.2vw,3.1rem)}
.book-hero .sub{font:600 clamp(1.1rem,2vw,1.4rem)/1.35 var(--display);color:var(--muted);margin-top:14px;letter-spacing:-.01em}
.meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:20px;border-top:1px solid var(--rule)}
.meta div{padding:14px 16px 0 0;display:grid;gap:2px;min-width:0}
.meta dt{font:500 .68rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.meta dd{margin:0;font-weight:600;font-size:.95rem}
.stage{display:grid;place-items:center;padding-block:20px;perspective:1400px}
.cover{position:relative;width:min(240px,70%);aspect-ratio:2/3;max-width:100%;border-radius:4px 10px 10px 4px;background:linear-gradient(160deg,var(--cover),var(--cover-2));color:var(--cover-fg);padding:12% 11% 10% 15%;display:flex;flex-direction:column;transform:rotateY(-16deg) rotateX(3deg);transform-style:preserve-3d;box-shadow:24px 30px 50px #0007,inset 3px 0 0 #ffffff14;transition:transform .6s}
.cover:hover{transform:rotateY(-6deg) rotateX(1deg)}
.cover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7%;background:linear-gradient(90deg,#00000059,#0000 80%);border-radius:4px 0 0 4px}
.cover .c-top{font:500 .62rem/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--cover-brass)}
.cover .c-rule{width:38%;height:2px;background:var(--cover-brass);margin:9% 0 7%}
.cover .c-auth{padding-top:10px}
.cover .c-title{font:800 clamp(1.4rem,2.6vw,1.9rem)/1.02 var(--display);letter-spacing:-.03em}
.cover .c-sub{font-size:.78rem;line-height:1.45;opacity:.72;margin-top:10px}
.cover .c-auth{margin-top:auto;font:600 .8rem/1 var(--display);letter-spacing:.06em;text-transform:uppercase}
.cover .c-grid{position:absolute;right:9%;bottom:16%;width:34%;aspect-ratio:1;background-image:radial-gradient(var(--cover-brass) 1.2px,transparent 1.4px);background-size:14px 14px;opacity:.45}
.audience{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.audience>div{padding:18px 20px 0 0;display:grid;gap:10px;align-content:start}
.audience>div+div{padding-left:20px;border-left:1px solid var(--rule)}
.audience p{color:var(--muted)}
.toc{list-style:none;margin:0;padding:0;counter-reset:ch;display:grid}
.toc li{counter-increment:ch;display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;padding:12px 0;border-top:1px solid var(--rule);align-items:baseline}
.toc li::before{content:"Kapitel " counter(ch);font:500 .74rem/1 var(--mono);color:var(--brass);letter-spacing:.06em}
.toc h3{font-size:1.08rem}
.toc p{color:var(--muted);font-size:.93rem;margin-top:4px}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;position:relative}
.steps li{display:grid;gap:8px;padding:0 16px 0 0;align-content:start}
.steps .pt{display:flex;align-items:center;gap:0}
.steps .pt i{width:16px;height:16px;border-radius:50%;border:2px solid var(--rule);background:var(--bg);flex:none}
.steps .pt::after{content:"";height:2px;background:var(--rule);flex:1;margin-left:8px}
.steps li:last-child .pt::after{display:none}
.steps li.done .pt i{background:var(--brass);border-color:var(--brass)}
.steps li.done .pt::after{background:var(--brass)}
.steps li.now .pt i{border-color:var(--brass);box-shadow:0 0 0 5px var(--brass-soft)}
.steps b{font:600 1rem/1.3 var(--display)}
.steps span{font:500 .72rem/1.4 var(--mono);color:var(--faint);text-transform:uppercase;letter-spacing:.08em}
.steps li.now span{color:var(--brass)}
.steps p{color:var(--muted);font-size:.9rem}
@media (max-width:860px){.book-hero .wrap{grid-template-columns:1fr}.stage{order:-1;padding-block:0 8px}.cover{width:min(220px,62%)}}
@media (max-width:820px){.audience{grid-template-columns:1fr}.audience>div,.audience>div+div{padding:20px 0;border-left:0;border-top:1px solid var(--rule)}.audience>div:first-child{border-top:0}}
@media (max-width:700px){.steps{grid-template-columns:1fr;gap:18px}.steps li{grid-template-columns:16px minmax(0,1fr);gap:4px 14px;padding:0}.steps .pt{grid-row:span 3;flex-direction:column;align-self:stretch}.steps .pt::after{width:2px;height:auto;margin:6px 0 -18px;flex:1}.meta{grid-template-columns:1fr 1fr}}

/* Projekte */
.repo{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);border:1px solid var(--rule);border-radius:var(--r);background:var(--panel);overflow:hidden}
.repo-main{padding:clamp(18px,2.4vw,26px);display:grid;gap:14px;align-content:start;min-width:0}
.repo-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.repo-path{font:500 .95rem/1.3 var(--mono);color:var(--muted);overflow-wrap:break-word}
.repo-path strong{color:var(--fg);font-weight:600}
.pill{font:500 .7rem/1 var(--mono);padding:5px 9px;border-radius:999px;border:1px solid var(--rule);color:var(--muted)}
.pill.pub{border-color:var(--ok);color:var(--ok)}
.repo h2{font-size:clamp(1.6rem,3vw,2.2rem)}
.repo dl{margin:0;display:grid;gap:14px}
.repo dt{font:500 .68rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.repo dd{margin:3px 0 0;color:var(--muted)}
.topics{display:flex;flex-wrap:wrap;gap:6px}
.repo-stats{display:flex;flex-wrap:wrap;gap:18px;font:500 .8rem/1 var(--mono);color:var(--muted);padding-top:16px;border-top:1px solid var(--rule)}
.repo-stats span{display:inline-flex;gap:6px;align-items:center}
.lang-dot{width:10px;height:10px;border-radius:50%;background:var(--brass)}
.repo-side{background:var(--bg);border-left:1px solid var(--rule);padding:clamp(18px,2.6vw,28px);display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-content:start;min-width:0}
.repo-side>*{min-width:0}
.repo-side .btn.pri{justify-content:center}
.term{background:var(--panel);border:1px solid var(--rule);border-radius:10px;overflow:hidden}
.term-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;border-bottom:1px solid var(--rule);font:500 .7rem/1 var(--mono);color:var(--faint)}
.term-bar i{width:9px;height:9px;border-radius:50%;background:var(--raise)}
.term-bar em{font-style:normal;margin-left:8px}
.term pre{margin:0;padding:14px 16px;font:400 .8rem/1.7 var(--mono);color:var(--fg);overflow-x:auto;white-space:pre}
.term .c{color:var(--faint)}.term .p{color:var(--brass)}
.copy-row{display:flex;gap:8px;align-items:center}
.copy-row code{flex:1;min-width:0;font:400 .78rem/1.3 var(--mono);padding:10px 12px;border:1px solid var(--rule);border-radius:8px;background:var(--panel);overflow-x:auto;white-space:nowrap;color:var(--muted)}
.slot{margin-top:14px;border:1.5px dashed var(--rule);border-radius:var(--r);padding:18px 20px;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
.slot p{color:var(--muted);max-width:60ch}
@media (max-width:900px){.repo{grid-template-columns:1fr}.repo-side{border-left:0;border-top:1px solid var(--rule)}}
.pubs{grid-template-columns:repeat(4,minmax(0,1fr))}
.repo-path{text-decoration:none}.repo-path:hover strong{color:var(--brass)}
.req{list-style:none;margin:0;padding:0;display:grid;font-size:.86rem}
.req li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--rule);color:var(--muted)}
.req b{font:500 .7rem/1.6 var(--mono);color:var(--faint);text-transform:uppercase;letter-spacing:.08em}
.feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}
.feat div{padding:16px 0;border-top:1px solid var(--rule);display:grid;gap:8px;align-content:start}
.feat p{color:var(--muted);font-size:.95rem}
@media (max-width:900px){.feat{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.feat{grid-template-columns:1fr}}
.arch-ctl{margin:-12px 0 18px}
.switch{display:inline-flex;align-items:center;gap:12px;font-weight:600;font-size:.92rem;cursor:pointer}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch span{width:42px;height:24px;border-radius:99px;background:var(--raise);border:1px solid var(--rule);position:relative;transition:background .2s}
.switch span::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--muted);transition:transform .2s,background .2s}
.switch input:checked+span{background:var(--brass)}
.switch input:checked+span::after{transform:translateX(18px);background:var(--brass-ink)}
.switch input:focus-visible+span{outline:2px solid var(--brass);outline-offset:3px}
.arch{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,2.4fr) minmax(0,1fr);gap:14px;align-items:stretch}
.zone{border:1px solid var(--rule);border-radius:var(--r);padding:16px;display:grid;gap:8px;align-content:start;background:var(--bg);transition:opacity .3s}
.zone.host{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border-color:var(--brass);background:var(--brass-soft)}
.zone.host .zlabel{grid-column:1/-1}
.zone.out{border-style:dashed}
.zlabel{font:500 .7rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.zone.host .zlabel{color:var(--brass)}
.ct{border:1px solid var(--rule);border-radius:10px;padding:12px;display:grid;gap:6px;align-content:start;background:var(--panel);min-width:0}
.ctl{font:600 .82rem/1.3 var(--display);margin-bottom:2px}
.node{font-size:.84rem;padding:8px 10px;border-radius:7px;background:var(--raise);transition:opacity .3s,background .3s,color .3s;min-width:0;overflow-wrap:anywhere}
.node small{display:block;font:400 .7rem/1.3 var(--mono);color:var(--faint)}
.port{font:500 .72rem/1 var(--mono);color:var(--faint)}
.arch.ext-only .zone:not(.out),.arch.ext-only .node:not(.ext){opacity:.28}
.arch.ext-only .node.ext{background:var(--brass);color:var(--brass-ink)}
.arch.ext-only .node.ext small{color:var(--brass-ink)}
.arch.ext-only .zone.out{border-color:var(--brass)}
@media (max-width:1000px){.arch{grid-template-columns:1fr}.zone:not(.host){grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.zone .zlabel{grid-column:1/-1}}
@media (max-width:640px){.zone.host{grid-template-columns:1fr}}
.map{display:grid;border-top:1px solid var(--rule)}
.map-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;padding:11px 0;border-bottom:1px solid var(--rule)}
.map-row span:first-child{color:var(--muted)}
.map-row b{color:var(--brass);font-weight:600}
.map-h span{font:500 .7rem/1.4 var(--mono)!important;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)!important}
@media (max-width:640px){.map-row{grid-template-columns:1fr;gap:4px}.map-h{display:none}}
.book-title{font-size:clamp(1.8rem,3.6vw,2.7rem)!important;line-height:1.05;hyphens:manual}
.cover .c-title-long{font-size:clamp(.98rem,1.7vw,1.2rem);line-height:1.12;hyphens:manual}
.bstats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media (max-width:760px){.bstats{grid-template-columns:1fr!important}.bstats .fact{border-left:0;padding-left:0;border-top:1px solid var(--rule)}.bstats .fact:first-child{border-top:0}}
.audience .topics{margin-top:6px}
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));counter-reset:ph;border-top:2px solid var(--brass)}
.flow li{counter-increment:ph;padding:16px 16px 0 0;display:grid;gap:6px;align-content:start;position:relative}
.flow li::before{content:"Phase " counter(ph);font:500 .7rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--brass)}
.flow li::after{content:"";position:absolute;top:-6px;left:0;width:10px;height:10px;border-radius:50%;background:var(--brass)}
.flow b{font:600 1rem/1.3 var(--display)}
.flow p{color:var(--muted);font-size:.9rem}
.dims{margin-top:24px;display:grid;gap:10px}
@media (max-width:900px){.flow{grid-template-columns:1fr;border-top:0;border-left:2px solid var(--brass);padding-left:18px;gap:14px}.flow li{padding:0}.flow li::after{left:-24px;top:2px}}
.svc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:sv}
.svc li{counter-increment:sv;border:1px solid var(--rule);border-radius:12px;padding:14px 16px;display:grid;gap:4px;align-content:start;background:var(--panel)}
.svc li::before{content:counter(sv,decimal-leading-zero);font:500 .72rem/1 var(--mono);color:var(--brass);margin-bottom:4px}
.svc b{font:600 .98rem/1.3 var(--display)}
.svc p{color:var(--muted);font-size:.88rem}
@media (max-width:900px){.svc{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.svc{grid-template-columns:1fr}}
@media (max-width:1000px){.pubs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pubs{grid-template-columns:1fr}}

/* Mobile-Feinschliff */
@media (max-width:860px){
  .hero .card-p:not(.portrait){display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px 14px;padding:14px;max-width:none;align-items:center}
  .hero .card-p:not(.portrait) img{width:84px;height:84px;aspect-ratio:1/1;border-radius:10px;object-position:50% 15%}
  .hero .card-p:not(.portrait) .in{display:contents}
  .hero .card-p:not(.portrait) .cred,.hero .card-p:not(.portrait) .soc{grid-column:1/-1}
  .card-p.portrait{max-width:190px}
  .btn.sm{min-height:44px}
  .icon-btn{width:44px;height:44px}
  .chip{padding:12px 16px}
  .seg button{min-height:40px;min-width:52px}
  .term pre{white-space:pre-wrap;word-break:break-all}
}
@media (max-width:600px){
  .item{grid-template-columns:1fr;gap:4px}
  .item time{grid-column:1}
  .svgbox text{font-size:21px}.svgbox .cap{font-size:18px}
  .q text.code{font-size:38px}.q text.nm{font-size:19px}
  .r text{font-size:24px}
  .status{border-radius:14px}
}

/* Footer */
.foot{border-top:1px solid var(--rule);padding-block:28px}
.foot .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center;font-size:.88rem;color:var(--muted)}
.foot nav{display:flex;gap:18px}
.foot a{text-decoration:none}.foot a:hover{color:var(--fg)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Basis (ersetzt das Grundgerüst der Vorschau) */
img{max-width:100%}
[hidden]{display:none!important}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--brass);color:var(--brass-ink);padding:10px 14px;border-radius:8px;font-weight:600;text-decoration:none}
.skip-link:focus{left:max(16px,env(safe-area-inset-left,0px))}
/* News: Live-Meldungen */
.item h3 a{text-decoration:none}
.item h3 a:hover{color:var(--brass);text-decoration:underline}
.news-bar{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;justify-content:space-between;margin-bottom:18px}
.news-bar .chips{margin:0}
.news-status{font:500 .8rem/1.4 var(--mono);color:var(--muted)}
/* Rechtstexte */
.legal h1{font-size:clamp(1.9rem,3.8vw,2.9rem)}
.legal h2{font-size:1.25rem;margin-top:10px}
.legal p{color:var(--muted)}
.soon .ph{color:var(--fg)}
.nav a.cta-head[aria-current="page"]{color:var(--brass-ink);box-shadow:none;border-radius:10px}
.news .item{grid-template-columns:1fr;gap:4px}.news .item time{grid-column:1}