/* Tinnitus Bioregulation – neues Design. Erzeugt vom Design-Werkzeug (Projekt: claude/design-werkzeug). */
@font-face { font-family: "Fraunces"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/FrauncesVariable.woff2") format("woff2"); }
@font-face { font-family: "Fraunces"; font-style: italic; font-weight: 100 900; font-display: swap; src: url("/fonts/FrauncesVariable-Italic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/InterVariable.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 100 900; font-display: swap; src: url("/fonts/InterVariable-Italic.woff2") format("woff2"); }
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-display: swap;
  font-weight: 200 700;
  src: url(/fonts/oswald/oswald-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-display: swap;
  font-weight: 200 700;
  src: url(/fonts/oswald/oswald-cyrillic-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-display: swap;
  font-weight: 200 700;
  src: url(/fonts/oswald/oswald-vietnamese-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-display: swap;
  font-weight: 200 700;
  src: url(/fonts/oswald/oswald-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,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: 'Oswald';
  font-style: normal;
  font-display: swap;
  font-weight: 200 700;
  src: url(/fonts/oswald/oswald-latin-wght-normal.woff2) format('woff2-variations');
  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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url(/fonts/caveat/caveat-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url(/fonts/caveat/caveat-cyrillic-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url(/fonts/caveat/caveat-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,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: 'Caveat';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url(/fonts/caveat/caveat-latin-wght-normal.woff2) format('woff2-variations');
  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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Noto Sans Devanagari';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/noto-sans-devanagari/noto-sans-devanagari-devanagari-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09;
}

@font-face {
  font-family: 'Noto Sans Devanagari';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/noto-sans-devanagari/noto-sans-devanagari-latin-ext-wght-normal.woff2) format('woff2-variations');
  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: 'Noto Sans Devanagari';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/noto-sans-devanagari/noto-sans-devanagari-latin-wght-normal.woff2) format('woff2-variations');
  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: 'Noto Serif Devanagari';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/noto-serif-devanagari/noto-serif-devanagari-devanagari-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09;
}

@font-face {
  font-family: 'Noto Serif Devanagari';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/noto-serif-devanagari/noto-serif-devanagari-latin-ext-wght-normal.woff2) format('woff2-variations');
  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: 'Noto Serif Devanagari';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/noto-serif-devanagari/noto-serif-devanagari-latin-wght-normal.woff2) format('woff2-variations');
  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;
}
:root { color-scheme: light; }
body { margin: 0; font: 14px system-ui, -apple-system, 'Segoe UI', sans-serif; }
img { max-width: 100%; }
[hidden] { display: none !important; }
/* Tinnitus Bioregulation – Startseite, Entwurf mit Jonas-Aufbau
   Zwei Ansichten aus denselben Farbnamen: hell (Creme, wie heute) und dunkel (warmes Fast-Schwarz).
   Umschalten über data-theme am Seitenrahmen. */



:root {
  --bg: #f4eddf;
  --bg-2: #fbf6ec;
  --bg-3: #ece2cd;
  --line: #dccfb4;
  --line-2: #c9b996;
  --ink: #231b12;
  --text: #3a2f24;
  --muted: #685d4f;
  --gold: #b8893a;
  --gold-ink: #7a571c;
  --gold-soft: rgba(184, 137, 58, 0.14);
  --btn: #231b12;
  --btn-ink: #f7f0e2;
  --btn-hover: #3d2e1e;
  --header: rgba(251, 246, 236, 0.94);
  --shadow: 0 1px 2px rgba(35, 27, 18, 0.05), 0 22px 44px -26px rgba(35, 27, 18, 0.32);
  --hl: rgba(236, 186, 64, 0.34);
  --scale-low: #a2533a;
  --scale-mid: #d2c19c;
  --scale-high: #8a6421;
  --doc-filter: none;
  --header-solid: #fbf6ec;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #14100b;
    --bg-2: #1d1812;
    --bg-3: #241e16;
    --line: #372e24;
    --line-2: #4c4031;
    --ink: #f6eddc;
    --text: #e3d7c2;
    --muted: #b5a78f;
    --gold: #d4a557;
    --gold-ink: #e6be74;
    --gold-soft: rgba(212, 165, 87, 0.13);
    --btn: #e6be74;
    --btn-ink: #1a140d;
    --btn-hover: #f1cd8a;
    --header: rgba(20, 16, 11, 0.9);
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 26px 56px -28px rgba(0, 0, 0, 0.8);
    --hl: rgba(230, 190, 116, 0.3);
    --scale-low: #d9825f;
    --scale-mid: #5f5241;
    --scale-high: #e6be74;
    --doc-filter: brightness(0.9) contrast(1.04);
    --header-solid: #14100b;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #14100b;
  --bg-2: #1d1812;
  --bg-3: #241e16;
  --line: #372e24;
  --line-2: #4c4031;
  --ink: #f6eddc;
  --text: #e3d7c2;
  --muted: #b5a78f;
  --gold: #d4a557;
  --gold-ink: #e6be74;
  --gold-soft: rgba(212, 165, 87, 0.13);
  --btn: #e6be74;
  --btn-ink: #1a140d;
  --btn-hover: #f1cd8a;
  --header: rgba(20, 16, 11, 0.9);
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 26px 56px -28px rgba(0, 0, 0, 0.8);
  --hl: rgba(230, 190, 116, 0.3);
  --scale-low: #d9825f;
  --scale-mid: #5f5241;
  --scale-high: #e6be74;
  --doc-filter: brightness(0.9) contrast(1.04);
  --header-solid: #14100b;
  color-scheme: dark;
}
body { background: var(--bg); color: var(--text); margin: 0; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 40; background: var(--header-solid); }
.tb-page {
  background: var(--bg);
  color: var(--text);
  font-family: "Inter", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 19px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.tb-page *, .tb-page *::before, .tb-page *::after { box-sizing: border-box; }
.tb-page img { max-width: 100%; }
:where(.tb-page) a { color: var(--gold-ink); }
:where(.tb-page) a:hover { color: var(--ink); }
:where(.tb-page) p { margin: 0; }
.tb-page :focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; }

.tb-serif { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, "Times New Roman", serif; font-optical-sizing: auto; }

.tb-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: max(48px, env(safe-area-inset-left, 0px)); padding-right: max(48px, env(safe-area-inset-right, 0px)); }
.tb-wrap-wide { max-width: 1400px; }

/* ---------- Icons ---------- */
.tb-ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; display: block; }
.tb-ico-s { width: 14px; height: 14px; stroke-width: 2; }
.tb-mark { width: 32px; height: 32px; fill: none; stroke: var(--gold); stroke-width: 2.2; stroke-linecap: round; flex: none; display: block; }
.tb-mark-dot { fill: var(--gold); stroke: none; }
.tb-ico-sun { display: none; }
:root[data-theme="dark"] .tb-ico-sun { display: block; }
:root[data-theme="dark"] .tb-ico-moon { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .tb-ico-sun { display: block; }
  :root:not([data-theme="light"]) .tb-ico-moon { display: none; }
}

/* ---------- Kopf ---------- */
.tb-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 30; background: var(--header); backdrop-filter: saturate(1.2) blur(12px); -webkit-backdrop-filter: saturate(1.2) blur(12px); border-bottom: 1px solid var(--line); }
.tb-header-inner { display: flex; align-items: center; gap: 24px; height: 76px; }
.tb-brand { display: flex; align-items: center; gap: 11px; text-decoration: none; color: var(--ink); flex: none; }
.tb-page a.tb-brand, .tb-page a.tb-brand:hover { color: var(--ink); }
.tb-brand-name { display: block; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 18px; line-height: 1.1; letter-spacing: -0.01em; }
.tb-brand-by { display: block; font-size: 12px; line-height: 1.3; color: var(--muted); letter-spacing: 0.05em; margin-top: 2px; }
.tb-nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.tb-page .tb-nav a { display: inline-flex; align-items: center; gap: 5px; padding: 9px 11px; border-radius: 999px; font-size: 14px; line-height: 1; font-weight: 500; color: var(--text); text-decoration: none; white-space: nowrap; }
.tb-page .tb-nav a:hover { background: var(--gold-soft); color: var(--ink); }
.tb-page .tb-nav a.is-active { background: var(--gold-soft); color: var(--ink); font-weight: 600; }
.tb-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.tb-iconbtn { width: 44px; height: 44px; border-radius: 999px; border: 1px solid var(--line-2); background: transparent; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.tb-iconbtn:hover { background: var(--gold-soft); }
.tb-lang { height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); background: transparent; color: var(--ink); font-family: "Inter", "Noto Sans Devanagari", sans-serif; font-weight: 700; font-size: 13px; letter-spacing: 0.08em; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.tb-menubtn { display: none; }

/* ---------- Kleine Bausteine ---------- */
.tb-eyebrow { display: flex; align-items: center; gap: 12px; font-size: 13px; line-height: 1.2; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); margin: 0 0 16px; }
.tb-eyebrow::before { content: ""; width: 28px; height: 1.5px; background: var(--gold); display: block; }
.tb-h2 { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 50px; line-height: 1.08; letter-spacing: -0.02em; color: var(--ink); margin: 0; text-wrap: balance; }
.tb-h3 { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 28px; line-height: 1.22; letter-spacing: -0.01em; color: var(--ink); margin: 0; }
.tb-btn { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 26px; border-radius: 999px; background: var(--btn); color: var(--btn-ink); font-weight: 600; font-size: 16.5px; line-height: 1.2; text-decoration: none; }
.tb-page a.tb-btn { color: var(--btn-ink); }
.tb-page a.tb-btn:hover { background: var(--btn-hover); color: var(--btn-ink); }
.tb-btn-ghost { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 24px; border-radius: 999px; border: 1.5px solid var(--line-2); background: transparent; font-weight: 600; font-size: 16.5px; line-height: 1.2; text-decoration: none; }
.tb-page a.tb-btn-ghost { color: var(--ink); }
.tb-page a.tb-btn-ghost:hover { background: var(--gold-soft); color: var(--ink); }
.tb-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; text-decoration: none; border-bottom: 1.5px solid currentColor; padding-bottom: 2px; line-height: 1.3; }
.tb-small { font-size: 15px; line-height: 1.6; color: var(--muted); }
.tb-section { padding-top: 76px; }
.tb-section-end { padding-bottom: 88px; }

/* ---------- Oberer Teil ---------- */
.tb-hero { display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(0, 0.84fr); gap: 64px; align-items: center; padding-top: 48px; padding-bottom: 44px; }
.tb-h1 { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 76px; line-height: 1.02; letter-spacing: -0.025em; color: var(--ink); margin: 0; text-wrap: balance; hyphens: manual; }
.tb-h1 em { display: block; font-style: italic; font-weight: 500; color: var(--gold-ink); margin-top: 6px; }
.tb-quote { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 420; font-size: 25px; line-height: 1.42; color: var(--ink); margin-top: 26px; max-width: 36ch; }
.tb-quote strong { font-style: normal; font-weight: 650; }
.tb-jump { margin-top: 22px; font-size: 19px; color: var(--ink); }
.tb-jump a { text-decoration-thickness: 1.5px; text-underline-offset: 4px; font-weight: 600; }
.tb-fresh { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--line); display: flex; gap: 12px; align-items: flex-start; font-size: 16px; line-height: 1.62; color: var(--muted); max-width: 38em; }
.tb-fresh strong { color: var(--ink); font-weight: 600; }
.tb-fresh .tb-ico { margin-top: 3px; color: var(--gold-ink); }
.tb-fresh a { font-weight: 600; white-space: nowrap; }
.tb-hero-media { margin: 0; }
.tb-hero-media img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; border-radius: 24px; box-shadow: var(--shadow); }

.tb-intro { padding-bottom: 16px; }
.tb-intro-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr); gap: 56px; align-items: start; border-top: 1px solid var(--line); padding-top: 48px; }
.tb-mueller { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 400; font-size: 26px; line-height: 1.5; color: var(--ink); }
.tb-mueller a { text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.tb-toc { background: var(--bg-2); border: 1px solid var(--line); border-radius: 20px; padding: 24px 26px 10px; }
.tb-toc .tb-eyebrow { margin-bottom: 8px; }
.tb-page a.tb-toc-item { display: grid; grid-template-columns: 34px minmax(0, 1fr) 20px; gap: 8px; align-items: start; padding: 15px 0; border-top: 1px solid var(--line); text-decoration: none; color: var(--text); font-size: 16.5px; line-height: 1.5; }
.tb-page a.tb-toc-item:first-of-type { border-top: 0; }
.tb-page a.tb-toc-item:hover { color: var(--ink); }
.tb-toc-num { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 19px; line-height: 1.3; color: var(--gold-ink); }
.tb-toc-item .tb-ico { margin-top: 3px; color: var(--gold-ink); }

.tb-belege-head { max-width: 760px; }
.tb-forum { margin: 44px 0 0; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 48px; align-items: end; padding: 40px 48px; border-radius: 24px; background: var(--bg-2); border: 1px solid var(--line); }
.tb-forum-label { font-size: 13px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); margin-bottom: 18px; }
.tb-forum-quote { margin: 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-style: italic; font-weight: 600; font-size: 68px; line-height: 1.02; letter-spacing: -0.02em; color: var(--ink); }
.tb-forum-meta { display: flex; flex-direction: column; gap: 8px; font-size: 16px; line-height: 1.55; color: var(--muted); }
.tb-forum-who { color: var(--ink); font-weight: 600; }
.tb-forum-meta .tb-link { align-self: flex-start; margin-top: 10px; }

.tb-audio { margin-top: 28px; display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr); gap: 16px; align-items: center; }
.tb-doc { margin: 0; background: var(--bg-2); border: 1px solid var(--line); border-radius: 20px; padding: 20px; }
.tb-doc-tag { display: block; font-size: 12.5px; line-height: 1.2; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); margin-bottom: 14px; }
.tb-doc img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top center; border-radius: 10px; background: #ffffff; filter: var(--doc-filter); }
.tb-doc figcaption { margin-top: 14px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 19px; line-height: 1.4; color: var(--ink); }
.tb-audio-arrow { width: 56px; height: 56px; border-radius: 999px; border: 1px solid var(--line-2); display: flex; align-items: center; justify-content: center; color: var(--gold-ink); }
.tb-audio-hint { margin: 22px 0 0; font-size: 17.5px; line-height: 1.6; color: var(--text); }
.tb-audio-hint strong { color: var(--ink); }

.tb-atp { margin-top: 56px; padding-top: 56px; border-top: 1px solid var(--line); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.tb-atp-text { font-size: 19px; line-height: 1.7; }
.tb-atp-text .tb-h3 { margin-bottom: 18px; }
.tb-atp-fig { background: var(--bg-2); border: 1px solid var(--line); border-radius: 24px; padding: 34px 36px 30px; }
.tb-atp-label { font-size: 13px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); }
.tb-atp-num { display: flex; align-items: baseline; gap: 14px; margin: 12px 0 22px; }
.tb-atp-num strong { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 104px; line-height: 0.95; letter-spacing: -0.035em; color: var(--ink); }
.tb-atp-unit { font-size: 15px; color: var(--muted); }
.tb-scale { position: relative; height: 10px; border-radius: 999px; background: linear-gradient(90deg, var(--scale-low) 0%, var(--scale-low) 33.3%, var(--scale-mid) 33.3%, var(--scale-mid) 83.3%, var(--scale-high) 83.3%, var(--scale-high) 100%); margin: 0 0 46px; }
.tb-scale-dot { position: absolute; top: 50%; left: 30.8%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 999px; background: var(--ink); border: 4px solid var(--bg-2); box-shadow: 0 0 0 1px var(--ink); }
.tb-scale-tick { position: absolute; top: 18px; transform: translateX(-50%); font-size: 13px; line-height: 1.25; color: var(--muted); white-space: nowrap; text-align: center; }
.tb-scale-tick::before { content: ""; position: absolute; left: 50%; top: -14px; width: 1.5px; height: 8px; background: var(--line-2); }
.tb-scale-tick strong { color: var(--ink); font-weight: 600; }
.tb-atp-note { font-size: 16px; line-height: 1.6; color: var(--muted); margin-bottom: 18px; }
.tb-belege-foot { margin-top: 48px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 40px; }
.tb-belege-foot .tb-small { max-width: 560px; }

.tb-story-grid { display: grid; grid-template-columns: minmax(0, 0.32fr) minmax(0, 0.68fr); gap: 64px; align-items: start; }
.tb-story-text { font-size: 18px; }
.tb-story-side .tb-h2 { margin-bottom: 32px; }
.tb-story-img { margin: 0; }
.tb-story-img img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 42% 50%; border-radius: 22px; box-shadow: var(--shadow); }
.tb-story-text p { margin: 0 0 22px; }
.tb-story-text p:last-child { margin-bottom: 0; }
.tb-story-text .tb-story-lead { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-size: 23px; line-height: 1.5; color: var(--ink); margin-bottom: 28px; }

.tb-hope { background: var(--bg-3); padding: 80px 0; }
.tb-hope-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: start; }
.tb-hope-statement { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-style: italic; font-weight: 600; font-size: 50px; line-height: 1.1; letter-spacing: -0.018em; color: var(--ink); }
.tb-hope-text p { margin: 0 0 20px; }
.tb-hope-links { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 34px; }

/* ---------- Unterer Teil ---------- */
.tb-expect-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: end; margin-bottom: 44px; }
.tb-expect-head p { margin-top: 12px; font-size: 18px; }
.tb-stories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.tb-page a.tb-story-card { display: flex; flex-direction: column; gap: 14px; padding: 30px 30px 28px; border-radius: 22px; background: var(--bg-2); border: 1px solid var(--line); text-decoration: none; color: var(--text); min-height: 208px; }
.tb-page a.tb-story-card:hover { border-color: var(--line-2); }
.tb-story-meta { font-size: 12.5px; line-height: 1.3; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-ink); }
.tb-story-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 24px; line-height: 1.25; color: var(--ink); }
.tb-story-go { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15.5px; color: var(--gold-ink); }
.tb-page a.tb-story-card.is-first { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.tb-story-card.is-first .tb-story-title { color: var(--bg); }
.tb-story-card.is-first .tb-story-meta, .tb-story-card.is-first .tb-story-go { color: var(--bg); opacity: 0.85; }

.tb-causes-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: end; }
.tb-causes-head p { font-size: 18px; }
.tb-causes-head p.tb-wegweiser { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 500; font-size: 28px; line-height: 1.25; color: var(--gold-ink); margin-top: 18px; }
.tb-causes { margin-top: 40px; }
.tb-causes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.tb-page a.tb-cause { display: flex; flex-direction: column; border-radius: 22px; overflow: hidden; background: var(--bg-2); border: 1px solid var(--line); text-decoration: none; color: var(--text); }
.tb-page a.tb-cause:hover { border-color: var(--line-2); }
.tb-cause img { display: block; width: 100%; aspect-ratio: 12 / 5; object-fit: cover; }
.tb-cause-body { display: flex; flex-direction: column; gap: 12px; padding: 24px 26px 26px; flex: 1; }
.tb-cause-q { font-size: 14.5px; line-height: 1.45; font-weight: 600; color: var(--gold-ink); }
.tb-cause-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 25px; line-height: 1.2; color: var(--ink); }
.tb-cause-text { font-size: 15.5px; line-height: 1.6; }
.tb-cause-go { margin-top: auto; align-self: flex-start; padding-top: 8px; display: inline-flex; align-items: center; gap: 8px; font-size: 15px; line-height: 1.35; font-weight: 600; color: var(--gold-ink); }

.tb-solution { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-radius: 26px; overflow: hidden; background: var(--bg-2); border: 1px solid var(--line); }
.tb-solution-img { margin: 0; }
.tb-solution-img img { display: block; width: 100%; height: 100%; min-height: 400px; object-fit: cover; object-position: 42% 40%; }
.tb-solution-text { padding: 52px 52px; display: flex; flex-direction: column; justify-content: center; gap: 24px; }
.tb-solution-text .tb-btn { align-self: flex-start; }

.tb-sources-row { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 30px 34px; border: 1px solid var(--line); border-radius: 20px; }
.tb-sources-row .tb-h3 { font-size: 24px; margin-bottom: 6px; }
.tb-sources-row p { font-size: 16px; line-height: 1.6; color: var(--muted); max-width: 760px; }
.tb-sources-row .tb-link { flex: none; }

.tb-notice { display: flex; gap: 14px; align-items: flex-start; padding: 22px 26px; border-radius: 18px; background: var(--gold-soft); font-size: 16.5px; line-height: 1.6; color: var(--text); }
.tb-notice strong { color: var(--ink); }
.tb-notice .tb-ico { margin-top: 3px; color: var(--gold-ink); }

.tb-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: end; }
.tb-contact p { margin-top: 16px; font-size: 18px; }
.tb-mail { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.tb-mail-label { font-size: 13px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); }
.tb-mail a.tb-mail-link { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 500; font-size: 32px; line-height: 1.2; color: var(--ink); text-decoration: none; border-bottom: 2px solid var(--gold); word-break: break-word; }

.tb-footer { border-top: 1px solid var(--line); padding: 32px 0 44px; font-size: 14.5px; color: var(--muted); }
.tb-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.tb-footer nav { display: flex; gap: 22px; }
.tb-page .tb-footer a { color: var(--muted); text-decoration: none; }
.tb-page .tb-footer a:hover { color: var(--ink); }

/* ---------- Leseseiten (Geschichten, Erklärseiten) ---------- */
@media (prefers-reduced-motion: no-preference) { html:has(.tb-page) { scroll-behavior: smooth; } }
.tb-page [id] { scroll-margin-top: 96px; }
.tb-progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; pointer-events: none; }
.tb-progress span { display: block; height: 100%; width: 0; background: var(--gold); border-radius: 0 3px 3px 0; transition: width 0.12s linear; }

.tb-wrap.tb-wrap-read { max-width: 1072px; }
.tb-ahero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; padding-top: 52px; padding-bottom: 36px; }
.tb-ah1 { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 54px; line-height: 1.06; letter-spacing: -0.022em; color: var(--ink); margin: 0; text-wrap: balance; }
.tb-ah1 span { display: block; margin-top: 10px; font-size: 0.6em; letter-spacing: -0.01em; color: var(--gold-ink); }
.tb-ahero-lead { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-size: 24px; line-height: 1.45; color: var(--ink); margin-top: 26px; }
.tb-ahero-text p.tb-ahero-intro { margin-top: 14px; font-size: 18.5px; line-height: 1.7; }
.tb-ahero-intro a { text-decoration-thickness: 1.5px; text-underline-offset: 4px; font-weight: 600; }
.tb-ameta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.tb-ameta span { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); font-size: 14px; font-weight: 500; color: var(--text); }
.tb-ameta .tb-ico { width: 16px; height: 16px; color: var(--gold-ink); }
.tb-ahero-media { margin: 0; }
.tb-ahero-media img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 22px; box-shadow: var(--shadow); }

.tb-atoc { background: var(--bg-2); border: 1px solid var(--line); border-radius: 22px; padding: 26px 30px 16px; }
.tb-atoc .tb-eyebrow { margin-bottom: 10px; }
.tb-atoc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 44px; }
.tb-page a.tb-atoc-item { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; align-items: baseline; padding: 13px 0; border-top: 1px solid var(--line); text-decoration: none; color: var(--text); font-size: 16.5px; line-height: 1.45; }
.tb-page a.tb-atoc-item:nth-child(-n+2) { border-top: 0; }
.tb-page a.tb-atoc-item:hover { color: var(--ink); }
.tb-atoc-num { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 18px; color: var(--gold-ink); }

.tb-chap { display: grid; grid-template-columns: minmax(0, 680px) 240px; column-gap: 56px; row-gap: 20px; justify-content: center; max-width: 1200px; margin: 0 auto; padding-top: 72px; padding-left: max(48px, env(safe-area-inset-left, 0px)); padding-right: max(48px, env(safe-area-inset-right, 0px)); }
.tb-chap > * { grid-column: 1; margin: 0; }
.tb-chap > .tb-note { grid-column: 2; grid-row: 2 / span 2; align-self: start; margin-top: 6px; }
.tb-chap > .tb-note.tb-note-late { grid-row: 4 / span 3; }
.tb-chap > .tb-figure { grid-column: 1 / -1; margin: 14px 0; }
.tb-chap p { font-size: 18.5px; line-height: 1.72; }
.tb-chap p.tb-eyebrow { font-size: 13px; line-height: 1.2; }
.tb-chap-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 40px; line-height: 1.14; letter-spacing: -0.016em; color: var(--ink); text-wrap: balance; }
.tb-chap-num { color: var(--gold-ink); font-style: italic; margin-right: 4px; }
.tb-chap-sub { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 27px; line-height: 1.25; letter-spacing: -0.01em; color: var(--ink); margin-top: 22px; }
.tb-chap > .tb-chap-sub:first-child { margin-top: 0; }
.tb-part-label { margin-bottom: -4px; }
.tb-chap.tb-chap-cont { padding-top: 40px; }
.tb-note { background: var(--bg-2); border: 1px solid var(--line); border-radius: 16px; padding: 18px 18px 16px; font-size: 15px; line-height: 1.55; color: var(--text); }
.tb-note-label { display: block; font-size: 11.5px; line-height: 1.3; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); margin-bottom: 8px; }
.tb-figure img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 20px; box-shadow: var(--shadow); }
.tb-callout { display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px; border-radius: 16px; background: var(--gold-soft); }
.tb-callout p { font-size: 17px; line-height: 1.62; }
.tb-callout strong { color: var(--ink); }
.tb-callout .tb-ico { margin-top: 3px; color: var(--gold-ink); }
.tb-timeline { list-style: none; padding: 0; margin: 4px 0; }
.tb-timeline li { position: relative; padding: 0 0 20px 36px; font-size: 18px; line-height: 1.6; }
.tb-timeline li::before { content: ""; position: absolute; left: 6px; top: 7px; width: 12px; height: 12px; border-radius: 999px; background: var(--gold); }
.tb-timeline li::after { content: ""; position: absolute; left: 11px; top: 24px; bottom: 2px; width: 2px; background: var(--line-2); }
.tb-timeline li:last-child { padding-bottom: 0; }
.tb-timeline li:last-child::after { display: none; }
.tb-timeline strong { display: block; color: var(--ink); font-weight: 600; }
.tb-steps { list-style: none; padding: 0; margin: 4px 0; counter-reset: schritt; display: flex; flex-direction: column; gap: 12px; }
.tb-steps li { counter-increment: schritt; position: relative; padding: 18px 20px 18px 62px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); font-size: 17px; line-height: 1.62; }
.tb-steps li::before { content: counter(schritt); position: absolute; left: 22px; top: 13px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 28px; line-height: 1.2; color: var(--gold-ink); }
.tb-steps strong { color: var(--ink); }
.tb-list { margin: 0; padding-left: 24px; }
.tb-list li { font-size: 18px; line-height: 1.62; margin-bottom: 6px; }
.tb-list li::marker { color: var(--gold); }
.tb-page a.tb-toinhalt { justify-self: start; display: inline-flex; align-items: center; gap: 6px; min-height: 36px; font-size: 14px; font-weight: 600; color: var(--muted); text-decoration: none; }
.tb-page a.tb-toinhalt:hover { color: var(--gold-ink); }

.tb-next { background: var(--bg-3); padding: 80px 0 84px; margin-top: 96px; }
.tb-next-inner { max-width: 1072px; margin: 0 auto; padding-left: max(48px, env(safe-area-inset-left, 0px)); padding-right: max(48px, env(safe-area-inset-right, 0px)); }
.tb-doors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 6px; }
.tb-page a.tb-door { display: flex; flex-direction: column; gap: 10px; min-height: 176px; padding: 30px 32px 28px; border-radius: 22px; background: var(--bg-2); border: 1px solid var(--line); text-decoration: none; color: var(--text); }
.tb-page a.tb-door:hover { border-color: var(--line-2); }
.tb-page a.tb-door.is-main { background: var(--ink); border-color: var(--ink); }
.tb-door-meta { font-size: 12.5px; line-height: 1.3; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-ink); }
.tb-door-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 30px; line-height: 1.18; letter-spacing: -0.01em; color: var(--ink); }
.tb-door-go { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; font-size: 15.5px; font-weight: 600; color: var(--gold-ink); }
.tb-door.is-main .tb-door-title { color: var(--bg); }
.tb-door.is-main .tb-door-meta, .tb-door.is-main .tb-door-go { color: var(--bg); opacity: 0.85; }
.tb-longver { margin-top: 20px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: 36px; align-items: center; padding: 30px 32px; border-radius: 22px; border: 1.5px solid var(--line-2); }
.tb-longver-title { display: flex; align-items: center; gap: 10px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 24px; line-height: 1.25; color: var(--ink); margin-bottom: 10px; }
.tb-longver-title .tb-ico { width: 22px; height: 22px; color: var(--gold-ink); }
.tb-longver p { font-size: 16.5px; line-height: 1.62; }
.tb-longver p.tb-longver-title { font-size: 24px; line-height: 1.25; }
.tb-longver-links { display: flex; flex-direction: column; gap: 10px; align-items: stretch; }
.tb-longver-links p { font-size: 14px; font-weight: 600; color: var(--muted); }
.tb-longver-links .tb-btn-ghost { justify-content: space-between; }

.tb-pagenav { max-width: 1072px; margin: 0 auto; padding-top: 44px; padding-bottom: 56px; padding-left: max(48px, env(safe-area-inset-left, 0px)); padding-right: max(48px, env(safe-area-inset-right, 0px)); display: flex; justify-content: space-between; gap: 24px; }
.tb-page a.tb-pagenav-link { display: flex; flex-direction: column; gap: 4px; max-width: 46%; text-decoration: none; color: var(--ink); }
.tb-page a.tb-pagenav-link.is-next { text-align: right; margin-left: auto; }
.tb-pagenav-meta { font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.tb-pagenav-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 20px; line-height: 1.3; }

/* ---------- Neue Sätze sichtbar machen ---------- */
.tb-page[data-marks="an"] .neu { background: var(--hl); box-shadow: 0 0 0 4px var(--hl); border-radius: 4px; }
.tb-page[data-marks="an"] .neu-box { outline: 2px dashed var(--gold); outline-offset: 8px; }

/* ---------- Mittlere Breiten ---------- */
@media (max-width: 1320px) {
  .tb-nav { display: none; }
  .tb-menubtn { display: inline-flex; }
  .tb-tools { margin-left: auto; }
}
@media (max-width: 1100px) {
  .tb-wrap { padding-left: max(36px, env(safe-area-inset-left, 0px)); padding-right: max(36px, env(safe-area-inset-right, 0px)); }
  .tb-h1 { font-size: 62px; }
  .tb-hero, .tb-story-grid, .tb-hope-inner, .tb-expect-head, .tb-causes-head, .tb-contact { gap: 44px; }
  .tb-intro-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .tb-causes, .tb-stories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tb-forum { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}

/* ---------- Handy ---------- */
@media (max-width: 760px) {
  .tb-page { font-size: 17.5px; line-height: 1.68; }
  .tb-wrap { padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
  .tb-header-inner { height: 64px; gap: 12px; }
  .tb-mark { width: 28px; height: 28px; }
  .tb-brand-name { font-size: 16px; }
  .tb-brand-by { font-size: 11px; }
  .tb-tools { gap: 6px; }
  .tb-lang { display: none; }
  .tb-section { padding-top: 60px; }
  .tb-section-end { padding-bottom: 64px; }
  .tb-story-text { font-size: 17.5px; }
  .tb-h2 { font-size: 34px; }
  .tb-h3 { font-size: 24px; }

  .tb-hero { grid-template-columns: minmax(0, 1fr); gap: 26px; padding-top: 20px; padding-bottom: 36px; }
  .tb-hero-media { order: -1; }
  .tb-hero-media img { aspect-ratio: 16 / 10; object-position: 50% 28%; border-radius: 18px; }
  .tb-h1 { font-size: 43px; line-height: 1.04; }
  .tb-h1 em { margin-top: 4px; }
  .tb-quote { font-size: 21px; margin-top: 20px; }
  .tb-jump { font-size: 17.5px; margin-top: 18px; }
  .tb-fresh { font-size: 15.5px; margin-top: 24px; padding-top: 16px; }
  .tb-fresh a { white-space: normal; }

  .tb-intro-grid { padding-top: 36px; gap: 28px; }
  .tb-mueller { font-size: 21px; line-height: 1.5; }
  .tb-toc { padding: 20px 20px 6px; border-radius: 18px; }
  .tb-page a.tb-toc-item { font-size: 16px; }

  .tb-forum { margin-top: 32px; padding: 28px 22px; gap: 20px; border-radius: 20px; }
  .tb-forum-quote { font-size: 46px; }
  .tb-audio { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .tb-audio-arrow { width: 44px; height: 44px; margin: 0 auto; transform: rotate(90deg); }
  .tb-doc { padding: 16px; border-radius: 18px; }
  .tb-doc figcaption { font-size: 17.5px; }
  .tb-audio-hint { text-align: left; font-size: 16.5px; margin-top: 18px; }

  .tb-atp { grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 48px; padding-top: 48px; }
  .tb-atp-text { font-size: 17.5px; }
  .tb-atp-fig { padding: 26px 22px 24px; border-radius: 20px; }
  .tb-atp-num strong { font-size: 80px; }
  .tb-scale-tick { font-size: 12px; }
  .tb-belege-foot { margin-top: 36px; }

  .tb-story-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .tb-story-side .tb-h2 { margin-bottom: 22px; }
  .tb-story-img { margin-bottom: 28px; }
  .tb-story-img img { aspect-ratio: 16 / 10; border-radius: 18px; }
  .tb-story-text .tb-story-lead { font-size: 21px; }

  .tb-hope { padding: 68px 0; }
  .tb-hope-inner { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .tb-hope-left { display: contents; }
  .tb-hope-statement { font-size: 35px; order: 1; }
  .tb-hope-text { order: 2; }
  .tb-hope-links { order: 3; align-items: stretch; margin-top: 0; }
  .tb-hope-links a { justify-content: center; text-align: center; }

  .tb-expect-head, .tb-causes-head { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-bottom: 28px; }
  .tb-stories, .tb-causes { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .tb-page a.tb-story-card { min-height: 0; padding: 24px 22px; }
  .tb-causes-head p.tb-wegweiser { font-size: 24px; margin-top: 14px; }
  .tb-causes { margin-top: 28px; }

  .tb-solution { grid-template-columns: minmax(0, 1fr); border-radius: 22px; }
  .tb-solution-img img { min-height: 0; height: auto; aspect-ratio: 4 / 3; }
  .tb-solution-text { padding: 30px 22px 32px; gap: 18px; }
  .tb-solution-text .tb-btn { align-self: stretch; justify-content: center; text-align: center; min-height: 56px; padding: 12px 20px; }

  .tb-sources-row { flex-direction: column; align-items: flex-start; gap: 16px; padding: 24px 22px; }
  .tb-notice { padding: 18px 20px; font-size: 15.5px; }
  .tb-contact { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .tb-mail a.tb-mail-link { font-size: 22px; }
  .tb-footer-inner { flex-direction: column; align-items: flex-start; }
}

/* ---------- Leseseiten: mittlere Breiten und Handy ---------- */
@media (max-width: 1100px) {
  .tb-wrap.tb-wrap-read { max-width: 752px; }
  .tb-chap { grid-template-columns: minmax(0, 680px); }
  .tb-chap > .tb-note, .tb-chap > .tb-note.tb-note-late { grid-column: 1; grid-row: auto; margin-top: 0; }
  .tb-ahero { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .tb-ahero-media { order: -1; }
  .tb-ah1 { font-size: 46px; }
}
@media (max-width: 760px) {
  .tb-ahero { gap: 22px; padding-top: 20px; padding-bottom: 28px; }
  .tb-ahero-media img { border-radius: 18px; }
  .tb-ah1 { font-size: 36px; line-height: 1.08; }
  .tb-ahero-lead { font-size: 20px; margin-top: 18px; }
  .tb-ahero-text p.tb-ahero-intro { font-size: 17.5px; }
  .tb-ameta { margin-top: 18px; }
  .tb-atoc { padding: 20px 20px 8px; border-radius: 18px; }
  .tb-atoc-grid { grid-template-columns: minmax(0, 1fr); }
  .tb-page a.tb-atoc-item:nth-child(2) { border-top: 1px solid var(--line); }
  .tb-page a.tb-atoc-item { font-size: 16px; padding: 12px 0; }
  .tb-page [id] { scroll-margin-top: 80px; }
  .tb-chap { padding-top: 56px; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); row-gap: 18px; }
  .tb-chap.tb-chap-cont { padding-top: 32px; }
  .tb-chap p { font-size: 17.5px; line-height: 1.7; }
  .tb-chap-title { font-size: 30px; }
  .tb-chap-sub { font-size: 23px; margin-top: 16px; }
  .tb-chap > .tb-figure { margin: 8px 0; }
  .tb-figure img { border-radius: 16px; }
  .tb-callout { padding: 18px 18px; }
  .tb-callout p { font-size: 16.5px; }
  .tb-timeline li, .tb-list li { font-size: 17px; }
  .tb-steps li { padding: 16px 16px 16px 52px; font-size: 16.5px; }
  .tb-steps li::before { left: 17px; font-size: 25px; }
  .tb-next { padding: 56px 0 60px; margin-top: 64px; }
  .tb-next-inner { padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
  .tb-doors { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .tb-page a.tb-door { min-height: 0; padding: 24px 22px; }
  .tb-door-title { font-size: 25px; }
  .tb-longver { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 24px 22px; }
  .tb-pagenav { flex-direction: column; padding-top: 36px; padding-bottom: 44px; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); gap: 20px; }
  .tb-page a.tb-pagenav-link { max-width: 100%; }
  .tb-page a.tb-pagenav-link.is-next { text-align: left; margin-left: 0; }
}

/* ---------- Menü am Handy und kleinen Bildschirmen ---------- */
@media (max-width: 1320px) {
  .tb-header.is-open .tb-nav { display: flex; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 2px; margin: 0; padding-top: 10px; padding-bottom: 18px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); background: var(--bg-2); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); }
  .tb-page .tb-header.is-open .tb-nav a { padding: 14px; font-size: 16.5px; border-radius: 12px; white-space: normal; }
}

/* ==========================================================
   Geschichten-Stimmung (Biografie): eigenes Licht im selben Haus.
   Nachtblau als Akzent, Kapitel als harte Schnitte, Bogen von
   Glut-Rot (Verzweiflung) zu Gold (Hoffnung).
   ========================================================== */
:root.tb-bio {
  --bg: #f1ede5;
  --bg-2: #f8f5ef;
  --bg-3: #e6e0d4;
  --line: #d8d0c2;
  --line-2: #c3b9a7;
  --ink: #1f1a14;
  --text: #37302a;
  --muted: #645c52;
  --gold: #4b628a;
  --gold-ink: #33476a;
  --gold-soft: rgba(75, 98, 138, 0.12);
  --btn: #1f1a14;
  --btn-ink: #f6f1e8;
  --btn-hover: #3a3129;
  --header: rgba(248, 245, 239, 0.94);
  --header-solid: #f8f5ef;
  --paper: #fffdf8;
  --paper-line: #e4dccd;
  --hope-bg: rgba(196, 146, 58, 0.16);
  --hope-line: rgba(160, 112, 34, 0.45);
  --cut-ink: #f6f0e6;
  --cut-muted: #c9c1b3;
  --ember: #d9532f;
}
@media (prefers-color-scheme: dark) {
  :root.tb-bio:not([data-theme="light"]) {
    --bg: #0e1117;
    --bg-2: #151a22;
    --bg-3: #1a2029;
    --line: #29303c;
    --line-2: #3a4353;
    --ink: #f2ede4;
    --text: #d7dbe2;
    --muted: #a1aab8;
    --gold: #8ea5cd;
    --gold-ink: #adc0e2;
    --gold-soft: rgba(142, 165, 205, 0.14);
    --btn: #adc0e2;
    --btn-ink: #0e1117;
    --btn-hover: #c3d2ec;
    --header: rgba(14, 17, 23, 0.9);
    --header-solid: #0e1117;
    --paper: #161b23;
    --paper-line: #2b3340;
    --hope-bg: rgba(230, 184, 92, 0.13);
    --hope-line: rgba(230, 184, 92, 0.45);
    --cut-ink: #f6f0e6;
    --cut-muted: #c9c1b3;
    --ember: #e8653d;
    color-scheme: dark;
  }
}
:root.tb-bio[data-theme="dark"] {
  --bg: #0e1117;
  --bg-2: #151a22;
  --bg-3: #1a2029;
  --line: #29303c;
  --line-2: #3a4353;
  --ink: #f2ede4;
  --text: #d7dbe2;
  --muted: #a1aab8;
  --gold: #8ea5cd;
  --gold-ink: #adc0e2;
  --gold-soft: rgba(142, 165, 205, 0.14);
  --btn: #adc0e2;
  --btn-ink: #0e1117;
  --btn-hover: #c3d2ec;
  --header: rgba(14, 17, 23, 0.9);
  --header-solid: #0e1117;
  --paper: #161b23;
  --paper-line: #2b3340;
  --hope-bg: rgba(230, 184, 92, 0.13);
  --hope-line: rgba(230, 184, 92, 0.45);
  --cut-ink: #f6f0e6;
  --cut-muted: #c9c1b3;
  --ember: #e8653d;
  color-scheme: dark;
}

.tb-oswald { font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", "Roboto Condensed", Impact, sans-serif; }

/* Leselinie: Glut am Anfang, Gold am Ende */
.tb-bio-page .tb-progress { height: 4px; bottom: -2px; }
.tb-bio-page .tb-progress span {
  background-image: linear-gradient(90deg, #d9532f 0%, #e3763a 38%, #e6a54d 70%, #e8c066 100%);
  background-size: 100vw 100%;
  background-repeat: no-repeat;
  box-shadow: 0 0 12px rgba(226, 120, 60, 0.45);
  border-radius: 0 4px 4px 0;
}

/* Körnung für die dunklen Schnitte */
.tb-grain { position: relative; isolation: isolate; overflow: hidden; }
.tb-grain::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.11;
  mix-blend-mode: overlay;
  background-size: 180px 180px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
.tb-grain > * { position: relative; z-index: 1; }

/* Oberer Teil: Plakat statt Kopfzeile */
.tb-bio-hero { background: var(--cut-bg); color: var(--cut-ink); }
.tb-bio-hero-inner { max-width: 1200px; margin: 0 auto; padding-top: 64px; padding-bottom: 60px; padding-left: max(48px, env(safe-area-inset-left, 0px)); padding-right: max(48px, env(safe-area-inset-right, 0px)); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 56px; align-items: center; }
.tb-bio-eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 22px; font-size: 13px; line-height: 1.2; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--arc); }
.tb-bio-eyebrow::before { content: ""; width: 28px; height: 1.5px; background: var(--arc); display: block; }
.tb-bio-h1 { margin: 0; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; text-transform: uppercase; color: var(--cut-ink); text-wrap: balance; }
.tb-bio-h1-pre { display: block; font-size: 24px; line-height: 1.25; letter-spacing: 0.04em; font-weight: 500; color: var(--cut-muted); }
.tb-bio-h1-main { display: block; margin-top: 10px; font-size: 104px; line-height: 1.06; letter-spacing: 0.005em; }
.tb-bio-hero .tb-ameta { margin-top: 30px; }
.tb-bio-hero .tb-ameta span { border-color: rgba(246, 240, 230, 0.28); color: var(--cut-ink); }
.tb-bio-hero .tb-ameta .tb-ico { color: var(--arc); }
.tb-bio-hero-media { margin: 0; }
.tb-bio-hero-media img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 74% 50%; border-radius: 6px; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.8); }

/* Einstieg unter dem Plakat */
.tb-bio-intro { padding-top: 56px; display: flex; flex-direction: column; gap: 20px; }
.tb-bio-intro p { font-size: 18.5px; line-height: 1.72; }
.tb-bio-intro p.tb-bio-lead { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-size: 24px; line-height: 1.5; color: var(--ink); }
.tb-bio-shortbox { padding: 20px 22px; border-radius: 16px; background: var(--gold-soft); }
.tb-bio-intro .tb-bio-shortbox p { font-size: 17px; line-height: 1.62; }
.tb-bio-shortbox strong { color: var(--ink); }
.tb-bio-tocwrap { padding-top: 32px; }
.tb-bio-num { font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-style: normal; font-size: 17px; letter-spacing: 0.04em; color: var(--arc-dk); }
.tb-bio-toc .tb-atoc-item { grid-template-columns: 36px minmax(0, 1fr); }

/* Kapitel als harter Schnitt */
.tb-cut { background: var(--cut-bg); color: var(--cut-ink); margin-top: 96px; scroll-margin-top: 76px; }
.tb-cut-inner { max-width: 1072px; margin: 0 auto; padding-top: 60px; padding-bottom: 52px; padding-left: max(48px, env(safe-area-inset-left, 0px)); padding-right: max(48px, env(safe-area-inset-right, 0px)); }
.tb-cut-num { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 18px; line-height: 1; letter-spacing: 0.22em; color: var(--arc); }
.tb-cut-num::after { content: ""; flex: 0 0 64px; height: 2px; background: var(--arc); opacity: 0.55; }
.tb-cut-title { margin: 0; max-width: 22ch; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 60px; line-height: 1.1; letter-spacing: 0.005em; text-transform: uppercase; color: var(--cut-ink); text-wrap: balance; }

.tb-bio-chap { padding-top: 56px; }
.tb-bio-chap > .tb-slip { grid-row: 1 / span 2; }

/* Zwischenüberschriften */
.tb-chap > .tb-bio-sub { margin-top: 30px; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 26px; line-height: 1.2; letter-spacing: 0.02em; text-transform: uppercase; color: var(--ink); text-wrap: balance; }
.tb-bio-sub::before { content: ""; display: block; width: 30px; height: 3px; margin-bottom: 14px; background: var(--arc); }

/* Sätze, die sich eingebrannt haben */
.tb-chap > p.tb-moment { padding: 22px 0 18px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-style: italic; font-weight: 600; font-size: 40px; line-height: 1.16; letter-spacing: -0.012em; color: var(--ink); text-wrap: balance; }
.tb-moment::before { content: ""; display: block; width: 44px; height: 3px; margin-bottom: 18px; background: var(--arc); }

/* Randnotizen als Zettel */
.tb-slip { position: relative; border-radius: 3px; padding: 26px 18px 18px; background: var(--paper); border: 1px solid var(--paper-line); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 14px 26px -18px rgba(0, 0, 0, 0.35); transform: rotate(-1.1deg); font-size: 15px; line-height: 1.55; color: var(--text); }
.tb-slip::before { content: ""; position: absolute; top: -9px; left: 50%; width: 86px; height: 22px; transform: translateX(-50%) rotate(2deg); background: var(--arc); opacity: 0.38; border-radius: 2px; }
.tb-slip .tb-note-label { font-family: "Caveat", "Noto Sans Devanagari", "Segoe Print", "Bradley Hand", cursive; font-size: 25px; line-height: 1.05; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--gold-ink); margin-bottom: 8px; }

/* Schwur */
.tb-chap > .tb-vow { padding: 24px 0; border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
.tb-chap .tb-vow p { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 500; font-size: 25px; line-height: 1.45; color: var(--ink); }

/* Hoffnungsmomente */
.tb-hopebox { padding: 26px 28px; border-radius: 18px; background: var(--hope-bg); border: 1px solid var(--hope-line); }
.tb-chap .tb-hopebox p { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-size: 23px; line-height: 1.5; color: var(--ink); }
.tb-hopebox.is-big { padding: 34px 32px; }
.tb-chap .tb-hopebox.is-big p { font-size: 29px; line-height: 1.38; font-weight: 500; }

/* Die Mail als echtes Dokument */
.tb-chap > .tb-maildoc { grid-column: 1 / -1; margin: 12px 0; display: flex; flex-direction: column; gap: 14px; max-width: 860px; }
.tb-chap .tb-maildoc-label { font-size: 15px; line-height: 1.4; color: var(--muted); }
.tb-maildoc-label strong { color: var(--ink); font-weight: 600; }
.tb-mailwin { border: 1px solid var(--line-2); border-radius: 12px; background: var(--paper); overflow: hidden; box-shadow: 0 18px 36px -26px rgba(0, 0, 0, 0.45); }
.tb-mailwin + .tb-maildoc-label { margin-top: 10px; }
.tb-mailwin-head { display: grid; gap: 2px; padding: 14px 20px; border-bottom: 1px solid var(--paper-line); background: var(--bg-2); }
.tb-chap .tb-mailwin-head p { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 10px; font-size: 14.5px; line-height: 1.55; color: var(--ink); }
.tb-mailwin-head span { font-size: 11.5px; line-height: 2.1; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.tb-mailwin-body { padding: 20px 22px 22px; }
.tb-chap .tb-mailwin-body p { font-family: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, "Liberation Mono", "Noto Sans Devanagari", monospace; font-size: 15px; line-height: 1.72; color: var(--text); overflow-wrap: anywhere; }
.tb-mailwin-body em { font-style: italic; color: var(--muted); }

/* Gespräch beim Spezialisten als Mitschrift */
.tb-chap > .tb-dialog { display: flex; flex-direction: column; border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
.tb-chap .tb-dialog-line { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-top: 1px solid var(--line); font-size: 18px; line-height: 1.6; }
.tb-chap .tb-dialog-line:first-child { border-top: 0; }
.tb-dialog-who { font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 15px; line-height: 1.9; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.tb-dialog-line.is-him { color: var(--ink); }
.tb-dialog-line.is-him .tb-dialog-who { color: var(--arc-dk); }

/* Liste „Was das Internet zu bieten hatte" */
.tb-chap > .tb-bio-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border-top: 1px solid var(--line-2); }
.tb-bio-list li { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 18px; line-height: 1.62; }
.tb-bio-list strong { color: var(--ink); }

/* Bilder wie Filmstandbilder */
.tb-bio-page .tb-figure img { border-radius: 6px; filter: contrast(1.04) saturate(0.94); }

/* Ende */
.tb-bio-next .tb-doors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tb-page a.tb-door.is-wide { grid-column: 1 / -1; min-height: 150px; background: var(--cut-bg); border-color: transparent; }
.tb-door.is-wide .tb-door-title { color: var(--cut-ink); font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; text-transform: uppercase; font-size: 40px; letter-spacing: 0.01em; }
.tb-door.is-wide .tb-door-meta, .tb-door.is-wide .tb-door-go { color: var(--arc); opacity: 1; }

/* Farbe des Bogens im Fließtext: hell dunkler, dunkel heller */
@media (prefers-color-scheme: dark) {
  :root.tb-bio:not([data-theme="light"]) .tb-bio-num,
  :root.tb-bio:not([data-theme="light"]) .tb-dialog-line.is-him .tb-dialog-who { color: var(--arc); }
}
:root.tb-bio[data-theme="dark"] .tb-bio-num,
:root.tb-bio[data-theme="dark"] .tb-dialog-line.is-him .tb-dialog-who { color: var(--arc); }

@media (max-width: 1100px) {
  .tb-bio-hero-inner { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-left: max(36px, env(safe-area-inset-left, 0px)); padding-right: max(36px, env(safe-area-inset-right, 0px)); }
  .tb-bio-hero-media { order: -1; width: 100%; max-width: 520px; }
  .tb-bio-hero-media img { aspect-ratio: 1 / 1; object-position: 100% 50%; }
  .tb-bio-h1-main { font-size: 84px; }
  .tb-slip { transform: rotate(-0.6deg); margin-top: 10px; }
}
@media (max-width: 760px) {
  .tb-bio-hero-inner { padding-top: 28px; padding-bottom: 40px; gap: 24px; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
  .tb-bio-eyebrow { font-size: 12px; letter-spacing: 0.12em; gap: 10px; }
  .tb-bio-eyebrow::before { width: 20px; }
  .tb-bio-h1-pre { font-size: 17px; }
  .tb-bio-h1-main { font-size: 62px; }
  .tb-bio-intro { padding-top: 36px; }
  .tb-bio-intro p { font-size: 17.5px; }
  .tb-bio-intro p.tb-bio-lead { font-size: 20.5px; }
  .tb-cut { margin-top: 64px; scroll-margin-top: 64px; }
  .tb-cut-inner { padding-top: 40px; padding-bottom: 36px; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
  .tb-cut-num { font-size: 15px; margin-bottom: 12px; }
  .tb-cut-title { font-size: 37px; }
  .tb-bio-chap { padding-top: 40px; }
  .tb-chap > .tb-bio-sub { font-size: 22px; margin-top: 20px; }
  .tb-chap > p.tb-moment { font-size: 29px; padding: 14px 0 10px; }
  .tb-chap .tb-vow p { font-size: 21px; }
  .tb-chap .tb-hopebox p { font-size: 20px; }
  .tb-chap .tb-hopebox.is-big p { font-size: 24px; }
  .tb-hopebox, .tb-hopebox.is-big { padding: 22px 20px; }
  .tb-mailwin-head { padding: 12px 14px; }
  .tb-chap .tb-mailwin-head p { grid-template-columns: 60px minmax(0, 1fr); font-size: 14px; }
  .tb-mailwin-body { padding: 16px 14px 18px; }
  .tb-chap .tb-mailwin-body p { font-size: 14px; line-height: 1.68; }
  .tb-chap .tb-dialog-line { grid-template-columns: minmax(0, 1fr); gap: 2px; font-size: 17px; }
  .tb-bio-list li { font-size: 17px; }
  .tb-bio-next .tb-doors { grid-template-columns: minmax(0, 1fr); }
  .tb-door.is-wide .tb-door-title { font-size: 30px; }
  .tb-slip { transform: none; }
}

/* ==========================================================
   Ergänzungen für die ganze Vorschau-Seite
   ========================================================== */

/* ---------- Menü mit Untermenüs ---------- */
.tb-navgroup { position: relative; }
.tb-page .tb-navbtn { display: inline-flex; align-items: center; gap: 5px; padding: 9px 11px; border-radius: 999px; border: 0; background: transparent; font-family: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; font-size: 14px; line-height: 1; font-weight: 500; color: var(--text); white-space: nowrap; cursor: pointer; }
.tb-page .tb-navbtn:hover, .tb-navgroup.is-open .tb-navbtn { background: var(--gold-soft); color: var(--ink); }
.tb-page .tb-navbtn.is-active { background: var(--gold-soft); color: var(--ink); font-weight: 600; }
.tb-navbtn .tb-ico { transition: transform 0.15s ease; }
.tb-navgroup.is-open .tb-navbtn .tb-ico { transform: rotate(180deg); }
.tb-sub { display: none; position: absolute; top: calc(100% + 10px); left: 0; z-index: 35; min-width: 300px; flex-direction: column; gap: 2px; padding: 8px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); box-shadow: var(--shadow); }
.tb-sub::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.tb-page .tb-sub a { display: block; padding: 11px 14px; border-radius: 10px; font-size: 14.5px; line-height: 1.35; font-weight: 500; white-space: normal; }
.tb-page .tb-sub a.is-current { background: var(--gold-soft); color: var(--ink); font-weight: 600; }
.tb-navgroup.is-open .tb-sub, .tb-navgroup:focus-within .tb-sub { display: flex; }
@media (hover: hover) and (min-width: 1321px) {
  html:not(.tb-navfit-no) .tb-navgroup:hover .tb-sub { display: flex; }
}
@media (max-width: 1320px) {
  .tb-header.is-open .tb-nav { max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px - env(safe-area-inset-top, 0px)); overflow-y: auto; overscroll-behavior: contain; }
  .tb-header.is-open .tb-navgroup { display: flex; flex-direction: column; }
  .tb-page .tb-header.is-open .tb-navbtn { pointer-events: none; padding: 16px 14px 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); background: transparent; }
  .tb-header.is-open .tb-navbtn .tb-ico { display: none; }
  .tb-header.is-open .tb-sub { display: flex; position: static; min-width: 0; padding: 0; border: 0; box-shadow: none; background: transparent; }
  .tb-header.is-open .tb-sub::before { display: none; }
  .tb-page .tb-header.is-open .tb-sub a { padding: 14px; font-size: 16.5px; line-height: 1.2; border-radius: 12px; }
  .tb-page .tb-header.is-open .tb-nav > a { line-height: 1.2; }
}

/* ---------- Geschichten: Ergänzungen ---------- */
.tb-bio-hero-media img { object-position: var(--hero-pos, 74% 50%); }
.tb-bio-h1-post { display: block; margin-top: 16px; font-size: 24px; line-height: 1.25; letter-spacing: 0.04em; font-weight: 500; color: var(--cut-muted); }
.tb-bio-h1-main { line-height: 1.12; }
.tb-bio-h1.is-long .tb-bio-h1-main { font-size: 80px; line-height: 1.08; }
.tb-bio-num.is-mark::before { content: ""; display: inline-block; width: 18px; height: 3px; border-radius: 2px; background: var(--arc); vertical-align: middle; }
.tb-cut-title .tb-cut-num { font-size: 18px; }
.tb-cut-num { text-transform: uppercase; }
.tb-bio-chap > .tb-slip.is-after-fig { grid-row: 2 / span 3; }

.tb-chap > p.tb-moment.is-long { font-size: 30px; line-height: 1.3; }

.tb-chap > .tb-bio-warn { display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px; border-radius: 14px; background: rgba(217, 83, 47, 0.08); border: 1px solid rgba(217, 83, 47, 0.32); border-left: 5px solid var(--ember); }
.tb-bio-warn .tb-ico { width: 22px; height: 22px; margin-top: 2px; color: var(--ember); }
.tb-chap .tb-bio-warn p { font-size: 17px; line-height: 1.62; }
.tb-bio-warn strong { color: var(--ink); }
.tb-chap > .tb-bio-notice { display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; border-radius: 14px; border: 1px solid var(--line-2); }
.tb-bio-notice .tb-ico { margin-top: 3px; color: var(--muted); }
.tb-chap .tb-bio-notice p { font-size: 16px; line-height: 1.6; color: var(--muted); }
.tb-bio-notice strong { color: var(--ink); }

.tb-chap > p.tb-testcard { padding: 18px 22px 20px; border-radius: 14px; background: var(--paper); border: 1px solid var(--paper-line); box-shadow: 0 14px 26px -22px rgba(0, 0, 0, 0.45); }
.tb-testcard strong { display: block; margin-bottom: 8px; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 18px; line-height: 1.3; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink); }
.tb-testcard br { display: none; }
.tb-chap > .tb-tests { list-style: none; margin: 0; padding: 0; counter-reset: test; display: flex; flex-direction: column; gap: 12px; }
.tb-tests li { counter-increment: test; position: relative; padding: 18px 22px 20px 68px; border-radius: 14px; background: var(--paper); border: 1px solid var(--paper-line); box-shadow: 0 14px 26px -22px rgba(0, 0, 0, 0.45); font-size: 17.5px; line-height: 1.62; }
.tb-tests li::before { content: counter(test); position: absolute; left: 24px; top: 15px; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 32px; line-height: 1; color: var(--arc-dk); }
.tb-tests strong { display: block; margin-bottom: 4px; font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; font-size: 17px; line-height: 1.35; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink); }
.tb-bio-timeline li::before { background: var(--arc); }

.tb-page a.tb-door.is-cut { background: var(--cut-bg); border-color: transparent; }
.tb-door.is-cut .tb-door-title { color: var(--cut-ink); }
.tb-door.is-cut .tb-door-meta, .tb-door.is-cut .tb-door-go { color: var(--arc); opacity: 1; }
.tb-bio-next .tb-door-title { font-family: "Oswald", "Noto Sans Devanagari", "Arial Narrow", Impact, sans-serif; font-weight: 600; text-transform: uppercase; letter-spacing: 0.01em; font-size: 31px; line-height: 1.14; }
.tb-door.is-wide .tb-door-title { font-size: 40px; }
.tb-bio-next .tb-longver { background: var(--bg-2); }

@media (prefers-color-scheme: dark) {
  :root.tb-bio:not([data-theme="light"]) .tb-tests li::before { color: var(--arc); }
}
:root.tb-bio[data-theme="dark"] .tb-tests li::before { color: var(--arc); }

@media (max-width: 1100px) {
  .tb-bio-hero-media img { object-position: var(--hero-pos-m, 100% 50%); }
  .tb-bio-h1.is-long .tb-bio-h1-main { font-size: 66px; }
  .tb-bio-chap > .tb-slip.is-after-fig { grid-row: auto; }
}
@media (max-width: 760px) {
  .tb-bio-h1.is-long .tb-bio-h1-main { font-size: 44px; line-height: 1.08; }
  .tb-bio-h1-post { font-size: 17px; margin-top: 10px; }
  .tb-cut-title .tb-cut-num { font-size: 15px; }
  .tb-chap > p.tb-moment.is-long { font-size: 23px; }
  .tb-tests li { padding: 16px 16px 18px 54px; font-size: 16.5px; }
  .tb-tests li::before { left: 18px; font-size: 27px; }
  .tb-chap > p.tb-testcard { padding: 16px 16px 18px; }
  .tb-bio-next .tb-door-title { font-size: 26px; }
  .tb-door.is-wide .tb-door-title { font-size: 30px; }
}

/* ==========================================================
   Wissens-Seiten (Lärm, Stress, Gift) und Lösungsansatz
   ========================================================== */
:root {
  --warn: #b4532f;
  --warn-ink: #8f3f22;
  --warn-soft: rgba(180, 83, 47, 0.07);
  --warn-line: rgba(180, 83, 47, 0.28);
  --paper-card: #fbf6ea;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --warn: #e58a62; --warn-ink: #f0a582; --warn-soft: rgba(229, 138, 98, 0.09); --warn-line: rgba(229, 138, 98, 0.3); --paper-card: #ece3cf; }
}
:root[data-theme="dark"] { --warn: #e58a62; --warn-ink: #f0a582; --warn-soft: rgba(229, 138, 98, 0.09); --warn-line: rgba(229, 138, 98, 0.3); --paper-card: #ece3cf; }

/* Lösungsansatz: Salbei statt Gold */
:root.tb-loesung {
  --bg: #f1efe6; --bg-2: #f9f8f2; --bg-3: #e5e6d9; --line: #d7d6c6; --line-2: #bfc0aa;
  --ink: #1d2119; --text: #353a30; --muted: #5f6657;
  --gold: #6b8265; --gold-ink: #4a5f45; --gold-soft: rgba(107, 130, 101, 0.14);
  --btn: #1d2119; --btn-ink: #f3f2ea; --btn-hover: #333a2d;
  --header: rgba(249, 248, 242, 0.94); --header-solid: #f9f8f2;
  --hl: rgba(140, 170, 120, 0.32);
}
@media (prefers-color-scheme: dark) {
  :root.tb-loesung:not([data-theme="light"]) {
    --bg: #10130f; --bg-2: #171b16; --bg-3: #1e231c; --line: #2c3329; --line-2: #3d4639;
    --ink: #eef0e6; --text: #d5dacd; --muted: #a7b09d;
    --gold: #9db596; --gold-ink: #b6cbb0; --gold-soft: rgba(157, 181, 150, 0.14);
    --btn: #b6cbb0; --btn-ink: #10130f; --btn-hover: #c9dbc3;
    --header: rgba(16, 19, 15, 0.9); --header-solid: #10130f;
    --hl: rgba(157, 181, 150, 0.28);
  }
}
:root.tb-loesung[data-theme="dark"] {
  --bg: #10130f; --bg-2: #171b16; --bg-3: #1e231c; --line: #2c3329; --line-2: #3d4639;
  --ink: #eef0e6; --text: #d5dacd; --muted: #a7b09d;
  --gold: #9db596; --gold-ink: #b6cbb0; --gold-soft: rgba(157, 181, 150, 0.14);
  --btn: #b6cbb0; --btn-ink: #10130f; --btn-hover: #c9dbc3;
  --header: rgba(16, 19, 15, 0.9); --header-solid: #10130f;
  --hl: rgba(157, 181, 150, 0.28);
}

/* Kopf */
.tb-k-hero .tb-ah1 { font-size: 50px; }
.tb-k-intro { padding-top: 8px; }
.tb-chap > p.tb-k-lede { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-size: 23px; line-height: 1.5; color: var(--ink); }
.tb-k-lede strong { font-weight: 600; }
.tb-k-tocwrap { padding-top: 48px; }
.tb-atoc-num.is-mark::before { content: ""; display: inline-block; width: 16px; height: 2px; border-radius: 2px; background: var(--gold); vertical-align: middle; }

/* Drei Säulen ganz oben (Lösungsansatz) */
.tb-chap > .tb-k-pillars { list-style: none; margin: 4px 0; padding: 0; counter-reset: saeule; display: flex; flex-direction: column; gap: 12px; }
.tb-k-pillars li { counter-increment: saeule; position: relative; padding: 20px 22px 20px 66px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); font-size: 17.5px; line-height: 1.62; }
.tb-k-pillars li::before { content: counter(saeule); position: absolute; left: 22px; top: 16px; width: 30px; height: 30px; border-radius: 999px; background: var(--gold); color: var(--bg-2); font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 17px; line-height: 30px; text-align: center; }
.tb-k-pillars strong { color: var(--ink); }

/* Kurzfassung */
.tb-k-sumwrap { padding-top: 28px; }
.tb-page details.tb-k-summary { border-radius: 18px; background: var(--bg-2); border: 1px solid var(--line); border-left: 4px solid var(--gold); }
.tb-k-summary > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 18px; align-items: center; padding: 20px 22px 20px 24px; }
.tb-k-summary > summary::-webkit-details-marker { display: none; }
.tb-k-summary .summary-eyebrow { grid-column: 1; display: block; font-size: 12.5px; line-height: 1.3; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); margin-bottom: 6px; }
.tb-k-summary .summary-title { grid-column: 1; display: block; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 22px; line-height: 1.3; color: var(--ink); }
.tb-k-summary .summary-toggle, .tb-k-summary > summary:not(:has(.summary-toggle))::after { grid-column: 2; grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 999px; border: 1.5px solid var(--line-2); display: flex; align-items: center; justify-content: center; font-size: 22px; line-height: 1; color: var(--gold-ink); transition: transform 0.15s ease; }
.tb-k-summary > summary:not(:has(.summary-toggle))::after { content: "+"; }
.tb-k-summary[open] .summary-toggle, .tb-k-summary[open] > summary:not(:has(.summary-toggle))::after { transform: rotate(45deg); }
.tb-k-summary .summary-content, .tb-k-summary .summary-body { padding: 4px 24px 22px; display: flex; flex-direction: column; gap: 12px; }
.tb-k-summary .summary-content p, .tb-k-summary .summary-body p { font-size: 17.5px; line-height: 1.66; }
.tb-k-summary strong { color: var(--ink); }

/* Kapitelköpfe */
.tb-k-chap { padding-top: 88px; }
.tb-k-chap.is-prelude { padding-top: 64px; }
.tb-chap > .tb-k-head { display: flex; flex-direction: column; gap: 14px; padding-top: 26px; border-top: 1px solid var(--line-2); scroll-margin-top: 90px; }
.tb-k-num { display: flex; align-items: center; gap: 12px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 24px; line-height: 1; color: var(--gold-ink); }
.tb-k-num::after { content: ""; width: 44px; height: 1.5px; background: var(--gold); }
.tb-chap-title.has-kick .tb-k-kick, .tb-k-h2.has-kick .tb-k-kick, .tb-k-h3.has-kick .tb-k-kick, .tb-k-h4.has-kick .tb-k-kick { display: block; margin-bottom: 8px; font-family: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; font-style: normal; font-size: 13px; line-height: 1.2; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); }
.tb-k-h4.has-kick .tb-k-kick { display: inline; margin: 0 6px 0 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 1.15em; letter-spacing: 0; text-transform: none; }

/* Zwischenüberschriften */
.tb-chap > .tb-k-h2 { margin-top: 30px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 31px; line-height: 1.2; letter-spacing: -0.012em; color: var(--ink); text-wrap: balance; }
.tb-chap > .tb-k-h3 { margin-top: 22px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 25px; line-height: 1.26; letter-spacing: -0.006em; color: var(--ink); text-wrap: balance; }
.tb-chap > .tb-k-h4 { margin-top: 10px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 20.5px; line-height: 1.32; color: var(--ink); }

/* Absätze mit fettem Anfang wie kleine Definitionen */
.tb-chap > p.tb-def { padding-left: 18px; border-left: 2px solid var(--line-2); }
.tb-def > strong:first-child { color: var(--ink); }
.tb-chap > p strong { color: var(--ink); }

/* Listen */
.tb-chap > .tb-k-ol { margin: 0; padding-left: 26px; }
.tb-k-ol li { font-size: 18px; line-height: 1.62; margin-bottom: 8px; }
.tb-k-ol li::marker { color: var(--gold-ink); font-weight: 700; }

/* Kästen */
.tb-chap > .tb-k-box { display: flex; gap: 14px; align-items: flex-start; padding: 22px 24px; border-radius: 16px; background: var(--gold-soft); }
.tb-k-box .tb-ico { margin-top: 3px; color: var(--gold-ink); }
.tb-k-box.is-thought { border-left: 4px solid var(--gold); }
.tb-k-boxbody { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tb-chap .tb-k-boxbody p { font-size: 17.5px; line-height: 1.66; }
.tb-chap > .tb-k-warn { display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px; border-radius: 16px; background: var(--warn-soft); border: 1px solid var(--warn-line); }
.tb-k-warn.is-strong { border-left: 5px solid var(--warn); padding: 22px 24px; }
.tb-k-warn .tb-ico { margin-top: 3px; color: var(--warn); }
.tb-k-warn .callout-eyebrow { font-size: 12.5px; line-height: 1.3; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--warn-ink); }
.tb-k-warn strong { color: var(--ink); }

/* Stufen-Vorschau */
.tb-chap > .stage-preview { list-style: none; margin: 2px 0; padding: 14px 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 16px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stage-preview li { display: flex; align-items: baseline; gap: 8px; font-size: 15.5px; line-height: 1.4; }
.stage-preview li + li::before { content: "→"; color: var(--gold); margin-right: 8px; }
.stage-preview-num { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 20px; color: var(--gold-ink); }
.stage-preview-title { color: var(--ink); font-weight: 600; }

/* Zwischenstand */
.tb-chap > .recap-wrap { grid-column: 1 / -1; margin: 18px 0; padding: 28px 30px 30px; border-radius: 22px; background: var(--bg-3); }
.recap-eyebrow { display: flex; align-items: center; gap: 12px; font-size: 13px; line-height: 1.2; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); }
.recap-eyebrow::before { content: ""; width: 28px; height: 1.5px; background: var(--gold); }
.recap-wrap .stage-chain { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.recap-wrap .stage-step { margin: 0; padding: 20px 20px 22px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); border-top: 3px solid var(--gold); }
.stage-num { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 28px; line-height: 1; color: var(--gold-ink); margin-bottom: 10px; }
.stage-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 20px; line-height: 1.25; color: var(--ink); margin-bottom: 8px; }
.recap-wrap p.stage-desc { font-size: 15.5px; line-height: 1.58; color: var(--text); }

/* Bild zum Mitdenken */
.tb-chap > .analogy-box { padding: 24px 26px; border-radius: 18px; background: var(--bg-2); border: 1.5px dashed var(--line-2); display: flex; flex-direction: column; gap: 12px; }
.analogy-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 12.5px; line-height: 1.3; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-ink); }
.analogy-eyebrow .tb-ico { width: 20px; height: 20px; }
.tb-chap .analogy-box p { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 20px; line-height: 1.5; color: var(--ink); }

/* Bilder und Schaubilder: nichts abschneiden */
.tb-chap > .tb-k-photo { grid-column: 1 / -1; margin: 14px 0; }
.tb-k-photo img { height: auto; object-fit: contain; background: var(--bg-2); }
.tb-k-photo figcaption { max-width: 680px; margin-top: 14px; padding-left: 14px; border-left: 2px solid var(--gold); font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 16.5px; line-height: 1.55; color: var(--muted); }
.tb-chap > .dhk-figure { grid-column: 1 / -1; margin: 14px 0; padding: 20px 20px 18px; border-radius: 20px; background: var(--paper-card); border: 1px solid var(--line); box-shadow: var(--shadow); }
.dhk-figure svg { display: block; width: 100%; height: auto; border-radius: 10px; }
.dhk-figure svg text[fill="#b8893a"] { fill: #70501c; }
.dhk-figure svg text[fill="#6b8265"] { fill: #4f6249; }
.dhk-figure svg text[fill="#6b6256"] { fill: #5b5349; }
.dhk-figure figcaption { margin-top: 14px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 16px; line-height: 1.55; color: #5b5349; text-align: center; }
.dhk-figure.diagram-scroll { min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; }
.dhk-figure.diagram-scroll > svg { min-width: 720px; }

/* Merksatz */
.tb-chap > .pull-quote { margin: 10px 0; padding: 4px 0 4px 26px; border-left: 3px solid var(--gold); }
.tb-chap .pull-quote p { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-style: italic; font-weight: 500; font-size: 29px; line-height: 1.32; letter-spacing: -0.008em; color: var(--ink); }

/* Weiter-Karte */
.tb-page a.cta-card { position: relative; display: block; margin: 8px 0; padding: 26px 76px 26px 28px; border-radius: 20px; background: var(--ink); text-decoration: none; }
.tb-page a.cta-card:hover { background: var(--text); }
.cta-card-title { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 24px; line-height: 1.28; color: var(--bg); }
.cta-card-sub { margin-top: 6px; font-size: 15.5px; line-height: 1.5; color: var(--bg); opacity: 0.82; }
.cta-card-arrow { position: absolute; right: 26px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: 22px; line-height: 1; color: var(--bg); border: 1.5px solid rgba(255, 255, 255, 0.35); }
:root[data-theme="dark"] .cta-card-arrow { border-color: rgba(0, 0, 0, 0.25); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .cta-card-arrow { border-color: rgba(0, 0, 0, 0.25); } }

/* Randnotizen an der richtigen Stelle */
.tb-chap > .tb-note.tb-k-side { grid-column: 2; grid-row: var(--note-row); align-self: start; margin-top: 6px; }

/* Wegweiser (neu, Lösungsansatz) */
.tb-chap > .tb-k-wegweiser { margin-top: 18px; padding: 26px 28px 28px; border-radius: 22px; background: var(--bg-3); border: 1.5px solid var(--gold); display: flex; flex-direction: column; gap: 14px; }
.tb-chap p.tb-k-wegweiser-label { display: flex; align-items: center; gap: 10px; font-size: 13px; line-height: 1.2; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); }
.tb-k-wegweiser p { font-size: 18px; line-height: 1.62; color: var(--ink); }
.tb-k-wegweiser-links { display: flex; flex-wrap: wrap; gap: 10px; }
.tb-k-wegweiser-links .tb-btn, .tb-k-wegweiser-links .tb-btn-ghost { min-height: 48px; font-size: 15.5px; }

@media (max-width: 1100px) {
  .tb-chap > .tb-note.tb-k-side { grid-column: 1; grid-row: auto; margin-top: 0; }
  .recap-wrap .stage-chain { grid-template-columns: minmax(0, 1fr); }
  .tb-k-hero .tb-ah1 { font-size: 44px; }
}
@media (max-width: 760px) {
  .tb-k-hero .tb-ah1 { font-size: 34px; }
  .tb-chap > p.tb-k-lede { font-size: 20px; }
  .tb-k-tocwrap { padding-top: 36px; }
  .tb-k-summary > summary { padding: 18px 18px 18px 20px; }
  .tb-k-summary .summary-title { font-size: 19px; }
  .tb-k-summary .summary-content, .tb-k-summary .summary-body { padding: 2px 20px 20px; }
  .tb-k-summary .summary-content p, .tb-k-summary .summary-body p { font-size: 16.5px; }
  .tb-k-chap { padding-top: 64px; }
  .tb-k-num { font-size: 21px; }
  .tb-chap > .tb-k-h2 { font-size: 26px; }
  .tb-chap > .tb-k-h3 { font-size: 22px; }
  .tb-chap > .tb-k-h4 { font-size: 19px; }
  .tb-k-pillars li { padding: 18px 16px 18px 56px; font-size: 16.5px; }
  .tb-k-pillars li::before { left: 16px; }
  .tb-chap > .tb-k-box, .tb-chap > .tb-k-warn { padding: 18px 18px; }
  .tb-chap .tb-k-boxbody p { font-size: 16.5px; }
  .tb-chap > .recap-wrap { padding: 22px 18px 20px; border-radius: 18px; }
  .tb-chap > .analogy-box { padding: 20px 18px; }
  .tb-chap .analogy-box p { font-size: 18.5px; }
  .tb-chap > .dhk-figure { padding: 12px; border-radius: 16px; }
  .tb-chap .pull-quote p { font-size: 23px; }
  .tb-page a.cta-card { padding: 22px 64px 22px 20px; }
  .cta-card-title { font-size: 20.5px; }
  .cta-card-arrow { right: 16px; }
  .tb-chap > .tb-k-wegweiser { padding: 22px 18px 22px; }
  .tb-k-wegweiser p { font-size: 17px; }
  .tb-k-wegweiser-links { flex-direction: column; align-items: stretch; }
  .tb-k-wegweiser-links .tb-btn, .tb-k-wegweiser-links .tb-btn-ghost { justify-content: center; text-align: center; }
}
.tb-k-head > * { margin: 0; }
.tb-k-hero .tb-ameta { gap: 8px 22px; }
.tb-k-hero .tb-ameta span { min-height: 0; padding: 0; border: 0; font-size: 14.5px; color: var(--muted); }

/* ==========================================================
   Einfache Seiten: Produkte, Erfahrungsberichte, Quellen, Kontakt, Recht
   ========================================================== */
:root.tb-erfahrungen { --gold: #a86a4a; --gold-ink: #7f4a31; --gold-soft: rgba(168, 106, 74, 0.13); --hl: rgba(214, 150, 110, 0.32); }
@media (prefers-color-scheme: dark) {
  :root.tb-erfahrungen:not([data-theme="light"]) { --gold: #d39a7a; --gold-ink: #e2b296; --gold-soft: rgba(211, 154, 122, 0.14); --btn: #e2b296; --btn-hover: #ecc4ab; }
}
:root.tb-erfahrungen[data-theme="dark"] { --gold: #d39a7a; --gold-ink: #e2b296; --gold-soft: rgba(211, 154, 122, 0.14); --btn: #e2b296; --btn-hover: #ecc4ab; }
:root.tb-quellen { --gold: #6e6a5e; --gold-ink: #55524a; --gold-soft: rgba(110, 106, 94, 0.13); }
@media (prefers-color-scheme: dark) {
  :root.tb-quellen:not([data-theme="light"]) { --gold: #aaa596; --gold-ink: #c2bdae; --gold-soft: rgba(170, 165, 150, 0.14); --btn: #c2bdae; --btn-hover: #d4d0c3; }
}
:root.tb-quellen[data-theme="dark"] { --gold: #aaa596; --gold-ink: #c2bdae; --gold-soft: rgba(170, 165, 150, 0.14); --btn: #c2bdae; --btn-hover: #d4d0c3; }

.tb-s-hero { padding-top: 64px; padding-bottom: 8px; }
.tb-s-hero.has-img { padding-top: 52px; }
.tb-s-hero .tb-s-h1 { max-width: 18ch; font-size: 54px; }
.tb-s-hero.has-img .tb-s-h1 { max-width: none; }
.tb-s-hero .tb-s-lede { margin-top: 22px; max-width: 680px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-size: 23px; line-height: 1.5; color: var(--ink); }
.tb-s-hero .tb-s-sub { margin-top: 14px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 24px; line-height: 1.35; color: var(--gold-ink); }
.tb-s-chap { padding-top: 40px; padding-bottom: 24px; }
.tb-chap > .tb-s-h2 { margin-top: 30px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-optical-sizing: auto; font-weight: 600; font-size: 32px; line-height: 1.2; letter-spacing: -0.012em; color: var(--ink); text-wrap: balance; }
.tb-chap > .tb-s-h2:first-child { margin-top: 0; }
.tb-chap > .tb-s-h3 { margin-top: 18px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 23px; line-height: 1.3; color: var(--ink); }
.tb-chap > .tb-list a, .tb-chap > p a { text-underline-offset: 3px; }
.tb-chap > .product-list, .tb-chap > .wide, .tb-chap > .tb-s-contact, .tb-chap > .evidence-card { grid-column: 1 / -1; }
.tb-chap > .tb-s-cta { margin-top: 8px; }

/* Werbe-Hinweis */
.tb-chap > .ad-disclosure { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 26px 26px 24px; border-radius: 18px; background: var(--bg-2); border: 1.5px solid var(--line-2); }
.ad-label { align-self: flex-start; display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px; border-radius: 999px; background: var(--ink); color: var(--bg); font-size: 12.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.tb-chap .ad-disclosure p { font-size: 16.5px; line-height: 1.62; }
.ad-disclosure strong { color: var(--ink); }

/* Produktkarten */
.tb-chap > .product-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 6px 0; }
.product-card { display: grid; grid-template-columns: 52px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 16px; row-gap: 12px; padding: 26px 26px 24px; border-radius: 20px; background: var(--bg-2); border: 1px solid var(--line); }
.product-num { grid-row: 1 / span 2; width: 52px; height: 52px; border-radius: 999px; border: 1.5px solid var(--gold); display: flex; align-items: center; justify-content: center; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 24px; line-height: 1; color: var(--gold-ink); }
.product-name { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 22px; line-height: 1.28; color: var(--ink); }
.product-type { display: block; margin-top: 4px; font-family: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; font-weight: 500; font-size: 14px; line-height: 1.4; color: var(--muted); }
.product-body { display: flex; flex-direction: column; gap: 12px; }
.tb-chap .product-body p { font-size: 16.5px; line-height: 1.62; }
.tb-chap .product-body p.product-fineprint { font-size: 14px; line-height: 1.5; color: var(--muted); font-style: italic; }
.tb-page a.buy-btn { align-self: flex-start; margin-top: auto; display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px; border-radius: 999px; background: var(--btn); color: var(--btn-ink); font-weight: 600; font-size: 15.5px; text-decoration: none; }
.tb-page a.buy-btn:hover { background: var(--btn-hover); color: var(--btn-ink); }
.product-card.no-affiliate { background: transparent; border-style: dashed; border-color: var(--line-2); }
.product-card.no-affiliate .product-num { border-style: dashed; }

/* Flush-Kasten */
.tb-chap > .flush-box { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 12px; padding: 28px 30px; border-radius: 20px; background: var(--gold-soft); }
.flush-eyebrow { font-size: 12.5px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); }
.flush-box h3 { margin: 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 26px; line-height: 1.25; color: var(--ink); }
.tb-chap .flush-box p { font-size: 17px; line-height: 1.64; max-width: 760px; }
.flush-box strong { color: var(--ink); }
.flush-tip { margin-top: 6px; padding: 18px 20px; border-radius: 14px; background: var(--bg-2); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; }
.flush-tip-label { font-size: 12.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-ink); }

/* Medizinischer Hinweis */
.tb-chap > .medical-disclaimer { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 10px; margin-top: 14px; padding: 24px 26px; border-radius: 18px; border: 1px solid var(--warn-line); background: var(--warn-soft); }
.md-label { font-size: 12.5px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--warn-ink); }
.tb-chap .medical-disclaimer p { font-size: 16px; line-height: 1.62; max-width: 820px; }

/* Erfahrungsberichte */
.ev-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
.tb-page .ev-fbtn { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--line-2); background: transparent; color: var(--ink); font-family: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; font-size: 14.5px; font-weight: 600; cursor: pointer; }
.tb-page .ev-fbtn:hover { background: var(--gold-soft); }
.tb-page .ev-fbtn.is-active { background: var(--btn); border-color: var(--btn); color: var(--btn-ink); }
.ev-fcount { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--gold-soft); color: var(--gold-ink); font-size: 12px; line-height: 22px; text-align: center; }
.ev-fbtn.is-active .ev-fcount { background: rgba(255, 255, 255, 0.18); color: var(--btn-ink); }
.ev-section { margin-top: 30px; }
.ev-section.is-hidden { display: none; }
.ev-section .section-title { margin: 0 0 16px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 28px; line-height: 1.2; color: var(--ink); }
.ev-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ev-tile { display: flex; flex-direction: column; gap: 10px; padding: 22px 22px 20px; border-radius: 18px; background: var(--bg-2); border: 1px solid var(--line); }
.ev-tile[hidden] { display: none; }
.ev-tile-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.ev-chip { display: inline-flex; align-items: center; min-height: 26px; padding: 0 10px; border-radius: 999px; background: var(--gold-soft); color: var(--gold-ink); font-size: 12.5px; font-weight: 700; letter-spacing: 0.04em; }
.ev-country { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--muted); }
.ev-tile-title { margin: 2px 0 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 19px; line-height: 1.3; color: var(--ink); }
.ev-tile-note { font-size: 15px; line-height: 1.55; color: var(--text); }
.tb-page a.ev-tile-link { margin-top: auto; padding-top: 6px; align-self: flex-start; font-size: 14.5px; font-weight: 600; color: var(--gold-ink); text-decoration: none; border-bottom: 1.5px solid currentColor; }
.tb-chap > .evidence-card { padding: 20px 24px; border-radius: 18px; border: 1px solid var(--line-2); }
.tb-page a.arrow-link { font-weight: 600; font-size: 17px; color: var(--gold-ink); text-decoration: none; }
.tb-page a.arrow-link:hover { color: var(--ink); }

/* Kontakt */
.tb-chap > .tb-s-contact { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 18px; align-items: start; margin-bottom: 8px; }
.contact-card { display: flex; flex-direction: column; gap: 12px; padding: 26px 26px 24px; border-radius: 20px; background: var(--bg-2); border: 1px solid var(--line); }
.contact-label { font-size: 12.5px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); }
.tb-page a.contact-email { display: inline-flex; align-items: center; gap: 10px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 500; font-size: 22px; line-height: 1.3; color: var(--ink); text-decoration: none; border-bottom: 2px solid var(--gold); align-self: flex-start; word-break: break-word; }
.contact-email svg { width: 22px; height: 22px; flex: none; }
.tb-chap .contact-card p { font-size: 15.5px; line-height: 1.6; color: var(--muted); }
.tb-chap .contact-card p.contact-form-intro { color: var(--text); font-size: 16.5px; }
.contact-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-form-grid { display: flex; flex-direction: column; gap: 14px; }
.contact-form-grid label { display: flex; flex-direction: column; gap: 6px; font-size: 14.5px; font-weight: 600; color: var(--ink); }
.contact-form-grid input[type="text"], .contact-form-grid input[type="email"], .contact-form-grid textarea { width: 100%; min-height: 48px; padding: 12px 14px; border-radius: 12px; border: 1.5px solid var(--line-2); background: var(--bg); color: var(--ink); font: 400 16px/1.5 "Inter", "Noto Sans Devanagari", system-ui, sans-serif; }
.contact-form-grid textarea { min-height: 150px; resize: vertical; }
.contact-form-grid input:focus-visible, .contact-form-grid textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--gold); }
.contact-form-grid label.contact-form-check { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 400; font-size: 14.5px; line-height: 1.55; color: var(--text); }
.contact-form-check input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--gold); }
.tb-page .contact-form-submit { align-self: flex-start; min-height: 50px; padding: 0 24px; border-radius: 999px; border: 0; background: var(--btn); color: var(--btn-ink); font: 600 16px/1 "Inter", "Noto Sans Devanagari", system-ui, sans-serif; cursor: pointer; }
.tb-page .contact-form-submit:hover { background: var(--btn-hover); }
.tb-chap .contact-card p.contact-note[id] { color: var(--ink); font-weight: 500; }

@media (max-width: 1100px) {
  .ev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tb-chap > .tb-s-contact { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .tb-s-hero { padding-top: 36px; }
  .tb-s-hero .tb-s-h1 { font-size: 38px; }
  .tb-s-hero .tb-s-lede { font-size: 19.5px; }
  .tb-s-hero .tb-s-sub { font-size: 20px; }
  .tb-chap > .tb-s-h2 { font-size: 26px; }
  .tb-chap > .product-list { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .product-card { grid-template-columns: 44px minmax(0, 1fr); padding: 22px 18px 20px; }
  .product-num { width: 44px; height: 44px; font-size: 21px; }
  .product-name { font-size: 20px; }
  .tb-chap > .ad-disclosure, .tb-chap > .flush-box, .tb-chap > .medical-disclaimer { padding: 22px 18px; }
  .ev-grid { grid-template-columns: minmax(0, 1fr); }
  .ev-section .section-title { font-size: 24px; }
  .contact-card { padding: 22px 18px; }
  .tb-page a.contact-email { font-size: 18px; }
}
.tb-page h1, .tb-page h2, .tb-page h3 { overflow-wrap: break-word; }
@media (max-width: 760px) {
  .tb-page h1, .tb-page .tb-chap-title, .tb-page .tb-s-h2, .tb-page .tb-k-h2 { hyphens: auto; -webkit-hyphens: auto; }
  .tb-s-hero .tb-s-h1 { font-size: 35px; }
}
.tb-s-hero .tb-s-intro { margin-top: 20px; max-width: 680px; font-size: 18.5px; line-height: 1.7; color: var(--text); }
.tb-page a.contact-email { font-size: 19.5px; word-break: normal; overflow-wrap: anywhere; }
.tb-k-hero .tb-ah1.is-long { font-size: 44px; }
@media (max-width: 1100px) { .tb-k-hero .tb-ah1.is-long { font-size: 40px; } }
@media (max-width: 760px) {
  .tb-k-hero .tb-ah1.is-long { font-size: 32px; }
  .tb-page a.contact-email { font-size: 17px; }
  .tb-s-hero .tb-s-intro { font-size: 17.5px; }
}
.tb-page .has-kick .tb-k-kick.is-num, .tb-page .tb-chap-title .tb-k-kick.is-num { display: inline; margin: 0 4px 0 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 1em; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--gold-ink); }
.tb-figure img, .tb-ahero-media img, .tb-bio-hero-media img { height: auto; }

/* ==========================================================
   Sprachwahl
   ========================================================== */
.tb-langgroup { position: relative; }
.tb-langmenu { display: none; position: absolute; top: calc(100% + 10px); right: 0; z-index: 36; width: 300px; max-height: min(72vh, 600px); overflow-y: auto; padding: 8px; border-radius: 16px; background: var(--bg-2); border: 1px solid var(--line); box-shadow: var(--shadow); grid-template-columns: 1fr 1fr; gap: 2px; }
.tb-langmenu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.tb-langgroup.is-open .tb-langmenu { display: grid; }
.tb-langgroup.is-open .tb-lang .tb-ico { transform: rotate(180deg); }
.tb-page .tb-langmenu a, .tb-page .tb-navlangs-list a { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 10px; text-decoration: none; color: var(--text); font-size: 14px; line-height: 1.25; white-space: normal; }
.tb-page .tb-langmenu a:hover, .tb-page .tb-navlangs-list a:hover { background: var(--gold-soft); color: var(--ink); }
.tb-page .tb-langmenu a.is-current, .tb-page .tb-navlangs-list a.is-current { background: var(--gold-soft); color: var(--ink); font-weight: 600; }
.tb-langcode { flex: none; min-width: 24px; font-size: 11.5px; font-weight: 700; letter-spacing: 0.08em; color: var(--gold-ink); }
.tb-langname { min-width: 0; overflow-wrap: anywhere; }
.tb-navlangs { display: none; }
@media (max-width: 760px) {
  .tb-header.is-open .tb-navlangs { display: block; margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
  .tb-navlangs-label { display: flex; align-items: center; gap: 8px; padding: 6px 14px; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
  .tb-navlangs-list { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
  .tb-page .tb-header.is-open .tb-navlangs-list a { padding: 11px 14px; font-size: 15px; line-height: 1.25; border-radius: 12px; }
}

/* ==========================================================
   Startseite der anderen Sprachen (heutiger Aufbau im neuen Design)
   ========================================================== */
.tb-lh-hero { padding-top: 72px; padding-bottom: 36px; }
.tb-lh-h1 { margin-top: 6px; max-width: 15ch; }
.tb-lh-hero .tb-lh-lede { max-width: 34ch; }
.tb-lh-hero .tb-jump { max-width: 44em; }
.tb-lh-intro { padding-bottom: 8px; }
.tb-lh-mueller p { margin: 0; }
.tb-lh-toc .toc-eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 8px; font-size: 13px; line-height: 1.2; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-ink); }
.tb-lh-toc .toc-eyebrow::before { content: ""; width: 28px; height: 1.5px; background: var(--gold); display: block; }
.tb-lh-toc .toc-list { list-style: none; margin: 0; padding: 0; }
.tb-lh-toc .toc-list li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 8px; padding: 14px 0; border-top: 1px solid var(--line); font-size: 16px; line-height: 1.5; color: var(--text); }
.tb-lh-toc .toc-list li:first-child { border-top: 0; }
.tb-lh-toc .toc-num { font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 600; font-size: 18px; line-height: 1.35; color: var(--gold-ink); }
.tb-lh-chap { padding-top: 40px; padding-bottom: 32px; }
.tb-chap > .tb-lh-eyebrow { margin: 46px 0 -6px; }
.tb-chap > .tb-lh-eyebrow.is-first { margin-top: 10px; }
.tb-chap > p.tb-lh-arrow { margin-top: -6px; }
.tb-page a.arrow-link { font-weight: 600; text-decoration: none; color: var(--gold-ink); }
.tb-page a.arrow-link:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.tb-chap > .evidence-card { display: flex; flex-direction: column; gap: 8px; padding: 22px 24px; border-radius: 18px; background: var(--bg-2); border: 1px solid var(--line); }
.evidence-card .evidence-eyebrow { margin: 0 0 4px; font-family: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; font-size: 12.5px; line-height: 1.3; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); }
.evidence-card .evidence-row { position: relative; padding-left: 22px; font-size: 16.5px; line-height: 1.55; color: var(--ink); }
.evidence-card .evidence-row::before { content: ""; position: absolute; left: 2px; top: 0.62em; width: 8px; height: 8px; border-radius: 999px; background: var(--gold); }
.tb-chap > .compare-grid { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr); gap: 16px; align-items: center; margin: 6px 0; }
.compare-card { padding: 18px; border-radius: 20px; background: var(--bg-2); border: 1px solid var(--line); }
.compare-eyebrow { margin-bottom: 12px; font-size: 12.5px; line-height: 1.2; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold-ink); }
.compare-thumb { width: 100%; aspect-ratio: 16 / 10; border-radius: 10px; background-color: #fff; background-size: cover; background-position: top center; filter: var(--doc-filter); }
.compare-label { margin-top: 12px; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-size: 18px; line-height: 1.4; color: var(--ink); }
.compare-arrow { width: 56px; height: 56px; border-radius: 999px; border: 1px solid var(--line-2); display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--gold-ink); }
.tb-chap > .doc-grid { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 6px 0; }
.tb-page a.doc-card { display: flex; flex-direction: column; gap: 8px; padding: 16px 16px 18px; border-radius: 18px; background: var(--bg-2); border: 1px solid var(--line); text-decoration: none; color: var(--text); }
.tb-page a.doc-card:hover { border-color: var(--line-2); }
.doc-thumb { width: 100%; aspect-ratio: 4 / 3; border-radius: 10px; background-color: #fff; background-size: cover; background-position: top center; filter: var(--doc-filter); }
.doc-card h3 { margin: 6px 0 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 19px; line-height: 1.3; color: var(--ink); }
.tb-chap .doc-card p { font-size: 15px; line-height: 1.55; }
.doc-card .arrow-link { margin-top: auto; font-size: 14.5px; font-weight: 600; color: var(--gold-ink); }
.tb-chap > .term-note { display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px; border-radius: 16px; background: var(--gold-soft); }
.term-note-icon { flex: none; width: 28px; height: 28px; border-radius: 999px; background: var(--gold); color: var(--bg-2); display: flex; align-items: center; justify-content: center; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-style: italic; font-weight: 700; font-size: 16px; }
.term-note-label { margin-bottom: 6px; font-size: 12.5px; line-height: 1.3; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-ink); }
.tb-chap .term-note p { font-size: 16.5px; line-height: 1.62; }
.term-note strong { color: var(--ink); }
.tb-chap > .preview-block { padding: 24px 26px; border-radius: 20px; background: var(--bg-2); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.preview-block h3 { margin: 0; font-family: "Fraunces", "Noto Serif Devanagari", Georgia, serif; font-weight: 600; font-size: 23px; line-height: 1.25; color: var(--ink); }
.tb-chap .preview-block p { font-size: 16.5px; line-height: 1.62; }
@media (max-width: 1100px) {
  .tb-chap > .doc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .tb-lh-hero { padding-top: 36px; padding-bottom: 24px; }
  .tb-chap > .compare-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .compare-arrow { width: 44px; height: 44px; margin: 0 auto; transform: rotate(90deg); }
  .tb-chap > .doc-grid { grid-template-columns: minmax(0, 1fr); }
  .tb-chap > .preview-block { padding: 20px 18px; }
}
.tb-chap > .tb-s-contact.is-single { grid-template-columns: minmax(0, 1fr); grid-column: 1; }
.tb-anchor { display: block; width: 0; height: 0; overflow: hidden; }

/* ===================== Andere Schriftsysteme (nur für ru, ja, ko, hi, ar eingebunden) ===================== */

/* Kyrillisch: Lora hat eine echte Kursive; lange Wörter dürfen auf dem Handy getrennt werden */
@media (max-width: 760px) {
  .tb-script-cyr .tb-chap > p, .tb-script-cyr .tb-chap li { hyphens: auto; }
}

/* Japanisch, Koreanisch, Hindi, Arabisch: keine künstlich schräggestellte Schrift und keine Laufweite
   (Laufweite zerreißt die verbundenen Buchstaben im Arabischen und die Kopflinie im Hindi) */
.tb-script-ja .tb-page *, .tb-script-ko .tb-page *, .tb-script-hi .tb-page *, .tb-script-ar .tb-page * { font-style: normal !important; letter-spacing: 0 !important; }
/* Betonung, im Deutschen kursiv, hier fett */
.tb-script-ja .tb-page :is(em, i), .tb-script-ko .tb-page :is(em, i), .tb-script-hi .tb-page :is(em, i), .tb-script-ar .tb-page :is(em, i) { font-weight: 700; }

/* Koreanisch: nur an Leerzeichen umbrechen, nicht mitten im Wort */
.tb-script-ko .tb-page { word-break: keep-all; overflow-wrap: break-word; }
/* Japanisch: Überschriften nach Sinneinheiten umbrechen, strenge Zeilenumbruch-Regeln im Text */
.tb-script-ja .tb-page { line-break: strict; }
.tb-script-ja .tb-page :is(h1, h2, h3, h4, .tb-moment, .tb-door-title, .tb-pagenav-title, .tb-quote, .tb-cut-title) { word-break: auto-phrase; }

/* Große Schrift: Arabisch und Hindi brauchen mehr Zeilenabstand (Punkte und Zeichen über und unter der Zeile),
   Japanisch und Koreanisch etwas mehr als die schmale Plakatschrift */
html.tb-script-ar .tb-page :is(.tb-bio-h1, .tb-bio-h1-main, .tb-bio-h1-pre, .tb-bio-h1-post, .tb-cut-title, .tb-door-title, .tb-h1, .tb-ah1) { line-height: 1.32; }
html.tb-script-ar .tb-page :is(p.tb-moment, .tb-chap-title, .tb-k-h2, .tb-k-h3, .tb-s-h2, .tb-bio-sub, .tb-pagenav-title, .tb-longver-title, .tb-vow p, .tb-quote, .pull-quote p, .tb-note-label) { line-height: 1.45; }
html.tb-script-hi .tb-page :is(.tb-bio-h1, .tb-bio-h1-main, .tb-bio-h1-pre, .tb-bio-h1-post, .tb-cut-title, .tb-door-title, .tb-h1, .tb-ah1) { line-height: 1.28; }
html.tb-script-hi .tb-page :is(p.tb-moment, .tb-chap-title, .tb-k-h2, .tb-k-h3, .tb-s-h2, .tb-bio-sub, .tb-pagenav-title, .tb-longver-title, .tb-vow p, .tb-quote, .pull-quote p, .tb-note-label) { line-height: 1.4; }
html.tb-script-ja .tb-page :is(.tb-bio-h1, .tb-bio-h1-main, .tb-cut-title, p.tb-moment, .tb-door-title, .tb-h1, .tb-ah1, .tb-note-label),
html.tb-script-ko .tb-page :is(.tb-bio-h1, .tb-bio-h1-main, .tb-cut-title, p.tb-moment, .tb-door-title, .tb-h1, .tb-ah1, .tb-note-label) { line-height: 1.3; }

/* Menü-Knopf, wenn die Menüleiste nicht passt */
html.tb-navfit-no .tb-nav { display: none; }
html.tb-navfit-no .tb-menubtn { display: inline-flex; }
html.tb-navfit-no .tb-tools { margin-left: auto; }
html.tb-navfit-no .tb-header.is-open .tb-nav { display: flex; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 2px; margin: 0; padding-top: 10px; padding-bottom: 18px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); background: var(--bg-2); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); }
html.tb-navfit-no .tb-page .tb-header.is-open .tb-nav a { padding: 14px; font-size: 16.5px; border-radius: 12px; white-space: normal; }
html.tb-navfit-no .tb-header.is-open .tb-nav { max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px - env(safe-area-inset-top, 0px)); overflow-y: auto; overscroll-behavior: contain; }
html.tb-navfit-no .tb-header.is-open .tb-navgroup { display: flex; flex-direction: column; }
html.tb-navfit-no .tb-page .tb-header.is-open .tb-navbtn { pointer-events: none; padding: 16px 14px 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); background: transparent; }
html.tb-navfit-no .tb-header.is-open .tb-navbtn .tb-ico { display: none; }
html.tb-navfit-no .tb-header.is-open .tb-sub { display: flex; position: static; min-width: 0; padding: 0; border: 0; box-shadow: none; background: transparent; }
html.tb-navfit-no .tb-header.is-open .tb-sub::before { display: none; }
html.tb-navfit-no .tb-page .tb-header.is-open .tb-sub a { padding: 14px; font-size: 16.5px; line-height: 1.2; border-radius: 12px; }
html.tb-navfit-no .tb-page .tb-header.is-open .tb-nav > a { line-height: 1.2; }

/* ===================== Live-Funktionen (aus der bisherigen Seite übernommen) ===================== */
/* Bild-Vergrößerung: Farben und Schriften der bisherigen Seite, unabhängig von hell/dunkel */
.lightbox-overlay { --ink: #2a2218; --gold: #b8893a; --gold-text: #78571f; --gold-soft: #c9a05a;
  --serif: "Fraunces", "Noto Serif Devanagari", "Cormorant Garamond", Georgia, "Times New Roman", serif; --sans: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; }
.lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(20, 18, 14, 0.92);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 40px 24px;
  cursor: zoom-out;
}
.lightbox-overlay.is-open { display: flex; }
.lightbox-frame {
  max-width: min(1200px, 96vw);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  cursor: default;
}
.lightbox-document-stage {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  max-width: 100%;
  max-height: 80vh;
}
.lightbox-document-stage.has-translation {
  box-sizing: border-box;
  padding-top: 58px;
}
.lightbox-document-stage.has-translation img {
  max-height: calc(80vh - 58px);
}
.lightbox-frame img {
  max-width: 100%;
  max-height: 80vh;
  height: auto;
  width: auto;
  background: #fff;
  padding: 8px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.4);
}
.lightbox-translation-toggle {
  position: absolute;
  z-index: 3;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: calc(100% - 36px);
  border: 2px solid var(--gold-soft);
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  color: var(--ink);
  box-shadow: 0 5px 20px rgba(20,18,14,.25);
  padding: 10px 17px;
  font: 700 14px/1.25 var(--sans);
  text-align: center;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.lightbox-translation-toggle:hover {
  border-color: var(--gold);
  background: #fff9e9;
}
.lightbox-translation-toggle:focus-visible {
  border-color: var(--gold);
  background: #fff9e9;
  outline: 3px solid #202020;
  outline-offset: 3px;
}
.lightbox-translation-toggle[aria-pressed="true"] {
  background: var(--gold-text);
  border-color: var(--gold);
  color: #fff;
}
.lightbox-translation-panel {
  position: absolute;
  z-index: 2;
  inset: 8px;
  box-sizing: border-box;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: rgba(255,255,255,.985);
  color: #202020;
  padding: 70px clamp(20px, 5vw, 44px) 34px;
  font-family: var(--sans);
  text-align: left;
}
.lightbox-translation-panel[hidden],
.lightbox-translation-toggle[hidden] {
  display: none;
}
.lightbox-translation-panel .translation-document {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
}
.lightbox-translation-panel:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: -5px;
}
.lightbox-translation-panel h1,
.lightbox-translation-panel h2,
.lightbox-translation-panel h3,
.lightbox-translation-panel h4 {
  color: #167ca4;
  line-height: 1.3;
}
.lightbox-translation-panel h1,
.lightbox-translation-panel h2,
.lightbox-translation-panel h3 {
  margin: 0 0 22px;
  padding-bottom: 9px;
  border-bottom: 2px solid #8ec7dc;
  font-size: clamp(18px, 2.3vw, 24px);
}
.lightbox-translation-panel h1 {
  font-size: clamp(20px, 2.6vw, 28px);
}
.lightbox-translation-panel h4 {
  margin: 24px 0 9px;
  padding-bottom: 5px;
  border-bottom: 1px solid #b8dbe8;
  font-size: clamp(15px, 1.9vw, 19px);
}
.lightbox-translation-panel p,
.lightbox-translation-panel li {
  margin-top: 0;
  font-size: clamp(13px, 1.55vw, 16px);
  line-height: 1.55;
}
.lightbox-translation-panel ul {
  margin: 7px 0 18px;
  padding-left: 22px;
}
.lightbox-translation-panel .translation-key {
  margin-bottom: 22px;
  padding: 14px 16px;
  border-left: 3px solid #48a3c3;
  background: #f3f9fb;
}
.lightbox-translation-panel .translation-key p:last-child {
  margin-bottom: 0;
}
.lightbox-translation-panel code {
  overflow-wrap: anywhere;
  color: inherit;
}
.lightbox-translation-panel table {
  width: 100%;
  margin: 12px 0 22px;
  border-collapse: collapse;
  font-size: clamp(12px, 1.45vw, 15px);
  line-height: 1.45;
}
.lightbox-translation-panel .translation-table-scroll {
  max-width: 100%;
  margin: 12px 0 22px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
}
.lightbox-translation-panel .translation-table-scroll table {
  width: max-content;
  min-width: 100%;
  margin: 0;
}
.lightbox-translation-panel .translation-table-scroll:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 2px;
}
.lightbox-translation-panel th,
.lightbox-translation-panel td {
  padding: 7px 9px;
  border: 1px solid #c8dfe7;
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}
.lightbox-translation-panel th {
  background: #edf7fa;
  font-weight: 700;
}
.lightbox-translation-panel aside,
.lightbox-translation-panel .translation-note {
  margin: 0 0 22px;
  padding: 12px 14px;
  border-left: 3px solid var(--gold);
  background: #fff8e8;
}
.lightbox-translation-panel .source-clip,
.lightbox-translation-panel .source-empty,
.lightbox-translation-panel [data-clipped="true"] {
  color: #695f52;
  font-style: italic;
}
.lightbox-translation-panel .graph-signal {
  padding: 10px 12px;
  border-left: 3px solid #8ec7dc;
  background: #f3f9fb;
}
.lightbox-caption {
  color: #f3ecdc;
  font-family: var(--serif);
  font-style: italic;
  font-size: 15px;
  text-align: center;
  max-width: 700px;
  line-height: 1.5;
}
.lightbox-close {
  position: absolute;
  top: 18px;
  right: 22px;
  background: transparent;
  border: 1px solid rgba(243, 236, 220, 0.4);
  color: #f3ecdc;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.15s, background 0.15s;
}
.lightbox-close:hover {
  border-color: var(--gold-soft);
  background: rgba(243, 236, 220, 0.08);
}
.lightbox-close:focus-visible,
.lightbox-nav:focus-visible {
  outline: 3px solid #fff !important;
  outline-offset: 3px;
  border-color: var(--gold-soft) !important;
}
@media (max-width: 640px) {
  .lightbox-overlay { padding: 54px 10px 22px; }
  .lightbox-prev {
    left: 8px !important;
  }
  .lightbox-next {
    right: 8px !important;
  }
  .lightbox-nav {
    width: 40px !important;
    height: 40px !important;
  }
  .lightbox-translation-toggle {
    top: 6px;
    max-width: calc(100% - 24px);
    padding: 9px 13px;
    font-size: 12px;
  }
  .lightbox-document-stage.has-translation {
    padding-top: 52px;
  }
  .lightbox-document-stage.has-translation img {
    max-height: calc(80vh - 52px);
  }
  .lightbox-translation-panel {
    padding: 62px 16px 24px;
    scrollbar-gutter: auto;
  }
  .lightbox-translation-panel p,
  .lightbox-translation-panel li {
    font-size: 13px;
  }
}
.skip-link {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.skip-link:focus {
  position: fixed;
  inset-block-start: .75rem;
  inset-inline-start: .75rem;
  width: auto;
  height: auto;
  margin: 0;
  padding: .65rem 1rem;
  overflow: visible;
  clip-path: none;
  background: #fff;
  color: #3a2f24;
  outline: 2px solid #3a2f24;
  outline-offset: 2px;
  z-index: 2000;
  white-space: normal;
}
/* Bilder, die sich per Klick vergrößern */
.tb-page a.tb-zoom { display: block; cursor: zoom-in; color: inherit; text-decoration: none; }
.tb-page a.tb-zoom img { display: block; }
/* Sprungziele auf der Unterlagen-Seite nicht unter der Kopfzeile verstecken */
.tb-anchor-target { scroll-margin-top: 96px; }
/* Bestätigung nach dem Absenden des Kontaktformulars */
.tb-chap .contact-card p.contact-form-success { margin: 0; padding: 12px 14px; border-inline-start: 3px solid var(--gold); border-radius: 10px;
  background: var(--gold-soft); color: var(--ink); font-weight: 500; }