:root{
  --black:#1f1f1d;
  --paper:#dad8cc;
  --red:#c91f23;
  --muted-dark:rgba(31,31,29,.35);
  --muted-light:rgba(218,216,204,.26);
  --line-dark:rgba(31,31,29,.92);
  --line-light:rgba(218,216,204,.86);
  --rail-w:450px;
  --grid-line:15px;
  --copy-small-size:25pt;
  --copy-small-line:30pt;
  --pad-x:clamp(46px,6.8vw,132px);
  --font-head:'Big Shoulders Display',Impact,sans-serif;
  --font-body:'Inter',Arial,sans-serif;
  --easing:cubic-bezier(.77,0,.175,1);
}
*{box-sizing:border-box} html,body{margin:0;height:100%;overflow:hidden;background:var(--black);font-family:var(--font-body);color:var(--paper)}
button,a{font:inherit} .skip-link{position:fixed;left:1rem;top:1rem;z-index:1000;transform:translateY(-200%);background:var(--paper);color:var(--black);padding:.6rem}.skip-link:focus{transform:none}
.site-shell{height:100vh;width:100vw;overflow:hidden;position:relative}.matrix-viewport{height:100vh;overflow:hidden}.matrix-stage{height:100%;transition:transform 900ms var(--easing);will-change:transform}.matrix-section{position:relative;height:100vh;width:100vw;overflow:hidden}.slide-track{height:100%;display:flex;transition:transform 850ms var(--easing);will-change:transform}.slide{position:relative;flex:0 0 100vw;height:100vh;overflow:hidden}.theme-dark{background:var(--black);color:var(--paper)}.theme-paper{background:var(--paper);color:var(--black)}.theme-red{background:var(--red);color:var(--black)}
.theme-red.cover-section{background-image:url('assets/00_hintergrund-header.png');background-size:100vw 100vh;background-position:left top;background-repeat:no-repeat}.theme-red.intro-section{background-image:url('assets/00_hintergrund-intro.png');background-size:100vw 100vh;background-position:left top;background-repeat:no-repeat}.theme-red.footer-section{background-image:url('assets/08-hintergrund-footer.png');background-size:100vw 100vh;background-position:left top;background-repeat:no-repeat}
.chapter-rail{position:fixed;inset:0 auto 0 0;width:var(--rail-w);z-index:30;border-right:0;pointer-events:auto;color:var(--paper);transition:color 450ms ease,border-color 450ms ease,opacity 450ms ease}.chapter-rail::before{content:"";position:absolute;top:0;bottom:0;right:0;border-right:var(--grid-line) solid currentColor;z-index:4;pointer-events:none}.chapter-rail::after{content:"";position:absolute;left:0;right:0;top:450px;border-top:var(--grid-line) solid currentColor;opacity:.9;z-index:5;pointer-events:none}.mark-box{height:450px;width:450px;display:grid;place-items:center;position:relative;z-index:1}.rail-mark{width:450px;height:450px;object-fit:contain;transition:filter 350ms ease}.chapter-nav{position:absolute;z-index:1;left:clamp(18px,1.45vw,28px);bottom:clamp(62px,10vh,108px);text-transform:uppercase;font-family:var(--font-head);font-weight:900;letter-spacing:.02em;font-size:clamp(18px,1.18vw,24px);line-height:1.42}.chapter-nav ol{list-style:none;padding:0;margin:0}.chapter-link{display:block;border:0;background:transparent;padding:0;color:inherit;text-transform:uppercase;cursor:pointer;opacity:.23;transition:opacity .25s ease,transform .25s ease}.chapter-link:hover,.chapter-link.is-active{opacity:1}.chapter-link:hover{transform:translateX(2px)}
body[data-theme="paper"] .chapter-rail,body[data-theme="red"] .chapter-rail{color:var(--black);border-color:var(--line-dark)}body[data-theme="dark"] .chapter-rail{color:var(--paper);border-color:var(--line-light)}body[data-rail="minimal"] .chapter-nav{opacity:0;pointer-events:none}body[data-rail="minimal"] .chapter-rail{border-color:currentColor}body[data-theme="paper"] .rail-mark,body[data-theme="red"] .rail-mark{filter:none}body[data-theme="dark"] .rail-mark{filter:invert(91%) sepia(10%) saturate(214%) hue-rotate(8deg) brightness(96%)}
.screen-grid{position:absolute;inset:0 0 0 var(--rail-w);padding:clamp(62px,8vh,90px) var(--pad-x) clamp(66px,8vh,92px);display:grid}.start-layout{grid-template-columns:1fr 1.2fr;grid-template-rows:1fr auto;align-items:end}.intro-copy{align-self:start;margin:clamp(180px,26vh,300px) 0 0 0;max-width:clamp(300px,25vw,485px);font-size:var(--copy-small-size);line-height:var(--copy-small-line);font-weight:500}.section-number{position:absolute;right:clamp(110px,12vw,240px);top:clamp(-50px,-2vh,-10px);font-family:var(--font-head);font-weight:900;font-size:clamp(360px,39vw,760px);line-height:.82;color:transparent;-webkit-text-stroke:1.5px currentColor;opacity:.9;letter-spacing:-.08em;pointer-events:none}.section-title{font-family:var(--font-head);font-weight:900;font-size:clamp(60px,6.8vw,132px);line-height:.85;text-transform:uppercase;margin:0;letter-spacing:-.03em;align-self:end}.more-link{position:absolute;right:clamp(42px,4vw,72px);bottom:clamp(78px,9vh,98px);display:inline-flex;align-items:center;gap:.7em;border:0;background:transparent;color:inherit;font-size:clamp(12px,.75vw,14px);cursor:pointer}.more-link span,.slide-controls button{display:grid;place-items:center;width:clamp(22px,1.7vw,32px);height:clamp(22px,1.7vw,32px);border-radius:50%;background:var(--red);color:var(--black);font-size:1.25em;font-weight:800;line-height:1}.slide-controls{position:absolute;right:clamp(42px,4vw,72px);bottom:clamp(76px,8.8vh,98px);display:flex;gap:clamp(10px,.8vw,16px);z-index:5}.slide-controls button{border:0;cursor:pointer}.theme-paper .slide-controls button,.theme-dark .slide-controls button{color:var(--black)}
.cover-kicker{position:absolute;right:18.8vw;top:12.6vh;font-family:var(--font-head);font-size:clamp(24px,1.8vw,38px);font-weight:900;line-height:1.05;margin:0}.cover-wordmark{position:absolute;left:450px;top:450px;width:1170px;max-width:none;height:auto}.intro-slide{padding-left:var(--rail-w)}.intro-claim{position:absolute;left:calc(var(--rail-w) + 6.8vw);top:31vh;max-width:520px;font-family:var(--font-head);font-size:clamp(34px,3.2vw,62px);line-height:1.06;font-weight:900}.intro-text{position:absolute;left:calc(var(--rail-w) + 35vw);top:31vh;width:min(32vw,620px);font-family:var(--font-body);font-weight:500;font-size:var(--copy-small-size);line-height:var(--copy-small-line)}.intro-text p{margin:0 0 .8em}
.quote-layout{place-items:center}.quote-svg{width:min(64vw,1180px);max-height:48vh;object-fit:contain}.slide-quote .credit{position:absolute;left:calc(var(--rail-w) + var(--pad-x));bottom:clamp(68px,8vh,94px);margin:0;font-size:clamp(10px,.72vw,14px);line-height:1.35}.credit strong{font-weight:700}.credit span{opacity:.75}.text-layout{grid-template-columns:minmax(320px,38vw) 1fr;align-items:center;gap:clamp(54px,7vw,142px)}.content-copy{max-width:580px}.content-copy h2,.audio-copy h2,.more-coming h2,.thanks-layout h2{font-family:var(--font-head);font-size:clamp(42px,4.2vw,82px);font-weight:900;line-height:.9;text-transform:uppercase;margin:0 0 .7em}.content-copy p,.audio-copy p,.thanks-layout p,.caption{font-size:var(--copy-small-size);line-height:var(--copy-small-line);margin:0 0 1em}.slide-image{justify-self:end;align-self:start;max-width:100%;height:auto;object-fit:cover}.image-square{width:min(26vw,450px);aspect-ratio:1/1}.image-wide{width:min(48vw,720px)}.image-diagram{width:min(34vw,620px);align-self:center}.image-chart{width:min(34vw,660px);align-self:center}.image-top{margin-top:clamp(18px,3vh,40px)}.mini-archive{position:absolute;right:clamp(110px,12vw,220px);top:28vh;display:grid;grid-template-columns:repeat(3, minmax(100px,160px));gap:clamp(18px,2vw,36px)}.mini-archive img{width:100%;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.audio-layout{grid-template-columns:1fr 1.2fr;align-items:end}.audio-media{position:absolute;right:clamp(180px,19vw,360px);top:clamp(90px,10vh,120px);width:min(25vw,320px);margin:0}.audio-media img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}.audio-bar{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:10px}.audio-bar span{position:relative;height:1px;background:currentColor;flex:1}.audio-bar span::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;border:1px solid currentColor;border-radius:50%;background:transparent;transform:translateY(-50%)}.audio-copy{align-self:end;max-width:460px}.audio-copy .role{font-size:clamp(11px,.8vw,14px);opacity:.7;margin-top:-1.5em}.archive-grid-layout{place-items:center}.archive-grid{display:grid;gap:clamp(14px,1.2vw,24px);width:min(68vw,1120px)}.archive-grid img{width:100%;height:auto;display:block}.archive-count-6 .archive-grid{grid-template-columns:repeat(3,1fr);width:min(42vw,680px)}.archive-count-18 .archive-grid{grid-template-columns:repeat(6,1fr);width:min(54vw,900px)}.archive-count-31 .archive-grid{grid-template-columns:repeat(8,1fr);width:min(66vw,1120px)}.more-coming h2{align-self:end}.poster-gallery{place-items:center}.poster-row{display:flex;align-items:flex-start;justify-content:center;gap:clamp(26px,3vw,64px);width:min(60vw,980px)}.poster-row figure,.guerilla-gallery figure{margin:0;text-align:center;font-size:clamp(10px,.7vw,13px);font-weight:600}.poster-row img{height:min(54vh,560px);width:auto;object-fit:contain;display:block}.poster-row-main img{height:min(58vh,610px)}.poster-row.single img{height:min(62vh,650px)}.poster-gallery .caption{position:absolute;left:calc(var(--rail-w) + var(--pad-x));bottom:clamp(70px,8vh,90px);max-width:430px}.guerilla-gallery{grid-template-columns:repeat(3,auto);align-items:center;justify-content:center;gap:clamp(28px,3vw,70px)}.guerilla-gallery img{height:min(52vh,560px);width:auto;object-fit:contain}.guerilla-gallery figure:nth-child(2) img{height:min(16vh,150px)}.guerilla-gallery .caption{grid-column:1/-1;max-width:620px;margin-top:20px}.thanks-layout{align-content:center;justify-content:start}.thanks-layout h2{font-size:clamp(74px,7vw,136px)}.thanks-layout p{max-width:470px}.footer-slide::before,.cover-slide::before,.intro-slide::before{content:"";display:none}.footer-slide::after,.cover-slide::after,.intro-slide::after{content:"";position:absolute;left:0;right:0;top:450px;border-top:var(--grid-line) solid var(--black)}.footer-slide{font-family:var(--font-head);font-weight:800;color:var(--black)}.ig-link{position:absolute;right:17.4vw;top:39vh;color:inherit;text-decoration:none;font-size:clamp(48px,4.7vw,92px);line-height:.9}.footer-address{position:absolute;left:calc(var(--rail-w) + 6.8vw);bottom:12.8vh;display:flex;flex-direction:column;gap:.34em;font-style:normal;font-size:clamp(20px,1.65vw,32px);line-height:1.1}.footer-address a{color:inherit;text-decoration:none}.footer-address br{display:block;margin:1.2em 0}.footer-links{position:absolute;right:7vw;bottom:12vh;display:flex;flex-direction:column;gap:.3em;align-items:flex-end;font-size:clamp(22px,1.7vw,34px);line-height:1.1}.footer-links a{color:inherit;text-decoration:underline;text-underline-offset:.08em;text-decoration-thickness:1px}
@media (max-width: 900px){:root{--rail-w:0px;--pad-x:28px}body{overflow:auto}.chapter-rail{display:none}.matrix-viewport{overflow:hidden}.intro-text,.intro-claim,.cover-kicker,.cover-wordmark,.footer-address,.footer-links,.ig-link{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto}.cover-slide,.intro-slide,.footer-slide{display:grid;padding:40px 28px}.cover-wordmark{width:92vw;align-self:end}.cover-kicker{justify-self:end}.intro-claim{font-size:54px;margin-top:16vh}.intro-text{font-size:24px;margin-top:30px}.screen-grid{padding:40px 28px}.start-layout,.text-layout,.audio-layout{grid-template-columns:1fr}.section-number{font-size:260px;right:20px;top:20px}.quote-svg{width:85vw}.slide-controls,.more-link{right:28px}.mini-archive,.audio-media{position:relative;right:auto;top:auto;width:60vw}.archive-grid{width:84vw!important}.archive-count-18 .archive-grid,.archive-count-31 .archive-grid{grid-template-columns:repeat(3,1fr)}.poster-row{width:86vw;overflow:auto}.guerilla-gallery{grid-template-columns:1fr}.ig-link{font-size:48px}.footer-address{font-size:22px}.footer-links{align-items:flex-start;font-size:24px}}
@media (prefers-reduced-motion: reduce){.matrix-stage,.slide-track{transition:none}}


/* --- v5: Korrekturen nach Screendesign-Briefing --- */
:root{
  --grid-line:10px;
  --menu-size:45pt;
  --menu-line:70pt;
  --copy-small-size:25pt;
  --copy-small-line:30pt;
  --section-title-size:150pt;
  --section-title-left-global:600px;
}

/* Linkbare Bildmarke / Startseiten-Link */
.mark-home-link{color:inherit;text-decoration:none;cursor:pointer;}
.mark-home-link:focus-visible{outline:2px solid currentColor;outline-offset:-18px;}

/* Linke Matrix-Navigation */
.chapter-rail::after{top:450px;left:0;width:450px;right:auto;border-top-width:var(--grid-line);}
.chapter-nav{
  font-family:var(--font-head);
  font-size:var(--menu-size);
  line-height:var(--menu-line);
  letter-spacing:0;
}
.chapter-link{line-height:inherit;}

/* Einheitliche kleine Schrift */
.intro-copy,
.intro-text,
.content-copy p,
.audio-copy p,
.thanks-layout p,
.caption,
.slide-quote .credit,
.audio-copy .role,
.more-link,
.poster-row figure,
.guerilla-gallery figure,
.footer-address,
.footer-links{
  font-family:var(--font-body);
  font-size:var(--copy-small-size);
  line-height:var(--copy-small-line);
  letter-spacing:0;
  font-weight:500;
}
.slide-quote .credit strong{font-weight:700;}
.slide-quote .credit span{opacity:.78;}

/* Kapitelüberschriften */
.section-title{
  position:absolute;
  left:calc(var(--section-title-left-global) - var(--rail-w));
  bottom:clamp(66px,8vh,92px);
  font-family:var(--font-head);
  font-size:var(--section-title-size);
  line-height:.85;
  letter-spacing:0;
  font-weight:900;
}

/* Intro / Header */
.cover-kicker{
  left:1538.034px;
  right:auto;
  top:150.909px;
  font-family:var(--font-body);
  font-size:var(--copy-small-size);
  line-height:var(--copy-small-line);
  font-weight:500;
  letter-spacing:0;
}
.cover-wordmark{
  left:600px;
  top:450px;
  width:1170px;
}
.cover-slide::after,
.intro-slide::after,
.footer-slide::after{
  left:0;
  right:auto;
  width:450px;
  top:450px;
  border-top-width:var(--grid-line);
}
.intro-text{
  font-family:var(--font-body);
  font-size:var(--copy-small-size);
  line-height:var(--copy-small-line);
  font-weight:500;
}
.intro-claim{
  font-family:var(--font-head);
  font-size:40pt;
  line-height:50pt;
  font-weight:900;
  letter-spacing:0;
}

/* Footer */
.footer-slide{
  font-family:var(--font-body);
  font-weight:500;
  color:var(--black);
}
.ig-link{
  top:450px;
  transform:translateY(-50%);
  font-family:var(--font-head);
  font-size:clamp(48px,4.7vw,92px);
  line-height:.9;
  font-weight:900;
  text-decoration:none;
}
.footer-address,
.footer-links{
  font-family:var(--font-body);
  font-size:var(--copy-small-size);
  line-height:var(--copy-small-line);
  font-weight:500;
}
.footer-address a{color:inherit;text-decoration:none;}
.footer-links a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:.08em;
  text-decoration-thickness:1px;
}

@media (max-width: 900px){
  .cover-kicker,.cover-wordmark{left:auto;top:auto;}
  .cover-wordmark{width:92vw;}
  .section-title{position:relative;left:auto;bottom:auto;font-size:clamp(70px,18vw,150px);}
  .chapter-nav{font-size:28px;line-height:1.25;}
}


/* --- v6: responsive font system + SVG diagram --- */
:root{
  --font-head:'Big Shoulders Display', Impact, sans-serif;
  --font-body:'Inter', Arial, sans-serif;
  --fs-copy:clamp(16px, 1.736vw, 33.333px); /* 1em, ca. 25pt bei 1920px Breite */
  --lh-copy:1.2;
  --fs-h1:4em;
  --fs-h2:2em;
}

html{font-size:var(--fs-copy);}
body{
  font-family:var(--font-body);
  font-size:1rem;
  line-height:var(--lh-copy);
  font-weight:400;
}

/* Copy: überall Inter Regular, 1em */
p,
a,
button,
figcaption,
time,
.intro-copy,
.intro-text,
.cover-kicker,
.content-copy p,
.audio-copy p,
.thanks-layout p,
.caption,
.slide-quote .credit,
.audio-copy .role,
.more-link,
.poster-row figure,
.guerilla-gallery figure,
.footer-address,
.footer-links{
  font-family:var(--font-body);
  font-size:1em;
  line-height:var(--lh-copy);
  font-weight:400;
  letter-spacing:0;
}

/* H1: Kapitelüberschriften */
h1,
.section-title{
  font-family:var(--font-head);
  font-size:var(--fs-h1);
  line-height:.86;
  font-weight:800;
  letter-spacing:0;
  text-transform:uppercase;
}

/* H2: Menü + Kapitel-Headlines */
h2,
.content-copy h2,
.audio-copy h2,
.more-coming h2,
.chapter-nav,
.chapter-link{
  font-family:var(--font-head);
  font-size:var(--fs-h2);
  font-weight:800;
  letter-spacing:0;
  text-transform:uppercase;
}
.content-copy h2,
.audio-copy h2,
.more-coming h2{
  line-height:.9;
}
.chapter-nav,
.chapter-link{
  line-height:1.05;
}

/* Headline-Sonderfälle bewusst am neuen System ausgerichtet */
.intro-claim{
  font-family:var(--font-head);
  font-size:var(--fs-h2);
  line-height:1.08;
  font-weight:800;
  letter-spacing:0;
}
.thanks-layout h2{
  font-family:var(--font-head);
  font-size:var(--fs-h1);
  line-height:.86;
  font-weight:800;
  letter-spacing:0;
}

/* SVG-Diagramm als echtes SVG-Asset eingebunden */
.diagram-svg{
  display:block;
  border:0;
  width:min(34vw,620px);
  max-width:100%;
  aspect-ratio:1/1;
}

/* Kleine UI-Elemente proportional zum neuen Typo-System */
.more-link span,
.slide-controls button{
  width:1.15em;
  height:1.15em;
  font-size:1em;
  line-height:1;
}
.audio-bar{font-size:.42em;}

@media (max-width: 900px){
  :root{--fs-copy:clamp(16px, 4.4vw, 24px);}
  .chapter-nav,.chapter-link{font-size:1em;line-height:1.25;}
  .intro-claim{font-size:2.2em;}
}

/* ==========================================================================
   v7 – Responsive-Overhaul (konsolidiert)
   --------------------------------------------------------------------------
   Die v4–v6-Patches oben enthalten mehrere, sich teils widersprechende
   @media(max-width:900px)-Blöcke. Dadurch werden auf Smartphones/Tablets
   u. a. Kapitelüberschriften, Footer-Adresse und Navigation aus dem
   sichtbaren Bereich geschoben (siehe Prüfbericht).

   Dieser Block bündelt den Mobile-/Tablet-Fix an einer Stelle und gewinnt
   dank Position am Dateiende + gleicher/höherer Selektor-Spezifität
   zuverlässig gegen die älteren Regeln.

   Strategie ab 900px Breite:
   Das "Slide-Deck" (100vh/100vw-Screens, gesteuert per Wheel/Touch) wird zu
   einem klassischen, vertikal scrollbaren Ein-Spalten-Layout. Alle Kapitel
   und Slides erscheinen nacheinander untereinander – das ist auf variablen,
   oft sehr unterschiedlich hohen Mobile-Viewports die robusteste Lösung und
   verhindert, dass Inhalte durch feste 100vh-Boxen abgeschnitten werden.
   ========================================================================== */

/* Hamburger-Button nur auf Mobile/Tablet sichtbar */
.nav-toggle{display:none}

/* Layout-Verschiebungen durch lazy-loading Bilder vermeiden: echte
   Seitenverhältnisse reservieren, bevor das Bild geladen ist. Wichtig vor
   allem im mobilen Scroll-Modus, da sonst Klicks auf die Kapitelnavigation
   an der falschen Stelle landen können (Höhe verändert sich nachträglich). */
.archive-grid img,.mini-archive img,.poster-row img{aspect-ratio:0.707}
.guerilla-gallery figure:nth-child(1) img{aspect-ratio:.366}
.guerilla-gallery figure:nth-child(2) img{aspect-ratio:1}
.guerilla-gallery figure:nth-child(3) img{aspect-ratio:.682}
.audio-media img{aspect-ratio:1}
img[src*="foto-communitas"]{aspect-ratio:2.936}
img[src*="foto-unesco"]{aspect-ratio:2.4}
img[src*="foto-lauerm"]{aspect-ratio:1.778}

@media (max-width: 900px){

  /* --- Grundgerüst: echtes Scrollen erlauben --------------------------- */
  html{height:auto;overflow-y:auto;overflow-x:hidden}
  body{height:auto;overflow:visible;overflow-x:hidden}
  .site-shell{height:auto;overflow:visible}
  .matrix-viewport{height:auto;overflow:visible;padding-top:64px}
  .matrix-stage{height:auto;transform:none!important}
  .matrix-section{position:relative;height:auto;min-height:100vh;width:100%;
    overflow:visible;scroll-margin-top:64px}
  .slide-track{display:flex;flex-direction:column;height:auto;transform:none!important}
  .slide{flex:0 0 auto;width:100%;height:auto;min-height:100vh;
    overflow:visible;scroll-margin-top:64px}

  @media (prefers-reduced-motion: no-preference){ html{scroll-behavior:smooth} }

  /* Deko-Hintergründe sollen bei variabler Höhe nicht abreißen */
  .theme-red.cover-section,.theme-red.intro-section,.theme-red.footer-section{
    background-size:cover;background-position:center;
  }

  /* --- Navigation: schmale Top-Bar + Vollbild-Menü --------------------- */
  :root{--rail-w:0px}

  .chapter-rail{
    position:fixed;top:0;left:0;right:0;bottom:auto;height:64px;width:100%;
    display:flex;align-items:center;justify-content:space-between;
    padding:0 18px;z-index:100;border:0;
  }
  .chapter-rail::before,.chapter-rail::after{content:none}
  body[data-theme="paper"] .chapter-rail,
  body[data-theme="red"] .chapter-rail{background:var(--paper);color:var(--black)}
  body[data-theme="dark"] .chapter-rail{background:var(--black);color:var(--paper)}

  .mark-box{height:38px;width:38px}
  .rail-mark{width:38px;height:38px}
  body[data-theme="dark"] .rail-mark{filter:invert(91%) sepia(10%) saturate(214%) hue-rotate(8deg) brightness(96%)}
  body[data-theme="paper"] .rail-mark,body[data-theme="red"] .rail-mark{filter:none}

  .nav-toggle{
    display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:34px;height:34px;border:0;background:transparent;cursor:pointer;padding:0;
  }
  .nav-toggle span{display:block;height:2px;width:100%;background:currentColor;
    transition:transform .25s ease,opacity .25s ease}
  .chapter-rail.is-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .chapter-rail.is-open .nav-toggle span:nth-child(2){opacity:0}
  .chapter-rail.is-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .chapter-nav{
    position:fixed;top:64px;left:0;right:0;bottom:0;
    background:inherit;color:inherit;
    display:flex;align-items:center;justify-content:center;
    transform:translateY(-8px);opacity:0;pointer-events:none;
    transition:opacity .25s ease,transform .25s ease;z-index:99;
  }
  .chapter-rail.is-open .chapter-nav{opacity:1;pointer-events:auto;transform:translateY(0)}
  .chapter-nav ol{padding:0;margin:0;text-align:center;list-style:none}
  .chapter-nav li{margin:.55em 0}
  .chapter-link{opacity:.55}
  .chapter-link.is-active,.chapter-link:hover{opacity:1}

  /* --- Gemeinsamer Inhaltsrahmen: eine mittig zentrierte Spalte -------- */
  .screen-grid{
    position:relative;inset:auto;
    display:flex;flex-direction:column;justify-content:center;
    width:100%;max-width:640px;margin:0 auto;
    min-height:calc(100vh - 64px);
    padding:48px 24px 64px;gap:1.3em;
  }

  /* Slide-Controls & "mehr erfahren" sind im Scroll-Modus überflüssig */
  .slide-controls,.more-link{display:none}

  /* --- Cover / Intro / Footer ------------------------------------------ */
  .cover-slide,.intro-slide,.footer-slide{
    display:flex;flex-direction:column;justify-content:center;
    width:100%;max-width:640px;margin:0 auto;
    min-height:100vh;padding:88px 24px 64px;gap:1.1em;
  }
  .cover-kicker,.cover-wordmark,.intro-claim,.intro-text,
  .footer-address,.footer-links,.ig-link{
    position:relative;left:auto;right:auto;top:auto;bottom:auto;
    width:100%;max-width:none;transform:none;margin:0;
  }
  .cover-wordmark{max-width:420px;height:auto}
  .intro-claim{font-size:2.1em;line-height:1.14}
  .intro-text p{margin:0 0 .8em}
  .footer-slide::after,.cover-slide::after,.intro-slide::after{content:none}
  .ig-link{font-size:2.3em}
  .footer-address,.footer-links{gap:.5em}
  .footer-links{align-items:flex-start}

  /* --- Kapitel-Start-Slide ----------------------------------------------- */
  .start-layout{display:flex;flex-direction:column}
  .intro-copy{margin:0;max-width:none;width:100%}
  .section-number{
    position:relative;inset:auto;right:auto;top:auto;
    font-size:5em;opacity:.32;line-height:.8;margin:.1em 0 -.15em;
  }
  .section-title{width:100%;font-size:2.5em;margin:0}

  /* --- Zitat-Slide --------------------------------------------------------- */
  .quote-svg{width:100%;max-width:420px;max-height:none;margin:0 auto;display:block}
  .slide-quote .credit{position:relative;left:auto;bottom:auto;margin-top:1.3em;
    width:100%;text-align:center}

  /* --- Text + Bild ----------------------------------------------------------- */
  .text-layout{display:flex;flex-direction:column;gap:1.5em}
  .content-copy{max-width:none;width:100%}
  .slide-image{justify-self:auto;align-self:auto;
    width:100%!important;max-width:380px;height:auto;
    margin:0 auto;display:block}
  .image-square{aspect-ratio:1/1}
  .diagram-svg{width:100%;max-width:320px;margin:0 auto}

  /* --- Audio-Slide -------------------------------------------------------------- */
  .audio-layout{display:flex;flex-direction:column;gap:1.3em}
  .audio-media{position:relative;right:auto;top:auto;
    width:100%;max-width:280px;margin:0 auto}
  .audio-copy{max-width:none;width:100%}
  .audio-copy .role{margin-top:0}

  /* --- Mini-Vorschau in "Gegen das Vergessen" ------------------------------------ */
  .mini-archive{position:relative;right:auto;top:auto;
    width:100%;max-width:420px;margin:0 auto;
    grid-template-columns:repeat(3,1fr)}

  /* --- Archiv-Grid ----------------------------------------------------------------- */
  .archive-grid-layout{display:flex;justify-content:center}
  .archive-count-6 .archive-grid,
  .archive-count-18 .archive-grid,
  .archive-count-31 .archive-grid{
    grid-template-columns:repeat(3,1fr);width:100%!important;
    max-width:480px;margin:0 auto;
  }

  /* --- Plakat- / Sticker-Galerien --------------------------------------------------- */
  .poster-gallery{display:flex;flex-direction:column;align-items:center}
  .poster-row{width:100%;flex-wrap:wrap;overflow:visible;justify-content:center}
  /* feste Flex-Basis statt "auto": verhindert Sprung beim Nachladen der
     lazy Bilder (sonst hängt die Breite der Figure vom Bildinhalt ab) */
  .poster-row figure{flex:1 1 140px;max-width:150px;margin:0}
  .poster-row.single figure{flex:1 1 260px;max-width:340px}
  .poster-row img{width:100%;height:auto;max-width:none}
  .poster-gallery .caption{position:relative;left:auto;bottom:auto;
    width:100%;max-width:none;margin-top:1.2em}
  .guerilla-gallery{grid-template-columns:1fr;justify-items:stretch;gap:1.4em}
  .guerilla-gallery figure{width:100%;max-width:260px;margin:0 auto}
  .guerilla-gallery img{width:100%;height:auto;max-width:none}
  .guerilla-gallery figure:nth-child(2){max-width:140px}
  .guerilla-gallery .caption{width:100%;margin-top:.8em}

  /* --- Danke-Slide ------------------------------------------------------------------- */
  .thanks-layout h2{font-size:2.4em}
  .thanks-layout p{max-width:none;width:100%}
}

/* Sehr kleine Displays: zusätzlicher Feinschliff */
@media (max-width: 420px){
  .screen-grid,.cover-slide,.intro-slide,.footer-slide{padding-left:18px;padding-right:18px}
  .section-title{font-size:2.1em}
  .intro-claim{font-size:1.7em}
  .ig-link{font-size:1.9em}
}

/* ==========================================================================
   v8 – Menüführung + fluide Skalierung von Logo & Positionsankern
   --------------------------------------------------------------------------
   Abgleich mit den mitgelieferten Screendesign-Vorlagen (1920×1080,
   Referenz "fürchatty") ergab zwei Korrekturen:

   1) BUG in v6: ".chapter-nav,.chapter-link{font-size:var(--fs-h2)}" setzt
      2em auf BEIDE Elemente gleichzeitig. Da .chapter-link (button) sein
      2em relativ zu .chapter-nav berechnet – und dessen font-size selbst
      bereits 2em seines Elternelements ist – verdoppelt sich die Menüschrift
      effektiv (gemessen: 133px statt korrekt ~67px bei 1920px Breite).
      Fix: .chapter-nav bekommt wieder eine neutrale Basisgröße; die
      Kapitel-Buttons erhalten ihre Größe direkt und unabhängig.

   2) Referenzdesign: der aktive Kapitel-Eintrag ist sichtbar größer als die
      inaktiven (gemessen ~1,33×, nicht nur heller/deckender). Das fehlte
      bisher komplett – alle Einträge waren gleich groß.

   3) Logo (.rail-mark) und mehrere 1920px-native Positionsanker (Cover-
      Wortmarke, -Kicker, Footer-IG-Link, Kapitelüberschrift) waren als feste
      Pixelwerte codiert und skalierten zwischen der Mobile-Grenze (900px)
      und 1920px Referenzbreite nicht mit – auf schmaleren Laptop-Fenstern
      wirkt das Logo dadurch überdimensioniert. Fix: fluide clamp()-Werte,
      verankert an den nativen Screendesign-Maßen.
   ========================================================================== */

/* --- Menüführung: Compounding-Bug fixen + aktives Kapitel vergrößern ---- */
.chapter-nav{font-size:1em}
.chapter-link{
  font-size:1.5em;
  transition:opacity .25s ease,font-size .25s ease,transform .25s ease;
}
.chapter-link.is-active{font-size:2em}
.chapter-nav ol{line-height:1.3}

@media (min-width: 901px){
  :root{
    /* Fluide Entsprechungen der nativen Screendesign-Werte (bei 1920px
       Referenzbreite = rechter Klammerwert). Untergrenze bei ~901px, damit
       am Übergang zur Mobile-Ansicht kein Sprung entsteht. */
    --rail-w: clamp(211px, 23.4375vw, 450px);
    --rail-mark-size: clamp(211px, 23.4375vw, 450px);
    --section-title-left-global: clamp(282px, 31.25vw, 600px);
    --wordmark-w: clamp(549px, 60.9375vw, 1170px);
    --kicker-left: clamp(722px, 80.11vw, 1538px);
    --kicker-top: clamp(71px, 7.86vw, 151px);
  }

  /* Logo: fluid statt fest 450×450px */
  .mark-box{height:var(--rail-mark-size);width:var(--rail-mark-size)}
  .rail-mark{width:var(--rail-mark-size);height:var(--rail-mark-size)}
  .chapter-rail::after{top:var(--rail-mark-size)}

  /* Positionsanker, die bislang absolut auf 450/1170/1538/151px standen */
  .cover-wordmark{left:var(--rail-mark-size);top:var(--rail-mark-size);width:var(--wordmark-w)}
  .cover-kicker{left:var(--kicker-left);top:var(--kicker-top);right:auto}
  .ig-link{top:var(--rail-mark-size)}
  .cover-slide::after,.intro-slide::after,.footer-slide::after{top:var(--rail-mark-size)}
}


/* ==========================================================================
   v9 – requested layout corrections
   ========================================================================== */
:root{
  --copy-scale:.5;
  --layout-bottom:clamp(66px,8vh,92px);
}

/* Copy 50 % smaller, without shrinking menu or headings. */
.intro-copy,
.intro-text,
.cover-kicker,
.content-copy p,
.audio-copy p,
.thanks-layout p,
.caption,
.slide-quote .credit,
.audio-copy .role,
.poster-row figure,
.guerilla-gallery figure,
.footer-address,
.footer-links{
  font-size:calc(1em * var(--copy-scale));
}

/* Copy blocks sit on the lower layout margin. */
@media (min-width:901px){
  .start-layout .intro-copy{
    position:absolute;
    left:var(--pad-x);
    bottom:var(--layout-bottom);
    margin:0;
    align-self:auto;
  }
  .intro-text{
    top:auto;
    bottom:var(--layout-bottom);
  }
  .content-copy,
  .audio-copy{
    align-self:end;
  }

  /* The JS writes the active navigation item's viewport y-position here. */
  .section-title{
    top:var(--chapter-title-y,auto);
    bottom:auto;
  }
}

/* Menu line spacing +15 %. */
.chapter-link{line-height:1.2075;}
.chapter-nav ol{line-height:1.495;}

/* Images keep their intrinsic proportions and natural CSS size. They are
   only scaled down when the available viewport is smaller; never cropped or
   enlarged by fixed image classes. */
.slide-image,
.quote-svg,
.image-square,
.image-wide,
.image-diagram,
.image-chart,
.diagram-svg{
  width:auto!important;
  height:auto!important;
  max-width:min(100%, calc(100vw - var(--rail-w) - (2 * var(--pad-x))));
  max-height:calc(100vh - (2 * var(--layout-bottom)));
  aspect-ratio:auto!important;
  object-fit:contain!important;
}
.audio-media{
  width:450px;
  max-width:min(450px, calc(100vw - var(--rail-w) - (2 * var(--pad-x))));
}
.audio-media img,
.archive-grid img,
.mini-archive img,
.poster-row img,
.guerilla-gallery img{
  width:auto;
  height:auto;
  max-width:100%;
  object-fit:contain;
}
.poster-row figure{min-width:0;flex:1 1 0;}
.poster-row.single figure{flex:0 1 auto;}
.poster-row img,
.poster-row-main img,
.poster-row.single img,
.guerilla-gallery img,
.guerilla-gallery figure:nth-child(2) img{
  height:auto;
  max-height:calc(100vh - (2 * var(--layout-bottom)));
}

/* Chapter-end navigation mirrors “mehr erfahren” and returns to slide 1. */
.back-link{
  position:absolute;
  right:clamp(42px,4vw,72px);
  bottom:clamp(78px,9vh,98px);
  display:inline-flex;
  align-items:center;
  gap:.7em;
  border:0;
  background:transparent;
  color:inherit;
  font-family:var(--font-body);
  font-size:1em;
  line-height:var(--lh-copy);
  font-weight:400;
  cursor:pointer;
  z-index:6;
}
.back-link span{
  display:grid;
  place-items:center;
  width:1.15em;
  height:1.15em;
  border-radius:50%;
  background:var(--red);
  color:var(--black);
  font-size:1em;
  line-height:1;
  font-weight:800;
}

@media (max-width:900px){
  /* Keep the mobile reading size usable; the 50 % correction targets the
     supplied 1920×1080 matrix design. */
  .intro-copy,
  .intro-text,
  .cover-kicker,
  .content-copy p,
  .audio-copy p,
  .thanks-layout p,
  .caption,
  .slide-quote .credit,
  .audio-copy .role,
  .poster-row figure,
  .guerilla-gallery figure,
  .footer-address,
  .footer-links{font-size:.75em;}

  .section-title{top:auto!important;}
  .back-link{display:none;}
  .slide-image,
  .image-square,
  .image-wide,
  .image-diagram,
  .image-chart,
  .diagram-svg{
    width:auto!important;
    max-width:100%;
    max-height:none;
  }
  .audio-media{width:100%;max-width:450px;}
}

/* Final v9 refinements: natural desktop width for supplied slide images and
   lower-margin placement for the final acknowledgement copy. */
@media (min-width:901px){
  .slide-image{max-width:none;}
  .image-diagram,
  .diagram-svg,
  .image-chart{
    max-width:calc(100vw - var(--rail-w) - (2 * var(--pad-x)));
  }
  .thanks-layout p{
    position:absolute;
    left:var(--pad-x);
    bottom:var(--layout-bottom);
    margin:0;
  }
}
@media (max-width:900px){
  .chapter-link{line-height:1.4375;}
}

/* ========================================================================== 
   v10 – Trennmarker-System, Typo-Finetuning und Kapitel-01-Layout
   ========================================================================== */
:root{
  --copy-scale:.575;                 /* v9 × 1.15 */
  --copy-leading:1.56;               /* 1.2 × 1.30 */
  --layout-bottom:clamp(66px,8vh,92px);
  --marker-y:var(--rail-mark-size,450px);
  --content-left:calc(var(--rail-w) + var(--pad-x));
  --copy-bg-pad:.28em;
  --intro-copy-width:clamp(250px,20vw,388px);
  --body-copy-width:clamp(280px,24.2vw,464px);
  --audio-copy-width:clamp(260px,19.2vw,368px);
  --active-menu-y:50vh;
  --intro-claim-top:250px;
}

/* Copy system: 15% larger than v9, with 30% more leading. */
.intro-copy,
.intro-text,
.cover-kicker,
.content-copy p,
.audio-copy p,
.thanks-layout p,
.caption,
.slide-quote .credit,
.audio-copy .role,
.poster-row figure,
.guerilla-gallery figure,
.footer-address,
.footer-links{
  font-size:calc(1em * var(--copy-scale));
  line-height:var(--copy-leading);
}

/* Copy columns are 20% narrower than the previous layout. */
.start-layout .intro-copy{max-width:var(--intro-copy-width);width:var(--intro-copy-width)}
.copy-body{width:var(--body-copy-width);max-width:var(--body-copy-width)}
.audio-copy{max-width:var(--audio-copy-width);width:var(--audio-copy-width)}
.thanks-layout p{max-width:clamp(280px,19.6vw,376px)}
.poster-gallery .caption{max-width:clamp(260px,17.9vw,344px)}

/* Menu leading +20% compared with v9. */
.chapter-link{line-height:1.449}
.chapter-nav ol{line-height:1.794}
.chapter-nav li + li{margin-top:.18em}

/* The marker always ends exactly at the vertical divider. */
.chapter-rail::after{
  left:0;
  right:0;
  width:100%;
  max-width:100%;
  top:var(--marker-y);
}
.cover-slide::after,
.intro-slide::after,
.footer-slide::after{display:none!important;content:none!important}

/* Chapter start slides: copy ends at the marker; title stays at layout bottom. */
@media (min-width:901px){
  .start-layout .intro-copy{
    position:absolute;
    left:var(--pad-x);
    top:auto;
    bottom:calc(100vh - var(--marker-y) - var(--copy-bg-pad));
    margin:0;
    padding:var(--copy-bg-pad);
    z-index:3;
  }
  .theme-dark .start-layout .intro-copy{background:var(--black)}
  .theme-paper .start-layout .intro-copy{background:var(--paper)}
  .theme-red .start-layout .intro-copy{background:var(--red)}
  .section-number{z-index:1}
  .section-title{
    top:auto!important;
    bottom:var(--layout-bottom)!important;
    z-index:3;
  }
}

/* Cover: wordmark fills the complete area from marker to viewport bottom. */
@media (min-width:901px){
  .cover-wordmark{
    left:var(--content-left);
    top:auto;
    bottom:0;
    width:auto;
    height:calc(100vh - var(--marker-y));
    max-width:calc(100vw - var(--content-left));
    object-fit:contain;
    object-position:left bottom;
  }
  .cover-kicker{
    left:auto;
    right:13.8vw;
    top:var(--kicker-top);
  }
}

/* Intro: fixed three-line claim ending on the marker; copy begins at its top. */
@media (min-width:901px){
  .intro-claim{
    left:var(--content-left);
    top:auto;
    bottom:calc(100vh - var(--marker-y));
    width:min(34vw,650px);
    max-width:none;
    margin:0;
  }
  .intro-text{
    left:calc(var(--content-left) + min(35vw,672px));
    top:var(--intro-claim-top);
    bottom:auto;
    width:clamp(220px,12vw,250px);
    max-width:none;
    margin:0;
    hyphens:auto;
    -webkit-hyphens:auto;
    overflow-wrap:normal;
  }
  .intro-text p{margin:0 0 .72em}
}

/* Content headlines align with the active menu item; body copy remains at the
   lower layout margin and can stay narrow without constraining the headline. */
@media (min-width:901px){
  .content-copy{position:absolute;inset:0;max-width:none;width:auto;pointer-events:none}
  .content-copy h2{
    position:absolute;
    left:var(--pad-x);
    top:var(--active-menu-y);
    width:max-content;
    max-width:calc(100vw - var(--rail-w) - (2 * var(--pad-x)));
    margin:0;
    white-space:nowrap;
    z-index:4;
    pointer-events:auto;
  }
  .content-copy .copy-body{
    position:absolute;
    left:var(--pad-x);
    bottom:var(--layout-bottom);
    z-index:4;
    pointer-events:auto;
  }
  .content-copy .copy-body p:last-child{margin-bottom:0}
}

/* Supplied arrow assets and button typography. */
.more-link,
.back-link{
  display:inline-flex;
  align-items:center;
  gap:.55em;
  border:0;
  background:transparent;
  color:inherit;
  font-family:var(--font-body);
  font-size:calc(1em * var(--copy-scale));
  line-height:var(--copy-leading);
  font-weight:700;
  cursor:pointer;
}
.button-label{font:inherit;font-weight:700;white-space:nowrap}
.nav-icon{display:block;width:1.15em;height:1.15em;object-fit:contain;flex:0 0 auto}
.icon-light{display:none}
.theme-dark .icon-dark{display:none}
.theme-dark .icon-light{display:block}
.slide-controls button,
.more-link .nav-icon,
.back-link .nav-icon{
  border-radius:0;
  background:transparent;
  color:inherit;
}
.slide-controls button{
  display:grid;
  place-items:center;
  width:auto;
  height:auto;
  padding:0;
  font-size:1em;
}
.slide-controls .nav-icon{width:1.15em;height:1.15em}
.back-link .button-label{order:2}
.back-link .nav-icon{order:1}

/* Chapter 01: use the supplied diagram and exact top-edge image anchors. */
@media (min-width:901px){
  .third-place-diagram{
    position:absolute;
    top:0;
    right:0;
    width:679.355px!important;
    height:auto!important;
    max-width:calc(100vw - var(--content-left));
    max-height:100vh;
    margin:0;
    z-index:2;
  }
  .image-top-edge-right{
    position:absolute;
    top:0;
    right:var(--pad-x);
    margin:0;
    z-index:2;
  }
  .image-top-edge-left{
    position:absolute;
    top:0;
    left:var(--pad-x);
    margin:0;
    z-index:2;
  }
}

/* Responsive analogue: retain the same hierarchy while allowing natural
   vertical scrolling on tablets and phones. */
@media (max-width:900px){
  :root{
    --copy-scale:.8625;              /* mobile v9 × 1.15 */
    --mobile-marker-y:42svh;
    --copy-bg-pad:.28em;
  }
  .intro-copy,
  .intro-text,
  .cover-kicker,
  .content-copy p,
  .audio-copy p,
  .thanks-layout p,
  .caption,
  .slide-quote .credit,
  .audio-copy .role,
  .poster-row figure,
  .guerilla-gallery figure,
  .footer-address,
  .footer-links{
    font-size:calc(1em * var(--copy-scale));
    line-height:var(--copy-leading);
  }
  .chapter-link{line-height:1.725}
  .chapter-nav li{margin:.66em 0}

  .slide-start{min-height:calc(100svh - 64px)}
  .slide-start .start-layout{
    position:relative;
    display:block;
    min-height:calc(100svh - 64px);
    padding-top:32px;
    padding-bottom:56px;
  }
  .slide-start .intro-copy{
    position:absolute;
    left:24px;
    top:auto;
    bottom:calc(100svh - 64px - var(--mobile-marker-y) - var(--copy-bg-pad));
    width:min(72vw,320px);
    max-width:min(72vw,320px);
    margin:0;
    padding:var(--copy-bg-pad);
    z-index:3;
  }
  .theme-dark .slide-start .intro-copy{background:var(--black)}
  .theme-paper .slide-start .intro-copy{background:var(--paper)}
  .theme-red .slide-start .intro-copy{background:var(--red)}
  .slide-start .section-number{position:absolute;right:18px;top:28px;z-index:1}
  .slide-start .section-title{
    position:absolute;
    left:24px;
    right:24px;
    bottom:56px;
    width:auto;
    margin:0;
    z-index:3;
  }

  .cover-slide{position:relative;display:block;min-height:calc(100svh - 64px);padding:0}
  .cover-wordmark{
    position:absolute;
    left:24px;
    bottom:0;
    width:auto;
    height:calc(100svh - 64px - var(--mobile-marker-y));
    max-width:calc(100vw - 48px);
    object-fit:contain;
    object-position:left bottom;
  }
  .cover-kicker{position:absolute;right:7vw;left:auto;top:8svh;width:auto}

  .intro-slide{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(180px,.75fr);align-items:start;column-gap:28px;min-height:calc(100svh - 64px);padding:48px 24px 64px}
  .intro-claim{position:relative;width:100%;font-size:2em;line-height:1.08;margin:0}
  .intro-text{position:relative;width:100%;max-width:250px;margin:0;hyphens:auto;-webkit-hyphens:auto}

  .content-copy{position:relative;inset:auto;display:block;width:100%;max-width:none;pointer-events:auto}
  .content-copy h2{position:relative;left:auto;top:auto;width:100%;max-width:none;white-space:nowrap;margin:0 0 .7em}
  .content-copy .copy-body{position:relative;left:auto;bottom:auto;width:80%;max-width:80%}

  .third-place-diagram,
  .image-top-edge-right,
  .image-top-edge-left{
    position:relative;
    inset:auto;
    order:-1;
    width:auto!important;
    max-width:100%;
    height:auto!important;
    margin:0 auto 1.2em;
  }
  .third-place-diagram{width:100%!important;max-width:679px}

  .more-link,.back-link{font-size:calc(1em * var(--copy-scale));line-height:var(--copy-leading);font-weight:700}
}

@media (max-width:600px){
  .intro-slide{display:flex;flex-direction:column;gap:1.4em}
  .intro-claim{font-size:1.72em}
  .intro-text{max-width:80%;width:80%}
  .content-copy h2{white-space:normal}
  .content-copy .copy-body{width:80%;max-width:80%}
}

/* v10.1 – measured alignment refinements */
:root{--copy-bg-pad:.05em}

@media (min-width:901px){
  .cover-kicker{
    left:calc(var(--kicker-left) + 5vw);
    right:auto;
  }
  .intro-claim{
    width:max-content;
    max-width:calc(100vw - var(--content-left) - var(--pad-x));
    white-space:nowrap;
  }
  .intro-text{width:clamp(240px,13.5vw,270px)}

  /* Override the earlier grid-item end alignment, which otherwise shifts
     the absolute content-copy containing block down by one viewport. */
  .content-copy{
    top:0;
    right:0;
    bottom:0;
    left:0;
    height:auto;
    align-self:stretch!important;
    justify-self:stretch!important;
  }
}

.more-link .button-label,
.back-link .button-label{
  display:inline;
  width:auto;
  height:auto;
  padding:0;
  border-radius:0;
  background:transparent;
  color:inherit;
  font-size:inherit;
  line-height:inherit;
  place-items:initial;
}

@media (max-width:900px){
  .back-link{
    display:inline-flex;
    position:relative;
    right:auto;
    bottom:auto;
    align-self:flex-end;
    margin-top:1em;
  }
}

/* v10.2 – Intro collision guard at desktop widths */
@media (min-width:901px){
  .intro-claim{
    font-size:clamp(40px,2.778vw,53.333px);
    line-height:1.25;
  }
  .intro-text{
    left:auto;
    right:var(--pad-x);
  }
}

/* v10.3 – Intended intro line endings with enough height reserve. */
@media (min-width:901px){
  .intro-text{width:clamp(270px,15.625vw,300px)}
}

/* ========================================================================== 
   v11 – responsive menu fit, wider copy columns and control refinement
   ========================================================================== */
:root{
  /* v10 menu leading minus 10%; JS scales both values together whenever the
     available area between marker and bottom margin is smaller. */
  --menu-max-size:60px;
  --menu-line-ratio:1.3041;
  --menu-fit-size:var(--menu-max-size);
  --menu-fit-line:calc(var(--menu-fit-size) * var(--menu-line-ratio));
  --layout-top:clamp(62px,8vh,90px);

  /* v10 copy columns × 1.30 */
  --intro-copy-width:clamp(325px,26vw,504px);
  --body-copy-width:clamp(364px,31.46vw,603px);
  --audio-copy-width:clamp(338px,25vw,478px);
  --control-circle-size:1.85em;
  --wordmark-aspect:1.84937;
}

/* Menu: last item shares the lower layout margin with the body copy. */
@media (min-width:901px){
  .chapter-nav{
    bottom:var(--layout-bottom)!important;
    font-size:var(--menu-fit-size)!important;
    line-height:var(--menu-fit-line)!important;
  }
  .chapter-nav ol{
    display:flex;
    flex-direction:column;
    margin:0;
    padding:0;
    line-height:normal!important;
  }
  .chapter-nav li,
  .chapter-nav li + li{
    height:var(--menu-fit-line);
    margin:0!important;
  }
  .chapter-link{
    display:block;
    height:var(--menu-fit-line);
    font-size:inherit!important;
    line-height:var(--menu-fit-line)!important;
  }
}

/* Natural word wrapping only: no browser hyphenation or manual split logic. */
.intro-copy,
.intro-text,
.copy-body,
.copy-body p,
.audio-copy,
.audio-copy p,
.thanks-layout p,
.caption{
  -webkit-hyphens:none!important;
  hyphens:none!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}

/* Copy columns widened by 30%. */
.start-layout .intro-copy{
  width:var(--intro-copy-width)!important;
  max-width:var(--intro-copy-width)!important;
}
.content-copy .copy-body{
  width:var(--body-copy-width)!important;
  max-width:var(--body-copy-width)!important;
}
.audio-copy{
  width:var(--audio-copy-width)!important;
  max-width:var(--audio-copy-width)!important;
}
.thanks-layout p{max-width:clamp(364px,25.5vw,489px)!important}
.poster-gallery .caption{max-width:clamp(338px,23.3vw,447px)!important}

/* Button labels return to the regular copy weight. */
.more-link,
.back-link,
.button-label{
  font-weight:400!important;
}

/* Red circles behind every directional SVG. */
.more-link .nav-icon,
.back-link .nav-icon{
  width:var(--control-circle-size)!important;
  height:var(--control-circle-size)!important;
  padding:.34em;
  border-radius:50%!important;
  background:var(--red)!important;
  object-fit:contain;
}
.slide-controls button{
  width:var(--control-circle-size)!important;
  height:var(--control-circle-size)!important;
  padding:.34em!important;
  border-radius:50%!important;
  background:var(--red)!important;
}
.slide-controls .nav-icon{
  width:100%!important;
  height:100%!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
}

@media (min-width:901px){
  /* Equal left/right whitespace inside the content area. The 98% height makes
     the wordmark slightly smaller than v10 while its visible top remains on
     the marker. */
  .cover-wordmark{
    left:calc(var(--rail-w) + ((100vw - var(--rail-w)) / 2))!important;
    right:auto!important;
    top:var(--marker-y)!important;
    bottom:auto!important;
    width:auto!important;
    height:min(
      calc((100vh - var(--marker-y)) * .98),
      calc((100vw - var(--rail-w) - (2 * var(--pad-x))) / var(--wordmark-aspect))
    )!important;
    max-width:none!important;
    transform:translateX(-50%);
    object-fit:contain;
    object-position:center top;
  }

  /* Responsive, naturally wrapping three-line claim at the 1920px reference
     width. Its final line sits on the marker through the bottom anchor. */
  .intro-claim{
    width:clamp(560px,33vw,660px)!important;
    max-width:calc(100vw - var(--content-left) - var(--pad-x) - 430px)!important;
    white-space:normal!important;
    text-wrap:balance;
  }
  .intro-text{
    width:clamp(351px,20.3vw,390px)!important;
    max-width:none!important;
  }

  /* Corrected supplied diagram: intrinsic 679 × 624 size, aligned inside the
     top and right layout margins and only scaled down if space demands it. */
  .third-place-diagram{
    top:var(--layout-top)!important;
    right:var(--pad-x)!important;
    left:auto!important;
    width:679px!important;
    height:auto!important;
    max-width:calc(100vw - var(--content-left) - var(--pad-x))!important;
    max-height:calc(100vh - (2 * var(--layout-top)))!important;
    margin:0!important;
    object-fit:contain!important;
  }
}

@media (max-width:900px){
  /* The same width and wrapping logic translated to the vertical reading
     layout. */
  .slide-start .intro-copy{
    width:min(82vw,416px)!important;
    max-width:min(82vw,416px)!important;
  }
  .content-copy .copy-body,
  .intro-text{
    width:min(92%,390px)!important;
    max-width:min(92%,390px)!important;
  }
  .audio-copy{
    width:min(92%,478px)!important;
    max-width:min(92%,478px)!important;
  }
  .cover-wordmark{
    left:50%!important;
    right:auto!important;
    top:var(--mobile-marker-y)!important;
    bottom:auto!important;
    width:min(92vw, calc((100svh - 64px - var(--mobile-marker-y)) * var(--wordmark-aspect) * .98))!important;
    height:auto!important;
    max-width:calc(100vw - 48px)!important;
    transform:translateX(-50%);
    object-position:center top;
  }
  .intro-claim{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
    text-wrap:balance;
  }
  .more-link,
  .back-link{font-weight:400!important}
  .third-place-diagram{
    width:min(100%,679px)!important;
    max-width:679px!important;
  }
}

/* v11.1 – measured reference-width refinements */
:root{--menu-max-size:59px}
.slide-controls{font-size:calc(1em * var(--copy-scale))}
@media (min-width:901px){
  .intro-claim{
    width:min(
      40.625vw,
      calc(100vw - var(--content-left) - var(--pad-x) - min(20.3vw,390px) - 2vw)
    )!important;
    max-width:none!important;
  }
}

/* v11.2 – keep every chapter item on one line and inside the rail. */
@media (min-width:901px){
  .chapter-nav{
    right:calc(var(--grid-line) + 8px)!important;
    width:auto!important;
  }
  .chapter-link{
    width:100%;
    white-space:nowrap!important;
    text-align:left;
  }
}

/* v11.3 – preserve the established active/inactive menu hierarchy while
   fitting the complete rendered menu between marker and bottom margin. */
@media (min-width:901px){
  .chapter-nav{
    left:clamp(18px,1.45vw,28px)!important;
    right:calc(var(--grid-line) + 8px)!important;
    bottom:var(--layout-bottom)!important;
    width:auto!important;
    font-size:var(--menu-fit-size)!important;
    line-height:normal!important;
  }
  .chapter-nav ol{
    display:block!important;
    margin:0!important;
    padding:0!important;
    line-height:normal!important;
  }
  .chapter-nav li,
  .chapter-nav li + li{
    height:auto!important;
    margin:0!important;
  }
  .chapter-nav li + li{margin-top:.162em!important}
  .chapter-link{
    display:block!important;
    width:auto!important;
    height:auto!important;
    font-size:1.5em!important;
    line-height:1.3041!important;
    white-space:normal!important;
    text-align:left;
    transition:opacity .25s ease,transform .25s ease!important;
  }
  .chapter-link.is-active{font-size:2em!important}
}

/* ========================================================================== 
   v12 – supplied corrected assets, exact menu-heading anchor and audio player
   ========================================================================== */
:root{
  /* v11 intro-copy width × 1.30 */
  --intro-copy-width:clamp(423px,33.8vw,655px);
  --intro-text-line:1.872; /* established 1.56 leading × 1.20 */
  --content-heading-y:var(--active-menu-y);
  --audio-control-size:33px;
}

/* Chapter-start copy columns: 30% wider at every responsive size. */
.start-layout .intro-copy{
  width:var(--intro-copy-width)!important;
  max-width:var(--intro-copy-width)!important;
}

/* The supplied button SVGs already contain their red circles. */
.nav-icon,
.more-link .nav-icon,
.back-link .nav-icon,
.slide-controls .nav-icon{
  display:block!important;
  width:var(--audio-control-size)!important;
  height:var(--audio-control-size)!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  object-fit:contain!important;
}
.slide-controls button{
  width:var(--audio-control-size)!important;
  height:var(--audio-control-size)!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
}

@media (min-width:901px){
  /* The section-local value is calculated from the active .chapter-link by JS.
     Both boxes therefore share the exact same viewport-relative top edge. */
  .content-copy h2{
    top:var(--content-heading-y)!important;
  }

  /* Claim bottom edge sits exactly on the marker. */
  #intro .intro-claim{
    top:auto!important;
    bottom:calc(100vh - var(--marker-y))!important;
    margin:0!important;
  }

  /* Intro body copy: current width × 1.20, shifted left by 20% of itself,
     with 20% more leading. */
  #intro .intro-text{
    width:clamp(421px,24.36vw,468px)!important;
    max-width:none!important;
    left:auto!important;
    right:var(--pad-x)!important;
    transform:translateX(-20%);
    line-height:var(--intro-text-line)!important;
  }
  #intro .intro-text p{line-height:inherit!important}

  /* Corrected Third Place diagram at its intrinsic dimensions, constrained only
     when the viewport is smaller than the supplied artwork. */
  .third-place-diagram{
    width:679.355px!important;
    max-width:calc(100vw - var(--content-left) - var(--pad-x))!important;
  }

  /* Wirtschaftsfaktor: spans from the body-text left edge to the right margin;
     its lower edge is anchored exactly to the marker. */
  .capital-turnover-chart{
    position:absolute!important;
    left:var(--pad-x)!important;
    right:var(--pad-x)!important;
    top:auto!important;
    bottom:calc(100vh - var(--marker-y))!important;
    width:calc(100% - (2 * var(--pad-x)))!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:left bottom!important;
    z-index:2;
  }

  /* Anerkennung vs. Realität: viewport top, right layout margin. */
  .capital-reality-image{
    position:absolute!important;
    top:0!important;
    right:var(--pad-x)!important;
    left:auto!important;
    margin:0!important;
  }

  /* Stimmen imagery: top/right layout margins. The player remains attached
     directly underneath the image. */
  #stimmen .audio-media{
    position:absolute!important;
    top:var(--layout-top)!important;
    right:var(--pad-x)!important;
    left:auto!important;
    width:min(450px,calc(100vw - var(--content-left) - (2 * var(--pad-x))))!important;
    margin:0!important;
  }
}

/* Functional custom audio player. */
.audio-player{width:100%;margin-top:clamp(10px,1.1vh,14px);font-family:var(--font-body);color:inherit}
.audio-player audio{display:none}
.audio-player-main{display:grid;grid-template-columns:var(--audio-control-size) minmax(0,1fr);gap:clamp(9px,.75vw,14px);align-items:start}
.audio-toggle{
  display:grid;place-items:center;width:var(--audio-control-size);height:var(--audio-control-size);
  padding:0;border:0;background:transparent;color:inherit;cursor:pointer
}
.audio-toggle img{display:block;width:100%;height:100%;object-fit:contain}
.audio-toggle img[hidden]{display:none!important}
.audio-timeline-wrap{display:flex;flex-direction:column;min-width:0;padding-top:3px}
.audio-progress,.audio-volume{width:100%;margin:0;accent-color:var(--red);cursor:pointer}
.audio-progress{height:12px}
.audio-time{display:block;margin-top:4px;font-size:calc(.72em * var(--copy-scale));line-height:1.2;text-align:left;font-variant-numeric:tabular-nums}
.audio-volume-row{display:grid;grid-template-columns:auto minmax(80px,1fr);align-items:center;gap:10px;margin-top:8px;margin-left:calc(var(--audio-control-size) + clamp(9px,.75vw,14px))}
.audio-mute{padding:0;border:0;background:transparent;color:inherit;font:500 calc(.68em * var(--copy-scale))/1 var(--font-body);letter-spacing:.06em;cursor:pointer}
.audio-mute.is-muted{text-decoration:line-through;text-decoration-thickness:1px}
.audio-volume{height:10px}

@media (max-width:900px){
  .slide-start .intro-copy{
    width:min(92vw,541px)!important;
    max-width:min(92vw,541px)!important;
  }
  #intro .intro-text{
    width:min(100%,468px)!important;
    max-width:468px!important;
    line-height:var(--intro-text-line)!important;
  }
  #intro .intro-text p{line-height:inherit!important}
  .capital-turnover-chart{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:1249px!important;
    height:auto!important;
    margin:0 auto 1.2em!important;
    order:-1;
  }
  .capital-reality-image{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:1080px!important;
    margin:0 auto 1.2em!important;
    order:-1;
  }
  #stimmen .audio-media{
    position:relative!important;
    inset:auto!important;
    width:min(100%,450px)!important;
    margin:0 0 1.4em auto!important;
    order:-1;
  }
  .audio-time{font-size:.68em}
  .audio-mute{font-size:.68em}
}

/* v12.1 – reserve a guaranteed gap between the enlarged intro columns. */
:root{--intro-text-width:clamp(421px,24.36vw,468px)}
@media (min-width:901px){
  #intro .intro-claim{
    left:var(--content-left)!important;
    right:calc(var(--pad-x) + (var(--intro-text-width) * 1.2) + 2vw)!important;
    width:auto!important;
    max-width:none!important;
  }
  #intro .intro-text{width:var(--intro-text-width)!important}
}

/* v12.2 – keep the portrait itself at the full supplied figure width; nested
   player icons retain their dedicated 33 × 33 px rules. */
.audio-media > img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
}

/* ========================================================================== 
   v13 – optical headline alignment, supplied section numerals and archive UI
   ========================================================================== */
:root{
  /* Previous body-copy columns +10%. */
  --intro-copy-width:clamp(465px,37.18vw,721px);
  --body-copy-width:clamp(400px,34.61vw,663px);
  --audio-copy-width:clamp(372px,27.5vw,526px);

  /* Intro body column: v12 width +20%; leading reduced by 20%. */
  --intro-text-width:clamp(505px,29.23vw,562px);
  --intro-text-line:1.4976;
  --cover-wordmark-right:var(--pad-x);
}

/* Supplied corrected header artwork. */
.theme-red.cover-section{
  background-image:url('assets/headerbild-korrigiert.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}

/* The menu and content headings receive the same 3% optical downward shift.
   JS measures the actual glyph rectangles, not merely their unequal line boxes. */
.chapter-link{
  position:relative;
  top:.03em;
  letter-spacing:.1em!important;
}
@media (min-width:901px){
  .chapter-link{white-space:nowrap!important}
  .content-copy h2{
    transform:translateY(.03em);
    transform-origin:left top;
  }
}

/* All chapter-start copy columns continue to use the responsive width system. */
.start-layout .intro-copy{
  width:var(--intro-copy-width)!important;
  max-width:var(--intro-copy-width)!important;
}
.content-copy .copy-body{
  width:var(--body-copy-width)!important;
  max-width:var(--body-copy-width)!important;
}
.audio-copy{
  width:var(--audio-copy-width)!important;
  max-width:var(--audio-copy-width)!important;
}

/* Cover kicker: its right edge is read from the rendered wordmark by JS. */
@media (min-width:901px){
  .cover-kicker{
    left:auto!important;
    right:var(--cover-wordmark-right)!important;
  }
}

/* Original chapter numeral SVGs. Their centres match X=975 / Y=705 on the
   1920×1080 reference canvas; widths equal the supplied SVG dimensions there. */
.slide-start .section-number.section-number-art{
  position:absolute!important;
  left:calc(50.78125vw - var(--rail-w))!important;
  right:auto!important;
  top:65.277778vh!important;
  bottom:auto!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  opacity:1!important;
  color:inherit!important;
  -webkit-text-stroke:0!important;
  pointer-events:none;
  z-index:1;
}
#bedeutung .section-number-art{width:34.042448vw!important}
#kapital .section-number-art{width:45.369323vw!important}
#gefaehrdung .section-number-art{width:45.39125vw!important}
#stimmen .section-number-art{width:46.997656vw!important}
#archiv .section-number-art{width:46.164167vw!important}
#aktion .section-number-art{width:45.831823vw!important}
#projekt .section-number-art{width:44.85125vw!important}

/* Intro claim and body both terminate exactly on the responsive marker. */
@media (min-width:901px){
  #intro .intro-claim{
    top:auto!important;
    bottom:calc(100vh - var(--marker-y))!important;
    margin:0!important;
  }
  #intro .intro-text{
    top:auto!important;
    bottom:calc(100vh - var(--marker-y))!important;
    width:var(--intro-text-width)!important;
    max-width:none!important;
    right:var(--pad-x)!important;
    left:auto!important;
    transform:translateX(-20%)!important;
    line-height:var(--intro-text-line)!important;
    margin:0!important;
  }
  #intro .intro-text p{line-height:inherit!important}
  #intro .intro-claim{
    right:calc(var(--pad-x) + (var(--intro-text-width) * 1.2) + 2vw)!important;
  }
}

/* Corrected diagrams and 03 image positioning. */
.third-place-diagram{content:url('assets/01-bedeutung-dritter-ort_korr.svg')}
@media (min-width:901px){
  .hazard-noise-image{
    position:absolute!important;
    top:0!important;
    right:var(--pad-x)!important;
    left:auto!important;
    width:800px!important;
    height:450px!important;
    max-width:calc(100vw - var(--content-left) - var(--pad-x))!important;
    max-height:100vh!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:right top!important;
  }
}

/* The Projekt chapter title begins on the marker. */
@media (min-width:901px){
  #projekt .slide-start .section-title{
    top:var(--marker-y)!important;
    bottom:auto!important;
  }
}

/* Archive progression: 3 / 6 / 12 / 32. Every block spans the complete
   content width and is vertically centred around the marker. */
#archiv .archive-grid-layout{overflow:visible}
#archiv .archive-grid{
  position:absolute!important;
  left:var(--pad-x)!important;
  right:var(--pad-x)!important;
  top:var(--marker-y)!important;
  bottom:auto!important;
  width:auto!important;
  max-width:none!important;
  transform:translateY(-50%);
  display:grid!important;
  align-items:start;
  gap:clamp(8px,.72vw,14px)!important;
  overflow:visible;
  z-index:2;
}
#archiv .archive-count-3 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#archiv .archive-count-6 .archive-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
#archiv .archive-count-12 .archive-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
#archiv .archive-count-32 .archive-grid{grid-template-columns:repeat(8,minmax(0,1fr))!important}
.archive-item{
  position:relative;
  z-index:1;
  display:block;
  min-width:0;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  cursor:zoom-in;
  overflow:visible;
}
.archive-item img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  transform:scale(1);
  transform-origin:center center;
  transition:transform 220ms ease,box-shadow 220ms ease;
  box-shadow:0 0 0 1px rgba(0,0,0,.12);
}
.archive-item:hover,.archive-item:focus-visible{z-index:20}
.archive-item:hover img,.archive-item:focus-visible img{
  transform:scale(1.65);
  box-shadow:0 10px 34px rgba(0,0,0,.34);
  outline:none;
}
.archive-more-coming{
  position:absolute;
  left:var(--pad-x);
  bottom:var(--layout-bottom);
  margin:0;
  opacity:.25;
  font-family:var(--font-head);
  font-size:var(--fs-h2);
  line-height:.9;
  font-weight:800;
  text-transform:uppercase;
  z-index:3;
}

/* Full-viewport gallery viewer. */
.archive-lightbox{
  width:100vw;
  height:100vh;
  max-width:none;
  max-height:none;
  margin:0;
  padding:clamp(24px,4vw,72px);
  border:0;
  background:rgba(31,31,29,.97);
  color:var(--paper);
  overflow:hidden;
}
.archive-lightbox::backdrop{background:rgba(31,31,29,.82)}
.archive-lightbox[open]{display:grid;place-items:center}
.archive-lightbox-image{
  display:block;
  width:auto;
  height:auto;
  max-width:calc(100vw - clamp(48px,8vw,144px));
  max-height:calc(100vh - clamp(80px,10vw,170px));
  object-fit:contain;
}
.archive-lightbox-close{
  position:fixed;
  top:22px;
  right:28px;
  width:44px;
  height:44px;
  padding:0;
  border:1px solid currentColor;
  border-radius:50%;
  background:transparent;
  color:inherit;
  font:400 32px/1 var(--font-body);
  cursor:pointer;
  z-index:2;
}
.archive-lightbox-caption{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  width:max-content;
  max-width:80vw;
  margin:0;
  font-size:14px;
  text-align:center;
}

@media (max-width:900px){
  :root{
    --intro-copy-width:min(92vw,595px);
    --body-copy-width:min(100%,429px);
    --audio-copy-width:min(100%,526px);
    --intro-text-width:min(100%,562px);
  }
  .slide-start .intro-copy{
    width:var(--intro-copy-width)!important;
    max-width:var(--intro-copy-width)!important;
  }
  .content-copy .copy-body{
    width:var(--body-copy-width)!important;
    max-width:var(--body-copy-width)!important;
  }
  .audio-copy{
    width:var(--audio-copy-width)!important;
    max-width:var(--audio-copy-width)!important;
  }
  #intro .intro-text{
    width:var(--intro-text-width)!important;
    max-width:var(--intro-text-width)!important;
    line-height:var(--intro-text-line)!important;
  }
  .slide-start .section-number.section-number-art{
    left:50.78125vw!important;
    top:65.277778svh!important;
  }
  .hazard-noise-image{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:min(100%,800px)!important;
    height:auto!important;
    margin:0 0 1.2em auto!important;
    order:-1;
  }
  #projekt .slide-start .section-title{
    top:auto!important;
    bottom:56px!important;
  }
  #archiv .archive-grid{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    transform:none!important;
    margin:0 auto!important;
  }
  #archiv .archive-count-3 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #archiv .archive-count-6 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #archiv .archive-count-12 .archive-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  #archiv .archive-count-32 .archive-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .archive-item:hover img,.archive-item:focus-visible img{transform:scale(1.25)}
  .archive-more-coming{position:relative;left:auto;bottom:auto;margin:1.2em 0 0;align-self:flex-start}
}

@media (max-width:600px){
  #archiv .archive-count-3 .archive-grid,
  #archiv .archive-count-6 .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #archiv .archive-count-12 .archive-grid,
  #archiv .archive-count-32 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* v13.1 – The intro body column starts on the marker; only the claim ends on it. */
@media (min-width:901px){
  #intro .intro-text{
    top:var(--marker-y)!important;
    bottom:auto!important;
  }
}


/* ========================================================================== 
   v14 – final grid refinement, archive progression and reduced audio UI
   ========================================================================== */
:root{
  /* Chapter-start copy columns reduced by 15% from v13. */
  --intro-copy-width:clamp(395px,31.603vw,613px);
  --section-number-left-x:50.78125vw;   /* 975 px on the 1920 px reference */
  --section-number-bottom-y:65.277778vh;/* 705 px on the 1080 px reference */
  --archive-icon-size:44px;
}

/* Undo the v13 tracking increase without changing menu fit or hierarchy. */
.chapter-link{letter-spacing:0!important}

/* The supplied numeral artwork is anchored by its actual left and lower edges. */
.slide-start .section-number.section-number-art{
  left:calc(var(--section-number-left-x) - var(--rail-w))!important;
  right:auto!important;
  top:auto!important;
  bottom:calc(100vh - var(--section-number-bottom-y))!important;
  transform:none!important;
}

/* Chapter titles receive a small protective field in the current slide colour.
   Negative margin keeps the established optical anchor despite the 5% padding. */
.section-title{
  z-index:5!important;
  padding:.05em!important;
  margin:-.05em!important;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
.theme-dark .section-title{background:var(--black)!important}
.theme-paper .section-title{background:var(--paper)!important}
.theme-red .section-title{background:var(--red)!important}

.start-layout .intro-copy{
  width:var(--intro-copy-width)!important;
  max-width:var(--intro-copy-width)!important;
}

/* Project: chapter H1 returns to the lower layout margin. The following content
   headline is anchored optically to the marker by JS. */
@media (min-width:901px){
  #projekt .slide-start .section-title{
    top:auto!important;
    bottom:var(--layout-bottom)!important;
  }
  #projekt .slide-content .content-copy h2{
    top:calc(var(--marker-y) + var(--project-heading-adjust,0px))!important;
    transform:none!important;
  }
}

/* --------------------------------------------------------------------------
   Archive: requested 2×3, 3×6 and 4×8 progressions
   -------------------------------------------------------------------------- */
#archiv .archive-count-6 .archive-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
#archiv .archive-count-18 .archive-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
}
#archiv .archive-count-32 .archive-grid{
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
}

/* Matching circular eye affordances for hover and fullscreen closing. */
.archive-item::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:var(--archive-icon-size);
  height:var(--archive-icon-size);
  border:1px solid var(--black);
  border-radius:50%;
  background:var(--paper) url('assets/eye.svg') center/58% 58% no-repeat;
  transform:translate(-50%,-50%);
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease;
  z-index:30;
}
.archive-item:hover::after,.archive-item:focus-visible::after{opacity:1}
.archive-lightbox-close{
  display:grid!important;
  place-items:center!important;
  width:var(--archive-icon-size)!important;
  height:var(--archive-icon-size)!important;
  padding:0!important;
  border:1px solid var(--black)!important;
  border-radius:50%!important;
  background:var(--paper)!important;
  color:var(--black)!important;
}
.archive-lightbox-close img{
  display:block;
  width:58%;
  height:58%;
  object-fit:contain;
}

/* --------------------------------------------------------------------------
   Stimmen: marker-anchored names, explanatory copy and minimalist player
   -------------------------------------------------------------------------- */
#stimmen .audio-copy{
  color:var(--black);
}
@media (min-width:901px){
  #stimmen .audio-copy{
    position:absolute!important;
    left:var(--pad-x)!important;
    top:calc(var(--marker-y) + var(--voice-heading-adjust,0px))!important;
    bottom:auto!important;
    width:var(--audio-copy-width)!important;
    max-width:var(--audio-copy-width)!important;
    margin:0!important;
    align-self:auto!important;
    z-index:4;
  }
  #stimmen .audio-copy h2{
    margin:0 0 .42em!important;
  }
  #stimmen .audio-copy .role{
    margin:0 0 1.15em!important;
    opacity:.75!important;
  }
  #stimmen .audio-copy .voice-bio{
    margin:0!important;
    opacity:1!important;
  }
}
#stimmen .audio-copy .role,
#stimmen .audio-copy .voice-bio{
  font-family:var(--font-body);
  font-size:calc(1em * var(--copy-scale));
  line-height:var(--copy-leading);
  letter-spacing:0;
  font-weight:500;
  color:var(--black);
}

/* Image and player form one right-aligned media column. */
@media (min-width:901px){
  #stimmen .audio-media{
    top:var(--layout-top)!important;
    right:var(--pad-x)!important;
    width:min(450px,calc(100vw - var(--content-left) - (2 * var(--pad-x))))!important;
  }
}
#stimmen .audio-media > img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1/1;
  object-fit:cover;
}

.audio-player{
  width:100%;
  margin-top:clamp(18px,2.2vh,28px)!important;
  font-family:var(--font-body);
  color:inherit;
}
.audio-player audio{display:none}
.audio-volume-row{
  display:grid!important;
  grid-template-columns:18px minmax(70px,72px) 18px!important;
  justify-content:end;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 clamp(13px,1.5vh,18px)!important;
}
.audio-mute{
  display:grid;
  place-items:center;
  width:18px;
  height:18px;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  cursor:pointer;
  opacity:1;
}
.audio-mute img,.audio-volume-high{
  display:block;
  width:18px;
  height:18px;
  object-fit:contain;
}
.audio-mute.is-muted{opacity:.42;text-decoration:none!important}
.audio-player-main{
  display:grid!important;
  grid-template-columns:var(--audio-control-size) minmax(0,1fr)!important;
  gap:clamp(10px,.85vw,16px)!important;
  align-items:start!important;
}
.audio-toggle{
  display:grid!important;
  place-items:center!important;
  width:var(--audio-control-size)!important;
  height:var(--audio-control-size)!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  cursor:pointer;
}
.audio-toggle img{display:block;width:100%;height:100%;object-fit:contain}
.audio-toggle img[hidden]{display:none!important}
.audio-timeline-wrap{
  display:flex!important;
  flex-direction:column!important;
  min-width:0;
  padding-top:calc(var(--audio-control-size) / 2 - 6px)!important;
}
.audio-time-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  width:100%;
  margin-top:7px;
  font-size:calc(.72em * var(--copy-scale));
  line-height:1.2;
  font-variant-numeric:tabular-nums;
}
.audio-current,.audio-duration{display:block;margin:0}

/* Minimal native-range restyling. */
.audio-progress,.audio-volume{
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  margin:0!important;
  padding:0;
  background:transparent;
  cursor:pointer;
  accent-color:var(--red);
}
.audio-progress{height:12px!important}
.audio-volume{height:10px!important}
.audio-progress::-webkit-slider-runnable-track,
.audio-volume::-webkit-slider-runnable-track{
  height:2px;
  background:currentColor;
  border:0;
}
.audio-progress::-moz-range-track,
.audio-volume::-moz-range-track{
  height:2px;
  background:currentColor;
  border:0;
}
.audio-progress::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:14px;height:14px;border:0;border-radius:50%;background:var(--red);
  margin-top:-6px;
}
.audio-progress::-moz-range-thumb{
  width:14px;height:14px;border:0;border-radius:50%;background:var(--red);
}
.audio-volume::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:7px;height:7px;border:0;border-radius:50%;background:currentColor;
  margin-top:-2.5px;
}
.audio-volume::-moz-range-thumb{
  width:7px;height:7px;border:0;border-radius:50%;background:currentColor;
}

@media (max-width:900px){
  :root{
    --intro-copy-width:min(92vw,506px);
    --section-number-bottom-y:65.277778svh;
  }
  .slide-start .section-number.section-number-art{
    left:var(--section-number-left-x)!important;
    bottom:calc(100svh - var(--section-number-bottom-y))!important;
    top:auto!important;
    transform:none!important;
  }
  #projekt .slide-start .section-title{
    top:auto!important;
    bottom:56px!important;
  }
  #projekt .slide-content .content-copy h2{
    top:auto!important;
    transform:none!important;
  }
  #archiv .archive-count-6 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #archiv .archive-count-18 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #archiv .archive-count-32 .archive-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  #stimmen .audio-copy{
    position:relative!important;
    inset:auto!important;
    width:min(100%,526px)!important;
    max-width:526px!important;
    margin:0!important;
    color:var(--black);
  }
  #stimmen .audio-copy h2{margin:0 0 .42em!important}
  #stimmen .audio-copy .role{margin:0 0 1em!important;opacity:.75!important}
  #stimmen .audio-copy .voice-bio{margin:0!important}
  .audio-volume-row{grid-template-columns:18px minmax(80px,110px) 18px!important}
}
@media (max-width:600px){
  #archiv .archive-count-6 .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #archiv .archive-count-18 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  #archiv .archive-count-32 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  :root{--archive-icon-size:38px}
}


/* v14.1 – visible elapsed section of the minimal timeline. */
.audio-progress{--progress:0%}
.audio-progress::-webkit-slider-runnable-track{
  background:linear-gradient(to right,var(--red) 0,var(--red) var(--progress),currentColor var(--progress),currentColor 100%)!important;
}
.audio-progress::-moz-range-track{
  background:linear-gradient(to right,var(--red) 0,var(--red) var(--progress),currentColor var(--progress),currentColor 100%)!important;
}


/* ========================================================================== 
   v14.1 – reduced correction pass on top of v14
   ========================================================================== */

::selection{background:#d8272a;color:#dad8cc}
::-moz-selection{background:#d8272a;color:#dad8cc}

/* Header artwork swap. */
.theme-red.cover-section{
  background-image:url('assets/headerbild-V3-heller.png')!important;
}

/* Chapter headings slightly higher again, except section 07 Projekt. */
.matrix-section:not(#projekt) .slide-start .section-title{
  transform:translateY(-1vh)!important;
}

/* Buttons stay on the right margin and align vertically with the active heading. */
@media (min-width:901px){
  .slide-start .more-link,
  .slide-content .slide-controls,
  .slide-content .back-link,
  .slide-audio .slide-controls,
  .slide-audio .back-link,
  .slide-end .back-link,
  .slide-quote .slide-controls{
    top:var(--active-control-y, auto)!important;
    bottom:auto!important;
    transform:translateY(-50%)!important;
    right:var(--pad-x)!important;
    left:auto!important;
  }
}

/* 01 Bedeutung – Communitas image flush with the right viewport edge. */
@media (min-width:901px){
  .communitas-image{
    position:absolute!important;
    top:0!important;
    right:calc(-1 * var(--pad-x))!important;
    left:auto!important;
    margin:0!important;
  }
}

/* 02 Kapital – UNESCO image flush right; sale graphic top-right inside margins. */
@media (min-width:901px){
  .capital-reality-image{
    right:calc(-1 * var(--pad-x))!important;
  }
  .sale-graphic{
    position:absolute!important;
    top:var(--layout-top)!important;
    right:var(--pad-x)!important;
    left:auto!important;
    width:110.945px!important;
    height:103.611px!important;
    margin:0!important;
    object-fit:contain!important;
  }
}

/* Stimmen – smoother progress updates are handled in JS; align the bio text to
   the lower margin and use the regular copy weight. */
#stimmen .audio-copy .role,
#stimmen .audio-copy .voice-bio{
  font-weight:400!important;
}
@media (min-width:901px){
  #stimmen .audio-copy{
    bottom:var(--layout-bottom)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
  }
  #stimmen .audio-copy .voice-bio{
    margin-top:auto!important;
  }
}

/* Archiv – use the eye icon as the hover cursor instead of an extra hover icon. */
.archive-item::after{display:none!important}
.archive-item{cursor:none!important}
.hover-eye-cursor{
  position:fixed;
  left:0;top:0;
  width:44px;height:44px;
  display:grid;place-items:center;
  border:1px solid var(--black);
  border-radius:50%;
  background:var(--paper);
  pointer-events:none;
  opacity:0;
  transform:translate(-50%,-50%);
  z-index:1000;
  transition:opacity 120ms ease;
}
.hover-eye-cursor img{width:58%;height:58%;display:block;object-fit:contain}
@media (hover:none),(pointer:coarse){
  .archive-item{cursor:pointer!important}
  .hover-eye-cursor{display:none!important}
}

/* Footer fixes. */
.footer-address{
  gap:.3em!important;
  line-height:1.1!important;
}


/* ========================================================================== 
   v14.2 – targeted correction set based strictly on v14.1
   ========================================================================== */

/* Selection is always the inverse of the slide's text colour. */
body[data-theme="dark"] ::selection{background:#d8272a;color:#1f1f1d}
body[data-theme="dark"] ::-moz-selection{background:#d8272a;color:#1f1f1d}
body[data-theme="paper"] ::selection,
body[data-theme="red"] ::selection{background:#d8272a;color:#dad8cc}
body[data-theme="paper"] ::-moz-selection,
body[data-theme="red"] ::-moz-selection{background:#d8272a;color:#dad8cc}

/* One fixed Y anchor for all chapter navigation controls. */
@media (min-width:901px){
  .matrix-section .more-link,
  .matrix-section .slide-controls,
  .matrix-section .back-link{
    position:absolute!important;
    top:var(--uniform-button-y,50%)!important;
    right:var(--pad-x)!important;
    bottom:auto!important;
    left:auto!important;
    transform:translateY(-50%)!important;
  }
}

/* 01/02: top image from left content margin to the viewport edge, down to marker. */
@media (min-width:901px){
  .full-marker-image{
    position:absolute!important;
    top:0!important;
    left:var(--pad-x)!important;
    right:0!important;
    width:auto!important;
    height:var(--marker-y)!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center center!important;
    z-index:1!important;
  }
  .sale-graphic{
    position:absolute!important;
    top:var(--layout-top)!important;
    right:var(--pad-x)!important;
    left:auto!important;
    width:min(11.7vw,224.202px)!important;
    height:auto!important;
    margin:0!important;
    object-fit:contain!important;
    transform:translate(-20%,20%)!important;
  }
}

/* 04 Stimmen: neutral, fully opaque timeline line. */
#stimmen .audio-progress::-webkit-slider-runnable-track{
  background:#72726d!important;
  opacity:1!important;
}
#stimmen .audio-progress::-moz-range-track{
  background:#72726d!important;
  opacity:1!important;
}

/* 05 Archiv: centred, smaller blocks with their upper edge on the layout margin. */
@media (min-width:901px){
  #archiv .archive-count-6 .archive-grid{
    left:50%!important;
    right:auto!important;
    top:var(--layout-top)!important;
    width:min(47vw,900px)!important;
    transform:translateX(-50%)!important;
  }
  #archiv .archive-count-18 .archive-grid{
    left:50%!important;
    right:auto!important;
    top:var(--layout-top)!important;
    width:min(52vw,980px)!important;
    transform:translateX(-50%)!important;
  }
}
.archive-lightbox-caption{display:none!important}
.archive-item::after,.media-zoom-item::after{display:none!important}
.archive-item,.media-zoom-item{cursor:none!important}

/* One eye cursor for Archiv and Aktion. */
.hover-eye-cursor{
  width:44px!important;height:44px!important;
  border:1px solid var(--black)!important;
  background:var(--paper)!important;
}

/* Shared fullscreen controls. */
.archive-lightbox-download,
.archive-lightbox-close{
  display:grid!important;
  place-items:center!important;
  width:var(--archive-icon-size)!important;
  height:var(--archive-icon-size)!important;
  padding:0!important;
  border:1px solid var(--black)!important;
  border-radius:50%!important;
  background:var(--paper)!important;
  color:var(--black)!important;
  text-decoration:none!important;
}
.archive-lightbox-download{
  position:fixed!important;
  top:clamp(24px,2.5vh,40px)!important;
  right:calc(clamp(24px,2.5vw,40px) + var(--archive-icon-size) + 12px)!important;
  z-index:60!important;
}
.archive-lightbox-download[hidden]{display:none!important}
.archive-lightbox-download img,.archive-lightbox-close img{
  display:block;width:58%;height:58%;object-fit:contain
}

/* 06 Aktion. */
.action-intro-slide .content-copy{z-index:4}
.action-gallery-layout{display:block!important;overflow:visible!important}
.action-visuals{
  position:absolute;
  top:0;
  left:var(--pad-x);
  right:var(--pad-x);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:clamp(24px,3vw,58px);
  z-index:2;
}
.action-item,.action-subitem{
  min-width:0;
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:clamp(9px,1.1vh,14px);
  text-align:center;
}
.media-zoom-item{
  position:relative;
  display:block;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
}
.media-zoom-item img{
  display:block;
  width:auto;
  max-width:100%;
  object-fit:contain;
  box-shadow:0 0 0 1px rgba(0,0,0,.12);
}
.asset-download-button{
  display:inline-flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:.45em;
  color:inherit;
  text-decoration:none;
  font-family:var(--font-body)!important;
  font-size:calc(1em * var(--copy-scale))!important;
  line-height:var(--copy-leading)!important;
  font-weight:400!important;
}
.asset-download-button span{order:1}
.asset-download-button img{
  order:2;
  display:block;
  width:var(--audio-control-size);
  height:var(--audio-control-size);
  object-fit:contain;
}
.action-caption,
#aktion .copy-body{
  font-family:var(--font-body)!important;
  font-size:calc(1em * var(--copy-scale))!important;
  line-height:var(--copy-leading)!important;
  font-weight:400!important;
}
.action-caption{
  position:absolute;
  left:var(--pad-x);
  bottom:var(--layout-bottom);
  width:var(--body-copy-width);
  max-width:var(--body-copy-width);
  margin:0!important;
  z-index:4;
}
.action-main-posters .action-visuals{gap:clamp(24px,2.5vw,48px)}
.action-main-posters .action-item:not(.action-item-featured) .media-zoom-item img{height:min(45vh,486px)}
.action-main-posters .action-item-featured .media-zoom-item img{height:min(56.25vh,608px)}
.action-activation-posters .media-zoom-item img{height:min(54vh,583px)}
.action-thanks-poster .action-visuals{justify-content:flex-start}
/* 30% reduced base, then 23% larger as requested in the correction line. */
.action-thanks-poster .media-zoom-item img{height:min(53.4vh,560px)}
.action-scatter-media .action-visuals{justify-content:space-between;align-items:flex-start}
.action-scatter-media .action-item-doorhanger .media-zoom-item img{height:min(52vh,560px)}
.action-scatter-media .action-item-sticker{display:flex;flex-direction:column;gap:clamp(22px,2.4vh,34px)}
.action-scatter-media .action-item-sticker .media-zoom-item img{height:min(16vh,170px)}
.action-scatter-media .action-item-sticker .action-subitem:last-child .media-zoom-item img{height:min(14vh,150px)}
.action-scatter-media .action-item-stencil .media-zoom-item img{height:min(47vh,505px)}

@media (max-width:900px){
  .archive-item,.media-zoom-item{cursor:pointer!important}
  .action-gallery-layout{display:flex!important;flex-direction:column;gap:1.5em}
  .action-visuals{position:relative;inset:auto;width:100%;flex-wrap:wrap;justify-content:center!important;gap:1.4em}
  .action-item{flex:1 1 min(42%,280px)}
  .action-main-posters .media-zoom-item img,
  .action-activation-posters .media-zoom-item img,
  .action-thanks-poster .media-zoom-item img,
  .action-scatter-media .media-zoom-item img{width:auto;height:auto;max-height:68svh;max-width:100%}
  .action-caption{position:relative;inset:auto;width:min(100%,615px);max-width:615px;margin:1em 0 5em!important;align-self:flex-start}
}

@media (min-width:901px){
  #aktion .action-intro-slide .content-copy h2{
    transform:translateY(calc(var(--action-heading-y,0px) + .03em))!important;
  }
}


/* ========================================================================== 
   v14.2.1 – verified micro-corrections, based directly on v14.2
   ========================================================================== */

/* 03 Gefährdung: another 20% left/down relative to v14.2 (total 40% / 40%). */
@media (min-width:901px){
  .sale-graphic{
    transform:translate(-40%,40%)!important;
  }
}

/* 05 Archiv: the 4 × 8 block remains centred on the marker, but is small
   enough for its upper edge to sit within the upper layout margin. */
@media (min-width:901px){
  #archiv .archive-count-32 .archive-grid{
    left:50%!important;
    right:auto!important;
    top:var(--marker-y)!important;
    width:min(54vw,1040px)!important;
    max-width:none!important;
    transform:translate(-50%,-50%)!important;
  }
}

/* 06 Aktion – intro headline uses a direct JS-measured top coordinate matching
   the glyph top of menu item 01 Bedeutung. The copy stays at the lower margin. */
@media (min-width:901px){
  #aktion .action-intro-slide .content-copy h2{
    top:var(--action-heading-top,var(--content-heading-y))!important;
    transform:none!important;
  }
  #aktion .action-intro-slide .content-copy .copy-body{
    left:var(--pad-x)!important;
    bottom:var(--layout-bottom)!important;
    width:var(--body-copy-width)!important;
    max-width:var(--body-copy-width)!important;
    font-family:var(--font-body)!important;
    font-size:calc(1em * var(--copy-scale))!important;
    line-height:var(--copy-leading)!important;
    font-weight:400!important;
  }
}

/* Main campaign row: featured poster flush left, minimal poster flush right,
   QR poster centred in the remaining middle column. */
@media (min-width:901px){
  .action-main-posters .action-visuals{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    left:var(--pad-x)!important;
    right:var(--pad-x)!important;
    width:auto!important;
    gap:clamp(18px,2.2vw,42px)!important;
  }
  .action-main-posters .action-item:nth-child(1){justify-self:start!important}
  .action-main-posters .action-item:nth-child(2){justify-self:center!important}
  .action-main-posters .action-item:nth-child(3){justify-self:end!important}
}

/* All Aktion downloads: word first, circular icon directly underneath. */
#aktion .asset-download-button{
  flex-direction:column!important;
  gap:.28em!important;
  font-family:var(--font-body)!important;
  font-size:calc(1em * var(--copy-scale))!important;
  line-height:1.2!important;
  font-weight:400!important;
}
#aktion .asset-download-button span{order:1!important}
#aktion .asset-download-button img{order:2!important}

/* DANKE. motif: 25% larger than its v14.2 size. */
@media (min-width:901px){
  .action-thanks-poster .media-zoom-item img{
    height:min(66.75vh,700px)!important;
  }
}

/* Streumedien: no grey hairlines, 25% larger, all begin inside upper margin. */
.action-scatter-media .media-zoom-item img{
  box-shadow:none!important;
  outline:0!important;
}
@media (min-width:901px){
  .action-scatter-media .action-visuals{
    top:var(--layout-top)!important;
  }
  .action-scatter-media .action-item-doorhanger .media-zoom-item img{
    height:min(65vh,700px)!important;
  }
  .action-scatter-media .action-item-sticker .media-zoom-item img{
    height:min(20vh,213px)!important;
  }
  .action-scatter-media .action-item-sticker .action-subitem:last-child .media-zoom-item img{
    height:min(17.5vh,188px)!important;
  }
  .action-scatter-media .action-item-stencil .media-zoom-item img{
    height:min(58.75vh,631px)!important;
  }
}

/* Fullscreen controls: identical Y position and a slightly tighter X gap. */
.archive-lightbox-close,
.archive-lightbox-download{
  top:clamp(24px,2.5vh,40px)!important;
}
.archive-lightbox-close{
  right:clamp(24px,2.5vw,40px)!important;
}
.archive-lightbox-download{
  right:calc(clamp(24px,2.5vw,40px) + var(--archive-icon-size) + 7px)!important;
}

/* 07 Projekt: direct JS-measured coordinate aligned to 01 Bedeutung. */
@media (min-width:901px){
  #projekt .slide-content .content-copy h2{
    top:var(--project-heading-top,var(--content-heading-y))!important;
    transform:none!important;
  }
}