:root {
  --navy: #17223b;
  --navy-deep: #0f182b;
  --paper: #f8f5ef;
  --cream: #f2ede5;
  --white: #fffdfa;
  --ink: #062d33;
  --muted: #5f6665;
  --clay: #17223b;
  --orange-readable: #ff9a82;
  --orange-signal: #c73b1e;
  --orange-cta: #ff5c38;
  --orange-soft: #ffd9cf;
  --mint: #f2ede5;
  --border: #d8d2c8;
  --line: #d8d2c8;
  --line-inverse: rgba(255, 255, 255, .2);
  --display: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --serif: var(--display);
  --sans: var(--display);
  --gutter: clamp(1.25rem, 4vw, 7rem);
  --section: clamp(4.75rem, 8vw, 8.5rem);
  --radius: 1rem;
  --ease: cubic-bezier(.22, 1, .36, 1);
  /* Interaktionssystem: Hover = Absicht, Pressed = Bestaetigung,
     Selected = dauerhafter Zustand. Besuchte Links behalten ihre Grundfarbe. */
  --interaction-hover-bg: var(--navy);
  --interaction-hover-fg: var(--white);
  --interaction-selected-bg: var(--orange-soft);
  --interaction-selected-fg: var(--ink);
  --interaction-selected-line: var(--orange-signal);
  --motion-fast: 180ms;
  --motion-control: 240ms;
  --press-scale: .985;
  /* Kontextzeilen: kleiner als Fliesstext, aber nie dekorativ winzig. */
  --context-label-size: clamp(.75rem, .82vw, .875rem);
  --context-label-leading: 1.35;
  --context-label-tracking: .075em;
  --max: 1600px;
  --rail-width: 88px;

  /* Typo-Leiter T1-T6 (SIGNATURE_COMPONENT_SYSTEM.md §3.1).
     Vorher definierte jede Komponente ihre eigene clamp()-Groesse; auf der
     Startseite ergab das acht Ueberschriftengroessen ohne gemeinsame Stufung. */
  --t1: clamp(1.1rem, 1.85vw, 1.62rem);     /* Masthead-Statement, Mono */
  --t2-display: clamp(2.75rem, 5.2vw, 5.25rem); /* Seitenaussage, genau 1 pro Seite */
  --t2: clamp(2.1rem, 3.4vw, 3.4rem);       /* Sektionstitel */
  --t3: clamp(1.5rem, 2.1vw, 2.05rem);      /* Index-Zeilen, Kapitel, Werte-Panels */
  --t4: clamp(1.15rem, 1.4vw, 1.4rem);      /* Kartentitel und Lead-Absatz */
  --t6: .75rem;                              /* Mono-Label */

  /* Drei Buehnen. --white und --cream bleiben als Element-Oberflaechen
     erhalten, sind aber keine Sektionsflaechen mehr. */
  --stage-paper: #f8f5ef;
  --stage-navy: #17223b;
  --stage-signal: #ff5c38;

  /* Abstandsskala */
  --s1: 8px; --s2: 16px; --s3: 32px; --s4: 64px;
  --s5: clamp(80px, 8vw, 136px);
  --s6: clamp(120px, 12vw, 200px);
}

* { box-sizing: border-box; }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
@font-face {
  font-family: "Manrope";
  src: url("./assets/fonts/manrope-latin.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  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: "IBM Plex Mono";
  src: url("./assets/fonts/IBMPlexMono-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("./assets/fonts/IBMPlexMono-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Manrope";
  src: url("./assets/fonts/manrope-latin-ext.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  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;
}
body {
  margin: 0;
  padding-right: var(--rail-width);
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  font-size: clamp(1rem, .98rem + .1vw, 1.0625rem);
  font-weight: 400;
  line-height: 1.62;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
img, video { display: block; max-width: 100%; }
img { width: 100%; }
picture { display: contents; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
main:focus { outline: none; }

:focus-visible {
  outline: 3px solid var(--white);
  outline-offset: 4px;
  box-shadow: 0 0 0 6px var(--ink);
}
.skip-link {
  position: fixed;
  z-index: 100;
  top: .75rem;
  left: .75rem;
  padding: .7rem 1rem;
  color: white;
  background: var(--navy);
  transform: translateY(-180%);
  transition: transform .2s var(--ease);
}
.skip-link:focus { transform: translateY(0); }
.page-shell { max-width: var(--max); margin: 0 auto; overflow: clip; background: var(--paper); }

/* Full-screen navigation overlay; the visible masthead and rail are defined below. */
.mobile-menu {
  position: fixed;
  z-index: 25;
  inset: 0;
  padding: 7rem var(--gutter) 3rem;
  display: grid;
  place-items: center;
  color: white;
  background: var(--navy-deep);
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s var(--ease), visibility .4s;
}
.mobile-menu.is-open { opacity: 1; visibility: visible; }
.mobile-menu nav { display: flex; flex-direction: column; align-items: center; gap: .45rem; }
.mobile-menu a { font-family: var(--serif); font-size: clamp(1.85rem, 6vw, 3.25rem); line-height: 1.12; transition: color .25s, transform .25s var(--ease); }
.mobile-menu a:hover { color: var(--orange-readable); transform: translateX(.15em); }
.mobile-menu a[aria-current="page"] { color: var(--orange-readable); text-decoration: underline; text-decoration-thickness: .08em; text-underline-offset: .16em; }
.mobile-menu a:focus-visible { outline: 3px solid var(--orange-readable); outline-offset: .18em; }

/* Shared type and controls */
.section { padding: var(--section) var(--gutter); }
.section-label {
  margin-bottom: 2rem;
  display: block;
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .075em;
  line-height: 1.35;
}
.big-serif { margin: 0; font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .9; letter-spacing: -.07em; }
.button-row { display: flex; flex-wrap: wrap; gap: .65rem; }
.button {
  min-height: 46px;
  padding: .75rem .9rem;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: .77rem;
  font-weight: 650;
  transition: color .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
}
.button .arrow { font-size: 1rem; transition: transform .35s var(--ease); }
.button:hover { transform: translateY(-2px); }
.button:hover .arrow { transform: translateX(4px); }
.button--orange { color: var(--ink); background: var(--orange-cta); border-color: var(--orange-cta); }
.button--dark { color: white; background: var(--navy); border-color: var(--navy); }
.button--light { color: var(--navy); background: white; border-color: white; }
.button--outline { background: transparent; }
.button--orange:hover, .button--outline:hover { color: white; background: var(--navy); border-color: var(--navy); }
.button--dark:hover { background: var(--navy-deep); border-color: var(--navy-deep); }
.button--light:hover { color: white; background: transparent; }

/* Home positioning: a quiet, editorial statement without decorative numbering. */
.home-positioning {
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}
.home-positioning__content {
  min-width: 0;
  padding: clamp(4.5rem, 8vw, 8rem) var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(20rem, .88fr);
  gap: clamp(3rem, 7vw, 8rem);
  align-items: end;
}
.home-positioning__heading .section-label { margin-bottom: var(--s4); }
.home-positioning__heading h2 {
  max-width: 13ch;
  margin: 0;
  font-size: var(--t2-display);
  font-weight: 800;
  line-height: .9;
  letter-spacing: -.07em;
}
.home-positioning__copy { display: grid; gap: var(--s3); }
.home-positioning__copy p {
  max-width: 58ch;
  margin: 0;
  color: var(--muted);
}
.home-positioning__copy p:first-child { color: var(--ink); font-size: var(--t4); font-weight: 600; line-height: 1.35; }

/* Home sections */
.section-intro { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(2rem, 7vw, 8rem); border-top: 1px solid var(--line); background: var(--stage-paper); }
.section-intro .section-label { padding-top: 1.25rem; }
.intro-statement { max-width: 880px; margin: 0; padding-top: 1rem; color: var(--ink); font-family: var(--display); font-size: var(--t2); font-weight: 700; line-height: .97; letter-spacing: -.06em; }
.intro-body { grid-column: 2; max-width: 680px; margin: 0; color: var(--muted); font-size: clamp(1rem, 1.25vw, 1.15rem); }
.offers { color: white; background: var(--navy); }
.offers-head { margin-bottom: clamp(3rem, 6vw, 5rem); display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.offers-head h2 { margin: 0; font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .88; letter-spacing: -.07em; }
.offers-head p { max-width: 560px; margin: 0; align-self: end; color: rgba(255,255,255,.72); }
.offer-list { border-top: 1px solid var(--line-inverse); }
.offer-row { padding: 1.8rem 0; display: grid; grid-template-columns: .9fr 1.1fr 3rem; gap: clamp(1rem, 3vw, 3rem); align-items: start; border-bottom: 1px solid var(--line-inverse); transition: color .35s var(--ease), padding .35s var(--ease); }
.offer-row:hover { color: var(--orange-readable); }
.offer-row .num { padding-top: .25rem; font-size: .7rem; opacity: .6; }
.offer-row h3 { margin: 0; font-family: var(--display); font-size: var(--t3); font-weight: 700; line-height: .98; letter-spacing: -.045em; }
.offer-row p { max-width: 520px; margin: .25rem 0 0; color: white; opacity: .66; }
.offer-row .round-arrow { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; transition: transform .35s var(--ease), background .35s var(--ease); }
.offer-row:hover .round-arrow { transform: translateX(4px); }

/* Temporärer Startseiten-Hinweis zum Community Event 2026. */
.home-community-event {
  --event-yellow: #f5d42a;
  --event-green: #087f56;
  --event-green-deep: #045a43;
  min-height: min(860px, 92svh);
  display: grid;
  grid-template-columns: 54% 46%;
  grid-template-rows: 1fr auto;
  color: var(--event-green-deep);
  background: var(--event-yellow);
}
.home-community-event__copy {
  position: relative;
  min-width: 0;
  padding: clamp(2.25rem, 3.5vw, 4rem) var(--gutter) clamp(3rem, 5vw, 5.5rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  isolation: isolate;
}
.home-community-event__pattern {
  position: absolute;
  z-index: -1;
  inset: -.06em 0 auto -.04em;
  color: rgba(8, 127, 86, .08);
  font-family: var(--display);
  font-size: clamp(5.5rem, 9.6vw, 11rem);
  font-weight: 800;
  line-height: .78;
  letter-spacing: -.075em;
  pointer-events: none;
}
.home-community-event__label {
  margin: 0 0 clamp(2.5rem, 5vw, 4.5rem);
  display: flex;
  gap: .75rem;
  font-family: var(--mono);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.home-community-event__label span { color: #bd351e; }
.home-community-event__message { margin: auto 0 clamp(2.5rem, 5vw, 4.5rem); }
.home-community-event__message h2 {
  max-width: 100%;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(3.65rem, 5.55vw, 6.6rem);
  font-weight: 800;
  line-height: .84;
  letter-spacing: -.075em;
}
.home-community-event__message p {
  max-width: 36rem;
  margin: 2rem 0 0;
  color: rgba(4, 90, 67, .8);
  font-size: clamp(1rem, 1.3vw, 1.25rem);
  font-weight: 600;
  line-height: 1.5;
}
.home-community-event__details {
  padding-top: 1.5rem;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1.5rem;
  align-items: end;
  border-top: 1px solid rgba(4, 90, 67, .45);
}
.home-community-event__details p { margin: 0; display: flex; flex-direction: column; font-weight: 750; line-height: 1.35; }
.home-community-event__details a {
  min-width: min(18rem, 100%);
  min-height: 64px;
  padding: 0 1.4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  color: var(--event-yellow);
  border-radius: 999px;
  background: var(--event-green-deep);
  font-weight: 750;
  transition: transform .3s var(--ease), background-color .3s var(--ease);
}
.home-community-event__details a:hover { background: var(--event-green); transform: translateY(-2px); }
.home-community-event__details i { font-style: normal; }
.home-community-event__visual { position: relative; min-width: 0; margin: 0; overflow: hidden; background: var(--event-green-deep); }
.home-community-event__visual img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.home-community-event__ticker {
  grid-column: 1 / -1;
  height: 58px;
  display: flex;
  overflow: hidden;
  color: var(--event-yellow);
  background: var(--event-green);
  font-family: var(--display);
  font-size: clamp(1.1rem, 1.7vw, 1.7rem);
  font-weight: 800;
  line-height: 58px;
  white-space: nowrap;
}
.home-community-event__ticker-track { width: max-content; display: flex; animation: home-event-ticker-loop 28s linear infinite; will-change: transform; }
.home-community-event__ticker span { flex: none; padding-right: .55em; }
@keyframes home-event-ticker-loop { to { transform: translate3d(calc(-1 * var(--home-event-ticker-distance)), 0, 0); } }
.split-feature { min-height: 680px; display: grid; grid-template-columns: 1fr 1fr; }
.feature-visual { min-height: 620px; margin: 0; overflow: hidden; background: var(--cream); }
.feature-visual img { height: 100%; object-fit: cover; object-position: 58% center; transition: transform 1.1s var(--ease); }
/* Kein Hover-Zoom: .split-feature ist kein Link. Siehe Audit H7. */
.feature-copy { padding: clamp(3.25rem, 7vw, 7rem); display: flex; flex-direction: column; justify-content: flex-start; gap: var(--s4); background: var(--stage-paper); }
.feature-copy h2 { max-width: 650px; margin: 0; color: var(--ink); font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .91; letter-spacing: -.065em; }
.feature-copy p { max-width: 560px; }
/* Values story */
.values-story { position: relative; z-index: 0; color: white; background: var(--stage-navy); isolation: isolate; }
.values-story__stage { position: sticky; z-index: 0; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: var(--stage-navy); }
.values-story__video, .values-story__wash { position: absolute; inset: 0; width: 100%; height: 100%; }
.values-story__video { z-index: -2; display: block; object-fit: cover; object-position: center; background: var(--stage-navy); }
.values-story__wash { z-index: -1; background: linear-gradient(90deg, rgba(7,23,35,.82) 0%, rgba(7,23,35,.65) 31%, rgba(7,23,35,.24) 64%, rgba(7,23,35,.14) 100%), linear-gradient(0deg, rgba(7,23,35,.58) 0%, transparent 42%); }
.values-story--poster .values-story__stage { background: url("./assets/videos/opendesk-werte-loop-poster.jpg") center / cover no-repeat; }
.values-story--poster .values-story__video { display: none; }
.values-story__copy { position: relative; z-index: 1; width: min(100% - (var(--gutter) * 2), 1410px); height: 100%; margin: 0 auto; }
.values-story__pane { position: absolute; top: 50%; left: 0; width: min(820px, 68vw); margin: 0; pointer-events: none; opacity: 0; transform: translateY(calc(-50% + 1.2rem)); transition: opacity .42s var(--ease), transform .56s var(--ease), visibility 0s linear .56s; visibility: hidden; }
.values-story__pane .section-label, .values-story__intro > .section-label { margin: 0 0 1.15rem; color: rgba(255,255,255,.72); }
.values-story__intro h2, .values-story__value h3, .values-story__outro h3 { margin: 0; color: white; font-family: var(--display); font-weight: 800; letter-spacing: -.068em; line-height: .89; }
.values-story__intro h2 { max-width: 830px; font-size: var(--t2-display); }
.values-story__intro > p:last-child { max-width: 590px; margin: 1.75rem 0 0; color: rgba(255,255,255,.86); font-size: clamp(1rem, 1.35vw, 1.25rem); line-height: 1.52; }
.values-story__value { width: min(760px, 61vw); }
.values-story__value > span { display: block; margin-bottom: 1rem; color: var(--orange-cta); font-size: .74rem; font-weight: 700; letter-spacing: .12em; }
.values-story__value h3 { max-width: 690px; font-size: var(--t3); }
.values-story__value p { max-width: 475px; margin: 1.4rem 0 0; color: rgba(255,255,255,.88); font-size: clamp(1rem, 1.32vw, 1.22rem); line-height: 1.5; }
.values-story__outro { width: min(820px, 67vw); }
.values-story__outro h3 { font-size: var(--t3); }
.values-story[data-active="intro"] [data-values-pane="intro"], .values-story[data-active="value-1"] [data-values-pane="value-1"], .values-story[data-active="value-2"] [data-values-pane="value-2"], .values-story[data-active="value-3"] [data-values-pane="value-3"], .values-story[data-active="value-4"] [data-values-pane="value-4"], .values-story[data-active="value-5"] [data-values-pane="value-5"], .values-story[data-active="outro"] [data-values-pane="outro"] { pointer-events: auto; opacity: 1; transform: translateY(-50%); transition-delay: .06s; visibility: visible; }
.values-story__hud { position: absolute; z-index: 2; bottom: clamp(1.35rem, 3.5vw, 3.75rem); left: var(--gutter); display: grid; grid-template-columns: minmax(100px, 14vw) auto; align-items: center; gap: 1rem; color: rgba(255,255,255,.75); font-size: .68rem; font-weight: 700; letter-spacing: .12em; }
.values-story__progress { display: block; height: 1px; overflow: hidden; background: rgba(255,255,255,.38); }
.values-story__progress i { display: block; width: 100%; height: 100%; background: var(--orange-cta); transform: scaleX(0); transform-origin: left; transition: transform .52s var(--ease); }
.values-story__scroll { position: relative; z-index: 1; margin-top: -100vh; margin-top: -100svh; pointer-events: none; }
.values-story__trigger { min-height: 52vh; min-height: 52svh; }
.values-story__trigger--intro { min-height: 58vh; min-height: 58svh; }
.values-story__trigger--outro { min-height: 48vh; min-height: 48svh; }
.values-story.values-story--static { height: auto; color: var(--ink); background: var(--stage-paper); }
.values-story--static .values-story__stage { position: relative; height: auto; min-height: 0; overflow: visible; padding: clamp(20rem, 56vw, 37rem) var(--gutter) clamp(4.5rem, 9vw, 7rem); background: var(--stage-paper); }
.values-story--static .values-story__video, .values-story--static .values-story__wash { right: 0; bottom: auto; height: clamp(20rem, 56vw, 37rem); }
.values-story--static .values-story__wash { background: linear-gradient(0deg, rgba(7,23,35,.42), rgba(7,23,35,.06)); }
.values-story--static .values-story__copy { width: min(100%, 720px); height: auto; margin: 0; }
.values-story.values-story--static .values-story__pane { position: relative; top: auto; left: auto; width: 100%; margin: 0 0 4.5rem; color: var(--ink); pointer-events: auto; opacity: 1; transform: none; visibility: visible; }
.values-story--static .values-story__intro h2, .values-story--static .values-story__value h3, .values-story--static .values-story__outro h3 { color: var(--ink); }
.values-story--static .values-story__pane .section-label, .values-story--static .values-story__intro > .section-label, .values-story--static .values-story__value > span { color: var(--orange-signal); }
.values-story--static .values-story__intro > p:last-child, .values-story--static .values-story__value p { color: var(--muted); }
.values-story--static .values-story__outro { padding-top: 2rem; border-top: 1px solid var(--line); }
.values-story--static .values-story__hud, .values-story--static .values-story__scroll { display: none; }

.donate-band { display: grid; grid-template-columns: 1.15fr .85fr; color: white; background: var(--clay); }
.donate-copy { padding: var(--section) var(--gutter); }
.donate-copy p { max-width: 580px; margin: 2rem 0; }
.donate-art { position: relative; min-height: 430px; overflow: hidden; background: var(--navy); }
.donate-art span { position: absolute; display: block; border: 1px solid rgba(242,72,34,.7); border-radius: 50%; }
.donate-art span:nth-child(1) { width: 72%; aspect-ratio: 1; top: 14%; left: 14%; }
.donate-art span:nth-child(2) { width: 38%; aspect-ratio: 1; top: 31%; left: 31%; background: var(--orange-signal); }
.donate-art span:nth-child(3) { width: 16%; aspect-ratio: 1; top: 42%; left: 42%; background: var(--paper); }
/* Inner pages */
.page-hero { position: relative; min-height: 560px; padding: clamp(6rem, 11vw, 10rem) var(--gutter) clamp(4rem, 7vw, 7rem); display: flex; align-items: flex-end; overflow: hidden; color: var(--ink); background: var(--paper); }
.page-hero--media {
  min-height: clamp(620px, calc(100svh - 88px), 840px);
  padding: clamp(2rem, 3.25vw, 3.25rem) var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(420px, .84fr);
  gap: clamp(2.75rem, 5vw, 6rem);
  color: var(--ink);
  background: var(--paper);
}
.page-hero--media::after { display: none; }
.page-hero-media { position: relative; z-index: 0; grid-column: 2; grid-row: 1; min-width: 0; min-height: 540px; overflow: hidden; border: 1.5px solid var(--orange-signal); }
.page-hero-media::after { display: none; }
.page-hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: none; }
.page-hero-content { position: relative; z-index: 2; max-width: 1040px; }
.page-hero--media .page-hero-content { grid-column: 1; grid-row: 1; min-width: 0; max-width: none; padding: 0; display: flex; flex-direction: column; }
.page-hero--media .section-label { margin: 0; color: var(--ink); }
.page-hero--media h1 { max-width: 12.5ch; margin-top: auto; color: var(--ink); font-size: clamp(3rem, 4.35vw, 4.75rem); line-height: .93; letter-spacing: -.065em; }
.page-hero p { max-width: 620px; margin: 1.75rem 0 0; color: var(--muted); font-size: clamp(1rem, 1.35vw, 1.16rem); }
.page-hero--media p { max-width: 600px; color: var(--muted); font-size: clamp(1rem, 1.2vw, 1.14rem); line-height: 1.65; }
.page-hero--media .button--outline { color: var(--ink); }
.page-hero--media .button--outline:hover { color: var(--ink); background: white; border-color: white; }
.page-hero .button-row { margin-top: 2rem; }
.content-page { background: var(--stage-paper); }
.lead-block { display: grid; grid-template-columns: .65fr 1.35fr; gap: clamp(2rem, 8vw, 9rem); border-bottom: 1px solid var(--line); }
.lead-block p { max-width: 950px; margin: 0; color: var(--ink); font-family: var(--display); font-size: var(--t3); font-weight: 700; line-height: .99; letter-spacing: -.05em; }
.content-grid { padding: 0 var(--gutter) var(--section); }
.content-block { padding: 3.2rem 0; display: grid; grid-template-columns: .75fr 1.2fr; gap: clamp(1.25rem, 4vw, 5rem); border-bottom: 1px solid var(--line); }
.content-block .index { padding-top: .3rem; color: var(--clay); font-size: .7rem; }
.content-block h2 { margin: 0; color: var(--ink); font-family: var(--display); font-size: var(--t3); font-weight: 700; line-height: .94; letter-spacing: -.055em; }
.content-block .copy { max-width: 700px; color: #4e5157; }
.content-block .copy > p:first-child { margin-top: 0; }
.content-block .copy > p:last-child { margin-bottom: 0; }

/* Offers page: task-first wayfinder, followed by distinct editorial chapters. */
.masthead-intro--single { grid-template-columns: minmax(0, 1fr); }
.masthead-intro--single > p { max-width: 68ch; }
.offer-finder {
  padding: var(--section) var(--gutter);
  display: grid;
  grid-template-columns: minmax(16rem, .72fr) minmax(0, 1.28fr);
  gap: clamp(3rem, 8vw, 9rem);
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  background: var(--stage-paper);
}
.offer-finder__intro { align-self: start; }
.offer-finder__intro h2 {
  max-width: 13ch;
  margin: var(--s3) 0;
  font-size: var(--t2);
  font-weight: 800;
  line-height: .94;
  letter-spacing: -.055em;
}
.offer-finder__intro p { max-width: 42ch; margin: 0; color: var(--muted); }
.offer-finder__list { border-top: 1px solid var(--line); }
.offer-finder__row {
  min-height: 8rem;
  padding: var(--s3) 0;
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr) 1.5rem;
  gap: var(--s3);
  align-items: start;
  border-bottom: 1px solid var(--line);
  transition: color .25s var(--ease), padding .25s var(--ease), background-color .25s var(--ease);
}
.offer-finder__row:hover,
.offer-finder__row:focus-visible { padding-left: var(--s2); color: var(--ink); background: var(--orange-soft); }
.offer-finder__num { color: var(--orange-signal); font-family: var(--mono); font-size: var(--t6); }
.offer-finder__body { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem var(--s3); }
.offer-finder__body small { grid-column: 1 / -1; color: var(--muted); font-family: var(--mono); font-size: var(--t6); letter-spacing: .06em; text-transform: uppercase; }
.offer-finder__body strong { max-width: 34rem; font-size: var(--t4); line-height: 1.25; }
.offer-finder__body > span { align-self: end; color: var(--muted); font-family: var(--mono); font-size: var(--t6); text-transform: uppercase; }
.offer-finder__row i {
  width: 1.5rem;
  height: 1.5rem;
  display: grid;
  place-items: center;
  color: var(--orange-signal);
  font-size: 1.15rem;
  font-style: normal;
  transition: transform .25s var(--ease);
}
.offer-finder__row:hover i { transform: translateY(4px); }
.offers-editorial { background: var(--stage-paper); }
.offer-feature {
  min-height: clamp(36rem, 52vw, 48rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  border-bottom: 1px solid var(--line);
  isolation: isolate;
}
.offer-feature--reverse .offer-feature__media { grid-column: 2; grid-row: 1; }
.offer-feature--reverse .offer-feature__copy { grid-column: 1; grid-row: 1; }
.offer-feature__media { min-width: 0; min-height: 100%; margin: 0; overflow: hidden; background: var(--cream); }
.offer-feature__media picture { width: 100%; height: 100%; display: block; }
.offer-feature__media img { width: 100%; height: 100%; display: block; object-fit: cover; }
.offer-feature__copy {
  padding: clamp(3rem, 6vw, 6.5rem) var(--gutter);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
.offer-feature__meta { width: 100%; margin-bottom: var(--s4); font-family: var(--mono); font-size: var(--t6); text-transform: uppercase; }
.offer-feature__meta small { color: var(--muted); font-size: inherit; }
.offer-feature__copy h2 { max-width: 12ch; margin: 0 0 var(--s3); font-size: var(--t2); line-height: .94; letter-spacing: -.055em; }
.offer-feature__copy p { max-width: 58ch; margin: 0 0 var(--s2); color: var(--muted); }
.offer-feature__copy p:first-of-type { color: var(--ink); font-size: var(--t4); font-weight: 600; line-height: 1.4; }
.offer-feature__copy .button { margin-top: var(--s3); }

/* Program detail pages: one shared editorial rhythm with truthful, distinct endings. */
.program-page { background: var(--stage-paper); }
.program-chapter {
  min-height: clamp(36rem, 52vw, 48rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  border-bottom: 1px solid var(--line);
  isolation: isolate;
}
.program-chapter--reverse .program-chapter__media { grid-column: 2; grid-row: 1; }
.program-chapter--reverse .program-chapter__copy { grid-column: 1; grid-row: 1; }
.program-chapter__media { min-width: 0; min-height: 100%; margin: 0; overflow: hidden; background: var(--cream); }
.program-chapter__media picture { width: 100%; height: 100%; display: block; }
.program-chapter__media img { width: 100%; height: 100%; display: block; object-fit: cover; }
.program-chapter__copy {
  padding: clamp(3rem, 6vw, 6.5rem) var(--gutter);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
.program-chapter__copy .section-label { margin-bottom: var(--s4); }
.program-chapter__copy h2,
.program-process__heading h2,
.program-status__heading h2 { max-width: 14ch; margin: 0 0 var(--s3); font-size: var(--t2); line-height: .94; letter-spacing: -.055em; }
.program-chapter__copy p { max-width: 58ch; margin: 0 0 var(--s2); color: var(--muted); }
.program-chapter__copy p:first-of-type { color: var(--ink); font-size: var(--t4); font-weight: 600; line-height: 1.4; }
.program-process {
  padding: var(--section) var(--gutter);
  display: grid;
  grid-template-columns: minmax(16rem, .72fr) minmax(0, 1.28fr);
  gap: clamp(3rem, 8vw, 9rem);
  color: white;
  background: var(--navy);
}
.program-process__heading .section-label { color: var(--orange-readable); }
.program-process__heading p { max-width: 42ch; color: rgba(255,255,255,.7); }
.program-process__list { margin: 0; padding: 0; border-top: 1px solid var(--line-inverse); list-style: none; }
.program-process__list li { min-height: 7.5rem; padding: var(--s3) 0; display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: var(--s3); border-bottom: 1px solid var(--line-inverse); }
.program-process__list li > span { color: var(--orange-readable); font-family: var(--mono); font-size: var(--t6); }
.program-process__list h3 { margin: 0 0 .45rem; font-size: var(--t4); line-height: 1.15; }
.program-process__list p { max-width: 48ch; margin: 0; color: rgba(255,255,255,.68); }
.program-status {
  padding: var(--section) var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: clamp(3rem, 8vw, 9rem);
  border-bottom: 1px solid var(--line);
  background: var(--cream);
}
.program-status__heading .section-label { margin-bottom: var(--s4); }
.program-status__copy { align-self: end; }
.program-status__copy p { max-width: 62ch; margin: 0 0 var(--s2); color: var(--muted); }
.program-status__copy p:first-child { color: var(--ink); font-size: var(--t4); font-weight: 600; line-height: 1.4; }
.editorial-media {
  padding: clamp(3rem, 6vw, 5.5rem) 0;
  display: grid;
  gap: 1rem;
  border-bottom: 1px solid var(--line);
}
.editorial-media--three { grid-template-columns: 1.2fr .8fr .8fr; }
.editorial-media--two { grid-template-columns: 1.25fr .75fr; }
.editorial-image { min-width: 0; margin: 0; }
.editorial-image-frame { height: clamp(360px, 38vw, 570px); overflow: hidden; background: var(--cream); }
.editorial-media--two .editorial-image-frame { height: clamp(440px, 48vw, 680px); }
.editorial-image img { height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.editorial-image:hover img { transform: scale(1.025); }
.editorial-image figcaption { padding-top: .85rem; display: flex; flex-direction: column; gap: .25rem; }
.editorial-image figcaption strong { color: var(--ink); font-family: var(--display); font-size: 1.1rem; font-weight: 700; letter-spacing: -.025em; }
.editorial-image figcaption span { max-width: 34rem; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.subcards { margin-top: 2rem; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.subcard { min-height: 190px; padding: 1.2rem; background: var(--white); }
.subcard .num { color: var(--orange-signal); font-size: .68rem; }
.subcard h3 { margin: .75rem 0 1rem; color: var(--ink); font-family: var(--display); font-size: var(--t4); font-weight: 700; line-height: 1.02; letter-spacing: -.035em; }
.closing-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: end; color: var(--ink); background: var(--orange-cta); }
.closing-cta h2 { margin: 0; font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .87; letter-spacing: -.07em; }
.closing-cta p { max-width: 560px; }

/* Contact */
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.field { display: flex; flex-direction: column; gap: .35rem; }
.field--full { grid-column: 1 / -1; }
.field label { font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; }
.field input, .field select, .field textarea { width: 100%; padding: .85rem 0; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; outline: 0; background: transparent; }
.field textarea { min-height: 150px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--orange-signal); box-shadow: 0 1px 0 var(--orange-signal); }
.form-note { grid-column: 1 / -1; margin: .5rem 0; color: var(--muted); font-size: .76rem; }

/* Footer */
.site-footer { padding: clamp(4rem, 7vw, 7rem) var(--gutter) 2rem; color: white; background: var(--navy-deep); }
.footer-top { padding-bottom: 3rem; display: grid; grid-template-columns: .6fr 1.4fr; gap: 4rem; border-bottom: 1px solid var(--line-inverse); }
.footer-top p { max-width: 680px; margin: 0; color: rgba(255,255,255,.68); font-family: var(--display); font-size: var(--t4); font-weight: 500; line-height: 1.25; }
.brand--footer { text-transform: none; }
.footer-grid { padding: 3rem 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.footer-grid > div { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; }
.footer-label { margin-bottom: .5rem; color: var(--orange-readable); font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; }
.footer-grid a { color: rgba(255,255,255,.7); font-size: .83rem; transition: color .25s; }
.footer-grid a:hover { color: white; }
.footer-bottom { padding-top: 1.25rem; display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--line-inverse); color: rgba(255,255,255,.55); font-size: .72rem; }
.to-top { padding: 0; border: 0; color: inherit; background: none; cursor: pointer; }

/* Motion */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .75s var(--ease), transform .75s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1080px) {
  .offer-row { grid-template-columns: .9fr 1.1fr 3rem; }
  .page-hero--media { grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: clamp(2rem, 4vw, 3.5rem); }
  .page-hero--media h1 { font-size: clamp(2.8rem, 5vw, 4.2rem); }
}

@media (max-width: 760px) {
  :root { --section: 4.5rem; }
  .home-positioning, .section-intro, .offers-head, .split-feature, .donate-band, .lead-block, .closing-cta, .footer-top { grid-template-columns: 1fr; }
  .home-positioning__content { grid-template-columns: 1fr; padding: var(--section) var(--gutter); gap: var(--s3); }
  .home-positioning__heading h2 { font-size: clamp(2.45rem, 12vw, 4rem); }
  .intro-body { grid-column: 1; }
  .offers-head { gap: 1.5rem; }
  .offer-row { grid-template-columns: 1fr 2.75rem; gap: .75rem; }
  .offer-row p { grid-column: 1 / -1; }
  .home-community-event { min-height: 0; grid-template-columns: 1fr; grid-template-rows: auto 64svh auto; }
  .home-community-event__copy { min-height: 760px; padding: 2.5rem var(--gutter) 3rem; }
  .home-community-event__message h2 { font-size: clamp(3.6rem, 15vw, 5.6rem); }
  .home-community-event__details { grid-template-columns: 1fr; align-items: stretch; }
  .home-community-event__details a { width: 100%; }
  .home-community-event__visual { grid-row: 2; }
  .home-community-event__ticker { grid-column: 1; grid-row: 3; }
  .feature-visual { min-height: 520px; }
  .feature-copy { padding: var(--section) var(--gutter); }
  .values-story { height: auto; color: var(--ink); background: var(--paper); }
  .values-story__stage { position: relative; height: auto; min-height: 0; overflow: visible; padding: clamp(20rem, 62vw, 34rem) var(--gutter) 4.75rem; background: var(--paper); }
  .values-story__video, .values-story__wash { right: 0; bottom: auto; height: clamp(20rem, 62vw, 34rem); }
  .values-story__wash { background: linear-gradient(0deg, rgba(7,23,35,.42), rgba(7,23,35,.04)); }
  .values-story__copy { width: 100%; height: auto; margin: 0; }
  .values-story[data-active] .values-story__pane { position: relative; top: auto; left: auto; width: 100%; margin: 0 0 3.5rem; color: var(--ink); pointer-events: auto; opacity: 1; transform: none; visibility: visible; }
  .values-story__intro h2, .values-story__value h3, .values-story__outro h3 { color: var(--ink); }
  .values-story__intro > p:last-child, .values-story__value p { color: var(--muted); }
  .values-story__pane .section-label, .values-story__intro > .section-label, .values-story__value > span { color: var(--orange-signal); }
  .values-story__outro { padding-top: 2rem; border-top: 1px solid var(--line); }
  .values-story__hud, .values-story__scroll { display: none; }
  .page-hero { min-height: 520px; padding: 5.5rem var(--gutter) 4.5rem; }
  .page-hero--media { min-height: 0; padding: 3.25rem var(--gutter) var(--section); display: flex; flex-direction: column; gap: 3.5rem; }
  .page-hero--media .page-hero-content { order: 1; min-height: 500px; padding: 0; }
  .page-hero-media { order: 2; width: 100%; min-height: 0; height: clamp(460px, 112vw, 660px); border: 1.5px solid var(--orange-signal); }
  .page-hero--media h1 { max-width: 12ch; font-size: clamp(3rem, 10.5vw, 4.5rem); }
  .page-hero h1 { max-width: 12ch; }
  .content-block { grid-template-columns: 1fr; gap: 1rem; }
  .content-block .copy { grid-column: 1; }
  .offer-finder { grid-template-columns: 1fr; gap: var(--s4); }
  .offer-finder__row { grid-template-columns: 2.25rem minmax(0, 1fr) 2.5rem; gap: var(--s2); }
  .offer-finder__body { grid-template-columns: 1fr; }
  .offer-finder__body > span { align-self: auto; }
  .offer-feature { min-height: 0; grid-template-columns: 1fr; }
  .offer-feature--reverse .offer-feature__media,
  .offer-feature--reverse .offer-feature__copy { grid-column: 1; grid-row: auto; }
  .offer-feature__media { min-height: 0; aspect-ratio: 4 / 3; }
  .offer-feature__copy { min-height: 0; padding: var(--section) var(--gutter); }
  .offer-feature__meta { margin-bottom: var(--s4); }
  .program-chapter { min-height: 0; grid-template-columns: 1fr; }
  .program-chapter--reverse .program-chapter__media,
  .program-chapter--reverse .program-chapter__copy { grid-column: 1; grid-row: auto; }
  .program-chapter__media { min-height: 0; aspect-ratio: 4 / 3; }
  .program-chapter__copy { min-height: 0; padding: var(--section) var(--gutter); }
  .program-process, .program-status { grid-template-columns: 1fr; gap: var(--s4); }
  .program-status__copy { align-self: auto; }
  .editorial-media--three { grid-template-columns: 1fr 1fr; }
  .editorial-media--three .editorial-image:first-child { grid-column: 1 / -1; }
  .editorial-image-frame, .editorial-media--two .editorial-image-frame { height: clamp(340px, 62vw, 520px); }
  .subcards { grid-template-columns: 1fr; }
  .contact-form { grid-template-columns: 1fr; }
  .field--full, .form-note { grid-column: 1; }
  .footer-top { gap: 2rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-bottom { flex-wrap: wrap; }
}

@media (max-width: 480px) {
  .button-row { flex-direction: column; align-items: stretch; }
  .button { width: 100%; }
  .offer-row { grid-template-columns: 1fr; }
  .offer-row .round-arrow { display: none; }
  .offer-row p { grid-column: 1; }
  .content-block { grid-template-columns: 1fr; }
  .content-block .copy { grid-column: 1; }
  .offer-finder__row { grid-template-columns: 1.75rem minmax(0, 1fr); }
  .offer-finder__row i { display: none; }
  .offer-feature__meta { flex-direction: column; }
  .editorial-media--three, .editorial-media--two { grid-template-columns: 1fr; }
  .editorial-media--three .editorial-image:first-child { grid-column: auto; }
  .editorial-image-frame, .editorial-media--two .editorial-image-frame { height: auto; aspect-ratio: 4 / 3; }
  .footer-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .home-community-event__ticker-track { animation: none; }
}

/* Mobile quality pass — concise chapters, deliberate depth and touch-first
   controls. These rules intentionally sit after the legacy mobile fallbacks. */
@media (max-width: 900px) {
  .values-home { height: auto; min-height: 0; }
  .values-home__sticky {
    position: relative;
    height: auto;
    min-height: min(860px, 100svh);
    padding: clamp(2rem, 8vw, 4rem) 0 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  .values-home__wash {
    background: linear-gradient(180deg, rgba(4,22,30,.28), rgba(4,22,30,.6) 48%, rgba(4,22,30,.94));
  }
  .values-home__top {
    position: relative;
    inset: auto;
    margin: 0 var(--mobile-gutter) clamp(2rem, 8vw, 4.5rem);
    align-items: end;
  }
  .values-home__top .home-eyebrow {
    max-width: 8ch;
    font-size: clamp(2.6rem, 13vw, 4.7rem);
  }
  .values-home__counter strong { font-size: 1.4rem; }
  .values-home__counter span { font-size: .68rem; }
  .values-home__copy,
  .values-home__steps { display: none; }
  .values-home__mobile-rail {
    position: relative;
    z-index: 3;
    width: 100%;
    padding: 0 var(--mobile-gutter);
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--mobile-gutter);
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }
  .values-home__mobile-rail::-webkit-scrollbar { display: none; }
  .values-home__card {
    flex: 0 0 calc(100% - 42px);
    min-height: clamp(340px, 55svh, 470px);
    padding: clamp(1.25rem, 6vw, 2rem);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    border: 1px solid rgba(255,255,255,.38);
    background: rgba(14,28,52,.9);
  }
  .values-home__card > span {
    margin-bottom: auto;
    color: var(--orange-readable);
    font-family: var(--mono);
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .08em;
  }
  .values-home__card h2 {
    margin: 0;
    font-family: var(--display);
    font-size: clamp(2.65rem, 13vw, 4.4rem);
    font-weight: 800;
    letter-spacing: -.065em;
    line-height: .9;
    overflow-wrap: anywhere;
  }
  .values-home__card p {
    max-width: 32ch;
    margin: 1.4rem 0 0;
    color: rgba(255,255,255,.78);
    font-size: .98rem;
    line-height: 1.5;
  }
  .values-home__mobile-controls {
    position: relative;
    z-index: 3;
    margin: 1rem var(--mobile-gutter) .9rem;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
  }
  .values-home__mobile-controls button {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.55);
    border-radius: 50%;
    color: white;
    background: transparent;
    font-size: 1.1rem;
  }
  .values-home__mobile-controls button:disabled { opacity: .28; }
  .values-home__progress {
    position: relative;
    right: auto;
    bottom: auto;
    left: auto;
    margin: 0 var(--mobile-gutter);
  }
}

@media (max-width: 760px) {
  body.contact-route-open { overflow: hidden; }
  main :is(h1,h2,h3) { overflow-wrap: break-word; }

  .od-secindex {
    position: sticky;
    top: 0;
    z-index: 46;
    width: 100%;
    padding: 0;
    display: block;
    overflow: visible;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 8px 22px rgba(5,22,31,.06);
  }
  .od-secindex__trigger {
    width: 100%;
    min-height: 56px;
    padding: 0 var(--mobile-gutter);
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    border: 0;
    color: var(--ink);
    background: var(--stage-paper);
    text-align: left;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
  }
  .od-secindex__trigger strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .od-secindex__trigger i { color: var(--orange-signal); font-style: normal; font-size: 1.1rem; transition: transform .2s var(--ease); }
  .od-secindex__count { color: var(--orange-signal); font-size: .62rem; }
  .od-secindex__panel {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    max-height: 0;
    display: grid;
    overflow: hidden;
    visibility: hidden;
    border-bottom: 1px solid var(--line);
    background: var(--stage-paper);
    box-shadow: 0 20px 35px rgba(5,22,31,.16);
    transition: max-height .3s var(--ease), visibility 0s .3s;
  }
  .od-secindex.is-open .od-secindex__panel { max-height: min(72svh, 520px); visibility: visible; transition-delay: 0s; }
  .od-secindex.is-open .od-secindex__trigger i { transform: rotate(180deg); }
  .od-secindex a {
    width: 100%;
    min-height: 52px;
    padding: .65rem var(--mobile-gutter);
    border: 0;
    border-top: 1px solid var(--line);
    border-bottom: 0;
  }
  .od-secindex a[aria-current="location"] { border-bottom: 0; box-shadow: inset 4px 0 0 var(--orange-signal); }

  .od-contact__routes { padding: 2rem var(--mobile-gutter) 1.5rem; }
  .od-contact__routes > p { margin-bottom: 12px; }
  .od-contact__route-trigger {
    width: 100%;
    min-height: 74px;
    padding: 12px 14px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 4px 12px;
    border: 1px solid rgba(255,255,255,.36);
    color: white;
    background: rgba(255,255,255,.07);
    text-align: left;
  }
  .od-contact__route-trigger span { grid-column: 1; color: var(--orange-readable); font-family: var(--mono); font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; }
  .od-contact__route-trigger strong { grid-column: 1; font-size: 1.05rem; line-height: 1.2; }
  .od-contact__route-trigger i { grid-column: 2; grid-row: 1 / 3; font-style: normal; color: var(--orange-readable); }
  .od-contact__route-backdrop {
    position: fixed;
    z-index: 108;
    inset: 0;
    display: block;
    border: 0;
    background: rgba(5,17,31,.68);
  }
  .od-contact__route-backdrop[hidden] { display: none; }
  .od-contact__route-list {
    position: fixed;
    z-index: 109;
    right: 0;
    bottom: 0;
    left: 0;
    max-height: min(78svh, 680px);
    padding: 24px var(--mobile-gutter) calc(18px + env(safe-area-inset-bottom));
    display: grid;
    gap: 0;
    overflow-y: auto;
    border: 0;
    border-radius: 22px 22px 0 0;
    background: var(--navy-deep);
    transform: translateY(105%);
    visibility: hidden;
    transition: transform .32s var(--ease), visibility 0s .32s;
  }
  .od-contact__route-list.is-open { transform: none; visibility: visible; transition-delay: 0s; }
  .od-contact__route {
    width: 100%;
    min-height: 60px;
    padding: 12px 8px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.18);
  }
  .od-contact__route.is-selected { padding-left: 14px; }
  .od-contact__route strong { font-size: 1.05rem; }
  .od-contact__safety { margin-top: 18px; padding-top: 16px; grid-template-columns: 1fr; gap: 7px; }

  .contact-extra-disclosure { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .contact-extra-disclosure > summary {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    list-style: none;
    cursor: pointer;
    font-family: var(--mono);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  .contact-extra-disclosure > summary::-webkit-details-marker { display: none; }
  .contact-extra-disclosure > summary i { color: var(--muted); font-style: normal; font-weight: 500; }
  .contact-extra-disclosure > summary::after { content: "+"; color: var(--orange-signal); font-size: 1.1rem; }
  .contact-extra-disclosure[open] > summary::after { content: "−"; }
  .contact-extra-fields { padding: 1rem 0 1.3rem; grid-template-columns: 1fr; }

  .home-positioning__content { padding-block: clamp(3.5rem, 15vw, 5rem); gap: 2.25rem; }
  .home-positioning__copy { gap: 1.1rem; }
  .home-positioning__copy p { font-size: .98rem; line-height: 1.58; }
  .home-positioning__copy p:first-child { font-size: 1.07rem; }
  .offer-row { min-height: 112px; padding: 1.35rem 0; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; }
  .offer-row p { margin: 0; grid-column: 1; font-size: .9rem; line-height: 1.45; }
  .offer-row .round-arrow { grid-column: 2; grid-row: 1 / 3; display: grid; width: 42px; height: 42px; }

  .home-community-event { grid-template-rows: auto minmax(360px, 56svh) 48px; }
  .home-community-event__copy { min-height: 0; padding: 3rem var(--mobile-gutter); }
  .home-community-event__message { margin: 3.5rem 0 2.5rem; }
  .home-community-event__message h2 { font-size: clamp(2.8rem, 12.5vw, 4rem); line-height: .9; overflow-wrap: anywhere; }
  .home-community-event__message p { font-size: .98rem; }
  .home-community-event__details { gap: 1rem; }
  .home-community-event__details a { min-height: 54px; }

  .site-footer { padding: 3.5rem var(--mobile-gutter) calc(1.5rem + env(safe-area-inset-bottom)); }
  .footer-top { padding-bottom: 2.25rem; gap: 1.5rem; }
  .footer-top p { font-size: 1.05rem; line-height: 1.42; }
  .footer-grid { padding: 1rem 0 1.5rem; display: block; }
  .footer-group { border-bottom: 1px solid var(--line-inverse); }
  .footer-group > summary {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
  }
  .footer-group > summary .footer-label { margin: 0; }
  .footer-group > summary i { display: block; color: var(--orange-readable); }
  .footer-group[open] > summary i { transform: rotate(45deg); }
  .footer-links { padding: 0 0 1.25rem; gap: .7rem; }
  .footer-grid a { font-size: .9rem; }
  .footer-utility { padding-block: 1.5rem; display: grid; gap: .8rem; }
  .footer-bottom { padding-top: 1.1rem; display: grid; grid-template-columns: 1fr auto; align-items: center; }
  .footer-bottom > span:nth-child(2) { display: none; }
}

@media (min-width: 761px) {
  .footer-group > summary { pointer-events: none; }
  .footer-group > .footer-links { display: flex !important; }
}

@media (max-width: 900px) {
  .values-home__counter { flex: 0 0 auto; white-space: nowrap; }
  .values-home__card h2 {
    font-size: clamp(2.2rem,10vw,3.8rem);
    overflow-wrap: normal;
    word-break: normal;
    hyphens: auto;
  }
}

@media (max-width: 760px) {
  .od-contact__route:focus-visible {
    outline: 2px solid var(--orange-readable);
    outline-offset: -2px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .values-home__mobile-rail { scroll-behavior: auto; }
  .od-contact__route-list,
  .od-secindex__panel { transition: none; }
}

/* Villa-inspired masthead: one quiet, full-screen brand composition. */
.page-shell { max-width: none; background: var(--paper); }
.site-header {
  position: absolute;
  z-index: 60;
  inset: 0 var(--rail-width) auto 0;
  min-height: 0;
  padding: 36px;
  display: block;
  color: #050505;
  background: transparent;
  pointer-events: none;
}
.site-header .brand {
  position: relative;
  width: clamp(250px, 24vw, 310px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: #050505;
  pointer-events: auto;
}
.brand-overline {
  position: relative;
  z-index: 2;
  font-family: var(--mono);
  font-size: clamp(.72rem, .9vw, .9rem);
  font-weight: 450;
  letter-spacing: .01em;
  text-transform: uppercase;
}
.brand-logo {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1;
  margin-top: clamp(-.3rem, -.35vw, -.1rem);
}
.brand-logo img { position: absolute; inset: 0; width: 100%; height: 100%; transform: translateX(-11.25%); transition: opacity .28s var(--ease), transform .28s var(--ease); }
.brand-logo__light { opacity: 0; }
body.header-on-dark .site-header .brand { color: white; }
body.header-on-dark .brand-logo__dark { opacity: 0; }
body.header-on-dark .brand-logo__light { opacity: 1; }
.desktop-nav, .header-cta, .header-entry { display: none !important; }
.header-rail {
  position: fixed;
  z-index: 70;
  inset: 0 0 0 auto;
  width: var(--rail-width);
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  color: var(--ink);
  background: var(--orange-cta);
  border-left: 1px solid rgba(6,45,51,.16);
  overflow-x: visible;
  overflow-y: auto;
  overscroll-behavior: contain;
  pointer-events: auto;
}
.header-rail .menu-button {
  position: relative;
  width: 100%;
  height: 88px;
  padding: 24px 22px 12px;
  display: flex;
  flex: 0 0 88px;
  flex-direction: column;
  justify-content: flex-start;
  border: 0;
  border-bottom: 1px solid rgba(6,45,51,.25);
  border-radius: 0;
  color: var(--ink);
  background: transparent;
  cursor: pointer;
  transition: color .25s var(--ease), background .25s var(--ease);
}
.header-rail .menu-button:hover { color: white; background: var(--navy); }
.header-rail .menu-button span { width: 100%; height: 1.5px; margin: 0 0 5px; background: currentColor; transform-origin: center; }
.header-rail .menu-button b { margin-top: 3px; font-size: .58rem; font-weight: 750; line-height: 1; letter-spacing: .08em; text-transform: uppercase; }
.header-rail .menu-button[aria-expanded="true"] { color: white; background: var(--navy); }
.header-rail .menu-button[aria-expanded="true"] span:first-child { transform: translateY(6.5px) rotate(45deg); }
.header-rail .menu-button[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.header-rail .menu-button[aria-expanded="true"] span:nth-of-type(3) { transform: translateY(-6.5px) rotate(-45deg); }
.rail-primary { margin: 0; padding: 0; list-style: none; }
.rail-primary li { margin: 0; padding: 0; }
.rail-link, .rail-language-button {
  position: relative;
  width: 100%;
  min-height: 74px;
  padding: 10px 7px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-bottom: 1px solid rgba(6,45,51,.2);
  text-align: center;
  color: var(--ink);
  background: transparent;
  cursor: pointer;
  transition: color .25s var(--ease), background .25s var(--ease);
}
.rail-link svg, .rail-language-button svg { width: 21px; height: 21px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.rail-link span, .rail-language-button span { font-size: .57rem; font-weight: 750; line-height: 1.12; letter-spacing: .02em; }
.rail-link:hover, .rail-language-button:hover, .rail-language-button[aria-expanded="true"] { color: white; background: var(--navy); }
.rail-link[aria-current="page"] { color: white; background: var(--navy); font-weight: 800; }
.rail-link[aria-current="page"]::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 4px; background: white; }
.rail-link--donate svg { padding: 4px; color: white; fill: var(--navy); stroke: white; background: var(--navy); border-radius: 50%; box-sizing: content-box; }
.rail-link--donate[aria-current="page"] svg, .rail-link--donate:hover svg { color: var(--navy); fill: white; stroke: var(--navy); background: white; }
.rail-language { position: relative; margin-top: auto; }
.rail-language-button { min-height: 88px; border-top: 1px solid rgba(6,45,51,.25); border-bottom: 0; }
.rail-language-button strong { font-size: .72rem; line-height: 1; letter-spacing: .08em; }
.rail-language-panel {
  position: fixed;
  z-index: 69;
  right: var(--rail-width);
  bottom: 0;
  width: min(330px, calc(100vw - var(--rail-width)));
  max-height: 100dvh;
  padding: 1.35rem;
  color: white;
  background: var(--navy-deep);
  border-right: 1px solid rgba(255,255,255,.18);
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  transform: translateX(18px);
  pointer-events: none;
  transition: opacity .28s var(--ease), visibility .28s, transform .28s var(--ease);
}
.rail-language-panel.is-open { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
.rail-language-panel__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.rail-language-panel__head span { display: block; color: var(--orange-readable); font-size: .62rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.rail-language-panel__head strong { display: block; margin-top: .35rem; font-family: var(--display); font-size: 1.25rem; line-height: 1.1; }
.rail-language-close { width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; color: white; background: transparent; font-size: 1.4rem; cursor: pointer; }
.rail-language-panel ul { margin: 1.5rem 0; padding: 0; border-top: 1px solid rgba(255,255,255,.18); list-style: none; }
.rail-language-panel li { min-height: 52px; padding: .7rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid rgba(255,255,255,.18); }
.rail-language-panel li span { font-weight: 650; }
.rail-language-panel li small { color: rgba(255,255,255,.58); font-size: .65rem; }
.rail-language-panel li.is-current span { color: var(--orange-readable); }
.rail-language-panel > p { margin: 0; color: rgba(255,255,255,.68); font-size: .72rem; line-height: 1.5; }
.header-rail :focus-visible { outline: 3px solid white; outline-offset: -4px; }
.rail-language-panel :focus-visible { outline: 3px solid var(--orange-readable); outline-offset: 2px; }
body.menu-open .rail-primary, body.menu-open .rail-language { visibility: hidden; pointer-events: none; }
body.menu-open .header-rail { background: var(--stage-navy); border-left-color: rgba(255,255,255,.18); }
.mobile-menu { right: var(--rail-width); }

.page-hero--media {
  height: 100svh;
  min-height: 680px;
  padding: 36px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 36px;
  color: #050505;
  background: var(--paper);
}
.page-hero-media {
  position: relative;
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  width: auto;
  height: 100%;
  min-height: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 0;
  background: var(--cream);
}
.page-hero-media::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  display: none;
  pointer-events: none;
}
.page-hero-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: none;
  mix-blend-mode: normal;
  opacity: 1;
}
.page-hero--media .page-hero-content {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  max-width: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}
.page-hero--media .section-label {
  margin: 0 0 .8rem;
  color: #050505;
  font-family: var(--mono);
  font-size: var(--context-label-size);
  font-weight: 650;
  line-height: var(--context-label-leading);
  letter-spacing: var(--context-label-tracking);
}
.page-hero--media h1 {
  max-width: 33ch;
  margin: 0;
  color: #050505;
  font-family: var(--mono);
  font-size: clamp(1.25rem, 1.85vw, 1.62rem);
  font-weight: 480;
  line-height: 1.14;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.home-masthead h1 { max-width: 23ch; }
.masthead-intro {
  padding: clamp(3rem, 5vw, 5.5rem) var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) auto;
  align-items: end;
  gap: 3rem;
  background: var(--paper);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.masthead-intro > p {
  max-width: 850px;
  margin: 0;
  color: var(--ink);
  font-family: var(--display);
  font-size: var(--t4);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.035em;
}
.masthead-intro .button-row { margin: 0; flex-wrap: nowrap; }
.mobile-menu { z-index: 55; padding-top: 8rem; background: var(--stage-navy); }
body.menu-open .site-header .brand { color: white; }
body.menu-open .brand-logo__dark { opacity: 0; }
body.menu-open .brand-logo__light { opacity: 1; }

/* Partner, donation and contact service pages */
.support-hero .page-hero-content { max-width: 39rem; }
.support-hero .page-hero-content h1 { max-width: 20ch; }
.support-intro { background: var(--stage-paper); }
.support-section-head { max-width: 1080px; margin-bottom: clamp(2.5rem, 5vw, 5.5rem); }
.support-section-head h2 { max-width: 17ch; }
.partner-scene {
  --partner-gutter: clamp(54px, 6.35vw, 100px);
  position: relative;
  scroll-margin-top: 56px;
}
.partner-scene .section-label { margin-bottom: 0; font-family: var(--mono); font-size: 12px; letter-spacing: .075em; }
.partner-scene h2, .partner-scene h3, .partner-scene p, .partner-scene ol, .partner-scene ul, .partner-scene dl, .partner-scene dt, .partner-scene dd, .partner-scene figure { margin: 0; }
.partner-scene ol, .partner-scene ul { padding: 0; list-style: none; }

/* Partner 01 — ruhige, redaktionelle Lesebühne */
.partner-ways { color: var(--white); background: var(--navy); }
.partner-ways__layout {
  min-height: 1020px;
  padding: clamp(112px, 8vw, 138px) var(--partner-gutter) clamp(126px, 9vw, 154px);
  display: grid;
  grid-template-columns: minmax(350px, 5fr) minmax(48px, 1fr) minmax(520px, 6fr);
}
.partner-ways__head { grid-column: 1; }
.partner-ways .section-label, .partner-index { color: var(--orange-readable); }
.partner-ways__head h2 {
  max-width: 9.4ch;
  margin-top: 34px;
  font-size: clamp(64px, 5.7vw, 84px);
  font-weight: 790;
  letter-spacing: -.064em;
  line-height: .98;
}
.partner-ways__register { grid-column: 3; align-self: start; padding-top: 18px; }
.partner-ways__register li { display: block; }
.partner-ways__register li + li { margin-top: 46px; }
.partner-ways__register li:nth-child(3) { margin-top: 74px; }
.partner-ways__register li:nth-child(4) { margin-top: 58px; }
.partner-index { padding-top: 6px; font-family: var(--mono); font-size: 12px; font-weight: 600; letter-spacing: .06em; }
.partner-ways__register h3 { font-size: clamp(25px, 2.15vw, 32px); font-weight: 750; letter-spacing: -.04em; line-height: 1.08; }
.partner-ways__register strong { display: block; max-width: 47ch; margin-top: 8px; color: rgba(255,253,250,.96); font-size: 17px; font-weight: 680; line-height: 1.43; }
.partner-ways__register p { max-width: 58ch; margin-top: 10px; color: rgba(255,253,250,.67); font-size: 16px; line-height: 1.58; }

/* Partner 02 — ein zusammenhängender Programm-Bildraum */
.partner-programmes { background: var(--paper); }
.partner-programmes__composition {
  height: calc(100svh - 56px);
  min-height: 640px;
  display: grid;
  grid-template-columns: minmax(0, 46%) minmax(0, 54%);
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: clip;
}
.partner-programmes__head { z-index: 3; grid-column: 1; grid-row: 1; padding: clamp(60px, 5vw, 72px) clamp(22px, 2.4vw, 38px) 18px var(--partner-gutter); }
.partner-programmes__head .section-label { color: var(--orange-signal); }
.partner-programmes__head h2 { margin-top: 16px; font-size: clamp(52px, 4.2vw, 60px); font-weight: 790; letter-spacing: -.064em; line-height: .96; }
.partner-programme-stage { display: contents; }
.partner-stage-choices { z-index: 3; grid-column: 1; grid-row: 2; align-self: start; padding: 8px clamp(22px, 2.4vw, 38px) 0 var(--partner-gutter); }
.partner-stage-choices ul { display: flex; flex-direction: column; }
.partner-stage-choices li { position: relative; }
.partner-stage-choices a { min-height: 54px; display: flex; align-items: center; color: #7f8b89; transition: color 220ms ease; }
.partner-stage-choices a:hover, .partner-stage-choices a:focus-visible, .partner-stage-choices a[data-active="true"] { color: var(--ink); }
.partner-stage-choice__context { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.partner-stage-choice__name { display: block; font-size: clamp(32px, 3vw, 43px); font-weight: 580; letter-spacing: -.052em; line-height: 1; transition: color 220ms ease, font-weight 220ms ease; }
.partner-stage-choices a[data-active="true"] .partner-stage-choice__name { font-weight: 790; }
.partner-stage-document { z-index: 1; grid-column: 2; grid-row: 1 / 4; width: 100%; height: 100%; overflow: hidden; background: var(--cream); }
.partner-stage-document__images { position: relative; width: 100%; height: 100%; }
.partner-stage-document__image { position: absolute; inset: 0; opacity: 0; transition: opacity 380ms var(--ease); }
.partner-stage-document__image[data-active="true"] { opacity: 1; }
.partner-stage-document__image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.partner-stage-information { z-index: 4; grid-column: 1; grid-row: 3; align-self: start; display: grid; margin: 22px clamp(22px, 2.4vw, 38px) 0 var(--partner-gutter); pointer-events: none; }
.partner-stage-detail { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity 240ms ease, visibility 0s linear 240ms; }
.partner-stage-detail[data-active="true"] { opacity: 1; visibility: visible; transition-delay: 0s; }
.partner-stage-detail span { width: max-content; max-width: 100%; margin-bottom: 12px; padding: .4rem .65rem; display: block; color: var(--ink); background: var(--orange-soft); border-radius: 999px; font-family: var(--mono); font-size: .75rem; font-weight: 650; letter-spacing: .045em; line-height: 1.35; text-transform: uppercase; }
.partner-stage-detail p { max-width: 34ch; font-size: clamp(16px, 1.35vw, 19px); font-weight: 670; line-height: 1.42; }
.partner-mobile-programmes { display: none; }

/* Partner 03 — Wirkung ohne Kartenraster */
.partner-numbers { color: var(--navy); background: var(--orange-cta); }
.partner-numbers__layout {
  min-height: 860px;
  padding: clamp(86px, 6.6vw, 106px) var(--partner-gutter) clamp(88px, 6.8vw, 108px);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: clamp(62px, 5.5vw, 82px) clamp(14px, 1.8vw, 28px);
}
.partner-numbers__head { grid-column: 1 / 6; }
.partner-numbers__head h2 { max-width: 10.5ch; margin-top: 26px; font-size: clamp(50px, 4.6vw, 66px); font-weight: 790; letter-spacing: -.064em; line-height: .98; }
.partner-numbers__reach { grid-column: 6 / 13; align-self: center; }
.partner-numbers__reach dl { display: grid; grid-template-columns: minmax(220px, 1.15fr) minmax(190px, .85fr); grid-template-rows: auto auto; align-items: center; column-gap: clamp(24px, 2.4vw, 38px); }
.partner-numbers__reach dt { display: contents; }
.partner-numbers__reach .partner-number { grid-column: 1; grid-row: 1 / 3; align-self: center; font-size: clamp(204px, 20vw, 294px); letter-spacing: -.105em; line-height: .72; }
.partner-numbers__reach strong { grid-column: 2; grid-row: 1; align-self: end; max-width: 11ch; padding-bottom: 12px; font-size: clamp(22px, 2vw, 29px); line-height: 1.1; }
.partner-numbers__reach dd { grid-column: 2; grid-row: 2; align-self: start; max-width: 32ch; margin-top: 10px; font-size: 16px; line-height: 1.53; }
.partner-number { display: inline-block; perspective: 500px; font-family: var(--mono); font-weight: 400; }
.partner-digit { position: relative; display: inline-block; perspective: .82em; }
.partner-digit__face { display: inline-block; pointer-events: none; transform-origin: 50% 50%; transform-style: preserve-3d; backface-visibility: visible; }
.partner-numbers.is-counting .partner-number { animation: partner-number-arrival 780ms cubic-bezier(.2,.78,.22,1) both; }
.partner-numbers.is-counting .partner-numbers__evidence dl:nth-child(1) .partner-number { animation-delay: 100ms; }
.partner-numbers.is-counting .partner-numbers__evidence dl:nth-child(2) .partner-number { animation-delay: 180ms; }
.partner-numbers.is-counting .partner-numbers__evidence dl:nth-child(3) .partner-number { animation-delay: 260ms; }
@keyframes partner-number-arrival { from { opacity: .25; transform: translateY(.16em); } to { opacity: 1; transform: translateY(0); } }
@keyframes partner-digit-turn { 0% { opacity: 1; transform: rotateY(0deg) scale(1); } 46% { opacity: .74; transform: rotateY(198deg) scale(.965); } 100% { opacity: 1; transform: rotateY(360deg) scale(1); } }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .partner-digit__face.is-turning { animation: partner-digit-turn 520ms cubic-bezier(.2,.75,.25,1) both; } }
.partner-numbers__evidence { grid-column: 1 / 13; align-self: end; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(46px, 5vw, 80px); }
.partner-numbers__evidence .partner-number { display: block; font-size: clamp(80px, 7.7vw, 110px); letter-spacing: -.085em; line-height: .78; }
.partner-numbers__evidence strong { display: block; max-width: 18ch; margin-top: 20px; font-size: clamp(17px, 1.45vw, 21px); line-height: 1.14; }
.partner-numbers__evidence dd { max-width: 37ch; margin-top: 14px; font-size: 16px; line-height: 1.53; }

/* Partner 04 — ein klarer Abschluss statt zusätzlicher Förderkarten */
.partner-contact { color: var(--white); background: var(--navy-deep); }
.partner-contact__layout { min-height: calc(100svh - 56px); padding: clamp(86px, 7vw, 112px) var(--partner-gutter) clamp(78px, 6.4vw, 104px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(34px, 4.8vw, 76px) clamp(14px, 1.8vw, 28px); }
.partner-contact__head { grid-column: 1 / 8; }
.partner-contact__head .section-label { color: var(--orange-readable); }
.partner-contact__head h2 { max-width: 10.5ch; margin-top: 28px; font-size: clamp(58px, 5.6vw, 80px); font-weight: 790; letter-spacing: -.066em; line-height: .98; }
.partner-contact__next-step { grid-column: 8 / 13; align-self: start; padding-top: 45px; }
.partner-contact__next-step > p { max-width: 40ch; color: rgba(255,253,250,.74); font-size: clamp(18px, 1.4vw, 21px); line-height: 1.55; }
.partner-contact__links { margin-top: clamp(38px, 4.5vw, 62px); }
.partner-contact__action, .partner-contact__email { display: flex; align-items: center; justify-content: space-between; font-family: var(--mono); font-weight: 600; letter-spacing: .055em; text-transform: uppercase; }
.partner-contact__action { min-height: 76px; padding: 0 2px; border-top: 1px solid rgba(255,253,250,.42); border-bottom: 1px solid rgba(255,253,250,.42); font-size: 12px; transition: color 220ms var(--ease), background-color 220ms var(--ease), padding 220ms var(--ease); }
.partner-contact__action:hover, .partner-contact__action:focus-visible { padding-inline: 18px; color: var(--navy-deep); background: var(--orange-cta); }
.partner-contact__action span:last-child, .partner-contact__email span:last-child { font-size: 18px; transition: transform 220ms var(--ease); }
.partner-contact__action:hover span:last-child, .partner-contact__action:focus-visible span:last-child, .partner-contact__email:hover span:last-child, .partner-contact__email:focus-visible span:last-child { transform: translateX(5px); }
.partner-contact__email { min-height: 58px; color: rgba(255,253,250,.72); font-size: 11px; transition: color 180ms ease; }
.partner-contact__email:hover, .partner-contact__email:focus-visible { color: var(--white); }
.quick-way i, .contact-route i { align-self: center; color: var(--orange-signal); font-style: normal; }

@media (max-width: 1100px) {
  .partner-scene { --partner-gutter: clamp(40px, 5.2vw, 58px); }
  .partner-ways__layout { min-height: 0; display: block; padding-top: 96px; }
  .partner-ways__head h2 { max-width: 11ch; font-size: clamp(58px, 8vw, 68px); }
  .partner-ways__register { max-width: 620px; margin: 88px 0 0 auto; padding: 0; }
  .partner-ways__register li + li { margin-top: 52px; }
  .partner-ways__register li:nth-child(3) { margin-top: 76px; }
  .partner-ways__register li:nth-child(4) { margin-top: 62px; }
  .partner-programmes__composition { min-height: 620px; }
  .partner-programmes__head { padding: 52px 20px 14px var(--partner-gutter); }
  .partner-programmes__head h2 { margin-top: 14px; font-size: clamp(34px, 4.6vw, 38px); }
  .partner-stage-choices { padding: 6px 20px 0 var(--partner-gutter); }
  .partner-stage-choices a { min-height: 50px; }
  .partner-stage-choice__name { font-size: clamp(27px, 3.8vw, 32px); }
  .partner-stage-information { margin: 18px 20px 0 var(--partner-gutter); }
  .partner-stage-detail p { font-size: 16px; }
  .partner-numbers__layout { min-height: 800px; gap: 64px 20px; padding: 78px var(--partner-gutter) 88px; }
  .partner-numbers__head { grid-column: 1 / 7; }
  .partner-numbers__head h2 { font-size: clamp(43px, 5.8vw, 50px); }
  .partner-numbers__reach { grid-column: 7 / 13; }
  .partner-numbers__reach dl { grid-template-columns: minmax(132px, 1fr) minmax(132px, .9fr); column-gap: 14px; }
  .partner-numbers__reach .partner-number { font-size: clamp(150px, 21vw, 176px); }
  .partner-numbers__reach strong { max-width: 14ch; padding-bottom: 8px; }
  .partner-numbers__reach dd { margin-top: 6px; }
  .partner-numbers__evidence { gap: 28px; }
  .partner-numbers__evidence .partner-number { font-size: clamp(66px, 9vw, 76px); }
  .partner-numbers__evidence strong { font-size: 17px; }
  .partner-contact__layout { padding: 78px var(--partner-gutter) 84px; }
  .partner-contact__head h2 { font-size: clamp(48px, 6.4vw, 58px); }
  .partner-contact__next-step { grid-column: 7 / 13; padding-top: 42px; }
}

@media (max-width: 760px) {
  .partner-scene { --partner-gutter: 20px; scroll-margin-top: 0; }
  .partner-ways__layout { padding: 58px var(--partner-gutter) 76px; }
  .partner-ways__head h2 { max-width: none; margin-top: 22px; font-size: clamp(39px, 12vw, 46px); letter-spacing: -.058em; line-height: .99; }
  .partner-ways__register { max-width: none; margin-top: 48px; }
  .partner-ways__register li { display: block; }
  .partner-ways__register li + li, .partner-ways__register li:nth-child(n) { margin-top: 46px; }
  .partner-ways__register li:nth-child(3) { margin-top: 66px; }
  .partner-ways__register li:nth-child(4) { margin-top: 56px; }
  .partner-index { display: block; margin-bottom: 8px; padding: 0; }
  .partner-ways__register h3 { font-size: 25px; }
  .partner-ways__register strong { margin-top: 9px; font-size: 16px; line-height: 1.45; }
  .partner-ways__register p { margin-top: 9px; font-size: 16px; line-height: 1.55; }
  .partner-programmes__composition { height: auto; min-height: 0; display: block; overflow: visible; }
  .partner-programmes__head { display: block; padding: 30px var(--partner-gutter) 16px; }
  .partner-programmes__head h2 { max-width: none; margin-top: 12px; font-size: clamp(34px, 10.4vw, 39px); letter-spacing: -.058em; line-height: .99; }
  .partner-programme-stage { display: none; }
  .partner-mobile-programmes { display: block; padding-bottom: 24px; }
  .partner-mobile-programmes ul { padding: 0; list-style: none; }
  .partner-mobile-programmes li + li { margin-top: 8px; }
  .partner-mobile-programme { min-height: 44px; padding-bottom: 20px; display: block; }
  .partner-mobile-programme figure { width: calc(100% - 20px); aspect-ratio: 3 / 2; overflow: hidden; background: var(--cream); }
  .partner-mobile-programmes li:nth-child(even) figure { margin-left: 20px; }
  .partner-mobile-programme img { width: 100%; height: 100%; object-fit: cover; }
  .partner-mobile-programme > span { width: max-content; max-width: calc(100% - (2 * var(--partner-gutter))); margin: 13px var(--partner-gutter) 0; padding: .4rem .65rem; display: block; color: var(--ink); background: var(--orange-soft); border-radius: 999px; font-family: var(--mono); font-size: .75rem; font-weight: 650; letter-spacing: .045em; line-height: 1.35; text-transform: uppercase; }
  .partner-mobile-programme h3 { margin: 6px var(--partner-gutter) 0; font-size: 30px; font-weight: 770; letter-spacing: -.052em; line-height: 1; }
  .partner-mobile-programme p { margin: 8px var(--partner-gutter) 0; color: var(--muted); font-size: 16px; line-height: 1.42; }
  .partner-numbers__layout { min-height: 0; padding: 64px var(--partner-gutter) 82px; display: block; }
  .partner-numbers__head h2 { max-width: none; margin-top: 20px; font-size: clamp(39px, 11.7vw, 45px); letter-spacing: -.058em; line-height: .99; }
  .partner-numbers__reach { margin-top: 50px; }
  .partner-numbers__reach dl, .partner-numbers__reach dt { display: block; }
  .partner-numbers__reach .partner-number { display: block; font-size: clamp(108px, 34vw, 132px); line-height: .75; }
  .partner-numbers__reach strong { display: block; max-width: 14ch; margin-top: 26px; padding: 0; font-size: 23px; }
  .partner-numbers__reach dd { margin-top: 14px; font-size: 16px; line-height: 1.52; }
  .partner-numbers__evidence { margin-top: 76px; display: block; }
  .partner-numbers__evidence dl + dl { margin-top: 48px; }
  .partner-numbers__evidence .partner-number { display: block; font-size: 65px; line-height: .8; }
  .partner-numbers__evidence strong { display: block; max-width: 19ch; margin-top: 18px; font-size: 20px; }
  .partner-numbers__evidence dd { margin-top: 12px; font-size: 16px; line-height: 1.52; }
  .partner-contact__layout { min-height: 0; padding: 68px var(--partner-gutter) 76px; display: block; }
  .partner-contact__head h2 { max-width: none; margin-top: 20px; font-size: clamp(39px, 11.7vw, 45px); letter-spacing: -.058em; line-height: .99; }
  .partner-contact__next-step { margin-top: 64px; padding: 0; }
  .partner-contact__next-step > p { font-size: 17px; line-height: 1.55; }
  .partner-contact__links { margin-top: 38px; }
  .partner-contact__action { min-height: 68px; font-size: 10px; }
  .partner-contact__email { min-height: 56px; font-size: 10px; }
}
.support-navigator { padding-top: 0; padding-bottom: 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); background: var(--stage-paper); }
.support-navigator__item { min-height: 220px; padding: 1.5rem; display: grid; grid-template-columns: 1fr 2rem; grid-template-rows: auto 1fr; gap: .75rem; border-right: 1px solid var(--line); transition: color .3s var(--ease), background .3s var(--ease); }
.support-navigator__item:last-child { border-right: 0; }
.support-navigator__item:hover, .support-navigator__item.is-current { color: white; background: var(--navy); }
.support-navigator__num { color: var(--orange-signal); font-size: .68rem; }
.support-navigator__title { align-self: start; font-family: var(--display); font-size: var(--t3); font-weight: 750; line-height: 1; letter-spacing: -.04em; }
.support-navigator__copy { grid-column: 1 / 2; color: currentColor; font-size: .75rem; line-height: 1.4; opacity: .68; }
.support-navigator__arrow { align-self: end; color: var(--orange-signal); font-size: 1.1rem; }
.support-navigator__item:hover .support-navigator__num,
.support-navigator__item:hover .support-navigator__arrow,
.support-navigator__item.is-current .support-navigator__num,
.support-navigator__item.is-current .support-navigator__arrow { color: var(--orange-readable); }

/* Donation form */
.donation-section { background: var(--stage-paper); }
.donation-shell { display: grid; grid-template-columns: .78fr 1.22fr; overflow: hidden; background: var(--stage-paper); }
.donation-shell__intro { padding: clamp(2rem, 5vw, 5rem); color: white; background: var(--stage-navy); }
.donation-shell__intro h2 { max-width: 9ch; margin: 0; font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .9; letter-spacing: -.065em; }
.donation-shell__intro > p { max-width: 430px; margin: 2rem 0; color: rgba(255,255,255,.72); }
.donation-shell__intro .section-label { color: var(--orange-readable); }
.donation-form { padding: clamp(2rem, 5vw, 4.5rem); display: flex; flex-direction: column; gap: 2rem; }
.donation-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.donation-form legend { width: 100%; margin-bottom: .8rem; color: var(--ink); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.choice-row, .amount-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.choice-button, .amount-choice, .payment-choice { min-height: 52px; border: 1px solid var(--line); color: var(--ink); background: var(--white); cursor: pointer; transition: color .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease); }
/* Hover- und Auswahlzustand sind getrennt definiert, siehe Stufe-0-Block am Dateiende. */
.choice-button { font-size: .82rem; font-weight: 700; }
.amount-grid { grid-template-columns: repeat(4, 1fr); }
.amount-choice { font-weight: 700; }
.custom-amount { margin-top: .5rem; display: grid; grid-template-columns: 1fr 1.2fr; align-items: center; gap: 1rem; padding: .8rem 1rem; border: 1px solid var(--line); color: var(--ink); font-size: .78rem; }
.custom-amount__input { display: flex; gap: .5rem; align-items: center; }
.custom-amount__input b { color: var(--muted); font-size: .72rem; }
.custom-amount__input input { width: 100%; padding: .2rem 0; border: 0; border-bottom: 1px solid var(--ink); outline: 0; background: transparent; }
.payment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.payment-choice { padding: .75rem .9rem; display: flex; align-items: center; gap: .75rem; text-align: left; font-size: .78rem; font-weight: 650; }
.payment-choice__mark { min-width: 2.5rem; color: var(--navy); font-size: .67rem; font-weight: 800; letter-spacing: -.04em; }
.donation-summary { padding: 1rem; display: flex; justify-content: space-between; gap: 1rem; color: var(--ink); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: .78rem; }
.donation-summary span { color: var(--muted); }
.donation-submit { width: 100%; }
.integration-note { min-height: 1.5em; margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.45; }
.donation-impact { background: var(--stage-paper); }
.impact-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(3rem, 7vw, 7rem) clamp(1.25rem, 3vw, 3rem); align-items: start; }
.impact-item { min-width: 0; margin: 0; }
.impact-item--1 { grid-column: 1 / span 7; }
.impact-item--2 { grid-column: 9 / span 4; margin-top: clamp(5rem, 9vw, 9rem); }
.impact-item--3 { grid-column: 2 / span 4; }
.impact-item--4 { grid-column: 7 / span 6; margin-top: clamp(2.5rem, 5vw, 5rem); }
.impact-item__media { margin: 0; overflow: hidden; background: var(--cream); }
.impact-item__media picture,
.impact-item__media img { display: block; width: 100%; height: auto; }
.impact-item__body { margin-top: 1px; padding: 1rem; display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: .5rem 1rem; border-top: 1px solid var(--line); }
.impact-item__body > span { grid-column: 1; grid-row: 1 / span 3; color: var(--orange-signal); font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; }
.impact-item h3 { grid-column: 2; margin: 0; color: var(--ink); font-family: var(--display); font-size: var(--t4); font-weight: 750; line-height: .98; letter-spacing: -.045em; }
.impact-item p { grid-column: 2; margin: 0; color: var(--muted); font-size: .8rem; line-height: 1.48; }
.donation-note { max-width: 760px; margin: 1.5rem auto 0 0; color: var(--muted); font-size: .78rem; }
.recurring-band { display: grid; grid-template-columns: 1.12fr .88fr; color: white; background: var(--clay); }
.recurring-band__copy { padding: var(--section) var(--gutter); }
.recurring-band__copy h2 { max-width: 13ch; margin: 0; font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .9; letter-spacing: -.065em; }
.recurring-band__copy p { max-width: 560px; margin: 1.5rem 0 2rem; color: rgba(255,255,255,.78); }
.recurring-band__statement { padding: var(--section) var(--gutter); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1rem; border-left: 1px solid rgba(255,255,255,.25); }
.recurring-band__statement span { padding-bottom: .8rem; font-family: var(--display); font-size: var(--t3); font-weight: 750; line-height: .95; letter-spacing: -.055em; border-bottom: 1px solid rgba(255,255,255,.3); }
.bank-section { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 7vw, 8rem); background: var(--stage-paper); }
.bank-section__title h2 { max-width: 11ch; }
.bank-section__details { max-width: 540px; }
.bank-section__details > p:first-child { margin-top: 0; color: var(--muted); }
.bank-section dl { margin: 2rem 0; border-top: 1px solid var(--line); }
.bank-section dl div { padding: .9rem 0; display: grid; grid-template-columns: .7fr 1.3fr; gap: 1rem; border-bottom: 1px solid var(--line); }
.bank-section dt { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.bank-section dd { margin: 0; font-weight: 700; }
.donation-faq { background: var(--paper); }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { padding: 1.3rem 0; display: grid; grid-template-columns: 3rem 1fr 1.5rem; gap: 1rem; color: var(--ink); font-family: var(--display); font-size: var(--t3); font-weight: 700; line-height: 1.08; letter-spacing: -.035em; cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary span { color: var(--clay); font-family: var(--sans); font-size: .68rem; letter-spacing: .08em; }
.faq-item summary b { color: var(--orange-signal); font-weight: 400; }
.faq-item[open] summary b { transform: rotate(45deg); }
.faq-item p { max-width: 720px; margin: 0 0 1.5rem 4rem; color: var(--muted); }

/* Contact service */
.contact-safety-note { padding: 1rem var(--gutter); display: flex; justify-content: space-between; gap: 1rem; color: var(--ink); background: #ffd9cf; border-top: 1px solid rgba(242,72,34,.28); border-bottom: 1px solid rgba(242,72,34,.28); font-size: .76rem; }
.contact-safety-note strong { font-weight: 750; }
.contact-safety-note a { text-decoration: underline; text-underline-offset: .15em; }
.contact-quick { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(2rem, 8vw, 9rem); background: var(--stage-paper); }
.contact-quick__intro h2 { max-width: 10ch; }
.contact-quick__ways { border-top: 1px solid var(--line); }
.quick-way { min-height: 105px; padding: 1.15rem 0; display: grid; grid-template-columns: 3rem 1fr 2rem; gap: 1rem; align-items: start; border-bottom: 1px solid var(--line); transition: padding .3s var(--ease), background .3s var(--ease); }
.quick-way:hover { padding-right: .75rem; padding-left: .75rem; background: var(--paper); }
.quick-way > span { width: 2.25rem; height: 2.25rem; display: grid; place-items: center; color: white; background: var(--navy); border-radius: 50%; font-size: .6rem; font-weight: 750; }
.quick-way--whatsapp > span { color: var(--ink); background: var(--orange-cta); }
.quick-way strong { color: var(--ink); font-family: var(--display); font-size: var(--t3); font-weight: 750; line-height: 1; letter-spacing: -.035em; }
.quick-way p { margin: .4rem 0 0; color: var(--muted); font-size: .77rem; line-height: 1.45; }
.contact-routing { background: var(--stage-paper); }
.contact-routing__list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.contact-route { min-height: 160px; padding: 1.1rem 1.25rem; display: grid; grid-template-columns: 2.25rem 1fr 1.5rem; grid-template-rows: auto 1fr; align-items: start; gap: .65rem; border: 0; text-align: left; color: var(--ink); background: var(--white); cursor: pointer; transition: color .25s var(--ease), background .25s var(--ease); }
/* Hover- und Auswahlzustand sind getrennt definiert, siehe Stufe-0-Block am Dateiende. */
.contact-route > span { color: var(--orange-signal); font-size: .67rem; }
.contact-route strong { font-family: var(--display); font-size: var(--t3); font-weight: 750; line-height: 1; letter-spacing: -.04em; }
.contact-route p { grid-column: 2; margin: .15rem 0 0; color: currentColor; font-size: .76rem; line-height: 1.4; opacity: .7; }
.contact-route i { align-self: center; }
.contact-form-section { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(2rem, 8vw, 9rem); background: var(--stage-paper); }
.contact-form-section__intro h2 { max-width: 12ch; margin: 0; color: var(--ink); font-family: var(--display); font-size: var(--t2); font-weight: 800; line-height: .92; letter-spacing: -.06em; }
.contact-form-section__intro p { max-width: 450px; margin-top: 1.5rem; color: var(--muted); font-size: .84rem; line-height: 1.55; }
.contact-form--service { align-self: start; padding: clamp(1.5rem, 3vw, 3rem); border: 1px solid var(--line); background: var(--paper); }
.contact-extra-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.field-note { margin: 0; color: var(--clay); font-size: .73rem; line-height: 1.45; }
.contact-form__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem 1.5rem; }
.contact-whatsapp-link { color: var(--ink); font-size: .77rem; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }

@media (max-width: 760px) {
  :root { --rail-width: 58px; }
  .site-header { padding: 20px; }
  .site-header .brand { width: min(59vw, 230px); min-height: 0; }
  .brand-overline { font-size: .55rem; }
  .brand-logo { margin-top: -.25rem; }
  .header-rail { width: var(--rail-width); }
  .header-rail .menu-button { height: 68px; flex-basis: 68px; padding: 17px 13px 8px; }
  .header-rail .menu-button b { font-size: .48rem; }
  .rail-desktop-only { display: none; }
  .rail-link { min-height: 72px; padding: 8px 3px; }
  .rail-link svg, .rail-language-button svg { width: 19px; height: 19px; }
  .rail-link span, .rail-language-button span { font-size: .48rem; }
  .rail-language-button { min-height: 78px; padding: 8px 3px; }
  .rail-language-button strong { font-size: .62rem; }
  .page-hero--media {
    position: relative;
    height: 100svh;
    min-height: 680px;
    padding: 20px;
    display: block;
  }
  .page-hero-media {
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: auto;
    height: 48%;
    min-height: 0;
  }
  .page-hero--media .page-hero-content {
    position: absolute;
    z-index: 4;
    left: 20px;
    bottom: calc(48% + 48px);
    width: calc(100% - 40px);
    min-height: 0;
    display: flex;
  }
  .page-hero--media .section-label { font-size: .75rem; }
  .page-hero--media h1 { max-width: 100%; font-size: clamp(.92rem, 3.6vw, 1.18rem); line-height: 1.17; }
  .masthead-intro { grid-template-columns: 1fr; align-items: start; gap: 2rem; }
  .masthead-intro .button-row { flex-wrap: wrap; }
  .donation-shell, .recurring-band, .bank-section, .contact-quick, .contact-form-section { grid-template-columns: 1fr; }
  .impact-grid { grid-template-columns: 1fr; gap: clamp(2.5rem, 8vw, 4.5rem); }
  .impact-item--1, .impact-item--2, .impact-item--3, .impact-item--4 { grid-column: 1; margin-top: 0; }
  .recurring-band__statement { min-height: 240px; border-top: 1px solid rgba(255,255,255,.25); border-left: 0; }
  .contact-safety-note { align-items: flex-start; flex-direction: column; }
  .contact-routing__list { grid-template-columns: 1fr; }
  .contact-extra-fields { grid-template-columns: 1fr; }
  .quick-way { padding-right: 0; padding-left: 0; }
  .support-navigator { grid-template-columns: 1fr; }
  .support-navigator__item { border-right: 0; border-bottom: 1px solid var(--line); }
  .support-navigator__item:last-child { border-bottom: 0; }
}

@media (min-width: 761px) and (max-width: 1099px) {
  :root { --rail-width: 76px; }
  .header-rail .menu-button { height: 78px; flex-basis: 78px; padding: 20px 17px 10px; }
  .rail-link { min-height: 68px; padding-right: 4px; padding-left: 4px; }
  .rail-link span, .rail-language-button span { font-size: .52rem; }
  .rail-language-button { min-height: 80px; }
}

@media (max-height: 650px) and (min-width: 761px) {
  .header-rail .menu-button { height: 66px; flex-basis: 66px; padding-top: 15px; }
  .rail-link { min-height: 58px; gap: 4px; }
  .rail-link svg { width: 18px; height: 18px; }
  .rail-language-button { min-height: 68px; gap: 4px; }
}

@media (max-width: 480px) {
  .support-navigator { grid-template-columns: 1fr; }
  .support-navigator__item { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .support-navigator__item:last-child { border-bottom: 0; }
  .choice-row, .amount-grid, .payment-grid { grid-template-columns: 1fr 1fr; }
  .custom-amount { grid-template-columns: 1fr; gap: .5rem; }
  .donation-summary { align-items: flex-start; flex-direction: column; }
  .bank-section dl div { grid-template-columns: 1fr; gap: .2rem; }
  .faq-item summary { grid-template-columns: 2rem 1fr 1rem; }
  .faq-item p { margin-left: 2rem; }
}

/* Angebotsübersicht — freigegebene redaktionelle Seitenführung. */
#angebote-auswahl,
#angebote-jugendliche,
#angebot-open-doors,
#angebot-inspiring-evening,
#angebote-tutoring,
#angebote-kontakt { scroll-margin-top: 56px; }

.offers-decision {
  min-height: calc(100svh - 56px);
  padding: clamp(4.25rem, 6vw, 5.75rem) var(--gutter);
  display: grid;
  grid-template-columns: minmax(18rem, 4.2fr) minmax(34rem, 7.8fr);
  gap: clamp(4rem, 8vw, 8.25rem);
  align-items: start;
  overflow: hidden;
  color: var(--ink);
  background: var(--white);
  border-bottom: 1px solid var(--line);
}
.offers-decision__head {
  position: sticky;
  top: 6.5rem;
  min-height: 32rem;
  display: flex;
  flex-direction: column;
  align-self: start;
}
.offers-decision__head .section-label { margin: 0; color: var(--orange-signal); }
.offers-decision__head h2 {
  max-width: 10ch;
  margin: 1.75rem 0 0;
  font-size: clamp(3rem, 4.45vw, 4.125rem);
  font-weight: 780;
  letter-spacing: -.064em;
  line-height: .97;
}
.offers-decision__context {
  margin-top: clamp(4rem, 7vw, 5.625rem);
  padding-top: 1.375rem;
  border-top: 1px solid var(--ink);
}
.offers-decision__context p {
  max-width: 19ch;
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.45rem, 2.05vw, 1.875rem);
  font-weight: 650;
  letter-spacing: -.035em;
  line-height: 1.22;
}
.offers-decision__paths { margin: 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.offers-decision__paths a {
  position: relative;
  isolation: isolate;
  min-height: 8.125rem;
  padding: 1.375rem 1.5rem 1.375rem 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 1.75rem;
  gap: 1.375rem;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  transition: border-color .22s ease;
}
.offers-decision__paths a::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: rgba(255, 92, 56, .11);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .42s var(--ease);
}
.offers-decision__number {
  align-self: center;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: .7rem;
  font-weight: 600;
  transition: transform .26s var(--ease);
}
.offers-decision__path-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .625rem;
}
.offers-decision__path-copy strong {
  font-size: clamp(2.125rem, 3.35vw, 3.125rem);
  font-weight: 730;
  letter-spacing: -.055em;
  line-height: .98;
  transition: color .22s ease, transform .3s var(--ease);
}
.offers-decision__path-copy > span {
  max-width: 41rem;
  color: var(--muted);
  font-size: clamp(.95rem, 1.25vw, 1.125rem);
  line-height: 1.45;
  transition: color .18s ease, transform .26s var(--ease);
}
.offers-decision__paths i {
  color: var(--orange-signal);
  font-size: 1.25rem;
  font-style: normal;
  transition: transform .26s var(--ease);
}
.offers-decision__paths a:hover,
.offers-decision__paths a:focus-visible,
.offers-decision__paths a.is-active { border-bottom-color: var(--orange-signal); outline: none; }
.offers-decision__paths a:hover::before,
.offers-decision__paths a:focus-visible::before,
.offers-decision__paths a.is-active::before { transform: scaleX(1); transform-origin: left center; }
.offers-decision__paths a:hover .offers-decision__number,
.offers-decision__paths a:focus-visible .offers-decision__number,
.offers-decision__paths a.is-active .offers-decision__number,
.offers-decision__paths a:hover .offers-decision__path-copy strong,
.offers-decision__paths a:focus-visible .offers-decision__path-copy strong,
.offers-decision__paths a.is-active .offers-decision__path-copy strong { transform: translateX(.875rem); }
.offers-decision__paths a:hover .offers-decision__path-copy strong,
.offers-decision__paths a:focus-visible .offers-decision__path-copy strong,
.offers-decision__paths a.is-active .offers-decision__path-copy strong { color: var(--orange-signal); }
.offers-decision__paths a:hover i,
.offers-decision__paths a:focus-visible i,
.offers-decision__paths a.is-active i { transform: translateY(.55rem); }

.offers-youth { background: var(--white); }
.offers-programme {
  min-height: 45rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}
.offers-programme--reverse .offers-programme__media { grid-column: 2; grid-row: 1; }
.offers-programme--reverse .offers-programme__copy { grid-column: 1; grid-row: 1; }
.offers-programme__media {
  min-width: 0;
  min-height: 100%;
  margin: 0;
  overflow: hidden;
  background: var(--cream);
}
.offers-programme__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .9s var(--ease);
}
.offers-programme:hover .offers-programme__media img { transform: scale(1.018); }
.offers-programme__copy {
  padding: clamp(4.25rem, 7vw, 7rem) var(--gutter);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.offers-programme__copy h2 {
  margin: 0;
  font-size: clamp(3rem, 4.4vw, 4.25rem);
  font-weight: 760;
  letter-spacing: -.064em;
  line-height: .96;
}
.offers-programme__copy p { max-width: 42rem; margin: 1.5rem 0 0; color: var(--muted); }
.offers-programme__copy .offers-programme__lead {
  margin-top: 2.25rem;
  color: var(--ink);
  font-size: clamp(1.125rem, 1.6vw, 1.45rem);
  font-weight: 700;
  line-height: 1.42;
}
.offers-programme__copy .button { margin-top: 2.5rem; }

.offers-tutoring {
  min-height: 45rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  background: var(--white);
  border-bottom: 1px solid var(--line);
}
.offers-tutoring__content {
  min-width: 0;
  padding: clamp(4.25rem, 7vw, 7rem) var(--gutter);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.offers-tutoring__status {
  width: min(100%, 15rem);
  margin: 0 0 2.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--ink);
}
.offers-tutoring__status span {
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.offers-tutoring__status p { max-width: 19ch; margin: 1.25rem 0 0; }
.offers-tutoring__copy { align-self: stretch; }
.offers-tutoring__copy h2 {
  max-width: 9ch;
  margin: 0;
  font-size: clamp(3.125rem, 4.7vw, 4.375rem);
  font-weight: 780;
  letter-spacing: -.066em;
  line-height: .96;
}
.offers-tutoring__copy p { max-width: 36rem; margin: 1.5rem 0 0; color: #4f6362; font-size: 1.125rem; line-height: 1.58; }
.offers-tutoring__copy .button { margin-top: 2.5rem; }
.offers-tutoring__media { min-width: 0; min-height: 45rem; margin: 0; overflow: hidden; background: var(--cream); }
.offers-tutoring__media img { width: 100%; height: 100%; object-fit: cover; }

.offers-contact {
  min-height: 31.25rem;
  padding: clamp(4.875rem, 8vw, 7.625rem) var(--gutter);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(3rem, 8vw, 8.75rem);
  align-items: center;
  color: var(--ink);
  background: var(--orange-cta);
}
.offers-contact h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(3rem, 4.8vw, 4.5rem);
  font-weight: 780;
  letter-spacing: -.066em;
  line-height: .96;
}
.offers-contact > div p { max-width: 38ch; margin: 0; font-size: 1.25rem; line-height: 1.55; }
.offers-contact .button { margin-top: 2.5rem; }

@media (min-width: 1100px) {
  .offers-decision__path-copy > span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

@media (min-width: 761px) and (max-width: 1099px) {
  .offers-decision { min-height: 0; grid-template-columns: 1fr; gap: 3.875rem; }
  .offers-decision__head { position: static; min-height: 0; display: block; }
  .offers-decision__context { display: none; }
  .offers-programme { min-height: 38.75rem; }
  .offers-tutoring { min-height: 38.75rem; }
  .offers-tutoring__content { padding: 4.375rem var(--gutter); }
  .offers-tutoring__media { min-height: 38.75rem; }
}

@media (max-width: 760px) {
  #angebote-auswahl,
  #angebote-jugendliche,
  #angebot-open-doors,
  #angebot-inspiring-evening,
  #angebote-tutoring,
  #angebote-kontakt { scroll-margin-top: 0; }
  .offers-decision { min-height: 0; padding-top: 4.25rem; padding-bottom: 4.625rem; grid-template-columns: 1fr; gap: 3rem; }
  .offers-decision__head { position: static; min-height: 0; display: block; }
  .offers-decision__head h2 { margin-top: 1.25rem; font-size: clamp(2.625rem, 13vw, 3.625rem); }
  .offers-decision__context { display: none; }
  .offers-decision__paths a { min-height: 0; padding: 1.625rem 0; grid-template-columns: 1fr; gap: .875rem; }
  .offers-decision__paths i { display: none; }
  .offers-decision__path-copy { gap: .55rem; }
  .offers-decision__path-copy strong { font-size: clamp(1.8rem, 9.5vw, 2.5rem); }
  .offers-decision__path-copy > span { font-size: .94rem; }
  .offers-decision__paths a:hover .offers-decision__number,
  .offers-decision__paths a:focus-visible .offers-decision__number,
  .offers-decision__paths a.is-active .offers-decision__number,
  .offers-decision__paths a:hover .offers-decision__path-copy strong,
  .offers-decision__paths a:focus-visible .offers-decision__path-copy strong,
  .offers-decision__paths a.is-active .offers-decision__path-copy strong { transform: none; }
  .offers-programme { min-height: 0; display: flex; flex-direction: column; }
  .offers-programme__media,
  .offers-programme--reverse .offers-programme__media { order: 1; grid-column: auto; grid-row: auto; height: 22.5rem; }
  .offers-programme__copy,
  .offers-programme--reverse .offers-programme__copy { order: 2; grid-column: auto; grid-row: auto; padding: 4.125rem var(--gutter) 4.625rem; }
  .offers-programme__copy h2 { font-size: 2.875rem; }
  .offers-programme__copy .offers-programme__lead { margin-top: 1.75rem; font-size: 1.125rem; }
  .offers-tutoring { min-height: 0; display: flex; flex-direction: column; }
  .offers-tutoring__media { order: 1; height: 22.5rem; min-height: 22.5rem; }
  .offers-tutoring__content { order: 2; padding: 3.875rem var(--gutter) 4.625rem; }
  .offers-tutoring__status { max-width: 13.75rem; margin-bottom: 2.75rem; }
  .offers-tutoring__copy h2 { font-size: clamp(2.875rem, 14vw, 3.875rem); }
  .offers-contact { min-height: 0; padding: 4.5rem var(--gutter) 5rem; display: block; }
  .offers-contact h2 { font-size: clamp(2.625rem, 13vw, 3.625rem); }
  .offers-contact > div { margin-top: 2.375rem; }
  .offers-contact > div p { font-size: 1.125rem; }
  .offers-programme__copy .button,
  .offers-tutoring__copy .button,
  .offers-contact .button { width: 100%; }
}

@media (max-width: 360px) {
  .offers-decision__head h2 { font-size: 2.25rem; }
  .offers-decision__path-copy strong { font-size: 1.65rem; overflow-wrap: anywhere; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Designsystem v1 — normalized foundations and component behavior. */
.section-label,
.brand-overline,
.index,
.num,
.eyebrow,
.footer-label,
.values-story__count {
  font-family: var(--mono);
}
.section-label { min-height: 1.25rem; margin-bottom: 1.5rem; font-size: clamp(.75rem, .82vw, .875rem); letter-spacing: .075em; }
.big-serif,
.display-title,
.offers-head h2,
.feature-copy h2,
.lead-block p,
.content-block h2,
.closing-cta h2,
.donation-shell__intro h2,
.recurring-band__copy h2,
.contact-form-section__intro h2,
.values-story__intro h2,
.values-story__value h3,
.values-story__outro h3 { letter-spacing: -.045em; line-height: .94; }
.button { min-height: 48px; padding: .8rem 1rem; font-size: .875rem; }
.button:active { transform: translateY(0); }
.content-block .copy,
.intro-body,
.feature-copy p,
.masthead-intro > p { color: var(--muted); }
.content-block .copy { font-size: 1rem; line-height: 1.65; }
.content-block .copy a,
.form-note a,
.site-footer p a { text-decoration: underline; text-decoration-thickness: .08em; text-underline-offset: .18em; }
.editorial-image img,
.feature-visual img { width: 100%; height: 100%; }
.editorial-image-frame picture,
.feature-visual picture,
.page-hero-media picture { display: block; width: 100%; height: 100%; }
.brand--footer { width: min(220px, 70%); }
.brand--footer img { width: 100%; height: auto; }
.footer-grid a,
.to-top { min-height: 32px; display: inline-flex; align-items: center; }
.to-top { min-width: 44px; justify-content: flex-end; }
.route-announcer {
  position: fixed;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.reveal { opacity: 1; transform: none; }
.reveal.reveal-ready { opacity: 0; transform: translateY(18px); }
.reveal.reveal-ready.is-visible { opacity: 1; transform: none; }
.mobile-menu { overflow-y: auto; overscroll-behavior: contain; }

/* Audience map */
.audience-map { color: var(--ink); background: var(--stage-paper); }
.audience-map__head { max-width: 900px; margin-bottom: clamp(2.5rem, 5vw, 5rem); }
.audience-map__head h2 { max-width: 13ch; margin: 0; font-size: var(--t2); font-weight: 800; line-height: .94; letter-spacing: -.045em; }
.audience-map__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 2rem); }
.audience-card { position: relative; min-height: 330px; padding: 0; display: flex; flex-direction: column; overflow: hidden; background: var(--white); transition: color .28s var(--ease), background .28s var(--ease); }
.audience-card .od-tile__media { aspect-ratio: 3 / 2; }
.audience-card .od-tile__media picture,
.audience-card .od-tile__media img { display: block; width: 100%; height: 100%; }
.audience-card .od-tile__media img { object-fit: cover; transition: transform .45s var(--ease); }
.audience-card > .audience-card__num { margin: 1.25rem 1.5rem 0; color: var(--orange-signal); font-family: var(--mono); font-size: .75rem; }
.audience-card .od-chip { margin-top: 0; }
.audience-card h3 { max-width: 10ch; margin: 1.5rem 1.5rem .8rem; font-size: var(--t4); line-height: .98; letter-spacing: -.04em; }
.audience-card p { max-width: 32rem; margin: 0 1.5rem; color: var(--muted); font-size: .9rem; line-height: 1.55; }
.audience-card__arrow {
  width: 2.5rem;
  height: 2.5rem;
  margin: 1.25rem 1.5rem 1.5rem auto;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: .9rem;
  transition: color .2s var(--ease), background .2s var(--ease), transform .2s var(--ease);
}
.audience-card:hover .audience-card__arrow {
  color: var(--ink);
  background: var(--orange-cta);
  transform: translateX(4px);
}
.audience-card:hover { color: white; background: var(--navy); }
.audience-card:hover .od-tile__media img,
.audience-card:focus-visible .od-tile__media img { transform: scale(1.035); }
.audience-card:hover .od-chip,
.audience-card:hover p { color: rgba(255,255,255,.76); }

/* Accessible video story */
.values-story__hud { grid-template-columns: minmax(100px, 14vw) auto; }
.values-story__toggle { min-height: 44px; padding: .55rem .8rem; border: 1px solid rgba(255,255,255,.55); color: white; background: rgba(15,24,43,.55); font-size: .75rem; cursor: pointer; }
.values-story__semantic {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Funktionale Grenzen werden als normaler Satz erklärt, nicht als Status-Chip. */
.service-note { margin-top: var(--s2); color: var(--muted) !important; font-size: .86rem !important; line-height: 1.55 !important; }
.quick-way:is(button) { width: 100%; border: 0; border-bottom: 1px solid var(--line); text-align: left; color: inherit; background: transparent; cursor: pointer; }
.choice-button,
.amount-choice,
.payment-choice { position: relative; cursor: pointer; }
.choice-button input,
.amount-choice input,
.payment-choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.choice-button:focus-within,
.amount-choice:focus-within,
.payment-choice:focus-within { outline: 3px solid var(--white); outline-offset: 2px; box-shadow: 0 0 0 5px var(--ink); }
.choice-button { display: grid; place-items: center; }
.amount-choice { display: grid; place-items: center; }
.payment-choice { min-height: 56px; }
.contact-form__actions .button { cursor: pointer; }
.not-found { min-height: 100svh; padding-top: 12rem; }
.not-found h1 { max-width: 24ch; margin: 0; }
.page-hero h1:focus,
.not-found h1:focus { outline: 0; box-shadow: none; }

@media (min-width: 761px) and (max-width: 1024px) {
  .page-hero--media { height: 100svh; min-height: 720px; padding: 28px; grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr); gap: 28px; }
  .page-hero-media { width: 100%; height: auto; min-width: 0; aspect-ratio: 4 / 5; align-self: center; }
  .page-hero--media h1 { font-size: clamp(1.25rem, 2.4vw, 1.55rem); }
  .audience-map__grid { grid-template-columns: 1fr 1fr; }
  .audience-card:last-child { grid-column: 1 / -1; min-height: 260px; }
}

@media (max-width: 760px) {
  .brand-overline { font-size: .67rem; }
  .rail-link span,
  .rail-language-button span { font-size: .62rem; }
  .header-rail .menu-button b { font-size: .58rem; }
  .page-hero--media .section-label { font-size: .75rem; }
  .page-hero--media h1 { font-size: clamp(1.15rem, 5vw, 1.4rem); line-height: 1.25; }
  .page-hero-media { left: 20px; right: auto; width: calc(100% - 40px); height: auto; aspect-ratio: 3 / 4; justify-self: auto; }
  .audience-map__grid { grid-template-columns: 1fr; }
  .audience-card { min-height: 270px; }
  .values-story__copy,
  .values-story__scroll,
  .values-story__hud { display: none; }
  .values-story__semantic {
    position: relative;
    width: auto;
    height: auto;
    margin: 0;
    padding: var(--section) var(--gutter);
    overflow: visible;
    clip: auto;
    white-space: normal;
    color: var(--ink);
    background: var(--paper);
  }
  .values-story__semantic > h2 { max-width: 14ch; margin: 0; font-size: var(--t2); line-height: .94; letter-spacing: -.045em; }
  .values-story__semantic > p { max-width: 40rem; color: var(--muted); }
.values-story__semantic ul { margin: 3rem 0 0; padding: 0; border-top: 1px solid var(--border); list-style: none; }
  .values-story__semantic li { padding: 2rem 0; border-bottom: 1px solid var(--border); }
  .values-story__semantic li > span { color: var(--orange-signal); font-family: var(--mono); font-size: .75rem; }
  .values-story__semantic li h3 { margin: .75rem 0; font-size: var(--t3); line-height: .98; letter-spacing: -.04em; }
  .values-story__semantic li p { max-width: 35rem; margin: 0; color: var(--muted); }
  .values-story__stage { min-height: clamp(20rem, 62vw, 34rem); padding: 0; }
  .values-story__video,
  .values-story__wash { height: 100%; }
}

@media (max-height: 620px) {
  .mobile-menu { place-items: start center; padding-top: 5rem; }
}

/* ============================================================================
   Stufe 0 — Pflichtkorrekturen (25.07.2026)
   Jede Regel behebt einen belegten Befund aus ANALYSE_2026-07-25/UI_UX_IST_AUDIT.md.
   Bewusst als eigener, benannter Block, damit die Änderungen einzeln
   nachvollziehbar und reversibel bleiben.
   ========================================================================= */

/* 0.1 — Lead-Block: Inhalte gebündelt in Spalte 2; leadTitle erhält eine Rolle.
   Vorher rutschte der erste Lead-Absatz durch implizite Grid-Platzierung in die
   Schmalspalte und wurde dort mit 61px gesetzt; das <h2> blieb unformatiert. */
.lead-block__body { grid-column: 2; min-width: 0; }
.lead-block__body > p { max-width: 950px; }
/* Lead-Ueberschrift: siehe Stufe-1-Block (Typo-Leiter T3). */
.lead-block--titled .lead-block__body > p {
  max-width: 62ch;
  margin: 0 0 1rem;
  color: var(--muted);
  font-family: var(--display);
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  font-weight: 400;
  line-height: 1.62;
  letter-spacing: normal;
}
.lead-block--titled .lead-block__body > p:last-child { margin-bottom: 0; }

/* 0.2 — Werte-Text erhält eine eigene Fläche. Der Wash fiel bei 64% Breite auf
   .24 Deckkraft, während der Text bis ~63% reicht; da das Video ein Loop ist,
   war WCAG 1.4.3 nicht durch die Wahl eines Einzelbildes erfüllbar. */
.values-story:not(.values-story--static) .values-story__pane {
  padding: clamp(1.5rem, 2.6vw, 2.5rem);
  background: rgba(15, 24, 43, .92);
}
.values-story:not(.values-story--static) .values-story__wash {
  background: linear-gradient(90deg, rgba(7,23,35,.55) 0%, rgba(7,23,35,.34) 42%, rgba(7,23,35,.12) 100%),
              linear-gradient(0deg, rgba(7,23,35,.5) 0%, transparent 46%);
}

/* 0.4 — Hover und Auswahl trennen. Vorher teilten beide Zustände dieselbe
   Regel: beim Überfahren erschienen zwei Optionen gleichzeitig als gewählt,
   und der Auswahlzustand lag ausschliesslich in der Farbe (WCAG 1.4.1). */
.choice-button:hover, .amount-choice:hover, .payment-choice:hover {
  border-color: var(--ink);
  color: var(--ink);
  background: var(--white);
}
.choice-button.is-selected, .amount-choice.is-selected, .payment-choice.is-selected {
  border-color: var(--orange-signal);
  color: var(--ink);
  background: var(--orange-soft);
}
.choice-button.is-selected::after, .amount-choice.is-selected::after, .payment-choice.is-selected::after {
  content: "✓";
  position: absolute;
  top: 4px;
  right: 6px;
  color: var(--orange-signal);
  font-size: .8rem;
  font-weight: 700;
  line-height: 1;
}
.contact-route:hover { color: var(--ink); background: var(--cream); }
.contact-route.is-selected {
  color: white;
  background: var(--navy);
  box-shadow: inset 4px 0 0 var(--orange-cta);
}
.contact-route.is-selected > span { color: var(--orange-readable); }
.contact-route.is-selected > span::after { content: " ✓"; color: var(--orange-readable); }

/* 0.5 — --orange-signal auf --cream erreicht nur 4,42:1. Die redaktionelle
   Bildfolge setzt ihre Beschriftungen deshalb auf den geprüften weissen Grund
   (5,08:1), ohne aus den Motiven wieder gleichförmige Karten zu machen. */
.donation-impact .impact-item__body { background: var(--white); }

/* 0.7 — Menü: Trefferflächen ≥48px und linksbündig statt zentriert. */
.mobile-menu { place-items: center start; }
.mobile-menu nav { align-items: flex-start; gap: .25rem; width: min(100%, 40rem); }
.mobile-menu a {
  min-height: 48px;
  width: 100%;
  padding: .35rem 0;
  display: flex;
  align-items: center;
}
.mobile-menu a:hover { transform: none; }

/* 0.9 — Klickbarkeitsanzeige der Angebotszeilen auf dem Smartphone. Vorher
   entfiel der Kreis-Pfeil unter 480px vollständig, wodurch die Hauptnavigation
   zu den Angeboten auf dem wichtigsten Viewport keine Anzeige mehr hatte. */
@media (max-width: 480px) {
  .offer-row { grid-template-columns: 1fr 2rem; }
  .offer-row .round-arrow {
    width: 30px;
    height: 30px;
    display: grid;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    font-size: .82rem;
  }
  .offer-row p { grid-column: 1 / -1; }
}

/* 0.10 — Rail-Beschriftungen: eine Grösse statt zweier konkurrierender Regeln
   im gleichen Breakpoint (.48rem gegen .62rem), plus Umbruchschutz. */
@media (max-width: 760px) {
  .rail-link span, .rail-language-button span {
    font-size: .58rem;
    letter-spacing: 0;
    overflow-wrap: anywhere;
    hyphens: auto;
  }
}

/* 0.11 — Button-Überlauf hinter der Schnellzugriffsleiste. Vorher schnitt die
   Leiste den Pfeil des vollbreiten Buttons bei 390px an. */
@media (max-width: 480px) {
  .button-row { align-items: stretch; }
  .button { width: auto; justify-content: space-between; gap: 1rem; }
}

/* 0.15 — Die Markenspalte der Zahlungsarten entfällt. Vorher fiel sie für TWINT
   und PayPal auf das Label zurück ("TWINT TWINT") und zeigte ein irreführendes Öffnen-Symbol.
   Ein Platzhalter ohne Inhalt wäre ein toter Haken; die Spalte kommt mit der
   echten Zahlungsanbindung und echten Markenzeichen zurück. */

/* 0.16 — Buttons erben keine Textunterstreichung aus .content-block .copy. */
.content-block .copy a.button { text-decoration: none; }

/* 0.17 — Kein leeres achtes Rasterfeld. Die sieben Anliegen füllen das Raster
   jetzt vollständig; das letzte Element nimmt die Restbreite ein. */
.contact-routing__list > :last-child:nth-child(odd) { grid-column: 1 / -1; }

/* 0.18 — Reveal entschärfen. Vorher 750ms und 22px: bei zügigem Scrollen waren
   ganze Sektionen messbar mit opacity 0 sichtbar, also leere Flächen.
   Fliesstextblöcke werden gar nicht mehr eingeblendet. */
.reveal.reveal-ready { transform: translateY(8px); }
.reveal.reveal-ready, .reveal.reveal-ready.is-visible {
  transition: opacity .35s var(--ease), transform .35s var(--ease);
}
.content-block.reveal.reveal-ready,
.lead-block.reveal.reveal-ready,
.section-intro.reveal.reveal-ready {
  opacity: 1;
  transform: none;
}

/* 0.23 — Formularfelder mit sichtbarer Ausdehnung und ausreichender
   Trefferfläche. Vorher war die Feldgrenze unsichtbar und die Trefferfläche so
   schmal wie die Textzeile. */
.field input, .field select, .field textarea {
  min-height: 48px;
  padding: .75rem .75rem;
  background: rgba(6, 45, 51, .035);
  border-bottom: 1px solid var(--ink);
}
.field textarea { min-height: 150px; }
.field input:hover, .field select:hover, .field textarea:hover { background: rgba(6, 45, 51, .06); }
.custom-amount__input input { min-height: 40px; padding: .2rem .5rem; background: rgba(6, 45, 51, .035); }

/* ============================================================================
   Stufe 1 — Systemkorrekturen (26.07.2026)
   ========================================================================= */

.content-block__head { min-width: 0; }
.offer-row__head { min-width: 0; display: block; }

/* 1.17 — Die Lead-Aussage ist jetzt eine Ueberschrift und traegt die
   Display-Stufe; ergaenzende Absaetze treten zurueck. */
.lead-block__body h2 {
  max-width: 26ch;
  margin: 0;
  color: var(--ink);
  font-family: var(--display);
  font-size: var(--t2-display);
  font-weight: 700;
  line-height: .99;
  letter-spacing: -.05em;
}
.lead-block--titled .lead-block__body h2 { margin-bottom: 1.5rem; }

/* 1.8 — Auswahlkarten tragen kein Richtungszeichen mehr; das Feld entfaellt. */
.contact-route { grid-template-columns: 1fr; }
.contact-route p { grid-column: 1; }

/* Karten oben verankern und gemeinsame Grundlinien erzwingen. */

.audience-card { min-height: 0; }
.impact-item { min-height: 0; }
.support-navigator__item { min-height: 0; grid-template-rows: auto auto auto; }
.support-navigator__arrow { align-self: start; }
.contact-route { min-height: 0; }
.contact-route i { align-self: start; }

/* Nur dort, wo das Raster mehrspaltig ist. Bei einer Spalte wuerden die
   expliziten Zeilen eine leere 1fr-Zeile oberhalb der Karten aufspannen. */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 761px) {
    /* 01 · Label · Titel · Text · Status */
    .audience-map__grid { grid-template-rows: auto auto 1fr auto; }
    .audience-card { display: grid; grid-row: span 4; grid-template-rows: subgrid; align-content: start; }
  }
}

/* ============================================================================
   Stufe 2 — Komponentenfamilien (26.07.2026)
   ========================================================================= */

/* 2.9 — Ruhige Header-Variante ohne Bild für /datenschutz und die 404-Seite.
   Vorher trugen diese Seiten eine eigene Designsprache: Manrope 93 bzw. 112px
   statt Mono, 560px statt 100svh, plus ein dekoratives Linien- und
   Kreisornament, das es nirgends sonst gibt. */
.page-hero--plain { grid-template-columns: minmax(0, 1fr) minmax(0, .38fr); }
.page-hero--plain .page-hero-content { grid-column: 1; }
.page-hero--plain::after,
.page-hero--plain .page-hero-content p {
  max-width: 56ch;
  margin-top: var(--s3);
  color: var(--muted);
}
.page-hero--plain .button-row { margin-top: var(--s3); }
.not-found.page-hero--plain { min-height: 0; height: auto; padding-block: var(--s6); }

/* 2.11 — Tablet-Bruch des Mastheads. Vorher setzte der Breakpoint 761–1024px
   das Bild auf aspect-ratio 4/5 UND align-self: center. Es berührte danach
   keine Rahmenkante mehr und schwebte als 431×539-Rechteck in der Mitte:
   190px Abstand zur Überschrift, 286px leeres Band darunter (gemessen bei
   834×1112). Nach DNA 1 muss die Leerfläche eingefasst sein, also muss das
   Bild mindestens zwei Rahmenkanten berühren. */
@media (min-width: 761px) and (max-width: 1024px) {
  .page-hero--media { grid-template-columns: minmax(220px, .82fr) minmax(0, 1.18fr); }
  .page-hero-media {
    width: 100%;
    height: 100%;
    min-height: 0;
    aspect-ratio: auto;
    align-self: stretch;
    justify-self: stretch;
  }
}

/* Kurze Viewports: die Aussage darf nicht unter die Falz rutschen. Bei
   844×390 lag die Überschrift auf y=590, also 200px unterhalb der Falz. */
@media (max-height: 620px) and (min-width: 761px) {
  .page-hero--media { height: auto; min-height: 0; padding-block: var(--s3); }
  .page-hero-media { aspect-ratio: 3 / 2; height: auto; }
}

/* 2.3 — Familie A: die redaktionelle Einheit. Vorher stand das Label allein in
   einer 39% breiten leeren Spalte (gemessen bei 1920: Label bei x=72, Statement
   ab x=746), darunter rund 550px Leere ohne Anker. Label, Aussage und
   Stuetzabsatz bilden jetzt eine Einheit an einer Textkante; die rechte
   Restflaeche ist durch Sektionskante und Leiste eingefasst. */
.section-intro {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  row-gap: var(--s3);
  column-gap: var(--s4);
}
.section-intro > * { grid-column: 1; }
.section-intro .section-label { padding-top: 0; }
.intro-statement { padding-top: 0; }
.intro-body { grid-column: 1; max-width: 62ch; }

/* 2.3b — content-block: die Ueberschriftenspalte war deutlich breiter als ihr
   Inhalt; bei 1920 blieben rund 470px totes Feld zwischen Ueberschrift und
   Text. Die Spalte wird auf die natuerliche Breite der Ueberschrift begrenzt. */
.content-block { grid-template-columns: minmax(0, 22ch) minmax(0, 1fr); }

/* 2.8 — Vier Bildrollen. Die Editorial-Strecke folgt jetzt dem Quellformat:
   Querformat 4:3, Hochformat 3:4. Kein Bild wird enger als 3:4 beschnitten. */
.editorial-image-frame { height: auto; }
.editorial-image.is-landscape .editorial-image-frame { aspect-ratio: 4 / 3; }
.editorial-image.is-portrait .editorial-image-frame { aspect-ratio: 3 / 4; }
.editorial-media--three,
.editorial-media--two { align-items: start; }
.editorial-media--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.editorial-media--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 760px) {
  .editorial-media--three { grid-template-columns: 1fr 1fr; }
  .editorial-media--three .editorial-image:first-child { grid-column: 1 / -1; }
  .editorial-image-frame,
  .editorial-media--two .editorial-image-frame { height: auto; }
}
@media (max-width: 480px) {
  .editorial-media--three,
  .editorial-media--two { grid-template-columns: 1fr; }
  .editorial-media--three .editorial-image:first-child { grid-column: auto; }
}

/* 2.5 — Die Werte-Sektion war 5,48 Viewports lang fuer fuenf Wertesaetze und
   liess sich nicht ueberspringen. Trigger von 78 auf 52vh, plus ein Sprunglink. */
.values-story__skip {
  position: absolute;
  z-index: 3;
  top: clamp(1.35rem, 3vw, 2.5rem);
  left: var(--gutter);
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: #fff;
  font-family: var(--mono);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(255,255,255,.6);
}
.values-story__skip:hover { border-bottom-color: var(--orange-cta); color: var(--orange-readable); }
.values-story--static .values-story__skip { display: none; }
@media (max-width: 760px) { .values-story__skip { display: none; } }

/* 2.6 — Index-Zeilen (Familie B) als eigenstaendige Komponente. Bisher
   existierte dieses Muster nur als .offer-row auf der Startseite. */
.donation-intents { background: var(--stage-paper); }
.od-index-list { border-top: 1px solid var(--line); }
.od-row {
  width: 100%;
  padding: 26px 0;
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr) auto 2.5rem;
  gap: var(--s3);
  align-items: start;
  text-align: left;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.od-row--simple { grid-template-columns: 3.5rem minmax(0, 1fr) 2.5rem; }
.od-row--plain { grid-template-columns: minmax(0, 1fr); }
.od-row__num { padding-top: .35rem; font-family: var(--mono); font-size: var(--t6); color: var(--muted); }
.od-row__body { min-width: 0; display: block; }
.od-row__title {
  display: block;
  font-family: var(--display);
  font-size: var(--t3);
  font-weight: 750;
  line-height: .98;
  letter-spacing: -.04em;
}
.od-row__text { display: block; margin-top: .5rem; max-width: 52ch; color: var(--muted); font-size: .95rem; }
.od-row__sign {
  width: 42px; height: 42px;
  justify-self: end; align-self: center;
  display: grid; place-items: center;
  border: 1px solid currentColor; border-radius: 50%;
  transition: transform .2s var(--ease);
}
.od-row:hover .od-row__title { color: var(--orange-signal); }
.od-row:hover .od-row__sign { transform: translateX(4px); }

@media (max-width: 760px) {
  .od-row { grid-template-columns: minmax(0, 1fr) 34px; row-gap: var(--s1); }
  .od-row--plain { grid-template-columns: minmax(0, 1fr); }
  .od-row__sign { width: 34px; height: 34px; align-self: start; }
}

/* 2.10 — Index-Zeile ohne Interaktion: kein Zeichen, kein Zeiger, kein Hover. */
.od-row--static { cursor: default; }
.od-row--static:hover .od-row__title { color: inherit; }
.index-empty {
  max-width: 62ch;
  margin: var(--s4) 0 0;
  padding: var(--s3);
  border-left: 4px solid var(--orange-signal);
  background: var(--orange-soft);
  color: var(--ink);
  font-size: .95rem;
  line-height: 1.6;
}

/* 2.1 / 2.2 — Chip-Anatomie: die Zielgruppe war ein 12px-Mono-Text in Grau,
   waehrend die Handlung mit 45px gesetzt war. Die Zielgruppe ist aber der
   Schluessel zur Orientierung und wird jetzt ein gefuellter Mono-Chip. */
.od-tile__media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  background: var(--cream);
}
.od-chip {
  align-self: start;
  padding: 5px 9px;
  background: var(--navy);
  color: #fff;
  font-family: var(--mono);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  line-height: 1.3;
}
.od-tile__media .od-chip { position: absolute; bottom: 0; left: 0; }
.audience-card:hover .od-chip { background: var(--orange-cta); color: var(--ink); }
.audience-card > .audience-card__num { color: var(--orange-signal); }

/* ============================================================================
   Stufe 3 — Seitenübergreifend (26.07.2026)
   ========================================================================= */

/* 3.4a — Positionierung und Zielgruppen sind eine Sektion. Die Einheit behält
   ihre eigene Textkante; darunter folgt der Einstiegs-Kopf. */
.audience-map .section-intro {
  padding: 0 0 var(--s5);
  margin-bottom: var(--s5);
  border-bottom: 1px solid var(--border);
  border-top: 0;
  background: transparent;
}

/* 3.4b — Die eine orange Bühne der Startseite. Vorher folgten Werte-Sektion,
   Spendenband und Footer als drei dunkle Flächen aufeinander. */
.donate-band--signal { color: var(--ink); background: var(--stage-signal); }
.donate-band--signal .section-label { color: var(--ink); }
.donate-band--signal .donate-art { background: transparent; }
.donate-band--signal .donate-art span { border-color: rgba(6,45,51,.35); }
.donate-band--signal .donate-art span:nth-child(2) { background: rgba(6,45,51,.12); }
.donate-band--signal .donate-art span:nth-child(3) { background: var(--paper); }

/* 3.3 — Zielgruppen als zweite Navigationsdimension im Vollbildmenü. */
.mobile-menu__nav { width: min(100%, 40rem); }
.mobile-menu__label {
  margin: 0 0 var(--s2);
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.mobile-menu__group { display: flex; flex-direction: column; align-items: stretch; }
.mobile-menu__group + .mobile-menu__label {
  margin-top: var(--s4);
  padding-top: var(--s3);
  border-top: 1px solid var(--line-inverse);
}
.mobile-menu__group--small a { font-size: clamp(1.2rem, 3.2vw, 1.75rem); }

/* Vollbildmenü: Die angeheftete Wortmarke erhält einen eigenen oberen Raum.
   Die Linkliste beginnt erst darunter und scrollt bei niedrigen Viewports. */
body.menu-open .site-header .brand { display: none; }
body.menu-open .mobile-menu {
  place-items: start;
  padding-top: clamp(5.5rem, 12vh, 8rem);
  padding-bottom: 4rem;
}
body.menu-open .mobile-menu__nav {
  margin: 0;
}
body.menu-open .header-rail .menu-button b {
  margin-top: 10px;
}

@media (max-width: 760px) {
  body.menu-open .mobile-menu {
    padding-top: 5rem;
    padding-right: 20px;
    padding-left: 20px;
  }
}

/* 3.7 — Utility-Zeile im Footer. */
.footer-utility {
  padding: var(--s3) 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: var(--s2) var(--s4);
  border-top: 1px solid var(--line-inverse);
  color: rgba(255,255,255,.72);
  font-size: .78rem;
  line-height: 1.55;
}
.footer-utility strong {
  display: block;
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.footer-safety__lines {
  display: grid;
  gap: .18rem;
}
.footer-safety__lines > span { display: block; }
.footer-utility a { text-decoration: underline; text-underline-offset: .18em; }
.footer-utility a:hover { color: #fff; }

/* 3.2 — Horizontaler Sektionsindex. Auf Smartphone bleibt er im normalen
   Seitenfluss; ab Tabletbreite wird er zum kompakten Scrollspy. */
.od-secindex {
  position: static;
  z-index: 45;
  display: flex;
  gap: var(--s3);
  overflow-x: auto;
  scroll-snap-type: x proximity;
  padding: 12px var(--gutter);
  border-bottom: 1px solid var(--line);
  background: var(--stage-paper);
  font-family: var(--mono);
  font-size: var(--t6);
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  scrollbar-width: none;
}
.od-secindex::-webkit-scrollbar { display: none; }
.od-secindex a {
  flex: 0 0 auto;
  scroll-snap-align: start;
  min-height: 40px;
  padding: 0 .25rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: var(--ink);
  border-bottom: 3px solid transparent;
  transition: color .18s var(--ease), background-color .18s var(--ease), border-color .18s var(--ease);
}
.od-secindex a b { color: var(--orange-signal); font-weight: 600; }
.od-secindex a[aria-current="location"] {
  color: var(--ink);
  border-bottom-color: var(--orange-signal);
  background: var(--orange-soft);
}

@media (hover: hover) {
  .od-secindex a:not([aria-current="location"]):hover,
  .od-secindex a:not([aria-current="location"]):focus-visible {
    color: var(--white);
    border-bottom-color: var(--navy);
    background: var(--navy);
  }
  .od-secindex a:not([aria-current="location"]):hover b,
  .od-secindex a:not([aria-current="location"]):focus-visible b { color: var(--orange-readable); }
}

.od-secindex a[aria-current="location"],
.od-secindex a[aria-current="location"]:hover,
.od-secindex a[aria-current="location"]:focus-visible {
  color: var(--ink);
  border-bottom-color: var(--orange-signal);
  background: var(--orange-soft);
}
.od-secindex a[aria-current="location"] b { color: var(--orange-signal); }

@media (min-width: 761px) {
  .od-secindex {
    position: sticky;
    top: 0;
    display: grid;
    grid-template-columns: repeat(var(--section-count), minmax(0, 1fr));
    gap: 0;
    overflow: visible;
    padding: 0;
    box-shadow: 0 1px 0 var(--line);
  }
  .od-secindex a {
    min-width: 0;
    min-height: 68px;
    padding: .65rem clamp(1rem, 2vw, 1.75rem);
    justify-content: flex-start;
    border-right: 1px solid var(--line);
    line-height: 1.25;
  }
  .od-secindex a:last-child { border-right: 0; }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .od-secindex { font-size: .65rem; letter-spacing: .045em; }
  .od-secindex a { gap: .35rem; }
}

@media (max-width: 760px) {
  .od-secindex { display: none; }
}

/* Open Doors — freigegebene, eigenständige Seitenregie. */
.od-open-doors {
  --open-doors-nav-height: 68px;
  color: var(--ink);
  background: var(--white);
}
.od-open-doors figure,
.od-open-doors p,
.od-open-doors h1,
.od-open-doors h2 { margin: 0; }
.od-open-doors__hero {
  height: 100svh;
  min-height: 720px;
  padding: 36px;
  display: grid;
  grid-template-columns: minmax(350px, .92fr) minmax(0, 1.08fr);
  gap: 36px;
  background: var(--paper);
}
.od-open-doors__hero-copy {
  min-width: 0;
  padding-top: clamp(300px, 36vh, 390px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}
.od-open-doors__eyebrow {
  margin-bottom: 18px;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 600;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-open-doors__hero h1 {
  max-width: 12ch;
  font-size: clamp(44px, 4.55vw, 70px);
  font-weight: 780;
  letter-spacing: -.065em;
  line-height: .96;
}
.od-open-doors__hero-copy > p {
  max-width: 42rem;
  margin-top: 28px;
  color: #566765;
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.58;
}
.od-open-doors__hero-media {
  min-width: 0;
  overflow: hidden;
  background: var(--cream);
}
.od-open-doors__hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(.2,.74,.24,1);
}
.od-open-doors__hero:hover .od-open-doors__hero-media img { transform: scale(1.012); }

.od-open-doors__index { padding: 0; gap: 0; }
.od-open-doors__index a { border-right: 1px solid var(--line); }
.od-open-doors__index a:last-child { border-right: 0; }
#open-doors-praxis,
#open-doors-berufswelten,
#open-doors-teilnahme { scroll-margin-top: var(--open-doors-nav-height); }

.od-open-doors__practice { background: var(--white); }
.od-open-doors__story { display: grid; grid-template-columns: minmax(400px, 42%) minmax(0, 58%); }
.od-open-doors__steps { min-width: 0; margin: 0; padding: 0; list-style: none; }
.od-open-doors__step {
  min-height: calc(100svh - var(--open-doors-nav-height));
  padding: clamp(70px, 7vw, 105px) var(--gutter);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: "verb" "title" "copy";
  align-content: center;
  border-bottom: 1px solid var(--line);
  opacity: .3;
  transition: opacity 420ms cubic-bezier(.2,.74,.24,1);
}
.od-open-doors__step.is-active { opacity: 1; }
.od-open-doors__verb {
  grid-area: verb;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.od-open-doors__verb span {
  display: inline-block;
  min-width: 4.5rem;
  margin-right: .85rem;
  color: var(--muted);
  letter-spacing: .04em;
}
.od-open-doors__step h2 {
  grid-area: title;
  max-width: 11ch;
  margin-top: 26px;
  font-size: clamp(42px, 4.05vw, 60px);
  font-weight: 750;
  letter-spacing: -.061em;
  line-height: .97;
}
.od-open-doors__step > p:last-child {
  grid-area: copy;
  max-width: 35rem;
  margin-top: 28px;
  color: #707a78;
  font-size: 18px;
  line-height: 1.62;
}
.od-open-doors__mobile-media { display: none; }
.od-open-doors__visual {
  position: sticky;
  top: var(--open-doors-nav-height);
  height: calc(100svh - var(--open-doors-nav-height));
  overflow: hidden;
  background: #09121f;
}
.od-open-doors__images { position: absolute; inset: 0; }
.od-open-doors__images::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 58%, rgba(8,14,27,.86));
}
.od-open-doors__images img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: translateZ(0) scale(1.018);
  backface-visibility: hidden;
  will-change: opacity, transform;
  transition: opacity 720ms cubic-bezier(.22,.61,.36,1), transform 1.25s cubic-bezier(.2,.74,.24,1);
}
.od-open-doors__images img.is-active { opacity: 1; transform: translateZ(0) scale(1); }
.od-open-doors__progress {
  position: absolute;
  z-index: 2;
  inset: auto 32px 28px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(255,255,255,.46);
}
.od-open-doors__progress button {
  position: relative;
  padding: 14px 8px 0 0;
  display: flex;
  align-items: center;
  gap: 9px;
  color: rgba(255,255,255,.54);
  border: 0;
  background: none;
  text-align: left;
  cursor: pointer;
  transition: color 220ms ease;
}
.od-open-doors__progress button::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  height: 3px;
  background: var(--orange-cta);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 360ms cubic-bezier(.2,.74,.24,1);
}
.od-open-doors__progress button.is-active { color: var(--white); }
.od-open-doors__progress button.is-active::before { transform: scaleX(1); }
.od-open-doors__progress span,
.od-open-doors__progress b {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.od-open-doors__progress b { font-weight: 600; }

.od-open-doors__worlds { background: var(--white); }
.od-open-doors__worlds > header {
  padding: clamp(52px, 6vw, 86px) var(--gutter);
  border-top: 1px solid var(--line);
}
.od-open-doors__worlds > header h2 {
  max-width: none;
  font-size: clamp(42px, 4.2vw, 64px);
  font-weight: 760;
  letter-spacing: -.061em;
  line-height: .96;
  white-space: nowrap;
}
.od-open-doors__film {
  height: 68vh;
  min-height: 540px;
  display: flex;
  overflow: hidden;
  background: var(--navy);
}
.od-open-doors__film figure {
  position: relative;
  min-width: 0;
  flex: 1;
  overflow: hidden;
  border-right: 1px solid rgba(255,255,255,.3);
  transition: flex 620ms cubic-bezier(.2,.74,.24,1);
}
.od-open-doors__film figure:last-child { border: 0; }
.od-open-doors__film figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 52%, rgba(10,19,38,.76));
  transition: background 300ms ease;
}
.od-open-doors__film img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.88);
  transition: transform 900ms cubic-bezier(.2,.74,.24,1), filter 360ms ease;
}
.od-open-doors__film figure:hover,
.od-open-doors__film figure:focus-within { flex: 1.7; }
.od-open-doors__film figure:hover img { transform: scale(1.025); filter: saturate(1); }
.od-open-doors__film figcaption {
  position: absolute;
  z-index: 2;
  left: 24px;
  right: 24px;
  bottom: 24px;
  color: var(--white);
  font-size: clamp(24px, 2.4vw, 36px);
  font-weight: 650;
  letter-spacing: -.045em;
}
.od-open-doors__film figcaption span {
  display: block;
  margin-bottom: 7px;
  color: #ff9c84;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .08em;
}

.od-open-doors__participation {
  position: relative;
  min-height: 52svh;
  padding: clamp(72px, 8vw, 118px) var(--gutter);
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.od-open-doors__participation::before {
  content: "";
  position: absolute;
  left: var(--gutter);
  top: 0;
  width: clamp(90px,18vw,280px);
  height: 5px;
  background: var(--orange-cta);
}
.od-open-doors__participation h2 {
  max-width: 20ch;
  font-size: clamp(50px,5.4vw,82px);
  font-weight: 760;
  letter-spacing: -.067em;
  line-height: .96;
}
.od-open-doors__participation h2 span { color: var(--orange-signal); white-space: nowrap; }

.od-open-doors__next { display: grid; grid-template-columns: 1fr 1fr; }
.od-open-doors__next article {
  min-height: max(620px, calc(100svh - var(--open-doors-nav-height)));
  padding: clamp(74px,7vw,112px) var(--gutter);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.od-open-doors__next-family { background: var(--orange-cta); }
.od-open-doors__next-partner { color: var(--white); background: var(--navy); }
.od-open-doors__next-label {
  width: max-content;
  padding: .42rem .68rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .05em;
  line-height: 1.3;
  text-transform: uppercase;
}
.od-open-doors__next-partner .od-open-doors__next-label { color: #ff9c84; }
.od-open-doors__next h2 {
  max-width: 10ch;
  margin-top: 36px;
  font-size: clamp(50px,5vw,74px);
  font-weight: 770;
  letter-spacing: -.069em;
  line-height: .94;
}
.od-open-doors__next article > p:not(.od-open-doors__next-label) {
  max-width: 34rem;
  margin-top: 30px;
  font-size: 18px;
  line-height: 1.6;
  opacity: .73;
}
.od-open-doors__next a {
  min-width: 330px;
  min-height: 62px;
  margin-top: auto;
  padding: 0 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .035em;
  text-transform: uppercase;
  transition: background 180ms ease, transform 240ms cubic-bezier(.2,.74,.24,1);
}
.od-open-doors__next-family a { color: var(--white); background: var(--navy); }
.od-open-doors__next-partner a { color: var(--navy); background: var(--white); }
.od-open-doors__next a span:last-child { font-family: var(--sans); font-size: 18px; font-weight: 400; transition: transform 260ms cubic-bezier(.2,.74,.24,1); }
.od-open-doors__next a:hover,
.od-open-doors__next a:focus-visible { transform: translateY(-3px); }
.od-open-doors__next a:hover span:last-child,
.od-open-doors__next a:focus-visible span:last-child { transform: translateX(4px); }

@media (min-width: 761px) {
  .od-open-doors__index { padding: 0; }
  .od-open-doors__index a { min-height: var(--open-doors-nav-height); padding-inline: 28px; }
}

@media (max-width: 1050px) {
  .od-open-doors__hero { padding: 28px; grid-template-columns: minmax(300px,.9fr) minmax(0,1.1fr); gap: 28px; }
  .od-open-doors__story { grid-template-columns: minmax(330px,44%) minmax(0,56%); }
  .od-open-doors__step { padding-left: 42px; padding-right: 42px; }
  .od-open-doors__progress b { display: none; }
  .od-open-doors__participation h2 { font-size: clamp(46px,5.2vw,70px); }
  .od-open-doors__next article { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 760px) {
  .od-open-doors { --open-doors-nav-height: 0px; }
  .od-open-doors__hero { height: auto; min-height: 100svh; padding: 22px 20px 20px; display: flex; flex-direction: column; gap: 44px; }
  .od-open-doors__hero-copy { min-height: 580px; padding-top: 280px; justify-content: flex-end; }
  .od-open-doors__eyebrow { font-size: .75rem; }
  .od-open-doors__hero h1 { font-size: clamp(42px,12.7vw,61px); }
  .od-open-doors__hero-copy > p { margin-top: 24px; font-size: 16px; }
  .od-open-doors__hero-media { height: 58vh; min-height: 430px; flex: 0 0 auto; }
  .od-open-doors__story { display: block; }
  .od-open-doors__step {
    min-height: 0;
    padding: 0 20px 64px;
    grid-template-columns: 1fr;
    grid-template-areas: "image" "verb" "title" "copy";
    align-content: start;
    opacity: 1;
  }
  .od-open-doors__mobile-media {
    grid-area: image;
    width: calc(100% + 40px);
    height: 58vh;
    min-height: 390px;
    margin: 0 -20px 42px;
    display: block;
  }
  .od-open-doors__mobile-media img { width: 100%; height: 100%; object-fit: cover; }
  .od-open-doors__step h2 { margin-top: 20px; font-size: clamp(39px,12vw,53px); }
  .od-open-doors__step > p:last-child { margin-top: 22px; font-size: 16px; }
  .od-open-doors__visual { display: none; }
  .od-open-doors__worlds > header { padding: 52px 20px; }
  .od-open-doors__worlds > header h2 { font-size: clamp(38px,11.5vw,52px); white-space: normal; }
  .od-open-doors__film { height: auto; min-height: 0; display: block; }
  .od-open-doors__film figure { height: 58vh; min-height: 380px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.35); }
  .od-open-doors__film figure:hover { flex: 1; }
  .od-open-doors__film figcaption { left: 20px; right: 20px; bottom: 20px; font-size: 34px; }
  .od-open-doors__participation { min-height: 0; padding: 72px 20px 78px; }
  .od-open-doors__participation::before { left: 20px; width: 110px; }
  .od-open-doors__participation h2 { font-size: clamp(40px,12vw,54px); }
  .od-open-doors__next { display: block; }
  .od-open-doors__next article { min-height: 620px; padding: 72px 20px 78px; }
  .od-open-doors__next h2 { font-size: clamp(45px,13.5vw,62px); }
  .od-open-doors__next article > p:not(.od-open-doors__next-label) { font-size: 17px; }
  .od-open-doors__next a { width: 100%; min-width: 0; padding: 0 22px; }
}

@media (max-width: 370px) {
  .od-open-doors__hero h1 { font-size: 37px; }
  .od-open-doors__worlds > header h2 { font-size: 36px; }
  .od-open-doors__participation h2 { font-size: 38px; }
  .od-open-doors__next h2 { font-size: 39px; }
}

/* Inspiring Evening — freigegebene, eigenständige Seitenregie. */
.od-inspiring {
  --inspiring-nav-height: 68px;
  color: var(--ink);
  background: var(--white);
}
.od-inspiring figure,
.od-inspiring p,
.od-inspiring h1,
.od-inspiring h2 { margin: 0; }
.od-inspiring img { display: block; width: 100%; height: 100%; object-fit: cover; }
.od-inspiring__label,
.od-inspiring__next-label {
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 650;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-inspiring__next-label {
  width: max-content;
  padding: .42rem .68rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  letter-spacing: .05em;
}

.od-inspiring__hero {
  height: 100svh;
  min-height: 720px;
  padding: 36px;
  display: grid;
  grid-template-columns: minmax(390px, .92fr) minmax(0, 1.08fr);
  gap: 36px;
  background: var(--paper);
}
.od-inspiring__hero-copy {
  min-width: 0;
  padding-top: clamp(300px, 36vh, 390px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}
.od-inspiring__eyebrow {
  margin-bottom: 18px;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 600;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-inspiring__hero h1 {
  max-width: 13ch;
  font-size: clamp(42px, 4.35vw, 68px);
  font-weight: 780;
  letter-spacing: -.066em;
  line-height: .96;
}
.od-inspiring__hero-copy > p {
  max-width: 42rem;
  margin-top: 26px;
  color: #566765;
  font-size: clamp(16px, 1.28vw, 19px);
  line-height: 1.56;
}
.od-inspiring__hero-media {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: #5a3829;
}
.od-inspiring__hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 65%, rgba(12,19,36,.66));
}
.od-inspiring__hero-media img { transition: transform 1.3s cubic-bezier(.2,.74,.24,1); }
.od-inspiring__hero:hover .od-inspiring__hero-media img { transform: scale(1.012); }
.od-inspiring__hero-media figcaption {
  position: absolute;
  z-index: 2;
  left: 26px;
  bottom: 24px;
  color: var(--white);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.od-inspiring__index { padding: 0; gap: 0; }
.od-inspiring__index a { border-right: 1px solid var(--line); }
.od-inspiring__index a:last-child { border-right: 0; }
#inspiring-tisch,
#inspiring-vorbilder,
#inspiring-teilnahme { scroll-margin-top: var(--inspiring-nav-height); }

.od-inspiring__table-intro {
  padding: clamp(82px, 10vw, 150px) var(--gutter) clamp(70px, 8vw, 118px);
  background: var(--white);
  border-bottom: 1px solid var(--line);
}
.od-inspiring__table-intro .od-inspiring__label { color: var(--orange-signal); }
.od-inspiring__table-intro h2 {
  max-width: 15ch;
  margin: 34px auto 0;
  font-size: clamp(58px, 7.25vw, 108px);
  font-weight: 770;
  letter-spacing: -.073em;
  line-height: .88;
  text-align: center;
}

.od-inspiring__reel {
  height: calc(100svh - var(--inspiring-nav-height));
  min-height: 680px;
  display: flex;
  overflow: hidden;
  background: var(--navy);
}
.od-inspiring__reel figure {
  position: relative;
  min-width: 0;
  flex: 1;
  overflow: hidden;
  border-right: 1px solid rgba(255,255,255,.24);
  transition: flex 700ms cubic-bezier(.2,.74,.24,1);
}
.od-inspiring__reel figure:last-child { border: 0; }
.od-inspiring__reel figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 48%, rgba(11,18,36,.82));
}
.od-inspiring__reel .od-inspiring__reel-wide { flex: 1.22; }
.od-inspiring__reel figure:hover,
.od-inspiring__reel figure:focus-within { flex: 1.72; }
.od-inspiring__reel img {
  filter: saturate(.9);
  transition: transform 1s cubic-bezier(.2,.74,.24,1), filter 360ms ease;
}
.od-inspiring__reel figure:hover img { transform: scale(1.025); filter: saturate(1.06); }
.od-inspiring__reel figcaption {
  position: absolute;
  z-index: 2;
  left: clamp(20px, 2.4vw, 36px);
  right: 24px;
  bottom: clamp(22px, 3vw, 42px);
  color: var(--white);
}
.od-inspiring__reel figcaption span {
  display: block;
  margin-bottom: 9px;
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
}
.od-inspiring__reel figcaption strong {
  display: block;
  font-size: clamp(25px, 2.5vw, 40px);
  font-weight: 650;
  letter-spacing: -.052em;
  line-height: 1.02;
}

.od-inspiring__voices {
  position: relative;
  min-height: 1020px;
  padding: clamp(105px, 10vw, 160px) var(--gutter);
  display: grid;
  grid-template-columns: minmax(210px, .72fr) minmax(420px, 1.45fr) minmax(220px, .78fr);
  gap: clamp(26px, 4vw, 64px);
  align-items: center;
  overflow: hidden;
  color: var(--white);
  background: var(--navy);
}
.od-inspiring__voices-copy { position: relative; z-index: 2; align-self: center; text-align: center; }
.od-inspiring__voices-copy .od-inspiring__label { color: var(--orange-readable); }
.od-inspiring__voices-copy h2 {
  max-width: 13ch;
  margin: 34px auto 0;
  font-size: clamp(52px, 5.7vw, 84px);
  font-weight: 760;
  letter-spacing: -.071em;
  line-height: .93;
}
.od-inspiring__voices-copy > p:last-child {
  max-width: 44rem;
  margin: 36px auto 0;
  color: rgba(255,255,255,.7);
  font-size: 18px;
  line-height: 1.62;
}
.od-inspiring__portrait { position: relative; z-index: 1; overflow: hidden; }
.od-inspiring__portrait--left { height: 58vh; min-height: 560px; align-self: start; transform: translateY(-22px); }
.od-inspiring__portrait--right { height: 61vh; min-height: 600px; align-self: end; transform: translateY(60px); }
.od-inspiring__portrait img {
  filter: saturate(.86);
  transition: transform 1.1s cubic-bezier(.2,.74,.24,1), filter 400ms ease;
}
.od-inspiring__portrait:hover img { transform: scale(1.02); filter: saturate(1); }
.od-inspiring__statement {
  position: absolute;
  z-index: 3;
  left: var(--gutter);
  bottom: 44px;
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.od-inspiring__representation {
  min-height: 92svh;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  background: var(--white);
}
.od-inspiring__representation figure { min-height: 720px; overflow: hidden; }
.od-inspiring__representation figure img {
  object-position: center 35%;
  transition: transform 1.1s cubic-bezier(.2,.74,.24,1);
}
.od-inspiring__representation:hover figure img { transform: scale(1.012); }
.od-inspiring__representation > div {
  padding: clamp(76px, 8vw, 126px) var(--gutter);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.od-inspiring__representation .od-inspiring__label { color: var(--orange-signal); }
.od-inspiring__representation h2 {
  max-width: 10.5ch;
  margin-top: 34px;
  font-size: clamp(52px, 5.5vw, 84px);
  font-weight: 760;
  letter-spacing: -.07em;
  line-height: .94;
}
.od-inspiring__representation div > p:last-child {
  max-width: 36rem;
  margin-top: 34px;
  color: #707a78;
  font-size: 18px;
  line-height: 1.64;
}

.od-inspiring__participation {
  position: relative;
  min-height: 60svh;
  padding: clamp(82px, 9vw, 135px) var(--gutter);
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--paper);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.od-inspiring__participation::before {
  content: "";
  position: absolute;
  left: var(--gutter);
  top: 0;
  width: clamp(90px, 18vw, 280px);
  height: 5px;
  background: var(--orange-cta);
}
.od-inspiring__participation h2 {
  max-width: 21ch;
  font-size: clamp(50px, 5.25vw, 80px);
  font-weight: 760;
  letter-spacing: -.066em;
  line-height: .96;
}
.od-inspiring__participation h2 span { color: var(--orange-signal); white-space: nowrap; }

.od-inspiring__closing-image {
  position: relative;
  height: 86svh;
  min-height: 700px;
  overflow: hidden;
  background: var(--navy);
}
.od-inspiring__closing-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(9,18,34,.05), rgba(9,18,34,.72));
}
.od-inspiring__closing-image img {
  object-position: center 48%;
  transition: transform 1.2s cubic-bezier(.2,.74,.24,1);
}
.od-inspiring__closing-image:hover img { transform: scale(1.012); }
.od-inspiring__closing-image > p {
  position: absolute;
  z-index: 2;
  left: var(--gutter);
  bottom: clamp(52px, 7vw, 106px);
  max-width: 12ch;
  color: var(--white);
  font-size: clamp(58px, 7vw, 106px);
  font-weight: 760;
  letter-spacing: -.072em;
  line-height: .88;
}

.od-inspiring__next { display: grid; grid-template-columns: 1fr 1fr; }
.od-inspiring__next article {
  min-height: max(620px, calc(100svh - var(--inspiring-nav-height)));
  padding: clamp(74px, 7vw, 112px) var(--gutter);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.od-inspiring__next-family { background: var(--orange-cta); }
.od-inspiring__next-partner { color: var(--white); background: var(--navy); }
.od-inspiring__next-partner .od-inspiring__next-label { color: var(--orange-readable); }
.od-inspiring__next h2 {
  max-width: 11ch;
  margin-top: 36px;
  font-size: clamp(48px, 4.8vw, 72px);
  font-weight: 770;
  letter-spacing: -.068em;
  line-height: .94;
}
.od-inspiring__next article > p:not(.od-inspiring__next-label) {
  max-width: 34rem;
  margin-top: 30px;
  font-size: 18px;
  line-height: 1.6;
  opacity: .73;
}
.od-inspiring__next a {
  min-width: 330px;
  min-height: 62px;
  margin-top: auto;
  padding: 0 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .035em;
  text-transform: uppercase;
  transition: background 180ms ease, transform 240ms cubic-bezier(.2,.74,.24,1);
}
.od-inspiring__next-family a { color: var(--white); background: var(--navy); }
.od-inspiring__next-partner a { color: var(--navy); background: var(--white); }
.od-inspiring__next a span:last-child {
  font-family: var(--sans);
  font-size: 18px;
  font-weight: 400;
  transition: transform 260ms cubic-bezier(.2,.74,.24,1);
}
.od-inspiring__next a:hover,
.od-inspiring__next a:focus-visible { transform: translateY(-3px); }
.od-inspiring__next a:hover span:last-child,
.od-inspiring__next a:focus-visible span:last-child { transform: translateX(4px); }

@media (min-width: 761px) {
  .od-inspiring__index { padding: 0; }
  .od-inspiring__index a { min-height: var(--inspiring-nav-height); padding-inline: 28px; }
}

@media (max-width: 1050px) {
  .od-inspiring__hero { padding: 28px; grid-template-columns: minmax(330px,.92fr) minmax(0,1.08fr); gap: 28px; }
  .od-inspiring__voices { grid-template-columns: minmax(160px,.62fr) minmax(360px,1.45fr) minmax(170px,.65fr); gap: 24px; }
  .od-inspiring__portrait--left { min-height: 470px; }
  .od-inspiring__portrait--right { min-height: 500px; }
  .od-inspiring__next article { padding-left: 48px; padding-right: 48px; }
}

@media (max-width: 760px) {
  .od-inspiring { --inspiring-nav-height: 0px; }
  .od-inspiring__hero { height: auto; min-height: 100svh; padding: 22px 20px 20px; display: flex; flex-direction: column; gap: 44px; }
  .od-inspiring__hero-copy { min-height: 620px; padding-top: 280px; justify-content: flex-end; }
  .od-inspiring__eyebrow { font-size: .75rem; }
  .od-inspiring__hero h1 { font-size: clamp(40px,12.2vw,58px); }
  .od-inspiring__hero-copy > p { margin-top: 24px; font-size: 16px; }
  .od-inspiring__hero-media { height: 65vh; min-height: 500px; flex: 0 0 auto; }
  .od-inspiring__table-intro { padding: 70px 20px 64px; }
  .od-inspiring__table-intro h2 { margin-top: 28px; font-size: clamp(46px,13.5vw,64px); text-align: left; }
  .od-inspiring__reel { height: auto; min-height: 0; display: block; }
  .od-inspiring__reel figure,
  .od-inspiring__reel .od-inspiring__reel-wide { height: 64vh; min-height: 480px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.25); }
  .od-inspiring__reel figure:hover { flex: 1; }
  .od-inspiring__reel figcaption { left: 20px; bottom: 22px; }
  .od-inspiring__voices { min-height: 0; padding: 72px 20px 86px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
  .od-inspiring__voices-copy { grid-column: 1 / -1; text-align: left; }
  .od-inspiring__voices-copy h2 { margin: 28px 0 0; font-size: clamp(44px,12.5vw,60px); }
  .od-inspiring__voices-copy > p:last-child { margin: 28px 0 0; font-size: 16px; }
  .od-inspiring__portrait { height: 44vh; min-height: 360px !important; margin-top: 28px; transform: none !important; }
  .od-inspiring__statement { position: static; grid-column: 1 / -1; margin-top: 18px; }
  .od-inspiring__representation { min-height: 0; display: flex; flex-direction: column; }
  .od-inspiring__representation figure { height: 68vh; min-height: 520px; }
  .od-inspiring__representation > div { padding: 70px 20px 78px; }
  .od-inspiring__representation h2 { font-size: clamp(44px,12.7vw,60px); }
  .od-inspiring__representation div > p:last-child { font-size: 16px; }
  .od-inspiring__participation { min-height: 0; padding: 74px 20px 80px; }
  .od-inspiring__participation::before { left: 20px; width: 110px; }
  .od-inspiring__participation h2 { font-size: clamp(40px,11.8vw,54px); }
  .od-inspiring__participation h2 span { white-space: normal; }
  .od-inspiring__closing-image { height: 72vh; min-height: 560px; }
  .od-inspiring__closing-image > p { left: 20px; bottom: 48px; font-size: clamp(48px,13vw,66px); }
  .od-inspiring__next { display: block; }
  .od-inspiring__next article { min-height: 620px; padding: 72px 20px 78px; }
  .od-inspiring__next h2 { font-size: clamp(44px,12.7vw,60px); }
  .od-inspiring__next article > p:not(.od-inspiring__next-label) { font-size: 17px; }
  .od-inspiring__next a { width: 100%; min-width: 0; padding: 0 22px; }
}

@media (max-width: 370px) {
  .od-inspiring__hero h1 { font-size: 36px; }
  .od-inspiring__table-intro h2,
  .od-inspiring__voices-copy h2,
  .od-inspiring__representation h2 { font-size: 40px; }
  .od-inspiring__participation h2 { font-size: 37px; }
  .od-inspiring__next h2 { font-size: 39px; }
}

/* Tutoring — freigegebene Seitenregie für das Angebot in Vorbereitung. */
.od-tutoring {
  --tutoring-nav-height: 68px;
  color: var(--ink);
  background: var(--white);
}
.od-tutoring figure,
.od-tutoring p,
.od-tutoring h1,
.od-tutoring h2 { margin: 0; }
.od-tutoring img { display: block; width: 100%; height: 100%; object-fit: cover; }
.od-tutoring__label {
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 650;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}

.od-tutoring__hero {
  height: 100svh;
  min-height: 720px;
  padding: 36px;
  display: grid;
  grid-template-columns: minmax(390px, .92fr) minmax(0, 1.08fr);
  gap: 36px;
  background: var(--paper);
}
.od-tutoring__hero-copy {
  min-width: 0;
  padding-top: clamp(300px, 36vh, 390px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}
.od-tutoring__eyebrow {
  margin-bottom: 18px;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 600;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-tutoring__hero h1 {
  max-width: 13ch;
  font-size: clamp(43px, 4.45vw, 69px);
  font-weight: 780;
  letter-spacing: -.066em;
  line-height: .96;
}
.od-tutoring__hero-copy > p {
  max-width: 40rem;
  margin-top: 26px;
  color: #566765;
  font-size: clamp(16px, 1.28vw, 19px);
  line-height: 1.56;
}
.od-tutoring__hero-media {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: #ddd3c8;
}
.od-tutoring__hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 68%, rgba(12,19,36,.5));
}
.od-tutoring__hero-media img { transition: transform 1.3s cubic-bezier(.2,.74,.24,1); }
.od-tutoring__hero:hover .od-tutoring__hero-media img { transform: scale(1.012); }
.od-tutoring__hero-media figcaption {
  position: absolute;
  z-index: 2;
  left: 26px;
  bottom: 24px;
  color: var(--white);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.od-tutoring__index { padding: 0; gap: 0; }
.od-tutoring__index a { border-right: 1px solid var(--line); }
.od-tutoring__index a:last-child { border-right: 0; }
#tutoring-warum,
#tutoring-grundlage,
#tutoring-stand { scroll-margin-top: var(--tutoring-nav-height); }

.od-tutoring__reason {
  min-height: 92svh;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  background: var(--white);
}
.od-tutoring__reason figure { min-height: 720px; overflow: hidden; }
.od-tutoring__reason figure img { transition: transform 1.1s cubic-bezier(.2,.74,.24,1); }
.od-tutoring__reason:hover figure img { transform: scale(1.012); }
.od-tutoring__reason > div {
  padding: clamp(76px, 8vw, 126px) var(--gutter);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.od-tutoring__reason .od-tutoring__label { color: var(--orange-signal); }
.od-tutoring__reason h2 {
  max-width: 10.5ch;
  margin-top: 34px;
  font-size: clamp(52px, 5.5vw, 84px);
  font-weight: 760;
  letter-spacing: -.07em;
  line-height: .94;
}
.od-tutoring__reason div > p:last-child {
  max-width: 35rem;
  margin-top: 34px;
  color: #707a78;
  font-size: 18px;
  line-height: 1.64;
}

.od-tutoring__foundation {
  padding: clamp(90px, 10vw, 155px) var(--gutter);
  background: var(--white);
  border-top: 1px solid var(--line);
}
.od-tutoring__foundation header {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(50px, 8vw, 130px);
  align-items: start;
}
.od-tutoring__foundation .od-tutoring__label { color: var(--orange-signal); }
.od-tutoring__foundation header h2 {
  max-width: 11ch;
  font-size: clamp(54px, 5.9vw, 90px);
  font-weight: 760;
  letter-spacing: -.071em;
  line-height: .92;
}
.od-tutoring__foundation ul {
  margin: clamp(70px, 9vw, 130px) 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--ink);
}
.od-tutoring__foundation li {
  min-height: 170px;
  padding: 30px 0;
  display: grid;
  grid-template-columns: minmax(300px,.92fr) minmax(280px,.75fr);
  gap: 30px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  transition: padding 300ms cubic-bezier(.2,.74,.24,1), background 220ms ease;
}
.od-tutoring__foundation li:hover { padding-left: 18px; padding-right: 18px; background: var(--paper); }
.od-tutoring__foundation li > span { color: var(--orange-signal); font-family: var(--mono); font-size: 11px; font-weight: 600; }
.od-tutoring__foundation li strong { font-size: clamp(34px,3.4vw,52px); font-weight: 700; letter-spacing: -.055em; line-height: 1; }
.od-tutoring__foundation li p { max-width: 31rem; color: #707a78; font-size: 17px; line-height: 1.55; }

.od-tutoring__status {
  min-height: 88svh;
  padding: clamp(60px, 7vw, 100px) var(--gutter);
  display: grid;
  grid-template-columns: minmax(390px,.9fr) minmax(0,1.1fr);
  gap: clamp(42px,7vw,110px);
  align-items: stretch;
  background: var(--paper);
  border-top: 1px solid var(--line);
}
.od-tutoring__status-copy { padding: clamp(32px,4vw,62px) 0; display: flex; flex-direction: column; justify-content: center; }
.od-tutoring__status .od-tutoring__label { color: var(--orange-signal); }
.od-tutoring__status h2 {
  max-width: 11ch;
  margin-top: 34px;
  font-size: clamp(52px,5.4vw,82px);
  font-weight: 760;
  letter-spacing: -.069em;
  line-height: .94;
}
.od-tutoring__status-copy > p:not(.od-tutoring__label) {
  max-width: 36rem;
  margin-top: 30px;
  color: #707a78;
  font-size: 18px;
  line-height: 1.62;
}
.od-tutoring__status figure { position: relative; min-height: 650px; overflow: hidden; }
.od-tutoring__status figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(12,19,36,.72));
}
.od-tutoring__status figcaption { position: absolute; z-index: 2; left: 28px; right: 28px; bottom: 28px; color: var(--white); }
.od-tutoring__status figcaption span {
  display: block;
  margin-bottom: 8px;
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.od-tutoring__status figcaption strong { font-size: clamp(34px,3.6vw,56px); font-weight: 680; letter-spacing: -.055em; }

.od-tutoring__next {
  min-height: 78svh;
  padding: clamp(88px, 9vw, 140px) var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(60px,9vw,150px);
  align-items: center;
  color: var(--white);
  background: var(--navy);
}
.od-tutoring__next .od-tutoring__label { color: var(--orange-readable); }
.od-tutoring__next h2 {
  max-width: 11ch;
  margin-top: 34px;
  font-size: clamp(52px,5.5vw,84px);
  font-weight: 760;
  letter-spacing: -.07em;
  line-height: .94;
}
.od-tutoring__next > div:last-child > p { max-width: 34rem; color: rgba(255,255,255,.7); font-size: 18px; line-height: 1.62; }
.od-tutoring__next a {
  width: min(100%,370px);
  min-height: 62px;
  margin-top: 44px;
  padding: 0 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  color: var(--navy);
  background: var(--white);
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .035em;
  text-transform: uppercase;
  transition: transform 240ms cubic-bezier(.2,.74,.24,1), background 180ms ease;
}
.od-tutoring__next a:hover,
.od-tutoring__next a:focus-visible { transform: translateY(-3px); background: var(--orange-soft); }
.od-tutoring__next a span:last-child { font-family: var(--sans); font-size: 18px; transition: transform 260ms cubic-bezier(.2,.74,.24,1); }
.od-tutoring__next a:hover span:last-child { transform: translateX(4px); }

@media (min-width: 761px) {
  .od-tutoring__index { padding: 0; }
  .od-tutoring__index a { min-height: var(--tutoring-nav-height); padding-inline: 28px; }
}
@media (max-width: 1050px) {
  .od-tutoring__hero { padding: 28px; grid-template-columns: minmax(330px,.92fr) minmax(0,1.08fr); gap: 28px; }
  .od-tutoring__foundation li { grid-template-columns: minmax(260px,.9fr) minmax(240px,.75fr); gap: 20px; }
  .od-tutoring__status { grid-template-columns: minmax(330px,.9fr) minmax(0,1.1fr); }
}
@media (max-width: 760px) {
  .od-tutoring { --tutoring-nav-height: 0px; }
  .od-tutoring__hero { height: auto; min-height: 100svh; padding: 22px 20px 20px; display: flex; flex-direction: column; gap: 44px; }
  .od-tutoring__hero-copy { min-height: 620px; padding-top: 280px; justify-content: flex-end; }
  .od-tutoring__eyebrow { font-size: .75rem; }
  .od-tutoring__hero h1 { font-size: clamp(40px,12.2vw,58px); }
  .od-tutoring__hero-copy > p { margin-top: 24px; font-size: 16px; }
  .od-tutoring__hero-media { height: 62vh; min-height: 480px; flex: 0 0 auto; }
  .od-tutoring__reason { min-height: 0; display: flex; flex-direction: column; }
  .od-tutoring__reason figure { height: 64vh; min-height: 470px; }
  .od-tutoring__reason > div { padding: 70px 20px 78px; }
  .od-tutoring__reason h2 { font-size: clamp(44px,12.7vw,60px); }
  .od-tutoring__reason div > p:last-child { font-size: 16px; }
  .od-tutoring__foundation { padding: 72px 20px 82px; }
  .od-tutoring__foundation header { display: block; }
  .od-tutoring__foundation header h2 { margin-top: 28px; font-size: clamp(44px,12.7vw,60px); }
  .od-tutoring__foundation ul { margin-top: 62px; }
  .od-tutoring__foundation li { padding: 28px 0; display: grid; grid-template-columns: 1fr; gap: 10px 14px; }
  .od-tutoring__foundation li strong { font-size: 34px; }
  .od-tutoring__foundation li p { grid-column: 1; font-size: 16px; }
  .od-tutoring__foundation li:hover { padding-left: 0; padding-right: 0; background: none; }
  .od-tutoring__status { min-height: 0; padding: 72px 20px 20px; display: flex; flex-direction: column; gap: 56px; }
  .od-tutoring__status h2 { font-size: clamp(44px,12.7vw,60px); }
  .od-tutoring__status-copy > p:not(.od-tutoring__label) { font-size: 16px; }
  .od-tutoring__status figure { height: 62vh; min-height: 470px; margin: 0 -20px; }
  .od-tutoring__next { min-height: 0; padding: 78px 20px 86px; display: block; }
  .od-tutoring__next h2 { font-size: clamp(44px,12.7vw,60px); }
  .od-tutoring__next > div:last-child { margin-top: 54px; }
  .od-tutoring__next > div:last-child > p { font-size: 17px; }
  .od-tutoring__next a { width: 100%; }
}
@media (max-width: 370px) {
  .od-tutoring__hero h1 { font-size: 36px; }
  .od-tutoring__reason h2,
  .od-tutoring__foundation header h2,
  .od-tutoring__status h2,
  .od-tutoring__next h2 { font-size: 40px; }
}

/* Spenden — freigegebene Wirkungs- und Spendenregie. */
.od-donation {
  --donation-nav-height: 68px;
  color: var(--ink);
  background: var(--white);
}
.od-donation figure,
.od-donation p,
.od-donation h1,
.od-donation h2 { margin: 0; }
.od-donation img { display: block; width: 100%; height: 100%; object-fit: cover; }
.od-donation__label {
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 650;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-donation__hero {
  height: 100svh;
  min-height: 720px;
  padding: 36px;
  display: grid;
  grid-template-columns: minmax(390px,.94fr) minmax(0,1.06fr);
  gap: 36px;
  background: var(--paper);
}
.od-donation__hero-copy {
  min-width: 0;
  padding-top: clamp(300px,36vh,390px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}
.od-donation__eyebrow {
  margin-bottom: 18px;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 650;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-donation__hero h1 {
  max-width: 11ch;
  font-size: clamp(58px,6.2vw,96px);
  font-weight: 780;
  letter-spacing: -.075em;
  line-height: .88;
}
.od-donation__hero-copy > p:last-child {
  max-width: 36rem;
  margin-top: 30px;
  color: #687270;
  font-size: clamp(16px,1.3vw,19px);
  line-height: 1.55;
}
.od-donation__hero-media { position: relative; min-width: 0; overflow: hidden; }
.od-donation__hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 65%,rgba(13,25,39,.55));
}
.od-donation__hero-media img { transition: transform 1.4s cubic-bezier(.2,.74,.24,1); }
.od-donation__hero:hover .od-donation__hero-media img { transform: scale(1.012); }
.od-donation__hero-media figcaption {
  position: absolute;
  z-index: 2;
  left: 25px;
  bottom: 24px;
  color: var(--white);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.od-donation__index { padding: 0; gap: 0; }
.od-donation__index a { border-right: 1px solid var(--line); }
.od-donation__index a:last-child { border-right: 0; }
#spenden-warum,
#spenden-wirkung,
#donation-form,
#spenden-kontakt { scroll-margin-top: var(--donation-nav-height); }
.od-donation__why {
  padding: clamp(72px,7vw,110px) var(--gutter);
  background: var(--white);
}
.od-donation__why h2 {
  max-width: none;
  margin-top: 34px;
  font-size: clamp(48px,6vw,92px);
  font-weight: 760;
  letter-spacing: -.072em;
  line-height: .94;
}
.od-donation__why > p:last-child {
  max-width: 82rem;
  margin-top: 38px;
  color: #6e7877;
  font-size: 19px;
  line-height: 1.64;
}
.od-donation__impact {
  padding: clamp(84px,8vw,128px) var(--gutter);
  background: var(--white);
  border-top: 1px solid var(--line);
}
.od-donation__impact > header {
  display: grid;
  grid-template-columns: .6fr 1.4fr;
  gap: 60px;
  align-items: start;
}
.od-donation__impact > header h2 {
  max-width: 10ch;
  font-size: clamp(56px,6.1vw,94px);
  font-weight: 760;
  letter-spacing: -.075em;
  line-height: .9;
}
.od-donation__impact-stage {
  height: min(72svh,760px);
  min-height: 620px;
  margin-top: clamp(66px,7vw,108px);
  display: grid;
  grid-template-columns: .8fr 1.2fr;
}
.od-donation__impact-list { border-top: 1px solid var(--ink); }
.od-donation__impact-choice {
  width: 100%;
  height: 25%;
  padding: 18px 30px 18px 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  text-align: left;
  color: #9aa2a0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: color .25s,padding .35s,background .25s;
}
.od-donation__impact-choice > span {
  grid-row: 1 / 3;
  color: var(--orange-signal);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 650;
}
.od-donation__impact-choice strong {
  align-self: end;
  font-size: clamp(29px,3vw,46px);
  font-weight: 650;
  letter-spacing: -.055em;
  line-height: 1;
}
.od-donation__impact-choice small {
  align-self: start;
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.35;
}
.od-donation__impact-choice.is-active,
.od-donation__impact-choice:hover,
.od-donation__impact-choice:focus-visible {
  padding-left: 20px;
  color: var(--ink);
  background: var(--paper);
}
.od-donation__impact-media { position: relative; overflow: hidden; background: #e6e2dc; }
.od-donation__impact-media img { transition: opacity .28s ease,transform .75s cubic-bezier(.2,.74,.24,1); }
.od-donation__impact-media img.is-changing { opacity: .18; transform: scale(1.03); }
.od-donation__impact-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 55%,rgba(8,16,31,.58));
}
.od-donation__impact-media figcaption {
  position: absolute;
  z-index: 2;
  left: 26px;
  bottom: 24px;
  color: var(--white);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.od-donation__giving {
  padding: clamp(82px,8vw,128px) var(--gutter);
  background: var(--paper);
  border-top: 1px solid var(--line);
}
.od-donation__giving > header {
  display: grid;
  grid-template-columns: .52fr 1.48fr;
  gap: 60px;
  align-items: start;
}
.od-donation__giving > header h2 {
  max-width: none;
  font-size: clamp(48px,5vw,78px);
  font-weight: 760;
  letter-spacing: -.068em;
  line-height: .95;
}
.od-donation__form {
  margin: clamp(62px,6vw,94px) 0 0;
  padding: clamp(42px,4.5vw,70px);
  background: var(--white);
  border: 1px solid #d8d1c7;
}
.od-donation__form fieldset { margin: 0 0 54px; padding: 0; border: 0; }
.od-donation__form fieldset:last-of-type { margin-bottom: 0; }
.od-donation__form legend {
  margin-bottom: 24px;
  padding: 0;
  display: flex;
  align-items: baseline;
  gap: 16px;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.od-donation__step-number { color: var(--orange-signal); }
.od-donation__frequency { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.od-donation__choice,
.od-donation__payment,
.od-donation__amount-choice { position: relative; cursor: pointer; }
.od-donation__choice input,
.od-donation__payment input,
.od-donation__amount-choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.od-donation__choice > span,
.od-donation__payment > span,
.od-donation__amount-choice > span {
  min-height: 94px;
  padding: 0 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white);
  border: 1px solid #d8d1c7;
  font-size: 22px;
  font-weight: 620;
}
.od-donation__choice.is-selected > span,
.od-donation__payment.is-selected > span,
.od-donation__amount-choice.is-selected > span {
  background: var(--orange-soft);
  border-color: var(--orange-signal);
}
.od-donation__choice.is-selected::after,
.od-donation__payment.is-selected::after,
.od-donation__amount-choice.is-selected::after {
  content: "✓";
  position: absolute;
  top: 9px;
  right: 12px;
  color: var(--orange-signal);
  font-size: 20px;
}
.od-donation__choice:focus-within > span,
.od-donation__payment:focus-within > span,
.od-donation__amount-choice:focus-within > span { outline: 2px solid var(--navy); outline-offset: 3px; }
.od-donation__amounts { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.od-donation__amount-choice > span { font-size: 25px; }
.od-donation__custom {
  min-height: 124px;
  margin-top: 14px;
  padding: 22px 28px;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 30px;
  align-items: center;
  border: 1px solid #d8d1c7;
}
.od-donation__custom > span:first-child { font-size: 21px; }
.od-donation__custom-field { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; }
.od-donation__custom-field b { color: #6e7877; font-size: 18px; }
.od-donation__custom-field input {
  width: 100%;
  height: 66px;
  padding: 0 18px;
  color: var(--ink);
  background: var(--paper);
  border: 0;
  border-bottom: 2px solid var(--ink);
  font: 21px var(--sans);
  outline-offset: 3px;
}
.od-donation__payments { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.od-donation__payment > span { justify-content: flex-start; font-size: 21px; font-weight: 600; }
.od-donation__summary {
  margin-top: 58px;
  padding: 28px 0;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.od-donation__summary span { color: #6e7877; font-size: 18px; }
.od-donation__summary strong { font-size: 20px; }
.od-donation__submit {
  width: 100%;
  min-height: 76px;
  margin-top: 46px;
  padding: 0 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--ink);
  background: var(--orange-signal);
  border: 0;
  border-radius: 999px;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 220ms cubic-bezier(.2,.74,.24,1),background 180ms ease;
}
.od-donation__submit:hover,
.od-donation__submit:focus-visible { transform: translateY(-3px); background: var(--orange-readable); }
.od-donation__submit span:last-child { font-size: 24px; }
.od-donation__status:not(:empty) { margin-top: 20px; color: #6e7877; font-size: 14px; }
.od-donation__large-support {
  min-height: 96px;
  padding: 0 26px;
  margin-top: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-size: clamp(22px,2.2vw,34px);
  font-weight: 620;
  letter-spacing: -.04em;
}
.od-donation__large-support span:last-child { font-size: 24px; transition: transform .25s; }
.od-donation__large-support:hover span:last-child { transform: translateX(6px); }
.od-donation__contact {
  min-height: 72svh;
  padding: clamp(90px,9vw,140px) var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(60px,9vw,150px);
  align-items: center;
  color: var(--white);
  background: var(--navy);
}
.od-donation__contact .od-donation__label { color: var(--orange-readable); }
.od-donation__contact h2 {
  max-width: 11ch;
  margin-top: 30px;
  font-size: clamp(54px,6vw,92px);
  font-weight: 760;
  letter-spacing: -.07em;
  line-height: .92;
}
.od-donation__contact > div:last-child > p {
  max-width: 36rem;
  color: rgba(255,255,255,.72);
  font-size: 18px;
  line-height: 1.62;
}
.od-donation__contact a {
  width: min(100%,370px);
  min-height: 64px;
  margin-top: 42px;
  padding: 0 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--navy);
  background: var(--white);
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.od-donation__contact a span:last-child { font-family: var(--sans); font-size: 19px; }
@media (min-width: 761px) {
  .od-donation__index { padding: 0; }
  .od-donation__index a { min-height: var(--donation-nav-height); padding-inline: 28px; }
}
@media (max-width: 1050px) {
  .od-donation__hero { grid-template-columns: minmax(340px,.9fr) minmax(0,1.1fr); }
  .od-donation__impact-stage { grid-template-columns: .9fr 1.1fr; }
  .od-donation__form { padding: 42px; }
  .od-donation__amounts { grid-template-columns: repeat(2,1fr); }
  .od-donation__custom { grid-template-columns: .8fr 1.2fr; }
}
@media (max-width: 760px) {
  .od-donation { --donation-nav-height: 0px; }
  .od-donation__hero { height: auto; min-height: 100svh; padding: 22px 20px 20px; display: flex; flex-direction: column; gap: 48px; }
  .od-donation__hero-copy { min-height: 650px; padding-top: 300px; justify-content: flex-end; }
  .od-donation__hero h1 { font-size: clamp(48px,13.8vw,66px); }
  .od-donation__hero-copy > p:last-child { font-size: 16px; }
  .od-donation__hero-media { height: 62vh; min-height: 470px; flex: 0 0 auto; }
  .od-donation__why { padding: 68px 20px 74px; }
  .od-donation__why h2 { margin-top: 30px; font-size: clamp(42px,12vw,58px); }
  .od-donation__why > p:last-child { margin-top: 30px; font-size: 16px; }
  .od-donation__impact { padding: 76px 20px 20px; }
  .od-donation__impact > header { display: block; }
  .od-donation__impact > header h2 { margin-top: 30px; font-size: clamp(47px,13vw,62px); }
  .od-donation__impact-stage { height: auto; min-height: 0; margin-top: 64px; display: flex; flex-direction: column; }
  .od-donation__impact-list { order: 2; }
  .od-donation__impact-choice { height: auto; min-height: 112px; }
  .od-donation__impact-media { height: 62vh; min-height: 470px; }
  .od-donation__giving { padding: 72px 20px 82px; }
  .od-donation__giving > header { display: block; }
  .od-donation__giving > header h2 { margin-top: 28px; font-size: clamp(42px,12vw,58px); }
  .od-donation__form { margin-top: 52px; padding: 24px 16px; }
  .od-donation__form fieldset { margin-bottom: 42px; }
  .od-donation__frequency { grid-template-columns: 1fr; }
  .od-donation__choice > span { min-height: 74px; }
  .od-donation__amounts { grid-template-columns: repeat(2,1fr); }
  .od-donation__amount-choice > span { min-height: 78px; font-size: 20px; }
  .od-donation__custom { min-height: 150px; padding: 20px; display: block; }
  .od-donation__custom-field { margin-top: 20px; }
  .od-donation__payments { grid-template-columns: 1fr; }
  .od-donation__payment > span { min-height: 76px; }
  .od-donation__summary { align-items: flex-end; flex-direction: column; }
  .od-donation__submit { font-size: 15px; }
  .od-donation__large-support { font-size: 22px; }
  .od-donation__contact { min-height: 0; padding: 78px 20px 86px; display: block; }
  .od-donation__contact h2 { font-size: clamp(47px,13vw,62px); }
  .od-donation__contact > div:last-child { margin-top: 54px; }
}
@media (max-width: 370px) {
  .od-donation__hero h1 { font-size: 42px; }
  .od-donation__why h2,
  .od-donation__impact > header h2,
  .od-donation__giving > header h2,
  .od-donation__contact h2 { font-size: 40px; }
}

/* Kontakt — freigegebener Zwei-Schritt-Gesprächsweg. */
.od-contact {
  --contact-nav-height: 68px;
  color: var(--ink);
  background: var(--white);
}
.od-contact figure,
.od-contact p,
.od-contact h1,
.od-contact h2,
.od-contact h3 { margin: 0; }
.od-contact img { display: block; width: 100%; height: 100%; object-fit: cover; }
.od-contact__label,
.od-contact__kicker {
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 650;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.od-contact__label { color: var(--orange-readable); }
.od-contact__hero {
  height: 100svh;
  min-height: 720px;
  display: grid;
  grid-template-columns: minmax(430px,.92fr) minmax(0,1.08fr);
  color: var(--white);
  background: var(--navy);
}
.od-contact__hero-copy {
  min-width: 0;
  padding: 38px 36px 34px;
  display: flex;
  flex-direction: column;
}
.od-contact__hero-copy > div { margin-top: auto; }
.od-contact__hero h1 {
  max-width: 11ch;
  margin-top: 20px;
  font-size: clamp(52px,5vw,72px);
  font-weight: 780;
  letter-spacing: -.07em;
  line-height: .9;
}
.od-contact__hero-copy > div > p:last-child {
  max-width: 38rem;
  margin-top: 32px;
  color: rgba(255,255,255,.68);
  font-size: clamp(16px,1.28vw,19px);
  line-height: 1.58;
}
.od-contact__hero-media { position: relative; min-width: 0; overflow: hidden; }
.od-contact__hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 58%,rgba(8,17,31,.64));
}
.od-contact__hero-media img { transition: transform 1.5s cubic-bezier(.22,1,.36,1); }
.od-contact__hero:hover .od-contact__hero-media img { transform: scale(1.012); }
.od-contact__hero-media figcaption {
  position: absolute;
  z-index: 2;
  left: 26px;
  bottom: 24px;
  color: var(--white);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.od-contact__index { padding: 0; gap: 0; }
.od-contact__index a { border-right: 1px solid var(--line); }
.od-contact__index a:last-child { border-right: 0; }
.od-contact__direct {
  padding: clamp(84px,8vw,132px) clamp(44px,7vw,112px);
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(56px,8vw,140px);
  background: var(--white);
}
.od-contact__direct h2 {
  max-width: 9ch;
  margin-top: 28px;
  font-size: clamp(50px,5.6vw,86px);
  font-weight: 760;
  letter-spacing: -.07em;
  line-height: .92;
}
.od-contact__direct .od-contact__label { color: var(--orange-signal); }
.od-contact__direct-links { border-top: 1px solid var(--ink); }
.od-contact__direct-links a {
  min-height: 136px;
  padding: 25px 4px;
  display: grid;
  grid-template-columns: 1fr .9fr 28px;
  gap: 30px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  transition: padding .35s var(--ease),background .25s var(--ease);
}
.od-contact__direct-links a:hover,
.od-contact__direct-links a:focus-visible { padding-left: 18px; background: var(--paper); }
.od-contact__direct-links a > span:first-child { display: block; }
.od-contact__direct-links small { color: var(--orange-signal); font-family: var(--mono); font-size: 10px; font-weight: 600; }
.od-contact__direct-links strong { font-size: clamp(24px,2.5vw,38px); font-weight: 670; letter-spacing: -.05em; }
.od-contact__direct-links a > span:nth-child(2) { color: var(--muted); font-size: 15px; line-height: 1.5; }
.od-contact__direct-links i { font-size: 22px; font-style: normal; }
.od-contact__form-section { padding-top: clamp(76px,7vw,112px); color: var(--white); background: var(--navy); }
.od-contact__form-intro {
  padding: 0 clamp(34px,5.5vw,88px) clamp(62px,6vw,92px);
  display: grid;
  grid-template-columns: .42fr 1fr .72fr;
  gap: clamp(34px,6vw,96px);
  align-items: start;
}
.od-contact__form-intro .od-contact__label { padding-top: 12px; }
.od-contact__form-intro h2 {
  white-space: nowrap;
  font-size: clamp(50px,5.5vw,84px);
  font-weight: 760;
  letter-spacing: -.072em;
  line-height: .92;
}
.od-contact__form-intro > p:last-child { max-width: 28rem; color: rgba(255,255,255,.67); font-size: 16px; line-height: 1.6; }
.od-contact__form-stage {
  display: grid;
  grid-template-columns: minmax(365px,.8fr) minmax(590px,1.2fr);
  align-items: start;
  border-top: 1px solid rgba(255,255,255,.24);
}
.od-contact__routes { padding: clamp(34px,4.5vw,72px) clamp(26px,3.8vw,62px) clamp(54px,6vw,96px) clamp(22px,3vw,48px); }
.od-contact__routes > p {
  margin-bottom: 24px;
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.od-contact__step-label {
  display: flex;
  align-items: baseline;
  gap: 14px;
}
.od-contact__step-label > span:first-child {
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}
.od-contact__form-head .od-contact__step-label > span:first-child { color: var(--orange-signal); }
.od-contact__route-list { border-top: 1px solid rgba(255,255,255,.4); }
.od-contact__route {
  width: 100%;
  min-height: 82px;
  padding: 16px 10px 16px 0;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  color: rgba(255,255,255,.72);
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.2);
  cursor: pointer;
  transition: padding .35s var(--ease),color .25s,background .25s;
}
.od-contact__route > span { color: var(--orange-readable); font-family: var(--mono); font-size: 10px; font-weight: 600; }
.od-contact__route strong { font-size: clamp(18px,1.65vw,25px); font-weight: 620; letter-spacing: -.045em; line-height: 1.05; }
.od-contact__route i { color: currentColor; font-size: 18px; font-style: normal; transition: transform .3s var(--ease); }
.od-contact__route.is-selected > span::after { content: none; }
.od-contact__route:hover { padding-left: 12px; color: var(--white); }
.od-contact__route:hover i { transform: translateX(5px); }
.od-contact__route.is-selected {
  padding-left: 18px;
  color: var(--white);
  background: rgba(255,255,255,.075);
  box-shadow: inset 4px 0 0 var(--orange-cta);
}
.od-contact__route.is-selected i { color: var(--orange-readable); }
.od-contact__safety {
  max-width: 38rem;
  margin-top: 38px;
  padding-top: 24px;
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 24px;
  border-top: 1px solid rgba(255,255,255,.25);
}
.od-contact__safety strong { color: var(--orange-readable); font-family: var(--mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.od-contact__safety span { color: rgba(255,255,255,.64); font-size: 13px; line-height: 1.55; }
.od-contact__safety-lines { display: grid; gap: 4px; }
.od-contact__safety-lines > span { display: block; }
.od-contact__safety a { text-decoration: underline; text-underline-offset: 3px; }
.od-contact__form {
  min-height: 100%;
  padding: clamp(38px,5vw,76px);
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 28px 22px;
  color: var(--ink);
  background: var(--paper);
  border-left: 1px solid rgba(255,255,255,.2);
}
.od-contact__form-head { margin-bottom: 24px; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
.od-contact__form-head .od-contact__label { color: var(--orange-signal); }
.od-contact__form-head h3 { margin-top: 17px; font-size: clamp(34px,3.5vw,54px); font-weight: 730; letter-spacing: -.062em; line-height: .96; }
.od-contact__form-head > p:last-child { max-width: 42rem; margin-top: 20px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.od-contact__form .field { min-width: 0; }
.od-contact__form .field label { margin-bottom: 10px; font-family: var(--mono); font-size: 12px; font-weight: 600; letter-spacing: .045em; line-height: 1.35; text-transform: uppercase; }
.od-contact__form .field label span { color: var(--muted); font-weight: 400; }
.od-contact__form .field input,
.od-contact__form .field select,
.od-contact__form .field textarea { padding-inline: 2px; border-bottom-color: #9da4a1; }
.od-contact__form .field input,
.od-contact__form .field select { height: 52px; }
.od-contact__form .field textarea { min-height: 150px; padding-top: 15px; }
.od-contact__form .contact-extra-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 22px; }
.od-contact__form .field-note { color: var(--orange-signal); font-size: 13px; line-height: 1.5; }
.od-contact__privacy { color: var(--muted); font-size: 13px; line-height: 1.6; }
.od-contact__privacy a { text-decoration: underline; text-underline-offset: 3px; }
.contact-trap {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.od-contact__error-summary {
  padding: 22px 24px;
  color: var(--ink);
  background: #fff0ec;
  border: 2px solid var(--orange-signal);
}
.od-contact__error-summary h4 { font-size: 18px; font-weight: 720; }
.od-contact__error-summary ul { margin: 12px 0 0 20px; }
.od-contact__error-summary li + li { margin-top: 7px; }
.od-contact__error-summary a { color: var(--orange-signal); font-size: 14px; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
.od-contact__form .field-error {
  margin-top: 8px;
  color: var(--orange-signal);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.4;
}
.od-contact__form [aria-invalid="true"] { border-bottom: 2px solid var(--orange-signal); }
.od-contact__whatsapp {
  padding: clamp(24px,3vw,38px);
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(210px,.75fr);
  gap: 28px 30px;
  color: var(--white);
  background: #075e54;
}
.od-contact__whatsapp .od-contact__label { color: #c8f7df; }
.od-contact__whatsapp h4 { margin-top: 12px; font-size: clamp(24px,2.4vw,34px); font-weight: 720; letter-spacing: -.045em; line-height: 1.02; }
.od-contact__whatsapp > div:first-child > p:last-child { max-width: 36rem; margin-top: 14px; color: rgba(255,255,255,.8); font-size: 14px; line-height: 1.55; }
.od-contact__whatsapp-actions { display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.od-contact__whatsapp-open,
.od-contact__copy {
  min-height: 54px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #063c35;
  background: #d6f8e5;
  border: 1px solid #d6f8e5;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 680;
  text-align: left;
  cursor: pointer;
  transition: transform .2s var(--ease),background .2s ease;
}
.od-contact__copy { color: var(--white); background: transparent; }
.od-contact__whatsapp-open:hover,
.od-contact__whatsapp-open:focus-visible,
.od-contact__copy:hover,
.od-contact__copy:focus-visible { transform: translateY(-2px); }
.od-contact__qr {
  padding-top: 26px;
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 22px;
  align-items: center;
  border-top: 1px solid rgba(255,255,255,.25);
}
.od-contact__qr > div { width: 150px; min-height: 150px; padding: 8px; background: var(--white); }
.od-contact__qr svg { width: 100%; height: auto; display: block; }
.od-contact__qr p { color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.5; }
.od-contact__fallback-toggle {
  align-self: center;
  color: var(--white);
  font-size: 13px;
  font-weight: 650;
  text-align: left;
  text-decoration: underline;
  text-underline-offset: 4px;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.od-contact__fallback {
  grid-column: 1 / -1;
  padding-top: 26px;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 24px 22px;
  border-top: 1px solid rgba(255,255,255,.25);
}
.od-contact__whatsapp .field label,
.od-contact__whatsapp .field label span { color: var(--white); }
.od-contact__whatsapp .field input { color: var(--white); border-bottom-color: rgba(255,255,255,.65); }
.od-contact__consent {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: start;
  color: var(--white);
  font-size: 13px;
  line-height: 1.5;
  cursor: pointer;
}
.od-contact__consent input { width: 20px; height: 20px; margin-top: 1px; accent-color: #d6f8e5; }
.od-contact__consent strong { font-weight: 650; }
.od-contact__no-reply {
  padding: 18px 20px;
  color: var(--ink);
  background: #fff0ec;
  border-left: 3px solid var(--orange-signal);
  font-size: 14px;
  line-height: 1.55;
}
.od-contact__submit {
  min-height: 70px;
  padding: 0 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--navy);
  background: var(--orange-cta);
  border: 0;
  border-radius: 999px;
  font-weight: 650;
  cursor: pointer;
  transition: transform .24s var(--ease),background .18s ease;
}
.od-contact__submit:hover,
.od-contact__submit:focus-visible { transform: translateY(-3px); background: var(--orange-readable); }
.od-contact__submit:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.od-contact__submit span:last-child { font-size: 22px; }
.od-contact__status { min-height: 1.5em; color: var(--muted); font-size: 13px; }
.od-contact__form.is-safety { background: var(--white); }
.od-contact__form.is-safety .od-contact__submit { color: var(--white); background: var(--navy); }
@media (min-width: 761px) {
  .od-contact__index { padding: 0; }
  .od-contact__index a { min-height: var(--contact-nav-height); padding-inline: 28px; }
}
@media (max-width: 1050px) {
  .od-contact__hero { grid-template-columns: minmax(360px,.88fr) minmax(0,1.12fr); }
  .od-contact__direct-links a { grid-template-columns: 1fr .7fr 24px; }
  .od-contact__form-intro { grid-template-columns: .36fr .9fr .74fr; }
  .od-contact__form-stage { grid-template-columns: minmax(330px,.74fr) minmax(500px,1.26fr); }
  .od-contact__routes { padding-right: 28px; padding-left: 26px; }
  .od-contact__form { padding: 46px 38px; }
}
@media (max-width: 760px) {
  .od-contact { --contact-nav-height: 0px; }
  .od-contact__hero { height: auto; min-height: 100svh; display: flex; flex-direction: column; }
  .od-contact__hero-copy { min-height: 88svh; padding: 24px 20px; }
  .od-contact__hero h1 { font-size: clamp(44px,12.5vw,60px); }
  .od-contact__hero-copy > div > p:last-child { font-size: 16px; }
  .od-contact__hero-media { height: 64svh; min-height: 470px; flex: 0 0 auto; }
  .od-contact__direct { padding: 72px 20px 84px; display: block; }
  .od-contact__direct h2 { font-size: clamp(46px,12vw,60px); }
  .od-contact__direct-links { margin-top: 56px; }
  .od-contact__direct-links a { min-height: 136px; display: grid; grid-template-columns: 1fr 24px; gap: 12px; }
  .od-contact__direct-links a > span:nth-child(2) { grid-column: 1; }
  .od-contact__form-section { padding-top: 72px; }
  .od-contact__form-intro { padding: 0 20px 58px; display: block; }
  .od-contact__form-intro h2 { margin-top: 28px; white-space: normal; font-size: clamp(48px,13vw,64px); }
  .od-contact__form-intro > p:last-child { margin-top: 28px; }
  .od-contact__form-stage { display: block; }
  .od-contact__routes { padding: 30px 20px 60px; }
  .od-contact__route { min-height: 82px; }
  .od-contact__route strong { font-size: 19px; }
  .od-contact__safety { grid-template-columns: 1fr; }
  .od-contact__form { min-height: 0; padding: 40px 20px; display: block; border-top: 1px solid rgba(255,255,255,.2); border-left: 0; }
  .od-contact__form-head { margin-bottom: 34px; }
  .od-contact__form-head h3 { font-size: 38px; }
  .od-contact__form .field,
  .od-contact__form .contact-extra-fields > .field { margin-bottom: 28px; }
  .od-contact__form .contact-extra-fields { display: block; }
  .od-contact__whatsapp { display: block; }
  .od-contact__whatsapp-actions,
  .od-contact__qr,
  .od-contact__fallback-toggle,
  .od-contact__fallback { margin-top: 26px; }
  .od-contact__qr { display: none; }
  .od-contact__fallback { display: block; }
  .od-contact__fallback .field + .field,
  .od-contact__consent { margin-top: 24px; }
  .od-contact__submit { width: 100%; margin-top: 28px; }
  .od-contact__status { margin-top: 14px; }
}
@media (max-width: 370px) {
  .od-contact__hero h1 { font-size: 42px; }
  .od-contact__direct h2,
  .od-contact__form-intro h2 { font-size: 40px; }
  .od-contact__form-head h3 { font-size: 34px; }
}

/* Startseite — freigegebene Werte- und Unterstützungsregie. Der Hero sowie
   alle übrigen Startseitenbereiche bleiben in ihren offiziellen Styles. */
.home-eyebrow {
  margin: 0;
  color: #ff5b3a;
  font-family: var(--mono);
  font-size: var(--context-label-size);
  font-weight: 700;
  line-height: var(--context-label-leading);
  letter-spacing: var(--context-label-tracking);
  text-transform: uppercase;
}

.values-home {
  position: relative;
  height: 600vh;
  color: white;
  background: #17233e;
}
.values-home__sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
}
.values-home video,
.values-home__wash {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.values-home video {
  z-index: 0;
  display: block;
  object-fit: cover;
  object-position: center;
}
.values-home__wash {
  z-index: 1;
  background: linear-gradient(90deg, rgba(4,22,30,.84), rgba(4,22,30,.46) 58%, rgba(4,22,30,.2));
}
.values-home__top {
  position: absolute;
  z-index: 3;
  top: clamp(5.5rem,10vh,8rem);
  right: var(--gutter);
  left: var(--gutter);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
}
.values-home__top .home-eyebrow {
  max-width: 620px;
  color: #ff5b3a;
  font-family: var(--display);
  font-size: clamp(2rem,4vw,4.6rem);
  font-weight: 800;
  line-height: .9;
  letter-spacing: -.06em;
}
.values-home__counter {
  margin: .25rem 0 0;
  display: flex;
  align-items: baseline;
  gap: .55rem;
  color: var(--white);
  font-family: var(--mono);
  letter-spacing: .05em;
}
.values-home__counter strong { font-size: clamp(1.5rem,2.4vw,2.8rem); font-weight: 700; }
.values-home__counter span { color: rgba(255,255,255,.62); font-size: clamp(.7rem,1vw,.9rem); }
.values-home__copy {
  position: absolute;
  z-index: 3;
  top: 55%;
  left: var(--gutter);
  max-width: min(900px,74vw);
  transform: translateY(-40%);
}
.values-home__copy h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(4rem,7.8vw,8.6rem);
  font-weight: 800;
  line-height: .84;
  letter-spacing: -.075em;
  text-wrap: balance;
}
.values-home__copy p {
  max-width: 610px;
  margin: 2rem 0 0;
  color: rgba(255,255,255,.84);
  font-size: clamp(1rem,1.4vw,1.3rem);
  line-height: 1.52;
}
.values-home__copy.is-entering { animation: home-value-enter .5s ease both; }
@keyframes home-value-enter { from { opacity: .25; } to { opacity: 1; } }
.values-home__progress {
  position: absolute;
  z-index: 3;
  right: var(--gutter);
  bottom: 3rem;
  left: var(--gutter);
  height: 2px;
  background: rgba(255,255,255,.25);
}
.values-home__progress i {
  display: block;
  width: 2%;
  height: 100%;
  background: #ff5b3a;
  will-change: width;
}
.values-home__steps {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: repeat(5,1fr);
}
.values-home__mobile-rail,
.values-home__mobile-controls { display: none; }

.od-secindex__trigger { display: none; }
.od-secindex__panel { display: contents; }

.od-contact__route-trigger,
.od-contact__route-backdrop { display: none; }
.contact-extra-disclosure > summary { display: none; }
.contact-extra-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }

.footer-group > summary { list-style: none; }
.footer-group > summary::-webkit-details-marker { display: none; }
.footer-group > summary i { display: none; font-style: normal; }
.footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; }

.home-support {
  min-height: 760px;
  display: grid;
  grid-template-columns: 44% 56%;
  color: white;
  background: #ff5b3a;
}
.home-support figure { margin: 0; overflow: hidden; }
.home-support figure picture,
.home-support figure img { width: 100%; height: 100%; }
.home-support figure img {
  display: block;
  object-fit: cover;
  object-position: center 72%;
  filter: saturate(.82) contrast(1.05);
}
.home-support__copy {
  padding: clamp(3.5rem,6vw,7rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.home-support__copy .home-eyebrow { color: #17233e; }
.home-support__copy h2 {
  max-width: 840px;
  margin: 1.2rem 0 1.8rem;
  font-family: var(--display);
  font-size: clamp(3.35rem,5.6vw,6.2rem);
  font-weight: 800;
  line-height: .88;
  letter-spacing: -.072em;
  text-wrap: balance;
}
.home-support__copy > p:not(.home-eyebrow) {
  max-width: 590px;
  margin: 0 0 2.4rem;
  color: rgba(255,255,255,.9);
  font-size: 1.12rem;
  line-height: 1.55;
}
.home-support__actions {
  width: 100%;
  max-width: 760px;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 1rem;
}
.home-pill-link {
  width: 100%;
  min-height: 76px;
  padding: 0 1.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 999px;
  font-weight: 700;
}
.home-pill-link--light { color: #17233e; background: #fffdf9; }
.home-pill-link i { font-style: normal; font-size: 1.35rem; transition: transform .25s var(--ease); }
.home-pill-link:hover i { transform: translateX(.35rem); }

@media (max-width: 900px) {
  .home-support { grid-template-columns: 1fr; }
  .home-support figure { height: 65vw; }
  .home-support__copy { padding: 4rem var(--gutter); }
}
@media (max-width: 620px) {
  .values-home { height: 500vh; }
  .values-home__top { top: 6rem; }
  .values-home__top .home-eyebrow { font-size: clamp(1.75rem,9vw,3rem); }
  .values-home__copy { top: 56%; max-width: calc(100% - (var(--gutter) * 2)); }
  .values-home__copy h2 { font-size: clamp(3.5rem,16vw,5.5rem); }
  .home-support__actions { grid-template-columns: 1fr; }
  .home-support__copy h2 { font-size: clamp(3.35rem,14vw,5rem); }
}

/* ==========================================================================
   Interaktionssystem 2026

   1. Nur echte Links, Buttons und Auswahlfelder wechseln ihre Farbe.
   2. Hover ist voruebergehend: Navy/Weiss auf den Standardseiten.
   3. Eine getroffene Auswahl bleibt Orange-soft mit roter Signalkante/Check.
   4. Navigation bleibt ruhig. Nur Richtungspfeile und wenige kuratierte
      Bildbuehnen reagieren raeumlich; kompakte Controls geben beim Druecken
      1.5% nach.
   5. Scroll-Reveals, Menue, Akkordeons und Medienwechsel bleiben funktionale
      Bewegung. prefers-reduced-motion schaltet sie weiterhin ab.
   ========================================================================== */

/* Buttons: eine erkennbare, aber ruhige Farbantwort ohne schwebende Flaechen. */
.button,
.home-event__link,
.home-community-event__details a,
.home-pill-link,
.partner-contact__action,
.partner-contact__email,
.od-open-doors__next a,
.od-inspiring__next a,
.od-tutoring__next a,
.od-contact__submit,
.about-contact > a {
  transition:
    color var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    box-shadow var(--motion-fast) ease,
    transform 90ms ease;
}
.button:hover,
.home-event__link:hover,
.home-community-event__details a:hover,
.home-pill-link:hover,
.partner-contact__action:hover,
.partner-contact__email:hover,
.od-open-doors__next a:hover,
.od-inspiring__next a:hover,
.od-tutoring__next a:hover,
.about-contact > a:hover {
  color: var(--interaction-hover-fg);
  background: var(--interaction-hover-bg);
  border-color: var(--interaction-hover-bg);
  transform: none;
}
.button--dark:hover,
.button--light:hover,
.od-contact__submit:hover,
.od-contact__submit:focus-visible {
  color: var(--ink);
  background: var(--orange-cta);
  border-color: var(--orange-cta);
  transform: none;
}
.button:active,
.home-event__link:active,
.home-community-event__details a:active,
.home-pill-link:active,
.partner-contact__action:active,
.partner-contact__email:active,
.od-open-doors__next a:active,
.od-inspiring__next a:active,
.od-tutoring__next a:active,
.od-contact__submit:active,
.about-contact > a:active {
  transform: scale(var(--press-scale));
}

/* Nur Richtungsindikatoren bewegen sich bei einer echten Navigation. */
.button:hover .arrow,
.home-event__link:hover .arrow,
.home-community-event__details a:hover i,
.home-pill-link:hover i,
.partner-contact__action:hover .arrow,
.partner-contact__email:hover .arrow,
.od-open-doors__next a:hover span:last-child,
.od-inspiring__next a:hover span:last-child,
.od-tutoring__next a:hover span:last-child,
.about-contact > a:hover i {
  transform: translateX(4px);
}

/* Verlinkte Karten/Zeilen: Farbe statt Lift oder Bildzoom. */
.audience-card,
.offer-row,
.offer-finder__row,
.quick-way,
.offers-decision__paths a,
.od-row,
.od-donation__large-support,
.support-navigator a.support-navigator__item,
.od-contact__direct-links a {
  transition:
    color var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    border-color var(--motion-fast) ease;
}
.audience-card:hover { color: var(--white); background: var(--navy); }
.audience-card:hover .od-tile__media img,
.audience-card:focus-visible .od-tile__media img { transform: scale(1.035); }
.offer-finder__row:hover,
.offer-finder__row:focus-visible,
.quick-way:hover,
.offers-decision__paths a:hover,
.offers-decision__paths a:focus-visible {
  padding-left: inherit;
  padding-right: inherit;
  color: var(--white);
  background: var(--navy);
}
.offer-finder__row:hover .offer-finder__body small,
.offer-finder__row:hover .offer-finder__body > span,
.quick-way:hover p,
.offers-decision__paths a:hover .offers-decision__path-copy > span,
.offers-decision__paths a:focus-visible .offers-decision__path-copy > span {
  color: rgba(255,255,255,.74);
}
.offer-finder__row:hover i,
.offers-decision__paths a:hover i,
.offers-decision__paths a:focus-visible i { transform: translateX(4px); }
.offers-decision__paths a:hover::before,
.offers-decision__paths a:focus-visible::before { transform: scaleX(0); }
.offers-decision__paths a:hover .offers-decision__number,
.offers-decision__paths a:focus-visible .offers-decision__number,
.offers-decision__paths a:hover .offers-decision__path-copy strong,
.offers-decision__paths a:focus-visible .offers-decision__path-copy strong { transform: none; }
.offers-decision__paths a.is-active,
.offers-decision__paths a.is-active:hover {
  color: var(--interaction-selected-fg);
  background: var(--interaction-selected-bg);
  border-bottom-color: var(--line);
  box-shadow: none;
}
.offers-decision__paths a.is-active::before { transform: scaleX(0); }
.offers-decision__paths a.is-active .offers-decision__number,
.offers-decision__paths a.is-active .offers-decision__path-copy strong,
.offers-decision__paths a.is-active i { color: var(--ink); transform: none; }
.offers-decision__paths a.is-active .offers-decision__path-copy > span { color: var(--muted); }
.partner-stage-choices a:hover:not([data-active="true"]),
.partner-stage-choices a:focus-visible:not([data-active="true"]) {
  color: var(--white);
  background: var(--navy);
}
.partner-stage-choices a[data-active="true"],
.partner-stage-choices a[data-active="true"]:hover {
  color: var(--interaction-selected-fg);
  background: var(--interaction-selected-bg);
  box-shadow: none;
}
.od-donation__submit:hover,
.od-donation__submit:focus-visible {
  color: var(--white);
  background: var(--navy);
  transform: none;
}
.od-donation__submit:active,
.od-donation__large-support:active { transform: scale(var(--press-scale)); }
.od-donation__large-support:hover {
  color: var(--white);
  background: var(--navy);
}
.od-donation__large-support:hover span:last-child { transform: translateX(4px); }
.support-navigator a.support-navigator__item:hover {
  color: var(--white);
  background: var(--navy);
}
.support-navigator__item.is-current:hover {
  color: var(--white);
  background: var(--navy);
}
.od-contact__direct-links a:hover,
.od-contact__direct-links a:focus-visible {
  padding-left: 0;
  color: var(--white);
  background: var(--navy);
}

/* Auswahl: Hover darf nie wie eine bereits getroffene Auswahl aussehen. */
.choice-button:hover,
.amount-choice:hover,
.payment-choice:hover,
.od-donation__choice:hover > span,
.od-donation__payment:hover > span,
.od-donation__amount-choice:hover > span {
  color: var(--ink);
  background: var(--cream);
  border-color: var(--navy);
  box-shadow: none;
}
.choice-button.is-selected,
.amount-choice.is-selected,
.payment-choice.is-selected,
.od-donation__choice.is-selected > span,
.od-donation__payment.is-selected > span,
.od-donation__amount-choice.is-selected > span {
  color: var(--interaction-selected-fg);
  background: var(--interaction-selected-bg);
  border-color: var(--interaction-selected-line);
  box-shadow: none;
}
.od-donation__impact-choice:hover,
.od-donation__impact-choice:focus-visible {
  padding-left: 0;
  color: var(--ink);
  background: var(--cream);
}
.od-donation__impact-choice.is-active,
.od-donation__impact-choice.is-active:hover {
  padding-left: 0;
  color: var(--interaction-selected-fg);
  background: var(--interaction-selected-bg);
  box-shadow: none;
}
.od-contact__route:hover {
  padding-left: 0;
  color: var(--white);
  background: rgba(255,255,255,.06);
}
.od-contact__route.is-selected,
.od-contact__route.is-selected:hover {
  padding-left: 18px;
  color: var(--white);
  background: rgba(255,255,255,.075);
  box-shadow: inset 4px 0 0 var(--orange-cta);
}
.od-contact__route:hover i { transform: translateX(4px); }

/* Formulare antworten erst beim Fokus deutlich; Hover bleibt eine feine Kante. */
.field input:hover,
.field select:hover,
.field textarea:hover,
.od-contact__form .field input:hover,
.od-contact__form .field select:hover,
.od-contact__form .field textarea:hover {
  border-bottom-color: var(--navy);
  background: rgba(23,34,59,.045);
}

/* Statische Medien und rein redaktionelle Flaechen sind keine Controls. */
.editorial-image:hover img,
.offers-programme:hover .offers-programme__media img,
.od-open-doors__hero:hover .od-open-doors__hero-media img,
.od-inspiring__hero:hover .od-inspiring__hero-media img,
.od-tutoring__hero:hover .od-tutoring__hero-media img,
.od-donation__hero:hover .od-donation__hero-media img,
.od-contact__hero:hover .od-contact__hero-media img,
.od-inspiring__portrait:hover img,
.od-inspiring__representation:hover figure img,
.od-inspiring__closing-image:hover img,
.od-tutoring__reason:hover figure img {
  transform: none;
  filter: none;
}
/* Kuratierte Bildbuehnen: Das Aufklappen vermittelt Erkundung und ist hier
   Teil der Gestaltung. Es bleibt auf Zeigergeraete begrenzt. */
@media (hover: hover) and (pointer: fine) {
  .od-open-doors__film figure:hover,
  .od-open-doors__film figure:focus-within { flex: 1.7; }
  .od-open-doors__film figure:hover img,
  .od-open-doors__film figure:focus-within img {
    transform: scale(1.025);
    filter: saturate(1);
  }

  .od-inspiring__reel figure:hover,
  .od-inspiring__reel figure:focus-within { flex: 1.72; }
  .od-inspiring__reel figure:hover img,
  .od-inspiring__reel figure:focus-within img {
    transform: scale(1.025);
    filter: saturate(1.06);
  }
}
.od-tutoring__foundation li:hover {
  padding-left: 0;
  color: inherit;
  background: transparent;
}

@media (prefers-reduced-motion: reduce) {
  .button:active,
  .home-event__link:active,
  .home-community-event__details a:active,
  .home-pill-link:active,
  .partner-contact__action:active,
  .partner-contact__email:active,
  .od-open-doors__next a:active,
  .od-inspiring__next a:active,
  .od-tutoring__next a:active,
  .od-contact__submit:active,
  .about-contact > a:active { transform: none; }
  .audience-card:hover .od-tile__media img,
  .audience-card:focus-visible .od-tile__media img,
  .od-open-doors__film figure:hover img,
  .od-open-doors__film figure:focus-within img,
  .od-inspiring__reel figure:hover img,
  .od-inspiring__reel figure:focus-within img {
    transform: none;
    filter: none;
  }
  .od-open-doors__film figure:hover,
  .od-open-doors__film figure:focus-within,
  .od-inspiring__reel figure:hover,
  .od-inspiring__reel figure:focus-within { flex: 1; }
  .od-inspiring__reel .od-inspiring__reel-wide:hover,
  .od-inspiring__reel .od-inspiring__reel-wide:focus-within { flex: 1.22; }
}
@media (prefers-reduced-motion: reduce) {
  .values-home__copy { animation: none; }
  .home-pill-link i { transition: none; }
}

/* Official About page */
.about-page-active {
  --about-ink: #073b3d;
  --about-navy: #17233e;
  --about-orange: #ff5b3a;
  --about-paper: #f4f0ea;
  --about-white: #fffdf9;
  --about-line: rgba(7,59,61,.19);
  background: var(--about-white);
}
.about-page-active main { overflow: clip; }
.about-label {
  margin: 0;
  display: block;
  color: var(--about-ink);
  font-family: var(--mono);
  font-size: clamp(.75rem, .82vw, .875rem);
  font-weight: 700;
  letter-spacing: .075em;
  line-height: 1.35;
  text-transform: uppercase;
}
.about-label span { color: var(--about-orange); }
.about-label--light { color: white; }

.about-hero {
  height: 100svh;
  min-height: 720px;
  display: grid;
  grid-template-columns: 46% 54%;
  color: white;
  background: var(--about-navy);
}
.about-hero__copy {
  padding: clamp(2.4rem,4vw,4.8rem);
  display: flex;
  flex-direction: column;
}
.about-kicker {
  margin: 0;
  color: var(--about-orange);
  font-family: var(--mono);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.about-hero__logo {
  width: min(55%,340px);
  height: auto;
  margin: clamp(2.5rem,7vh,5.5rem) 0 0;
}
.about-hero__statement { margin-top: auto; }
.about-hero h1 {
  max-width: 12.5ch;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(3.8rem,6vw,7rem);
  font-weight: 800;
  line-height: .84;
  letter-spacing: -.075em;
}
.about-hero__statement p {
  max-width: 520px;
  margin: 2rem 0 0;
  color: rgba(255,255,255,.7);
  font-size: clamp(1rem,1.3vw,1.2rem);
  line-height: 1.55;
}
.about-hero__media { position: relative; margin: 0; overflow: hidden; }
.about-hero__media:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg,rgba(23,35,62,.5),transparent 38%);
}
.about-hero__media picture { width: 100%; height: 100%; display: block; }
.about-hero__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 56% 73%;
}
.about-hero__media figcaption {
  position: absolute;
  z-index: 2;
  right: 2rem;
  bottom: 2rem;
  color: white;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.about-page-active .od-secindex {
  background: rgba(255,253,249,.95);
  backdrop-filter: blur(16px);
}
.about-masthead-intro { grid-template-columns: minmax(0, 1fr); }
.about-masthead-intro > p { max-width: 52rem; }

.about-mission {
  padding: clamp(5rem,9vw,10rem) var(--gutter);
  color: var(--about-ink);
  background: var(--about-white);
}
.about-mission__head { display: grid; }
.about-mission__head .about-label { margin-bottom: clamp(2rem,4vw,4rem); }
.about-mission__head h2 {
  width: 100%;
  max-width: 12ch;
  margin: 0 auto;
  text-align: center;
  text-wrap: balance;
  font-family: var(--display);
  font-size: clamp(4.5rem,9vw,9.8rem);
  font-weight: 800;
  line-height: .94;
  letter-spacing: -.068em;
}
.about-mission__body {
  width: 100%;
  margin: clamp(4rem,7vw,7rem) 0 0;
  border-top: 1px solid var(--about-line);
}
.about-mission__lead {
  max-width: 1180px;
  margin: 0;
  padding: clamp(2rem,4vw,4rem) 0;
  color: var(--about-ink);
  font-family: var(--display);
  font-size: clamp(2rem,3.7vw,4.2rem);
  font-weight: 650;
  line-height: 1.02;
  letter-spacing: -.052em;
}
.about-mission__columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--about-line);
  border-bottom: 1px solid var(--about-line);
}
.about-mission__columns article { padding: 2.3rem clamp(1.5rem,3vw,3rem); }
.about-mission__columns article + article { border-left: 1px solid var(--about-line); }
.about-mission__columns span {
  color: var(--about-orange);
  font-family: var(--mono);
  font-size: var(--context-label-size);
  font-weight: 700;
  line-height: var(--context-label-leading);
  letter-spacing: var(--context-label-tracking);
  text-transform: uppercase;
}
.about-mission__columns p {
  max-width: 620px;
  margin: 1.2rem 0 0;
  color: #536465;
  font-size: clamp(1rem,1.2vw,1.16rem);
  line-height: 1.56;
}

.about-values {
  padding: clamp(6rem,10vw,11rem) var(--gutter);
  display: grid;
  grid-template-columns: 34% 66%;
  color: white;
  background: var(--about-navy);
}
.about-values__head {
  position: sticky;
  top: 6rem;
  align-self: start;
  padding-right: clamp(2rem,6vw,7rem);
}
.about-values__head h2 {
  margin: 1.5rem 0;
  font-family: var(--display);
  font-size: clamp(4rem,6.5vw,7.2rem);
  font-weight: 800;
  line-height: .82;
  letter-spacing: -.075em;
}
.about-values__head > p:last-child {
  max-width: 390px;
  color: rgba(255,255,255,.66);
  line-height: 1.55;
}
.about-values__list {
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(255,255,255,.22);
  list-style: none;
}
.about-values__list li {
  min-height: 170px;
  padding: 2rem 1.4rem;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 1rem;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.22);
}
.about-values__list li > span {
  color: var(--about-orange);
  font-family: var(--mono);
  font-size: .67rem;
}
.about-values__list h3 {
  margin: 0;
  color: white;
  font-family: var(--display);
  font-size: clamp(2rem,3.3vw,3.8rem);
  font-weight: 700;
  line-height: .95;
  letter-spacing: -.055em;
}
.about-values__list p {
  max-width: 300px;
  margin: 0;
  color: rgba(255,255,255,.66);
  line-height: 1.45;
}

.about-structure {
  position: relative;
  padding: clamp(6rem,10vw,11rem) var(--gutter);
  overflow: hidden;
  color: white;
  background: var(--about-navy);
}
.about-structure:before {
  content: "";
  position: absolute;
  top: 0;
  right: var(--gutter);
  left: var(--gutter);
  height: 1px;
  background: rgba(255,255,255,.2);
}
.about-structure__head {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(260px,31%);
  gap: clamp(2rem,5vw,6rem);
  align-items: end;
}
.about-structure__head .about-label { grid-column: 1/-1; }
.about-structure__head h2 {
  max-width: 10ch;
  margin: 0;
  text-wrap: balance;
  font-family: var(--display);
  font-size: clamp(4.3rem,7.2vw,8rem);
  font-weight: 800;
  line-height: .88;
  letter-spacing: -.068em;
}
.about-structure__head > p:last-child {
  max-width: 430px;
  margin: 0 .55rem .55rem 0;
  color: rgba(255,255,255,.72);
  font-size: 1.05rem;
  line-height: 1.6;
}
.about-commission {
  margin-top: clamp(4rem,7vw,7rem);
  padding: clamp(2.75rem,4.5vw,5rem);
  display: grid;
  grid-template-columns: 18% 40% 42%;
  color: var(--about-ink);
  background: var(--about-paper);
}
.about-commission__index {
  grid-column: 1;
  margin: .4rem 0 0;
  padding-right: 2rem;
  color: var(--about-ink);
  font-family: var(--mono);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.about-commission > h3 {
  grid-column: 2;
  max-width: 9ch;
  margin: 0;
  padding-right: clamp(2rem,4vw,4rem);
  font-family: var(--display);
  font-size: clamp(3rem,4.7vw,5.25rem);
  font-weight: 750;
  line-height: .92;
  letter-spacing: -.06em;
}
.about-commission__copy {
  grid-column: 3;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem,3vw,3rem);
}
.about-commission__copy p { margin: .35rem 0 0; color: #536465; line-height: 1.58; }
.about-commission__statement {
  grid-column: 2/4;
  margin: clamp(2.5rem,4vw,4.5rem) 0 0;
  padding-top: clamp(2rem,3vw,3rem);
  border-top: 1px solid var(--about-line);
}
.about-commission__statement span {
  max-width: 23ch;
  display: block;
  font-family: var(--display);
  font-size: clamp(1.9rem,3vw,3.45rem);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -.045em;
}
.about-structure__model-head {
  margin-top: clamp(6rem,9vw,9rem);
  padding-bottom: clamp(2.5rem,4vw,4.5rem);
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(260px,31%);
  gap: clamp(2rem,5vw,6rem);
  align-items: end;
  border-bottom: 1px solid rgba(255,255,255,.2);
}
.about-structure__model-head h3 {
  max-width: 12ch;
  margin: 1.25rem 0 0;
  font-family: var(--display);
  font-size: clamp(3rem,5vw,5.8rem);
  font-weight: 750;
  line-height: .92;
  letter-spacing: -.06em;
}
.about-structure__model-head > p {
  max-width: 420px;
  margin: 0 .25rem .25rem 0;
  color: rgba(255,255,255,.67);
  line-height: 1.58;
}
.about-structure__map {
  margin: 0;
  padding: 0;
  display: block;
  border-top: 1px solid rgba(255,255,255,.28);
  list-style: none;
}
.about-structure__map li {
  min-height: 0;
  padding: clamp(1.8rem,3vw,3rem) 0;
  display: grid;
  grid-template-columns: 31% 27% 42%;
  align-items: start;
  border-bottom: 1px solid rgba(255,255,255,.28);
  background: transparent;
}
.about-structure__card-head,
.about-structure__card-copy { display: contents; }
.about-structure__number {
  color: var(--orange-readable);
  font-family: var(--mono);
  font-size: .66rem;
}
.about-structure__role {
  margin: 0;
  padding-right: 2rem;
  color: rgba(255,255,255,.58);
  font-family: var(--mono);
  font-size: .64rem;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: .075em;
  text-transform: uppercase;
  display: grid;
  grid-template-columns: 2.6rem minmax(0,1fr);
  gap: .4rem;
}
.about-structure__map h3 {
  margin: 0;
  padding-right: 2rem;
  color: white;
  font-family: var(--display);
  font-size: clamp(1.9rem,2.6vw,3.15rem);
  font-weight: 700;
  line-height: .96;
  letter-spacing: -.045em;
}
.about-structure__card-copy > p {
  margin: 0;
  color: rgba(255,255,255,.68);
  line-height: 1.55;
}
.about-structure__commission h3 { font-weight: 800; }
.about-structure__commission .about-structure__card-copy > p { grid-column: 3; }

.about-contact {
  padding: clamp(5rem,9vw,9rem) var(--gutter);
  display: grid;
  grid-template-columns: 18% 1fr 34%;
  gap: clamp(2rem,5vw,6rem);
  align-items: end;
  color: var(--about-ink);
  background: var(--about-orange);
}
.about-contact .about-label span { color: var(--about-navy); }
.about-contact h2 {
  margin: 0;
  color: white;
  font-family: var(--display);
  font-size: clamp(4rem,7vw,8rem);
  font-weight: 800;
  line-height: .82;
  letter-spacing: -.075em;
}
.about-contact > p:nth-of-type(2) {
  max-width: 480px;
  margin: 0;
  color: white;
  font-size: 1.1rem;
  line-height: 1.55;
}
.about-contact > a {
  grid-column: 3;
  min-height: 80px;
  padding: 0 1.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--about-navy);
  border-radius: 999px;
  background: var(--about-white);
  font-weight: 700;
}
.about-contact > a i { font-style: normal; font-size: 1.35rem; transition: transform .25s; }
.about-contact > a:hover i { transform: translateX(4px); }

@media (max-width: 980px) {
  .about-hero { height: auto; min-height: 100svh; grid-template-columns: 1fr; }
  .about-hero__copy { min-height: 72svh; }
  .about-hero__media { height: 75svh; }
  .about-values { grid-template-columns: 1fr; }
  .about-values__head { position: relative; top: auto; padding: 0 0 4rem; }
  .about-structure__head,
  .about-structure__model-head { grid-template-columns: 1fr; gap: 2rem; }
  .about-structure__head > p:last-child { max-width: 560px; }
  .about-commission { grid-template-columns: 28% 72%; }
  .about-commission__index { grid-column: 1; }
  .about-commission > h3 { grid-column: 2; padding-right: 0; }
  .about-commission__copy { grid-column: 2; margin-top: 2.5rem; }
  .about-commission__statement { grid-column: 2; }
  .about-structure__map li { grid-template-columns: 1fr; }
  .about-structure__role { grid-column: 1; grid-row: 1; padding-right: 0; }
  .about-structure__map h3 { grid-column: 1; grid-row: 2; margin-top: 1.5rem; padding-right: 0; }
  .about-structure__card-copy > p { grid-column: 1; grid-row: 3; margin-top: 1rem; max-width: 620px; }
  .about-structure__commission .about-structure__card-copy > p { grid-column: 1; grid-row: 3; margin-top: 1rem; }
  .about-contact { grid-template-columns: 1fr; }
  .about-contact > a { grid-column: 1; }
}
@media (max-width: 620px) {
  .about-hero__copy { min-height: 86svh; padding: 2rem 1.25rem; }
  .about-hero__logo { width: 58%; }
  .about-hero h1 { font-size: clamp(3.7rem,17vw,5.6rem); }
  .about-hero__media { height: 72svh; }
  .about-mission,
  .about-values,
  .about-structure,
  .about-contact { padding-right: 1.25rem; padding-left: 1.25rem; }
  .about-mission__head h2,
  .about-values__head h2,
  .about-structure__head h2,
  .about-contact h2 { font-size: clamp(3.35rem,14.5vw,5rem); }
  .about-mission__columns { grid-template-columns: 1fr; }
  .about-mission__columns article + article { border-top: 1px solid var(--about-line); border-left: 0; }
  .about-values__list li { min-height: 0; grid-template-columns: 1fr; padding: 1.6rem 0; }
  .about-values__list li p { grid-column: 1; }
  .about-commission { padding: 2.25rem 1.5rem; grid-template-columns: 1fr; }
  .about-commission__index,
  .about-commission > h3,
  .about-commission__copy,
  .about-commission__statement { grid-column: 1; }
  .about-commission > h3 { margin-top: 2.5rem; font-size: clamp(2.75rem,12vw,4rem); }
  .about-commission__copy { grid-template-columns: 1fr; }
  .about-commission__statement { margin-top: 2.5rem; }
  .about-structure__model-head h3 { font-size: clamp(2.8rem,12vw,4rem); }
  .about-structure__map li { padding: 2rem 0; grid-template-columns: 1fr; }
  .about-contact > a { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .about-contact > a i { transition: none; }
}

/* Shared standard header system.
   Community Event, About and Contact intentionally keep their own art direction. */
body.standard-header-active .site-header .brand {
  align-items: flex-start;
}
body.standard-header-active .brand-overline {
  width: 77.5%;
  max-width: 77.5%;
  text-align: center;
  font-size: clamp(.95rem, 1.1vw, 1rem);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.025em;
  white-space: nowrap;
}

.site-standard-hero h1 {
  max-width: 27ch;
  margin: 0;
  color: #050505;
  font-family: var(--mono);
  font-size: clamp(2.15rem, 3.35vw, 3.15rem);
  font-weight: 480;
  line-height: 1.1;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.home-masthead.site-standard-hero h1 { max-width: 23ch; }
.home-masthead__ticker { display: none; }
.mobile-hero-ticker,
.mobile-hero-summary { display: none; }

@keyframes home-masthead-ticker-loop {
  to { transform: translate3d(calc(-1 * var(--mobile-ticker-distance, 50%)), 0, 0); }
}

.site-standard-hero figcaption { display: none !important; }
.site-standard-hero .od-inspiring__hero-media::after,
.site-standard-hero .od-tutoring__hero-media::after,
.site-standard-hero .od-donation__hero-media::after { display: none; }

@media (max-width: 620px) {
  body.standard-header-active .brand-overline {
    font-size: clamp(.82rem, 3.35vw, .95rem);
  }
  .site-standard-hero h1 {
    max-width: 100%;
    font-size: clamp(2rem, 9vw, 2.65rem);
    line-height: 1.12;
  }
}

/* ========================================================================== 
   Optische Kollisionskorrektur

   Grosse Manrope-Titel benötigen je nach Gewicht etwas mehr Raum als ihre
   rechnerische Bounding-Box. Diese gezielten Werte verhindern zufällige
   Berührungen von Ober- und Unterlängen, ohne die bewusst kompakten
   Display-Proportionen oder dekorative Überlagerungen aufzulösen.
   ========================================================================== */
.big-serif,
.offers-head h2,
.feature-copy h2,
.closing-cta h2,
.donation-shell__intro h2,
.recurring-band__copy h2,
.contact-form-section__intro h2,
.audience-map__head h2,
.content-block h2,
.offer-feature__copy h2,
.program-status__heading h2 {
  line-height: .98;
  letter-spacing: -.05em;
}

.home-community-event__copy h2,
.values-home__copy h2,
.home-support__copy h2 {
  line-height: .92;
  letter-spacing: -.055em;
}

.values-story__intro h2,
.values-story__value h3,
.values-story__outro h3 {
  line-height: .95;
  letter-spacing: -.052em;
}

.od-inspiring__table-intro h2,
.od-inspiring__voices-copy h2,
.od-inspiring__representation h2,
.od-inspiring__closing-image > p,
.od-inspiring__next h2,
.od-open-doors__next h2,
.od-tutoring__reason h2,
.od-tutoring__next h2 {
  line-height: .98;
  letter-spacing: -.055em;
}

.about-hero h1,
.about-values__head h2,
.about-structure__head h2,
.about-structure__model-head h3,
.about-contact h2 {
  line-height: .94;
  letter-spacing: -.055em;
}

.about-mission__head h2,
.about-values__list h3,
.about-commission > h3,
.about-structure__map h3 {
  line-height: 1;
  letter-spacing: -.045em;
}

/* ========================================================================== 
   Kontext- und Metadaten-System

   1. Kontextzeilen stehen im selben Heading-Block wie die zugehörige H1/H2.
   2. Zielgruppen sind Chips, keine zweite Art von Kontextzeile.
   3. Zahlen bleiben nur bei echten Abläufen oder Reihenfolgen erhalten.
   4. Der frühere Hohlkreis war rein dekorativ und wird nirgends erzeugt.
   ========================================================================== */
.section-label,
.od-open-doors__eyebrow,
.od-inspiring__eyebrow,
.od-inspiring__label,
.od-tutoring__eyebrow,
.od-tutoring__label,
.od-donation__eyebrow,
.od-donation__label,
.od-contact__label,
.od-contact__kicker,
.about-label,
.home-eyebrow {
  font-size: var(--context-label-size);
  font-weight: 650;
  line-height: var(--context-label-leading);
  letter-spacing: var(--context-label-tracking);
}

.od-inspiring__table-intro h2,
.od-inspiring__voices-copy h2,
.od-inspiring__representation h2,
.od-tutoring__reason h2,
.od-tutoring__status h2,
.od-tutoring__next h2,
.od-donation__why h2,
.od-donation__contact h2,
.od-contact__direct h2 {
  margin-top: clamp(1.125rem, 1.7vw, 1.5rem);
}

@media (max-width: 760px) {
  :root { --context-label-size: .75rem; }
  .od-inspiring__table-intro h2,
  .od-inspiring__voices-copy h2,
  .od-inspiring__representation h2,
  .od-tutoring__reason h2,
  .od-tutoring__status h2,
  .od-tutoring__next h2,
  .od-donation__why h2,
  .od-donation__contact h2,
  .od-contact__direct h2 {
    margin-top: 1.125rem;
  }
}

/* ==========================================================================
   Mobile architecture — 14.08.2026

   The desktop rail is deliberately replaced, not merely scaled down. On a
   phone the persistent rail consumed up to 18% of the viewport and forced
   every composition into a narrow, cropped canvas. The compact top bar keeps
   the two global actions (menu and language) available while returning the
   complete viewport width to page content. Breakpoints are content-driven;
   safe-area insets protect controls on notched devices.
   ========================================================================== */
@media (max-width: 900px) {
  :root {
    --rail-width: 0px;
    --mobile-header-height: 70px;
    --mobile-gutter: clamp(18px, 5.2vw, 24px);
    --gutter: var(--mobile-gutter);
    --section: clamp(4.5rem, 18vw, 6.25rem);
    --t2-display: clamp(2.7rem, 13vw, 4rem);
    --t2: clamp(2.35rem, 11vw, 3.5rem);
    --t3: clamp(1.6rem, 7.4vw, 2.2rem);
  }

  html { overflow-x: clip; scroll-padding-top: calc(var(--mobile-header-height) + env(safe-area-inset-top)); }
  body {
    min-width: 0;
    padding-right: 0;
    overflow-x: clip;
    font-size: 1rem;
  }
  .page-shell {
    width: 100%;
    min-width: 0;
    padding-top: calc(var(--mobile-header-height) + env(safe-area-inset-top));
    overflow-x: clip;
  }
  main, main > *, section, article, header, footer, nav, div, figure,
  h1, h2, h3, p, strong { min-width: 0; }

  /* Compact global top bar. */
  .site-header {
    position: fixed;
    z-index: 70;
    inset: 0 0 auto;
    width: 100%;
    height: calc(var(--mobile-header-height) + env(safe-area-inset-top));
    padding: env(safe-area-inset-top) 140px 0 max(var(--mobile-gutter), env(safe-area-inset-left));
    display: flex;
    align-items: center;
    color: var(--ink);
    background: rgba(248,245,239,.96);
    border-bottom: 1px solid var(--line);
    /* A backdrop filter would make the fixed language dialog use this
       70-pixel bar as its containing block on Safari/WebKit. */
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: auto;
  }
  .site-header .brand,
  body.standard-header-active .site-header .brand {
    width: auto;
    min-height: 48px;
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-start;
    color: var(--ink);
  }
  body.header-on-dark .site-header .brand { color: var(--ink); }
  .site-header .brand::after {
    content: "OPEN DESK";
    font-family: var(--display);
    font-size: clamp(.98rem, 4.5vw, 1.15rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.055em;
    white-space: nowrap;
  }
  .site-header .brand-overline,
  .site-header .brand-logo { display: none; }

  .header-rail {
    position: fixed;
    z-index: 72;
    inset: env(safe-area-inset-top) max(env(safe-area-inset-right), 0px) auto auto;
    width: 140px;
    height: var(--mobile-header-height);
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: row-reverse;
    overflow: visible;
    color: var(--ink);
    background: var(--orange-cta);
    border: 0;
    border-left: 1px solid rgba(6,45,51,.16);
  }
  .rail-primary { display: none; }
  .header-rail .menu-button {
    width: 70px;
    height: 70px;
    flex: 0 0 70px;
    padding: 17px 18px 8px;
    border: 0;
    border-left: 1px solid rgba(6,45,51,.2);
  }
  .header-rail .menu-button span { margin-bottom: 4px; }
  .header-rail .menu-button b { margin-top: 2px; font-size: .58rem; }
  .rail-language { width: 70px; height: 70px; margin: 0; }
  .rail-language-button {
    width: 70px;
    min-height: 70px;
    height: 70px;
    padding: 8px 4px;
    gap: 3px;
    border: 0;
  }
  .rail-language-button svg { display: none; }
  .rail-language-button span { font-size: .54rem; }
  .rail-language-button strong { font-size: .72rem; }

  .mobile-menu {
    z-index: 68;
    inset: calc(var(--mobile-header-height) + env(safe-area-inset-top)) 0 0;
    padding: clamp(2rem, 8vh, 4rem) max(var(--mobile-gutter), env(safe-area-inset-right)) calc(2rem + env(safe-area-inset-bottom)) max(var(--mobile-gutter), env(safe-area-inset-left));
    place-items: start;
    overflow-y: auto;
  }
  body.menu-open .mobile-menu {
    padding-top: clamp(2rem, 8vh, 4rem);
    padding-right: max(var(--mobile-gutter), env(safe-area-inset-right));
    padding-left: max(var(--mobile-gutter), env(safe-area-inset-left));
  }
  body.menu-open .site-header { color: white; background: var(--navy); border-bottom-color: rgba(255,255,255,.18); }
  body.menu-open .site-header .brand,
  body.menu-open .site-header .brand::after { display: inline-flex; color: white; }
  body.menu-open .header-rail { background: var(--navy); }
  body.menu-open .header-rail .menu-button { border-left-color: rgba(255,255,255,.18); }
  .mobile-menu__nav { width: 100%; }
  .mobile-menu a {
    min-height: 52px;
    font-size: clamp(1.65rem, 8vw, 2.35rem);
    line-height: 1.08;
  }
  .mobile-menu__group--small a { font-size: clamp(1.15rem, 5.6vw, 1.5rem); }

  .rail-language-panel {
    z-index: 71;
    inset: calc(var(--mobile-header-height) + env(safe-area-inset-top)) 0 0;
    width: 100%;
    max-height: none;
    padding: 1.5rem max(var(--mobile-gutter), env(safe-area-inset-right)) calc(1.5rem + env(safe-area-inset-bottom)) max(var(--mobile-gutter), env(safe-area-inset-left));
    border: 0;
    transform: translateY(-12px);
  }

  /* Standard heroes: editorial text block followed by full-width media. */
  .page-hero--media,
  .page-hero--plain {
    position: relative;
    height: auto;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .page-hero--media .page-hero-content,
  .page-hero--plain .page-hero-content {
    position: static;
    order: 1;
    width: 100%;
    min-height: clamp(245px, 70vw, 340px);
    padding: clamp(3.25rem, 14vw, 5rem) var(--mobile-gutter) clamp(2.5rem, 11vw, 4rem);
    display: flex;
    justify-content: flex-end;
  }
  .page-hero-media {
    position: relative;
    inset: auto;
    order: 2;
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 5;
  }
  .page-hero--media .section-label { margin-bottom: 1rem; font-size: .75rem; }
  .page-hero--media h1,
  .site-standard-hero h1 {
    max-width: 100%;
    font-size: clamp(2rem, 9vw, 2.75rem);
    line-height: 1.1;
    overflow-wrap: break-word;
    hyphens: none;
  }
  .home-masthead.site-standard-hero h1 {
    max-width: 19ch;
    font-size: clamp(1.8rem, 8vw, 2.35rem);
  }

  /* The homepage has a photographic mobile masthead: the desktop statement
     remains the semantic h1, while the visible wording moves into the ticker
     below the image. This removes the tall empty editorial panel on phones. */
  .home-masthead.page-hero--media {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: var(--paper);
  }
  .home-masthead.page-hero--media .page-hero-content {
    position: absolute !important;
    width: 1px;
    height: 1px;
    min-height: 0;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .home-masthead.page-hero--media .page-hero-media {
    order: 1;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    background: var(--navy);
  }
  .home-masthead.page-hero--media .page-hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 40% center !important;
  }
  .home-masthead__ticker {
    position: relative;
    order: 2;
    width: 100%;
    min-height: 56px;
    display: flex;
    align-items: center;
    overflow: hidden;
    color: var(--ink);
    background: var(--orange-cta);
    border-top: 1px solid rgba(6,45,51,.18);
    border-bottom: 1px solid rgba(6,45,51,.18);
  }
  .home-masthead__ticker-track {
    width: max-content;
    display: flex;
    align-items: center;
    will-change: transform;
    animation: home-masthead-ticker-loop 18s linear infinite;
  }
  .home-masthead__ticker-message {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-right: 1.25rem;
    white-space: nowrap;
    font-family: var(--mono);
    font-size: clamp(.9rem, 4vw, 1.08rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.025em;
  }
  .home-masthead__ticker-message span {
    display: inline-flex;
    align-items: center;
    gap: 1.25rem;
  }
  .home-masthead__ticker-message span::after {
    content: "•";
    font-family: var(--sans);
    font-size: .7em;
  }
  .page-hero--plain .page-hero-content { min-height: clamp(360px, 100vw, 520px); }
  .not-found { min-height: calc(100svh - var(--mobile-header-height)); padding-top: 0; }

  /* Contact and donation have bespoke desktop stages. On phones the copy
     starts promptly below the global bar instead of reserving an empty logo
     field that belonged to the former rail composition. */
  .od-contact__hero-copy {
    min-height: clamp(520px, 68svh, 600px);
    padding-top: clamp(3rem, 12vw, 5rem);
  }
  .od-donation__hero-copy {
    min-height: clamp(520px, 68svh, 620px);
    padding-top: clamp(3rem, 12vw, 5rem);
  }

  /* The two-column contact router becomes a short horizontal choice rail.
     Keeping seven stacked 82px choices above the form made the second step
     begin almost 3,000px down the page on a 390px phone. */
  .od-contact__route-list {
    display: flex;
    gap: 10px;
    padding: 0 0 8px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    border-top: 0;
    scrollbar-width: none;
  }
  .od-contact__route-list::-webkit-scrollbar { display: none; }
  .od-contact__route {
    flex: 0 0 min(78vw, 310px);
    min-height: 96px;
    padding: 16px;
    scroll-snap-align: start;
    border: 1px solid rgba(255,255,255,.3);
  }
  .od-contact__route.is-selected { padding-left: 18px; }
  .od-contact__safety { margin-top: 24px; }

  /* Horizontal section indexes stay swipeable and never hide page width. */
  .od-secindex {
    width: 100%;
    gap: .5rem;
    padding: 8px var(--mobile-gutter);
    scroll-padding-inline: var(--mobile-gutter);
  }
  .od-secindex a { min-height: 48px; padding: .35rem .7rem; }

  /* Mobile ergonomics and iOS form behaviour. */
  .button,
  .home-pill-link,
  .ce-button,
  .quick-way,
  .od-contact__submit,
  .od-contact__direct-links a { min-height: 48px; }
  input, select, textarea { font-size: 16px; }
  input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),
  select { min-height: 48px; }
  textarea { min-height: 150px; }
  .to-top { min-height: 48px; padding-block: .5rem; }
  .site-footer { padding-bottom: calc(2rem + env(safe-area-inset-bottom)); }

  /* Shared mobile masthead for all regular subpages. Desktop compositions
     stay untouched; phones receive the same image → ticker rhythm as home. */
  main .mobile-ticker-hero {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    background: var(--paper);
  }
  main .mobile-ticker-hero > .page-hero-content,
  main .mobile-ticker-hero > .od-open-doors__hero-copy,
  main .mobile-ticker-hero > .od-inspiring__hero-copy,
  main .mobile-ticker-hero > .od-tutoring__hero-copy,
  main .mobile-ticker-hero > .od-donation__hero-copy,
  main .mobile-ticker-hero > .od-contact__hero-copy {
    position: absolute !important;
    width: 1px;
    height: 1px;
    min-height: 0;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  main .mobile-ticker-hero > .page-hero-media,
  main .mobile-ticker-hero > .od-open-doors__hero-media,
  main .mobile-ticker-hero > .od-inspiring__hero-media,
  main .mobile-ticker-hero > .od-tutoring__hero-media,
  main .mobile-ticker-hero > .od-donation__hero-media,
  main .mobile-ticker-hero > .od-contact__hero-media {
    position: relative;
    inset: auto;
    order: 1;
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    flex: 0 0 auto;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--navy);
  }
  main .mobile-ticker-hero > .page-hero-media img,
  main .mobile-ticker-hero > .od-open-doors__hero-media img,
  main .mobile-ticker-hero > .od-inspiring__hero-media img,
  main .mobile-ticker-hero > .od-tutoring__hero-media img,
  main .mobile-ticker-hero > .od-donation__hero-media img,
  main .mobile-ticker-hero > .od-contact__hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  main .mobile-ticker-hero figcaption { display: none; }
  .mobile-hero-ticker {
    position: relative;
    order: 2;
    width: 100%;
    min-height: 56px;
    display: flex;
    align-items: center;
    overflow: hidden;
    color: var(--ink);
    background: var(--orange-cta);
    border-top: 1px solid rgba(6,45,51,.18);
    border-bottom: 1px solid rgba(6,45,51,.18);
  }
  .mobile-hero-ticker__track {
    width: max-content;
    display: flex;
    align-items: center;
    will-change: transform;
    animation: home-masthead-ticker-loop 18s linear infinite;
  }
  .mobile-hero-ticker__message {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-right: 1.25rem;
    white-space: nowrap;
    font-family: var(--mono);
    font-size: clamp(.9rem, 4vw, 1.08rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.025em;
  }
  .mobile-hero-ticker__message span {
    display: inline-flex;
    align-items: center;
    gap: 1.25rem;
  }
  .mobile-hero-ticker__message span::after {
    content: "•";
    font-family: var(--sans);
    font-size: .7em;
  }
  .mobile-hero-summary {
    order: 3;
    width: 100%;
    margin: 0;
    padding: 1.35rem var(--mobile-gutter) 1.5rem;
    display: block;
    color: var(--ink);
    background: var(--paper);
    font-size: clamp(.95rem, 4vw, 1.05rem);
    line-height: 1.55;
    border-bottom: 1px solid var(--line);
  }
}

@media (max-width: 360px) {
  :root { --mobile-header-height: 64px; --mobile-gutter: 18px; }
  .site-header { padding-right: 128px; }
  .header-rail { width: 128px; height: 64px; }
  .header-rail .menu-button,
  .rail-language,
  .rail-language-button { width: 64px; height: 64px; min-height: 64px; flex-basis: 64px; }
  .header-rail .menu-button { padding: 14px 16px 7px; }
  .site-header .brand::after { content: "OPENDESK"; font-size: .93rem; }
  .home-masthead__ticker { min-height: 52px; }
  .home-masthead__ticker-message { font-size: .86rem; }
  .mobile-hero-ticker { min-height: 52px; }
  .mobile-hero-ticker__message { font-size: .86rem; }
}

@media (max-width: 900px) and (orientation: landscape) {
  :root { --mobile-header-height: 62px; }
  .site-header { padding-right: 124px; }
  .header-rail { width: 124px; height: 62px; }
  .header-rail .menu-button,
  .rail-language,
  .rail-language-button { width: 62px; height: 62px; min-height: 62px; flex-basis: 62px; }
  .page-hero--media { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .page-hero--media .page-hero-content { grid-column: 1; grid-row: 1; min-height: calc(100svh - var(--mobile-header-height)); padding: 2rem var(--mobile-gutter); }
  .page-hero-media { grid-column: 2; grid-row: 1; height: calc(100svh - var(--mobile-header-height)); aspect-ratio: auto; }
  .page-hero--media h1,
  .site-standard-hero h1 { font-size: clamp(1.65rem, 4.7vw, 2.4rem); }
  .mobile-menu { padding-top: 1.25rem; }
  .mobile-menu a { min-height: 44px; font-size: clamp(1.35rem, 5vw, 1.8rem); }

  .home-masthead.page-hero--media {
    height: calc(100svh - var(--mobile-header-height));
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) 48px;
  }
  .home-masthead.page-hero--media .page-hero-content {
    position: absolute !important;
    grid-column: auto;
    grid-row: auto;
    min-height: 0;
    padding: 0;
  }
  .home-masthead.page-hero--media .page-hero-media {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
  }
  .home-masthead__ticker {
    grid-column: 1;
    grid-row: 2;
    min-height: 48px;
  }

  main .mobile-ticker-hero {
    height: auto;
    min-height: 0;
    display: flex;
    grid-template-columns: none;
    grid-template-rows: none;
  }
  main .mobile-ticker-hero > .page-hero-media,
  main .mobile-ticker-hero > .od-open-doors__hero-media,
  main .mobile-ticker-hero > .od-inspiring__hero-media,
  main .mobile-ticker-hero > .od-tutoring__hero-media,
  main .mobile-ticker-hero > .od-donation__hero-media,
  main .mobile-ticker-hero > .od-contact__hero-media {
    width: 100%;
    height: min(56svh, 360px);
    aspect-ratio: auto;
  }
  .mobile-hero-ticker { min-height: 48px; }
  .mobile-hero-summary { padding-block: 1rem 1.1rem; font-size: .92rem; }
}

@media (prefers-reduced-motion: reduce) {
  .home-masthead__ticker-track {
    animation: none;
    transform: none;
    will-change: auto;
  }
  .mobile-hero-ticker__track {
    animation: none;
    transform: none;
    will-change: auto;
  }
}

/* Final mobile cascade: placed last so it also replaces the historical
   compatibility fallbacks above. */
@media (max-width: 900px) {
  .values-home { height: auto; min-height: 0; }
  .values-home__sticky { position: relative; height: auto; min-height: min(860px, 100svh); padding: clamp(2rem,8vw,4rem) 0 1.5rem; display: flex; flex-direction: column; justify-content: flex-end; }
  .values-home__wash { background: linear-gradient(180deg,rgba(4,22,30,.1),rgba(4,22,30,.24) 48%,rgba(4,22,30,.52)); }
  .values-home__top { position: relative; inset: auto; margin: 0 var(--mobile-gutter) clamp(2rem,8vw,4.5rem); align-items: end; }
  .values-home__top .home-eyebrow { max-width: 8ch; font-size: clamp(2.6rem,13vw,4.7rem); }
  .values-home__counter strong { font-size: 1.4rem; }
  .values-home__counter span { font-size: .68rem; }
  .values-home__copy, .values-home__steps { display: none; }
  .values-home__mobile-rail { position: relative; z-index: 3; width: 100%; padding: 0 var(--mobile-gutter); display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--mobile-gutter); overscroll-behavior-inline: contain; scrollbar-width: none; }
  .values-home__mobile-rail::-webkit-scrollbar { display: none; }
  .values-home__card { flex: 0 0 calc(100% - 10px); min-height: clamp(340px,55svh,470px); padding: clamp(1.25rem,6vw,2rem); display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; scroll-snap-align: start; scroll-snap-stop: always; border: 1px solid rgba(255,255,255,.38); background: rgba(14,28,52,.9); }
  .values-home__card > span { margin-bottom: auto; color: var(--orange-readable); font-family: var(--mono); font-size: .74rem; font-weight: 700; letter-spacing: .08em; }
  .values-home__card h2 { margin: 0; font-family: var(--display); font-size: clamp(2.65rem,13vw,4.4rem); font-weight: 800; letter-spacing: -.065em; line-height: .9; overflow-wrap: anywhere; }
  .values-home__card p { max-width: 32ch; margin: 1.4rem 0 0; color: rgba(255,255,255,.78); font-size: .98rem; line-height: 1.5; }
  .values-home__mobile-controls { position: relative; z-index: 3; margin: 1rem var(--mobile-gutter) .9rem; display: flex; justify-content: flex-end; gap: 8px; }
  .values-home__mobile-controls button { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; color: #fff; background: transparent; font-size: 1.1rem; }
  .values-home__mobile-controls button:disabled { opacity: .28; }
  .values-home__progress { position: relative; inset: auto; margin: 0 var(--mobile-gutter); }
}

@media (max-width: 760px) {
  body.contact-route-open { overflow: hidden; }
  main :is(h1,h2,h3) { overflow-wrap: break-word; }
  .od-secindex { position: sticky; top: var(--mobile-header-height); z-index: 46; width: 100%; padding: 0; display: block; overflow: visible; border-bottom: 1px solid var(--line); box-shadow: 0 8px 22px rgba(5,22,31,.06); }
  .od-secindex__trigger { width: 100%; min-height: 56px; padding: 0 var(--mobile-gutter); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; border: 0; color: var(--ink); background: var(--stage-paper); text-align: left; font: inherit; letter-spacing: inherit; text-transform: inherit; }
  .od-secindex__trigger strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .od-secindex__trigger i { color: var(--orange-signal); font-style: normal; font-size: 1.1rem; transition: transform .2s var(--ease); }
  .od-secindex__count { color: var(--orange-signal); font-size: .62rem; }
  .od-secindex__panel { position: absolute; top: 100%; right: 0; left: 0; max-height: 0; display: grid; overflow: hidden; visibility: hidden; border-bottom: 1px solid var(--line); background: var(--stage-paper); box-shadow: 0 20px 35px rgba(5,22,31,.16); transition: max-height .3s var(--ease),visibility 0s .3s; }
  .od-secindex.is-open .od-secindex__panel { max-height: min(72svh,520px); visibility: visible; transition-delay: 0s; }
  .od-secindex.is-open .od-secindex__trigger i { transform: rotate(180deg); }
  .od-secindex a { width: 100%; min-height: 52px; padding: .65rem var(--mobile-gutter); border: 0; border-top: 1px solid var(--line); border-bottom: 0; }
  .od-secindex a[aria-current="location"] { border-bottom: 0; box-shadow: inset 4px 0 0 var(--orange-signal); }

  .od-contact__routes { padding: 2rem var(--mobile-gutter) 1.5rem; }
  .od-contact__routes > p { margin-bottom: 12px; }
  .od-contact__route-trigger { width: 100%; min-height: 74px; padding: 12px 14px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 12px; border: 1px solid rgba(255,255,255,.36); color: #fff; background: rgba(255,255,255,.07); text-align: left; }
  .od-contact__route-trigger span { grid-column: 1; color: var(--orange-readable); font-family: var(--mono); font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; }
  .od-contact__route-trigger strong { grid-column: 1; font-size: 1.05rem; line-height: 1.2; }
  .od-contact__route-trigger i { grid-column: 2; grid-row: 1 / 3; font-style: normal; color: var(--orange-readable); }
  .od-contact__route-backdrop { position: fixed; z-index: 108; inset: 0; display: block; border: 0; background: rgba(5,17,31,.68); }
  .od-contact__route-backdrop[hidden] { display: none; }
  .od-contact__route-list { position: fixed; z-index: 109; right: 0; bottom: 0; left: 0; max-height: min(78svh,680px); padding: 24px var(--mobile-gutter) calc(18px + env(safe-area-inset-bottom)); display: grid; gap: 0; overflow-y: auto; border: 0; border-radius: 22px 22px 0 0; background: var(--navy-deep); transform: translateY(105%); visibility: hidden; transition: transform .32s var(--ease),visibility 0s .32s; }
  .od-contact__route-list.is-open { transform: none; visibility: visible; transition-delay: 0s; }
  .od-contact__route { width: 100%; min-height: 60px; padding: 12px 8px; border: 0; border-bottom: 1px solid rgba(255,255,255,.18); }
  .od-contact__route.is-selected { padding-left: 14px; }
  .od-contact__route strong { font-size: 1.05rem; }
  .od-contact__safety { margin-top: 18px; padding-top: 16px; grid-template-columns: 1fr; gap: 7px; }
  .contact-extra-disclosure { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .contact-extra-disclosure > summary { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; list-style: none; cursor: pointer; font-family: var(--mono); font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
  .contact-extra-disclosure > summary::-webkit-details-marker { display: none; }
  .contact-extra-disclosure > summary i { display: block; color: var(--muted); font-style: normal; font-weight: 500; }
  .contact-extra-disclosure > summary::after { content: "+"; color: var(--orange-signal); font-size: 1.1rem; }
  .contact-extra-disclosure[open] > summary::after { content: "−"; }
  .contact-extra-fields { padding: 1rem 0 1.3rem; display: grid; grid-template-columns: 1fr; gap: 1.2rem; }

  .home-positioning__content { padding-block: clamp(3.5rem,15vw,5rem); gap: 2.25rem; }
  .home-positioning__copy { gap: 1.1rem; }
  .home-positioning__copy p { font-size: .98rem; line-height: 1.58; }
  .home-positioning__copy p:first-child { font-size: 1.07rem; }
  .offer-row { min-height: 112px; padding: 1.35rem 0; display: grid; grid-template-columns: minmax(0,1fr) 44px; align-items: center; }
  .offer-row p { margin: 0; grid-column: 1; font-size: .9rem; line-height: 1.45; }
  .offer-row .round-arrow { grid-column: 2; grid-row: 1 / 3; display: grid; width: 42px; height: 42px; }
  .home-community-event { grid-template-rows: auto minmax(360px,56svh) 48px; }
  .home-community-event__copy { min-height: 0; padding: 3rem var(--mobile-gutter); }
  .home-community-event__message { margin: 3.5rem 0 2.5rem; }
  .home-community-event__message h2 { font-size: clamp(2.8rem,12.5vw,4rem); line-height: .9; overflow-wrap: anywhere; }
  .home-community-event__message p { font-size: .98rem; }

  .site-footer { padding: 3.5rem var(--mobile-gutter) calc(1.5rem + env(safe-area-inset-bottom)); }
  .footer-top { padding-bottom: 2.25rem; gap: 1.5rem; }
  .footer-top p { font-size: 1.05rem; line-height: 1.42; }
  .footer-grid { padding: 1rem 0 1.5rem; display: block; }
  .footer-group { border-bottom: 1px solid var(--line-inverse); }
  .footer-group > summary { min-height: 56px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; }
  .footer-group > summary .footer-label { margin: 0; }
  .footer-group > summary i { display: block; color: var(--orange-readable); }
  .footer-group[open] > summary i { transform: rotate(45deg); }
  .footer-links { padding: 0 0 1.25rem; display: flex; gap: .7rem; }
  .footer-group:not([open]) > .footer-links { display: none; }
  .footer-grid a { font-size: .9rem; }
  .footer-utility { padding-block: 1.5rem; display: grid; gap: .8rem; }
  .footer-bottom { padding-top: 1.1rem; display: grid; grid-template-columns: 1fr auto; align-items: center; }
  .footer-bottom > span:nth-child(2) { display: none; }
}

@media (min-width: 761px) {
  .footer-group > summary { pointer-events: none; }
  .footer-group > .footer-links { display: flex !important; }
}

/* Mobile finish pass: centred wordmark, calm menu chrome and liquid-glass
   value cards. These rules deliberately sit last in the cascade. */
@media (max-width: 760px) {
  :root { --mobile-actions-width: 140px; }
  .site-header {
    padding-right: var(--mobile-actions-width);
    padding-left: 0;
  }
  .site-header .brand,
  body.standard-header-active .site-header .brand {
    width: calc(100vw - var(--mobile-actions-width));
    padding-inline: 12px;
    justify-content: center;
  }
  .site-header .brand::after {
    content: "OPENDESK";
    font-size: clamp(1.25rem, 5.8vw, 1.6rem);
    letter-spacing: -.055em;
  }

  .header-rail .menu-button:focus-visible {
    outline: 0;
    box-shadow: inset 0 -3px 0 var(--navy);
  }
  .header-rail .menu-button:hover:not([aria-expanded="true"]) {
    color: var(--ink);
    background: transparent;
  }

  body.menu-open .site-header {
    padding-right: 70px;
    border-bottom: 1px solid rgba(255,255,255,.16);
  }
  body.menu-open .site-header .brand { width: calc(100vw - 70px); }
  body.menu-open .header-rail {
    width: 70px;
    border: 0;
  }
  body.menu-open .rail-language { display: none; }
  body.menu-open .header-rail .menu-button {
    width: 70px;
    flex-basis: 70px;
    border: 0;
  }
  body.menu-open .header-rail .menu-button:focus-visible {
    outline: 0;
    box-shadow: inset 0 -3px 0 var(--orange-readable);
  }

  .values-home__card {
    position: relative;
    isolation: isolate;
    border-color: rgba(255,255,255,.58);
    border-radius: 26px;
    background: linear-gradient(148deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.07) 24%, rgba(9,32,45,.18) 58%, rgba(4,18,31,.3) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.64), inset 0 -1px 0 rgba(255,255,255,.12), 0 22px 54px rgba(2,13,24,.2);
    -webkit-backdrop-filter: blur(12px) saturate(170%) contrast(105%);
    backdrop-filter: blur(12px) saturate(170%) contrast(105%);
  }
  .values-home__card::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: radial-gradient(circle at 10% 2%, rgba(255,255,255,.34), transparent 34%), radial-gradient(circle at 88% 94%, rgba(136,211,225,.12), transparent 38%), linear-gradient(115deg, transparent 40%, rgba(255,255,255,.1) 51%, transparent 62%);
    mix-blend-mode: screen;
  }
  .values-home__card > span { color: #ffb19d; }
  .values-home__card h2 { color: #fff; text-shadow: 0 2px 22px rgba(2,13,24,.38); }
  .values-home__card p { color: rgba(255,255,255,.92); text-shadow: 0 1px 12px rgba(2,13,24,.5); }
  .values-home__mobile-controls button {
    background: rgba(255,255,255,.1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  @media (max-width: 900px) {
    .values-home__card { background: rgba(8,27,42,.78); }
  }
}

@media (max-width: 360px) {
  :root { --mobile-actions-width: 128px; }
  body.menu-open .site-header { padding-right: 64px; }
  body.menu-open .site-header .brand { width: calc(100vw - 64px); }
  body.menu-open .header-rail,
  body.menu-open .header-rail .menu-button { width: 64px; flex-basis: 64px; }
}

@media (max-width: 900px) and (orientation: landscape) {
  :root { --mobile-actions-width: 124px; }
  .site-header { padding-right: var(--mobile-actions-width); padding-left: 0; }
  .site-header .brand { width: calc(100vw - var(--mobile-actions-width)); justify-content: center; }
}

/* Mobile headline integrity: display words must move as complete words instead
   of shedding their last letters onto a new line. Component-specific sizes
   keep the longest translations inside narrow phone viewports. */
@media (max-width: 900px) {
  main :is(h1,h2,h3) {
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    text-wrap: balance !important;
  }

  .home-community-event__message h2 {
    font-size: clamp(2rem,9.6vw,3.5rem);
  }

  .home-support__copy h2 {
    font-size: clamp(2.55rem,11vw,4rem);
  }

  .values-home__card h2 {
    font-size: clamp(1.8rem,8.8vw,3.5rem);
  }

  .feature-copy h2 {
    font-size: clamp(2.1rem,9.3vw,3.4rem);
  }

  .lead-block__body h2 {
    font-size: clamp(1.4rem,6vw,1.75rem);
    line-height: 1.12;
    letter-spacing: -.035em;
    text-wrap: pretty !important;
  }

  .partner-contact__head h2,
  .od-open-doors__participation h2,
  .od-inspiring__participation h2 {
    font-size: clamp(2rem,9vw,2.75rem);
  }

  .od-open-doors__step h2,
  .od-inspiring__table-intro h2 {
    font-size: clamp(2.1rem,9.8vw,2.75rem);
  }

  .od-tutoring h2 {
    max-width: 100% !important;
    font-size: clamp(1.85rem,9.1vw,2.5rem) !important;
  }

  .od-inspiring__participation h2 span {
    white-space: nowrap;
  }

  .about-structure__head h2 {
    max-width: 100%;
    font-size: clamp(2rem,9.8vw,3.35rem);
  }

  .about-contact h2 {
    font-size: clamp(2.15rem,10.5vw,3.35rem);
  }

  .about-commission > h3 {
    max-width: 100%;
    font-size: clamp(1.9rem,9.3vw,2.75rem);
  }

  html[lang="tr"] .about-structure__head h2 {
    font-size: clamp(1.55rem,7.7vw,2.5rem);
  }
}

.od-no-break-token { white-space: nowrap; }