/* Scroll storytelling: one object, one thought, then the next. */
.story-chapter { padding:0; height:370svh; }
.story-pin { position:sticky; top:0; height:100svh; min-height:0; padding:calc(var(--header) + 26px) var(--gutter) 28px; display:flex; flex-direction:column; overflow:hidden; }
.story-pin > .section-label { flex-shrink:0; margin-bottom:22px; }
.story-bottom { display:flex; align-items:center; justify-content:space-between; gap:40px; flex-shrink:0; position:relative; z-index:3; }
.story-controls { display:flex; align-items:center; gap:25px; }
.story-controls button { position:relative; text-align:left; font-size:10px; padding:16px 0; border-top:1px solid rgba(var(--line),.4); color:rgb(var(--muted)); min-width:90px; }
.story-controls button span { display:block; font-size:9px; margin-bottom:8px; }
.story-controls button::before { content:''; position:absolute; top:-1px; left:0; width:0; height:1px; background:rgb(var(--accent)); transition:width .6s var(--ease); }
.story-controls button[aria-pressed=true] { color:rgb(var(--accent)); }
.story-controls button[aria-pressed=true]::before { width:100%; }
.story-bottom>.text-button { font-size:10px; }
.local-theater { position:relative; flex:1; min-height:0; }
.map-window { position:absolute; right:-8vw; top:-24%; height:142%; width:70%; overflow:hidden; mask-image:linear-gradient(transparent,#000 14%,#000 80%,transparent); }
.map-world { position:absolute; left:50%; height:100%; aspect-ratio:900/1100; transform-origin:50% 45%; will-change:transform; }
.balkans-map { width:100%;height:100%;max-width:none;opacity:.9; }
.map-route { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.map-route path { stroke:#d5bd8a; stroke-width:1.25; fill:none; stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--route-progress,0)); opacity:.7; }
.map-pin { position:absolute; width:0; height:0; color:#afbbab; }
.map-pin>i { display:block; position:absolute; height:7px; width:7px; border-radius:50%; background:currentColor; transform:translate(-50%,-50%); transition:background .6s; }
.map-city-label { position:absolute; left:14px; top:-8px; white-space:nowrap; font-size:11px; opacity:.65; transition:opacity .5s,color .5s; }
.pin-rings { display:block; width:34px; height:34px; border:1px solid #d5bd8a; border-radius:50%; position:absolute; left:-17px;top:-17px; transform:scale(.2); opacity:0; transition:transform .85s var(--ease),opacity .85s; }
.pin-rings::after { content:''; position:absolute; inset:-8px; border:1px solid #d5bd8a40; border-radius:50%; }
.map-pin.is-active { color:#ead5a7; }
.map-pin.is-active .pin-rings { opacity:.9; transform:scale(1); }
.map-pin.is-active .map-city-label { opacity:1; font-weight:600; }
.map-pin.is-past>i { background:#d5bd8a; }
.map-coordinate { position:absolute; bottom:14%; right:10%; font-size:7px; letter-spacing:.2em; color:#a5b3a1; }
.local-narrative { position:relative; height:100%; width:52%; z-index:2; pointer-events:none; }
.local-frame { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; transition:opacity .5s var(--ease),transform .7s var(--ease); }
.local-step { font-size:9px; letter-spacing:.14em; color:rgb(var(--accent)); margin-bottom:28px; }
.local-frame h3 { font-size:clamp(65px,8vw,128px); font-weight:400; line-height:1; letter-spacing:-.07em; }
.local-frame>p { font-size:14px; margin-top:30px; max-width:360px; color:rgb(var(--muted)); }
.local-query { font-size:9px; line-height:1.7; margin-top:32px; color:rgb(var(--muted)); max-width:350px; }
.local-payoff h2 { font-size:clamp(55px,6vw,96px); }
.local-payoff h2 em { font-family:Manrope,Arial,sans-serif;font-style:normal;letter-spacing:-.065em; }
.local-motion[data-local-step="3"] .map-window { opacity:.65; }
.map-window { transition:opacity .9s; }
/* The six-month programme reads as a moving editorial timeline. */
.content-motion { height:450svh; }
.content-motion .content-heading { align-items:center; margin:0; }
.content-motion .content-heading h2 { font-size:clamp(45px,5.1vw,78px); }
.content-motion .publishing-number { gap:24px; }
.content-motion .publishing-number>span { font-size:105px; }
.content-motion .publishing-number p { font-size:10px; }
.content-motion .cadence-row { margin:18px 0 0; justify-content:flex-end; gap:20px; }
.content-motion .cadence-toggle { gap:5px; }
.content-motion .cadence-toggle button { font-size:9px; padding:9px 16px; }
.content-motion .cadence-row>p { font-size:9px;max-width:240px; }
.editorial-stage { position:relative; flex:1; min-height:0; display:flex; align-items:center; }
.month-monument { position:absolute; left:-.025em; top:50%; transform:translateY(-51%) translateX(var(--month-drift,0px)); font-size:clamp(180px,28vw,400px); line-height:1; letter-spacing:-.11em; color:rgb(var(--accent)); font-weight:200; opacity:.15; font-variant-numeric:tabular-nums; }
.content-motion .month-panel { position:relative; margin-left:29%; padding:25px 0; min-height:0; width:71%; display:block; }
.month-caption { font-size:9px;letter-spacing:.17em;color:rgb(var(--accent));margin-bottom:14px; }
.content-motion .month-panel h3 { font-size:clamp(36px,4.3vw,65px); line-height:1.09; max-width:740px; margin-bottom:18px; font-weight:400; letter-spacing:-.055em; }
.content-motion .month-focus { max-width:580px;font-size:12px; }
.content-motion .month-topics { margin-top:22px; display:flex; flex-wrap:wrap; gap:9px 20px; }
.content-motion .month-topics li { padding:0;border:0;font-size:10px; }
.content-motion .month-topics li:before { margin-right:7px; }
.content-motion .month-tabs { position:relative; gap:18px; flex-shrink:0; padding-top:8px; }
.content-motion .month-tab { font-size:10px; padding:16px 0;border-bottom:0;border-top:1px solid rgba(var(--line),.5); position:relative; }
.content-motion .month-tab:before { content:'';position:absolute;left:0;top:-1px;height:2px;width:100%;background:rgb(var(--accent));transform:scaleX(var(--month-fill,0));transform-origin:left; }
.content-motion .month-tab.active { border-bottom:0;color:rgb(var(--accent)); }
.content-motion .content-footnote { padding-top:14px; margin-top:5px; display:flex; justify-content:space-between; align-items:center; gap:30px; border:0; }
.content-motion .content-footnote p { max-width:650px;font-size:9px; }
.content-motion .content-footnote .text-button { flex-shrink:0;font-size:10px;padding:8px 0; }
.story-kicker { display:flex;align-items:center;gap:15px;color:rgb(var(--muted));font-size:8px;letter-spacing:.1em; }
.story-kicker::before { content:'';height:1px;width:26px;background:rgb(var(--accent)); }
.finding-row,.measurement-list>div { transition:opacity .7s var(--ease),transform .8s var(--ease); }
@media(max-width:1000px) {
  .local-frame h3 { font-size:76px; }
  .story-controls { gap:15px; }.story-controls button { min-width:65px; }
  .content-motion .publishing-number>span { font-size:80px; }
}
@media(max-width:760px) {
  .story-pin { padding:calc(var(--header) + 16px) var(--gutter) 20px; }
  .story-pin>.section-label { font-size:7px; margin-bottom:14px; }
  .story-bottom { display:block; }
  .story-controls { gap:12px; width:100%; }
  .story-controls button { min-width:0;flex:1;font-size:8px;padding:12px 0; }
  .story-controls button span { font-size:7px;margin-bottom:6px; }
  .story-bottom>.text-button { font-size:8px;padding:8px 0; }
  .local-theater { display:flex;flex-direction:column; }
  .map-window { width:calc(100% + 100px);right:-50px;top:-9%;height:75%; mask-image:linear-gradient(transparent,#000 13%,#000 78%,transparent); }
  .map-world { min-height:390px; }
  .map-city-label { font-size:12px; }
  .map-coordinate { display:none; }
  .local-narrative { width:100%;height:43%;margin-top:auto; }
  .local-frame { justify-content:flex-start; padding-top:10px; }
  .local-step { font-size:7px;margin-bottom:16px; }
  .local-frame h3 { font-size:58px; }
  .local-frame>p { font-size:11px; margin-top:16px; max-width:290px; }
  .local-query { font-size:8px;margin-top:16px; }
  .local-payoff h2 { font-size:43px; }
  .local-payoff .local-step { margin-bottom:10px; }
  .local-payoff>p { font-size:10px;margin-top:12px; }
  .local-payoff .local-query { font-size:7px;margin-top:12px; }
  .content-motion { height:450svh; }
  .content-motion .content-heading { align-items:center;gap:20px; }
  .content-motion .content-heading h2 { font-size:36px; }
  .content-motion .publishing-number { display:block; }
  .content-motion .publishing-number>span { font-size:59px; }
  .content-motion .publishing-number p { font-size:7px;margin-top:8px;max-width:82px; }
  .content-motion .cadence-row { justify-content:space-between; margin-top:18px;gap:12px; }
  .content-motion .cadence-toggle button { font-size:8px;padding:8px 12px; }
  .content-motion .cadence-row>p { font-size:7px;max-width:125px; }
  .month-monument { top:4%;transform:none;font-size:160px;opacity:.13; }
  .content-motion .month-panel { margin-left:0;width:100%;padding:90px 0 12px; }
  .month-caption { font-size:7px;margin-bottom:12px; }
  .content-motion .month-panel h3 { font-size:35px;max-width:340px;margin-bottom:14px; }
  .content-motion .month-focus { font-size:10px; }
  .content-motion .month-topics { display:block;margin-top:15px; }
  .content-motion .month-topics li { font-size:9px;margin-top:6px; }
  .content-motion .month-tabs { gap:8px;padding-top:5px; }
  .content-motion .month-tab { font-size:8px;padding:12px 0; }
  .content-motion .content-footnote { display:block;padding-top:8px;margin:0; }
  .content-motion .content-footnote p { font-size:8px;margin:0; }
  .content-motion .content-footnote .text-button { font-size:8px;padding:8px 0;margin-top:2px; }
}
@media(min-width:761px) and (max-height:720px) {
  .story-pin { padding-top:calc(var(--header) + 14px);padding-bottom:16px; }
  .story-pin>.section-label { margin-bottom:14px; }
  .local-frame h3 { font-size:88px; }.local-payoff h2 { font-size:65px; }
  .local-step { margin-bottom:20px; }.local-frame>p { margin-top:22px; }.local-query { margin-top:20px; }
  .content-motion .content-heading h2 { font-size:43px; }.content-motion .publishing-number>span { font-size:70px; }
  .content-motion .cadence-row { margin-top:8px; }.content-motion .month-panel h3 { font-size:40px; }
  .content-motion .month-panel { padding:12px 0; }.month-caption { margin-bottom:10px; }
  .content-motion .month-panel h3 { margin-bottom:12px; }.content-motion .month-topics { margin-top:12px; }
  .content-motion .month-tab { padding:12px 0; }.content-motion .content-footnote { padding-top:8px; }
}
@media(max-width:760px) and (max-height:700px) {
  .story-pin { padding-top:calc(var(--header) + 10px);padding-bottom:10px; }
  .story-pin>.section-label { margin-bottom:8px; }
  .local-narrative { height:46%; }.local-frame { padding-top:0; }
  .local-step { margin-bottom:10px;font-size:6px; }.local-frame h3 { font-size:44px; }
  .local-frame>p { font-size:9px;margin-top:10px; }.local-query { font-size:7px;margin-top:10px; }
  .local-payoff h2 { font-size:34px; }.local-payoff>p { font-size:9px;margin-top:9px; }
  .local-payoff .local-query { margin-top:8px;font-size:6px; }
  .map-window { height:75%;top:-15%; }.map-world { min-height:280px; }
  .story-controls button { padding:10px 0;font-size:7px; }.story-controls button span { margin-bottom:4px; }
  .content-motion .content-heading h2 { font-size:29px; }.content-motion .publishing-number>span { font-size:48px; }
  .content-motion .publishing-number p { font-size:6px;margin-top:4px; }
  .content-motion .cadence-row { margin-top:9px; }.content-motion .cadence-toggle button { padding:6px 9px;font-size:7px; }
  .content-motion .cadence-row>p { font-size:6px; }
  .month-monument { font-size:116px;top:5%; }
  .content-motion .month-panel { padding:50px 0 8px; }
  .month-caption { margin-bottom:7px;font-size:6px; }
  .content-motion .month-panel h3 { font-size:27px;margin-bottom:8px; }
  .content-motion .month-focus { font-size:8px; }.content-motion .month-topics { margin-top:8px; }
  .content-motion .month-topics li { font-size:7px;margin-top:4px; }
  .content-motion .month-tab { font-size:7px;padding:10px 0; }
  .content-motion .content-footnote { padding-top:4px; }.content-motion .content-footnote p { font-size:6px; }
  .content-motion .content-footnote .text-button { padding:7px 0;font-size:7px; }
}
@media(prefers-reduced-motion:reduce) {
  .local-frame,.map-window,.pin-rings,.map-city-label,.story-controls button::before { transition:none!important; }
  .local-frame { transform:none!important; }
  .map-world { will-change:auto; }
}
@media print {
  .story-chapter { height:auto!important; }
  .story-pin { position:static;height:auto;min-height:600px;overflow:visible;padding:25px 0; }
  .local-theater { min-height:500px; }
  .story-bottom,.content-motion .month-tabs { display:none; }
  .editorial-stage { min-height:350px; }
  .content-motion .month-panel { margin-left:20%;width:80%; }
}
/* Anchor navigation enters pinned scenes at their actual start. */
.story-chapter,.motion-chapter { scroll-margin-top:calc(0px - var(--header)); }
/* Geography dissolves into the canvas instead of showing a rectangular edge. */
.local-motion .map-window { mask-image:radial-gradient(ellipse at 58% 48%,#000 34%,#000b 54%,transparent 75%); }
@media(max-width:760px){.local-motion .map-window{mask-image:radial-gradient(ellipse at 50% 47%,#000 33%,#000b 54%,transparent 74%)}}
@media(max-width:760px){
  .content-motion .content-heading{display:flex;flex-shrink:0}
  .content-motion .publishing-number{margin:0;flex-shrink:0;width:65px}
  .content-motion .cadence-row{display:flex;flex-shrink:0}
  .content-motion .cadence-row>p{margin:0}
}

.story-pin{overflow:clip}
