/* 28.10.2026 · Stil B (Canva-Entwurf, von Christian gewählt) – NUR für die Bewerberseiten
   head-of-ai.html, leiter-marketing.html, vertriebsleiter.html. Wird nach bewerber-n9.css geladen.
   Christian: „bitte nicht dieses Grün“, „Nichts modern!“ – daher klassisch: das MrPetzAI-Blau (#082B46, Christian: „behalte bei, das ist besser“), warmes Off-White,
   Gold als einziger Akzent (03.11.2026, Christian: Braun raus, Gold rein), Überschriften in Manrope, Text in Inter (Christian: „keine Serifenschrift, modern und vertrauenswürdig“),
   ruhige Flächen im Wechsel, große Zahlen, keine Kicker-Zeilen, keine Trennlinien, keine Pillenknöpfe. */
main.n9{
  --n9-navy:#082B46;--n9-navy-tief:#061F33;--n9-navy-mitte:#0B3A57;
  --n9-cyan:#9A7B2E;--n9-cyan-dunkel:#7A5F28;
  --n9-gold:#D8BE7C;--n9-gold-hover:#E7CE8C;--n9-gold-weich:rgba(216,190,124,.14);--n9-gold-rand:rgba(216,190,124,.6);
  --n9-tinte:#082B46;--n9-text:#3E4756;--n9-leise:#646C78;--n9-papier:#F4F1EA;--n9-linie:transparent;
  --n9-titel:'Manrope',Arial,sans-serif}

/* Navigation in derselben Farbe wie der Kopf */
body:has(main.n9) .site-nav,body:has(main.n9) .site-nav.scrolled{background:#082B46!important;border-bottom:0!important;box-shadow:none!important}

/* Keine Kicker-Zeilen über den Überschriften */
.n9 .n9-kicker{display:none!important}

/* Überschriften: Manrope, modern und ruhig */
.n9 h1,.n9 h2,.n9 h3{font-family:'Manrope',Arial,sans-serif!important;letter-spacing:-.015em!important}
.n9 h1{font-weight:700!important;line-height:1.08!important}
.n9 h2{font-weight:700!important;font-size:clamp(30px,3.4vw,48px)!important;line-height:1.15!important}
.n9 h3{font-weight:700!important}

/* Kopf: Navy, Bürovideo gedämpft */
.n9 .n9-hero{background:#082B46!important}
.n9 .n9-kopf-film{opacity:.2!important;filter:grayscale(.5)}
.n9 .n9-hero h1{max-width:18ch}

/* Große Zahlen auf Navy */
.n9 .n9-belege{background:#082B46!important;color:#fff;padding:16px 0 72px!important}
.n9 .n9-zahlen li{border:0!important;background:transparent!important;padding:0 28px 0 0!important}
.n9 .n9-zahlen b{display:block;font-family:'Manrope',Arial,sans-serif;font-weight:800!important;color:#D9B48F!important;font-size:clamp(40px,4vw,60px)!important;line-height:1.05;margin-bottom:10px}
.n9 .n9-zahlen span{color:rgba(255,255,255,.82)!important}

/* Erster Inhaltsabschnitt: Aussage als Zitat */
.n9 .n9-heute .n9-kopf h2{font-weight:600!important;font-size:clamp(28px,2.8vw,40px)!important;max-width:30ch}
.n9 .n9-heute .n9-kopf h2::before{content:"„"}.n9 .n9-heute .n9-kopf h2::after{content:"“"}

/* Flächenwechsel: Weiß – Off-White – Navy */
.n9 .n9-heute,.n9 .n9-system,.n9 .n9-schritte,.n9 .n9-kontakt{background:#fff!important}
.n9 .n9-referenzen,.n9 .n9-erfahrung{background:#F4F1EA!important}
.n9 .n9-nutzen{background:#082B46!important;color:#fff}
.n9 .n9-nutzen h2,.n9 .n9-nutzen h3{color:#fff!important}
.n9 .n9-nutzen p,.n9 .n9-nutzen .n9-lead{color:rgba(255,255,255,.82)!important}
.n9 .n9-film,.n9 .n9-unterlagen{background:#0B3A57!important}

/* Stationen und Listen: nur Abstand, keine Linien, keine Akzentbalken */
.n9 .n9-stationen li{padding:34px 0!important}
.n9 .n9-st-nutzen{border-left:0!important;padding-left:0!important;color:#9A7B2E!important}
.n9 .n9-st-kopf b{color:#082B46;font-family:'Manrope',Arial,sans-serif;font-size:1.15em}

/* Knöpfe: schlicht, kaum gerundet */
.n9 .btn{border-radius:3px!important;font-family:'Inter',system-ui,sans-serif!important;font-weight:600!important}
.n9 .btn-primary{background:#D8BE7C!important;border-color:#D8BE7C!important;color:#061F33!important}
.n9 .btn-primary:hover{background:#E7CE8C!important;border-color:#E7CE8C!important;color:#061F33!important}
.n9 .btn-outline{border-color:#082B46!important;color:#082B46!important}
.n9 .btn-on-dark{border-color:rgba(255,255,255,.6)!important;color:#fff!important;background:transparent!important}

/* Bilder ruhig, ohne Schlagschatten und Rundungen */
.n9 img,.n9 video{box-shadow:none!important}
.n9 .n9-portrait img{border-radius:0!important}
.n9 .n9-portrait figcaption{border:0!important;background:#082B46!important}

@media(max-width:760px){.n9 .n9-zahlen li{padding:0 0 18px!important}.n9 .n9-belege{padding:8px 0 40px!important}}

/* Codex: moderne Schrift und natürliche, vollständig sichtbare Überschriften. */
main.n9{--n9-titel:'Inter','Segoe UI',Arial,sans-serif;font-family:'Inter','Segoe UI',Arial,sans-serif}
.n9 h1,.n9 h2,.n9 h3,.n9 h4,.n9 .n9-st-kopf b,.n9 .n9-zahlen b{font-family:'Inter','Segoe UI',Arial,sans-serif!important;font-style:normal!important}
.n9 h1,.n9 h2,.n9 h3,.n9 h4{white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;hyphens:manual!important;text-wrap:wrap!important;height:auto!important;max-height:none!important;overflow:visible!important;-webkit-line-clamp:unset!important}
.n9 .n9-hero h1{max-width:none!important;font-size:clamp(34px,4.1vw,56px)!important;line-height:1.15!important;letter-spacing:-.025em!important}
.n9 h2,.n9 .n9-heute .n9-kopf h2{max-width:none!important;font-size:clamp(28px,2.8vw,40px)!important;line-height:1.25!important;font-weight:650!important}
.n9 .n9-heute .n9-kopf h2::before,.n9 .n9-heute .n9-kopf h2::after{content:none!important}
.n9 .n9-kopf,.n9 .n9-hero-text,.n9 .n9-hero-raster>*{min-width:0}
/* Einheitliche Bewerbungsstrecke: vorhandene MrPetzAI-Schrift Inter. */
body.bewerbung-cd{font-family:'Inter','Segoe UI',Arial,sans-serif}
.bewerbung-cd h1,.bewerbung-cd h2,.bewerbung-cd h3,.bewerbung-cd h4,.bewerbung-cd .bew-brand{font-family:'Inter','Segoe UI',Arial,sans-serif!important;font-style:normal!important}
.bewerbung-cd h1,.bewerbung-cd h2,.bewerbung-cd h3,.bewerbung-cd h4{white-space:normal;word-break:normal;hyphens:manual;line-height:1.25;overflow:visible;max-height:none}
/* 29.10.2026: gleicher Innenabstand an allen vier Seiten des Kennzahlenbereichs. */
.n9 .n9-belege{padding:0!important}
.n9 .n9-belege .n9-w{box-sizing:border-box;padding:40px!important}
.n9 .n9-zahlen{gap:32px}
.n9 .n9-zahlen li{padding:0!important;margin:0!important;min-width:0}
@media(max-width:760px){.n9 .n9-belege .n9-w{padding:24px!important}.n9 .n9-zahlen{gap:24px}}