/* Focus Medical · Originalwerte aus docs/claude-design/tokens/.
   Freigegebene Abweichungen und ergänzte Bausteinmaße: DESIGN.md. */
:root {
  --surface: #fffdf9;
  --surface-soft: #f6f1ea;
  --surface-dark: #2a211d;
  --ink: #3d322c;
  --ink-strong: #1f1715;
  --ink-muted: #7a6a5f;
  --lead-ink: var(--ink-muted);
  --icon: #5a4c44;
  --on-dark: #fffdf9;
  --on-dark-muted: #e3d6c8;
  --booking-light-ink: #ffffff;
  --booking-ink: var(--booking-light-ink);
  --booking-hover-background: color-mix(in srgb, var(--booking-background), var(--ink-strong) var(--booking-hover-mix));
  /* Verbindliche Buchungsfarbe: Espresso, Entscheidung 24.09.2026. */
  --booking-background: var(--surface-dark);
  --booking-hover-mix: 16%;
  --booking-height: var(--touch); --booking-max: 440px;
  --booking-weight: var(--body-weight); --booking-note-ink: var(--ink-muted);
  --booking-arrow-shift: 2px;
  --chevron-down: 90deg;
  --line: #e6dccf;
  --line-soft-light: color-mix(in srgb, var(--line) 50%, transparent);
  --line-soft: var(--line-soft-light);
  --line-soft-dark: rgba(255,253,249,.15);
  --sand-50: #fbf8f2;
  --sand-100: #f4ede2;
  --sand-200: #eadfd0;
  --sand-300: #dccbb6;
  --earth-300: #c9ad95;
  --earth-500: #9a7e6f;
  --earth-700: #5c4a40;
  --terra-300: #e2b394;
  --terra-500: #c07a52;
  --terra-700: #8e4a2c;

  --font-family: 'Plus Jakarta Sans', Manrope, system-ui, sans-serif;
  --hero-size: 52px; --hero-weight: 300; --hero-line: 1.06; --hero-tracking: -0.03em;
  --display-size: 40px; --display-weight: 300; --display-line: 1.1; --display-tracking: -0.025em;
  --display-mobile-size: 30px; --display-mobile-weight: 300; --display-mobile-line: 1.12; --display-mobile-tracking: -0.025em;
  --headline-size: 30px; --headline-weight: 300; --headline-line: 1.2; --headline-tracking: -0.02em;
  --headline-mobile-size: 24px; --headline-mobile-weight: 300; --headline-mobile-line: 1.2; --headline-mobile-tracking: -0.02em;
  --title-size: 18px; --title-weight: 400; --title-line: 1.35; --title-tracking: -0.01em;
  --lead-size: 17px; --lead-weight: 400; --lead-line: 1.55;
  --body-size: 16px; --body-weight: 400; --body-line: 1.65;
  --small-size: 14px; --small-weight: 400; --small-line: 1.5;
  --eyebrow-size: 12px; --eyebrow-weight: 500; --eyebrow-line: 1.5; --eyebrow-tracking: 0.12em;
  --caption-size: 12px; --caption-weight: 400; --caption-line: 1.5;
  --button-size: 16px; --button-weight: 500; --button-line: 1.2; --button-tracking: -0.1px;
  --nav-size: 15px; --nav-weight: 400; --nav-title-weight: 500;
  --input-size: 16px; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700;

  --radius-sm: 12px; --radius-md: 20px; --radius-lg: 32px; --radius-pill: 999px;
  --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px;
  --space-5: 40px; --space-6: 48px; --space-7: 56px; --space-8: 80px; --space-9: 120px;
  --content-max: 1280px; --gutter: 16px; --measure: 65ch; --hero-measure: 760px;
  --control-sm: 40px; --control-md: 48px; --control-lg: 56px; --touch: 44px;
  --input-padding: 20px; --input-multiline-min: 120px; --badge-y: 6px; --badge-x: 14px;
  --icon-size: 24px; --icon-small: 16px; --icon-circle-small: 36px; --icon-circle-large: 64px;
  --logo-size: 48px; --logo-min: 40px; --brand-measure: 15ch;
  --hairline: 1px; --focus-width: 2px; --focus-offset: 4px; --link-width: 1.5px; --link-offset: 3px;
  --focus-ring: 0 0 0 2px var(--surface), 0 0 0 4px var(--ink);
  --shadow-sm: 0 1px 4px rgba(42,33,29,.05), 0 0 8px rgba(42,33,29,.08);
  --shadow-md: 0 4px 32px rgba(42,33,29,.06), 0 8px 48px rgba(42,33,29,.06);
  --shadow-lg: 0 16px 32px rgba(42,33,29,.1), 0 95px 140px rgba(42,33,29,.12);
  --shadow-booking: 0 -4px 32px rgba(42,33,29,.06), 0 -8px 48px rgba(42,33,29,.06);
  --secondary-line: inset 0 0 0 1px var(--earth-300);
  --header-surface: var(--surface); --backdrop: rgba(42,33,29,.6);
  --grad-sand: linear-gradient(180deg,#fbf8f2 0%,#eadfd0 100%);
  --grad-sand-diagonal: linear-gradient(135deg,#fbf8f2 0%,#e9dccb 60%,#dccbb6 100%);
  --grad-gold-mist: radial-gradient(120% 90% at 85% 10%,rgba(220,203,182,.35) 0%,rgba(220,203,182,0) 60%),radial-gradient(90% 70% at 10% 100%,rgba(226,179,148,.35) 0%,rgba(226,179,148,0) 60%),linear-gradient(180deg,#fbf8f2 0%,#f4ede2 100%);
  --grad-warm: radial-gradient(100% 120% at 100% 0%,#e2b394 0%,rgba(226,179,148,0) 55%),linear-gradient(160deg,#f4ede2 0%,#dccbb6 100%);
  --grad-terra: linear-gradient(160deg,#e2b394 0%,#c07a52 100%);
  --grad-espresso: linear-gradient(180deg,#3d322c 0%,#2a211d 100%);
  --grad-photo-protect: linear-gradient(0deg,rgba(42,33,29,.78) 0%,rgba(42,33,29,.38) 45%,rgba(42,33,29,0) 75%);

  --ease-out: cubic-bezier(.2,.7,.2,1);
  --duration-color: 150ms; --duration-accordion: 250ms; --duration-hover: 400ms;
  --duration-tint: 500ms; --duration-reveal: 600ms; --duration-image: 700ms;
  --reveal-stagger-1: 80ms; --reveal-stagger-2: 160ms; --reveal-distance: 12px;
  --lift-small: -1px; --lift-button: -2px; --lift-card: -4px; --link-shift: 4px;
  --image-zoom: 1.04; --icon-zoom: 1.08;
  --parallax-scale: 1.12; --parallax-speed: .22; --parallax-travel: .05;
  --shape-leaf: 48% 12% 48% 12% / 48% 12% 48% 12%;
  --shape-leaf-r: 12% 48% 12% 48% / 12% 48% 12% 48%;
  --shape-soft: var(--radius-lg) var(--radius-lg) var(--radius-lg) 40%;
  --shape-pebble: 42% 58% 52% 48% / 52% 44% 56% 48%;

  /* Inline-Maße der Originalbausteine zentral, nicht im Seiten-CSS. */
  --white-70: rgba(255,253,249,.7);
  --blob-peach: rgba(226,179,148,.45); --blob-sand: rgba(220,203,182,.55); --blob-peach-soft: rgba(226,179,148,.25);
  --blob-blur: 80px; --blob-front-size: 56vw; --blob-front-max: 720px;
  --blob-front-right: -14vw; --blob-front-top: -18vw;
  --blob-back-size: 44vw; --blob-back-max: 560px; --blob-back-left: -12vw; --blob-back-bottom: -16vw;
  --gap-compact: 6px; --gap-icon: 10px; --gap-card: 12px; --gap-detail: 14px; --gap-facts: 28px;
  --icon-tiny: 13px; --icon-anchor: 18px; --icon-info: 20px; --icon-topic: 22px; --icon-hero: 36px;
  --icon-circle-trust: 44px; --icon-circle-hero: 72px;
  --hero-landing-min: 440px; --hero-content-min: 420px; --hero-image-max: 640px;
  --hero-fluid-size: 5vw; --content-fluid-size: 4vw; --hero-lead-measure: 36em;
  --ratio-landing: 4 / 5; --hero-image-position: center;
  --conversation-min: 300px; --conversation-portrait-max: 360px; --conversation-point-min: 200px;
  --conversation-portrait-position: center 20%; --conversation-lead-measure: 32em; --notice-measure: 40em;
  --faq-column-min: 340px; --faq-answer-end: 52px; --faq-answer-start: 56px;
  --medical-team-column-min: 380px; --doctor-placeholder-size: 96px;
  --texture-opacity: .35; --texture-saturation: .7;
  --texture-overlay: linear-gradient(180deg,rgba(42,33,29,.55) 0%,rgba(42,33,29,.85) 100%);
  --trust-line: 1.4;

  /* Abschnitt 2 · Originalmaße aus content/, trust/, explain/ und diagrams/. */
  --fact-min: 180px; --fact-size-min: 36px; --fact-size-fluid: 4vw; --fact-size-max: 48px;
  --fact-line: 1; --fact-label-line: 1.4; --icon-stat: 30px; --icon-principle: 32px; --icon-scope: 26px;
  --glass-dark: rgba(255,253,249,.06);
  --segment-spot-size: 112px; --spot-ground: #f6efe4;
  --gallery-column-min: 320px; --gallery-pair-min: 260px; --gallery-image-min: 280px;
  --gallery-strip-height: 460px; --gallery-strip-compact: 340px;
  --gallery-label-bg: rgba(255,253,249,.88); --gallery-label-blur: 6px;
  --quote-mark-size: 160px; --quote-mark-top: -18px; --quote-mark-color: rgba(154,126,111,.35);
  --quote-size-min: 20px; --quote-size-fluid: 2.2vw; --quote-size-max: 26px;
  --quote-tracking: -.3px; --quote-line: 1.4; --quote-measure: 30em;
  --founder-column-min: 360px; --founder-measure: 38em; --founder-focus: center 25%;
  --location-column-min: 340px; --principle-column-min: 240px; --read-more-column-min: 260px;
  --ratio-square: 1 / 1; --ratio-read-more: 16 / 10;
  --invoice-max: 560px;

  /* Abschnitt 3 · Erklärgrafiken, Originalfarben und Animationswerte. */
  --blood: #b56a45; --plasma: #f0dfc7;
  --diagram-device: #e9dccb; --blood-return: #c9a58a; --blood-tube-ground: #d9a98c;
  --diagram-flow: rgba(255,253,249,.85); --diagram-label-line: rgba(61,50,44,.06);
  --diagram-dark-line: rgba(255,253,249,.15); --diagram-dark-surface: rgba(255,253,249,.05);
  --diagram-dark-icon: rgba(255,253,249,.08); --diagram-white: rgba(255,253,249,.75);
  --diagram-column-min: 380px; --diagram-label-size: 11.5px; --diagram-line: 1.5;
  --diagram-caption-measure: 60ch; --diagram-label-weight: 600;
  --diagram-stroke: 1.5; --diagram-stroke-strong: 2; --diagram-tube-stroke: 6; --diagram-flow-stroke: 3;
  --diagram-flow-dash: 10 30; --diagram-flow-slow-dash: 8 32; --diagram-flow-offset: -40;
  --diagram-flow-duration: 2.4s; --diagram-flow-slow-duration: 3.6s;
  --diagram-pulse-duration: 2.8s; --diagram-spin-duration: 6s; --diagram-fill-duration: 1.6s;
  --diagram-pulse-low: .35; --diagram-pulse-high: .7; --diagram-pulse-scale: 1.25;
  --timeline-dash: 4 20; --timeline-line: 2px;
  --aftercare-size: 320px; --aftercare-stroke: 18;
  --aftercare-month-size: 11px; --aftercare-number-tracking: -1.5px;
  --aftercare-step-delay: 140ms; --aftercare-fade-duration: 500ms;
  --blood-tube-width: 96px; --blood-tube-fill-duration: 2.4s; --blood-tube-fill-delay: 400ms;
  --blood-key-size: 14px; --blood-key-radius: 4px; --blood-copy-measure: 40ch;
  --day-column-min: 220px; --flow-column-min: 200px; --flow-arrow-offset: -22px;
  --flow-pulse-duration: 3.2s; --flow-pulse-delay: 500ms;
  --evidence-table-min: 560px; --source-number-size: 28px;

  /* Technische Layout-Tokens. Medienabfragen stehen in em, da var() dort
     ohne Build-Schritt nicht unterstützt wird: 48em / 64em / 75em. */
  --columns: 4; --grid-gap: var(--space-2); --page-gutter: var(--gutter);
  --section-space: var(--space-7); --card-padding: var(--space-3); --tile-padding: var(--space-3);
  --split-min: 320px; --card-min: 280px; --dropdown-width: 320px;
  --header-height: 80px; --header-scroll-threshold: 40;
  --anchor-offset: calc(var(--header-height) + var(--space-3));
  --photo-hero-min: 640px; --photo-band-min: 400px; --photo-text-max: 560px;
  --ratio-image: 4 / 3; --ratio-wide: 16 / 9; --ratio-portrait: 3 / 4; --ratio-strip: 3 / 1;
  --z-header: 30; --z-booking: 20; --z-dropdown: 10; --z-skip: 100;
  --booking-clearance: var(--mobile-booking-fallback);
}
@media (min-width: 48em) {
  :root {
    --columns: 8; --grid-gap: var(--space-3); --page-gutter: var(--space-4);
    --section-space: var(--space-8); --card-padding: var(--space-4); --tile-padding: var(--space-6);
  }
}
@media (min-width: 75em) { :root { --columns: 12; } }

/* Baukasten: verbindliches Layout-System, ausschließlich Skalen-Abstände. */
:root {
  --section-pad: var(--space-7); --parallax-pad: var(--space-8);
  --stack-eyebrow: var(--space-1); --stack-lead: var(--space-2); --stack-head: var(--space-6);
  --stack-block: var(--space-6); --stack-card: var(--space-2); --stack-prose: var(--space-2);
  --card-gap: var(--space-3); --card-pad: var(--space-4); --list-gap: var(--space-2);
  --band-pad: var(--space-4);
  --hero-pad: var(--space-3); --hero-gap: var(--space-3); --control-pad: var(--space-3);
  --content-narrow: 800px; --bk-header-height: 80px; --header-gap: var(--space-1);
  --header-brand-gap: var(--space-2); --header-nav-gap: calc(var(--space-1) / 2);
  --header-nav-padding: var(--space-2); --header-chevron-gap: calc(var(--space-1) / 2);
  /* 12–16 px zwischen 1280 und 1360 px; sechs Pillen sparen an der Schwelle 48 px. */
  --header-desktop-nav-padding: clamp(12px, calc(5vw - 52px), var(--header-nav-padding));
  --header-menu-max: var(--content-narrow);
  --header-top-size: var(--small-size);
  /* CSS-Medienabfragen können keine var()-Werte nutzen; 80em in baukasten.css. */
  --header-nav-breakpoint: 80em;
  --header-control-padding-y: var(--space-1); --header-control-padding-x: var(--space-2);
  --header-panel-padding: var(--space-2); --header-panel-gap: 0px; --header-subgroup-indent: 0px;
  --header-entry-line: 1.5; --header-entry-copy-height: calc(var(--nav-size) * var(--header-entry-line) * 2);
  --header-entry-height: calc(var(--header-entry-copy-height) + var(--header-control-padding-y) * 2);
  --header-subgroup-gap: var(--space-2);
  --footer-section-gap: var(--space-6); --footer-copy-gap: var(--space-2);
  --calendar-columns: 7; --step-progress-height: 4px; --step-card-height: 112px;
  --hero-mobile-photo: 112px; --hero-desktop-photo: 540px; --hero-viewport-photo: 60svh;
  --hero-button-size: 17px; --hero-photo-focus: center 30%;
  --hero-landing-photo-min: 160px; --hero-landing-photo-max: 240px; --hero-landing-photo-height: 28svh;
  --hero-landing-photo-focus: center 24%;
  --bk-muted: var(--ink-muted); --bk-icon: var(--earth-700); --bk-card: var(--surface);
  --bk-circle: var(--grad-sand); --bk-line: var(--line); --bk-link: var(--earth-300);
  --bk-shadow: var(--shadow-sm); --bk-secondary: var(--sand-100); --bk-secondary-ink: var(--ink);
  --bk-spot-ground: var(--spot-ground); --bk-spot-line: var(--earth-500);
  --bk-veil: linear-gradient(180deg,rgba(251,248,242,.88),rgba(244,237,226,.94));
  --bk-veil-dark: linear-gradient(180deg,rgba(42,33,29,.76),rgba(42,33,29,.9));
  --bk-white-8: rgba(255,253,249,.08); --bk-white-15: rgba(255,253,249,.15);
  --bk-white-50: rgba(255,253,249,.5); --bk-photo-opacity: .35;
  --bk-grid-min: 240px; --bk-map-min: 420px; --bk-map-ratio: 560 / 552; --bk-signature-width: 220px; --bk-table-first: 30%;
  --bk-timeline-stroke: 2; --bk-flow-zero: 0;
  --bk-map-copy-share: 1fr; --bk-map-share: 2fr;
  --topic-columns: 4; --topic-ratio: 4 / 3;
  --breadcrumb-height: calc(var(--space-4) + var(--touch));
  --photo-tile-sizes: '(min-width: 1200px) 300px, (min-width: 1024px) 25vw, 56.25vw';
  --photo-offset-sizes: '(min-width: 1344px) max(628px, DESKTOP_CROP), (min-width: 1024px) max(calc((100vw - 88px) / 2), DESKTOP_CROP), (min-width: 768px) max(calc(100vw - 64px), MOBILE_CROP), max(calc(100vw - 32px), MOBILE_CROP)';
  --photo-split-sizes: '(min-width: 1200px) 568px, (min-width: 768px) 50vw, 100vw';
  --photo-portrait-sizes: '(min-width: 768px) 810px, 100vw';
  --photo-gallery-sizes: '(min-width: 1200px) 1136px, (min-width: 768px) 100vw, 200vw';
  --photo-square-sizes: '(min-width: 1200px) 852px, (min-width: 768px) 75vw, 150vw';
  --photo-full-sizes: '100vw';
  --photo-parallax-sizes: '(min-width: 768px) 112vw, 100vw';
}
.fm-baukasten { --header-height: var(--bk-header-height); --grid-gap: var(--space-3); }
@media (min-width: 48em) {
  :root { --section-pad: var(--space-8); --parallax-pad: var(--space-9); --hero-gap: var(--space-6); --hero-pad: var(--space-6); }
}

@media (max-width: 47.999em) and (max-height: 45em) {
  .fm-baukasten { --hero-mobile-photo: var(--space-8); --hero-gap: var(--space-2); }
}

/* Runde 2 · Baustein-Dokumentation in DESIGN.md. */
:root { --placeholder-measure: 32ch; }

/* Runde 3b · Kapitel und Luft (DESIGN.md, Layout-System „Kapitel“).
   Drei große Skalenstufen ergänzen die Abstandsskala. */
:root {
  --space-10: 128px; --space-11: 160px; --space-12: 192px;
  --chapter-pad: var(--space-8); --flow-gap: var(--section-separation); --bundle-gap: var(--section-separation);
  --chapter-min: 50svh;
  --centered-measure: 38rem; --centered-head-gap: var(--space-6);
  --section-heading-size: clamp(2rem, 1.25rem + 2.5vw, 3.5rem);
  --section-heading-line: var(--display-mobile-line);
  --split-heading-size: clamp(2rem, 1.5rem + 1vw, 2.5rem);
  --split-heading-line: var(--display-mobile-line);
  --split-heading-columns: minmax(0, 2fr) minmax(0, 3fr);
  --recognition-quote-size: var(--headline-mobile-size);
  --section-lead-size: clamp(1.2rem, 1.15rem + .15vw, 1.3rem);
  --section-lead-gap: var(--space-3);
  --page-hero-size: clamp(2.25rem, 1.5rem + 3vw, 4rem);
  --centered-heading-measure: 52rem;
  --overview-pad: var(--space-3); --overview-width: var(--content-narrow);
  --further-column-min: var(--card-min); --further-gap: var(--space-4);
  --further-head-size: var(--headline-mobile-size);
  --split-group-gap: var(--bundle-gap);
}
@media (min-width: 48em) {
  :root { --chapter-pad: var(--space-10); --overview-pad: var(--space-5); --further-gap: var(--space-6); }
}
@media (min-width: 75em) {
  :root { --chapter-pad: var(--space-11); }
}

/* R4-8 · Abschnittsfolge. Werte auch für den statischen Renderer lesbar. */
:root {
  --centered-lead-words: 25; --overview-teaser-words: 20;
  --section-inner-max: var(--space-6);
  --section-separation: calc(var(--section-inner-max) * 2);
  --section-divider: var(--hairline);
  --section-divider-color: var(--bk-line);
  --section-divider-offset: var(--section-inner-max);
  --service-columns: 2;
  --mobile-booking-fallback: calc(var(--touch) + var(--space-3) + var(--caption-size) * var(--caption-line) + env(safe-area-inset-bottom));
}

/* R4-9 · Kompositionspilot, bestehende Farben/Typografie bleiben unverändert. */
:root {
  --composition-edge: max(var(--page-gutter), calc((100cqw - var(--content-max)) / 2));
  --composition-columns: 4;
  --composition-gap: var(--space-2);
  --composition-offset-height: 560px;
  --composition-offset-mobile-height: 400px;
  --composition-offset-padding: 64px;
  --composition-offset-inline-padding: 64px;
  --composition-copy-min: 480px;
  --composition-copy-max: 640px;
  --composition-offset-mobile-padding: var(--space-6);
  --next-step-columns: repeat(2, minmax(0, 1fr));
  --chapter-transition-pad: calc(var(--chapter-pad) / 2);
  --composition-sticky-top: calc(var(--bk-header-height) + var(--space-4));
  --composition-statement-size: var(--page-hero-size);
  --composition-statement-words: 12;
  --composition-statement-long-size: var(--split-heading-size);
  --composition-bento-ratio: var(--ratio-strip);
  --composition-bleed-ratio: var(--ratio-wide);
}
@media (min-width: 48em) {
  :root { --composition-columns: 12; --composition-gap: var(--space-3); }
}
@media (min-width: 75em) {
  :root { --composition-offset-padding: 96px; }
}

/* R4-11 · Kartenfamilie, Wortgrenzen und randlose Bildaussagen. */
:root {
  --heading-words: 10;
  --statement-heading-words: 20;
  --lead-words: 40;
  --composition-bleed-max: 60vh;
  --section-split-threshold: 70%;
  --card-action-surface: var(--grad-sand);
  --card-action-shadow: 0 1px 3px rgba(42,33,29,.025), 0 4px 20px rgba(42,33,29,.045);
  --card-action-hover-shadow: 0 2px 4px rgba(42,33,29,.04), 0 8px 28px rgba(42,33,29,.07);
  --card-action-dark-surface: var(--surface);
  --bleed-overlay: linear-gradient(0deg, rgba(42,33,29,.92), rgba(42,33,29,.78));
}

/* R4-12: Rasterkarten, kompakte Bänder und das ruhige Seitenende. */
:root {
  --card-heading-size: var(--title-size);
  --card-heading-line: var(--title-line);
  --card-heading-weight: var(--title-weight);
  --card-heading-tracking: var(--title-tracking);
  --card-heading-lines: 2;
  --band-columns: minmax(0, 2fr) minmax(0, 1fr);
  --faq-row-height: 72px;
  --faq-row-padding: var(--space-2);
  --footer-link-columns: 2;
  --footer-desktop-columns: 5;
  --footer-portrait-size: var(--space-8);
  --photo-footer-sizes: 96px;
  --footer-column-gap: var(--space-5);
  --footer-person-columns: var(--footer-portrait-size) minmax(0, 1fr);
  --footer-conversation-columns: minmax(0, 7fr) minmax(0, 5fr);
  --footer-bottom-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr));
  --booking-inverse-background: var(--surface);
  --booking-inverse-ink: var(--surface-dark);
  --booking-inverse-hover: var(--sand-100);
}

/* R4-17: Personenporträts und Icons außerhalb der gemeinsamen Textkante. */
:root {
  --team-portrait-ratio: var(--ratio-portrait);
  --team-visible-cards: 1.15;
  --team-mobile-card-width: 85vw;
  --team-mobile-portrait-height: 360px;
  --team-visible-cards-desktop: 2.5;
  --team-card-columns: minmax(0, 2fr) minmax(0, 3fr);
  --team-card-padding: var(--space-2);
  --team-fade-width: var(--space-4);
  --team-fade-start: var(--team-fade-width);
  --team-fade-end: var(--team-fade-width);
  --team-fade-none: 0px;
  --team-dot-size: var(--space-1);
  --team-mask-ink: #000;
  --team-disabled-opacity: .5;
  --hanging-icon-gap: var(--space-1);
  --hanging-icon-size: min(var(--icon-circle-small), calc(min(var(--page-gutter), var(--grid-gap)) - var(--hanging-icon-gap)));
}

/* R4-25: Mindestmaße gelten auch in verschachtelten, schmalen Rastern. */
:root {
  --related-card-min: var(--card-min);
  --card-grid-min: var(--bk-grid-min);
  --card-grid-two: repeat(auto-fit, minmax(min(100%, max(var(--card-grid-min), calc((100% - var(--grid-gap)) / 2))), 1fr));
  --card-grid-three: repeat(auto-fit, minmax(min(100%, max(var(--card-grid-min), calc((100% - var(--grid-gap) * 2) / 3))), 1fr));
  --footer-column-min: 160px;
}

@media (min-width: 48em) { :root { --step-card-height: 160px; } }

/* R4-O · Regeln 28–33: Bildkante, Fakt-Badges und lokale Handschrift. */
:root {
  --chapter-pad: var(--space-8);
  --section-inner-max: var(--space-4);
  --font-handwritten: 'Caveat', cursive;
  --handwritten-size: 28px; --handwritten-weight: 500; --handwritten-line: 1.15;
  --handwritten-angle: -4deg; --handwritten-arrow-angle: 12deg;
  --handwritten-up-angle: -150deg;
  --handwritten-down-angle: 100deg;
  --handwritten-arrow-width: 96px; --handwritten-arrow-height: 48px;
  --fact-badge-bg: rgba(42,33,29,.85); --fact-badge-ink: var(--on-dark);
  --fact-badge-blur: 12px; --fact-badge-inset: 12px;
  --fact-badge-size: var(--small-size); --fact-badge-label-size: var(--caption-size);
  --hero-edge-fade: 120px; --hero-edge-surface: var(--surface);
  --hero-edge-mobile-height: 180px; --hero-edge-mobile-short: 96px;
  --hero-edge-half: 50%; --hero-edge-focus: 60% center;
  --photo-edge-sizes: '(max-width: 767px) 100vw, 50vw';
}
@media (max-width: 47.999em) {
  :root { --stack-head: var(--space-4); --stack-block: var(--space-4); --centered-head-gap: var(--space-4); }
}
@media (min-width: 48em) {
  :root { --chapter-pad: 96px; --section-inner-max: var(--space-6); }
}
@media (min-width: 75em) { :root { --chapter-pad: var(--space-9); } }
