/* ==========================================================================
   broschart.net – gemeinsame Basis des neuen Layouts
   Kopf, Navigation (inkl. Mobilmenü), Footer, Typografie und die Bausteine
   der Unterseiten. Seitenspezifisches (z. B. die Animationen der Startseite)
   bleibt inline in der jeweiligen Seite.
   ========================================================================== */

/* --- Schrift: Inter (variabel, Gewicht 100–900, optische Größe 14–32), selbst gehostet.
   SIL Open Font License 1.1 – https://rsms.me/inter/ . Große Überschriften nutzen über
   font-optical-sizing automatisch den Display-Schnitt; „Inter Display“ zeigt auf dieselbe Datei. */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("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("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:"Inter Display";font-style:normal;font-weight:100 900;font-display:swap;src:url("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 Display";font-style:normal;font-weight:100 900;font-display:swap;src:url("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}

/* Ältere Bausteine (Lernseiten, Engpass-Check, CMS-Widgets) verlangen noch „Plus Jakarta Sans“ –
   dieser Name zeigt auf Inter, damit die Website durchgehend eine Schrift nutzt. */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:100 900;font-display:swap;src:url("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:"Plus Jakarta Sans";font-style:normal;font-weight:100 900;font-display:swap;src:url("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}

:root{--bg:#f8faf9;--ink:#0b203b;--secondary:#4f666a;--subtle:#6c8489;--line:#d9e5e2;--mint:#159b88;--mint-dark:#0f7670;--mint-soft:#86ddc9;--blue:#527cb9;--blue-soft:#c9dafa;--lav:#9d8aba;--ease:cubic-bezier(.2,.78,.2,1);--head:78px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--bg);font-family:Inter,"Inter Display",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--mint);outline-offset:4px}

/* --- Kopf ---------------------------------------------------------------- */
.bs-header{height:var(--head);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5vw,94px);border-bottom:1px solid rgba(9,39,59,.08);background:rgba(248,250,249,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);position:sticky;top:0;z-index:40}
.bs-wordmark{display:inline-flex;align-items:center;flex:none}
.bs-logo{display:block;height:46px;width:auto}
.bs-nav{display:flex;align-items:center;gap:clamp(18px,2.8vw,40px);font-size:clamp(14px,1.05vw,16px);font-weight:570;color:#4f686c}
.bs-nav-links{display:flex;align-items:center;gap:clamp(18px,2.8vw,40px)}
.bs-nav-links a:hover,.bs-nav-links a[aria-current="page"]{color:var(--mint)}
.bs-nav-links a[aria-current="page"]{font-weight:680}
.bs-nav-sprache{font-size:.85em;letter-spacing:.08em;color:var(--subtle);padding-left:clamp(14px,1.6vw,22px);border-left:1px solid #cbdad6}
.bs-nav .bs-btn{font-size:clamp(13.5px,1vw,15px);padding:15px 23px}

/* Mobilmenü: unter 1100px klappen die Navipunkte als Panel unter dem Kopf auf */
.bs-burger{display:none;width:44px;height:44px;border:1px solid #c9d8d5;border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;align-items:center;justify-content:center;flex:none}
.bs-burger span,.bs-burger span:before,.bs-burger span:after{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative;transition:transform .2s ease,background .2s ease}
.bs-burger span:before,.bs-burger span:after{content:"";position:absolute;left:0}
.bs-burger span:before{top:-6px}.bs-burger span:after{top:6px}
.bs-menu-offen .bs-burger span{background:transparent}
.bs-menu-offen .bs-burger span:before{transform:translateY(6px) rotate(45deg)}
.bs-menu-offen .bs-burger span:after{transform:translateY(-6px) rotate(-45deg)}
@media(max-width:1100px){
  .bs-burger{display:inline-flex}
  .bs-nav-links{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;padding:12px 0 16px;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 20px 40px rgba(11,32,59,.08)}
  .bs-menu-offen .bs-nav-links{display:flex}
  .bs-nav-links a{padding:0 clamp(20px,5vw,94px);height:56px;line-height:56px;font-size:17px;color:var(--ink)}
  .bs-nav-sprache{border-left:0;border-top:1px solid var(--line);margin-top:8px;letter-spacing:.04em}
}
@media(max-width:780px){
  :root{--head:66px}
  .bs-header{padding:0 20px}
  .bs-logo{height:34px}
  .bs-nav{gap:10px}
  .bs-nav .bs-btn{font-size:11px;padding:10px 14px}
}

/* --- Grundbausteine ------------------------------------------------------ */
.bs-container{width:min(1280px,calc(100% - clamp(38px,8vw,156px)));margin:0 auto}
.bs-eyebrow{font-size:clamp(12px,1vw,14px);letter-spacing:.16em;font-weight:760;text-transform:uppercase;color:#638c86}
.bs-btn{display:inline-flex;justify-content:center;align-items:center;gap:11px;padding:14px 20px;background:var(--ink);color:#fff!important;border-radius:100px;font-size:12px;font-weight:650;transition:transform .18s ease,background .18s ease}
.bs-btn:hover{background:#173958;transform:translateY(-1px)}
.bs-btn.ghost{background:transparent;color:var(--ink)!important;border:1px solid #c9d8d5}
.bs-btn.ghost:hover{background:#eff5f2}
.bs-btn-gross{font-size:clamp(15px,1.25vw,18px);padding:clamp(17px,1.5vw,21px) clamp(26px,2.2vw,34px);gap:14px;letter-spacing:-.005em}
.bs-textlink{color:var(--mint-dark);font-weight:650;border-bottom:1px solid #88b9af}
.bs-textlink:hover{color:#084f4c}
.bs-quietlink{display:inline-flex;align-items:center;gap:9px;font-size:clamp(16px,1.25vw,18px);font-weight:650;color:var(--mint-dark);border-bottom:1px solid #88b9af;padding-bottom:5px;white-space:nowrap}
.bs-quietlink:hover{color:#084f4c}

/* --- Seitenkopf der Unterseiten ------------------------------------------ */
.bs-seite-kopf{position:relative;overflow:hidden;background:radial-gradient(850px 730px at 90% 48%,rgba(67,140,192,.065),transparent 70%),linear-gradient(180deg,#fafcfb,#f5f9f8);border-bottom:1px solid #e6efec}
.bs-seite-kopf .bs-container{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(36px,5vw,80px);align-items:center;padding:clamp(56px,8vh,104px) 0 clamp(60px,9vh,112px)}
.bs-seite-kopf.bs-ohne-bild .bs-container{grid-template-columns:minmax(0,1fr)}
.bs-seite-kopf h1{font-family:"Inter Display",Inter,system-ui,sans-serif;font-weight:630;letter-spacing:-.03em;font-size:clamp(40px,4.6vw,70px);line-height:1.07;margin:18px 0 24px;text-wrap:balance}
.bs-seite-kopf h1 em{font-style:normal;color:var(--mint)}
.bs-seite-kopf p{font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:#4d646b;max-width:620px;margin:0}
.bs-seite-kopf p+p{margin-top:14px}
.bs-kopf-ctas{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:34px}
.bs-kopf-bild{margin:0;border-radius:22px;overflow:hidden;box-shadow:0 30px 70px rgba(11,32,59,.16);aspect-ratio:3/2;background:#0b3a3f}
.bs-kopf-bild img{display:block;width:100%;height:100%;object-fit:cover}

/* Seitenkopf mit Vollbild im Hintergrund (Motiv rechts, Text links auf Verlauf) */
.bs-seite-kopf.bs-kopf-hintergrund{background:#0b3a3f;min-height:clamp(520px,72vh,780px);display:flex;align-items:center}
.bs-kopf-hintergrund .bs-kopf-hg{position:absolute;inset:0;margin:0;z-index:0}
.bs-kopf-hintergrund .bs-kopf-hg img{display:block;width:100%;height:100%;object-fit:cover;object-position:72% 50%}
.bs-kopf-hintergrund .bs-kopf-hg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(248,250,249,.98) 0%,rgba(248,250,249,.95) max(38%,calc(50% - 60px)),rgba(248,250,249,.7) max(54%,calc(50% + 140px)),rgba(248,250,249,.15) max(72%,calc(50% + 360px)),rgba(248,250,249,0) max(82%,calc(50% + 480px)))}
.bs-kopf-hintergrund .bs-container{position:relative;z-index:1;grid-template-columns:minmax(0,560px);width:min(1280px,calc(100% - clamp(38px,8vw,156px)))}
.bs-kopf-hintergrund h1,.bs-kopf-hintergrund p{text-shadow:0 0 18px rgba(248,250,249,.85)}
.bs-kopf-hintergrund .bs-btn.ghost{background:rgba(255,255,255,.85)}
.bs-kopf-hintergrund h1{font-size:clamp(40px,4.4vw,66px)}

/* --- Abschnitte ---------------------------------------------------------- */
.bs-abschnitt{padding:clamp(76px,9vw,110px) 0}
.bs-abschnitt-hell{background:#f7faf9;border-top:1px solid #e6efec}
.bs-abschnitt-weiss{background:#fbfcfb;border-top:1px solid #e6efec}
.bs-abschnitt h2{font-family:"Inter Display",Inter,sans-serif;font-size:clamp(34px,4vw,56px);letter-spacing:-.03em;line-height:1.12;font-weight:620;margin:15px 0 0;max-width:860px;text-wrap:balance}
.bs-abschnitt h2 span{color:#169280}
/* Überschrift links, kurzer Begleittext rechts unten bündig */
.bs-kopfzeile{display:grid;grid-template-columns:1.3fr .7fr;gap:45px;align-items:end;margin-bottom:55px}
.bs-kopfzeile>p{font-size:clamp(16px,1.25vw,18px);line-height:1.65;color:#55706e;max-width:430px;margin:0}
/* Etikett links (klebt beim Scrollen), Inhalt rechts */
.bs-zweispalt{display:grid;grid-template-columns:minmax(180px,.32fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:start}
.bs-zweispalt-etikett{position:sticky;top:calc(var(--head) + 32px)}
.bs-prosa{font-size:clamp(17px,1.3vw,19px);line-height:1.72;color:#4d646b;max-width:760px}
.bs-prosa p{margin:0}.bs-prosa p+p{margin-top:1.1em}
.bs-prosa strong{color:var(--ink);font-weight:650}
.bs-prosa a:not([class]){color:var(--mint-dark);font-weight:600;border-bottom:1px solid #88b9af;overflow-wrap:anywhere}
.bs-prosa a:not([class]):hover{color:#084f4c}
.bs-prosa .bs-lead{font-size:clamp(20px,1.8vw,25px);line-height:1.5;color:var(--ink);letter-spacing:-.01em;font-weight:560}
.bs-bild{margin:0}
.bs-bild img{display:block;width:100%;height:auto;border-radius:16px}
.bs-bild figcaption{margin-top:12px;font-size:13px;letter-spacing:.06em;color:var(--subtle)}

/* Themen als ruhige Chips */
.bs-pillen{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.bs-pillen span{display:inline-block;padding:12px 18px;border:1px solid #cfdfdb;border-radius:100px;background:#fff;font-size:clamp(15px,1.15vw,17px);font-weight:560;color:#24424a}

/* Zeitleiste: Datum links, Station rechts, Trennlinien wie die Beratungsspalten */
.bs-zeitleiste{list-style:none;margin:0;padding:0}
.bs-zeitleiste li{display:grid;grid-template-columns:minmax(180px,.32fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);border-top:1px solid #cfdfdb;padding:28px 0 30px}
.bs-zeitleiste li:last-child{border-bottom:1px solid #cfdfdb}
.bs-zeit{font-size:12.5px;letter-spacing:.13em;font-weight:750;color:#5d9b91;text-transform:uppercase;padding-top:6px}
.bs-zeitleiste h3{font-size:clamp(20px,1.7vw,24px);letter-spacing:-.018em;font-weight:640;margin:0 0 9px;line-height:1.25}
.bs-zeitleiste p{font-size:clamp(16px,1.2vw,18px);line-height:1.65;color:#57706f;margin:0;max-width:780px}

/* Abschluss-Aufruf: Akzentfläche wie die Referenzleiste der Startseite */
.bs-aufruf{background:linear-gradient(135deg,#0d7373 0%,#0b5a5a 100%);color:#fff;padding:clamp(70px,8vw,100px) 0}
.bs-aufruf .bs-container{display:flex;align-items:end;justify-content:space-between;gap:30px}
.bs-aufruf .bs-eyebrow{color:#bfe6df}
.bs-aufruf h2{font-family:"Inter Display",Inter,sans-serif;font-size:clamp(32px,4vw,54px);letter-spacing:-.03em;line-height:1.12;font-weight:610;margin:14px 0 0;max-width:820px;text-wrap:balance}
.bs-aufruf .bs-btn{background:#fff;color:var(--ink)!important;flex:none}
.bs-aufruf .bs-btn:hover{background:#e6f4f1}

/* Hinweis-Element im Seitenkopf statt Foto (z. B. „KI verstehen“) */
.bs-kopf-notiz{justify-self:end;align-self:start;display:block;width:min(280px,100%);transform:rotate(-3deg);transition:transform .25s ease}
.bs-kopf-notiz img{display:block;width:100%;height:auto}
.bs-kopf-notiz:hover{transform:rotate(-1deg) scale(1.04)}
.bs-kopf-links{display:flex;gap:28px;flex-wrap:wrap;margin-top:32px}

/* Bücher: Karten mit Cover, ganze Karte ist der Link */
.bs-buecher{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,2.4vw,34px)}
.bs-buch{display:flex;flex-direction:column;background:#fff;border:1px solid #dde8e5;border-radius:18px;overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s ease,border-color .2s ease}
.bs-buch:hover{transform:translateY(-3px);box-shadow:0 22px 50px rgba(11,32,59,.1);border-color:#c3d8d3}
.bs-buch-cover{aspect-ratio:4/3;background:#a9dccf;overflow:hidden}
.bs-buch-cover img{display:block;width:100%;height:100%;object-fit:cover}
.bs-buch-text{display:flex;flex-direction:column;flex:1;padding:24px 24px 22px}
.bs-buch-meta{display:flex;justify-content:space-between;gap:12px;font-size:12px;letter-spacing:.13em;font-weight:750;text-transform:uppercase;color:#5d9b91}
.bs-buch-meta .bs-buch-jahr{color:var(--subtle);letter-spacing:.06em}
.bs-buch h3{font-size:clamp(20px,1.6vw,23px);letter-spacing:-.018em;line-height:1.25;font-weight:650;margin:14px 0 10px;text-wrap:balance}
.bs-buch p{font-size:16px;line-height:1.6;color:#57706f;margin:0}
.bs-buch-hinweis{margin-top:14px!important;padding-left:12px;border-left:2px solid var(--mint-soft);font-size:14.5px!important;color:#24424a!important}
.bs-buch-fuss{margin-top:auto;padding-top:20px;display:flex;justify-content:space-between;gap:12px;font-size:13.5px;color:var(--subtle)}
.bs-buch-fuss span[aria-hidden]{color:var(--mint);transition:transform .2s ease}
.bs-buch:hover .bs-buch-fuss span[aria-hidden]{transform:translateX(4px)}

/* Liste mit Titel links, Quelle rechts (z. B. Rezeption) */
.bs-liste{list-style:none;margin:30px 0 0;padding:0}
.bs-liste li{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;border-top:1px solid #cfdfdb;padding:18px 0}
.bs-liste li:last-child{border-bottom:1px solid #cfdfdb}
.bs-liste-titel{font-size:clamp(16px,1.2vw,18px);font-weight:600;color:var(--ink);line-height:1.45}
.bs-liste-quelle{font-size:15px;color:var(--subtle);line-height:1.5}

/* --- Detailseiten (z. B. einzelne Bücher) ------------------------------- */
.bs-zurueck-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:650;color:var(--mint-dark);margin-bottom:clamp(28px,4vh,44px)}
.bs-zurueck-link:hover{color:#084f4c}
.bs-detail-kopf{background:radial-gradient(850px 730px at 10% 40%,rgba(67,140,192,.06),transparent 70%),linear-gradient(180deg,#fafcfb,#f5f9f8);border-bottom:1px solid #e6efec;padding:clamp(36px,5vh,56px) 0 clamp(64px,9vh,104px)}
.bs-detail-raster{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,5vw,84px);align-items:start}
.bs-detail-bild{position:sticky;top:calc(var(--head) + 32px);margin:0;border-radius:22px;overflow:hidden;background:#a9dccf;box-shadow:0 30px 70px rgba(11,32,59,.14)}
.bs-detail-bild img{display:block;width:100%;height:auto}
.bs-detail-meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12.5px;letter-spacing:.13em;font-weight:750;text-transform:uppercase;color:#5d9b91}
.bs-detail-meta span+span{color:var(--subtle)}
.bs-detail-kopf h1{font-family:"Inter Display",Inter,system-ui,sans-serif;font-weight:630;letter-spacing:-.027em;font-size:clamp(36px,4vw,60px);line-height:1.08;margin:16px 0 14px;text-wrap:balance}
.bs-detail-kopf h1 em{font-style:normal;color:var(--mint)}
.bs-detail-unterzeile{font-size:clamp(16px,1.3vw,18px);font-weight:600;color:#24424a;margin:0 0 26px}
.bs-detail-kopf .bs-prosa{max-width:680px}
.bs-hervor{color:var(--mint-dark);font-weight:650}
.bs-detail-aktionen{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.bs-fakten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:36px 0 0;padding-top:24px;border-top:1px solid #cfdfdb;max-width:680px}
.bs-fakten dt{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:750;color:var(--subtle)}
.bs-fakten dd{margin:6px 0 0;font-size:15.5px;font-weight:600;color:var(--ink);line-height:1.4}
.bs-notiz{display:flex;gap:14px;align-items:flex-start;margin-top:28px;padding:18px 20px;border-radius:14px;background:#e9f5f2;border:1px solid #cbe6df;font-size:15px;line-height:1.6;color:#24424a;max-width:680px}
.bs-notiz:before{content:"";flex:none;width:8px;height:8px;margin-top:8px;border-radius:50%;background:var(--mint)}

/* Leitgedanke als großes Zitat */
.bs-leitzitat{margin:0;font-family:"Inter Display",Inter,sans-serif;font-size:clamp(26px,3vw,42px);line-height:1.25;letter-spacing:-.02em;font-weight:560;max-width:1000px;margin-top:18px;text-wrap:balance}
.bs-leitzitat span{color:#169280}

/* Merkmal-Kacheln (2 × 2) */
.bs-merkmale{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2vw,26px);margin-top:40px}
.bs-merkmal{background:#fff;border:1px solid #dde8e5;border-radius:16px;padding:26px 26px 28px}
.bs-merkmal-num{font-size:12px;letter-spacing:.13em;font-weight:750;color:#5d9b91;text-transform:uppercase}
.bs-merkmal h3{font-size:clamp(19px,1.5vw,22px);letter-spacing:-.015em;font-weight:650;margin:12px 0 8px;line-height:1.3}
.bs-merkmal p{font-size:16px;line-height:1.62;color:#57706f;margin:0}

/* Kapitelverzeichnis */
.bs-kapitel-block{margin-top:52px}
.bs-kapitel-block h3{font-size:clamp(20px,1.7vw,24px);letter-spacing:-.018em;font-weight:650;margin:0 0 8px}
.bs-kapitel-block>p{font-size:16px;line-height:1.62;color:#57706f;margin:0 0 18px;max-width:720px}
.bs-kapitel-gruppe{font-size:12.5px;letter-spacing:.13em;font-weight:750;color:#5d9b91;text-transform:uppercase;margin:34px 0 10px}
.bs-kapitel{list-style:none;margin:0;padding:0;columns:2;column-gap:44px}
.bs-kapitel li{break-inside:avoid;display:grid;grid-template-columns:2.4em minmax(0,1fr) auto;gap:12px;align-items:baseline;border-top:1px solid #dbe7e3;padding:11px 0;font-size:15.5px;line-height:1.45;color:var(--ink)}
.bs-kapitel-nr{font-variant-numeric:tabular-nums;font-weight:700;color:#5d9b91;font-size:13px}
.bs-kapitel-s{font-size:13px;color:var(--subtle);white-space:nowrap;font-variant-numeric:tabular-nums}

/* Stimmen / Rezensionen */
.bs-stimmen{display:grid;gap:24px;margin-top:36px}
.bs-stimme{margin:0;background:#fff;border:1px solid #dde8e5;border-radius:18px;padding:clamp(24px,3vw,36px)}
.bs-stimme blockquote{margin:0;font-size:clamp(16px,1.25vw,18px);line-height:1.7;color:#3d5559}
.bs-stimme blockquote.bs-stimme-kern{font-family:"Inter Display",Inter,sans-serif;font-size:clamp(22px,2.2vw,30px);line-height:1.3;letter-spacing:-.018em;font-weight:560;color:var(--ink);margin-bottom:18px}
.bs-stimme figcaption{display:flex;align-items:center;gap:14px;margin-top:22px}
.bs-stimme figcaption img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none}
.bs-stimme-name{font-weight:680;color:var(--ink);font-size:15.5px}
.bs-stimme-rolle{font-size:14px;color:var(--subtle)}
.bs-beibild{margin:36px 0 0;max-width:520px}
.bs-beibild img{display:block;width:100%;height:auto;border-radius:16px}

.bs-aufruf-aktionen{display:flex;gap:12px;flex-wrap:wrap;flex:none}
.bs-aufruf .bs-btn.ghost{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.45)}
.bs-aufruf .bs-btn.ghost:hover{background:rgba(255,255,255,.1)}

/* Punkteliste in zwei Spalten (z. B. Methodik) */
.bs-punkte{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 44px}
.bs-punkte li{display:flex;gap:14px;align-items:flex-start;font-size:clamp(16px,1.25vw,18px);line-height:1.5;color:#24424a}
.bs-punkte li:before{content:"";flex:none;width:9px;height:9px;margin-top:.5em;border-radius:50%;background:var(--mint)}

/* --- Filme / Videos ------------------------------------------------------ */
.bs-filme{display:grid;gap:clamp(22px,2.6vw,32px)}
.bs-film{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);background:#fff;border:1px solid #dde8e5;border-radius:20px;overflow:hidden;scroll-margin-top:calc(var(--head) + 24px)}
.bs-film-text{padding:clamp(24px,3vw,40px)}
.bs-film-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:13px;color:var(--subtle)}
.bs-film-sender{background:#e3f3ef;color:var(--mint-dark);padding:6px 12px;border-radius:100px;font-weight:700;font-size:12px;letter-spacing:.02em}
.bs-film-art{margin-left:auto;font-size:12px;letter-spacing:.13em;font-weight:750;text-transform:uppercase;color:#5d9b91}
.bs-film h2{font-family:"Inter Display",Inter,sans-serif;font-size:clamp(23px,2.1vw,30px);letter-spacing:-.02em;line-height:1.2;font-weight:640;margin:18px 0 14px;text-wrap:balance}
.bs-film-rolle{font-size:16px;line-height:1.55;color:#24424a;margin:0 0 10px}
.bs-film-rolle b{color:var(--mint-dark);font-weight:700}
.bs-film-credits{font-size:14.5px;line-height:1.55;color:var(--subtle);margin:0}
.bs-film-links{display:flex;flex-wrap:wrap;gap:12px 26px;margin-top:22px}
.bs-film-links .bs-quietlink{font-size:15px;white-space:normal}

.bs-video{position:relative;display:block;width:100%;height:100%;min-height:100%;aspect-ratio:16/9;background:#0d1f1f;border:0;padding:0;margin:0;cursor:pointer;overflow:hidden}
.bs-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease,filter .3s ease}
.bs-video:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.4));pointer-events:none}
.bs-video:hover img{transform:scale(1.03);filter:brightness(.85)}
.bs-play{position:absolute;left:50%;top:50%;z-index:1;width:76px;height:76px;transform:translate(-50%,-50%);border-radius:50%;background:rgba(11,32,59,.9);display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.3);transition:transform .25s ease,background .25s ease}
.bs-play svg{width:28px;height:28px;margin-left:4px}
.bs-video:hover .bs-play{transform:translate(-50%,-50%) scale(1.08);background:var(--mint-dark)}
.bs-video-hinweis{position:absolute;left:14px;bottom:12px;z-index:1;font-size:12px;font-weight:650;color:#fff;letter-spacing:.02em}

.bs-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:clamp(16px,4vw,48px);background:rgba(8,20,30,.86)}
.bs-modal.bs-an{display:flex}
.bs-modal-innen{position:relative;width:100%;max-width:1100px;aspect-ratio:16/9;background:#000;border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.bs-modal-innen iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:14px}
.bs-modal-zu{position:absolute;right:0;top:-48px;display:flex;align-items:center;gap:8px;padding:8px 4px;background:transparent;border:0;color:#fff;font-size:14px;font-weight:650;cursor:pointer}
.bs-modal-offen{overflow:hidden}

/* Sprungmarken unter dem Kopf */
.bs-abschnitt[id]{scroll-margin-top:var(--head)}
.bs-sprungleiste{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.bs-sprungleiste a{padding:11px 18px;border:1px solid #c9d8d5;border-radius:100px;background:rgba(255,255,255,.7);font-size:14.5px;font-weight:620;color:#24424a;transition:background .18s ease,border-color .18s ease}
.bs-sprungleiste a:hover{background:#fff;border-color:var(--mint-soft);color:var(--mint-dark)}

/* Karten nebeneinander (z. B. Case Studies) – Kartenoptik wie .bs-buch */
.bs-faelle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,2.4vw,34px)}
.bs-faelle .bs-buch-cover{aspect-ratio:16/10;background:#0d3b35}

/* Logo-Raster: feine Trennlinien, Höhe je Logo über --h */
.bs-logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin-top:34px;background:#dbe7e3;border:1px solid #dbe7e3;border-radius:16px;overflow:hidden}
.bs-logos>div{display:flex;align-items:center;justify-content:center;height:128px;padding:0 18px;background:#fff}
.bs-logos img{display:block;width:auto;height:auto;max-width:100%;max-height:var(--h,56px);object-fit:contain}
.bs-logos .bs-wappen{background:#f1f7f5}
.bs-logos .bs-wappen img{mix-blend-mode:multiply}
.bs-abschnitt-hell .bs-logos>div{background:#fff}

/* Stimme mit Porträt */
.bs-stimme.bs-mit-bild{display:grid;grid-template-columns:minmax(180px,.36fr) minmax(0,1fr);padding:0;overflow:hidden}
.bs-stimme-bild{position:relative;background:#0d3b35;min-height:300px;overflow:hidden}
.bs-stimme-bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 15%}
.bs-stimme-inhalt{padding:clamp(24px,3vw,40px)}
.bs-stimme blockquote p{margin:0}.bs-stimme blockquote p+p{margin-top:1em}
.bs-stimme-zeichen{font-family:Georgia,serif;font-size:64px;line-height:.6;color:var(--mint-soft);height:30px}
.bs-stimme-rolle a{color:var(--mint-dark);border-bottom:1px solid #88b9af}

/* Abbildungen im Fließtext; .bs-zoom öffnet die Grafik in der Lightbox */
.bs-abbildung{margin:30px 0 34px}
.bs-abbildung img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid #dde8e5;background:#fff}
.bs-abbildung figcaption{margin-top:12px;font-size:14px;line-height:1.55;color:var(--subtle)}
.bs-zoom{display:block;position:relative;cursor:zoom-in}
.bs-zoom:after{content:"⤢";position:absolute;right:12px;top:12px;width:34px;height:34px;border-radius:50%;background:rgba(11,32,59,.78);color:#fff;font-size:17px;line-height:34px;text-align:center;opacity:0;transition:opacity .2s ease}
.bs-zoom:hover:after,.bs-zoom:focus-visible:after{opacity:1}
.bs-lightbox{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:clamp(16px,4vw,48px);background:rgba(8,20,30,.9);cursor:zoom-out}
.bs-lightbox.bs-an{display:flex}
.bs-lightbox img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.5);background:#fff}
.bs-lightbox button{position:absolute;right:clamp(12px,3vw,32px);top:clamp(12px,3vw,24px);background:transparent;border:0;color:#fff;font-size:15px;font-weight:650;cursor:pointer;padding:8px}
.bs-prosa h3{font-size:clamp(20px,1.7vw,24px);letter-spacing:-.015em;font-weight:650;color:var(--ink);margin:40px 0 10px;line-height:1.3}
.bs-prosa h3:first-child{margin-top:0}
.bs-prosa ul,.bs-prosa ol{margin:1em 0;padding-left:1.3em}
.bs-prosa li{margin:.4em 0}
.bs-prosa li::marker{color:var(--mint)}
.bs-prosa code{font-size:.9em;background:#eef4f2;padding:2px 6px;border-radius:5px}
.bs-prosa pre{margin:16px 0;padding:14px 18px;background:#fff;border:1px solid #dde8e5;border-radius:12px;overflow-x:auto;font-size:14.5px;line-height:1.55}
.bs-prosa pre code{background:none;padding:0;font-size:inherit}
.bs-prosa blockquote{margin:24px 0;padding:4px 0 4px 22px;border-left:3px solid var(--mint);font-style:italic;color:#3d5559}
.bs-prosa blockquote cite{display:block;margin-top:8px;font-style:normal;font-size:14px;color:var(--subtle)}

/* Profilkarten (z. B. Partner): Foto links, Text rechts */
.bs-profile{display:grid;gap:clamp(22px,2.6vw,32px)}
.bs-profil{display:grid;grid-template-columns:minmax(200px,.34fr) minmax(0,1fr);background:#fff;border:1px solid #dde8e5;border-radius:20px;overflow:hidden}
.bs-profil-bild{position:relative;background:#0d3b35;min-height:300px}
.bs-profil-bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.bs-profil-text{padding:clamp(24px,3vw,44px)}
.bs-profil h2{font-family:"Inter Display",Inter,sans-serif;font-size:clamp(24px,2.2vw,32px);letter-spacing:-.022em;line-height:1.2;font-weight:640;margin:12px 0 14px}
.bs-profil p{font-size:clamp(16px,1.2vw,18px);line-height:1.68;color:#4d646b;margin:0}

/* Linklisten (z. B. Quellen) */
.bs-linkliste{list-style:none;margin:14px 0 0;padding:0}
.bs-linkliste li{border-top:1px solid #dbe7e3}
.bs-linkliste li:last-child{border-bottom:1px solid #dbe7e3}
.bs-linkliste a{display:flex;justify-content:space-between;gap:16px;padding:13px 0;font-size:15.5px;line-height:1.45;color:#24424a}
.bs-linkliste a:hover{color:var(--mint-dark)}
.bs-linkliste a span[aria-hidden]{color:var(--mint);flex:none}
.bs-links-zeile{display:flex;flex-wrap:wrap;gap:14px 28px;margin-top:30px}
.bs-links-zeile .bs-quietlink{white-space:normal}

/* Merkmal-Karten mit mehr Inhalt (Systeme, Fragen) */
.bs-merkmal p+p{margin-top:10px}
.bs-merkmal .bs-links-zeile{margin-top:20px}
.bs-merkmal .bs-links-zeile .bs-quietlink{font-size:15px}
.bs-merkmal .bs-signal{font-size:17px;font-weight:600;line-height:1.45;color:var(--ink);margin:0 0 16px}
.bs-merkmal ul{list-style:none;margin:0;padding:16px 0 0;border-top:1px solid #dbe7e3;display:grid;gap:9px}
.bs-merkmal li{position:relative;padding-left:18px;font-size:15px;line-height:1.5;color:#57706f}
.bs-merkmal li:before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--mint)}
.bs-zweispalt .bs-notiz{max-width:none}

.bs-merkmale + .bs-prosa,.bs-schritte + .bs-prosa,.bs-merkmale + .bs-links-zeile{margin-top:30px}

.bs-karten-bild{display:block;width:96px;margin-bottom:18px}
.bs-karten-bild img{display:block;width:96px;height:96px;object-fit:cover;border-radius:14px}
.bs-karten-bild:after{display:none}

/* Schrittfolge (z. B. Installationsanleitung) */
.bs-schritte{list-style:none;margin:6px 0 0;padding:0;counter-reset:none}
.bs-schritte li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:20px;border-top:1px solid #cfdfdb;padding:26px 0}
.bs-schritte li:last-child{border-bottom:1px solid #cfdfdb}
.bs-schritt-nr{font-family:"Inter Display",Inter,sans-serif;font-size:34px;font-weight:640;letter-spacing:-.025em;line-height:1;color:var(--mint)}
.bs-schritte h3{margin-top:2px!important}
@media(max-width:780px){.bs-schritte li{grid-template-columns:44px minmax(0,1fr);gap:12px}.bs-schritt-nr{font-size:26px}}

/* Quadratisches Kopfbild, Vorschlagskarten (404) */
.bs-kopf-bild-quadrat{aspect-ratio:1/1;max-width:420px;justify-self:end;width:100%}
.bs-vorschlag{display:block;transition:transform .2s var(--ease),box-shadow .2s ease,border-color .2s ease}
.bs-vorschlag:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(11,32,59,.09);border-color:#c3d8d3}
.bs-vorschlag h2{font-size:clamp(19px,1.6vw,22px)!important;margin-bottom:0!important}
.bs-vorschlag h2 span{color:var(--mint)}

/* Kontaktwege: drei Karten nebeneinander */
.bs-kontaktwege{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,26px)}
.bs-kontaktwege .bs-merkmal{padding:clamp(24px,2.6vw,34px)}
.bs-kontaktwege h2{font-family:"Inter Display",Inter,sans-serif;font-size:clamp(22px,1.9vw,27px);letter-spacing:-.02em;font-weight:640;margin:12px 0 12px;line-height:1.2}
.bs-kontaktwege .bs-linkliste{margin-top:6px}
.bs-kontakt-wert{margin-top:18px!important;font-style:normal;font-size:17px!important;line-height:1.6!important;color:var(--ink)!important;font-weight:600}

/* Newsletter-Widget (assets/spq-newsletter.js) im Stil des neuen Layouts */
.spq-newsletter-embed, .spq-newsletter-embed * { font-family: inherit !important; }
.spq-newsletter-embed:not([data-variant="preview"]) .spq-newsletter-section { background: transparent !important; padding: clamp(40px,6vw,72px) max(calc((100% - 1280px) / 2), clamp(19px, 4vw, 78px)) !important; }
.spq-newsletter-embed:not([data-variant="preview"]) .spq-newsletter-card { max-width: none !important; border-radius: 20px !important; background: linear-gradient(135deg, #0d7373 0%, #0b5a5a 100%) !important; }
.spq-newsletter-tag { font-family: "Inter Display", Inter, system-ui, sans-serif !important; font-weight: 620 !important; letter-spacing: -.025em !important; }
.spq-newsletter-embed .spq-newsletter-submit { background: #fff !important; color: var(--ink) !important; }
.spq-newsletter-embed .spq-newsletter-submit:hover:not(:disabled) { background: #e6f4f1 !important; }

/* Lernseiten (Rahmentausch): Vor-/Zurück-Navigation darf schmaler werden als ihre Titel */
main div[style*="grid-template-columns: 1fr auto 1fr"]{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important}
main div[style*="grid-template-columns: 1fr auto 1fr"] > a{min-width:0}
main div[style*="grid-template-columns: 1fr auto 1fr"] span{overflow-wrap:anywhere}
main div[style*="display: inline-block"][style*="padding: 16px 28px"]{max-width:100%}
main div[style*="display: inline-block"][style*="padding: 16px 28px"] > span{white-space:normal!important;display:inline-block;line-height:1.1!important}

/* Nach-oben-Button (unten rechts; wird von broschart.js erzeugt, Startseite hat einen eigenen) */
.bs-nachoben{position:fixed;right:clamp(16px,2.4vw,32px);bottom:calc(clamp(22px,4vh,42px) + env(safe-area-inset-bottom,0px));z-index:50;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:var(--ink);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px -10px rgba(11,32,59,.55);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .3s ease,transform .3s ease,bottom .35s var(--ease),background .18s ease}
.bs-nachoben:hover{background:#173958}
.bs-nachoben.bs-an{opacity:1;transform:none;pointer-events:auto}
@media(max-width:780px){.bs-nachoben{width:44px;height:44px;font-size:18px;right:14px}}
@media print{.bs-nachoben{display:none}}

/* --- Footer -------------------------------------------------------------- */
.bs-footer{border-top:1px solid #d7e3df;background:var(--bg);color:#5f7876;font-size:14px}
.bs-footer-raster{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding:60px 0 44px}
.bs-footer-marke img{display:block;height:40px;width:auto;margin-bottom:16px}
.bs-footer-marke p{margin:0;max-width:330px;line-height:1.6}
.bs-footer-titel{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:750;color:var(--ink);margin-bottom:14px}
.bs-footer-spalte a{display:block;margin-bottom:9px}
.bs-footer a:hover{color:var(--mint)}
.bs-footer-unten{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #d7e3df;padding:24px 0 34px;font-size:12.5px;color:#78918e}

/* --- Schmal ------------------------------------------------------------- */
@media(max-width:900px){
  .bs-seite-kopf .bs-container{grid-template-columns:minmax(0,1fr)}
  .bs-kopf-bild{order:-1}
  .bs-kopf-notiz{display:none}
  .bs-seite-kopf.bs-kopf-hintergrund{display:block;min-height:0;background:var(--bg)}
  .bs-kopf-hintergrund .bs-kopf-hg{position:relative;inset:auto;height:min(62vw,420px)}
  .bs-kopf-hintergrund .bs-kopf-hg img{object-position:62% 50%}
  .bs-kopf-hintergrund .bs-kopf-hg:after{background:linear-gradient(180deg,rgba(248,250,249,0) 55%,rgba(248,250,249,1) 100%)}
  .bs-kopf-hintergrund .bs-container{grid-template-columns:minmax(0,1fr);padding-top:8px}
  .bs-buecher{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bs-kontaktwege{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bs-detail-raster{grid-template-columns:minmax(0,1fr)}
  .bs-detail-bild{position:static;max-width:520px}
  .bs-kapitel{columns:1}
  .bs-film{grid-template-columns:minmax(0,1fr)}
  .bs-video{height:auto}
  .bs-punkte{grid-template-columns:minmax(0,1fr)}
  .bs-logos{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bs-stimme.bs-mit-bild{grid-template-columns:minmax(0,1fr)}
  .bs-profil{grid-template-columns:minmax(0,1fr)}
  .bs-profil-bild{min-height:0;aspect-ratio:4/3}
  .bs-stimme-bild{min-height:0;aspect-ratio:4/3}
  .bs-kopfzeile{display:block;margin-bottom:35px}.bs-kopfzeile>p{margin-top:21px}
  .bs-zweispalt{grid-template-columns:minmax(0,1fr);gap:18px}
  .bs-zweispalt-etikett{position:static}
  .bs-footer-raster{grid-template-columns:1fr 1fr;gap:34px}
  .bs-footer-marke{grid-column:1/-1}
}
@media(max-width:780px){
  .bs-container{width:calc(100% - 40px)}
  .bs-buecher{grid-template-columns:minmax(0,1fr)}
  .bs-liste li{grid-template-columns:minmax(0,1fr);gap:4px}
  .bs-merkmale{grid-template-columns:minmax(0,1fr)}
  .bs-kontaktwege{grid-template-columns:minmax(0,1fr)}
  .bs-faelle{grid-template-columns:minmax(0,1fr)}
  .bs-logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bs-logos>div{height:100px;padding:0 14px}
  .bs-logos img{max-height:calc(var(--h,56px) * .8)}
  .bs-fakten{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .bs-aufruf-aktionen{margin-top:28px}.bs-aufruf .bs-aufruf-aktionen .bs-btn{margin-top:0}
  .bs-zeitleiste li{grid-template-columns:minmax(0,1fr);gap:6px;padding:22px 0 24px}
  .bs-aufruf .bs-container{display:block}.bs-aufruf .bs-btn{margin-top:28px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}