/* ==========================================================================
   Weidner & Friends – zentrales Stylesheet (Relaunch 2026, Design v2)
   Navy + Papierweiß + Creme + Messing-Akzent · Sora + Source Sans 3
   ========================================================================== */

/* ---- Lokale Webfonts (DSGVO, keine externen Requests) ---- */
@font-face { font-family:'Sora'; font-style:normal; font-weight:400 700; font-display:swap; src:url(/fonts/sora-latin.woff2) format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Sora'; font-style:normal; font-weight:400 700; font-display:swap; src:url(/fonts/sora-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Source Sans 3'; font-style:normal; font-weight:400 600; font-display:swap; src:url(/fonts/source-sans-latin.woff2) format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Source Sans 3'; font-style:normal; font-weight:400 600; font-display:swap; src:url(/fonts/source-sans-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

:root {
  /* Farben */
  --navy: #182030;
  --navy-deep: #0f1522;
  --cream: #f7f4e9;
  --paper: #fafaf7;
  --slate: #8a93a5;
  --slate-text: #5c6577;
  --brass: #b3873e;
  --brass-dark: #8a6528;
  --brass-light: #d4b06a;
  --ok: #2e7d4f;
  --err: #b3261e;
  --line: rgba(24,32,48,.08);
  --line-2: rgba(24,32,48,.14);
  --line-dark: rgba(138,147,165,.22);
  /* Schrift */
  --font-head: 'Sora','Poppins',sans-serif;
  --font-body: 'Source Sans 3','Segoe UI',sans-serif;
  /* Maße */
  --maxw: 1160px;
  --radius: 6px;
  --radius-lg: 10px;
  --shadow-card: 0 1px 2px rgba(15,21,34,.05), 0 14px 36px rgba(15,21,34,.09);
  --shadow-lift: 0 20px 50px rgba(15,21,34,.16);
  --space-section: clamp(72px, 10vw, 128px);
}

*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  margin:0; background:var(--paper); color:var(--navy);
  font-family:var(--font-body); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img { display:block; max-width:100%; height:auto; }
a { color:var(--brass-dark); text-decoration:none; }
a:hover { color:var(--navy); }
h1,h2,h3,h4 { font-family:var(--font-head); margin:0; line-height:1.18; letter-spacing:-.01em; }
p { margin:0 0 1em; }
.container { max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.center { text-align:center; }
.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); border:0; }
@keyframes wfFadeUp { from { opacity:0; transform:translateY(14px);} to { opacity:1; transform:none;} }

/* ---- Eyebrow ---- */
.eyebrow {
  margin:0 0 12px; font-family:var(--font-head); font-size:13px; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark);
}
.eyebrow--light { color:var(--brass-light); }
.eyebrow--sm { font-size:12px; }

/* ---- Buttons ---- */
.btn {
  display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  font-family:var(--font-head); font-size:15px; font-weight:600;
  padding:14px 28px; border-radius:var(--radius); border:1px solid transparent;
  transition:background .2s ease, border-color .2s ease, color .2s ease, transform .15s ease;
  text-decoration:none;
}
.btn-primary { background:var(--brass-light); color:var(--navy-deep); }
.btn-primary:hover { background:var(--cream); color:var(--navy-deep); }
.btn-outline { background:transparent; color:var(--cream); border-color:rgba(247,244,233,.55); }
.btn-outline:hover { border-color:var(--cream); background:rgba(247,244,233,.08); color:var(--cream); }
.btn-outline-ink { background:transparent; color:var(--navy); border-color:var(--line-2); }
.btn-outline-ink:hover { background:var(--navy); color:var(--cream); }
.btn-sm { padding:11px 22px; font-size:14px; }

/* ---- Venn-Motiv (zwei Kreise, Markenzeichen) ---- */
.venn { position:relative; width:42px; height:26px; }
.venn span { position:absolute; top:0; width:26px; height:26px; border-radius:50%; box-sizing:border-box; }
.venn span:first-child { left:0; border:1.5px solid var(--brass); }
.venn span:last-child { left:16px; border:1.5px solid var(--slate); }
.venn--lg { width:56px; height:34px; margin:0 auto; }
.venn--lg span { width:34px; height:34px; }
.venn--lg span:first-child { border-color:var(--brass-light); }
.venn--lg span:last-child { left:22px; border-color:var(--slate); }

/* ==========================================================================
   Header / Navigation
   ========================================================================== */
.site-header {
  position:fixed; top:0; left:0; right:0; z-index:50;
  transition:background .35s ease, padding .35s ease, box-shadow .35s ease;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  background:transparent; padding:22px 0;
}
.site-header.solid,
.site-header.scrolled {
  background:rgba(15,21,34,.92); padding:10px 0; box-shadow:0 1px 0 rgba(247,244,233,.09);
}
.site-header .container { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; }
.brand img { height:30px; width:auto; }
.site-header.scrolled .brand img { height:26px; }

.main-nav { display:flex; align-items:center; gap:32px; }
.main-nav a {
  font-family:var(--font-head); font-size:14px; font-weight:500; letter-spacing:.02em;
  color:var(--cream); padding:6px 0; border-bottom:2px solid transparent; white-space:nowrap;
}
.main-nav a:hover { color:#fff; border-bottom-color:var(--slate); }
.main-nav a.active { font-weight:600; border-bottom-color:var(--brass); color:var(--cream); }
.main-nav .btn { padding:10px 20px; font-size:14px; border-bottom:0; }
.main-nav .btn:hover { border-bottom:0; }

/* Dropdown */
.nav-drop { position:relative; }
.nav-drop > a .caret { font-size:9px; position:relative; top:1px; margin-left:4px; }
.nav-drop-menu {
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  padding-top:16px; z-index:60; display:none;
}
.nav-drop:hover .nav-drop-menu, .nav-drop:focus-within .nav-drop-menu { display:block; }
.nav-drop-inner {
  background:var(--navy-deep); border:1px solid rgba(138,147,165,.25); border-radius:var(--radius-lg);
  box-shadow:0 24px 60px rgba(0,0,0,.45); padding:26px; display:grid;
  grid-template-columns:1fr 1fr; gap:6px 40px; width:560px;
}
.nav-drop-inner h4 { grid-column:span 1; margin:0 0 4px; font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-light); }
.nav-drop-col { display:flex; flex-direction:column; gap:1px; }
.nav-drop-col a {
  color:var(--cream); font-family:var(--font-body); font-size:14px; font-weight:400;
  padding:7px 10px; margin:0 -10px; border-radius:var(--radius); border-bottom:0;
}
.nav-drop-col a:hover { background:rgba(247,244,233,.07); color:#fff; border-bottom:0; }
.nav-drop-col a .arrow { color:var(--brass-light); }

/* Burger + Mobile */
.nav-toggle {
  display:none; background:none; border:1px solid rgba(247,244,233,.4); border-radius:var(--radius);
  padding:10px 12px; cursor:pointer; flex-direction:column; gap:5px;
}
.nav-toggle span { display:block; width:20px; height:2px; background:var(--cream); }
.mobile-menu {
  position:fixed; inset:0; z-index:60; background:var(--navy-deep);
  display:none; flex-direction:column; padding:24px; animation:wfFadeUp .25s ease both;
}
.mobile-menu.open { display:flex; }
.mobile-menu-top { display:flex; align-items:center; justify-content:space-between; }
.mobile-menu-top img { height:28px; }
.mobile-close { background:none; border:1px solid rgba(247,244,233,.4); border-radius:var(--radius); color:var(--cream); font-size:18px; padding:8px 14px; cursor:pointer; }
.mobile-nav { display:flex; flex-direction:column; gap:2px; margin-top:36px; }
.mobile-nav a { color:var(--cream); font-family:var(--font-head); font-size:20px; font-weight:600; padding:14px 2px; border-bottom:1px solid var(--line-dark); }
.mobile-nav a:hover { color:#fff; }
.mobile-nav .btn { width:100%; margin-top:22px; justify-content:center; font-size:16px; padding:15px 22px; }

@media (max-width:920px) {
  .main-nav { display:none; }
  .nav-toggle { display:flex; }
}

/* Cookie-Banner */
.cookie-banner {
  /* Zentrierung ueber left/right + margin:auto statt transform:
     wfFadeUp setzt am Ende transform:none und wuerde translateX(-50%) ueberschreiben
     (Banner rutschte auf Mobil nach rechts, Buttons unerreichbar). */
  position:fixed; left:16px; right:16px; bottom:20px; margin-inline:auto; z-index:80;
  width:auto; max-width:680px; background:var(--navy-deep);
  border:1px solid rgba(138,147,165,.3); border-radius:var(--radius-lg);
  box-shadow:0 24px 60px rgba(0,0,0,.5); padding:24px 26px; animation:wfFadeUp .4s ease both;
  display:none;
}
.cookie-banner.show { display:block; }
.cookie-row { display:flex; flex-wrap:wrap; gap:18px; align-items:center; }
.cookie-row p { margin:0; flex:1 1 300px; font-size:14px; color:var(--slate); line-height:1.6; }
.cookie-row p strong { color:var(--cream); font-family:var(--font-head); font-weight:600; display:block; margin-bottom:2px; }
.cookie-row a { color:var(--brass-light); }
.cookie-actions { display:flex; gap:10px; flex-wrap:wrap; }
.cookie-actions button { font-family:var(--font-head); font-size:14px; font-weight:600; cursor:pointer; padding:11px 20px; border-radius:var(--radius); transition:all .2s; }
.cookie-decline { color:var(--cream); background:none; border:1px solid rgba(138,147,165,.45); }
.cookie-decline:hover { border-color:var(--cream); }
.cookie-accept { color:var(--navy-deep); background:var(--brass-light); border:none; }
.cookie-accept:hover { background:var(--cream); }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
  position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center;
  background:var(--navy-deep) center/cover no-repeat;
}
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,21,34,.66) 0%, rgba(15,21,34,.38) 45%, rgba(15,21,34,.78) 100%); }
.hero-inner { position:relative; z-index:1; text-align:center; padding:140px 24px 96px; max-width:880px; animation:wfFadeUp .7s ease both; }
.hero-inner .wordmark { height:clamp(34px,4.5vw,52px); width:auto; margin:0 auto 40px; }
.hero h1 { font-weight:700; font-size:clamp(38px,6vw,68px); line-height:1.12; color:#fff; margin:0 0 22px; letter-spacing:-.015em; }
.hero-lead { font-size:clamp(17px,2vw,21px); line-height:1.55; color:var(--cream); max-width:640px; margin:0 auto 40px; }
.hero-cta { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; align-items:center; }
.hero-play { display:flex; align-items:center; gap:10px; background:none; border:none; cursor:pointer; color:var(--cream); font-family:var(--font-head); font-size:15px; font-weight:500; padding:14px 10px; }
.hero-play:hover { color:#fff; }
.hero-play .ico { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border:1px solid rgba(247,244,233,.55); border-radius:50%; font-size:11px; padding-left:2px; }
.hero-place { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); color:var(--slate); font-size:12px; letter-spacing:.22em; text-transform:uppercase; font-family:var(--font-head); }

/* Film-Lightbox */
.lightbox { position:fixed; inset:0; z-index:70; background:rgba(15,21,34,.92); display:none; align-items:center; justify-content:center; padding:24px; }
.lightbox.open { display:flex; }
.lightbox-inner { width:min(960px,100%); }
.lightbox-close-row { display:flex; justify-content:flex-end; margin-bottom:10px; }
.lightbox-close { background:none; border:1px solid rgba(247,244,233,.4); border-radius:var(--radius); color:var(--cream); font-size:15px; padding:8px 16px; cursor:pointer; }
.lightbox-frame { aspect-ratio:16/9; background:#000; border-radius:var(--radius-lg); overflow:hidden; }
.lightbox-frame iframe { width:100%; height:100%; border:none; }
.lightbox-note { color:var(--slate); font-size:13px; margin:10px 4px 0; }

/* ==========================================================================
   Info-Zeile
   ========================================================================== */
.info-bar { background:var(--paper); border-bottom:1px solid var(--line); }
.info-bar .container { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:40px; padding:56px 24px; }
.info-item { border-top:2px solid var(--brass); padding-top:18px; }
.info-item p:first-child { margin:0 0 6px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark); }
.info-item p:last-child { margin:0; color:var(--navy); font-size:17px; }

/* ==========================================================================
   Sektionen
   ========================================================================== */
.section { padding:var(--space-section) 24px; }
.section--paper { background:var(--paper); }
.section--white { background:#fff; border-top:1px solid rgba(24,32,48,.07); }
.section--dark { background:var(--navy-deep); }
.section--navy { background:var(--navy); }
.section-inner { max-width:var(--maxw); margin:0 auto; }
.section-head { max-width:680px; margin:0 auto 52px; text-align:center; }
.section-head.left { margin-left:0; text-align:left; }
.section-head h2 { font-size:clamp(28px,3.6vw,42px); font-weight:700; line-height:1.18; margin:0 0 16px; }
.section-head p { margin:0; color:var(--slate-text); font-size:18px; }
.section--dark .section-head h2 { color:#fff; }
.section--dark .section-head p, .section--navy .section-head p { color:var(--slate); }
.section--dark h2, .section--dark h3, .section--navy h2, .section--navy h3 { color:#fff; }

/* Foto-Zäsur */
.photo-band { height:clamp(220px,32vw,380px); background-position:center 35%; background-size:cover; background-repeat:no-repeat; }

/* Karten-Grid – Flex mit zentrierten Waisen-Reihen (kein "3+1 links") */
.grid-3 { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
.grid-3 > * { flex:1 1 300px; max-width:373px; }
.grid-auto { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
.grid-auto > * { flex:1 1 280px; max-width:373px; }
@media (max-width:660px){ .grid-3 > *, .grid-auto > * { max-width:none; flex-basis:100%; } }

/* Service-Karte (Startseite) */
.svc-card {
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:32px 28px 28px; box-shadow:var(--shadow-card);
  display:flex; flex-direction:column; gap:12px;
  transition:transform .25s ease, border-color .25s ease;
}
.svc-card:hover { transform:translateY(-4px); border-color:rgba(179,135,62,.45); }
.svc-card .venn { margin-bottom:6px; }
.svc-card h3 { font-size:20px; font-weight:600; line-height:1.3; }
.svc-card p { margin:0; color:var(--slate-text); font-size:16px; flex:1; }
.svc-card .card-link { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-dark); }
.svc-card:hover .card-link { color:var(--navy); }

/* KI-Karte (dunkel) */
.ai-card {
  background:var(--navy); border:1px solid var(--line-dark); border-radius:var(--radius-lg);
  padding:32px 28px; display:flex; flex-direction:column; gap:12px; transition:border-color .25s ease;
}
.ai-card:hover { border-color:rgba(212,176,106,.5); }
.ai-card .eyebrow { margin:0; }
.ai-card h3 { font-size:20px; font-weight:600; color:var(--cream); line-height:1.3; }
.ai-card p { margin:0; color:var(--slate); font-size:16px; flex:1; }
.ai-card .card-link { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-light); }
.ai-card:hover .card-link { color:var(--cream); }

.chip-row { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.chip-pill { font-family:var(--font-head); font-size:14px; font-weight:500; color:var(--cream); border:1px solid rgba(138,147,165,.35); border-radius:99px; padding:8px 18px; transition:border-color .2s; }
.chip-pill:hover { border-color:var(--brass-light); }
.subhead { margin:0 0 18px; text-align:center; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--slate); }
.divider-top { margin-top:44px; border-top:1px solid var(--line-dark); padding-top:32px; }

/* 5 Schritte */
.steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:28px; }
.step { border-top:2px solid var(--line-2); padding-top:20px; position:relative; }
.step::before { content:""; position:absolute; top:-2px; left:0; width:44px; height:2px; background:var(--brass); }
.step .num { margin:0 0 8px; font-family:var(--font-head); font-size:34px; font-weight:700; color:var(--brass-dark); line-height:1; }
.step h3 { font-size:18px; font-weight:600; margin:0 0 8px; }
.step p { margin:0; color:var(--slate-text); font-size:15px; }

/* Cases */
.case-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px 28px; display:flex; flex-direction:column; gap:8px; transition:border-color .25s ease; }
.case-card:hover { border-color:rgba(179,135,62,.45); }
.case-metric { margin:0; font-family:var(--font-head); font-size:clamp(34px,3.4vw,44px); font-weight:700; color:var(--navy); line-height:1; letter-spacing:-.02em; }
.case-metric-label { margin:0 0 14px; font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-dark); }
.case-cat { margin:0 0 4px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--slate-text); }
.case-card h3 { font-size:18px; font-weight:600; margin:0 0 6px; }
.case-card p { margin:0; color:var(--slate-text); font-size:15px; }
.client-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px 28px; border-top:1px solid rgba(24,32,48,.1); padding-top:32px; margin-top:52px; }
.client-row p { margin:0; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--slate-text); }
.client-row span { font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--navy); opacity:.75; }

/* CEO-Zitat */
.quote-band { position:relative; background:var(--navy) center/cover no-repeat; }
.quote-band .ov { position:absolute; inset:0; background:rgba(15,21,34,.88); }
.quote-band .inner { position:relative; max-width:var(--maxw); margin:0 auto; padding:var(--space-section) 24px; display:flex; flex-wrap:wrap; align-items:center; gap:48px; justify-content:center; }
.quote-band img { width:min(320px,80vw); border-radius:var(--radius-lg); box-shadow:0 24px 60px rgba(0,0,0,.45); }
.quote-band blockquote { margin:0; max-width:520px; flex:1 1 380px; }
.quote-band blockquote p { font-family:var(--font-head); font-size:clamp(20px,2.4vw,26px); font-weight:500; line-height:1.5; color:var(--cream); margin:0 0 24px; }
.quote-band footer p:first-child { margin:0; font-family:var(--font-head); font-size:16px; font-weight:600; color:#fff; }
.quote-band footer p:last-child { margin:0; color:var(--slate); font-size:14px; }
.quote-band footer a { color:var(--brass-light); }

/* Netzwerk / Gruppe */
.orgchart { display:flex; flex-direction:column; align-items:center; margin-bottom:44px; }
.orgchart p { margin:0; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--slate-text); }
.orgchart .conn { width:1px; height:28px; background:rgba(24,32,48,.18); margin:10px 0; }
.orgchart .op { background:var(--navy); border-radius:var(--radius-lg); padding:22px 40px; display:flex; align-items:center; gap:16px; }
.orgchart .op img { height:26px; width:auto; }
.orgchart .op span { color:var(--brass-light); font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; border-left:1px solid rgba(138,147,165,.35); padding-left:16px; }
.net-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px; box-shadow:var(--shadow-card); display:flex; flex-direction:column; gap:10px; }
.net-card .eyebrow { margin:0; }
.net-card h3 { font-size:19px; font-weight:600; }
.net-card p { margin:0; color:var(--slate-text); font-size:15px; flex:1; }
.net-card .card-link { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-dark); }
.net-card:hover .card-link { color:var(--navy); }

/* Team */
.team-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:20px; max-width:960px; margin:0 auto; }
.team-grid figure { margin:0; text-align:center; }
.team-grid img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 20%; border-radius:var(--radius-lg); filter:grayscale(1); margin-bottom:14px; }
.team-grid .mono { width:100%; aspect-ratio:4/5; border-radius:var(--radius-lg); margin-bottom:14px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; background:var(--navy); position:relative; overflow:hidden; }
.team-grid .mono .c1 { position:absolute; right:-36px; bottom:-36px; width:120px; height:120px; border:1.5px solid rgba(179,135,62,.35); border-radius:50%; }
.team-grid .mono .c2 { position:absolute; right:8px; bottom:-52px; width:120px; height:120px; border:1.5px solid rgba(138,147,165,.3); border-radius:50%; }
.team-grid .mono .glyph { font-family:var(--font-head); font-size:44px; font-weight:700; color:var(--cream); }
.team-grid .mono .lbl { font-family:var(--font-head); font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--brass-light); }
.team-grid figcaption p:first-child { margin:0; font-family:var(--font-head); font-size:16px; font-weight:600; }
.team-grid figcaption p { margin:0; color:var(--slate-text); font-size:14px; }
.team-grid figcaption .sub { font-size:13px; opacity:.85; margin-top:2px; }

/* Stimmen */
.voice { margin:0; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px 28px; display:flex; flex-direction:column; gap:20px; }
.voice blockquote { margin:0; flex:1; font-family:var(--font-head); font-size:17px; font-weight:500; line-height:1.55; color:var(--navy); }
.voice figcaption { display:flex; align-items:center; gap:14px; border-top:1px solid var(--line); padding-top:18px; }
.voice .ava { flex:none; width:44px; height:44px; border-radius:50%; background:var(--navy); color:var(--brass-light); font-family:var(--font-head); font-size:14px; font-weight:600; display:inline-flex; align-items:center; justify-content:center; }
.voice figcaption p:first-child { margin:0; font-family:var(--font-head); font-size:15px; font-weight:600; }
.voice figcaption p:last-child { margin:0; color:var(--slate-text); font-size:13px; }

/* Magazin */
.mag-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:48px; }
.mag-head h2 { font-size:clamp(28px,3.6vw,42px); font-weight:700; margin:0; }
.mag-head .all { font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--brass-dark); }
.post-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-card); display:flex; flex-direction:column; position:relative; transition:transform .25s ease; }
.post-card:hover { transform:translateY(-4px); }
.post-card .thumb { aspect-ratio:16/9; background:var(--navy) center/cover no-repeat; }
.post-card .body { padding:24px 24px 28px; display:flex; flex-direction:column; gap:10px; flex:1; }
.post-meta { display:flex; align-items:center; gap:10px; }
.post-cat { font-family:var(--font-head); font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--brass-dark); border:1px solid rgba(179,135,62,.4); border-radius:99px; padding:4px 12px; }
.post-date { color:var(--slate-text); font-size:13px; }
.post-card h3 { font-size:19px; font-weight:600; line-height:1.35; }
.post-card h3 a { color:var(--navy); }
.post-card h3 a::after { content:""; position:absolute; inset:0; }
.post-card:hover h3 a { color:var(--brass-dark); }
.post-card p { margin:0; color:var(--slate-text); font-size:15px; }

/* Archiv-Liste */
.archive-list { display:flex; flex-direction:column; }
.archive-item { position:relative; display:flex; align-items:center; gap:18px; padding:16px 8px; border-top:1px solid rgba(24,32,48,.1); color:var(--navy); transition:background .2s; }
.archive-item:hover { background:rgba(24,32,48,.03); }
.archive-item .thumb { flex:none; width:72px; height:48px; border-radius:var(--radius); background:var(--navy) center/cover no-repeat; }
.archive-item .txt { flex:1; min-width:0; }
.archive-item h3 { font-family:var(--font-head); font-size:16px; font-weight:600; line-height:1.35; margin:0; }
.archive-item h3 a { color:var(--navy); }
.archive-item h3 a::after { content:""; position:absolute; inset:0; }
.archive-item:hover h3 a { color:var(--brass-dark); }
.archive-item .meta { display:block; color:var(--slate-text); font-size:13px; margin-top:2px; }
.archive-item .arr { color:var(--brass-dark); font-size:16px; }

/* Newsletter */
.newsletter { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:36px; align-items:center; }
.newsletter h2 { font-size:clamp(24px,3vw,34px); font-weight:700; line-height:1.2; margin:0 0 12px; }
.newsletter .lead { margin:0; color:var(--slate-text); font-size:16px; }
.nl-form { display:flex; flex-wrap:wrap; gap:12px; }
.nl-form input { flex:1 1 240px; font-family:var(--font-body); font-size:16px; color:var(--navy); background:#fff; border:1px solid rgba(24,32,48,.22); border-radius:var(--radius); padding:14px 16px; outline:none; transition:border-color .2s, box-shadow .2s; }
.nl-form input:focus { border-color:var(--brass-dark); box-shadow:0 0 0 3px rgba(179,135,62,.18); }
.nl-note { margin:12px 0 0; font-size:13px; color:var(--slate-text); }
.nl-success { display:none; gap:14px; align-items:flex-start; background:#fff; border:1px solid rgba(46,125,79,.35); border-radius:var(--radius-lg); padding:22px 24px; box-shadow:var(--shadow-card); }
.nl-success.show { display:flex; }
.nl-success.show + .nl-form, .nl-form.hide { display:none; }
.tick { flex:none; width:32px; height:32px; border-radius:50%; background:rgba(46,125,79,.12); color:var(--ok); display:inline-flex; align-items:center; justify-content:center; font-weight:700; }

/* CTA-Band */
.cta-band { text-align:center; }
.cta-band .venn--lg { margin:0 auto 28px; }
.cta-band h2 { font-size:clamp(28px,3.6vw,42px); font-weight:700; line-height:1.18; margin:0 0 16px; color:#fff; }
.cta-band p { margin:0 0 36px; color:var(--slate); font-size:18px; }
.cta-inner { max-width:720px; margin:0 auto; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { background:var(--navy-deep); color:var(--slate); padding:72px 24px 36px; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:44px; padding-bottom:48px; border-bottom:1px solid rgba(138,147,165,.2); }
.footer-grid .about { max-width:300px; }
.footer-grid .about img { height:26px; width:auto; margin-bottom:18px; }
.footer-grid .about p { margin:0; font-size:15px; line-height:1.6; }
.footer-col h4 { margin:0 0 14px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--cream); }
.footer-col a { display:block; color:var(--slate); font-size:15px; margin-bottom:10px; }
.footer-col a:hover { color:var(--cream); }
.footer-col p { margin:0; font-size:15px; line-height:1.7; }
.footer-bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-top:28px; }
.footer-bottom p { margin:0; font-size:13px; }
.footer-bottom .links { display:flex; gap:24px; }
.footer-bottom a { color:var(--slate); font-size:13px; }
.footer-bottom a:hover { color:var(--cream); }
.footer-compact { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; max-width:var(--maxw); margin:0 auto; }
.footer-compact img { height:24px; width:auto; }
.footer-compact .links { display:flex; flex-wrap:wrap; gap:24px; }
.footer-compact a { color:var(--slate); font-size:14px; }
.footer-compact a:hover { color:var(--cream); }
.footer-compact p { margin:0; font-size:13px; }
.site-footer--compact { padding:48px 24px; }

/* ==========================================================================
   Unterseiten
   ========================================================================== */
.page-hero { position:relative; background:var(--navy) center 30%/cover no-repeat; }
.page-hero .ov { position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,21,34,.82), rgba(15,21,34,.9)); }
.page-hero .inner { position:relative; max-width:var(--maxw); margin:0 auto; padding:clamp(96px,10vw,150px) 24px clamp(48px,7vw,80px); }
.page-hero h1 { font-size:clamp(32px,4.6vw,52px); font-weight:700; line-height:1.14; margin:0 0 18px; color:#fff; letter-spacing:-.015em; max-width:760px; }
.page-hero .lead { margin:0; color:var(--cream); font-size:19px; max-width:640px; }
.page-hero .chip-nav { display:flex; flex-wrap:wrap; gap:10px; margin-top:36px; }
.page-hero .chip-nav a { font-family:var(--font-head); font-size:14px; font-weight:500; color:var(--cream); border:1px solid rgba(138,147,165,.4); border-radius:99px; padding:9px 20px; transition:border-color .2s; }
.page-hero .chip-nav a:hover { border-color:var(--brass-light); color:#fff; }
.page-hero--compact .inner { padding:clamp(96px,10vw,140px) 24px clamp(36px,5vw,56px); }

/* Service-Detailblock */
.svc-detail { display:flex; flex-direction:column; gap:24px; }
.svc-block { background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); padding:clamp(28px,4vw,44px); display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:28px; align-items:start; }
.svc-block .venn { margin-bottom:16px; }
.svc-block .num { margin:0 0 8px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark); }
.svc-block h2 { font-size:clamp(22px,2.6vw,28px); font-weight:700; margin:0 0 14px; line-height:1.25; }
.svc-block > div > p { margin:0; color:var(--slate-text); font-size:17px; }
.bullet-list { margin:0 0 20px; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px; }
.bullet-list li { display:flex; gap:12px; align-items:baseline; color:var(--navy); font-size:16px; }
.bullet-list li::before { content:""; flex:none; width:8px; height:8px; border:1.5px solid var(--brass-dark); border-radius:50%; position:relative; top:1px; }
.svc-block .card-link { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-dark); }

/* Artikel */
.article { max-width:760px; margin:0 auto; padding:clamp(110px,12vw,150px) 24px 72px; }
.article-back { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--slate-text); margin-bottom:32px; }
.article-back:hover { color:var(--navy); }
.article h1 { font-size:clamp(30px,4.2vw,44px); font-weight:700; line-height:1.18; margin:0 0 24px; letter-spacing:-.015em; }
.article-byline { display:flex; align-items:center; gap:14px; margin-bottom:36px; }
.article-byline img { width:44px; height:44px; border-radius:50%; object-fit:cover; object-position:center 20%; }
.article-byline p { margin:0; font-size:15px; color:var(--slate-text); }
.article-byline strong { color:var(--navy); font-family:var(--font-head); font-weight:600; }
.article-hero-img { width:100%; border-radius:var(--radius-lg); margin-bottom:40px; }
.article .lead-p { margin:0 0 24px; font-size:19px; line-height:1.7; color:var(--navy); }
.article h2 { font-size:26px; font-weight:700; margin:40px 0 16px; line-height:1.3; }
.article h3 { font-size:21px; font-weight:600; margin:32px 0 12px; }
.article p, .article li { color:#2b3550; }
.article ul, .article ol { padding-left:0; list-style:none; display:flex; flex-direction:column; gap:12px; margin:0 0 24px; }
.article ul li { display:flex; gap:12px; align-items:baseline; }
.article ul li::before { content:""; flex:none; width:8px; height:8px; border:1.5px solid var(--brass-dark); border-radius:50%; position:relative; top:6px; }
.article ol { counter-reset:ol; }
.article ol li { display:flex; gap:12px; align-items:baseline; counter-increment:ol; }
.article ol li::before { content:counter(ol); flex:none; font-family:var(--font-head); font-weight:600; color:var(--brass-dark); }
.article blockquote { margin:36px 0; padding:28px 32px; background:#fff; border-left:3px solid var(--brass); border-radius:0 var(--radius-lg) var(--radius-lg) 0; box-shadow:var(--shadow-card); }
.article blockquote p { margin:0; font-family:var(--font-head); font-size:20px; font-weight:500; line-height:1.5; color:var(--navy); }
.article img { border-radius:var(--radius-lg); margin:1.2em 0; }
.archive-note { margin:36px 0; padding:16px 20px; background:rgba(138,147,165,.12); border:1px solid rgba(138,147,165,.3); border-radius:var(--radius); display:flex; gap:12px; align-items:baseline; }
.archive-note .i { flex:none; font-family:var(--font-head); font-weight:700; color:var(--slate-text); }
.archive-note p { margin:0; font-size:14px; color:var(--slate-text); }
.author-card { margin-top:56px; padding:28px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); display:flex; flex-wrap:wrap; gap:24px; align-items:center; }
.author-card img { width:88px; height:88px; border-radius:50%; object-fit:cover; object-position:center 20%; }
.author-card .info { flex:1; min-width:240px; }
.author-card strong { display:block; margin:0 0 4px; font-family:var(--font-head); font-size:17px; font-weight:600; }
.author-card p { margin:0 0 10px; color:var(--slate-text); font-size:15px; }
.author-card .links { display:flex; gap:20px; }
.author-card .links a { font-family:var(--font-head); font-size:14px; font-weight:600; }

/* ==========================================================================
   Kontakt-Formular
   ========================================================================== */
.form-layout { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:44px; align-items:start; }
.form-layout > * { min-width:0; }
.contact-form { display:flex; flex-direction:column; gap:22px; max-width:560px; }
.contact-form h1 { font-size:clamp(28px,3.4vw,38px); font-weight:700; margin:0 0 4px; }
.contact-form > p { margin:0 0 8px; color:var(--slate-text); font-size:17px; }
.field { display:flex; flex-direction:column; gap:8px; }
.field > span { font-family:var(--font-head); font-size:14px; font-weight:600; }
.field input, .field select, .field textarea {
  font-family:var(--font-body); font-size:16px; color:var(--navy); background:var(--paper);
  border:1px solid rgba(24,32,48,.22); border-radius:var(--radius); padding:13px 16px; outline:none;
  transition:border-color .2s, box-shadow .2s; width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color:var(--brass-dark); box-shadow:0 0 0 3px rgba(179,135,62,.18); }
.field textarea { min-height:130px; resize:vertical; }
.field input[aria-invalid="true"] { border:1.5px solid var(--err); box-shadow:0 0 0 3px rgba(179,38,30,.1); }
.field-error { display:flex; gap:8px; align-items:baseline; color:var(--err); font-size:14px; }
.consent { display:flex; gap:12px; align-items:baseline; font-size:15px; color:var(--slate-text); cursor:pointer; }
.consent input { accent-color:var(--brass-dark); width:17px; height:17px; position:relative; top:2px; flex:none; }
.hp-field { position:absolute; left:-9999px; opacity:0; height:0; overflow:hidden; }
.contact-form button[type="submit"] { align-self:flex-start; }
.contact-aside { display:flex; flex-direction:column; gap:20px; }
.contact-aside .photo { width:100%; border-radius:var(--radius-lg); aspect-ratio:4/3; object-fit:cover; }
.aside-card { background:var(--navy); color:var(--cream); border-radius:var(--radius-lg); padding:28px; }
.aside-card .eyebrow { margin:0 0 12px; color:var(--brass-light); }
.aside-card p { margin:0 0 16px; font-size:16px; line-height:1.7; }
.aside-card p:last-child { margin:0; font-size:15px; color:var(--slate); }
.form-success { display:none; text-align:center; padding:40px 24px; background:#fff; border:1px solid rgba(46,125,79,.35); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }
.form-success.show { display:block; }
.form-success .tick { width:64px; height:64px; margin:0 auto 18px; font-size:26px; }
.form-success h2 { font-size:24px; font-weight:700; margin:0 0 8px; }
.form-success p { margin:0; color:var(--slate-text); }
.form-error-box { color:var(--err); font-size:14px; margin-top:8px; display:none; }
.form-error-box.show { display:block; }

/* ==========================================================================
   404
   ========================================================================== */
.notfound { position:relative; background:var(--navy-deep) center/cover no-repeat; }
.notfound .ov { position:absolute; inset:0; background:rgba(15,21,34,.85); }
.notfound .inner { position:relative; max-width:640px; margin:0 auto; padding:clamp(110px,12vw,150px) 24px clamp(72px,10vw,120px); text-align:center; }
.notfound h1 { font-size:clamp(28px,4vw,42px); font-weight:700; line-height:1.2; margin:0 0 14px; color:#fff; }
.notfound p { margin:0 0 32px; color:var(--cream); font-size:17px; }
.notfound .btns { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

/* ==========================================================================
   Use-Cases-Seite
   ========================================================================== */
.gov-band { background:var(--paper); border-bottom:1px solid var(--line); }
.gov-band .container { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:36px; padding:48px 24px; }
.gov-item { border-top:2px solid var(--brass); padding-top:16px; }
.gov-item p:first-child { margin:0 0 6px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark); }
.gov-item p:last-child { margin:0; font-size:16px; }
.uc-section { padding:var(--space-section) 24px; border-top:1px solid rgba(24,32,48,.07); }
.uc-head { max-width:680px; margin-bottom:52px; }
.uc-head h2 { font-size:clamp(26px,3.2vw,38px); font-weight:700; line-height:1.2; margin:0 0 16px; }
.uc-head p { margin:0; color:var(--slate-text); font-size:18px; }
.timeline { list-style:none; margin:0 0 52px; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px; }
.timeline li { border-top:2px solid var(--line-2); padding-top:16px; }
.timeline li.human { border-top-color:var(--brass); }
.timeline .n { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; border:1.5px solid var(--line-2); color:var(--slate-text); font-family:var(--font-head); font-size:13px; font-weight:600; margin-bottom:10px; }
.timeline li.human .n { border-color:var(--brass); color:var(--brass-dark); }
.timeline h3 { font-size:16px; font-weight:600; margin:0 0 6px; }
.timeline p { margin:0; color:var(--slate-text); font-size:15px; }
.uc-cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:24px; align-items:start; }
.protocol { background:var(--navy-deep); border-radius:var(--radius-lg); padding:28px; box-shadow:var(--shadow-card); }
.protocol .eyebrow { margin:0 0 18px; color:var(--brass-light); }
.protocol ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.protocol li { display:flex; gap:16px; align-items:baseline; }
.protocol .t { flex:none; width:44px; font-family:var(--font-head); font-size:12px; font-weight:600; color:var(--slate); }
.protocol .txt { color:var(--cream); font-size:15px; line-height:1.5; }
.fits { border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px; box-shadow:var(--shadow-card); }
.fits .eyebrow { margin:0 0 18px; color:var(--slate-text); }
.fits ul { list-style:none; margin:0 0 22px; padding:0; display:flex; flex-direction:column; gap:12px; }
.fits li { display:flex; gap:12px; align-items:baseline; font-size:16px; }
.fits li .ck { flex:none; color:var(--ok); font-weight:700; }
.fits .card-link { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-dark); }

/* Readiness-Check */
.readiness { display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:24px; align-items:start; max-width:1020px; margin:0 auto; }
.rd-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.rd-list li { display:flex; gap:18px; align-items:center; justify-content:space-between; padding:16px 0; border-top:1px solid rgba(24,32,48,.1); }
.rd-list p { margin:0; font-size:16px; flex:1; }
.rd-btns { display:flex; gap:8px; flex:none; }
.rd-btns button { font-family:var(--font-head); font-size:13px; font-weight:600; padding:8px 18px; border-radius:99px; cursor:pointer; border:1px solid rgba(24,32,48,.22); background:transparent; color:var(--slate-text); transition:all .15s; }
.rd-btns button.on { background:var(--navy); color:var(--cream); border-color:var(--navy); }
.rd-result { background:var(--navy); border-radius:var(--radius-lg); padding:32px; box-shadow:var(--shadow-card); position:sticky; top:96px; }
.rd-result .eyebrow { margin:0 0 8px; color:var(--brass-light); }
.rd-score { margin:0 0 6px; font-family:var(--font-head); font-size:44px; font-weight:700; color:#fff; line-height:1; }
.rd-score span { font-size:20px; color:var(--slate); }
.rd-verdict { margin:0 0 12px; font-family:var(--font-head); font-size:18px; font-weight:600; color:var(--cream); }
.rd-text { margin:0 0 24px; color:var(--slate); font-size:15px; line-height:1.6; }

/* Einstiegsangebote */
.offer-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px 28px; box-shadow:var(--shadow-card); display:flex; flex-direction:column; gap:12px; }
.offer-card.mid { border-color:rgba(179,135,62,.5); }
.offer-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.offer-top .num { margin:0; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark); }
.offer-top .dur { font-family:var(--font-head); font-size:12px; font-weight:600; color:var(--slate-text); border:1px solid var(--line-2); border-radius:99px; padding:5px 14px; }
.offer-card h3 { font-size:21px; font-weight:600; line-height:1.3; }
.offer-card > p { margin:0; color:var(--slate-text); font-size:15px; flex:1; }
.offer-result { margin:0; font-size:15px; border-top:1px solid rgba(24,32,48,.1); padding-top:14px; }
.offer-result strong { font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--slate-text); display:block; margin-bottom:4px; }
.offer-card .card-link { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--brass-dark); margin-top:4px; }

/* Stack */
.stack-list { display:flex; flex-direction:column; }
.stack-row { display:grid; grid-template-columns:minmax(180px,240px) 1fr; gap:16px 32px; align-items:baseline; padding:24px 0; border-top:1px solid var(--line-dark); }
.stack-row .layer { margin:0; font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--cream); }
.stack-row .sub { margin:2px 0 0; font-size:13px; color:var(--slate); }
.stack-tools { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.stack-tools span.tool { font-family:var(--font-head); font-size:14px; font-weight:500; color:var(--cream); border:1px solid rgba(138,147,165,.35); border-radius:99px; padding:7px 16px; }
.stack-tools .note { font-size:13px; color:var(--slate); }
@media (max-width:560px){ .stack-row { grid-template-columns:1fr; gap:12px; } }

/* FAQ */
.faq { display:flex; flex-direction:column; }
.faq details { border-top:1px solid var(--line-2); padding:4px 0; }
.faq summary { cursor:pointer; padding:18px 8px; font-family:var(--font-head); font-size:17px; font-weight:600; color:var(--navy); }
.faq details p { margin:0; padding:0 8px 22px; color:var(--slate-text); font-size:16px; line-height:1.65; max-width:680px; }

/* ==========================================================================
   Rechner
   ========================================================================== */
input[type="range"] { accent-color:var(--brass-dark); width:100%; }
.calc { display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:32px; align-items:start; }
.calc-steps { display:flex; flex-direction:column; gap:44px; }
.calc-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:26px; box-shadow:var(--shadow-card); }
.calc-step p.lbl { margin:0 0 6px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--brass-dark); }
.calc-step h2 { font-size:22px; font-weight:700; margin:0 0 18px; }
.calc-note { margin:14px 0 0; font-size:15px; color:var(--slate-text); max-width:640px; }
.pick-row { display:flex; flex-wrap:wrap; gap:10px; }
.pick { font-family:var(--font-head); font-size:14px; font-weight:600; padding:11px 22px; border-radius:99px; cursor:pointer; border:1px solid rgba(24,32,48,.2); background:#fff; color:var(--navy); transition:all .15s; }
.pick.on { background:var(--navy); color:var(--cream); border-color:var(--navy); }
.pick-sm { font-size:13px; font-weight:500; padding:8px 16px; background:transparent; color:var(--slate-text); }
.pick-sm.on { background:var(--navy); color:var(--cream); border-color:var(--navy); }
.area-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; }
.area { cursor:pointer; background:#fff; border:1px solid var(--line-2); border-radius:var(--radius-lg); padding:16px 18px; transition:border-color .15s; }
.area.on { background:var(--navy); border-color:var(--navy); }
.area-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.area-top p { margin:0; font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--navy); }
.area.on .area-top p { color:var(--cream); }
.area .box { flex:none; width:20px; height:20px; border-radius:50%; border:1.5px solid rgba(24,32,48,.25); color:var(--navy-deep); font-size:12px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.area.on .box { border-color:var(--brass-light); background:var(--brass-light); }
.area .hint { margin:6px 0 0; font-size:13px; color:var(--slate-text); }
.area.on .hint { color:var(--slate); }
.area-persons { display:flex; align-items:center; gap:10px; margin-top:14px; border-top:1px solid rgba(138,147,165,.3); padding-top:12px; }
.area-persons span.l { font-size:13px; color:var(--slate); flex:1; }
.area:not(.on) .area-persons { display:none; }
.stepper { width:26px; height:26px; border-radius:50%; border:1px solid var(--brass-light); background:none; color:var(--cream); cursor:pointer; font-size:14px; line-height:1; }
.area-persons .cnt { font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--cream); min-width:20px; text-align:center; }
.slider-card { display:flex; flex-direction:column; gap:22px; }
.slider-lbl { display:flex; flex-direction:column; gap:8px; }
.slider-lbl .top { display:flex; justify-content:space-between; font-size:15px; }
.slider-lbl .top strong { font-family:var(--font-head); font-weight:600; }
.slider-lbl .top .val { color:var(--brass-dark); font-family:var(--font-head); font-weight:600; }
.slider-lbl .desc { font-size:13px; color:var(--slate-text); }
.radio-list { display:flex; flex-direction:column; gap:10px; }
.radio-opt { cursor:pointer; display:flex; gap:14px; align-items:baseline; background:rgba(255,255,255,.5); border:1px solid rgba(24,32,48,.1); border-radius:var(--radius-lg); padding:16px 18px; transition:border-color .15s; }
.radio-opt.on { background:#fff; border-color:rgba(179,135,62,.55); }
.radio-opt .dot { flex:none; width:16px; height:16px; border-radius:50%; border:1.5px solid rgba(24,32,48,.3); position:relative; top:2px; }
.radio-opt.on .dot { border-color:var(--brass-dark); background:var(--brass-dark); }
.radio-opt .l { display:block; font-family:var(--font-head); font-size:15px; font-weight:600; }
.radio-opt .s { display:block; font-size:14px; color:var(--slate-text); }
.calc-result { background:var(--navy); border-radius:var(--radius-lg); padding:32px; box-shadow:var(--shadow-card); position:sticky; top:88px; }
.calc-result .eyebrow { margin:0 0 6px; color:var(--brass-light); }
.calc-savings { margin:0; font-family:var(--font-head); font-size:clamp(32px,3.4vw,44px); font-weight:700; color:#fff; line-height:1.1; letter-spacing:-.02em; }
.calc-hours { margin:4px 0 20px; font-size:14px; color:var(--slate); }
.calc-block { border-top:1px solid rgba(138,147,165,.25); padding-top:18px; margin-bottom:18px; }
.calc-block p:first-child { margin:0 0 6px; font-family:var(--font-head); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--slate); }
.calc-block p:last-child { margin:0; font-size:15px; color:var(--cream); line-height:1.6; }
.calc-result .btn { display:flex; justify-content:center; width:100%; }
.calc-disc { margin:14px 0 0; font-size:12px; color:var(--slate); line-height:1.5; }
.calc-systems { display:flex; flex-wrap:wrap; gap:8px; }
.calc-selects { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.calc-sub { margin:0 0 12px; font-family:var(--font-head); font-size:14px; font-weight:600; }

/* Angebot-Formular (dunkel) */
.offer-form { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.offer-form input { font-family:var(--font-body); font-size:15px; color:var(--cream); background:rgba(247,244,233,.06); border:1px solid rgba(138,147,165,.4); border-radius:var(--radius); padding:13px 16px; outline:none; }
.offer-form input:focus { border-color:var(--brass-light); }
.offer-form input.firma { flex:1 1 180px; max-width:240px; }
.offer-form input.email { flex:1 1 220px; max-width:280px; }
.offer-success { display:none; }
.offer-success.show { display:block; }
.offer-success .tick { width:52px; height:52px; background:rgba(46,125,79,.18); color:#5fbd85; font-size:22px; margin-bottom:18px; }
.dark-note { margin:16px 0 0; font-size:13px; color:var(--slate); }
.dark-note a { color:var(--brass-light); }

/* ==========================================================================
   Responsive Feinschliff
   ========================================================================== */
@media (max-width:640px){
  body { font-size:16px; }
  .hero-inner { padding:120px 20px 80px; }
  .section-head { margin-bottom:40px; }
}

/* ==========================================================================
   Popup (Newsletter/CTA, per JS injiziert)
   ========================================================================== */
.wf-pop-ov { position:fixed; inset:0; z-index:90; background:rgba(15,21,34,.55); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; transition:opacity .3s ease; }
.wf-pop-ov.show { opacity:1; }
.wf-pop { position:relative; width:min(460px,100%); background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-lift); overflow:hidden; transform:translateY(12px); transition:transform .3s ease; }
.wf-pop-ov.show .wf-pop { transform:none; }
.wf-pop-head { background:var(--navy-deep); color:var(--cream); padding:16px 22px; font-family:var(--font-head); font-weight:700; letter-spacing:.04em; font-size:14px; display:flex; align-items:center; gap:10px; }
.wf-pop-head .venn { width:34px; height:20px; }
.wf-pop-head .venn span { width:20px; height:20px; }
.wf-pop-head .venn span:first-child { border-color:var(--brass-light); }
.wf-pop-head .venn span:last-child { left:12px; border-color:var(--cream); }
.wf-pop-body { padding:26px 24px 24px; }
.wf-pop-body h3 { font-size:20px; margin:0 0 8px; }
.wf-pop-body p { color:var(--slate-text); font-size:15px; margin:0 0 16px; }
.wf-pop-form { display:flex; flex-direction:column; gap:10px; }
.wf-pop-form input { font-family:var(--font-body); font-size:15px; color:var(--navy); background:var(--paper); border:1px solid rgba(24,32,48,.22); border-radius:var(--radius); padding:12px 14px; outline:none; }
.wf-pop-form input:focus { border-color:var(--brass-dark); box-shadow:0 0 0 3px rgba(179,135,62,.18); }
.wf-pop-form button { width:100%; justify-content:center; }
.wf-pop-note { font-size:12px; color:var(--slate-text); margin:10px 0 0; }
.wf-pop-close { position:absolute; top:12px; right:14px; background:none; border:0; color:rgba(247,244,233,.85); font-size:20px; cursor:pointer; line-height:1; z-index:2; }
.wf-pop-close:hover { color:#fff; }
.wf-pop-fw { text-align:center; }
.wf-pop-fw a.btn { width:100%; justify-content:center; margin-bottom:10px; }
.wf-pop-no { background:none; border:0; color:var(--slate-text); font-size:14px; cursor:pointer; text-decoration:underline; }