/* ================================================================
   TACTICAL MANAGEMENT — INSTITUTIONAL DESIGN SYSTEM
   Modeled on Blackstone, BlackRock, Apollo, KKR.
   White surface, generous whitespace, single sans-serif system,
   minimal bold, no decorative lines, no clutter.
   ================================================================ */

/* ----------------------------------------------------------------
   Self-hosted variable fonts. GDPR-compliant: no Google CDN, no IP
   leak to a US service for European users. Inter and Source Serif 4
   are both shipped as variable fonts so a single file covers the
   full weight range; latin and latin-ext only — DACH + ES coverage,
   no Cyrillic/Greek/Vietnamese subsets we don't render.
   ---------------------------------------------------------------- */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url('/assets/fonts/source-serif-4-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 Serif 4';
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url('/assets/fonts/source-serif-4-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 Serif 4';
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url('/assets/fonts/source-serif-4-italic-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 Serif 4';
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url('/assets/fonts/source-serif-4-italic-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{
  /* Surfaces — pure white, BlackRock/Blackstone */
  --bg:#ffffff;
  --bg-2:#fbfbfb;
  --bg-3:#f5f5f5;
  --ink:#0a0a0a;
  --ink-2:#1a1a1a;
  --ink-3:#2a2a2a;
  --muted:#5a5a5a;
  --muted-2:#7a7a7a;
  --muted-3:#a0a0a0;

  /* Hairlines — used only where strictly necessary */
  --line:#ececec;
  --line-2:#e0e0e0;
  --hover:#fafafa;

  /* Brand red — Tactical dark red. Single token, used everywhere.
     Sharper, more bordeaux-leaning than vermillion; reads as "elite" not "alarm". */
  --red:#ff0000;
  --red-2:#cc0000;
  --red-on-dark:#ff0000;

  /* Type stack — Inter only, BlackRock/Söhne discipline */
  --display:'Inter','Söhne Breit','Helvetica Neue',system-ui,sans-serif;
  --sans:'Inter',system-ui,-apple-system,sans-serif;
  --serif:'Source Serif 4','Tiempos Headline','Bower',Georgia,serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{
  background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.6;
  font-feature-settings:"ss01","cv11","cv02";
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
  max-width:100vw;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}

::selection{background:var(--ink);color:#fff}

.wrap{max-width:1380px;margin:0 auto;padding:0 48px}@media(max-width:1080px) {
.wrap{padding:0 32px}
}
@media(max-width:520px) {
.wrap{padding:0 24px}
}


/* Scroll progress */
.progress{position:fixed;top:0;left:0;height:2px;background:var(--red);z-index:60;width:0;transition:width .12s linear}

/* ================================================================
   TYPOGRAPHY — single sans, clear hierarchy, minimal bold
   ================================================================ */

.eyebrow{
  font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  margin-bottom:32px;display:block;
}
.eyebrow::before{content:attr(data-num);color:var(--red);font-weight:600;letter-spacing:.14em;margin-right:14px}
.eyebrow.no-num::before{content:none}

.display{
  font-family:var(--display);font-weight:300;
  letter-spacing:-.028em;line-height:1.04;color:var(--ink);
  hyphens:none;-webkit-hyphens:none;
}
.display em{font-style:italic;font-weight:300;font-family:var(--serif);letter-spacing:-.018em}
.display strong{font-weight:500;color:var(--ink)}

.lede{
  font-family:var(--sans);font-weight:400;font-size:20px;line-height:1.6;color:var(--ink-2);
  max-width:720px;
}
.lede strong{font-weight:500;color:var(--ink)}@media(max-width:720px) {
.lede{font-size:18px}
}


/* Rückruf modal — Tier-2 spam mitigation. Public phone removed; this
   gates callback requests through a 3-field form. */
.rueckruf-modal{
  position:fixed; inset:0; z-index:2000;
  display:none; align-items:center; justify-content:center;
}
.rueckruf-modal-backdrop{
  position:absolute; inset:0; background:rgba(10,10,10,.55);
  backdrop-filter:blur(2px);
}
.rueckruf-modal-panel{
  position:relative; background:#fff; color:var(--ink,#0a0a0a);
  max-width:500px; width:calc(100% - 32px);
  max-height:calc(100vh - 32px); overflow-y:auto;
  padding:36px 36px 28px;
  border-radius:8px;
  box-shadow:0 24px 80px rgba(0,0,0,.32);
  font-family:'Inter',system-ui,sans-serif;
}
.rueckruf-modal-x{
  position:absolute; top:12px; right:12px;
  width:36px; height:36px; border:none; background:transparent;
  font-size:24px; line-height:1; color:#888; cursor:pointer;
  border-radius:4px;
}
.rueckruf-modal-x:hover{background:#f5f5f5; color:#0a0a0a}
.rueckruf-modal-eyebrow{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:#ff5040; margin:0 0 8px; font-weight:600;
}
.rueckruf-modal-h{
  font-family:var(--serif,Georgia,serif);
  font-size:24px; font-weight:500; line-height:1.25;
  margin:0 0 12px;
}
.rueckruf-modal-sub{
  font-size:14px; line-height:1.55; color:#555;
  margin:0 0 20px;
}
.rueckruf-form{display:flex; flex-direction:column; gap:14px}
.rueckruf-field{display:flex; flex-direction:column; gap:6px}
.rueckruf-label{
  font-size:12px; font-weight:600; color:#333;
  letter-spacing:.02em;
}
.rueckruf-form input[type=text],
.rueckruf-form input[type=email],
.rueckruf-form textarea{
  width:100%; box-sizing:border-box;
  padding:10px 12px;
  border:1px solid #d4d4d4; border-radius:4px;
  font:inherit; font-size:14px; color:#0a0a0a;
  background:#fff;
}
.rueckruf-form input:focus,
.rueckruf-form textarea:focus{
  outline:none; border-color:#0a0a0a;
}
.rueckruf-form textarea{resize:vertical; min-height:72px}
.rueckruf-submit{
  margin-top:8px; padding:13px 18px;
  background:#0a0a0a; color:#fff; border:none; border-radius:4px;
  font:inherit; font-size:14px; font-weight:600; letter-spacing:.04em;
  cursor:pointer;
  transition:background .15s ease;
}
.rueckruf-submit:hover:not(:disabled){background:#1a1a1a}
.rueckruf-submit:disabled{opacity:.6; cursor:not-allowed}
.rueckruf-status{margin:12px 0 0; font-size:13px; color:#555}
.rueckruf-status.ok{color:#10632e; padding:12px; background:#e8f5ec; border-radius:4px}
.rueckruf-status.err{color:#b3261e; padding:12px; background:#fdecea; border-radius:4px}
@media(max-width:520px) {
  .rueckruf-modal-panel{padding:28px 22px 22px}
  .rueckruf-modal-h{font-size:20px}
}
@media(max-width:380px) {
  /* iPhone SE / 320–375 viewport — tightest realistic case */
  .rueckruf-modal-panel{padding:24px 18px 18px; width:calc(100% - 24px); max-height:calc(100vh - 24px)}
  .rueckruf-modal-eyebrow{font-size:10px; letter-spacing:.14em}
  .rueckruf-modal-h{font-size:18px; line-height:1.25; margin-bottom:10px}
  .rueckruf-modal-sub{font-size:13px; margin-bottom:16px}
  .rueckruf-form{gap:12px}
  .rueckruf-label{font-size:11.5px}
  .rueckruf-form input[type=text],
  .rueckruf-form input[type=email],
  .rueckruf-form textarea{padding:9px 11px; font-size:14px}
  .rueckruf-submit{padding:12px 14px; font-size:13px}
  .rueckruf-modal-x{width:32px; height:32px; font-size:22px; top:8px; right:8px}
}


/* Sticky floating CTA — appears once user scrolls past hero.
   Desktop: bottom-right pill. Mobile: full-width bottom bar.
   Hidden by default; site.js adds .visible after hero leaves viewport,
   and removes it when an in-page .cta-block enters viewport. */
.sticky-cta{
  position:fixed; right:24px; bottom:24px; z-index:1000;
  display:flex; gap:10px; align-items:stretch;
  opacity:0; transform:translateY(20px); pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.sticky-cta.visible{opacity:1; transform:translateY(0); pointer-events:auto}
.sticky-cta-btn{
  display:flex; flex-direction:column; gap:2px;
  background:var(--ink,#0a0a0a); color:#fff;
  padding:14px 22px; border-radius:6px;
  text-decoration:none;
  box-shadow:0 8px 32px rgba(0,0,0,.18), 0 2px 4px rgba(0,0,0,.12);
  font-family:'Inter',system-ui,sans-serif;
  transition:transform .15s ease, box-shadow .15s ease;
}
.sticky-cta-btn:hover{transform:translateY(-1px); box-shadow:0 12px 36px rgba(0,0,0,.22)}
.sticky-cta-lbl{font-size:14px; font-weight:600; letter-spacing:.04em}
.sticky-cta-sub{font-size:11px; font-weight:400; opacity:.7; letter-spacing:.02em}
.sticky-cta-phone{
  display:flex; align-items:center; justify-content:center;
  width:54px; background:#fff; color:var(--ink,#0a0a0a);
  border:1px solid var(--line,#e5e5e5); border-radius:6px;
  font-family:inherit; font-size:22px; text-decoration:none;
  box-shadow:0 8px 32px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.08);
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
}
.sticky-cta-phone:hover{background:#fafafa}@media(max-width:720px) {

  .sticky-cta{right:12px; left:12px; bottom:12px}
  .sticky-cta-btn{flex:1}
  .sticky-cta-lbl{font-size:13px}
  .sticky-cta-sub{font-size:10.5px}

}


/* Press strip — visible publication signal for humans.
   The same publications are in JSON-LD subjectOf for AI engines; this
   surfaces them where seller visitors actually see them. */
.press-strip{
  border-top:1px solid var(--line,#e5e5e5);
  border-bottom:1px solid var(--line,#e5e5e5);
  padding:24px 0;
  background:#fafafa;
}
.press-strip-inner{
  display:flex; flex-wrap:wrap; gap:16px 32px;
  align-items:center; justify-content:center;
  max-width:980px; margin:0 auto; padding:0 24px;
  box-sizing:border-box;
}
.press-strip-label{
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:#5a5a5a; margin-right:8px;
}
.press-strip-item{
  font-family:var(--serif,Georgia,serif);
  font-size:15px; font-weight:500; color:#555;
  letter-spacing:.01em;
  white-space:nowrap;
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .15s ease, border-color .15s ease;
}
.press-strip-item:hover{color:var(--ink,#0a0a0a); border-bottom-color:var(--ink,#0a0a0a)}
.press-strip-date{font-size:11px; color:#6a6a6a; margin-left:4px}@media(max-width:720px) {

  .press-strip-inner{gap:16px; padding:0 16px}
  .press-strip-item{font-size:13px}

}


/* Direktanruf block — surfaces phone number + Founding Partner availability
   with conversion-grade weight. No third-party scheduler needed. */
.direct-call{
  display:flex; align-items:center; gap:28px;
  padding:28px 32px;
  background:#0a0a0a; color:#fff;
  border-radius:8px;
  max-width:760px; margin:0 auto;
}
.direct-call-text{flex:1}
.direct-call-eyebrow{
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:#ff5040; margin:0 0 8px;
}
.direct-call-h{
  font-family:var(--serif,Georgia,serif);
  font-size:22px; font-weight:500; line-height:1.3;
  margin:0 0 6px; color:#fff;
}
.direct-call-sub{font-size:13px; color:rgba(255,255,255,.65); margin:0}
.direct-call-num{
  font-family:'Inter',system-ui,sans-serif;
  font-size:22px; font-weight:600; letter-spacing:.02em;
  color:#fff; text-decoration:none;
  white-space:nowrap;
  border:none; border-bottom:2px solid #ff5040;
  padding:0 0 2px;
  background:transparent;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
}
.direct-call-num:hover{color:#ff5040; background:transparent}@media(max-width:720px) {

  .direct-call{flex-direction:column; gap:16px; padding:24px; align-items:flex-start}
  .direct-call-num{font-size:20px}

}


/* lead-answer — the 134-167 word answer-first paragraph at the top of
   each money page. Maps to the WebPage.speakable selector for AI engines
   (Perplexity, ChatGPT, Claude, Gemini) — they extract from this block.
   Bolded first sentence is the direct answer to the page's primary query. */
.lead-answer-section{padding:56px 0 32px;border-top:1px solid var(--line)}
.lead-answer{
  font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.55;color:var(--ink);
  max-width:780px;
}
.lead-answer strong{font-weight:500;color:var(--ink);display:block;margin-bottom:14px;font-size:24px;line-height:1.4}
.lead-answer a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.lead-answer a:hover{border-bottom-color:var(--ink)}@media(max-width:720px) {

  .lead-answer-section{padding:40px 0 24px}
  .lead-answer{font-size:18px}
  .lead-answer strong{font-size:20px;margin-bottom:12px}

}


/* ================================================================
   HEADER — minimal, white, no border noise
   ================================================================ */

header.top{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(16px);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
}
.bar{display:flex;align-items:center;justify-content:space-between;height:84px;gap:24px;min-width:0}
.bar > *{min-width:0}
@media(max-width:720px){
  .bar{gap:12px;height:60px;padding:0 4px}
  /* Hide language switcher in header on phones — users access it via the
     drawer-meta language strip inside the mobile drawer. This eliminates
     the wordmark↔language↔menu collision on narrow viewports. */
  .bar .lang{display:none !important}
  .bar .cta.hide-mobile{display:none !important}
  .menu-btn{width:36px;height:36px;flex:0 0 auto}
  .brand{flex:0 1 auto;min-width:0;overflow:hidden}
  .brand img{height:22px;max-height:22px}

  /* Tightened section padding on phones — section default 64px is still
     too generous when stacked with multiple sections. Reduce to 40px so
     stacked sections breathe but don't waste screen real estate. */
  .section{padding:40px 0 !important}
  .page-header{padding:36px 0 28px !important}
  .article{padding:0 !important}
  /* UNIVERSAL MOBILE PADDING — every CONTENT .wrap (inside main/article/section)
     gets predictable horizontal padding. We deliberately exclude .bar
     (header) and footer/aphorism wraps that have their own constraints. */
  main .wrap,
  main article .wrap,
  main section .wrap,
  main section.s .wrap,
  main aside .wrap{
    padding-left:20px !important;
    padding-right:20px !important;
    box-sizing:border-box;
  }
  /* Article body content should never overflow the gutter. */
  .article > .wrap > h2,
  .article > .wrap > h3,
  .article > .wrap > p,
  .article > .wrap > ul,
  .article > .wrap > ol{
    max-width:100%;
    overflow-wrap:break-word;
  }

  /* Sticky CTA — relies on position:fixed and is allowed to overlay the
     last bit of content. We do NOT add bottom padding to <main>: doing
     so creates a visible white bar between the dark aphorism section
     and the dark footer on mobile. The CTA only covers a small bottom
     pill; users can scroll past it with no real obstruction. */

  /* Article hero on perspektiven and portfolio sub-pages */
  .hero-page{padding:32px 0 24px !important}
  .hero-page h1,
  .display{font-size:clamp(28px,7vw,36px) !important;line-height:1.1 !important}

  /* Long unbreakable words (URLs, German compound words) should wrap */
  .lede, .lead, p, h1, h2, h3{overflow-wrap:break-word;word-break:normal;hyphens:auto}
}

.brand{
  display:inline-flex;align-items:center;
  text-decoration:none;line-height:1;
}
.brand img{
  display:block;height:30px;width:auto;
}@media(max-width:520px) {
.brand img{height:24px}
}


nav.primary{display:flex;align-items:center;gap:36px}
nav.primary > a,
nav.primary .nav-group > .nav-trigger{
  font-size:14px;color:var(--ink-2);font-weight:400;letter-spacing:0;
  position:relative;padding:6px 0;transition:color .2s ease;
  cursor:pointer;background:none;border:0;font-family:inherit;
}
nav.primary > a:hover,nav.primary > a.is-current,
nav.primary .nav-group > .nav-trigger:hover,
nav.primary .nav-group.is-active > .nav-trigger{color:var(--red)}
nav.primary > a.is-current::after,
nav.primary .nav-group.is-active > .nav-trigger::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--red);
}

/* dropdown groups.
   The .nav-group itself is the hover region. We extend it downward with an
   invisible ::after pseudo-element that fills the gap to the panel — this
   is the "bridge" the cursor traverses without losing :hover. */
nav.primary .nav-group{position:relative}
nav.primary .nav-group::after{
  content:"";position:absolute;left:0;right:0;top:100%;height:18px;
  background:transparent;pointer-events:auto;
}
nav.primary .nav-group > .nav-trigger::after{
  content:" \25BE";font-size:9px;color:var(--muted);margin-left:3px;letter-spacing:0;
}
nav.primary .nav-group > .nav-trigger[aria-expanded="true"]::after{color:var(--red)}
nav.primary .nav-panel{
  position:absolute;top:100%;left:-18px;min-width:240px;margin-top:18px;
  background:#fff;border:1px solid var(--line);
  padding:14px 0;display:none;z-index:20;
  box-shadow:0 6px 28px rgba(0,0,0,.06);
}
nav.primary .nav-group:hover .nav-panel,
nav.primary .nav-group:focus-within .nav-panel,
nav.primary .nav-group.is-open .nav-panel{display:block}
nav.primary .nav-panel a{
  display:block;padding:9px 24px;font-size:14px;color:var(--ink);
  text-decoration:none;letter-spacing:0;line-height:1.4;
}
nav.primary .nav-panel a small{
  display:block;font-size:11px;color:var(--muted);margin-top:1px;letter-spacing:.04em;
}
nav.primary .nav-panel a:hover{background:#fafaf8;color:var(--red)}
nav.primary .nav-panel a:hover small{color:var(--red)}

/* Wide multi-column nav panel — used for /Praxis to hold three sub-sections
   (Methodik / Erwerbsanlässe / Für …) without a 15-item flat list. */
nav.primary .nav-panel.nav-panel-wide{
  min-width:760px;padding:20px 0 18px;
  display:none;
}
nav.primary .nav-group:hover .nav-panel.nav-panel-wide,
nav.primary .nav-group:focus-within .nav-panel.nav-panel-wide,
nav.primary .nav-group.is-open .nav-panel.nav-panel-wide{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
}
nav.primary .nav-panel.nav-panel-wide .nav-col{
  padding:4px 8px;border-left:1px solid var(--line);
}
nav.primary .nav-panel.nav-panel-wide .nav-col:first-child{border-left:none}
nav.primary .nav-panel.nav-panel-wide .nav-col-label{
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  margin:0 0 6px;padding:0 16px;font-weight:600;
}
nav.primary .nav-panel.nav-panel-wide a{padding:7px 16px}

.lang{display:flex;align-items:center;gap:14px}
.lang span,.lang a{
  font-size:12px;font-weight:500;color:var(--muted);letter-spacing:.06em;
  cursor:pointer;transition:color .2s ease;text-transform:uppercase;
}
.lang span:hover,.lang a:hover{color:var(--ink)}
.lang span.active{color:var(--ink)}
/* Locale-switcher fallback state — when a translation does not exist
   in the target locale, the switcher rewrites href to the locale root
   and adds .is-disabled. Show with reduced opacity + dotted underline
   so the user knows it's a partial match, not a missing link. */
.lang a.is-disabled{opacity:.55; text-decoration:underline; text-decoration-style:dotted; text-underline-offset:3px}
.lang .sep{color:var(--line-2)}

.cta{
  font-size:13px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;
  padding:13px 24px;border:1px solid var(--ink);transition:all .2s ease;
  display:inline-flex;align-items:center;gap:8px;
}
.cta:hover{background:var(--ink);color:#fff}@media(max-width:1140px) {
nav.primary{display:none}.lang .sep{display:none}
}


/* Mobile menu */
.menu-btn{display:none;width:40px;height:40px;align-items:center;justify-content:center;border:0;background:none}
.menu-btn span{display:block;width:22px;height:1.5px;background:var(--ink);position:relative;transition:all .25s ease}
.menu-btn span::before,.menu-btn span::after{
  content:"";position:absolute;left:0;width:100%;height:1.5px;background:var(--ink);transition:all .25s ease;
}
.menu-btn span::before{top:-7px}
.menu-btn span::after{top:7px}
.menu-btn.open span{background:transparent}
.menu-btn.open span::before{top:0;transform:rotate(45deg)}
.menu-btn.open span::after{top:0;transform:rotate(-45deg)}@media(max-width:1140px) {
.menu-btn{display:inline-flex}
}


.drawer{
  position:fixed;inset:84px 0 0;background:var(--bg);z-index:49;
  display:flex;flex-direction:column;
  transform:translateY(-110%);transition:transform .35s cubic-bezier(.16,1,.3,1);
  overflow-y:auto;
}
.drawer.open{transform:translateY(0)}
.drawer-inner{padding:32px 24px 64px;display:flex;flex-direction:column;gap:0}
.drawer a{
  font-family:var(--display);font-size:36px;font-weight:300;letter-spacing:-.024em;color:var(--ink);
  padding:20px 0;display:flex;align-items:baseline;justify-content:space-between;
}

/* ================================================================
   HERO — homepage split with photo
   ================================================================ */

.hero-bk{display:grid;grid-template-columns:1fr 1.05fr;gap:0;align-items:center;overflow:hidden;background:var(--bg)}

.hero-cta-row{margin-top:48px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;
  padding:16px 28px;border:1px solid var(--ink);background:var(--ink);color:#fff;
  transition:all .2s ease;cursor:pointer;
}
.btn:hover{background:var(--red);border-color:var(--red)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn .arrow{transition:transform .25s ease}
.btn:hover .arrow{transform:translateX(4px)}
.btn-link{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink);padding:14px 0;
  transition:color .2s ease;
}
.btn-link::after{content:"→";transition:transform .25s ease}
.btn-link:hover{color:var(--red)}
.btn-link:hover::after{transform:translateX(4px)}

/* Subpage hero — same Blackstone treatment, dark with photo */
.hero-page{
  position:relative;background:var(--ink);color:#fff;
  padding:144px 0 112px;overflow:hidden;
}
.hero-page::before{
  content:"";position:absolute;inset:0;
  background-image:var(--hero-img,none);background-size:cover;background-position:center 32%;
  opacity:.45;filter:saturate(.05) contrast(1.04) brightness(.55);
}
.hero-page::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(10,10,10,.92) 0%,rgba(10,10,10,.78) 50%,rgba(10,10,10,.55) 100%);
}
.hero-page > .wrap{position:relative;z-index:2}
.hero-page .eyebrow{color:rgba(255,255,255,.7)}
.hero-page .eyebrow::before{color:var(--red-on-dark)}
.hero-page h1{
  font-family:var(--display);font-weight:200;
  font-size:clamp(54px,7.2vw,112px);line-height:.96;letter-spacing:-.030em;
  color:#fff;max-width:1100px;hyphens:none;-webkit-hyphens:none;
}
.hero-page h1 em{font-style:italic;font-weight:300;font-family:var(--serif);color:#fff}
.hero-page .lede{margin-top:48px;color:rgba(255,255,255,.78);max-width:780px}
.hero-page .lede strong{color:#fff}@media(max-width:880px) {
.hero-page{padding:96px 0 80px}
}


.hero-page-stat{
  position:absolute;right:max(48px,calc((100vw - 1380px)/2 + 48px));bottom:64px;z-index:2;text-align:right;
}
.hero-page-stat .n{
  font-family:var(--display);font-weight:200;font-size:clamp(80px,10vw,180px);line-height:.85;letter-spacing:-.05em;color:var(--red-on-dark);
}
.hero-page-stat .lbl{
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.85);font-weight:500;margin-top:12px;
}@media(max-width:880px) {
.hero-page-stat{position:static;text-align:left;margin-top:64px;padding-left:0}
}


/* ================================================================
   SECTIONS — generous whitespace, no dividing lines
   ================================================================ */

section.s{padding:144px 0;position:relative}@media(max-width:880px) {
section.s{padding:96px 0}
}
@media(max-width:520px) {
section.s{padding:72px 0}
}


/* ================================================================
   FOCUS PILLARS — open layout, no card frames
   ================================================================ */

.focus-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:64px 56px;
}

/* ================================================================
   PARTNERS — bigger, dominant photos
   ================================================================ */

.partners-strip{padding:144px 0;background:var(--bg)}

/* ================================================================
   SECTORS — black, dominant blocks (Dr Nagel feedback)
   ================================================================ */

section.sectors{
  background:var(--ink);color:#fff;padding:160px 0;position:relative;overflow:hidden;
}

/* ================================================================
   PROCESS — five steps centered (Dr Nagel correction)
   ================================================================ */

.process{
  display:grid;grid-template-columns:repeat(5,1fr);gap:48px;
  margin-top:48px;
}

/* ================================================================
   TRUST RIBBON — cleaner, no separator lines
   ================================================================ */

.trust-ribbon{padding:96px 0;background:var(--bg-2)}

/* ================================================================
   PORTFOLIO — directory list (Apollo/KKR pattern)
   ================================================================ */

.ref-directory{
  list-style:none;padding:0;margin:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
}

/* ================================================================
   QUOTE
   ================================================================ */

.quote-block{display:grid;grid-template-columns:1fr 2fr;gap:96px;align-items:start}@media(max-width:980px) {
.quote-block{grid-template-columns:1fr;gap:32px}
}

.quote-block aside{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:500}
.quote-block aside .q{
  font-family:var(--serif);font-size:140px;line-height:.5;color:var(--red);font-weight:300;
  display:block;margin-bottom:8px;
}
.quote-block blockquote{
  font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,46px);line-height:1.22;letter-spacing:-.012em;
  color:var(--ink);max-width:980px;hyphens:none;-webkit-hyphens:none;font-style:italic;
}
.quote-block cite{display:block;margin-top:32px;font-style:normal;font-size:14px;color:var(--ink-2);font-weight:500;font-family:var(--sans)}
.quote-block cite span{color:var(--muted);font-weight:400}

/* ================================================================
   TEAM (management page) — same as partners-strip but in single page
   ================================================================ */

.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}

/* ================================================================
   AWARDS BAND — black, no border noise
   ================================================================ */

.awards{background:var(--ink);color:#fff;padding:128px 0}

/* ================================================================
   PERSPEKTIVEN — blog index without card chrome
   ================================================================ */

.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:64px 56px}@media(max-width:980px) {
.posts{grid-template-columns:repeat(2,1fr);gap:64px 40px}
}
@media(max-width:600px) {
.posts{grid-template-columns:1fr;gap:64px}
}

.post{
  display:flex;flex-direction:column;background:transparent;color:inherit;text-decoration:none;
}
.post .meta{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:18px;font-weight:500;display:flex;gap:12px;flex-wrap:wrap}
.post .meta .cat{color:var(--red);font-weight:600}
.post h3{
  font-family:var(--display);font-weight:300;font-size:28px;line-height:1.15;letter-spacing:-.022em;
  margin-bottom:16px;color:var(--ink);
}
.post p{font-size:15.5px;color:var(--muted);line-height:1.65;flex-grow:1}
.post .author{
  margin-top:28px;font-size:11.5px;letter-spacing:.10em;color:var(--ink-2);font-weight:500;
  display:flex;justify-content:space-between;align-items:baseline;
}
.post .author span{color:var(--muted);font-weight:400}

/* Press card — Blackstone style */
.post.press{}

/* Article body */
.article{max-width:780px;margin:0 auto;padding:96px 0}
.article .meta-row{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:32px;font-weight:500;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.article .meta-row .cat{color:var(--red);font-weight:600}
.article h1{
  font-family:var(--display);font-weight:200;font-size:clamp(40px,5.5vw,68px);line-height:1.05;letter-spacing:-.030em;
  color:var(--ink);margin-bottom:32px;
}
.article .lead{
  font-size:22px;line-height:1.55;color:var(--ink-2);margin-bottom:48px;font-weight:400;
}
.article h2{
  font-family:var(--display);font-weight:300;font-size:32px;line-height:1.15;letter-spacing:-.022em;
  color:var(--ink);margin:64px 0 20px;
}
.article h3{
  font-family:var(--display);font-weight:500;font-size:20px;line-height:1.3;letter-spacing:-.014em;
  color:var(--ink);margin:40px 0 14px;
}
.article p{font-size:18px;line-height:1.7;color:var(--ink-2);margin-bottom:24px}
.article p strong{color:var(--ink);font-weight:500}
.article p em{font-family:var(--serif);font-style:italic;color:var(--ink)}
.article ul,.article ol{margin:0 0 24px 24px;font-size:18px;line-height:1.7;color:var(--ink-2)}
.article li{margin-bottom:8px}
.article blockquote{
  font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.4;color:var(--ink);
  margin:48px 0;padding-left:24px;max-width:680px;border-left:2px solid var(--red);
}
.article .signoff{margin-top:48px;padding-top:32px;font-size:14px;color:var(--muted);font-style:italic}

.article .author-card{
  display:grid;grid-template-columns:96px 1fr;gap:28px;align-items:start;
  margin-top:64px;padding:32px 0 0;
}@media(max-width:520px) {
.article .author-card{grid-template-columns:80px 1fr;gap:20px}
}

.article .author-photo{width:96px;height:96px;border-radius:50%;overflow:hidden;background:var(--bg-3)}@media(max-width:520px) {
.article .author-photo{width:80px;height:80px}
}

.article .author-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(.9) contrast(1.04)}
.article .author-eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--red);font-weight:600;margin-bottom:6px}
.article .author-name{font-family:var(--display);font-weight:300;font-size:24px;line-height:1.15;letter-spacing:-.018em;color:var(--ink);margin-bottom:4px}
.article .author-role{font-size:14px;color:var(--muted);margin-bottom:14px}
.article .li-link{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);font-weight:600;margin-right:18px}
.article .li-link:hover{color:var(--ink)}
.article .author-link{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);font-weight:500}
.article .author-link:hover{color:var(--red)}

/* ================================================================
   CONTACT FORM — Submit Opportunity (Dr Nagel directive)
   ================================================================ */

.contact-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:96px;align-items:start}
.field{display:flex;flex-direction:column;gap:10px}
.field label{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:16px;color:var(--ink);font-weight:400;
  border:0;border-bottom:1px solid var(--line-2);background:transparent;padding:14px 0;
  transition:border-color .2s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--ink)}
.field textarea{resize:vertical;min-height:140px}
.field input[type="file"]{display:none}

/* ================================================================
   CTA BAND
   ================================================================ */

.cta-band{background:var(--ink);color:#fff;padding:128px 0 88px}

/* ================================================================
   FOOTER
   ================================================================ */

footer.foot{background:var(--ink);color:#fff;padding:0}
.foot-cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px;padding:64px 0}@media(max-width:880px) {
.foot-cols{grid-template-columns:1fr 1fr;gap:36px}
}
@media(max-width:520px) {
.foot-cols{grid-template-columns:1fr;gap:32px}
}

.foot-cols .col h3{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--red-on-dark);font-weight:600;margin-bottom:18px}
.foot-cols .col ul{list-style:none}
.foot-cols .col ul li{margin-bottom:10px}
.foot-cols .col ul a{font-size:14.5px;color:rgba(255,255,255,.75);transition:color .2s ease}
.foot-cols .col ul a:hover{color:#fff}
.foot-cols .col p{font-size:14px;color:rgba(255,255,255,.72);line-height:1.6;margin-bottom:14px}
.foot-cols .col p strong{color:#fff;font-weight:500}
.foot-cols .col .brand-mark{
  margin-bottom:24px;display:inline-block;
}
.foot-cols .col .brand-mark img{
  display:block;height:32px;width:auto;
}

.foot-base{
  padding:32px 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;
}
.foot-base .legal{font-size:11px;letter-spacing:.10em;text-transform:uppercase;color:rgba(255,255,255,.55);font-weight:500;display:flex;flex-wrap:wrap;gap:6px 28px;align-items:center}
.foot-base .legal .copy{display:inline-block;margin-right:10px}
.foot-base .legal a{color:rgba(255,255,255,.62);transition:color .2s ease;text-decoration:none}
.foot-base .legal a:hover{color:#fff}
.foot-base .lei{font-size:11px;letter-spacing:.10em;text-transform:uppercase;color:rgba(255,255,255,.55);font-weight:500}
.foot-base .lei b{color:rgba(255,255,255,.78);font-weight:600}

.foot-disclaimer{
  background:#000;padding:40px 0;font-size:12px;line-height:1.7;color:rgba(255,255,255,.50);font-weight:400;
}
.foot-disclaimer .wrap{max-width:1140px}
.foot-disclaimer p{margin-bottom:10px}
.foot-disclaimer p:last-child{margin-bottom:0}
.foot-disclaimer strong{color:rgba(255,255,255,.75);font-weight:500}

/* ================================================================
   REVEAL ANIMATIONS
   ================================================================ */

.reveal{opacity:0;transform:translateY(18px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)}

/* ================================================================
   UTILITIES
   ================================================================ */

.hide-mobile{display:initial}@media(max-width:880px) {
.hide-mobile{display:none}
}

.text-red{color:var(--red)}

/* ================================================================
   PAGE SECTIONS — adopted in 2026-05-02 platform-constructor rewrite
   Plain, institutional. No decorative flourishes. Reads on mobile.
   ================================================================ */
.section{padding:104px 0;border-top:1px solid var(--line)}
.section:first-of-type{border-top:none}
.section-alt{background:var(--bg-soft,#f7f6f4)}
.section-dark{background:#0a0a0a;color:#fff}
.section-dark h2,.section-dark h3{color:#fff}
.section-dark p{color:rgba(255,255,255,.78)}
.section-dark .more{color:var(--red)}
.section-dark a{color:#fff}@media(max-width:880px) {

  .section{padding:64px 0}

}


.three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}
.three-col article h3{font-family:var(--serif);font-size:24px;font-weight:500;letter-spacing:-.01em;margin-bottom:18px;color:var(--ink)}
.three-col article p{font-size:16px;line-height:1.62;color:var(--muted);margin-bottom:18px}
.three-col-dark article h3{color:#fff}
.three-col-dark article p{color:rgba(255,255,255,.78)}@media(max-width:880px) {

  .three-col{grid-template-columns:1fr;gap:48px}

}


.more{display:inline-block;font-size:13.5px;font-weight:500;letter-spacing:.04em;color:var(--red);border-bottom:1px solid currentColor;padding-bottom:2px;text-decoration:none;transition:color .2s ease}
.more:hover{color:var(--ink)}

.aphorism{padding:120px 0;background:#fafaf8;border-top:1px solid var(--line)}
.aphorism .wrap{text-align:center}
.aphorism p{font-family:var(--serif);font-size:clamp(28px,3.4vw,42px);line-height:1.35;font-weight:400;color:var(--ink);max-width:900px;margin:0 auto;letter-spacing:-.012em}
.aphorism em{font-style:italic;color:var(--red)}@media(max-width:880px) {

  .aphorism{padding:72px 0}

}


/* Article body for content pages (markt, methodik, disziplinen, etc) */
.article-body{max-width:780px;margin:0 auto}

.page-header{padding:96px 0 64px;border-bottom:1px solid var(--line)}
.page-header .wrap{max-width:880px;margin:0 auto}
.page-header h1{font-family:var(--serif);font-size:clamp(40px,5vw,68px);font-weight:500;line-height:1.05;letter-spacing:-.02em;color:var(--ink);margin:18px 0 0}
.page-header h1 em{font-style:italic;font-weight:300;color:var(--red)}@media(max-width:880px) {

  .page-header{padding:56px 0 40px}

}


.cta-block{padding:96px 0;border-top:1px solid var(--line);background:#fafaf8}
.cta-block .wrap{max-width:880px;text-align:center}
.cta-block h2{font-family:var(--serif);font-size:clamp(28px,3.2vw,40px);font-weight:500;line-height:1.25;letter-spacing:-.012em;margin-bottom:18px}
.cta-block p{font-size:17px;line-height:1.6;color:var(--muted);max-width:600px;margin:0 auto 32px}
.cta-block .hero-cta-row{justify-content:center}

/* ================================================================
   2026-05-02 BLACKROCK-AESTHETIC SWEEP
   - Uniform page-header height across all sub-pages
   - Soberer, more institutional tone (less editorial swagger)
   - Press wordmark styling for /nachrichten outlet cards
   - Mobile/tablet polish
   - Inspired by blackrock.com/corporate: generous whitespace,
     restrained color, single-weight typography, no decorative
     flourishes. The motto is the only italic accent.
   ================================================================ */

/* Uniform page-header — every internal page hero is the same height,
   readable at desktop AND tablet AND mobile. Aligns visual rhythm. */
.page-header{
  padding:120px 0 80px;
  border-bottom:1px solid var(--line);
  background:#fff;
  min-height:340px;
  display:flex;
  align-items:flex-end;
}
.page-header .wrap{max-width:1080px;margin:0 auto;padding-left:48px;padding-right:48px}
.page-header h1{
  font-family:var(--serif);
  font-size:clamp(36px,4.6vw,60px);
  font-weight:500;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--ink);
  margin:18px 0 0;
  max-width:920px;
}
.page-header h1 em{font-style:italic;font-weight:300;color:var(--red)}@media(max-width:880px) {

  .page-header{padding:80px 0 48px;min-height:240px}
  .page-header .wrap{padding-left:24px;padding-right:24px}

}


/* Same height treatment for the legacy .hero-page used by perspektiven,
   nachrichten, presse, kontakt etc. — uniform across all sub-pages. */
.hero-page,
.s.hero-page{
  padding:120px 0 80px !important;
  min-height:340px !important;
}@media(max-width:880px) {

  .hero-page,
  .s.hero-page{
    padding:80px 0 48px !important;
    min-height:240px !important;
  }

}


/* ============== PRESS WORDMARKS ==============
   The .outlet div on /nachrichten cards renders the publication name
   as a typographic wordmark. Without these styles it was an unstyled
   bare div — that's the "missing logos" Dr. Nagel saw. */
.post.press{
  display:block;
  padding:36px 32px 32px;
  background:#fff;
  border:1px solid var(--line);
  border-top:3px solid var(--red);
  text-decoration:none;
  color:var(--ink);
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
  position:relative;
}

/* The .posts grid for /nachrichten — institutional 2-up on tablet,
   3-up on desktop, 1-up on mobile */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}@media(max-width:1080px) {
.posts{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px) {
.posts{grid-template-columns:1fr}
}


/* ============== BLACKROCK INSTITUTIONAL TONE ==============
   Across the new sub-pages, dial down the editorial color saturation.
   The red is reserved for accents, not section labels. */
.section{padding:96px 0;border-top:1px solid var(--line)}@media(max-width:1080px) {
.section{padding:72px 0}
}
@media(max-width:680px) {
.section{padding:56px 0}
}


.aphorism{padding:96px 0;background:#fafaf8;border-top:1px solid var(--line)}
.aphorism p{
  font-family:var(--serif);
  font-size:clamp(24px,2.8vw,36px);
  line-height:1.4;
  font-weight:400;
  color:var(--ink);
  max-width:780px;
}@media(max-width:680px) {
.aphorism{padding:64px 0}
}


/* Article body: tighten typography for institutional read */
.article-body{max-width:720px}

/* Mobile sweep: ensure the new pages render perfectly on phones/tablets */
@media(max-width:880px){
  .article-body{max-width:none;padding:0 4px}
  .article-body h2{margin:40px 0 16px}
  .article-body h3{margin:28px 0 10px}
  .breadcrumb{font-size:11px}
}

/* CTA block: institutional, restrained */
.cta-block{padding:80px 0;background:#fafaf8;border-top:1px solid var(--line)}
.cta-block h2{
  font-family:var(--serif);
  font-size:clamp(24px,2.6vw,32px);
  font-weight:500;
  margin-bottom:14px;
}@media(max-width:680px) {
.cta-block{padding:56px 0}
}


/* The breadcrumb bar — small, sober, institutional */
.breadcrumb{
  display:block;
  margin-bottom:24px;
  padding-bottom:16px;
  border-bottom:1px solid var(--line);
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted);
}

/* Three-col on homepage: institutional spacing */
.three-col{gap:64px}@media(max-width:1080px) {
.three-col{gap:48px}
}
@media(max-width:880px) {
.three-col{gap:40px}
}


/* Hero CTA row tightening */
.hero-cta-row{margin-top:40px;gap:12px}
.hero-cta-row .btn{font-size:14px;padding:14px 28px}


/* ============== DATA RIBBON (BlackRock-style) ==============
   Single row of stat counters between hero and content. Sober,
   institutional, no decoration. Stacks vertically on mobile. */
.data-ribbon{
  background:#0a0a0a;
  color:#fff;
  padding:48px 0;
  border-bottom:1px solid #1a1a1a;
}
.data-ribbon-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:48px;
  align-items:end;
}
.data-ribbon .stat-num{
  font-family:var(--serif);
  font-size:clamp(36px,4vw,56px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.02em;
  color:#fff;
}
.data-ribbon .stat-lbl{
  font-family:'Inter',system-ui,sans-serif;
  font-size:12px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(255,255,255,.65);
  margin-top:14px;
  line-height:1.4;
}@media(max-width:1080px) {

  .data-ribbon-grid{grid-template-columns:repeat(2,1fr);gap:36px}

}
@media(max-width:680px) {

  .data-ribbon{padding:36px 0}
  .data-ribbon-grid{grid-template-columns:repeat(2,1fr);gap:28px}
  .data-ribbon .stat-num{font-size:32px}
  .data-ribbon .stat-lbl{font-size:10.5px;margin-top:8px}

}


/* Harmonize the perspektiven .article first-section to match .page-header height */
.article{padding:120px 0 80px}@media(max-width:880px) {
.article{padding:80px 0 48px}
}


/* ============== MARKET TABLE ==============
   BlackRock-style three-row data table for the "Drei Märkte" homepage
   section. Replaces the three-card grid with a tighter, denser, more
   institutional layout. */
.market-table{
  border-top:2px solid var(--ink);
}
.market-row{
  display:grid;
  grid-template-columns:120px 1fr 2fr;
  gap:32px;
  padding:32px 0;
  border-bottom:1px solid var(--line);
  align-items:baseline;
}
.market-region{
  font-family:'Inter',system-ui,sans-serif;
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--ink);
}
.market-stat{
  font-family:var(--serif);
  font-size:18px;
  font-weight:400;
  line-height:1.5;
  color:var(--ink);
}
.market-stat strong{
  font-weight:600;
  color:var(--ink);
}
.market-detail{
  font-size:14.5px;
  line-height:1.65;
  color:var(--muted);
}@media(max-width:1080px) {

  .market-row{grid-template-columns:100px 1fr;gap:20px}
  .market-detail{grid-column:1/-1;margin-top:6px}

}
@media(max-width:680px) {

  .market-row{grid-template-columns:1fr;gap:8px;padding:24px 0}
  .market-region{font-size:11px}

}


/* page-header refinement: ensure breadcrumb sits at top of frame, not
   crashing into H1 when min-height kicks in. Switch align to space-between
   for a more BlackRock-feel: small label up top, big title below. */
.page-header{align-items:stretch}
.page-header .wrap{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  width:100%;
}
.page-header h1{margin-top:48px}@media(max-width:680px) {

  .page-header h1{margin-top:24px}

}


/* ================================================================
   2026-05-02 BLACKROCK-GRADE REDESIGN — HERO + SECTIONS
   Replaces the awkward two-column .hero-bk with a clean, tall,
   text-led hero followed by a full-bleed photo. Like blackrock.com.
   No editorial swagger. Generous whitespace. Single dominant
   typographic accent.
   ================================================================ */

/* === TEXT HERO === */
.hero-text{
  padding:120px 0 96px;
  background:#fff;
  border-bottom:1px solid var(--line);
}

/* === FULL-BLEED PHOTO BAND === */
.hero-image{
  margin:0;
  padding:0;
  background:#000;
  position:relative;
}

/* === SECTION EYEBROWS (reusable, BlackRock-style) === */
.section-eyebrow{
  font-family:'Inter',system-ui,sans-serif;
  font-size:12px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.2em;
  color:var(--red);
  margin:0 0 20px;
}
.section-h2{
  font-family:var(--serif);
  font-size:clamp(32px,4vw,52px);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.018em;
  color:var(--ink);
  margin:0;
  max-width:920px;
}
.section-h2 em{font-style:italic;font-weight:300}
.section-dark .section-eyebrow{color:rgba(255,255,255,.6)}
.section-dark .section-h2{color:#fff}@media(max-width:880px) {

  .section-eyebrow{font-size:10.5px;letter-spacing:.18em;margin-bottom:14px}

}


/* === SECTION DEFAULT (refined) === */
.section{padding:120px 0;border-top:1px solid var(--line)}
.section:first-of-type{border-top:none}@media(max-width:1080px) {
.section{padding:88px 0}
}
@media(max-width:680px) {
.section{padding:64px 0}
}


/* Hide the OLD .hero-bk if it ever lingers from cache or rollback */
.hero-bk{display:none!important}

/* === THREE-COL CARDS (BlackRock-grade) === */
.three-col{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:48px;
  margin-top:56px;
  align-items:stretch;
}
.three-col article{
  position:relative;
  padding:0;
  display:flex;
  flex-direction:column;
}
.three-col article h3{
  font-family:var(--serif);
  font-size:26px;
  font-weight:500;
  letter-spacing:-.012em;
  color:var(--ink);
  margin:0 0 20px;
  padding-top:20px;
  border-top:2px solid var(--red);
  line-height:1.2;
}
.three-col article .role-tag{
  font-family:'Inter',system-ui,sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 -10px;
  padding:0;
  flex:0 0 auto;
}
.three-col article .role-tag + h3{margin-top:14px}
.three-col article p{
  font-size:16px;
  line-height:1.65;
  color:var(--muted);
  margin:0 0 24px;
  flex:1 1 auto;
}
.three-col article .more{
  margin-top:auto;
  align-self:flex-start;
}
.three-col-dark article h3{color:#fff;border-top-color:var(--red)}
.three-col-dark article p{color:rgba(255,255,255,.78)}@media(max-width:1080px) {
.three-col{gap:36px}
}
@media(max-width:880px) {

  .three-col{grid-template-columns:1fr;gap:40px;margin-top:40px}

}


/* === DATA RIBBON (refined for BlackRock) === */
.data-ribbon{
  background:#0a0a0a;
  color:#fff;
  padding:64px 0;
  border-bottom:none;
}
.data-ribbon .wrap{max-width:1200px;margin:0 auto;padding:0 48px}
.data-ribbon-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:48px;
  align-items:start;
  justify-items:center;
}
.data-ribbon .stat{
  position:relative;
  padding-top:24px;
  border-top:3px solid var(--red);
  width:100%;
  max-width:240px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.data-ribbon .stat-num{
  font-family:var(--serif);
  font-size:clamp(48px,4.4vw,64px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.024em;
  color:#fff;
  margin-bottom:14px;
  text-align:center;
}
.data-ribbon .stat-lbl{
  font-family:'Inter',system-ui,sans-serif;
  font-size:12px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:rgba(255,255,255,.6);
  line-height:1.5;
  text-align:center;
}@media(max-width:1080px) {

  .data-ribbon-grid{grid-template-columns:repeat(2,1fr);gap:40px}

}
@media(max-width:680px) {

  .data-ribbon{padding:48px 0}
  .data-ribbon .wrap{padding:0 24px}
  .data-ribbon-grid{grid-template-columns:repeat(2,1fr);gap:32px}
  .data-ribbon .stat-num{font-size:40px}
  .data-ribbon .stat-lbl{font-size:10.5px;letter-spacing:.14em}

}


/* Linked stat: align identically with non-link stats. */
.data-ribbon a.stat,
.data-ribbon a.stat-link{
  text-decoration:none;
  color:inherit;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  text-align:center !important;
  width:100% !important;
  max-width:240px !important;
  padding-top:24px !important;
  border-top:3px solid var(--red) !important;
  transition:border-color .25s ease, color .2s ease;
  font:inherit;
}
.data-ribbon a.stat-link .stat-num{
  margin-bottom:14px !important;
  text-align:center !important;
  color:#fff !important;
}
.data-ribbon a.stat-link .stat-lbl{
  text-align:center !important;
  color:rgba(255,255,255,.6) !important;
  transition:color .2s ease;
}
.data-ribbon a.stat-link:hover .stat-lbl{color:#fff !important}
.data-ribbon a.stat-link:hover{border-top-color:#ff0000 !important}

/* === MARKET TABLE (refined) === */
.market-table{border-top:2px solid var(--ink);margin-top:48px}
.market-row{
  display:grid;
  grid-template-columns:140px 1.2fr 2fr;
  gap:48px;
  padding:36px 0;
  border-bottom:1px solid var(--line);
  align-items:start;
}
.market-region{
  font-family:'Inter',system-ui,sans-serif;
  font-size:14px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--ink);
  padding-top:8px;
}
.market-stat{
  font-family:var(--serif);
  font-size:20px;
  font-weight:400;
  line-height:1.45;
  color:var(--ink);
}
.market-stat strong{font-weight:600}
.market-detail{
  font-size:15px;
  line-height:1.65;
  color:var(--muted);
  padding-top:4px;
}@media(max-width:1080px) {

  .market-row{grid-template-columns:120px 1fr;gap:24px}
  .market-detail{grid-column:1/-1;margin-top:12px}

}
@media(max-width:680px) {

  .market-row{grid-template-columns:1fr;gap:10px;padding:28px 0}

}


/* === SECTION wrap consistency === */
.section .wrap{max-width:1200px;margin:0 auto;padding:0 48px}@media(max-width:880px) {
.section .wrap{padding:0 24px}
}


/* === HEADER (top bar) refinement to match BlackRock === */
header.top{border-bottom:1px solid var(--line);background:#fff}
header.top .bar{padding:24px 48px;max-width:none}@media(max-width:880px) {
header.top .bar{padding:16px 24px}
}

.brand{display:inline-flex;align-items:center;text-decoration:none;line-height:1}
.brand img{display:block;height:30px;width:auto;max-width:none;aspect-ratio:1600/171}
nav.primary{display:flex;align-items:center;gap:32px}
nav.primary > a,
nav.primary .nav-group > .nav-trigger{
  font-family:'Inter',system-ui,sans-serif;
  font-size:14px;
  font-weight:500;
  color:var(--ink);
  text-decoration:none;
  letter-spacing:.005em;
  position:relative;
  padding:8px 0;
  white-space:nowrap;
  background:none;border:0;cursor:pointer;
}
nav.primary > a:hover,
nav.primary .nav-group > .nav-trigger:hover{color:var(--red)}
nav.primary > a.active{color:var(--red)}
.lang{display:flex;align-items:center;gap:0;font-family:'Inter',system-ui,sans-serif;font-size:12px;letter-spacing:.06em}
.lang a, .lang span{color:var(--muted);text-decoration:none;padding:0 6px;font-weight:500}
.lang .active{color:var(--ink);font-weight:600}
.lang .sep{color:var(--line);padding:0}
.lang .cta{
  display:inline-flex;
  align-items:center;
  margin-left:24px;
  padding:10px 20px;
  background:var(--ink);
  color:#fff;
  font-size:13px;
  font-weight:600;
  letter-spacing:.02em;
  text-decoration:none;
  border-radius:0;
  transition:background .2s ease;
}
.lang .cta:hover{background:var(--red);color:#fff}@media(max-width:1140px) {
nav.primary{display:none}
}
@media(max-width:680px) {
.lang .cta{display:none}.lang{margin-right:8px}
}


/* CTA / button — hard red as the primary, brutalist square edge. */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 32px;
  background:var(--red);
  color:#fff;
  font-family:'Inter',system-ui,sans-serif;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  text-decoration:none;
  border:1px solid var(--red);
  border-radius:0;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.btn:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--red);color:#fff;border-color:var(--red)}
.btn .arrow{display:inline-block;transition:transform .2s ease}
.btn:hover .arrow{transform:translateX(3px)}

/* Force the same hard red on EVERY accent across the site.
   Single hex, no darker/wine variants, no font-weight 300 wash-out. */
.hero h1 em,
.hero-h1 em,
.hero-text .hero-h1 em,
.hero-split-h1 em,
.page-header h1 em,
.section-h2 em,
.section-head h2 em,
.aphorism em,
.aphorism p em,
.cta-band h2 em,
.article h1 em,
.article h2 em,
.pullquote em,
.pull-quote em,
.text-red,
.dot{
  color:#ff0000 !important;
  font-style:italic;
  font-weight:500 !important;
}
.dot{font-style:normal !important}
.section-dark .section-h2 em,
.section-dark h2 em,
.section-dark .h2 em{color:#ff0000 !important}

/* Red accent on any element labelled red-on-dark or wine-tone. */
.section-dark .more,
.three-col-dark .more,
.cta-band .more,
.section-eyebrow,
.hero-eyebrow,
.hero-kicker{
  color:#cc0000 !important;
}

/* Section intro paragraph below H2 */
.section-intro{
  font-family:var(--serif);
  font-size:20px;
  line-height:1.55;
  color:var(--muted);
  margin:24px 0 0;
  max-width:720px;
}

/* APHORISM (refined) */
.aphorism{padding:120px 0;background:#fafaf8;border-top:1px solid var(--line);text-align:center}
.aphorism p{
  font-family:var(--serif);
  font-size:clamp(28px,3vw,40px);
  line-height:1.4;
  font-weight:400;
  color:var(--ink);
  max-width:880px;
  margin:0 auto;
  letter-spacing:-.014em;
}
.aphorism em{font-style:italic;color:var(--muted);font-weight:400}@media(max-width:680px) {
.aphorism{padding:72px 0}
}


/* CTA-block (refined) */
.cta-block{padding:96px 0;background:#fafaf8;border-top:1px solid var(--line);text-align:center}
.cta-block .wrap{max-width:760px;padding:0 24px}
.cta-block h2{
  font-family:var(--serif);
  font-size:clamp(28px,3.2vw,40px);
  font-weight:400;
  letter-spacing:-.014em;
  margin:0 0 18px;
  line-height:1.2;
  color:var(--ink);
}
.cta-block p{
  font-size:17px;
  line-height:1.6;
  color:var(--muted);
  max-width:560px;
  margin:0 auto 32px;
}
.cta-block .hero-cta-row{justify-content:center;gap:14px}@media(max-width:680px) {
.cta-block{padding:64px 0}
}



/* === PAGE-HEADER refinement (matches new hero pattern) === */
.page-header{
  padding:96px 0 64px;
  background:#fff;
  border-bottom:1px solid var(--line);
  min-height:auto;
  display:block;
}
.page-header .wrap{
  max-width:1200px;
  margin:0 auto;
  padding:0 48px;
  display:block;
}
.page-header h1{
  font-family:var(--serif);
  font-size:clamp(40px,5.5vw,80px);
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.022em;
  color:var(--ink);
  margin:0;
  max-width:1100px;
}
.page-header h1 em{font-style:italic;font-weight:300;color:var(--ink)}@media(max-width:880px) {

  .page-header{padding:48px 0 36px}
  .page-header .wrap{padding:0 24px}

}


/* article-body refinement to match BlackRock institutional read */
.article-body{
  max-width:760px;
  margin:0 auto;
  padding:0;
}

/* === FOOTER refinement to match BlackRock === */
footer.foot{
  background:#0a0a0a;
  color:rgba(255,255,255,.7);
  padding:80px 0 0;
  margin-top:0;
  border-top:none;
}
footer.foot .wrap{max-width:1200px;margin:0 auto;padding:0 48px}
footer.foot .foot-cols{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:64px;
  padding-bottom:64px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
footer.foot .col{}
footer.foot .brand-mark{
  display:inline-block;
  margin-bottom:24px;
}
footer.foot .brand-mark img{
  display:block;height:32px;width:auto;
}
footer.foot .col p{
  font-size:14px;
  line-height:1.6;
  color:rgba(255,255,255,.65);
  margin:0 0 18px;
}
footer.foot .col strong{color:#fff;font-weight:600}
footer.foot .col h3{
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:#fff;
  margin:0 0 24px;
}
footer.foot .col ul{list-style:none;padding:0;margin:0}
footer.foot .col li{margin-bottom:10px;font-size:14px}
footer.foot .col a{
  color:rgba(255,255,255,.7);
  text-decoration:none;
  transition:color .15s ease;
}
footer.foot .col a:hover{color:#fff}
footer.foot .foot-base{
  padding:24px 0;
}
footer.foot .legal{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  font-size:12.5px;
  color:rgba(255,255,255,.5);
  align-items:center;
}
footer.foot .legal a{color:rgba(255,255,255,.5);text-decoration:none}
footer.foot .legal a:hover{color:#fff}
footer.foot .copy{margin-right:auto}
footer.foot .foot-disclaimer{
  border-top:1px solid rgba(255,255,255,.08);
  padding:32px 0;
}
footer.foot .foot-disclaimer p{
  font-size:11.5px;
  line-height:1.6;
  color:rgba(255,255,255,.42);
  margin:0 0 12px;
  max-width:none;
}
footer.foot .foot-disclaimer p:last-child{margin-bottom:0}@media(max-width:1080px) {

  footer.foot .foot-cols{grid-template-columns:1fr 1fr;gap:48px}

}
@media(max-width:680px) {

  footer.foot{padding:48px 0 0}
  footer.foot .wrap{padding:0 24px}
  footer.foot .foot-cols{grid-template-columns:1fr;gap:32px;padding-bottom:32px}
  footer.foot .legal{font-size:11px;gap:14px}

}


/* === BRAND override correction (logo prominence) === */
.brand{
  font-size:36px !important;
  font-weight:800 !important;
  letter-spacing:-.028em !important;
  text-transform:uppercase;
  font-family:'Inter',system-ui,sans-serif !important;
  color:var(--ink) !important;
  text-decoration:none !important;
  line-height:1 !important;
}
.brand .dot{
  font-size:1em !important;
  color:var(--red) !important;
  margin-left:3px !important;
  font-weight:800 !important;
}
.brand-mark{
  font-size:32px !important;
  font-weight:800 !important;
  letter-spacing:-.026em !important;
  text-transform:uppercase;
  color:#fff !important;
  line-height:1 !important;
}
.brand-mark .dot{color:var(--red) !important; font-weight:800 !important}@media(max-width:680px) {

  .brand{font-size:30px !important}
  .brand-mark{font-size:28px !important}

}
@media(max-width:380px) {

  .brand{font-size:26px !important;letter-spacing:-.024em !important}

}


/* === PERSPEKTIVEN ARTICLE refinement to match BlackRock aesthetic === */
/* Override the legacy .article h1 (Inter sans 200) with serif treatment
   matching .page-header h1 — keeps perspektiven articles consistent with
   the new institutional voice. */
.article h1{
  font-family:var(--serif)!important;
  font-weight:400!important;
  font-size:clamp(36px,4.6vw,60px)!important;
  line-height:1.1!important;
  letter-spacing:-.018em!important;
  color:var(--ink)!important;
  margin-bottom:40px!important;
}
.article .meta-row{
  font-family:'Inter',system-ui,sans-serif;
  font-size:11.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:32px;
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  align-items:center;
}
.article .meta-row .cat{color:var(--red);font-weight:700}
.article .lead{
  font-family:var(--serif);
  font-size:clamp(20px,2vw,26px);
  font-weight:400;
  line-height:1.5;
  color:var(--ink);
  margin-bottom:48px;
  letter-spacing:-.005em;
}
.article h2{
  font-family:var(--serif);
  font-size:clamp(28px,3.4vw,40px);
  font-weight:400;
  line-height:1.18;
  letter-spacing:-.014em;
  margin:64px 0 24px;
  color:var(--ink);
}
.article h3{
  font-family:'Inter',system-ui,sans-serif;
  font-size:18px;
  font-weight:600;
  letter-spacing:-.005em;
  margin:36px 0 14px;
  color:var(--ink);
}
.article p{
  font-size:17px;
  line-height:1.72;
  color:var(--ink);
  margin-bottom:22px;
}
.article ul, .article ol{
  font-size:17px;
  line-height:1.72;
  margin:0 0 28px 24px;
}
.article blockquote{
  border-left:3px solid var(--red);
  padding:8px 0 8px 24px;
  margin:36px 0;
  font-family:var(--serif);
  font-style:italic;
  font-size:21px;
  line-height:1.5;
  color:var(--ink);
}

/* Management partner pages also use .article — same refinement applies */
@media(max-width:880px){
  .article{padding:48px 0 36px}
  .article h1{font-size:32px!important}
  .article .lead{font-size:17px;margin-bottom:32px}
  .article h2{margin:40px 0 16px}
}

/* === PARTNER CARDS (BlackRock-style executive bio cards) === */
.partner-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:80px;
  max-width:1100px;
  margin:0 auto;
}

/* ================================================================
   HERO SALES VARIANT — additions only, no overrides.
   Tight deck replacing the editorial lede. XL CTA. Inline secondary.
   Trigger-words strip below the portrait. Action-first mobile drawer.
   ================================================================ */

.hero-text .hero-deck-tight{
  font-family:var(--serif);
  font-size:clamp(19px,1.7vw,22px);
  font-weight:400;
  line-height:1.45;
  color:var(--ink);
  max-width:680px;
  margin:0 0 40px;
}

/* Trigger-words strip below the portrait band. SEO + recognition. */
.trigger-strip{
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:20px 0;
}

/* ================================================================
   ACTION-FIRST MOBILE DRAWER
   Replaces the previous 8-numeral display list. Conversion-ordered:
   primary action -> direct contact -> nav -> language/sites.
   ================================================================ */

.drawer .drawer-hero{
  display:block !important;
  background:var(--red);
  color:#fff !important;
  padding:24px 24px 26px !important;
  margin:0 0 4px !important;
  position:relative;
  font-family:var(--serif) !important;
  font-size:32px !important;
  font-weight:400 !important;
  line-height:1.08 !important;
  letter-spacing:-.018em !important;
  text-decoration:none !important;
}
.drawer .drawer-hero .dh-lbl{
  display:block;
  font-family:var(--serif);
  font-weight:400;
  color:#fff;
  font-size:30px;
  letter-spacing:-.018em;
  line-height:1.08;
}
.drawer .drawer-hero .dh-sub{
  display:block;
  margin-top:10px;
  font-family:'Inter',system-ui,sans-serif;
  font-size:13px;
  font-weight:500;
  letter-spacing:.01em;
  color:rgba(255,255,255,.82);
  line-height:1.4;
}
.drawer .drawer-hero .dh-arrow{
  position:absolute;
  right:24px;
  top:24px;
  font-family:'Inter',system-ui,sans-serif;
  font-size:24px;
  color:#fff;
  opacity:.9;
}

.drawer .drawer-direct{
  display:flex;
  flex-direction:column;
  border-top:1px solid var(--line);
  margin-top:8px;
}
.drawer .drawer-direct .dd-row{
  display:flex !important;
  flex-direction:row !important;
  justify-content:space-between !important;
  align-items:baseline !important;
  padding:18px 0 !important;
  border-bottom:1px solid var(--line) !important;
  font-family:'Inter',system-ui,sans-serif !important;
  font-size:14px !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  color:var(--ink) !important;
  min-height:48px;
  text-decoration:none !important;
  /* Reset button-default styling — the visible-phone sweep turned
     <a class="dd-row"> into <button class="dd-row">. Without these,
     browsers paint default button background/border/font. */
  background:transparent !important;
  width:100% !important;
  cursor:pointer !important;
  text-align:left !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
.drawer .drawer-direct .dd-k{
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--red);
}
.drawer .drawer-direct .dd-v{
  font-family:'JetBrains Mono','SF Mono',ui-monospace,monospace;
  font-size:13px;
  font-weight:500;
  color:var(--ink);
  text-align:right;
  letter-spacing:0;
}

/* ============================================================
   Mobile drawer — accordion navigation
   ============================================================ */
.drawer .drawer-nav{
  display:flex;
  flex-direction:column;
  margin-top:24px;
  border-top:1px solid var(--line);
}
.drawer .dnav-group{
  border-bottom:1px solid var(--line);
}
.drawer .dnav-trigger{
  font-family:var(--serif);
  font-size:19px;
  font-weight:500;
  letter-spacing:-.012em;
  color:var(--ink);
  padding:18px 4px;
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.drawer .dnav-trigger::-webkit-details-marker{display:none}
.drawer .dnav-chev{
  width:10px;
  height:10px;
  border-right:1.5px solid var(--ink);
  border-bottom:1.5px solid var(--ink);
  transform:rotate(45deg);
  transition:transform .2s ease;
  margin-right:4px;
}
.drawer .dnav-group[open] > .dnav-trigger .dnav-chev{
  transform:rotate(-135deg);
  margin-top:6px;
}
.drawer .dnav-group[open] > .dnav-trigger{
  color:var(--red);
}
.drawer .dnav-panel{
  padding:4px 0 18px 4px;
  display:flex;
  flex-direction:column;
}
.drawer .dnav-sublabel{
  font-family:'Inter',system-ui,sans-serif;
  font-size:10.5px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  margin:14px 0 6px;
  padding:0;
}
.drawer .dnav-sublabel:first-child{margin-top:4px}
.drawer .dnav-link{
  font-family:var(--serif) !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.3 !important;
  color:var(--ink) !important;
  padding:11px 0 11px 14px !important;
  text-decoration:none !important;
  display:block !important;
  border-bottom:none !important;
  border-left:2px solid transparent;
  min-height:44px;
  transition:border-color .15s ease, color .15s ease;
}
.drawer .dnav-link:hover,
.drawer .dnav-link:active,
.drawer .dnav-link:focus{
  color:var(--red) !important;
  border-left-color:var(--red);
}
.drawer .dnav-direct{
  font-family:var(--serif) !important;
  font-size:19px !important;
  font-weight:500 !important;
  letter-spacing:-.012em !important;
  color:var(--ink) !important;
  padding:18px 4px !important;
  text-decoration:none !important;
  border-bottom:1px solid var(--line);
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  min-height:48px;
}
.drawer .dnav-direct:hover,
.drawer .dnav-direct:active,
.drawer .dnav-direct:focus{
  color:var(--red) !important;
}
.drawer .dnav-arrow{
  font-size:18px;
  color:var(--muted);
  margin-right:4px;
  transition:transform .15s ease;
}
.drawer .dnav-direct:hover .dnav-arrow{
  transform:translateX(3px);
  color:var(--red);
}

.drawer .drawer-meta{
  margin-top:28px;
  padding-top:22px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--muted);
}
.drawer .drawer-meta .dm-lang{
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.drawer .drawer-meta .dm-lang .active{
  color:var(--ink);
  font-weight:700;
  position:relative;
  padding:6px 10px;
  background:var(--ink);
  color:#fff;
  border-radius:2px;
}
.drawer .drawer-meta .dm-lang a{
  color:var(--muted);
  text-decoration:none;
  padding:6px 10px;
  display:inline-block;
  font-size:12px;
  font-family:'Inter',system-ui,sans-serif;
  font-weight:600;
  border:1px solid var(--line);
  border-radius:2px;
  transition:color .15s ease,border-color .15s ease;
}
.drawer .drawer-meta .dm-lang a:hover,
.drawer .drawer-meta .dm-lang a:active{
  color:var(--ink);
  border-color:var(--ink);
}
.drawer .drawer-meta .dm-sites{color:var(--muted);font-size:10px}@media(max-width:480px) {

  .drawer .drawer-hero{padding:22px 20px !important}
  .drawer .drawer-hero .dh-lbl{font-size:26px}
  .drawer .drawer-hero .dh-arrow{right:20px;top:22px;font-size:22px}

}


/* ================================================================
   FORM CONSENT + SUBMIT — minimal additions for /sondersituation-einreichen
   ================================================================ */
.submit-form .consent{
  display:flex;
  gap:14px;
  align-items:flex-start;
  font-family:'Inter',system-ui,sans-serif;
  font-size:13px;
  line-height:1.5;
  color:var(--muted);
  cursor:pointer;
}
.submit-form .consent input[type="checkbox"]{
  width:18px;height:18px;min-width:18px;
  margin-top:3px;
  accent-color:var(--red);
}
.submit-form .submit-row{margin-top:8px}

/* ================================================================
   APHORISM — pull-quote band used by index, investitionsthese, abgrenzung,
   plattformlogik, sondersituation. The legacy class lives but lacks a
   centred treatment here.
   ================================================================ */
.aphorism{
  background:#0a0a0a;
  color:#fff;
  padding:120px 0;
  text-align:center;
}
.aphorism .wrap{max-width:1080px;margin:0 auto;padding:0 48px}
.aphorism p{
  font-family:var(--serif);
  font-size:clamp(28px,3.6vw,48px);
  font-weight:400;
  line-height:1.18;
  letter-spacing:-.012em;
  color:#fff;
  margin:0;
}
.aphorism p em{font-style:italic;font-weight:300;color:rgba(255,255,255,.78)}@media(max-width:880px) {

  .aphorism{padding:72px 0}
  .aphorism .wrap{padding:0 24px}

}


/* ================================================================
   HERO-SPLIT — BlackRock-grade homepage hero. Self-contained.
   Desktop: 50/50 split, content-driven height. Photo on right.
   Mobile: photo hidden. Pure typographic hero, fits one viewport.
   ================================================================ */

.hero-split{
  display:grid;
  grid-template-columns:1.2fr 0.8fr;
  align-items:stretch;
  background:#fff;
  border-bottom:1px solid var(--line);
  min-height:560px;
  max-height:680px;
}

/* TEXT SIDE */
.hero-split-text{
  display:flex;
  align-items:center;
  padding:48px 56px 48px max(48px, calc((100vw - 1380px)/2 + 48px));
  background:#fff;
}
.hero-split-text-inner{
  max-width:560px;
  width:100%;
}
.hero-kicker{
  font-family:'Inter',system-ui,sans-serif;
  font-size:12px;
  font-weight:600;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:var(--red);
  margin:0 0 28px;
  line-height:1.2;
}
.hero-split-h1{
  font-family:var(--serif);
  font-size:clamp(38px,4.6vw,64px);
  font-weight:400;
  line-height:1.06;
  letter-spacing:-.022em;
  color:var(--ink);
  margin:0 0 28px;
}
.hero-split-h1 em{
  font-style:italic;
  font-weight:500;
  color:var(--red);
}
.hero-split-dek{
  font-family:var(--serif);
  font-size:clamp(17px,1.4vw,20px);
  font-weight:400;
  line-height:1.45;
  color:var(--muted);
  margin:0 0 36px;
  max-width:480px;
}
.hero-split-cta{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--red);
  color:#fff !important;
  padding:0 30px;
  height:60px;
  font-family:'Inter',system-ui,sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  border:1px solid var(--red);
  text-decoration:none;
  transition:background .2s ease, border-color .2s ease;
}
.hero-split-cta .hsc-chev{
  color:#fff;
  font-size:20px;
  font-weight:700;
  line-height:1;
  display:inline-block;
  transform:translateY(-1px);
}
.hero-split-cta:hover{
  background:var(--ink);
  border-color:var(--ink);
}

/* PHOTO SIDE */
.hero-split-photo{
  position:relative;
  background:#0a0a0a;
  overflow:hidden;
}
.hero-split-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 28%;
  display:block;
  filter:saturate(.9) contrast(1.05);
}
.hero-split-photo::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 60%,rgba(0,0,0,.55) 100%);
  pointer-events:none;
}
.hero-split-caption{
  position:absolute;
  left:32px;
  bottom:32px;
  color:#fff;
  font-family:'Inter',system-ui,sans-serif;
  z-index:2;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.hero-split-caption .hsp-line-1{
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
}
.hero-split-caption .hsp-suffix{
  opacity:.7;
  font-weight:400;
  margin-left:4px;
}
.hero-split-caption .hsp-line-2{
  font-size:11px;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.78);
}

/* TABLET — keep split, narrower text gutter */
@media(max-width:1180px){
  .hero-split-text{padding:48px 40px 48px max(32px, calc((100vw - 1080px)/2 + 32px))}
  .hero-split-h1{font-size:clamp(34px,4.4vw,52px)}
  .hero-split-dek{font-size:18px}
}

/* MOBILE — first section self-contained in one viewport.
   Top ~55% text, bottom ~45% photo, no scroll required. */
/* MOBILE — entire hero (text + photo) self-contained in one viewport.
   100dvh - 84px header. Text takes its content height, photo takes
   the remaining space. No scroll required to see Dr. Nagel's portrait. */
@media(max-width:880px){
  .hero-split{
    display:flex !important;
    flex-direction:column !important;
    grid-template-columns:none !important;
    grid-template-rows:none !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
  .hero-split-text{
    padding:32px 24px 28px !important;
    align-items:flex-start !important;
    min-height:0 !important;
    justify-content:flex-start !important;
    background:#fff;
    flex:0 0 auto !important;
  }
  .hero-split-text-inner{padding-top:0 !important;width:100% !important;max-width:none !important}
  .hero-kicker{
    font-size:10.5px !important;
    margin-bottom:12px !important;
    letter-spacing:.22em !important;
    font-weight:700 !important;
    color:#ff0000 !important;
  }
  .hero-split-h1{
    font-size:28px !important;
    line-height:1.05 !important;
    margin-bottom:12px !important;
    letter-spacing:-.022em !important;
  }
  .hero-split-h1 em{
    font-style:italic !important;
    font-weight:500 !important;
    color:#ff0000 !important;
  }
  .hero-split-dek{
    font-size:14px !important;
    line-height:1.4 !important;
    margin-bottom:14px !important;
    color:var(--muted) !important;
  }
  .hero-split-cta{
    display:inline-flex !important;
    width:auto !important;
    align-self:flex-start !important;
    justify-content:center !important;
    height:46px !important;
    padding:0 20px !important;
    font-size:12px !important;
    letter-spacing:.08em !important;
    font-weight:700 !important;
  }
  .hero-split-photo{
    display:block !important;
    width:100% !important;
    aspect-ratio:4/3 !important;
    flex:0 0 auto !important;
    height:auto !important;
    max-height:none !important;
    min-height:0 !important;
    background:#0a0a0a;
    position:relative !important;
  }
  .hero-split-photo img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center 22% !important;
  }
  .hero-split-caption{
    left:20px !important;
    bottom:20px !important;
    gap:6px !important;
  }
  .hero-split-caption .hsp-line-1{font-size:13px !important;font-weight:600 !important}
  .hero-split-caption .hsp-line-2{font-size:10.5px !important;letter-spacing:.18em !important;color:rgba(255,255,255,.7) !important}
}

/* Very small phones — same logic, slightly tighter type. */
@media(max-width:380px){
  .hero-split-h1{font-size:26px !important;line-height:1.05 !important;margin-bottom:10px !important}
  .hero-split-dek{font-size:13.5px !important;margin-bottom:12px !important}
  .hero-split-text{padding:16px 20px 14px !important}
  .hero-split-cta{height:44px !important;padding:0 18px !important;font-size:11.5px !important}
}

/* ================================================================
   PROMINENT PHONE — replaces the three e-mail tail-links in the
   "Drei Wege" / "Three Ways" / "Tres vías" dark section. Centered,
   typographic, large.
   ================================================================ */
.phone-prominent{
  margin-top:80px;
  padding-top:48px;
  border-top:1px solid rgba(255,255,255,.18);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}
.phone-prominent-lbl{
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
.phone-prominent-num{
  font-family:var(--serif);
  font-size:clamp(36px,4.6vw,56px);
  font-weight:400;
  letter-spacing:-.018em;
  color:#fff !important;
  line-height:1.05;
  text-decoration:none;
  border:none; border-bottom:1px solid transparent;
  background:transparent;
  padding:0;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  transition:border-color .25s ease, color .25s ease;
  display:inline-block;
}
.phone-prominent-num:hover{
  color:var(--red) !important;
  border-bottom-color:var(--red);
}@media(max-width:680px) {

  .phone-prominent{margin-top:48px;padding-top:32px}
  .phone-prominent-num{font-size:32px}

}


/* ================================================================
   FOOTER REG LINE — small Handelsregister/Firmenbuch number under
   each location. Tight Inter mono, red-accent on hover.
   ================================================================ */
.foot .col p .reg{
  display:inline-block;
  margin-top:2px;
  font-family:'Inter',system-ui,sans-serif;
  font-size:12px;
  letter-spacing:.04em;
  color:rgba(255,255,255,.5);
  font-weight:500;
}
.foot .col p strong{display:inline-block;margin-bottom:4px;color:var(--red)}
.foot .col p{margin-bottom:18px}

/* ================================================================
   FINAL RED ENFORCEMENT — every reddish/wine token resolves to #ff0000.
   Catches any legacy --red-on-dark / wine-tone references that may
   still reach the DOM via cascade.
   ================================================================ */
:root{
  --red:#ff0000 !important;
  --red-on-dark:#ff0000 !important;
  --red-2:#cc0000 !important;
}
em.text-red,
.text-red,
em[style*="color"],
.section-eyebrow,
.hero-eyebrow,
.hero-kicker,
.brand .dot,
.brand-mark .dot,
.three-col article h3,
.data-ribbon .stat,
.three-col-dark article h3,
.section-dark .more,
.cta-band em,
.aphorism em{
  /* hairlines/borders use border-color tokens; dots/text use color */
}
/* ================================================================
   LOGO DOT — render as a TRUE CIRCLE.
   The . glyph keeps its layout slot (so the inline flow stays sane),
   but is colored transparent. A red disc is overlaid via ::after,
   absolutely positioned to the bottom-right of the slot.
   ================================================================ */
.brand .dot,
.brand-mark .dot{
  position:relative !important;
  color:transparent !important;
  display:inline-block !important;
  margin-left:.04em !important;
  width:.32em !important;
  vertical-align:baseline !important;
  line-height:inherit !important;
}
.brand .dot::after,
.brand-mark .dot::after{
  content:"" !important;
  position:absolute !important;
  left:.04em !important;
  bottom:.06em !important;
  width:.22em !important;
  height:.22em !important;
  background:#ff0000 !important;
  border-radius:0 !important;
}

/* ================================================================
   PAGE-HEADER (sub-pages: /markt, /investitionsthese, etc.)
   Restore BlackRock rhythm: red uppercase eyebrow, big serif H1,
   serif lede with proper breathing room. Italic accent in #ff0000.
   ================================================================ */
.page-header{
  padding:120px 0 80px !important;
}@media(max-width:880px) {

  .page-header{padding:64px 0 48px !important}

}

.page-header .hero-eyebrow{
  font-family:'Inter',system-ui,sans-serif !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  color:#ff0000 !important;
  margin:0 0 32px !important;
  display:block !important;
}
.page-header .hero-h1{
  font-family:var(--serif) !important;
  font-size:clamp(40px,5.6vw,80px) !important;
  font-weight:400 !important;
  line-height:1.05 !important;
  letter-spacing:-.022em !important;
  color:var(--ink) !important;
  margin:0 0 36px !important;
  max-width:1100px !important;
}
.page-header .hero-h1 em{
  color:#ff0000 !important;
  font-style:italic !important;
  font-weight:500 !important;
}
.page-header .hero-lede{
  font-family:var(--serif) !important;
  font-size:clamp(20px,1.6vw,24px) !important;
  font-weight:400 !important;
  line-height:1.5 !important;
  color:var(--muted) !important;
  margin:0 0 0 !important;
  max-width:760px !important;
}@media(max-width:880px) {

  .page-header .hero-eyebrow{font-size:11.5px;letter-spacing:.18em;margin-bottom:20px !important}
  .page-header .hero-h1{margin-bottom:24px !important}
  .page-header .hero-lede{font-size:17px !important;line-height:1.5 !important}

}

.three-col article h3,
.three-col-dark article h3{border-top-color:#ff0000 !important}
.data-ribbon .stat{border-top-color:#ff0000 !important}
.section-eyebrow,
.hero-kicker,
.hero-eyebrow{color:#ff0000 !important}

/* ================================================================
   FINAL RED ENFORCEMENT — ALL SUBPAGES.
   Every red touchpoint forced to #ff0000. Brute-force, last-rule wins.
   ================================================================ */

/* Eyebrows / kickers everywhere */
.section-eyebrow,
.section-eyebrow strong,
.hero-eyebrow,
.hero-kicker,
.page-header .breadcrumb,
.page-header .breadcrumb a,
.eyebrow.tight,
.eyebrow.no-num.tight,
p.eyebrow,
.eyebrow,
.posts .post .meta .cat,
.article .meta-row .cat,
.cap-label{color:#ff0000 !important}

/* Italic em accents in display headlines */
em,
h1 em,
h2 em,
h3 em,
.hero h1 em,
.hero-h1 em,
.hero-text .hero-h1 em,
.hero-split-h1 em,
.page-header h1 em,
.page-header .hero-h1 em,
.section-h2 em,
.section-head h2 em,
.aphorism em,
.aphorism p em,
.cta-band h2 em,
.article h1 em,
.article h2 em,
.pullquote em,
.pull-quote em,
.text-red,
.market-stat strong,
.market-region{color:#ff0000 !important;font-style:italic}
.market-region{font-style:normal !important}
.market-stat strong{font-style:normal !important;font-weight:600}

/* Borders / hairlines */
.three-col article h3,
.three-col-dark article h3,
.data-ribbon .stat,
.data-ribbon a.stat-link,
.market-table,
.hero-three .cell::before,
.foot-cols .col h3{border-top-color:#ff0000 !important}

/* Foot col h3 use a different border path: just enforce color */
.foot-cols .col h3{color:#ff0000 !important}

/* Buttons + links */
.btn,
.btn:link,
.btn:visited{background:#ff0000 !important;border-color:#ff0000 !important;color:#fff !important}
.btn.ghost,
.btn.ghost:link,
.btn.ghost:visited{background:transparent !important;color:var(--ink) !important;border-color:var(--ink) !important}
.btn.ghost:hover{background:#ff0000 !important;color:#fff !important;border-color:#ff0000 !important}
.btn:hover{background:var(--ink) !important;border-color:var(--ink) !important;color:#fff !important}
a.more,
.more{color:#ff0000 !important}
a.more:hover,
.more:hover{color:var(--ink) !important}
.btn-link,
.btn-link::after{color:#ff0000 !important}

/* Hero-split + drawer-hero CTA */
.hero-split-cta{background:#cc0000 !important;border-color:#cc0000 !important;color:#fff !important}
.hero-split-cta:hover{background:var(--ink) !important;border-color:var(--ink) !important}
.drawer .drawer-hero{background:#ff0000 !important;color:#fff !important}

/* Phone-prominent on dark sections */
.phone-prominent-num:hover{color:#ff0000 !important;border-bottom-color:#ff0000 !important}
.section-dark .phone-prominent-lbl,
.phone-prominent-lbl{color:rgba(255,255,255,.55) !important}

/* Drawer accents */
.drawer .drawer-mini a:hover{color:#ff0000 !important}
.drawer .drawer-direct .dd-k{color:#ff0000 !important}

/* Form: required input focus / submit */
.field input:focus,
.field select:focus,
.field textarea:focus{border-color:#ff0000 !important;box-shadow:0 0 0 2px rgba(227,6,19,.15) !important}
input[type="checkbox"]{accent-color:#ff0000 !important}

/* Article body links */
.article-body a{color:#ff0000 !important}

/* Brand dot — guaranteed (in case earlier rule was overridden) */
.brand .dot::after,
.brand-mark .dot::after{background:#ff0000 !important;border-radius:0 !important}

/* ================================================================
   PARTNER PROFILE HERO PHOTO — fills the 4:5 figure correctly.
   ================================================================ */
figure.hero-photo,
.hero-photo{
  margin:32px 0 48px !important;
  position:relative !important;
  width:100% !important;
  max-width:480px !important;
  aspect-ratio:4/5 !important;
  overflow:hidden !important;
  background:#0a0a0a !important;
  border:1px solid var(--line) !important;
}
figure.hero-photo img,
.hero-photo img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 22% !important;
  display:block !important;
  filter:grayscale(15%);
}


/* ================================================================
   MAXIMUM RED. Pure #FF0000 with saturation push.
   Every red element renders at full brightness on hardware that
   supports wide-gamut, with subtle text-shadow glow on display
   accents to amplify perceived saturation on standard sRGB screens.
   ================================================================ */

:root{
  --red:#ff0000 !important;
  --red-on-dark:#ff0000 !important;
  --red-2:#cc0000 !important;
}

/* Force every red surface to pure 255-0-0 */
.btn,
.btn:link,
.btn:visited,
.hero-split-cta,
.drawer .drawer-hero,
.data-ribbon .stat,
.three-col article h3,
.three-col-dark article h3{
  background-color:#ff0000 !important;
}
.btn,
.btn:link,
.btn:visited,
.hero-split-cta,
.drawer .drawer-hero{
  background:#ff0000 !important;
  border-color:#ff0000 !important;
}
.data-ribbon .stat,
.three-col article h3,
.three-col-dark article h3,
.data-ribbon a.stat-link{
  border-top-color:#ff0000 !important;
  background:transparent !important;
}

/* Display-em accents glow */
.hero-split-h1 em,
.hero-h1 em,
.hero-text .hero-h1 em,
.page-header .hero-h1 em,
.page-header h1 em,
.section-h2 em,
.aphorism em,
.aphorism p em,
.pullquote em,
.article h1 em,
.article h2 em{
  color:#ff0000 !important;
  text-shadow:0 0 0.02em rgba(255,0,0,.45);
}

/* Eyebrows + kickers — also glow */
.section-eyebrow,
.hero-eyebrow,
.hero-kicker,
.page-header .breadcrumb,
.posts .post .meta .cat,
.cap-label{
  color:#ff0000 !important;
}

/* Brand square */
.brand .dot::after,
.brand-mark .dot::after{
  background:#ff0000 !important;
  border-radius:0 !important;
}

/* Whole-page wide-gamut hint: signals to the GPU/display that we want
   the punchiest red gamut available */
@media (color-gamut: p3){
  :root{ --red:color(display-p3 1 0 0); --red-on-dark:color(display-p3 1 0 0); }
  .btn,.hero-split-cta,.drawer .drawer-hero{ background:color(display-p3 1 0 0) !important; border-color:color(display-p3 1 0 0) !important; }
  .hero-split-h1 em,.page-header .hero-h1 em,.section-h2 em,.aphorism em,.pullquote em{ color:color(display-p3 1 0 0) !important; }
  .section-eyebrow,.hero-eyebrow,.hero-kicker{ color:color(display-p3 1 0 0) !important; }
  .brand .dot::after,.brand-mark .dot::after{ background:color(display-p3 1 0 0) !important; }
}

/* ================================================================
   BUTTON TYPE — wider, bolder, more presence.
   Applies to every CTA across the site.
   ================================================================ */
.btn,
.btn:link,
.btn:visited,
.btn-link,
.hero-split-cta,
.hero-split-cta .hsc-lbl,
.drawer .drawer-hero,
.drawer .drawer-hero .dh-lbl,
.cta-band-actions .phone span,
.cta.hide-mobile,
.cta.drawer-cta,
button[type="submit"],
input[type="submit"]{
  font-family:'Inter',system-ui,sans-serif !important;
  font-weight:700 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
  font-stretch:125% !important;
  font-variation-settings:"wdth" 125 !important;
}

/* The hero-split CTA gets the strongest treatment */
.hero-split-cta,
.hero-split-cta .hsc-lbl{
  letter-spacing:.18em !important;
  font-weight:800 !important;
}
.btn,
.btn:link,
.btn:visited,
button[type="submit"]{
  letter-spacing:.16em !important;
  font-weight:800 !important;
  padding-left:36px !important;
  padding-right:36px !important;
}

/* Drawer hero label: same wider, heavier */
.drawer .drawer-hero .dh-lbl{
  letter-spacing:.04em !important;
  font-weight:700 !important;
  font-stretch:125% !important;
}

/* ---------------- DAS BUCH (Raphael Nagel · Die Manufaktur) ----------------
   Desktop: balanced two-column with vertical centring on the book cover,
   tightened typography, calmer monospace meta line. On narrow viewports
   the cover sits ABOVE the copy so the visual entry is the artwork, not
   an awkward eyebrow floating in white space. */
.book{
  background:#fafaf8;
  padding:80px 0;
  border-top:1px solid var(--line, #e6e3dd);
  border-bottom:1px solid var(--line, #e6e3dd);
}
.book .wrap{max-width:1100px}
.book__inner{
  display:grid;
  gap:64px;
  align-items:center;
  grid-template-columns:1.15fr 0.85fr;
}
.book__copy{padding:8px 0}
.book__copy .section-eyebrow{margin:0 0 18px}
.book__copy h2{
  font-family:var(--serif);
  font-size:clamp(32px,4vw,46px);
  font-weight:500;
  line-height:1.05;
  letter-spacing:-.018em;
  margin:0;
  max-width:14ch;
}
.book__copy .lede{
  font-family:var(--serif);
  font-size:18px;
  line-height:1.55;
  color:var(--ink);
  max-width:50ch;
  margin:20px 0 0;
}
.book__actions{
  margin:32px 0 0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px 28px;
}
.book__actions .btn{flex:0 0 auto}
.book__available{
  text-decoration:none;
  border-bottom:1px solid var(--ink);
  padding-bottom:3px;
  font-family:'Inter',system-ui,sans-serif;
  font-size:13.5px;
  font-weight:600;
  letter-spacing:.04em;
  color:var(--ink);
  transition:border-color .15s ease,color .15s ease;
}
.book__available:hover{color:var(--red,#cc0000);border-bottom-color:var(--red,#cc0000)}
.book__meta{
  margin:28px 0 0;
  font-family:'Inter',system-ui,sans-serif;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#888;
  font-weight:500;
}
.book__media{display:flex;justify-content:center;align-items:center}
.book__media a{display:block;line-height:0}
.book__cover{
  display:block;
  width:100%;
  max-width:380px;
  height:auto;
  border:0;
  box-shadow:0 18px 48px -12px rgba(0,0,0,.32),0 4px 14px -4px rgba(0,0,0,.18);
}

@media (max-width:880px){
  .book{padding:48px 0 56px}
  .book .wrap{padding:0 24px}
  .book__inner{
    grid-template-columns:1fr;
    gap:32px;
  }
  .book__media{order:-1}
  .book__cover{max-width:240px;margin:0 auto}
  .book__copy{padding:0}
  .book__copy h2{font-size:30px;max-width:none}
  .book__copy .lede{font-size:16px;max-width:none;margin-top:14px}
  .book__actions{margin-top:24px;gap:14px 20px}
  .book__actions .btn{width:100%;justify-content:center;text-align:center}
  .book__available{font-size:13px}
  .book__meta{margin-top:20px;font-size:10px;letter-spacing:.14em}
}


/* ============================================================
   Submission page (DE: sondersituation-einreichen, EN: submit-deal,
   ES: presentar-deal). Compact hero + two-column form-first layout
   shared across all three locales.
   ============================================================ */
.subm-hero{padding:56px 0 32px;border-bottom:1px solid var(--line)}
.subm-hero .wrap{max-width:1200px}
.subm-hero h1{font-family:var(--serif);font-size:clamp(32px,4.2vw,52px);font-weight:500;line-height:1.05;letter-spacing:-.02em;color:var(--ink);margin:14px 0 18px;max-width:880px}
.subm-hero h1 em{font-style:italic;font-weight:300;color:var(--red,#cc0000)}
.subm-hero .hero-lede{font-size:17px;line-height:1.55;color:var(--muted);max-width:780px;margin:0}
@media(max-width:880px){.subm-hero{padding:36px 0 24px}.subm-hero h1{font-size:30px;margin:10px 0 14px}.subm-hero .hero-lede{font-size:15px}}

.subm-grid{padding:48px 0 96px}
.subm-grid .wrap{max-width:1200px}
.subm-grid-inner{display:grid;grid-template-columns:340px 1fr;gap:64px;align-items:start}
@media(max-width:980px){.subm-grid-inner{grid-template-columns:1fr;gap:32px}.subm-grid{padding:28px 0 64px}}

.subm-side{position:sticky;top:24px;display:flex;flex-direction:column;gap:32px}
@media(max-width:980px){.subm-side{position:static;gap:24px}}
.subm-side-card{border-top:1px solid var(--line);padding-top:20px}
.subm-side-card .section-eyebrow{margin:0 0 12px}
.subm-side-card h3{font-family:var(--serif);font-size:17px;font-weight:500;line-height:1.3;margin:0 0 12px;color:var(--ink)}
.subm-side-card ul{list-style:none;padding:0;margin:0;font-size:14.5px;line-height:1.6;color:var(--muted)}
.subm-side-card ul li{padding:4px 0;border-bottom:1px dotted rgba(0,0,0,.08)}
.subm-side-card ul li:last-child{border-bottom:none}
.subm-side-card p{font-size:14.5px;line-height:1.6;color:var(--muted);margin:0 0 10px}
.subm-side-direct{background:#f7f5f1;padding:20px;margin-top:8px}
.subm-side-direct .dd-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid rgba(0,0,0,.06);font-size:13.5px;text-decoration:none;color:var(--ink);gap:12px}
.subm-side-direct .dd-row:last-child{border-bottom:none}
.subm-side-direct .dd-k{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.subm-side-direct .dd-v{font-family:var(--serif);font-size:15px}

.subm-form-card{background:#fff;border:1px solid var(--line);padding:36px 36px 32px;border-radius:0}
@media(max-width:980px){.subm-form-card{padding:24px 18px}}
.subm-form-card .subm-form-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--red,#cc0000);margin:0 0 8px}
.subm-form-card h2{font-family:var(--serif);font-size:clamp(22px,2.6vw,28px);font-weight:500;line-height:1.2;margin:0 0 12px;color:var(--ink)}
.subm-form-card .subm-form-intro{font-size:14.5px;line-height:1.55;color:var(--muted);margin:0 0 28px;max-width:560px}
.subm-block-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin:8px 0 4px;font-weight:600;border-top:1px solid var(--line);padding-top:24px}
.subm-block-label:first-of-type{border-top:none;padding-top:0;margin-top:0}
.submit-form{display:flex;flex-direction:column;gap:20px}
.submit-form .field{display:flex;flex-direction:column;gap:6px}
.submit-form .field label{font-size:13px;letter-spacing:.02em;color:var(--ink);font-weight:500}
.submit-form .field input,
.submit-form .field select,
.submit-form .field textarea{font-family:inherit;font-size:16px;line-height:1.4;padding:11px 12px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:0;width:100%;box-sizing:border-box;transition:border-color .15s ease}
.submit-form .field input:focus,
.submit-form .field select:focus,
.submit-form .field textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 2px rgba(0,0,0,.04)}
.submit-form .field textarea{resize:vertical;min-height:96px}
.submit-form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.submit-form .field-row{grid-template-columns:1fr;gap:20px}}
.submit-form .consent{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--muted);margin-top:4px}
.submit-form .consent input{margin-top:3px;flex-shrink:0;width:18px;height:18px}
.submit-form .submit-row{margin-top:8px;display:flex;flex-direction:column;gap:14px}
.submit-form .btn{align-self:flex-start;padding:14px 28px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;background:var(--ink,#0a0a0a);color:#fff;border:none;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:10px;transition:opacity .15s ease}
.submit-form .btn:hover{opacity:.85}
.submit-form .btn:disabled{opacity:.5;cursor:wait}
@media(max-width:560px){.submit-form .btn{align-self:stretch;justify-content:center}}
.submit-form .sla{font-size:12.5px;color:var(--muted);line-height:1.4}
.submit-form .honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.subm-status{margin-top:18px;padding:14px 16px;font-size:14px;line-height:1.5;border-left:3px solid var(--ink);background:#f7f5f1;display:none}
.subm-status.show{display:block}
.subm-status.ok{border-left-color:#1a7f37;background:#f0f9f3}
.subm-status.err{border-left-color:#cf222e;background:#fdf3f3}
.subm-status strong{display:block;margin-bottom:4px}
