@font-face{font-family:Playfair;src:url('./assets/playfair-normal.woff2') format('woff2');font-style:normal;font-weight:400 900;font-display:swap}
@font-face{font-family:Playfair;src:url('./assets/playfair-italic.woff2') format('woff2');font-style:italic;font-weight:400 900;font-display:swap}
@font-face{font-family:Inter;src:url('./assets/inter-normal.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Inter Tight';src:url('./assets/inter-tight-latin.woff2') format('woff2');font-style:normal;font-weight:200 900;font-display:swap}
:root{color-scheme:dark;--black:#050505;--charcoal:#111113;--white:#f1f1f1;--red:#ed1018;--muted:#bdbdc0;font-family:Inter,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--white);overflow-x:hidden}button,a{font:inherit}button{cursor:pointer}a{color:inherit}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid #fff;outline-offset:4px}.skip-link{position:fixed;z-index:100;top:-6rem;left:1rem;padding:.7rem 1rem;background:#fff;color:#111}.skip-link:focus{top:1rem}
.site-header{position:absolute;z-index:20;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:22px clamp(20px,3.1vw,58px);color:#fff;font-size:14px;font-weight:600;letter-spacing:-.025em}.brand{display:inline-flex;align-items:center;gap:18px;text-decoration:none;white-space:nowrap}.brand__dot{width:13px;height:13px;border-radius:50%;background:#fff;flex:none}.header-actions{display:flex;align-items:center;gap:27px}.menu-toggle{border:0;background:none;color:#fff}.brand:hover{opacity:.72}.menu-toggle{display:grid;align-content:center;gap:5px;width:28px;height:30px;padding:2px}.menu-toggle span{display:block;width:100%;height:1.5px;background:#fff;transition:transform .24s,opacity .24s}.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}.menu-panel{position:absolute;top:68px;right:clamp(20px,3.1vw,58px);min-width:190px;padding:13px 20px;background:#0b0b0df2;border:1px solid #ffffff38;box-shadow:0 18px 40px #0008}.menu-panel[hidden]{display:none}.menu-panel a{display:block;padding:11px 0;text-decoration:none;border-bottom:1px solid #ffffff22}.menu-panel a:last-child{border:0}.menu-panel a:hover{text-decoration:underline}
.hero{position:relative;z-index:2;height:min(100svh,calc(45vw + 130px));min-height:540px;background:#050505;isolation:isolate;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - min(7vw,105px)))}.hero__image{position:absolute;z-index:-1;top:0;left:0;width:100%;height:auto;display:block}.hero__shade{position:absolute;z-index:-1;inset:30% 0 0;background:linear-gradient(180deg,transparent 0%,transparent 38%,#05050515 52%,#050505 100%);pointer-events:none}.petition-widget{position:absolute;right:clamp(20px,3.1vw,58px);bottom:clamp(100px,10vw,155px);display:flex;align-items:center;gap:11px;min-height:37px;padding:5px 11px 5px 13px;background:#050505ee;border:1px solid #a9171b;border-radius:8px;white-space:nowrap;box-shadow:0 1px 9px #0008}.petition-widget__link{text-decoration:none;font-family:Playfair,Georgia,serif;font-size:14px}.petition-widget__link:hover{text-decoration:underline}.petition-widget__link span{font-family:Inter,Arial,sans-serif;font-size:19px;font-weight:300;vertical-align:-1px;margin-left:8px}.petition-widget__rule{height:23px;width:1px;background:#717174}.petition-widget__caption{font-size:9px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--red)}.flip-counter{display:inline-flex;align-items:center;gap:2px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.flip-digit{position:relative;display:inline-block;width:14px;height:22px;perspective:100px;color:#e9e9e9;font-size:15px;line-height:22px;text-align:center;font-variant-numeric:tabular-nums}.flip-half,.flip-flap{position:absolute;left:0;width:100%;height:50%;overflow:hidden;backface-visibility:hidden;background:#151517;border:1px solid #36363a}.flip-half--top,.flip-flap--top{top:0;border-bottom:1px solid #525257;border-radius:2px 2px 0 0}.flip-half--bottom,.flip-flap--bottom{bottom:0;background:#0b0b0d;border-top:0;border-radius:0 0 2px 2px}.flip-half span,.flip-flap span{position:absolute;left:0;width:100%;height:22px}.flip-half--top span,.flip-flap--top span{top:-1px}.flip-half--bottom span,.flip-flap--bottom span{bottom:-1px}.flip-flap{z-index:3;visibility:hidden}.flip-digit.is-flipping .flip-flap{visibility:visible}.flip-flap--top{transform-origin:center bottom;animation:flip-top .28s ease-in forwards}.flip-flap--bottom{transform-origin:center top;transform:rotateX(90deg);animation:flip-bottom .28s ease-out .28s forwards}.flip-separator{width:5px;margin-inline:1px;text-align:center;font-size:17px;align-self:flex-end}.flip-digit:after{content:"";position:absolute;left:-1px;right:-1px;top:50%;height:1px;background:#66666a;z-index:4;pointer-events:none}@keyframes flip-top{to{transform:rotateX(-90deg)}}@keyframes flip-bottom{to{transform:rotateX(0)}}
.emigration{position:relative;z-index:1;min-height:690px;margin-top:calc(-1 * min(7vw,105px));padding:calc(min(7vw,105px) + 52px) clamp(24px,5vw,86px) 110px;background:linear-gradient(115deg,#101011,#18181a 58%,#101012);isolation:isolate}.emigration__grain{position:absolute;z-index:-1;inset:0;pointer-events:none;background:none;opacity:.1;animation:none}.emigration__edge{position:absolute;z-index:4;top:0;left:0;width:100.5%;height:1px;background:#c7c7c789;transform-origin:left center;transform:rotate(4deg);pointer-events:none}.emigration__inner{max-width:1690px;margin:0 auto;display:grid;grid-template-columns:minmax(0,45%) minmax(0,55%);align-items:start;gap:1.5vw}.emigration__copy{padding-top:2.5vw}.emigration__title{margin:0 0 28px;font-family:Playfair,Didot,Georgia,serif;font-size:clamp(72px,8.6vw,150px);font-weight:400;line-height:.83;letter-spacing:-.065em}.emigration__title span,.emigration__title em{display:block;white-space:nowrap}.emigration__title em{font-weight:400;letter-spacing:-.075em;padding-right:.12em}.emigration__lead{max-width:480px;margin:0;color:#dedee1;font-size:clamp(16px,1.48vw,21px);line-height:1.51;letter-spacing:-.02em}.source{max-width:480px;margin-top:27px;padding-top:10px;border-top:1px solid #9999}.source a{font-size:10px;line-height:1.4;letter-spacing:.035em;text-transform:uppercase;text-decoration:none;color:#c0c0c2}.source a:hover{text-decoration:underline}.map-figure{position:relative;margin:0;align-self:start}.map-figure__stage{position:relative;width:100%;min-height:510px}.map-svg{width:100%;height:auto;max-height:760px;display:block;overflow:visible}.map-state{fill:#9a1118;stroke:#e62930;stroke-width:1.6;stroke-linejoin:round;vector-effect:non-scaling-stroke;cursor:pointer;transition:fill .25s,filter .25s;opacity:0;transform:translateY(10px)}.map-figure.is-visible .map-state{animation:state-in .65s both;animation-delay:var(--state-delay)}.map-state:nth-child(4n+1){fill:#b10f17}.map-state:nth-child(4n+2){fill:#c9161f}.map-state:nth-child(4n+3){fill:#8a0d14}.map-state:hover,.map-state:focus-visible{fill:#f01923;filter:drop-shadow(0 0 8px #e91720b0);outline:none}.map-arrow{fill:none;stroke:#e6e6e8;stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:0}.map-figure.is-visible .map-arrow{animation:arrow-in .8s .65s both}.map-label,.map-value{fill:#f6f6f6;font-family:Inter,Arial,sans-serif;paint-order:stroke;stroke:#111114;stroke-width:5px;stroke-linejoin:round}.map-label{font-size:24px;font-weight:600;text-transform:uppercase}.map-value{font-size:18px;font-weight:500;letter-spacing:.05em}.map-caption{opacity:0}.map-figure.is-visible .map-caption{animation:caption-in .55s .95s both}.map-figure figcaption{max-width:600px;margin:0 auto;text-align:center;color:#a7a7aa;font-size:11px;line-height:1.45}.map-tooltip{position:absolute;z-index:10;min-width:200px;max-width:230px;padding:12px 14px;background:#080809f2;border:1px solid #ffffff50;box-shadow:0 8px 30px #0009;pointer-events:none;font-size:12px}.map-tooltip strong{display:block;margin-bottom:5px;color:#fff;font-size:15px}.map-tooltip span{display:block;color:#c6c6c8;line-height:1.35}.map-tooltip b{color:#fff;font-variant-numeric:tabular-nums}.map-tooltip[hidden]{display:none}.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,.61,.36,1)}.reveal.is-visible{opacity:1;transform:none}.emigration__lead.reveal{transition-delay:.12s}.source.reveal{transition-delay:.19s}.map-figure.reveal{transition-delay:.1s}@keyframes state-in{to{opacity:1;transform:translateY(0)}}@keyframes arrow-in{from{opacity:0;stroke-dasharray:300;stroke-dashoffset:300}to{opacity:1;stroke-dasharray:300;stroke-dashoffset:0}}@keyframes caption-in{to{opacity:1}}@keyframes grain-shift{0%{background-position:0 0}20%{background-position:-7px 3px}40%{background-position:4px -5px}60%{background-position:-3px -9px}80%{background-position:8px 5px}100%{background-position:0 0}}
@media(max-width:1050px){.emigration__inner{grid-template-columns:minmax(0,48%) minmax(0,52%)}.emigration__title{font-size:clamp(64px,8.2vw,100px)}.map-figure__stage{min-height:400px}.petition-widget{bottom:110px}}
@media(max-width:760px){.site-header{padding:18px 18px;font-size:12px}.brand{gap:10px}.brand__dot{width:10px;height:10px}.header-actions{gap:17px}.hero{height:calc(45vw + 150px);min-height:320px;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 9vw))}.hero__image{top:48px;max-width:none}.hero__shade{inset:20% 0 0;background:linear-gradient(180deg,transparent 15%,#050505 95%)}.petition-widget{right:14px;left:14px;bottom:55px;gap:7px;justify-content:center;padding-inline:8px}.petition-widget__link{font-size:12px}.petition-widget__link span{margin-left:3px}.petition-widget__caption{font-size:8px}.flip-digit{width:12px;height:20px;font-size:13px;line-height:20px}.flip-half span,.flip-flap span{height:20px}.emigration{margin-top:-9vw;padding:calc(9vw + 54px) 20px 75px;min-height:0}.emigration__edge{transform:rotate(5.15deg)}.emigration__inner{display:block}.emigration__copy{padding:0}.emigration__title{font-size:clamp(59px,12vw,92px);margin-bottom:24px}.emigration__lead{font-size:16px;max-width:620px}.source{max-width:620px}.map-figure{margin-top:35px}.map-figure__stage{min-height:0}.map-svg{max-height:none}.map-label{font-size:28px}.map-value{font-size:20px}}
@media(max-width:410px){.site-header{padding-inline:14px}.brand{gap:7px}.petition-widget{gap:5px}.petition-widget__rule{height:19px}.petition-widget__caption{font-size:7px}.emigration__title{font-size:13vw}.map-label{font-size:32px}.map-value{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.emigration__grain{animation:none}.reveal,.map-state,.map-arrow,.map-caption{animation:none!important;transition:none!important;transform:none!important;opacity:1!important}.flip-flap{animation:none!important}}
.map-state{transition:filter .25s}
.map-state:hover,.map-state:focus-visible{fill:#f01923!important;stroke:#ff6e74!important}
@media(prefers-reduced-motion:reduce){.map-state{transition:none}}
.map-state,.map-figure.is-visible .map-state{fill:#b4232a;fill-opacity:.92;stroke:#ffffff6b;stroke-width:1;opacity:1;transform:none;animation:none;transition:filter .25s}
.map-state:hover,.map-state:focus-visible{fill:#d63139!important;fill-opacity:1!important;stroke:#fff!important}
body{background:#050506}
.emigration{background:#050506}
.emigration__grain{display:block;z-index:0;width:100%;height:100%;background:none;opacity:.1;animation:none;image-rendering:pixelated}
.emigration__inner{position:relative;z-index:1}
.emigration__inner{grid-template-columns:minmax(0,32%) minmax(0,68%);gap:0}
.map-svg{width:116%;max-height:none;margin-left:-8%}
.title-dot{display:inline;color:var(--red);font-weight:inherit;font-style:inherit;white-space:inherit}.source__arrow{color:var(--red)}
.source{border-top-color:var(--red)}
.source a:hover,.source a:focus-visible{color:#fff}
.petition-widget{min-height:68px;bottom:clamp(95px,9vw,150px);gap:18px;padding:11px 18px;background:#070708e8;border:1px solid #ffffff66;border-radius:6px;box-shadow:0 10px 32px #0008;backdrop-filter:blur(8px)}
.petition-widget__link{display:inline-flex;align-items:center;gap:12px;font-family:Inter,Arial,sans-serif;font-size:16px;font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.petition-widget__link span{margin:0;color:var(--red);font:400 21px Inter,Arial,sans-serif;vertical-align:baseline}
.petition-widget__rule{height:39px;background:#ffffff44}
.petition-widget__metric{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:109px}
.flip-counter{display:block;width:100%;font-family:Inter,Arial,sans-serif;font-size:25px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.055em;text-align:left}
.petition-widget__caption{font-size:9px;font-weight:700;line-height:1.1;letter-spacing:.09em;color:var(--red)}
@media(max-width:760px){
  .emigration__inner{display:block}
  .map-figure{width:calc(100% + 20px);margin:55px 0 55px 0}
  .map-svg{width:100%;margin-left:0;transform:scale(1.25);transform-origin:center center}
  .petition-widget{right:14px;left:auto;bottom:53px;min-height:61px;gap:13px;padding:9px 14px}
  .petition-widget__link{font-size:14px;gap:7px}
  .petition-widget__link span{font-size:18px}
  .petition-widget__rule{height:34px}
  .petition-widget__metric{min-width:99px}
  .flip-counter{font-size:22px}
  .petition-widget__caption{font-size:8px}
}
.emigration__title .title-dot{display:inline;white-space:inherit}
@media(min-width:761px){
  .map-caption[data-destination="us"] .map-label,
  .map-caption[data-destination="us"] .map-value{transform:translate(55px,-30px)}
}

/* Full-screen campaign menu, following the original site's navigation. */
.site-header{isolation:isolate}
.menu-toggle{position:relative;z-index:62;display:grid;align-content:center;gap:5px;width:28px;height:30px;padding:2px;border:0;border-radius:0;background:none}
.menu-toggle:hover,.menu-toggle[aria-expanded="true"]{background:none;border:0}
.menu-toggle span{height:1.5px;background:#fff}
.menu-toggle:hover span,.menu-toggle[aria-expanded="true"] span{background:#fff}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;transform:none}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.menu-panel{position:fixed;z-index:60;inset:0;top:0;right:0;display:flex;flex-direction:column;justify-content:flex-start;min-width:0;width:100vw;height:100dvh;padding:clamp(72px,12vh,120px) clamp(24px,5.5vw,100px) 44px;background:#040509ed;border:0;box-shadow:none;overflow-y:auto;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .32s ease,visibility .32s}
.menu-panel::before,.menu-panel::after{content:"";flex:1 0 24px}
.menu-panel[hidden]{display:none}
.menu-panel.is-open{opacity:1;visibility:visible;pointer-events:auto}
.menu-panel__main,.menu-panel__secondary{display:flex;flex-direction:column;align-items:flex-start}
.menu-panel__main{gap:4px}
.menu-panel__main a{display:block;padding:0;border:0;color:#f3f0eadd;text-decoration:none;font-family:Playfair,Georgia,serif;font-size:clamp(22px,2.15vw,32px);font-weight:400;line-height:1.25;letter-spacing:-.03em;transition:opacity .2s,transform .3s}
.menu-panel__main a:hover{opacity:.55;transform:translateX(8px);text-decoration:none}
.menu-panel__secondary{flex-direction:row;flex-wrap:wrap;gap:8px 32px;margin-top:clamp(18px,3vh,32px)}
.menu-panel__secondary a{display:inline-block;padding:0;border:0;color:#f3f0eacc;text-decoration:none;font-family:Playfair,Georgia,serif;font-size:16px;font-weight:400;letter-spacing:0}
.menu-panel__secondary a:hover{color:#fff;text-decoration:underline}
html.menu-open{overflow:hidden}
@media(max-width:760px){
  .brand{display:none}
  .header-actions{margin-left:auto}
  .hero__image{top:0}
  .menu-toggle{width:28px;height:30px;padding:2px;gap:5px}
  .menu-panel{padding:90px 24px 50px}
  .menu-panel__main a{font-size:clamp(20px,5.4vw,26px);line-height:1.28}
  .menu-panel__secondary{gap:12px 24px;margin-top:22px}
  .menu-panel__secondary a{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.menu-panel,.menu-toggle,.menu-toggle span,.menu-panel__main a{transition:none}}
@media(max-width:760px){
  .map-caption[data-destination="us"] .map-label,
  .map-caption[data-destination="us"] .map-value{transform:translate(75px,-40px)}
  .map-caption[data-destination="at"] .map-label,
  .map-caption[data-destination="at"] .map-value{transform:translate(-90px,42px)}
  .map-caption[data-destination="es"] .map-label,
  .map-caption[data-destination="es"] .map-value{transform:translateX(18px)}
}

/* A deeper diagonal seam holds the pixel liquid above the red cut. */
:root{--seam-depth:min(11vw,150px)}
.hero{clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - var(--seam-depth)))}
.emigration{margin-top:calc(-1 * var(--seam-depth));padding-top:calc(var(--seam-depth) + 20px)}
.emigration__edge{display:none}
.hero__blood{position:absolute;z-index:0;left:0;bottom:0;width:100%;height:calc(var(--seam-depth) + 60px);image-rendering:pixelated;pointer-events:none}
.emigration__bleed{position:absolute;z-index:3;left:0;top:0;width:100%;height:calc(var(--seam-depth) + 150px);pointer-events:none}
.petition-widget{z-index:2}
@media(max-width:760px){
  :root{--seam-depth:13vw}
  .hero{clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - var(--seam-depth)))}
  .emigration{margin-top:calc(-1 * var(--seam-depth));padding-top:calc(var(--seam-depth) + 20px)}
}

/* The second panel rises over a pinned hero as the reader scrolls.
   Der Pin endet mit der Karte (siehe .hero-pin), sonst klebt der Hero bis zum Seitenende. */
body{overflow-x:clip}
.hero-pin{display:flow-root}
.hero{position:sticky;top:0;--slide-progress:0}
.hero__image{transform:translate3d(0,calc(var(--slide-progress) * -18px),0) scale(calc(1 + var(--slide-progress) * .065));transform-origin:center 42%;will-change:transform}
.hero__shade{opacity:calc(.65 + var(--slide-progress) * .35)}
.emigration{z-index:3;clip-path:polygon(0 0,100% var(--seam-depth),100% 100%,0 100%)}
@media(prefers-reduced-motion:reduce){.hero__image{transform:none;will-change:auto}.hero__shade{opacity:1}}

/* Petition ticker: individual split cards with a brief turnover on each estimate step. */
.petition-widget{gap:14px;min-height:72px;padding:9px 18px;border-color:#ffffff75;border-radius:999px;background:#080809ed}
.petition-widget__link{gap:10px;font-size:15px;font-weight:600}
.petition-widget__rule{height:43px;flex:none;background:#ffffff38}
.petition-widget__metric{display:block;min-width:0}
.flip-counter{display:inline-flex;align-items:center;gap:3px;width:auto;font-size:initial;letter-spacing:normal}
.ticker-digit{position:relative;display:inline-block;width:26px;height:43px;flex:none;perspective:150px;color:#f4f4f4;font:700 28px/43px Inter,Arial,sans-serif;text-align:center;box-shadow:0 1px 6px #000b}
.ticker-digit__old,.ticker-digit__new{position:absolute;inset:0;display:block;overflow:hidden;border:1px solid #28282b;border-radius:3px;background:linear-gradient(#202023 0 49%,#111113 50% 100%);backface-visibility:hidden;transform-origin:center center}
.ticker-digit__old::after,.ticker-digit__new::after{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:#050506bb;box-shadow:0 1px #5a5a5d5c}
.ticker-digit__new{transform:rotateX(90deg)}
.ticker-digit.is-flipping .ticker-digit__old{animation:ticker-out .27s ease-in both}
.ticker-digit.is-flipping .ticker-digit__new{animation:ticker-in .34s ease-out .27s both}
.ticker-separator{align-self:end;margin:0 -1px 4px;color:#ddd;font:700 27px/1 Inter,Arial,sans-serif}
.petition-widget__caption{display:flex;flex-direction:column;gap:3px;flex:none;color:var(--red);font-size:10px;line-height:1.1;letter-spacing:.035em}
.petition-widget__caption span{color:#bcbcbc;font-size:9px;font-weight:500;letter-spacing:0;text-transform:none;white-space:nowrap}
@keyframes ticker-out{to{transform:rotateX(-90deg)}}
@keyframes ticker-in{to{transform:rotateX(0)}}
@media(max-width:760px){
  .petition-widget{right:10px;left:auto;gap:8px;min-height:57px;padding:7px 10px}
  .petition-widget__link{gap:4px;font-size:12px}
  .petition-widget__link span{font-size:17px}
  .petition-widget__rule{height:34px}
  .flip-counter{gap:2px}
  .ticker-digit{width:19px;height:33px;font-size:21px;line-height:33px}
  .ticker-separator{font-size:21px;margin-bottom:3px}
  .petition-widget__caption{font-size:9px}
  .petition-widget__caption span{font-size:8px}
}
@media(max-width:385px){
  .petition-widget{right:7px;gap:6px;padding-inline:8px}
  .petition-widget__link{font-size:11px}
  .ticker-digit{width:17px;height:31px;font-size:19px;line-height:31px}
  .petition-widget__caption span{font-size:7.5px}
}
@media(prefers-reduced-motion:reduce){.ticker-digit.is-flipping .ticker-digit__old,.ticker-digit.is-flipping .ticker-digit__new{animation:none}}

/* Minimal, thin petition ticker. */
.petition-widget{gap:11px;min-height:48px;padding:5px 12px;border:1px solid #ffffff72;border-radius:999px;background:#080809f2}
.petition-widget__link{gap:5px;font-size:14px;font-weight:600;line-height:1;white-space:nowrap}
.petition-widget__link span{font-size:18px}
.petition-widget__rule{height:30px}
.petition-widget__metric{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.flip-counter{gap:2px}
.ticker-digit{width:21px;height:29px;font-size:21px;line-height:29px}
.ticker-separator{font-size:21px;margin-bottom:3px}
.petition-widget__caption{display:block;color:#bcbcc0;font-size:8px;font-weight:500;line-height:1;letter-spacing:.015em;text-transform:none;white-space:nowrap}
.flip-counter.is-counting .ticker-digit.is-flipping .ticker-digit__old{animation-duration:.04s}
.flip-counter.is-counting .ticker-digit.is-flipping .ticker-digit__new{animation-duration:.045s;animation-delay:.04s}
@media(max-width:760px){
  .petition-widget{right:12px;gap:9px;min-height:44px;padding:4px 10px}
  .petition-widget__link{font-size:13px}
  .petition-widget__link span{font-size:17px}
  .petition-widget__rule{height:27px}
  .ticker-digit{width:18px;height:26px;font-size:18px;line-height:26px}
  .ticker-separator{font-size:18px;margin-bottom:2px}
  .petition-widget__caption{font-size:7px}
}
@media(max-width:385px){
  .petition-widget{right:8px;gap:7px;padding-inline:8px}
  .petition-widget__link{font-size:12px}
  .ticker-digit{width:16px;height:24px;font-size:16px;line-height:24px}
  .ticker-separator{font-size:16px}
  .petition-widget__caption{font-size:6.5px}
}
/* Desktop keeps a fixed diagonal seam and places the four destinations around the map. */
@media(min-width:761px){
  .hero{position:relative;top:auto}
  .hero__image{transform:none;will-change:auto}
  .hero__shade{opacity:1}
  .map-figure{left:clamp(12px,2.2vw,32px)}
  .map-arrow{stroke:#f0f0f2;stroke-width:1.65;opacity:.9}
  .map-arrow-origin{fill:#ed1018;stroke:#f4f4f4;stroke-width:1.2;vector-effect:non-scaling-stroke}
  .map-label{font-size:21px;stroke-width:4px}
  .map-value{font-size:16px;stroke-width:4px}
  .map-caption[data-destination="us"] .map-label,
  .map-caption[data-destination="us"] .map-value{transform:none}
}

/* Match the mobile hero to the artwork, leaving only the diagonal blood seam below it. */
@media(max-width:760px){
  .hero{height:calc(56vw - 8px);min-height:0}
  .petition-widget{bottom:calc(var(--seam-depth) - 8px)}
}

/* Quiet editorial globe and the next red chapter. */
.stories-globe{position:relative;z-index:4;isolation:isolate;overflow:hidden;padding-top:clamp(72px,9vh,120px);background:#050506}
.stories-globe__grain{position:absolute;z-index:-1;inset:0;width:100%;height:100%;opacity:.1;pointer-events:none}
.stories-globe__intro{position:relative;z-index:3;padding:0 20px;text-align:center}
.stories-globe__title{margin:0;font:italic 400 clamp(78px,9vw,152px)/.98 Playfair,Georgia,serif;letter-spacing:-.065em}
.stories-globe__subtitle{margin:20px 0 0;color:#bdbdc0;font-size:clamp(14px,1.25vw,18px);line-height:1.4}
.stories-globe__subtitle a,.globe-empty a{text-decoration-thickness:1px;text-underline-offset:5px}
.stories-globe__subtitle a:hover,.globe-empty a:hover{color:#fff}
.stories-globe__submit-note{position:absolute;left:50%;top:100%;z-index:8;width:max-content;max-width:calc(100vw - 32px);margin:8px 0 0;padding:8px 12px;transform:translateX(-50%);border:1px solid #ffffff38;background:#101012;color:#e7e7e9;font-size:12px}
.stories-globe__submit-note[hidden]{display:none}
.globe-shell{position:relative;z-index:2;width:100%;height:clamp(500px,65vh,700px);margin-top:clamp(72px,9vh,128px)}
.globe-stage{position:relative;width:100%;height:calc(100% - 34px);overflow:hidden}
.globe-svg{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab;outline:none}
.globe-svg.is-dragging{cursor:grabbing}
.globe-sphere{fill:#151517;stroke:#77777a;stroke-opacity:.55;stroke-width:1.2;vector-effect:non-scaling-stroke}
.globe-country{fill:#1c1c1e;stroke:#a3a3a8;stroke-opacity:.5;stroke-width:.82;vector-effect:non-scaling-stroke;cursor:pointer;transition:fill .2s,stroke-opacity .2s,opacity .2s}
.globe-country:hover,.globe-country.is-hovered,.globe-country:focus-visible{fill:#4d171d;stroke:#e0e0e1;stroke-opacity:.9;outline:none}
.globe-country:focus,.globe-hit-target:focus{outline:none}
.globe-country.is-selected{fill:#7d151c;stroke:#f3dedf;stroke-opacity:1}
.globe-stage.has-selection .globe-country:not(.is-selected){opacity:.52}
.globe-route{fill:none;stroke:#db1c27;stroke-width:1.4;stroke-opacity:.73;vector-effect:non-scaling-stroke;pointer-events:none;transition:stroke-opacity .25s}
.globe-route.is-muted{stroke-opacity:.12}
.globe-route.is-selected{stroke-width:1.9;stroke-opacity:.95}
.globe-marker{fill:#f01722;stroke:#09090b;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}
.globe-marker--origin{fill:#ff2630;stroke:#fce5e6;stroke-width:1.2}
.globe-hit-target{fill:#fff;fill-opacity:0;stroke:none;cursor:pointer;pointer-events:all}
.globe-hit-target:focus-visible{stroke:#fff;stroke-opacity:.8;stroke-width:1.5;outline:none}
.globe-tooltip{position:absolute;z-index:9;min-width:160px;max-width:195px;padding:8px 10px;background:#111114ed;border-left:2px solid #d4121d;pointer-events:none;color:#eee}
.globe-tooltip[hidden]{display:none}
.globe-tooltip strong{display:block;font-size:13px;font-weight:600}
.globe-tooltip span{display:block;margin-top:2px;color:#bcbcc0;font-size:11px}
.globe-focus{position:absolute;z-index:8;top:26px;left:clamp(20px,4vw,65px);max-width:45%;pointer-events:none}
.globe-focus span{display:block;color:#d8222a;font-size:10px;letter-spacing:.1em}
.globe-focus strong{display:block;margin-top:7px;font:400 clamp(30px,3.6vw,55px)/1.05 Playfair,Georgia,serif}
.globe-focus small{display:block;margin-top:6px;color:#d0d0d3;font-size:12px}
.globe-back{position:absolute;z-index:9;top:29px;right:clamp(20px,4vw,65px);padding:6px 0;border:0;border-bottom:1px solid #ffffff80;background:none;color:#eee;font-size:12px;letter-spacing:.02em}
.globe-back:hover{border-color:#ed1018;color:#fff}
.globe-empty{position:absolute;z-index:8;left:50%;bottom:12%;width:max-content;max-width:calc(100% - 32px);padding:15px 19px;transform:translateX(-50%);background:#111114f2;border-top:1px solid #a70d16;text-align:center}
.globe-empty p{margin:0 0 8px;font:400 19px Playfair,Georgia,serif}
.globe-empty a{color:#ddd;font-size:12px}
.globe-hint{margin:10px 0 0;color:#9c9ca0;font-size:11px;letter-spacing:.05em;text-align:center}
.story-dialog{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:38px clamp(24px,4vw,45px) 42px;background:#111113;color:#eee;border:1px solid #8d8d914f;border-top:2px solid #ce1520;box-shadow:0 25px 80px #000c}
.story-dialog::backdrop{background:#030304d9}
.story-dialog__close{position:absolute;top:14px;right:19px;border:0;background:none;color:#eee;font-size:31px;line-height:1}
.story-dialog__eyebrow{margin:0 0 13px;color:#e42630;font-size:10px;letter-spacing:.1em}
.story-dialog h2{margin:0;font:400 clamp(40px,6vw,62px)/1 Playfair,Georgia,serif;letter-spacing:-.045em}
.story-dialog__meta,.story-dialog__route{margin:12px 0 0;color:#c9c9cc;font-size:14px}
.story-dialog__route{padding-bottom:20px;border-bottom:1px solid #ffffff45}
.story-dialog h3{margin:25px 0 8px;font:italic 400 24px Playfair,Georgia,serif}
.story-dialog p:not(.story-dialog__eyebrow){line-height:1.5}
@media(max-width:760px){
  .stories-globe{padding-top:75px}
  .stories-globe__title{font-size:clamp(59px,13vw,90px)}
  .stories-globe__subtitle{max-width:310px;margin:17px auto 0;font-size:14px}
  .globe-shell{height:clamp(390px,62vh,520px);margin-top:80px}
  .globe-stage{height:calc(100% - 38px)}
  .globe-country{stroke-width:.9}
  .globe-focus{top:16px;left:17px;max-width:55%}
  .globe-focus strong{font-size:29px}
  .globe-back{top:18px;right:17px}
  .globe-hint{margin-inline:20px;font-size:10px}
      }
@media(prefers-reduced-motion:reduce){.story-bubble{animation:none;opacity:1;transform:none}.story-bubble__preview{transition:none}}

/* ---------------------------------------------------------------------------
   Globus: Zahlen-Anzeige, Quelle, schwebende Kreise im Land
   --------------------------------------------------------------------------- */
.globe-focus{max-width:min(46%,520px)}
.globe-focus .gf-eyebrow{color:#ed1018}
.globe-focus .gf-number{display:block;margin-top:12px;font:400 clamp(44px,5.6vw,88px)/.95 Playfair,Georgia,serif;letter-spacing:-.04em;font-variant-numeric:lining-nums tabular-nums;color:#f6f1f1}
.globe-focus .gf-unit{display:block;margin-top:8px;color:#d0d0d3;font-size:13px;line-height:1.35;letter-spacing:0;text-transform:none}
.globe-focus .gf-delta{display:block;margin-top:8px;color:#a8a8ad;font-size:12px}
.globe-focus .gf-count{margin:14px 0 0;color:#ed4a50;font-size:12px;line-height:1.4}
.globe-focus .gf-number[hidden],.globe-focus .gf-unit[hidden],.globe-focus .gf-count[hidden]{display:none}
.globe-country.has-data{fill:#2a1517}
.globe-country.has-data:hover,.globe-country.has-data.is-hovered,.globe-country.has-data:focus-visible{fill:#5a1a20}
.globe-country.is-selected,.globe-country.has-data.is-selected{fill:#5c1219}
.globe-stage.has-selection .globe-country:not(.is-selected){opacity:.4}
.globe-source{max-width:760px;margin:6px auto 0;padding:0 20px;color:#85858a;font-size:10px;line-height:1.5;text-align:center}
.globe-source a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.globe-source a:hover{color:#ddd}

/* Kreise (eine Person je Kreis) */
.gb{cursor:pointer;outline:none}
.gb__in{transform-box:fill-box;transform-origin:center;animation:gb-in .7s cubic-bezier(.2,.8,.2,1) both}
.gb__float{animation:gb-drift var(--dur,7s) ease-in-out var(--delay,0s) infinite alternate}
.gb__c{fill:#0a0a0c;fill-opacity:.9;stroke:#fff;stroke-opacity:.72;stroke-width:1.2;vector-effect:non-scaling-stroke;transition:stroke-opacity .2s}
.gb__t{fill:#f4f4f4;font-family:Playfair,Georgia,serif;font-style:italic;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.gb.is-hot{opacity:0}
.gb:focus-visible .gb__c{stroke:#fff;stroke-opacity:1;stroke-width:2.4}
.gh__pop{animation:gh-pop .22s cubic-bezier(.2,.9,.3,1.3) both;transform-box:fill-box;transform-origin:center}
.gh__c{fill:#1a0a0c;stroke:#ed1018;stroke-width:2;vector-effect:non-scaling-stroke}
.gh__t{fill:#fff;font-family:Playfair,Georgia,serif;font-style:italic;text-anchor:middle;dominant-baseline:central}
.gh__name,.gh__job{text-anchor:middle;paint-order:stroke;stroke:#050506;stroke-width:5px;stroke-linejoin:round}
.gh__name{fill:#fff;font:500 14px Inter,Arial,sans-serif}
.gh__job{fill:#d6d6d9;font:400 11px Inter,Arial,sans-serif}
.gh__label{animation:gh-label .2s ease-out both}
@keyframes gb-in{from{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}
@keyframes gb-drift{0%{transform:translate(0,0)}50%{transform:translate(var(--ax,0),var(--ay,0))}100%{transform:translate(var(--bx,0),var(--by,0))}}
@keyframes gh-pop{from{transform:scale(.65)}to{transform:scale(1)}}
@keyframes gh-label{from{opacity:0}to{opacity:1}}
@media(max-width:760px){
  .globe-focus .gf-number{font-size:42px}
  .globe-focus .gf-unit{font-size:11px}
  .globe-focus .gf-delta{font-size:10px}
  .globe-focus .gf-count{font-size:10px}
  .globe-source{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.gb__in,.gb__float,.gh__pop,.gh__label{animation:none}}
.globe-focus[hidden],.globe-back[hidden],.globe-empty[hidden]{display:none}

/* ---------------------------------------------------------------------------
   Handy: Länderansicht ohne Überlagerung, Profil mittig
   --------------------------------------------------------------------------- */
@media(max-width:760px){
  .globe-shell{height:clamp(540px,82svh,700px)}
  .globe-stage{height:calc(100% - 34px)}
  /* Infokarte unten im Globus-Feld, Land liegt darüber */
  .globe-focus{top:auto;bottom:0;left:0;right:0;max-width:none;padding:34px 16px 12px;background:linear-gradient(#05050600,#050506f2 38%);display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:end}
  .globe-focus[hidden]{display:none}
  .globe-focus .gf-eyebrow{grid-column:1/-1}
  .globe-focus strong{margin:4px 0 0;font-size:26px;line-height:1.05}
  .globe-focus .gf-number{margin:0;font-size:38px;text-align:right}
  .globe-focus .gf-unit,.globe-focus .gf-delta,.globe-focus .gf-count{grid-column:1/-1;margin-top:6px;font-size:10.5px}
  .globe-focus .gf-count{margin-top:6px}
  .globe-back{top:12px;right:14px;background:#050506b3;padding:6px 8px;border:1px solid #ffffff55;border-radius:999px;border-bottom:1px solid #ffffff55}
  /* Profil-Fenster: mittig in der Bildschirmmitte */
  .story-dialog{position:fixed;inset:0;margin:auto;width:calc(100% - 32px);max-width:440px;height:fit-content;max-height:calc(100dvh - 40px);overflow-y:auto;padding:46px 22px 30px;text-align:center}
  .story-dialog__close{top:8px;right:10px;width:44px;height:44px}
  .story-dialog h2{font-size:clamp(38px,11vw,52px)}
  .story-dialog__route{padding-bottom:18px}
  .story-dialog h3{font-size:22px}
}
/* In der Länderansicht keine Berlin-Linie quer über Land und Kreise */
.globe-stage.has-selection .globe-route{opacity:0!important}

/* Kein seitliches Überstehen: Hero-Bild und Karten-SVG ragen auf dem Handy über die Breite hinaus
   und vergrößerten sonst den Layout-Viewport (Seite wirkt verschoben, Dialoge nicht mittig). */
html,body{overflow-x:clip;max-width:100%}
.hero{overflow:hidden}
.emigration{overflow-x:clip}

/* ---------------------------------------------------------------------------
   Übergang Deutschlandkarte -> „Sie fehlen.“
   Der Globus-Abschnitt ist eine gerade, schwarze Ebene, die sich über die Karte
   schiebt. Die Karte wird dabei kleiner, dunkler und grau (--ov, gesetzt in
   main.js). Auf der Naht liegt eine Haarlinie als Kapitel-Trenner.
   --------------------------------------------------------------------------- */
:root{--arc-lap:80px}
@media(max-width:760px){:root{--arc-lap:50px}}

/* Karte: Platz für die Überlappung, Inhalt weicht zurück */
.emigration{padding-bottom:calc(var(--arc-lap) - 14px)}
.emigration__inner{position:relative;z-index:1;transform-origin:50% 92%;transform:scale(calc(1 - var(--ov,0) * .055));will-change:transform}
.emigration__dim{position:absolute;inset:0;z-index:3;background:#050506;opacity:calc(var(--ov,0) * .86);pointer-events:none}
.emigration .map-figure{filter:none}

/* Globus-Abschnitt: gerade Ebene */
.stories-globe{overflow:visible;overflow-x:clip;margin-top:calc(-1 * var(--arc-lap));padding-top:clamp(70px,9vh,96px);background:transparent}
.sf-sheet{position:absolute;inset:0;z-index:-2;pointer-events:none;background:#050506}
.stories-globe__grain{z-index:0}

/* Kapitel-Trenner auf der Naht */
.sf-break{position:absolute;z-index:4;left:0;right:0;top:0;height:0;pointer-events:none}
.sf-break__line{position:absolute;left:clamp(20px,4vw,72px);right:clamp(20px,4vw,72px);top:0;height:1px;background:linear-gradient(90deg,#ffffff00,#ffffffb0 14%,#ffffffb0 86%,#ffffff00);transform:scaleX(var(--ln,0));transform-origin:50% 50%;will-change:transform}
.sf-break__dot{position:absolute;left:50%;top:0;width:9px;height:9px;margin:-4px 0 0 -4px;border-radius:50%;background:#ed1018;box-shadow:0 0 0 4px #ed101833;transform:scale(0);transition:transform .45s cubic-bezier(.3,1.6,.5,1) .1s}
.sf-break.is-in .sf-break__dot{transform:scale(1)}

.stories-globe__intro{position:relative;z-index:3}
.stories-globe__subtitle{margin-top:22px}

/* Die vier Länder der Karte leuchten zuerst, danach zeichnen sich die übrigen Routen ein */
.globe-route{opacity:0;transition:opacity 1s ease}
.stories-globe.lead-on .globe-route.is-lead,.stories-globe.all-on .globe-route{opacity:1}
.globe-marker:not(.globe-marker--origin){opacity:0;transition:opacity .9s ease}
.stories-globe.lead-on .globe-marker.is-lead,.stories-globe.all-on .globe-marker{opacity:1}
.globe-marker--origin{opacity:0;transition:opacity .6s ease}
.stories-globe.lead-on .globe-marker--origin,.stories-globe.all-on .globe-marker--origin{opacity:1}
.globe-country.is-lead{transition:fill 1.6s ease}
.stories-globe.lead-on .globe-country.is-lead{fill:#a3141d}
.stories-globe.all-on .globe-country.is-lead:not(.is-selected){fill:#3a1519}

@media(prefers-reduced-motion:reduce){
  .emigration__inner{transform:none;will-change:auto}
  .emigration__dim{opacity:0}
  .emigration .map-figure{filter:none}
  .globe-route,.globe-marker,.globe-country.is-lead{transition:none}
  .sf-break__dot{transition:none}
}

/* ===========================================================================
   Kapitel 03–06 (nach Vorlage): roter Keil mit Ausklapp-Zeilen · Postkarten an Fäden ·
   Entwicklungen/Papier auf Berliner Skyline · Atlas · Footer. Alle Trennungen schräg.
   Bestehende Slides bleiben unverändert.
   =========================================================================== */
:root{
  --rd1:8.8vw;            /* roter Keil: oben fällt die Kante nach rechts ab */
  --rd2:6.2vw;            /* roter Keil: unten steigt die Kante nach rechts an */
  --dev-t:1.9vw;          /* Entwicklungen: Oberkante fällt leicht nach rechts */
  --dev-b:4.8vw;          /* Entwicklungen/Unterstützer: gemeinsame Kante steigt nach rechts */
  --pk-up:clamp(140px,17vw,280px);
  --cream:#fbece5;
  --padx:clamp(22px,6vw,112px);
}

/* Globus-Slide: unten Luft für den roten Keil; wird beim Überdecken gedimmt */
.stories-globe{padding-bottom:clamp(36px,4.5vw,64px)}
.sf-dim{position:absolute;inset:0;z-index:7;background:#050506;opacity:calc(var(--ov2,0) * .72);pointer-events:none}

/* Textzeile, die aus einer Maske hochfährt */
.ln{display:block;overflow:hidden;padding-bottom:.16em;margin-bottom:-.16em}
.ln>*{display:block;transform:translateY(110%);transition:transform 1.1s cubic-bezier(.2,.8,.2,1) var(--td,0s)}
.is-in .ln>*{transform:none}

/* Schräge Haarlinie (Bandstück entlang einer Kante) */
.edge{position:absolute;left:0;right:0;pointer-events:none;display:block;background:linear-gradient(90deg,#ffffff99,#ffffffc8 40%,#ffffff80)}

/* ---------------------------------------------------------------------------
   03 · Forderungen — roter Keil wie in der Vorlage
   --------------------------------------------------------------------------- */
.chg-wrap{position:relative;z-index:5;margin-top:calc(-1 * var(--rd1));isolation:isolate;filter:drop-shadow(0 1.4vw 2.6vw #000000a6)}
.chg{position:relative;isolation:isolate;color:var(--cream);clip-path:polygon(0 0,100% var(--rd1),100% calc(100% - var(--rd2)),0 100%);padding:clamp(44px,6.2vw,120px) var(--padx) clamp(44px,7vw,130px)}
.chg__sheet{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(90% 110% at 16% 14%,#ff3a34 0,transparent 58%) 0 0/100% 100%,
  radial-gradient(80% 90% at 100% 100%,#33000299,transparent 68%),
  linear-gradient(185deg,#c4121b 0,#b50f18 52%,#9a0a11 100%);
  box-shadow:inset 0 0 9vw #4a0006aa}
.chg__sheet::before{content:"";position:absolute;inset:0;background:url('./assets/stoff.svg') 0 0/1400px auto;mix-blend-mode:soft-light;opacity:.62}
.chg__sheet::after{content:"";position:absolute;inset:0;background:url('./assets/noise.svg') 0 0/200px;mix-blend-mode:multiply;opacity:.5}
.edge--chg-top{top:0;height:var(--rd1);clip-path:polygon(0 0,100% calc(100% - 1.6px),100% 100%,0 1.6px);background:linear-gradient(90deg,#ffffff00,#ffffff70 20%,#ffffffd0)}

.chg__inner{position:relative;max-width:1700px;margin:0 auto}
.chg__title{margin:0;font-family:Playfair,Didot,Georgia,serif;font-weight:800;font-size:clamp(56px,8.8vw,172px);line-height:.9;letter-spacing:-.052em;color:var(--cream);text-shadow:0 .12vw 0 #5a000622}
.chg__title em{font-style:italic;font-weight:800;letter-spacing:-.055em;padding-right:.12em}
.chg__title .ln:nth-child(2)>*{--td:.14s}
.chg__lead{margin:clamp(12px,1.6vw,26px) 0 0;font:300 clamp(15px,1.55vw,26px) Inter,Arial,sans-serif;letter-spacing:-.005em;color:#ffe9e1;opacity:0;transform:translateY(14px);transition:opacity .8s ease .5s,transform .8s ease .5s}
.is-in .chg__lead{opacity:1;transform:none}

.chg__list{list-style:none;margin:clamp(22px,3vw,52px) 0 0;padding:0}
.chg__row{position:relative}
.chg__row::before,.chg__row:last-child::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:#4a0007b3;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.3s cubic-bezier(.2,.7,.2,1) calc(.5s + var(--i) * .1s)}
.chg__row:last-child::after{top:auto;bottom:0}
.is-in .chg__row::before,.is-in .chg__row:last-child::after{transform:scaleX(1)}
.chg__head{position:relative;display:grid;grid-template-columns:clamp(34px,7.4vw,140px) minmax(0,1fr) clamp(30px,3.4vw,58px);grid-template-areas:"no name plus" ". short .";align-items:center;row-gap:clamp(2px,.35vw,8px);width:100%;margin:0;padding:clamp(11px,1.15vw,20px) 0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.chg__head:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:2px}
.chg__no{grid-area:no;font:400 clamp(10px,.95vw,15px) Inter,Arial,sans-serif;letter-spacing:.08em;color:#ffd9cf}
.chg__name{grid-area:name;font:700 clamp(30px,4.3vw,84px)/1 Playfair,Didot,Georgia,serif;letter-spacing:-.042em;color:var(--cream);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.chg__short{grid-area:short;font:300 clamp(12px,1.2vw,19px)/1.45 Inter,Arial,sans-serif;color:#ffe9e1;max-width:30em}
.chg__no,.chg__name,.chg__short,.chg__plus{opacity:0;transform:translateY(20px);transition:opacity .85s ease calc(.6s + var(--i) * .1s),transform .95s cubic-bezier(.2,.8,.2,1) calc(.6s + var(--i) * .1s)}
.is-in .chg__no,.is-in .chg__name,.is-in .chg__short,.is-in .chg__plus{opacity:1;transform:none}
.chg__head:hover .chg__name,.chg__row.is-open .chg__name,.chg__head:hover .chg__short,.chg__row.is-open .chg__short{transform:translateX(.7vw)}
.chg__plus{grid-area:plus;position:relative;justify-self:end;width:clamp(24px,2vw,34px);aspect-ratio:1;border:1px solid #ffe3da8c;border-radius:50%;transition:background .3s,border-color .3s,opacity .85s ease calc(.6s + var(--i) * .1s),transform .95s cubic-bezier(.2,.8,.2,1) calc(.6s + var(--i) * .1s)}
.chg__plus::before,.chg__plus::after{content:"";position:absolute;left:50%;top:50%;width:44%;height:1px;background:#ffeee8;transform:translate(-50%,-50%);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.chg__plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.chg__head:hover .chg__plus{background:#ffffff26;border-color:#fff}
.chg__row.is-open .chg__plus::after{transform:translate(-50%,-50%) rotate(0)}
.chg__row.is-open .chg__plus{background:#ffffff2e;border-color:#fff}
/* Ausklappen */
.chg__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .65s cubic-bezier(.2,.8,.2,1)}
.chg__row.is-open .chg__panel{grid-template-rows:1fr}
.chg__panel-in{overflow:hidden;min-height:0;margin-left:calc(clamp(34px,7.4vw,140px) + 37.3vw);opacity:0;transform:translateY(-8px);transition:opacity .45s ease,transform .5s ease;padding-right:clamp(30px,3.4vw,58px)}
.chg__row.is-open .chg__panel-in{opacity:1;transform:none;transition-delay:.12s}
.chg__panel-in p{margin:0 0 clamp(10px,1vw,16px);max-width:34em;font:300 clamp(13px,1.28vw,20px)/1.55 Inter,Arial,sans-serif;color:#fff4ef}
.chg__panel-in a{display:inline-block;margin-bottom:clamp(14px,1.6vw,24px);padding-bottom:3px;font:400 clamp(12px,1vw,15px) Inter,Arial,sans-serif;color:#fff;border-bottom:1px solid #fff9;text-decoration:none}
.chg__panel-in a:hover{border-color:#fff}
.chg__more{display:inline-block;margin-top:clamp(16px,2.2vw,36px);padding-bottom:5px;font:300 clamp(12px,1.12vw,17px) Inter,Arial,sans-serif;color:#ffeee8;border-bottom:1px solid #ffeee8aa;text-decoration:none;opacity:0;transition:opacity .8s ease 1.4s,border-color .2s}
.is-in .chg__more{opacity:1}
.chg__more:hover{border-color:#fff;color:#fff}
.chg__more span{margin-left:6px}

/* ---------------------------------------------------------------------------
   04 · Postkarten: Fäden kommen unter der roten Kante hervor
   --------------------------------------------------------------------------- */
.pk{position:relative;z-index:4;margin-top:calc(-1 * var(--pk-up));padding-top:var(--pk-up)}
.pk::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(75% 60% at 56% 34%,#121214,#060607 74%)}
.pk__stage{position:relative;container-type:inline-size;aspect-ratio:1672/941;min-height:520px;width:100%;max-width:1900px;margin:0 auto}
.pk__unit{display:contents;--x:var(--dx);--y:var(--dy);--w:var(--dw);--t:var(--dt)}
.pk__thread{position:absolute;z-index:1;left:var(--x);top:calc(-1 * var(--pk-up));width:1.3px;margin-left:-.65px;height:calc(var(--pk-up) + var(--y));background:linear-gradient(#d9c8b4,#cbbba8);box-shadow:.6px 0 1px #0007;transform:scaleY(0);transform-origin:50% 0;transition:transform 1.5s cubic-bezier(.3,.7,.2,1) calc(var(--n) * .14s)}
.is-in .pk__thread{transform:scaleY(1)}
.pk__item{position:absolute;z-index:2;left:var(--x);top:var(--y);width:0;height:0}
.pk__swing{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;rotate:var(--t);opacity:0}
.pk__card{position:absolute;left:calc(var(--w) * var(--rx) * -1cqw);top:-.5cqw;width:calc(var(--w) * 1cqw);aspect-ratio:1.55;display:grid;grid-template-columns:42.5% 1fr;gap:3%;padding:3.6%;border-radius:.25cqw;
  background:
   linear-gradient(115deg,#ffffff55 0,transparent 34%,transparent 70%,#00000014 100%),
   linear-gradient(180deg,#f2eadc 0,#e6dccb 100%);
  box-shadow:0 .15cqw 0 #ffffff80 inset,0 0 0 1px #00000024,0 1.6cqw 3.2cqw #000000b8,0 .35cqw .8cqw #00000080;cursor:pointer}
.pk__card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(120% 90% at 50% 0,transparent 60%,#6a5a3f2e 100%);pointer-events:none}
.pk__card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:url('./assets/noise.svg') 0 0/150px;mix-blend-mode:multiply;opacity:.3;pointer-events:none}
.pk__photo{position:relative;margin:0;overflow:hidden;background:#97948e;box-shadow:inset 0 0 0 1px #0000002e,inset 0 0 1.6cqw #00000040}
.pk__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 10%;mix-blend-mode:multiply;filter:grayscale(1) contrast(1.14) brightness(1.02)}
.pk__back{position:relative}
.pk__stamp{position:absolute;right:1.5%;top:0;width:25%;aspect-ratio:.84;background:linear-gradient(160deg,#ee4b33,#d93a26);box-shadow:inset 0 0 0 .22cqw #f5e9dc99,0 0 0 .14cqw #0000001f;filter:saturate(.95)}
.pk__stamp::after{content:"";position:absolute;inset:0;background:url('./assets/noise.svg') 0 0/90px;mix-blend-mode:multiply;opacity:.45}
.pk__post{position:absolute;left:3%;top:5%;width:52%;height:26%;opacity:.85;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 34' fill='none' stroke='%2371695c' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M2 5c9-7 15 7 24 0s15 7 24 0 15 7 24 0 11 4 14 2'/%3E%3Cpath d='M2 14c9-7 15 7 24 0s15 7 24 0 15 7 24 0 11 4 14 2'/%3E%3Cpath d='M2 23c9-7 15 7 24 0s15 7 24 0 15 7 24 0 11 4 14 2'/%3E%3Cpath d='M2 32c9-7 15 7 24 0s15 7 24 0 15 7 24 0 11 4 14 2'/%3E%3C/svg%3E") center/contain no-repeat}
.pk__back i{position:absolute;left:5%;right:3%;height:1px;background:#8b8478;opacity:.75}
.pk__back i:nth-of-type(1){bottom:56%}.pk__back i:nth-of-type(2){bottom:42%}.pk__back i:nth-of-type(3){bottom:28%}.pk__back i:nth-of-type(4){bottom:14%}
.pk__ring{position:absolute;z-index:3;left:calc(var(--rx) * 100%);top:-.55cqw;width:.8cqw;min-width:8px;aspect-ratio:1;margin-left:-.4cqw;border-radius:50%;border:max(2px,.2cqw) solid #9a948a;background:#171614;box-shadow:0 0 0 1px #000a,0 .2cqw .4cqw #0009}

/* Hintergrund: unscharfe Karten, Seile, Parallax */
.pk__unit--bg .pk__item{translate:0 calc(var(--py,0) * var(--p,1) * -26px)}
.pk__unit--bg .pk__card{filter:blur(5.5px) brightness(.72);opacity:.62;cursor:default}
.pk__unit--bg .pk__thread{opacity:.4;filter:blur(1.3px)}
.pk__rope{position:absolute;z-index:0;top:-6%;width:1.4cqw;height:78%;background:linear-gradient(90deg,#00000000,#3a3631b0,#00000000);filter:blur(5px);opacity:.55;pointer-events:none}
.pk__rope--l{left:3.4%;rotate:4deg}
.pk__rope--r{right:2.2%;rotate:-3deg;height:60%;top:34%}

/* Text */
.pk__copy{position:absolute;z-index:4;left:6.4%;top:34.5%;width:37%}
.pk__title{margin:0;font:400 clamp(40px,6.7cqw,124px)/.98 Playfair,Didot,Georgia,serif;letter-spacing:-.05em;color:#fbf6f1;text-shadow:0 .2cqw .8cqw #000a}
.pk__title em{font-style:italic;padding-right:.12em;white-space:nowrap}
.pk__title .ln:nth-child(2)>*{--td:.12s}
.pk__title .ln:nth-child(3)>*{--td:.24s}
.pk__lead{margin:clamp(14px,1.8cqw,30px) 0 0;max-width:21em;font:400 clamp(16px,1.85cqw,32px)/1.34 Playfair,Georgia,serif;color:#efe6dd;opacity:0;transform:translateY(14px);transition:opacity .8s ease .5s,transform .8s ease .5s}
.is-in .pk__lead{opacity:1;transform:none}
.pk__action{position:relative;z-index:5;max-width:1900px;margin:clamp(16px,2vw,28px) auto 0;padding:0 var(--padx) clamp(48px,5.5vw,96px)}
.pk__cta{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:58px;padding:18px 28px;background:var(--red);color:#fff;border-radius:8px;font:600 clamp(16px,1.25vw,20px)/1.25 Inter,Arial,sans-serif;letter-spacing:-.01em;text-align:center;text-decoration:none;opacity:0;transition:opacity .8s ease .75s,background .2s}
.is-in .pk__cta{opacity:1}
.pk__cta span{min-width:0}
.pk__cta i{display:flex;flex:none;font-style:normal;color:#fff;line-height:0;transition:transform .25s}
.pk__cta:hover{background:#ff2a32}
.pk__cta:hover i{transform:translateX(6px)}
.pk__cta:active{transform:scale(.985)}

/* Karten: Einfallen am Faden, danach leises Pendeln, Hover = Wackeln */
.pk.is-in:not(.is-settled) .pk__swing{animation:pk-fall 1.35s var(--fall-e) calc(.35s + var(--n) * .17s) both,pk-rot 2.3s cubic-bezier(.3,.7,.3,1) calc(.35s + var(--n) * .17s) both,pk-fade .25s linear calc(.35s + var(--n) * .17s) both}
.pk.is-settled .pk__swing{opacity:1;animation:pk-sway var(--sw,7.5s) ease-in-out calc(var(--n) * -.9s) infinite alternate}
.pk.is-settled .pk__unit:not(.pk__unit--bg) .pk__swing:hover{animation:pk-wiggle 1.05s ease-in-out,pk-sway var(--sw,7.5s) ease-in-out 1.05s infinite alternate}
.pk__unit:not(.pk__unit--bg) .pk__card{transition:box-shadow .3s}
.pk__unit:not(.pk__unit--bg) .pk__card:hover{box-shadow:0 .15cqw 0 #ffffff80 inset,0 0 0 1px #00000024,0 2.2cqw 4cqw #000000d0,0 .35cqw .8cqw #00000080}
@keyframes pk-drop{0%{opacity:0;translate:0 -70vh;rotate:calc(var(--t) + 42deg)}35%{opacity:1}58%{translate:0 0;rotate:calc(var(--t) - 17deg)}74%{rotate:calc(var(--t) + 9deg)}88%{rotate:calc(var(--t) - 3.5deg)}100%{opacity:1;translate:0 0;rotate:var(--t)}}
@keyframes pk-sway{from{rotate:calc(var(--t) - 1.3deg)}to{rotate:calc(var(--t) + 1.3deg)}}
@keyframes pk-wiggle{0%{rotate:var(--t)}16%{rotate:calc(var(--t) + 8deg)}36%{rotate:calc(var(--t) - 7deg)}55%{rotate:calc(var(--t) + 4.5deg)}74%{rotate:calc(var(--t) - 2.4deg)}90%{rotate:calc(var(--t) + 1deg)}100%{rotate:var(--t)}}

/* ---------------------------------------------------------------------------
   05 · Aktuelle Entwicklungen / Papier — Keil auf Berliner Skyline
   --------------------------------------------------------------------------- */
.dev-wrap{position:relative;z-index:7}
.dev{position:relative;isolation:isolate;overflow:hidden;clip-path:polygon(0 0,100% var(--dev-t),100% calc(100% - var(--dev-b)),0 100%);background:#060607;padding:calc(var(--dev-t) + clamp(34px,4.2vw,80px)) var(--padx) calc(var(--dev-b) + clamp(30px,4vw,76px))}
.dev__bg{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#060607 0,#060607 18%,#06060700 55%),url('./assets/berlin-skyline.svg') 100% 60%/cover no-repeat;opacity:.95}
.dev__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#06060766,transparent 30%,#06060788 100%)}
.edge--dev-top{top:0;height:var(--dev-t);clip-path:polygon(0 0,100% calc(100% - 1.4px),100% 100%,0 1.4px);background:linear-gradient(90deg,#ffffff70,#ffffff90)}
.edge--dev-bottom{bottom:0;height:var(--dev-b);clip-path:polygon(0 calc(100% - 1.4px),100% 0,100% 1.4px,0 100%);background:linear-gradient(90deg,#ffffff90,#ffffffb8)}
.dev__grid{position:relative;display:grid;grid-template-columns:minmax(0,54.5%) minmax(0,1fr);gap:0;max-width:1700px;margin:0 auto}
.dev__left{padding-right:clamp(24px,5vw,90px)}
.dev__title{margin:0;font:400 clamp(36px,4.3vw,84px)/1 Playfair,Didot,Georgia,serif;letter-spacing:-.05em;color:#f3efec}
.dev__title em{font-style:italic}
.dev__dot{color:#ed1018;font-weight:400}
.dev__list{list-style:none;margin:clamp(14px,1.9vw,32px) 0 0;padding:0;border-top:1px solid #ffffff2b}
.dev__list li{border-bottom:1px solid #ffffff2b;opacity:0;transform:translateY(18px);transition:opacity .8s ease calc(.3s + var(--i) * .12s),transform .8s cubic-bezier(.2,.8,.2,1) calc(.3s + var(--i) * .12s)}
.is-in .dev__list li{opacity:1;transform:none}
.dev__list a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:clamp(10px,1.05vw,18px) 0;text-decoration:none;transition:padding-left .35s cubic-bezier(.2,.8,.2,1)}
.dev__list strong{display:block;font:400 clamp(20px,2.15vw,40px)/1.1 Playfair,Georgia,serif;letter-spacing:-.03em;color:#f4efeb}
.dev__list small{display:block;margin-top:5px;font:300 clamp(11px,1vw,16px) Inter,Arial,sans-serif;color:#c7c7cb}
.dev__arrow{flex:none;width:clamp(22px,2.2vw,38px);height:auto;color:#e8e8ea;transition:transform .3s,color .3s}
.dev__list a:hover{padding-left:12px}
.dev__list a:hover .dev__arrow{transform:translateX(6px);color:#ed1018}
.dev__more{display:inline-block;margin-top:clamp(14px,1.8vw,30px);padding-bottom:4px;font:300 clamp(11px,1.05vw,16px) Inter,Arial,sans-serif;color:#eee;border-bottom:1px solid #ffffffaa;text-decoration:none}
.dev__more:hover{color:#fff;border-color:#ed1018}
.dev__right{position:relative;padding:clamp(4px,.6vw,10px) 0 0 clamp(26px,4.4vw,88px);border-left:1px solid #ffffff3d;opacity:0;transform:translateY(18px);transition:opacity 1s ease .4s,transform 1s ease .4s}
.is-in .dev__right{opacity:1;transform:none}
.dev__tag{margin:0;font:600 clamp(9px,.8vw,12px) Inter,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#ed1018}
.dev__big{margin:clamp(8px,1vw,18px) 0 0;font:400 clamp(30px,4.3vw,84px)/1.02 Playfair,Georgia,serif;letter-spacing:-.05em;color:#f6f2ef}
.dev__big em{font-style:italic}
.dev__text{margin:clamp(12px,1.5vw,26px) 0 0;max-width:19em;font:300 clamp(12px,1.15vw,18px)/1.55 Inter,Arial,sans-serif;color:#dcdce0}

/* ---------------------------------------------------------------------------
   06 · Atlas
   --------------------------------------------------------------------------- */
.atl{position:relative;z-index:6;isolation:isolate;overflow:hidden;min-height:min(100svh,56vw);background:#080706;display:flex;align-items:center;border-top:1px solid #ffffff18}
.atl::before{content:"";position:absolute;inset:0;background:url('./assets/noise.svg') 0 0/200px;mix-blend-mode:screen;opacity:.05;pointer-events:none}
.atl__img{position:absolute;right:2%;top:5vw;bottom:auto;height:112%;width:auto;max-width:64%;object-fit:cover;object-position:62% 0;mix-blend-mode:lighten;opacity:.95;transform:translateY(calc(var(--ap,0) * 5%)) scale(calc(1.12 - var(--ap,0) * .08));transform-origin:68% 62%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%),linear-gradient(0deg,transparent 0,#000 14%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 40%),linear-gradient(0deg,transparent 0,#000 14%);mask-composite:intersect}
.atl__inner{position:relative;z-index:2;width:100%;max-width:1700px;margin:0 auto;padding:clamp(44px,6vw,110px) var(--padx)}
.atl__q{margin:0;max-width:min(30em,58%);font:italic 400 clamp(19px,2.55vw,46px)/1.28 Playfair,Georgia,serif;letter-spacing:-.03em;color:#eae3dd}
.atl__q .w{opacity:.26;transition:opacity .45s ease}
.atl__q .w.on{opacity:1}
.atl__ask{margin:clamp(10px,1.5vw,26px) 0 0;max-width:min(24em,70%);font:italic 400 clamp(30px,4.6vw,86px)/1.02 Playfair,Georgia,serif;letter-spacing:-.05em;color:#fff}
.atl__ask span{display:inline;background:linear-gradient(#ed1018,#ed1018) 0 100%/0 2px no-repeat;padding-bottom:4px;opacity:.16;transition:opacity .9s ease,background-size 1.2s cubic-bezier(.2,.8,.2,1) .3s}
.atl.ask-on .atl__ask span{opacity:1;background-size:100% 2px}
.atl__src{margin:clamp(18px,2.4vw,42px) 0 0;font:400 clamp(9px,.82vw,13px) Inter,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#a6a0a0}

/* Footer */
.foot{position:relative;z-index:6;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:clamp(14px,1.6vw,26px) var(--padx);background:#050506;border-top:1px solid #ffffff2b;font-size:clamp(10px,.82vw,13px);color:#c2c2c6}
.foot__logo{font:italic 400 clamp(17px,1.7vw,28px) Playfair,Georgia,serif;color:#f4efeb;text-decoration:none}
.foot__logo b{color:#ed1018;font-weight:400}
.foot__nav{display:flex;flex-wrap:wrap;align-items:center}
.foot__nav a,.foot__nav button{position:relative;padding:4px 0;border:0;background:none;color:inherit;font:inherit;letter-spacing:.02em;cursor:pointer;text-decoration:none}
.foot__nav>*+*{margin-left:clamp(14px,1.6vw,26px)}
.foot__nav>*+*::before{content:"·";position:absolute;left:calc(-1 * clamp(9px,1vw,15px));color:#77777c}
.foot__nav a:hover,.foot__nav button:hover{color:#fff}

/* ---------------------------------------------------------------------------
   Handy
   --------------------------------------------------------------------------- */
@media(max-width:760px){
  :root{--rd1:13vw;--rd2:9vw;--dev-t:3vw;--dev-b:8vw;--pk-up:clamp(120px,30vw,170px);--padx:20px}
  .chg{padding-top:clamp(36px,9vw,56px);padding-bottom:clamp(36px,8vw,56px)}
  .chg__title{font-size:clamp(50px,15vw,80px)}
  .chg__head{grid-template-columns:30px minmax(0,1fr) 30px;grid-template-areas:"no name plus" ". short .";row-gap:2px;padding:14px 0}
  .chg__no{grid-area:no}.chg__name{grid-area:name;font-size:clamp(30px,9.4vw,44px)}.chg__short{grid-area:short;font-size:13px}.chg__plus{grid-area:plus;align-self:start;margin-top:8px}
  .chg__panel-in{margin-left:30px;padding-right:0}
  .chg__panel-in p{font-size:14px}
  .pk{padding-top:calc(var(--pk-up) + 36px)}
  .pk__stage{aspect-ratio:1/1.5;min-height:0;container-type:inline-size;margin-top:clamp(190px,50vw,232px)}
  .pk__unit{--x:var(--mx);--y:var(--my);--w:var(--mw);--t:var(--mt)}
  .pk__unit--bg{display:none}
  .pk__rope{display:none}
  .pk__copy{position:absolute;left:0;right:0;top:calc(-1 * clamp(190px,50vw,232px));width:auto;padding:0 var(--padx)}
  .pk__title{font-size:clamp(40px,12vw,58px)}
  .pk__lead{font-size:clamp(15px,4.2vw,19px)}
  .pk__cta{font-size:15px;padding:16px 18px}
  .pk__action{padding-bottom:46px}
  .dev{padding-top:calc(var(--dev-t) + 40px)}
  .dev__grid{grid-template-columns:1fr}
  .dev__left{padding-right:0}
  .dev__right{border-left:0;border-top:1px solid #ffffff3d;padding:24px 0 24px;margin-top:22px;min-height:200px}
  .dev__bg{background:linear-gradient(180deg,#060607 0,#06060700 38%),url('./assets/berlin-skyline.svg') 70% 100%/auto 70% no-repeat}
  .atl{min-height:0;display:flex;flex-direction:column;align-items:stretch}
  .atl__inner{order:1;position:relative;padding-top:30px;padding-bottom:0}
  .atl__img{order:2;position:relative;display:block;width:100%;max-width:none;height:min(104vw,500px);right:auto;bottom:auto;margin-top:-4vw;object-position:50% 0;transform:none;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 26%,#000 100%);mask-image:linear-gradient(180deg,transparent 0,#000 26%,#000 100%);-webkit-mask-composite:source-over;mask-composite:add}
  .atl__q{max-width:none;font-size:17px}
  .atl__ask{max-width:none;font-size:clamp(30px,9vw,42px)}
  .foot{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){
  .ln>*,.chg__lead,.chg__no,.chg__name,.chg__short,.chg__plus,.chg__more,.pk__lead,.pk__cta,.dev__list li,.dev__right{opacity:1!important;transform:none!important;transition:none!important}
  .chg__row::before,.chg__row:last-child::after{transform:none!important;transition:none!important}
  .pk__thread{transform:none!important;transition:none!important}
  .pk__swing{opacity:1!important;animation:none!important}
  .chg__panel,.chg__panel-in{transition:none}
  .atl__q .w{opacity:1;transition:none}
  .atl__ask span{opacity:1;background-size:100% 2px;transition:none}
  .atl__img{transform:none}
}

/* ===========================================================================
   Übergänge zwischen den Slides — eine Bewegungssprache
   Alles skaliert/verschiebt/blendet über Variablen (0..1) aus kapitel.js.
   Individuelle Eigenschaften (translate/scale), damit bestehende transform-Regeln nicht kollidieren.
   =========================================================================== */

/* Hero → Karte (Desktop): Bild atmet zurück, während die Karte darüberfährt */
@media(min-width:761px){
  .hero__image{translate:0 calc(var(--hp,0) * -3vw);scale:calc(1 + var(--hp,0) * .05);transform-origin:50% 40%}
  .hero__shade{opacity:calc(.65 + var(--hp,0) * .35)}
}

/* Karte → Globus: Globus-Inhalt weicht zurück, wenn die rote Ebene kommt */
.stories-globe__intro,.globe-shell{translate:0 calc(var(--ov2,0) * -2.2vw);scale:calc(1 - var(--ov2,0) * .03);transform-origin:50% 100%}

/* Globus → Rot: roter Keil rollt von links auf, ein Lichtstreifen läuft darüber */
.chg{clip-path:polygon(0 0,calc(var(--rw,1) * 100%) calc(var(--rw,1) * var(--rd1)),calc(var(--rw,1) * 100%) calc(100% - var(--rw,1) * var(--rd2)),0 100%)}
.edge--chg-top{transform-origin:0 0;scale:var(--rw,1)}
.chg::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(104deg,transparent 38%,#ffe9e12e 49%,#fff4ee52 50%,#ffe9e12e 51%,transparent 62%);background-size:300% 100%;background-position:calc(112% - var(--rw,1) * 130%) 0;opacity:calc(4 * var(--rw,1) * (1 - var(--rw,1)))}
/* Rot → Postkarten: Inhalt weicht leicht nach oben und dunkelt, wenn die Karten kommen */
.chg__inner{translate:0 calc(var(--chx,0) * -3.4vw);opacity:calc(1 - var(--chx,0) * .3)}

/* Postkarten → Papier: Karten treten zurück */
.pk__copy,.pk__action{translate:0 calc(var(--pkx,0) * -2.2vw);opacity:calc(1 - var(--pkx,0) * .4)}
.pk__stage{scale:calc(1 - var(--pkx,0) * .025);transform-origin:50% 40%}

/* Papier: Kante zeichnet sich, Skyline fährt langsam (Parallax), Inhalt weicht vor den Unterstützern */
.edge--dev-top,.edge--dev-bottom{transform-origin:0 50%;scale:var(--ed,1) 1}
.dev__bg{translate:0 calc((var(--dvp,.5) - .5) * -9%);scale:calc(1.1 - var(--dve,1) * .06);transform-origin:70% 60%}
.dev__grid{translate:0 calc(var(--dvx,0) * -2.6vw);opacity:calc(1 - var(--dvx,0) * .35)}

/* Atlas: Statue taucht aus dem Dunkel auf und gleitet von rechts ein */
.atl__img{opacity:calc(.08 + var(--ae,1) * .87);translate:calc((1 - var(--ae,1)) * 6vw) 0}
.atl__inner{translate:0 calc((1 - var(--ae,1)) * 2vw)}

/* Footer */
.foot__logo,.foot__nav{opacity:0;translate:0 10px;transition:opacity .7s ease .1s,translate .7s cubic-bezier(.22,1,.36,1) .1s}
.foot.is-in .foot__logo,.foot.is-in .foot__nav{opacity:1;translate:none}
.foot.is-in .foot__nav{transition-delay:.2s}

@media(prefers-reduced-motion:reduce){
  .hero__image{translate:none;scale:none}
  .stories-globe__intro,.globe-shell,.chg__inner,.pk__copy,.pk__action,.pk__stage,.dev__bg,.dev__grid,.atl__img,.atl__inner{translate:none;scale:none}
  .chg::after{display:none}
  .foot__logo,.foot__nav{opacity:1;translate:none;transition:none}
}
.chg-wrap::before{clip-path:inset(0 calc((1 - var(--rw,1)) * 100%) 0 0)}

/* Pfeil-Symbole (ersetzen die Zeichen ↗ → ←, die Handys sonst als Emoji darstellen) */
.ico{display:inline-block;width:.78em;height:.78em;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.04em}
.ico--r,.ico--l{width:1.1em;height:.82em}
.petition-widget__link span .ico{width:13px;height:13px;vertical-align:-1px}
body{font-variant-emoji:text}

/* ===========================================================================
   Handy-Feinschliff (alle Slides)
   =========================================================================== */
a,button,summary,label,input,textarea,select,[role="button"]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

@media(max-width:760px){
  /* Hero: mehr Raum um das Titelbild, Zähler liegt unter dem Bild statt darauf */
  .hero{height:max(calc(56vw + 205px),58svh);min-height:0}
  .hero__image{top:auto;bottom:calc(var(--seam-depth) + 80px);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 26%);mask-image:linear-gradient(180deg,transparent 0,#000 26%)}
  .hero__shade{inset:0;background:linear-gradient(180deg,#050505d9 0,transparent 30%,transparent 64%,#050505 100%)}
  .petition-widget{bottom:calc(var(--seam-depth) + 20px)}
  /* Rechenlast senken: Schlagschatten-Filter auf der roten Ebene entfällt, dafür ein weicher Schatten darunter */
  .chg-wrap{filter:none}
  .chg-wrap::after{content:"";position:absolute;left:0;right:0;bottom:0;height:28px;background:linear-gradient(#0000,#000000a0);pointer-events:none;z-index:-1}
}
@media(max-width:760px){
  /* Markenname bleibt auch am Handy sichtbar (der Hero lässt oben jetzt Platz) */
  .site-header .brand{display:inline-flex}
}

/* ===========================================================================
   Wortmarke im Kopf (wie im Footer), Körnung auf allen schwarzen Flächen,
   Globus unter dem roten Keil, Postkarten-Hover
   =========================================================================== */

/* Wortmarke: kleine Kursivschrift mit rotem Punkt, oben wie unten */
.wortmarke{display:inline-block;font:italic 400 clamp(19px,1.75vw,27px)/1 Playfair,Georgia,serif;letter-spacing:-.01em;color:#f4efeb;white-space:nowrap}
.wortmarke b{color:#ed1018;font-weight:400}
.site-header .brand:hover{opacity:.8}
@media(max-width:760px){.wortmarke{font-size:20px}}

/* Pixel-Körnung (Kachel und Sprünge kommen aus grain.js; Verschieben läuft auf dem Compositor) */
.koernung{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;opacity:.1}
.koernung::before{content:"";position:absolute;inset:-130px;background-image:var(--koernung);background-size:512px 512px;image-rendering:pixelated}
.koernung.is-live::before{animation:koernen .8s steps(1,end) infinite}
@keyframes koernen{
  0%{transform:translate3d(0,0,0)}10%{transform:translate3d(-97px,41px,0)}20%{transform:translate3d(63px,-118px,0)}30%{transform:translate3d(-24px,-72px,0)}
  40%{transform:translate3d(112px,88px,0)}50%{transform:translate3d(-61px,109px,0)}60%{transform:translate3d(38px,-33px,0)}70%{transform:translate3d(-118px,-14px,0)}
  80%{transform:translate3d(79px,52px,0)}90%{transform:translate3d(-8px,121px,0)}
}
.sec,.pt,.cta-band{isolation:isolate}
@media(prefers-reduced-motion:reduce){.koernung.is-live::before{animation:none}}

/* Globus: reicht (Desktop) bis unter den roten Keil, die Hinweise stehen darüber. Keine graue Lücke mehr. */
.chg-wrap{pointer-events:none;translate:0 calc((1 - var(--rw,1)) * 4vw)}
.chg{pointer-events:auto}
@media(min-width:761px){
  .stories-globe{padding-bottom:0}
  .globe-shell{height:calc(clamp(500px,65vh,700px) + var(--rd1))}
  .globe-stage{height:100%}
  .globe-hint{position:absolute;left:0;right:0;bottom:calc(var(--rd1) + 52px);margin:0;z-index:4}
  .globe-source{position:absolute;left:auto;right:clamp(16px,3vw,48px);bottom:calc(var(--rd1) + 28px);width:auto;margin:0;z-index:4;text-align:right}
}
@media(max-width:760px){
  .stories-globe{padding-bottom:calc(var(--rd1) + 14px)}
}

/* Postkarten: beim Darüberfahren hebt sich die Karte, neigt sich zur Maus, die anderen treten zurück */
.pk__unit:not(.pk__unit--bg) .pk__card{
  transform:perspective(1000px) rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg)) translateY(var(--lift,0px)) scale(var(--zoom,1));
  transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s,filter .5s;
  transform-style:preserve-3d;
}
.pk__unit:not(.pk__unit--bg) .pk__card:hover{--lift:-1.1cqw;--zoom:1.06;box-shadow:0 .15cqw 0 #ffffff99 inset,0 0 0 1px #00000024,0 3cqw 5.5cqw #000000e0,0 .5cqw 1.2cqw #00000090;z-index:3}
.pk__stage:has(.pk__unit:not(.pk__unit--bg) .pk__card:hover) .pk__unit:not(.pk__unit--bg) .pk__card:not(:hover){filter:brightness(.58) saturate(.75)}
.pk__stage:has(.pk__unit:not(.pk__unit--bg) .pk__card:hover) .pk__copy{opacity:.6;transition:opacity .4s}
.pk__card:hover .pk__stamp{animation:stempel .6s cubic-bezier(.3,1.5,.5,1)}
@keyframes stempel{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-4deg)}100%{transform:scale(1)}}
.pk__card::before{transition:opacity .4s}
/* Lichtreflex, der mit der Maus wandert */
.pk__card{--gx:50%;--gy:30%}
.pk__unit:not(.pk__unit--bg) .pk__card::before{background:radial-gradient(60% 70% at var(--gx) var(--gy),#ffffff40,transparent 70%),radial-gradient(120% 90% at 50% 0,transparent 60%,#6a5a3f2e 100%)}
@media(hover:none){.pk__unit:not(.pk__unit--bg) .pk__card:hover{--lift:-.6cqw;--zoom:1.03}}
@media(prefers-reduced-motion:reduce){.pk__unit:not(.pk__unit--bg) .pk__card{transition:none;transform:none}.pk__card:hover .pk__stamp{animation:none}}

/* Roter Keil schiebt sich von unten über die Globus-Slide (kein seitliches Aufrollen mehr). Darunter liegt
   dieselbe Körnung wie auf der Globus-Slide, damit beim Hochschieben keine Lücke aufscheint. */
.chg{clip-path:polygon(0 0,100% var(--rd1),100% calc(100% - var(--rd2)),0 100%)}
.edge--chg-top{scale:1}
.chg-wrap::before{clip-path:none}
.chg-wrap{translate:0 calc((1 - var(--rw,1)) * 9vw)}
.stories-globe .sf-sheet{bottom:calc(-1 * (var(--rd1) + 10vw))}

/* ===========================================================================
   Handy-Korrekturen (Version u9)
   =========================================================================== */
/* Papier-Keil: Dreieck über der schrägen Kante zeigte den Hero-Titel durch -> dunkle Unterlage */

@media(max-width:760px){
  /* Hinweistext der Weltkugel liegt komplett über der roten Kante */
  .stories-globe{padding-bottom:calc(var(--rd1) + 44px)}

  /* Postkarten: höhere Bühne, Fäden beginnen unter dem Text (nicht mehr über Titel/Link), nichts ragt raus */
  .pk__stage{aspect-ratio:1/1.68;overflow:visible}
  .pk__thread{top:0;height:var(--y);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%);mask-image:linear-gradient(180deg,transparent 0,#000 16%)}
  .pk__copy{z-index:5}

  /* Papier: Skyline läuft sanft aus (kein harter Bildrand mehr mitten im Block) */
  .dev__bg{background:linear-gradient(180deg,#060607 0,#060607 30%,#06060700 62%),url('./assets/berlin-skyline.svg') 70% 100%/auto 70% no-repeat}

  /* Leichter: teure Mischmodi und 3D-Ebenen auf dem Handy weglassen, Optik bleibt */
  .pk__card::after,.pk__stamp::after,.atl::before{display:none}
  .pk__unit:not(.pk__unit--bg) .pk__card{transform-style:flat;transition:box-shadow .3s}
  .pk__card{box-shadow:0 .15cqw 0 #ffffff80 inset,0 0 0 1px #00000024,0 1.6cqw 2.4cqw #000000a0}
  .atl__img{mix-blend-mode:normal}
  .chg__sheet::after{display:none}
  .koernung.is-live::before{animation-duration:1.2s}
}
/* Grain-Ebenen werden eigene Compositor-Ebenen, damit das Verschieben kein Neuzeichnen kostet */
.koernung.is-live::before{will-change:transform}

/* u10: keine schwarzen Balken an den Keilkanten: Postkarten-Fläche reicht unter die schräge Kante */
.pk{padding-bottom:var(--dev-t)}
.dev-wrap{margin-top:calc(-1 * var(--dev-t))}
/* Flüssiger: bewegte Ebenen bekommen eigene Compositor-Ebenen, Körnung pausiert beim Scrollen */
.dev__bg,.atl__img{will-change:transform}
html.is-scrolling .koernung::before{animation-play-state:paused}

/* ===========================================================================
   u11 Handy: Kopfbild ohne Schwarz, Rot mit Luft, kein Schatten unter dem Rot, Postkarten als geordnete Reihen
   =========================================================================== */
/* Unter dem Rot: schwarze Unterlage nur oben (gegen Durchblitzen des Hero), unten liegt die Postkarten-Fläche */
.chg-wrap::before{bottom:auto;height:calc(var(--rd1) + 3px)}
.chg-wrap::after{display:none!important}

@media(max-width:760px){
  /* Kopfbild: das Bild selbst bildet den Kopf, ganz oben, unverzoomt, volle Breite */
  .hero{height:calc(42.9vw + var(--seam-depth) + 108px);min-height:0}
  .hero__image{top:0;bottom:auto;left:0;width:100%;height:auto;aspect-ratio:1916/821;object-fit:cover;-webkit-mask-image:linear-gradient(180deg,#000 86%,transparent);mask-image:linear-gradient(180deg,#000 86%,transparent)}
  .hero__shade{background:linear-gradient(180deg,#050505a0 0,transparent 22%)}
  .petition-widget{bottom:calc(var(--seam-depth) + 16px)}

  /* Rot: mehr Luft zur schrägen Kante, oben und unten */
  .chg{padding-top:calc(var(--rd1) + clamp(30px,8vw,46px));padding-bottom:calc(var(--rd2) + clamp(30px,8vw,46px))}

  /* Postkarten: mittig, in Reihen, alle hängen an Fäden direkt unter dem roten Rand */
  .pk{padding-top:calc(var(--pk-up) + 6px)}
  .pk__unit{--rx:.5!important}
  .pk__stage{aspect-ratio:1/1.3;margin-top:0;margin-bottom:clamp(280px,76vw,320px)}
  .pk__thread{top:calc(-1 * var(--pk-up));height:calc(var(--pk-up) + var(--y));-webkit-mask-image:none;mask-image:none}
  .pk__copy{top:calc(100% + 18px)}
  .pk__title{font-size:clamp(40px,12vw,56px)}
}
@media(max-width:760px){
  .site-header{padding-top:12px;padding-bottom:6px}
  .hero{height:calc(42.9vw + 26px + var(--seam-depth) + 92px)}
  .hero__image{top:26px;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 88%,transparent);mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 88%,transparent)}
  .hero__shade{background:none}
}

/* u12: Linien und Listen öffnen sich sofort und schnell, nicht mehr an den Scroll gekoppelt */
.edge:not(.edge--chg-top){scale:0 1;transform-origin:0 50%;transition:scale .35s cubic-bezier(.2,.8,.2,1)}
.edge.is-drawn:not(.edge--chg-top){scale:1 1}
.chg__row::before,.chg__row:last-child::after{transition:transform .4s cubic-bezier(.2,.8,.2,1) calc(.05s + var(--i) * .05s)}
.dev__list li{transition:opacity .4s ease calc(.05s + var(--i) * .05s),transform .45s cubic-bezier(.2,.8,.2,1) calc(.05s + var(--i) * .05s)}
.dev__right{transition:opacity .45s ease .15s,transform .5s ease .15s}
.ln>*{transition-duration:.6s}
.pk__lead,.pk__cta{transition-delay:.15s}

/* u13: Tempo */
@property --ov{syntax:'<number>';inherits:false;initial-value:0}
@property --ov2{syntax:'<number>';inherits:false;initial-value:0}
.emigration__grain,.stories-globe__grain{display:none}
.pk.is-away .pk__swing{animation-play-state:paused}
.pk.is-away .pk__card{will-change:auto}

/* u14: Karte hängt am Faden — Faden wächst und Karte fällt gleich schnell, der Ring sitzt immer am Fadenende */
.pk{--fall-e:cubic-bezier(.45,.1,.3,1)}
.is-in .pk__thread,.pk.is-in .pk__thread{transform:scaleY(1);transition:none;animation:pk-grow 1.35s var(--fall-e) calc(.35s + var(--n) * .17s) both}
@keyframes pk-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes pk-fall{from{translate:0 calc(-1 * var(--len,60vh))}to{translate:0 0}}
@keyframes pk-fade{from{opacity:0}to{opacity:1}}
@keyframes pk-rot{0%{rotate:calc(var(--t) + 30deg)}45%{rotate:calc(var(--t) - 14deg)}65%{rotate:calc(var(--t) + 8deg)}82%{rotate:calc(var(--t) - 3deg)}100%{rotate:var(--t)}}
@media(prefers-reduced-motion:reduce){.pk__thread{animation:none!important}}

/* u16: Ausklappen ohne Höhen-Animation (die erzwingt pro Bild ein Layout der ganzen Seite):
   die Zeile öffnet sich sofort, der Inhalt blendet in 0,28 s ein */
.chg__panel{display:none;transition:none;grid-template-rows:1fr}
.chg__row.is-open .chg__panel{display:grid}
.chg__panel-in{opacity:1;transform:none;transition:none}
.chg__row.is-open .chg__panel-in{animation:chg-in .28s cubic-bezier(.2,.8,.2,1) both}
@keyframes chg-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.chg__plus,.chg__plus::before,.chg__plus::after{transition-duration:.25s}

/* Handy: Weichzeichner hinter Flächen ist teuer, die Flächen sind ohnehin fast deckend */
@media(max-width:760px){
  .petition-widget{backdrop-filter:none;-webkit-backdrop-filter:none;background:#070708f2}
  .sub .site-header--sub.is-solid{backdrop-filter:none;-webkit-backdrop-filter:none;background:#050506f5}
}

/* ===========================================================================
   u17: Atlas mittig, Postkarten mit Sprüchen, vierte Karte am Handy
   =========================================================================== */
/* Atlas: Statue mittig, Zitat links, Frage rechts */
@media(min-width:761px){
  .atl__img{left:0;right:0;margin-inline:auto;top:.5vw;height:calc(100% - 1.5vw);max-width:60%;object-position:50% 0;transform-origin:50% 62%;
    -webkit-mask-image:linear-gradient(0deg,transparent 0,#000 12%);mask-image:linear-gradient(0deg,transparent 0,#000 12%);-webkit-mask-composite:source-over;mask-composite:add;translate:0 calc((1 - var(--ae,1)) * 3vw)}
  .atl__inner{display:grid;grid-template-columns:minmax(0,29%) minmax(0,1fr) minmax(0,29%);align-items:center;row-gap:clamp(16px,2vw,36px)}
  .atl__q{grid-column:1;grid-row:1;max-width:none;font-size:clamp(16px,1.8vw,32px)}
  .atl__ask{grid-column:3;grid-row:1;max-width:none;margin:0;text-align:right;font-size:clamp(28px,3.7vw,70px)}
}
@media(max-width:760px){
  .atl__img{width:88%;max-width:440px;height:auto;margin:-2vw auto 0;object-fit:contain;object-position:50% 0}
}
.atl__src{position:absolute;z-index:3;width:max-content;margin:0;right:var(--padx);bottom:clamp(12px,1.6vw,22px)}

/* Postkarten: Spruch auf der Rückseite */
.pk__cap{position:absolute;left:6%;right:4%;bottom:15%;display:block;font:italic 400 calc(var(--w) * .064cqw)/1.12 Playfair,Georgia,serif;color:#4a4036;letter-spacing:-.01em;pointer-events:none}
.pk__cap b{display:block;font-weight:700;color:#8e1d17}
@media(max-width:760px){
  .pk__unit--5{display:none}
  .pk__stage{aspect-ratio:1/.98}
}

/* u18: Atlas ohne Hintergrund (freigestellt, mit Alphakanal) */
.atl__img{mix-blend-mode:normal;opacity:calc(.08 + var(--ae,1) * .92)}

/* u19: Atlas blendet auch am Handy von unten ein (nicht von der Seite) */
@media(max-width:760px){
  .atl__img{translate:0 calc((1 - var(--ae,1)) * 10vw)}
}
.hero__blood{image-rendering:auto}
.emigration__drops{position:absolute;z-index:4;left:0;top:0;width:100%;height:calc(var(--seam-depth) + 150px);pointer-events:none}

/* u23: längere Forderungstitel dürfen umbrechen, lange Texte bekommen Luft */
.chg__name{font-size:clamp(26px,3.5vw,68px);line-height:1.03}
.chg__panel-in p{max-width:44em;line-height:1.6}
@media(max-width:760px){.chg__name{font-size:clamp(26px,7.6vw,38px)}.chg__panel-in p{font-size:14px;line-height:1.55}}

/* u24: Quellenangaben unter den Forderungen */
.chg__src{list-style:none;counter-reset:q;margin:0 0 clamp(12px,1.4vw,22px);padding:10px 0 0;border-top:1px solid #ffffff33;max-width:44em}
.chg__src li{counter-increment:q;position:relative;margin:0 0 5px;padding-left:20px;font:300 clamp(10.5px,.82vw,12.5px)/1.45 Inter,Arial,sans-serif;color:#ffe3da}
.chg__src li::before{content:counter(q);position:absolute;left:0;top:0;font-weight:500;color:#fff}
.chg__src a,.chg__panel-in .chg__src a{display:inline;margin:0;padding:0;border:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:2px;text-decoration-color:#ffffff66}
.chg__src a:hover{color:#fff;text-decoration-color:#fff}
.ref{font-size:.68em;line-height:0;vertical-align:super;margin-left:1px}
.ref a,.chg__panel-in .ref a{display:inline;margin:0;padding:0 1px;border:0;font:inherit;color:#fff;text-decoration:none;font-weight:600}
.map-quelle{max-width:640px;margin:14px auto 0;padding:0 8px;color:#a7a7aa;font-size:11px;line-height:1.5;text-align:center}
.map-quelle a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* u25: Linienszenen beim Aufklappen — Desktop links neben dem Text, Handy darüber */
.chg__scene{display:none;pointer-events:none}
@media(min-width:761px){
  .chg__panel{position:relative}
  .chg__scene{display:block;position:absolute;left:0;top:4px;width:calc(clamp(34px,7.4vw,140px) + 37.3vw - 1vw);height:min(calc(100% - 14px),clamp(380px,31vw,540px));opacity:0;transition:opacity .35s ease .05s}
  .chg__row.is-open .chg__scene{opacity:1}
  .chg__panel-in{min-height:clamp(380px,30vw,520px)}
}
@media(max-width:760px){
  .chg__row.is-open .chg__panel{display:flex;flex-direction:column}
  .chg__scene{display:block;flex:none;width:min(calc(100% - 30px),460px);aspect-ratio:3/2;height:auto;margin:10px 0 16px 30px;opacity:0;transition:opacity .35s ease .05s}
  .chg__row.is-open .chg__scene{opacity:1}
  /* Leben günstiger machen: höheres Feld, damit Münze, Zahlen und Balken Luft haben */
  .chg__scene--steuer{aspect-ratio:5/6}
}

/* u32: Quellenzeile unter der Karte nicht vom Globus-Abschnitt überdecken */
.emigration{padding-bottom:calc(var(--arc-lap) + 36px)}
.map-quelle{margin-top:6px}

/* u35: Quellenangabe der Weltkugel am Desktop waagerecht an die Seite (rechts), nicht unter die Kugel */
@media(min-width:1000px){
  .globe-source{left:auto;right:clamp(24px,4vw,72px);bottom:calc(var(--rd1) + 90px);width:clamp(190px,16vw,270px);margin:0;padding:0;text-align:left;font-size:11px;line-height:1.55;color:#aeaeb3}
}

/* u37: neue, dunkle Porträts: kein Multiplizieren, schwarzer Grund, Gesicht im Ausschnitt */
.pk__photo{background:#0b0b0c}
.pk__photo img{mix-blend-mode:normal;filter:contrast(1.04);object-position:50% 18%}

/* ===========================================================================
   u38: Forderungen in Pechschwarz, alles Weiße in leuchtendem Rot
   =========================================================================== */
.chg{color:#ff3a46;background:#020203}
.chg__sheet,.chg::after{display:none}
.chg-wrap{filter:none}
.edge--chg-top{background:linear-gradient(90deg,#ff3a4600,#ff3a46aa 20%,#ff3a46)}
.chg__title{color:#ff3a46;text-shadow:0 0 .7vw #ff3a4655,0 0 2.6vw #ff3a4630}
.chg__lead{color:#ff6c75}
.chg__row::before,.chg__row:last-child::after{background:#ff3a4670}
.chg__no{color:#ff6c75}
.chg__name{color:#ff3a46;text-shadow:0 0 1.1vw #ff3a4640}
.chg__short{color:#ff6c75}
.chg__plus{border-color:#ff3a46aa}
.chg__plus::before,.chg__plus::after{background:#ff3a46}
.chg__head:hover .chg__plus,.chg__row.is-open .chg__plus{background:#ff3a4626;border-color:#ff3a46}
.chg__head:focus-visible{outline-color:#ff3a46}
.chg__panel-in p{color:#ff7078}
.chg__panel-in a{color:#ff3a46;border-bottom-color:#ff3a4699}
.chg__panel-in a:hover{border-color:#ff3a46}
.chg__more{color:#ff3a46;border-bottom-color:#ff3a46aa}
.chg__more:hover{color:#ff6c75;border-color:#ff6c75}
.chg__src{border-top-color:#ff3a4640}
.chg__src li{color:#ff8b91}
.chg__src li::before{color:#ff3a46}
.chg__src a,.chg__panel-in .chg__src a{text-decoration-color:#ff3a4688}
.chg__src a:hover{color:#ff3a46;text-decoration-color:#ff3a46}
.ref a,.chg__panel-in .ref a{color:#ff3a46}

/* u39: einfarbig tiefschwarz, ohne Körnung */
.chg{background:#000}

/* u40: schwarze Fläche wie die rote: Lichtschein, Stofftextur, Vignette (statisch, nicht animiert) */
.chg{background:#000}
.chg__sheet{display:block;background:
  radial-gradient(90% 110% at 16% 14%,#34343a 0,#1c1315 32%,transparent 64%) 0 0/100% 100%,
  radial-gradient(75% 85% at 100% 100%,#2a070bcc,transparent 68%),
  linear-gradient(185deg,#101012 0,#070708 52%,#010101 100%);
  box-shadow:inset 0 0 9vw #000000d0}
.chg__sheet::before{mix-blend-mode:screen;opacity:.17}
.chg__sheet::after{mix-blend-mode:screen;opacity:.1}

/* u43: Schrift knallig rot wie sonst auf der Seite, nur der Hintergrund glüht; Textur ohne sichtbare Kachelnaht */
.chg{color:#ed1018}
.chg__title,.chg__name{color:#ed1018;text-shadow:none}
.chg__lead,.chg__no,.chg__short{color:#ff4a52}
.chg__plus{border-color:#ed1018cc}
.chg__plus::before,.chg__plus::after{background:#ed1018}
.chg__head:hover .chg__plus,.chg__row.is-open .chg__plus{background:#ed101826;border-color:#ed1018}
.chg__row::before,.chg__row:last-child::after{background:#ed101880}
.chg__panel-in p{color:#ff5a62}
.chg__panel-in a,.chg__more,.chg__src li::before,.ref a,.chg__panel-in .ref a{color:#ed1018}
.chg__panel-in a,.chg__more{border-bottom-color:#ed1018aa}
.edge--chg-top{background:linear-gradient(90deg,#ed101800,#ed1018aa 20%,#ed1018)}
.chg__sheet::before{background-size:100% 100%;background-repeat:no-repeat}

/* u44: Rotton der Karte „Das Land blutet aus.“ (#c9161f) statt Signalrot */
.chg{color:#c9161f}
.chg__title,.chg__name{color:#c9161f}
.chg__lead,.chg__no,.chg__short{color:#d4474d}
.chg__plus{border-color:#c9161fcc}
.chg__plus::before,.chg__plus::after{background:#c9161f}
.chg__head:hover .chg__plus,.chg__row.is-open .chg__plus{background:#c9161f26;border-color:#c9161f}
.chg__row::before,.chg__row:last-child::after{background:#c9161f80}
.chg__panel-in p{color:#d95359}
.chg__src li{color:#cc5a5f}
.chg__panel-in a,.chg__more,.chg__src li::before,.ref a,.chg__panel-in .ref a{color:#c9161f}
.chg__panel-in a,.chg__more{border-bottom-color:#c9161faa}
.chg__src{border-top-color:#c9161f55}
.chg__src a,.chg__panel-in .chg__src a{text-decoration-color:#c9161f99}
.chg__src a:hover{color:#e0343d;text-decoration-color:#e0343d}
.chg__head:focus-visible{outline-color:#c9161f}
.edge--chg-top{background:linear-gradient(90deg,#c9161f00,#c9161faa 20%,#c9161f)}

/* u45: Fließtext mit mehr Kontrast (helleres Rosarot), Überschriften bleiben im Blutrot */
.chg__lead,.chg__short{color:#f4f1ec}
.chg__no{color:#ffffff}
.chg__panel-in p{color:#f4f1ec}
.chg__src li{color:#d8d4ce}
.chg__src li::before{color:#ffffff}
.chg__panel-in a,.chg__more{color:#ffffff}
.chg__src a:hover,.chg__more:hover{color:#f4f1ec}

/* u48: Forderungen durchgehend schwarz, nur ein neutraler, kaum sichtbarer Lichtschein, kein Rot im Hintergrund */
.chg__sheet{background:
  radial-gradient(70% 80% at 14% 10%,#1c1c20 0,#0d0d0f 40%,transparent 70%) 0 0/100% 100%,
  linear-gradient(185deg,#08080a 0,#040405 55%,#010101 100%);
  box-shadow:inset 0 0 9vw #000000d0}
.chg__sheet::before{display:none}
.chg__sheet::after{mix-blend-mode:screen;opacity:.06}

/* u49: Einleitungstext der Karte in vier Absätzen */
.emigration__text{display:grid;gap:.85em;max-width:520px}
.emigration__text .emigration__lead{max-width:none}
.emigration__lead strong{font-weight:600;color:#fff}

/* Gesichter mit Platzhalter-Zitat: eine Karte pro Wisch */
.faces{position:relative;z-index:4;margin:26px auto 4px;max-width:760px}
.faces__track{display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 0 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.faces__track::-webkit-scrollbar{display:none}
.faces__card{flex:0 0 100%;margin:0;padding:0 48px;scroll-snap-align:center;text-align:center;opacity:.38;transform:scale(.96);transition:opacity .35s ease,transform .35s ease}
.faces__card.is-on{opacity:1;transform:none}
.faces__card img{display:block;width:160px;height:160px;margin:0 auto;border-radius:50%;object-fit:cover;object-position:50% 18%;background:#0b0b0c}
.faces__quote{margin:16px auto 0;max-width:34em}
.faces__quote p{margin:0;font:italic 400 clamp(18px,2.4vw,28px)/1.35 Playfair,Georgia,serif;letter-spacing:-.03em;color:#f3f1ee}
.faces__card figcaption{margin-top:12px;color:#9d9da2;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.faces__nav{position:absolute;z-index:2;top:72px;display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff38;border-radius:50%;background:#050506cc;color:#fff}
.faces__nav--prev{left:0}
.faces__nav--next{right:0}
.faces__nav:hover{background:#111}
@media(max-width:760px){
  .faces{margin-top:22px}
  .faces__card{padding-inline:40px}
  .faces__card img{width:148px;height:148px}
  .faces__quote p{font-size:20px}
  .faces__nav{top:68px;width:32px;height:32px}
}
@media(prefers-reduced-motion:reduce){.faces__card{transition:none}}

/* u50 Handy: „Deutschland flieht“ füllt den ersten Bildschirm, „Das Land blutet aus“ kommt erst beim Scrollen */
@media(max-width:760px){
  .hero{height:100svh;min-height:100svh}
  .hero__image{top:max(72px,calc((100svh - 42.9vw) / 2 - 6svh));width:100%;height:auto;bottom:auto}
  .petition-widget{bottom:calc(var(--seam-depth) + 18px)}
}

/* u58 Handy: hochkantes Motiv füllt den Hero, der Schriftzug bleibt vollständig sichtbar */
@media(max-width:760px){
  .hero{height:min(100svh, calc(100vw * 1280 / 720));min-height:0;background:#141618}
  .hero::before{content:none}
  .hero__image{
    top:0;right:0;bottom:0;left:0;width:100%;height:100%;aspect-ratio:auto;
    object-fit:cover;object-position:center 58%;
    -webkit-mask-image:none;mask-image:none;
  }
  .hero__shade{inset:0;background:linear-gradient(180deg,#05050555 0,transparent 14%)}
}

/* u60: ausgeschriebene Quellen sind Fußnoten, der Beleg steht auf der Quellenseite */
.emigration__lead .ref a,
.map-quelle .ref a,
.globe-source .ref a,
.atl__src .ref a,
.petition-widget__caption .ref a{color:#ed1018;text-decoration:none;font-weight:600}
.map-quelle .ref,
.globe-source .ref,
.atl__src .ref{font-size:13px}
.map-quelle .ref a,
.globe-source .ref a,
.atl__src .ref a{padding:4px 6px}
.map-quelle{position:relative;z-index:6;margin-top:10px}
.globe-source{width:auto;max-width:none}
@media(max-width:760px){
  .map-quelle{margin-top:72px}
}
@media(min-width:1000px){
  .globe-source{width:auto;text-align:right}
}

/* u62: kleinere Weltkugel, größere Porträts, am Desktop drei Gesichter nebeneinander */
@media(min-width:761px){
  .globe-shell{height:calc(clamp(420px,52vh,580px) + var(--rd1))}
}
.faces{--face:176px}
.faces__card img{width:var(--face);height:var(--face)}
.faces__nav{top:calc(10px + (var(--face) - 36px) / 2)}
@media(max-width:760px){
  .faces{--face:176px}
  .faces__card img{width:var(--face);height:var(--face)}
  .faces__nav{top:calc(10px + (var(--face) - 32px) / 2)}
}
@media(min-width:761px){
  .faces{--face:min(220px,18vw);max-width:min(1180px,calc(100vw - 48px));margin-top:32px}
  .faces__card{flex-basis:33.333%;padding:0 18px;scroll-snap-align:start;opacity:.94;transform:none}
  .faces__card.is-on{opacity:1;transform:none}
  .faces__quote p{font-size:clamp(16px,1.15vw,20px)}
  .faces__nav{top:calc(10px + (min(220px,18vw) - 36px) / 2)}
}

/* Die Silhouette startet mittig und wird im Video nach hinten gezogen, bis sie verblasst.
   Am Handy liegen die Füße auf der Straße, knapp über der Blutkante (Welle sitzt etwa 38px über der Naht). */
.hero__figure{
  position:absolute;
  z-index:1;
  left:0;
  right:0;
  margin-inline:auto;
  bottom:calc(var(--seam-depth) + 48px);
  width:min(42vw,320px);
  aspect-ratio:16/9;
  height:auto;
  pointer-events:none;
  user-select:none;
}
.hero__runner{
  display:block;
  width:100%;
  height:100%;
  background:transparent;
}
.hero__walk{
  position:absolute;
  width:320px;
  height:180px;
  opacity:0;
  pointer-events:none;
}
.hero__runner.is-fallback{
  background:#070708;
  -webkit-mask-image:linear-gradient(#000 0,#000 97%,transparent),url("./assets/hero-figur.png");
  mask-image:linear-gradient(#000 0,#000 97%,transparent),url("./assets/hero-figur.png");
  -webkit-mask-size:100% 100%,100% 100%;
  mask-size:100% 100%,100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
@media(min-width:761px){
  .hero__figure{
    top:auto;
    bottom:calc(100% - 42.85vw + 8px);
    width:min(26vw,420px);
    mix-blend-mode:normal;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero__figure,.hero__runner{animation:none;transform:none;translate:none;scale:none;opacity:1}
}
@media(prefers-reduced-motion:reduce) and (min-width:761px){
  .hero__figure{background:transparent}
  .hero__runner{background:transparent;mix-blend-mode:normal}
}

/* Zwei Großstädte: Text mittig, Glühbirne groß im Hintergrund. */
.cities{position:relative;z-index:4;display:grid;place-items:center;overflow:hidden;background:#050506;padding:clamp(28px,3.6vw,48px) clamp(24px,5vw,86px)}
.cities__inner{position:relative;display:grid;place-items:center;width:min(64rem,100%);min-height:clamp(300px,34vh,400px);margin:0 auto}
.cities__copy{position:relative;z-index:1;width:min(46rem,100%);text-align:center}
.cities__copy::before{content:"";position:absolute;z-index:-1;left:50%;top:48%;width:min(150%,52rem);height:158%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center 60%,rgba(5,5,6,.88) 0%,rgba(5,5,6,.55) 44%,rgba(5,5,6,.22) 66%,transparent 84%);pointer-events:none}
.cities__title{max-width:9.4em;margin:0 auto;font:400 clamp(36px,6vw,108px)/.88 Playfair,Georgia,serif;letter-spacing:-.055em}
.cities__title em{display:block;margin-top:.06em;font-style:italic}
.cities__map{position:absolute;z-index:0;left:50%;top:50%;width:min(56vw,34vh,330px);transform:translate(-50%,-50%);overflow:visible;pointer-events:none}
.cities__map:not(.is-ready){visibility:hidden}
.cities__svg{display:block;width:100%;height:auto;overflow:visible}
.cities__bulb-fill path,.cities__bulb-fill rect{fill:#e6dccb}
.cities__bulb-line{fill:none;stroke:#e6dccb;stroke-width:3.2;stroke-linejoin:round;stroke-linecap:round}
.cities__bulb-line rect{fill:none}
.cities__bulb-filament,.cities__bulb-lead{stroke-width:2.2}
.cities__shred{fill:#e6dccb;transform-box:fill-box;transform-origin:center}
.cities__shred--dust{fill:#d9cdb8}
.cities__fly{position:absolute;z-index:2;overflow:visible;pointer-events:none}
.cities__fly .cities__shred{-webkit-mask-image:linear-gradient(to bottom,#000 0%,transparent 62%);mask-image:linear-gradient(to bottom,#000 0%,transparent 62%)}
.cities__text{max-width:38rem;margin:clamp(14px,1.8vw,24px) auto 0;color:#c4c4c8;font-size:clamp(16px,1.48vw,21px);line-height:1.45;letter-spacing:-.02em}
.cities .ref a{color:#ed1018;text-decoration:none;font-weight:600}
@media(max-width:760px){
  .cities{padding-inline:20px}
  .cities__inner{min-height:320px}
  .cities__map{width:min(60vw,236px)}
  .cities__title{max-width:none;font-size:clamp(40px,11vw,64px)}
}

/* Und dann?: Bürobild in kompakter Höhe, Text mittig, roter Keil schneidet unten hinein. */
.und-dann{position:relative;z-index:4;height:min(68svh,640px);min-height:420px;overflow:hidden;background:#0e0d0c}
.und-dann__bild{position:absolute;inset:0}
.und-dann__bild img{width:100%;height:100%;object-fit:cover;object-position:center 58%;filter:grayscale(.18) saturate(.72) brightness(.88) contrast(1.12)}
.und-dann__bild::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 78% 70% at 50% 42%,rgba(10,9,8,.58) 0%,rgba(10,9,8,.18) 58%,rgba(10,9,8,.32) 100%)}
.und-dann__bild::after{content:"";position:absolute;inset:0;z-index:1;background:#1c2836;mix-blend-mode:multiply;opacity:.28;pointer-events:none}
.und-dann__bild > .koernung{z-index:2}
.und-dann__text{position:absolute;left:50%;top:calc(50% + (var(--rd2) - var(--rd1)) / 4);z-index:2;width:min(40rem,calc(100% - 2.5rem));transform:translate(-50%,-50%);text-align:center;color:#fff}
.und-dann__text .reveal{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;min-width:0}
.und-dann__frage{margin:0;max-width:100%;font:italic 400 clamp(52px,7vw,112px)/.92 Playfair,Georgia,serif;letter-spacing:-.012em;text-wrap:balance;text-shadow:0 2px 28px #0000008c}
.und-dann__voraussetzung,.und-dann__folgen,.und-dann__schluss{max-width:100%;min-width:0}
.und-dann__voraussetzung{margin:0;max-width:min(52ch,100%);text-wrap:balance;font:500 16px/1.5 Inter,Arial,sans-serif;color:#ffffffd1}
.und-dann__folgen{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;align-items:center;gap:.28em;font:400 16px/1.5 Inter,Arial,sans-serif;color:#ffffffb8}
.und-dann__schluss{margin:0;max-width:min(18ch,100%);text-wrap:balance;font:italic 400 clamp(24px,2.125vw,34px)/1.2 Playfair,Georgia,serif;letter-spacing:-.005em}
@media(max-width:900px){
  .und-dann__text .reveal{gap:10px}
  .und-dann__frage{font-size:clamp(44px,12vw,72px)}
}

/* Schräge Keile wie bei den Forderungen: Großstädte schieben sich über den Globus (Kante fällt nach rechts),
   „Und dann?“ über die Großstädte (Kante steigt nach rechts). Beide fahren beim Hereinscrollen von unten hoch (--kw). */
.cities{margin-top:calc(-1 * var(--rd1));padding-top:calc(clamp(4px,.8vw,14px) + var(--rd1));padding-bottom:calc(clamp(8px,1vw,16px) + var(--rd2));clip-path:polygon(0 0,100% var(--rd1),100% 100%,0 100%);translate:0 calc((1 - var(--kw,1)) * 9vw)}
.und-dann{margin-top:calc(-1 * var(--rd2));height:calc(min(68svh,640px) + var(--rd2));min-height:calc(420px + var(--rd2));clip-path:polygon(0 var(--rd2),100% 0,100% 100%,0 100%);translate:0 calc((1 - var(--kw,1)) * 9vw)}
.und-dann__text{top:calc(50% + (var(--rd2) - var(--rd1)) / 4)}
.edge--cities-top{z-index:2;top:0;height:var(--rd1);clip-path:polygon(0 0,100% calc(100% - 1.6px),100% 100%,0 1.6px);background:linear-gradient(90deg,#c9161f00,#c9161faa 20%,#c9161f)}
.edge--und-dann-top{z-index:3;top:0;height:var(--rd2);clip-path:polygon(0 calc(100% - 1.6px),100% 0,100% 1.6px,0 100%);background:linear-gradient(90deg,#c9161f,#c9161faa 80%,#c9161f00)}
@media(prefers-reduced-motion:reduce){
  .cities,.und-dann{translate:none}
}

/* Unterstützer: Verbände mit Logo, darunter Platzhalter-Porträts. */
.sup{position:relative;z-index:6;margin-top:calc(-1 * var(--dev-b));clip-path:polygon(0 var(--dev-b),100% 0,100% 100%,0 100%);background:#050506;padding:calc(var(--dev-b) + clamp(64px,8vw,120px)) var(--padx) clamp(56px,7vw,108px)}
.sup__inner{max-width:1480px;margin:0 auto}
.sup__title{margin:0;font:400 clamp(52px,6.8vw,118px)/.86 Playfair,Georgia,serif;letter-spacing:-.055em}
.sup__title b{color:var(--red);font-weight:400}
.sup__orgs{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:clamp(32px,4.5vw,64px) 0 0;padding:0;border-top:1px solid #ffffff24}
.sup__orgs li{min-width:0;border-bottom:1px solid #ffffff24}
.sup__orgs li:nth-child(2n){border-left:1px solid #ffffff24}
.sup__row{display:flex;align-items:center;gap:clamp(16px,2.2vw,32px);min-height:clamp(120px,14vw,168px);padding:clamp(16px,2vw,28px) clamp(4px,1.6vw,20px) clamp(16px,2vw,28px) 0;text-decoration:none}
.sup__orgs li:nth-child(2n) .sup__row{padding-left:clamp(16px,2.4vw,36px)}
.sup__mark{width:clamp(76px,8vw,118px);height:clamp(76px,8vw,118px);object-fit:contain;flex:none;mix-blend-mode:screen;transition:transform .35s ease}
.sup__mark--ph{display:block;box-sizing:border-box;border:1px dashed #ffffff59;mix-blend-mode:normal;background:#ffffff0d}
.sup__orgs a:hover .sup__mark{transform:scale(1.05)}
.sup__org{min-width:0}
.sup__org strong{display:block;font:italic 400 clamp(22px,2vw,34px)/1.12 Playfair,Georgia,serif;letter-spacing:-.03em;color:#f4efeb;overflow-wrap:anywhere}
.sup__row--ph .sup__org strong{color:#a3a3a8}
.sup__org small{display:inline-flex;align-items:center;gap:6px;margin-top:8px;color:#9c9ca1;font:600 11px/1 Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.sup__row--ph .sup__org small{color:#7c7c82}
.sup__orgs a:hover .sup__org small{color:#fff}
.sup__people-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin:clamp(48px,6vw,88px) 0 16px}
.sup__sub{margin:0;color:var(--red);font:700 12px/1 Inter,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.sup__note{margin:0;color:#8e8e93;font-size:13px}
.sup__people{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(10px,1.15vw,16px);margin:0;padding:0}
.sup__people figure{margin:0}
.sup__people img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:#111}
@media(max-width:900px){
  .sup__orgs{grid-template-columns:1fr}
  .sup__orgs li:nth-child(2n){border-left:0}
  .sup__orgs li:nth-child(2n) .sup__row{padding-left:0}
  .sup__people{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:520px){
  .sup__people{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .sup__org strong{font-size:26px}
}
@media(prefers-reduced-motion:reduce){
  .sup__mark{transition:none}
}

/* Im Netz: Platzhalter-Feed zwischen Unterstützern und Atlas, gleiche Pixel-Körnung wie die anderen schwarzen Flächen. */
.soc{position:relative;z-index:6;isolation:isolate;overflow:hidden;background:#050506;border-top:1px solid #ffffff18;padding:clamp(64px,8vw,120px) var(--padx) clamp(72px,9vw,132px)}
.soc__inner{position:relative;z-index:1;max-width:1480px;margin:0 auto}
.soc__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 40px}
.soc__title{margin:0;font:400 clamp(52px,6.8vw,118px)/.86 Playfair,Georgia,serif;letter-spacing:-.055em}
.soc__title b{color:var(--red);font-weight:400}
.soc__note{margin:0 0 .4em;max-width:24em;color:#8e8e93;font-size:14px;line-height:1.45}
.soc__grid{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.2vw,18px);margin:clamp(28px,3.6vw,52px) 0 0;padding:0}
.soc__card{display:flex;flex-direction:column;height:100%;min-width:0;background:#0c0c0e;border:1px solid #ffffff18;color:#f4efeb}
.soc__media{position:relative;isolation:isolate;display:grid;place-items:center;aspect-ratio:4/5;background:#121214;border-bottom:1px solid #ffffff14;color:#9a9aa0;font:600 11px/1 Inter,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.soc__media::before{content:"";position:absolute;inset:0;background-image:var(--koernung);background-size:180px 180px;opacity:.28;image-rendering:pixelated;pointer-events:none}
.soc__media span{position:relative}
.soc__body{display:flex;flex-direction:column;gap:10px;flex:1;padding:clamp(14px,1.3vw,18px)}
.soc__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0}
.soc__net{color:var(--red);font:700 11px/1 Inter,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.soc__meta time{color:#7c7c82;font:600 11px/1 Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.soc__text{margin:0;color:#e4e4e8;font:400 clamp(14px,1.15vw,16px)/1.4 Inter,Arial,sans-serif}
.soc__handle{margin:auto 0 0;color:#9c9ca1;font:italic 400 16px/1.2 Playfair,Georgia,serif}
@media(max-width:900px){
  .soc__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .soc__grid{display:flex;gap:12px;margin-right:calc(-1 * var(--padx));padding:0 var(--padx) 6px 0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:0;scrollbar-width:thin;scrollbar-color:#ffffff33 transparent}
  .soc__grid li{flex:0 0 min(78vw,320px);scroll-snap-align:start}
  .soc__card{min-height:440px}
  .soc__title{font-size:clamp(48px,14vw,72px)}
}

/* Handy: erst "Unterschreibe & schicke eine Postkarte", dann die Postkarten */
/* Schlusspunkt bleibt das Signalrot, auch in roten oder fetten Zeilen */
.pk__cap .title-dot,
.chg__title .title-dot,
.chg__name .title-dot,
.chg__short .title-dot,
.dev__title .title-dot,
.dev__big .title-dot,
.dev__list .title-dot,
.menu-panel .title-dot,
.qnav .title-dot,
.stories-globe__title .title-dot,
.cities__title .title-dot,
.pk__title .title-dot,
.und-dann__frage .title-dot,
.soc__title .title-dot,
.atl__ask .title-dot{color:var(--red)}

@media(max-width:760px){
  .pk{--pk-copy:clamp(230px,64vw,290px);padding-top:calc(var(--pk-up) + 20px)}
  .pk__stage{margin-top:var(--pk-copy);margin-bottom:0}
  .pk__copy{top:calc(-1 * var(--pk-copy))}
  /* Fäden starten unter dem Text und blenden oben weich ein */
  .pk__thread{top:0;height:var(--y);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%);mask-image:linear-gradient(180deg,transparent 0,#000 16%)}
}

/* Fußnoten: hochgestellte Ziffern, der Beleg steht auf der Quellenseite */
.map-quelle .ref,
.globe-source .ref,
.atl__src .ref{
  font-size:13px;
  letter-spacing:0;
  text-transform:none;
}
.map-quelle .ref a,
.globe-source .ref a,
.atl__src .ref a{
  display:inline;
  padding:6px 8px;
  font:600 13px/1 Inter,Arial,sans-serif;
  letter-spacing:0;
  text-transform:none;
  color:#ed1018;
  text-decoration:none;
  background:#050506e6;
  border-radius:4px;
}
.emigration__lead .ref a,
.cities .ref a,
.chg__panel-in .ref a{
  padding:8px 6px;
  margin:-8px -4px;
}
.map-quelle .ref a:hover,
.globe-source .ref a:hover,
.atl__src .ref a:hover,
.emigration__lead .ref a:hover,
.cities .ref a:hover{text-decoration:underline;text-underline-offset:2px}
.chg__panel-in .ref a:hover{color:#e0343d;text-decoration:underline;text-underline-offset:2px}

/* Quelle an der Deutschlandkarte: rechts unten am Abschnitt, über dem überlappenden nächsten Kapitel */
.emigration .map-quelle{
  position:absolute;
  z-index:2;
  top:auto;
  right:clamp(24px,5vw,86px);
  bottom:calc(var(--arc-lap) + 10px);
  left:auto;
  width:max-content;
  max-width:none;
  margin:0;
  padding:0;
  transform:none;
  text-align:right;
}
@media(max-width:760px){
  .emigration .map-quelle{right:20px}
}

/* Quelle an der Weltkarte: rechts unten am Abschnitt, wie an der Deutschlandkarte */
.stories-globe .globe-source{
  position:absolute;
  z-index:4;
  top:auto;
  left:auto;
  right:clamp(24px,5vw,86px);
  bottom:28px;
  width:max-content;
  max-width:none;
  margin:0;
  padding:0;
  text-align:right;
}
@media(max-width:760px){
  .stories-globe .globe-source{right:20px}
}
