/* STADION v58: page-local rhythm, shared card language and accent results.
   Brand typography, palette, rail geometry and homepage are not redesigned. */
@media(min-width:810px){
  .case-page>.framer-lw6o2m .framer-x3ci3f{justify-content:center!important;gap:24px!important;align-self:stretch!important}
  .case-page>.framer-lw6o2m .framer-1eel7kf{padding:0 24px 24px!important;height:auto!important}
  .case-page>.framer-lw6o2m .framer-1hylex0{padding:0 24px!important;height:auto!important}
}
.case-page>.framer-lw6o2m .framer-x3ci3f{position:relative!important}
.case-back-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;align-self:flex-start;min-height:44px;padding:10px 16px;box-sizing:border-box;border:1px solid var(--color-rule);border-radius:99px;background:var(--color-soft);color:var(--color-ink);font:500 14px/1.4 var(--font-body);text-decoration:none;white-space:nowrap;margin:0 24px;transition:background-color .18s,color .18s,border-color .18s}
.case-back-link:hover{background:var(--color-paper);border-color:var(--color-muted)}
.case-back-link:active{transform:translateY(1px)}
@media(min-width:1024px){.case-back-link{position:absolute;top:16px;left:24px;margin:0;z-index:2}}
@media(min-width:1200px){.case-back-link{top:24px}}
.case-page .case-chapter{padding:64px 24px 72px;text-align:left}
.case-page .case-chapter h2{font-size:48px;line-height:1.12;letter-spacing:-.025em;overflow-wrap:normal;text-wrap:balance}
.case-page .case-chapter h3,.case-page .case-feature--wide .case-feature-copy h3{font-size:28px;line-height:1.25;text-wrap:balance;overflow-wrap:normal}
.case-chapter .case-chapter-heading{gap:16px;max-width:760px;margin-bottom:40px}
.case-chapter .case-chapter-heading p{font-size:18px;line-height:1.55;text-wrap:pretty}
.case-page .case-blocks{gap:56px}
.case-page .case-copy{gap:16px}
.case-page .case-copy-body{gap:14px}
.case-page .case-copy p{font-size:17px;line-height:1.65;text-wrap:pretty}
.case-page .case-feature{gap:40px;padding-top:40px}
.case-page .case-feature:first-child{padding-top:0}
.case-page .case-feature--reading .case-feature-copy{grid-template-columns:minmax(0,1fr);gap:32px;max-width:760px}
.case-page .case-feature--reading{grid-template-columns:minmax(0,1fr)}
.case-page .case-feature--reading>.case-feature-copy{width:100%;margin-inline:0}
.case-feature--reading .case-copy-body,.case-context-story .case-copy-body{text-align:left}
.case-feature--reading .case-copy+.case-copy{padding-top:32px;border-top:1px solid var(--color-rule)}
.case-page .case-feature.case-feature--wide{gap:32px}
.case-page .case-feature--wide>.case-feature-copy{max-width:760px}
.case-feature:not(.case-feature--wide):not(.case-feature--reading)>.case-feature-copy{text-align:left}
.case-page .case-reading-block{max-width:760px}

/* Context reads in order, then a full-rail break introduces the process. */
.case-context-preview{margin:0 0 40px}
.case-context-preview .case-video-wrap{aspect-ratio:60/31}
.case-context-preview .case-video{width:100%;height:100%;object-fit:cover}
.case-context-story{display:grid;gap:32px;max-width:760px}
.case-context-story .case-narrative-group{gap:32px}
.case-context-story .case-copy+.case-copy,.case-context-story>.case-copy{padding-top:32px}
.case-process-band{position:relative;border-top:1px solid var(--color-rule);margin:56px -24px -72px;padding:56px 24px 64px}
.case-process-band::before,.case-process-band::after{content:'';position:absolute;top:-7px;width:14px;height:14px;background:var(--color-ink);mask:url('/assets/grid-star.svg') center/contain no-repeat;-webkit-mask:url('/assets/grid-star.svg') center/contain no-repeat;pointer-events:none}
.case-process-band::before{left:-7px}.case-process-band::after{right:-7px}
.case-page .case-process{gap:32px}
.case-process .case-process-heading{gap:16px;max-width:760px}
.case-page .case-process ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.case-page .case-process li{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:start;align-content:start;gap:16px;min-width:0;padding:28px 24px;border:1px solid var(--color-rule);border-radius:18px;background:var(--color-paper);color:var(--color-ink)}
.case-page .case-process li::before,.case-page .case-process li::after{content:none}
.case-stage-number{font:500 24px/1.25 var(--font-display);font-variant-numeric:tabular-nums;color:var(--color-muted)}
.case-stage-copy{display:grid;gap:12px;min-width:0}
.case-page .case-process .case-stage-copy>*{grid-area:auto}
.case-page .case-process h4{min-height:0;font-size:22px;line-height:1.35;text-wrap:balance;overflow-wrap:normal}
.case-page .case-process li p{font-size:16px;line-height:1.5}

/* One outcome title, then a close-linked explanation and its qualified figures. */
.case-outcome-composition{grid-template-columns:minmax(0,1fr);gap:24px;padding:32px;margin-bottom:32px}
.case-outcome-composition>.case-chapter-heading{margin:0;gap:12px}
.case-outcome-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);gap:32px;align-items:start}
.case-outcome-story{gap:12px}
.case-page .case-outcome-story p{font-size:17px;line-height:1.55}
.case-outcome-composition .case-results{padding-left:32px;gap:20px}
.case-outcome-composition .case-results>div{padding:0;gap:10px}
.case-outcome-composition .case-results>div+div{padding-top:20px}
.case-outcome-composition .case-results strong{font-size:52px;line-height:1.1}

/* The complete system narrative stays beside all three evidence panels. */
.case-system-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.65fr);gap:48px;align-items:start}
.case-system-summary{display:grid;gap:28px;position:sticky;top:calc(var(--case-header-height) + 24px);align-self:start;min-width:0}
.case-system-summary>.case-chapter-heading{margin:0;gap:18px}
.case-system-summary .case-copy{gap:0}
.case-system-evidence{display:grid;gap:40px;min-width:0}
.case-system-evidence .case-media{gap:12px}

/* A single eye affordance replaces the navigation-like arrow on all case images. */
.case-page .case-zoom{width:40px;height:40px;aspect-ratio:1;flex:none}
.case-zoom svg{display:block;width:22px;height:22px}
.case-video:focus-visible{outline:2px solid var(--color-focus);outline-offset:-4px}
.case-media-error{font:400 14px/1.5 var(--font-body);color:var(--color-muted);padding:12px}

/* No visible transport or scrollbar. Hover/focus pauses the automatic strips. */
.case-screen-reel{gap:32px;margin-top:56px;padding-top:40px}
.case-reel-heading{gap:12px}
.case-autoplay .case-auto-viewport{display:flex;gap:24px;overflow:hidden;overflow-anchor:none;overscroll-behavior-x:contain;scrollbar-width:none;scroll-behavior:auto;touch-action:pan-y;padding:0;margin:0;min-width:0}
.case-auto-viewport::-webkit-scrollbar{display:none}
.case-reel-viewport>.case-media{flex:0 0 360px;width:360px;align-self:stretch;gap:0;grid-template-rows:auto 1fr;background:var(--color-paper);border:1px solid var(--color-rule);border-radius:24px;overflow:hidden}
.case-reel-viewport .case-image-link{border-radius:23px;overflow:hidden}
.case-reel-viewport figcaption{padding:20px;min-height:0;font-size:14px;line-height:1.55;text-wrap:balance;background:var(--color-paper)}
.case-page .case-more{grid-template-columns:minmax(0,1fr);gap:40px;padding-block:64px}
.case-page .case-more h2{font-size:48px;line-height:1.12;text-wrap:balance}
.case-more>h2{text-align:left}
.case-more-grid>a{flex:0 0 calc((100% - 24px)/2);width:calc((100% - 24px)/2);min-width:0;display:flex;flex-direction:column;gap:0;border:1px solid var(--color-rule);border-radius:24px;background:var(--color-soft);color:var(--color-ink);overflow:hidden}
.case-more-grid img{border-radius:0;margin:0;width:100%;aspect-ratio:4/3;object-fit:cover}
.case-project-caption{display:grid;gap:8px;padding:20px;min-width:0}
.case-page .case-more-grid h3{font-size:28px;line-height:1.25;overflow-wrap:normal;text-wrap:balance}
.case-autoplay:not([data-auto-ready]) .case-auto-viewport,.case-autoplay[data-auto-static] .case-auto-viewport{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.case-autoplay:not([data-auto-ready]) .case-auto-viewport>*,.case-autoplay[data-auto-static] .case-auto-viewport>*{width:auto;max-width:100%}
.case-sr-only,.case-motion-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.case-motion-toggle:focus-visible{position:fixed;top:calc(var(--case-header-height) + 16px);left:24px;z-index:11;width:auto;height:auto;padding:12px 16px;margin:0;clip-path:none;background:var(--color-ink);color:var(--color-paper);font:500 14px/1.5 var(--font-body);border-radius:14px}
@media(max-width:1199.98px){
  .case-page .case-process ol{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-page .case-chapter h2,.case-page .case-more h2{font-size:40px}
  .case-system-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.8fr);gap:32px}
  .case-system-summary>.case-chapter-heading h2{font-size:36px}
}
@media(max-width:809.98px){
  .case-back-link{margin:16px 16px 0}
  .case-page .case-chapter{padding:40px 16px 48px}
  .case-page .case-chapter h2,.case-page .case-more h2{font-size:32px}
  .case-page .case-chapter h3,.case-page .case-feature--wide .case-feature-copy h3{font-size:24px}
  .case-chapter .case-chapter-heading{gap:14px;margin-bottom:32px}
  .case-chapter .case-chapter-heading p{font-size:17px;line-height:1.5}
  .case-page .case-copy p{font-size:16px;line-height:1.6}
  .case-page .case-blocks{gap:40px}
  .case-page .case-feature{gap:28px;padding-top:32px}
  .case-page .case-feature.case-feature--wide{gap:28px}
  .case-feature--wide>.case-feature-copy p{text-align:left;text-wrap:pretty}
  .case-context-preview{margin-bottom:32px}
  .case-context-story,.case-context-story .case-narrative-group{gap:28px}
  .case-context-story .case-copy+.case-copy,.case-context-story>.case-copy{padding-top:28px}
  .case-process-band{margin:40px -16px -48px;padding:40px 16px 48px}
  .case-page .case-process li{padding:20px}
  .case-page .case-process h4{font-size:22px}
  .case-outcome-composition{padding:24px 20px;gap:20px;margin-bottom:24px}
  .case-outcome-composition>.case-chapter-heading{margin-bottom:0}
  .case-outcome-body{grid-template-columns:minmax(0,1fr);gap:20px}
  .case-page .case-outcome-story p{font-size:16px}
  .case-outcome-composition .case-results{padding:20px 0 0;border-left:0}
  .case-outcome-composition .case-results strong{font-size:44px}
  .case-system-layout{grid-template-columns:minmax(0,1fr);gap:32px}
  .case-system-summary{position:static;gap:24px}
  .case-system-summary>.case-chapter-heading{margin:0}
  .case-system-summary>.case-chapter-heading h2{font-size:32px}
  .case-system-evidence{gap:32px}
  .case-screen-reel{margin-top:40px;padding-top:32px;gap:28px}
  .case-autoplay .case-auto-viewport{gap:16px}
  .case-reel-viewport>.case-media{flex-basis:240px;width:240px;border-radius:18px}
  .case-reel-viewport .case-image-link{border-radius:17px}
  .case-reel-viewport figcaption{padding:16px}
  .case-page .case-zoom{width:32px;height:32px}
  .case-zoom svg{width:19px;height:19px}
  .case-more-grid>a{flex-basis:85%;width:85%;border-radius:18px}
  .case-page .case-more-grid h3{font-size:24px}
  .case-project-caption{padding:16px}
}
[data-auto-clone]{overflow-anchor:none}
.case-autoplay:not([data-auto-ready]) [data-auto-clone],.case-autoplay[data-auto-static] [data-auto-clone]{display:none!important}
@media(max-width:650px){
  .case-page .case-process ol{grid-template-columns:minmax(0,1fr)}
  .case-page .case-process li{row-gap:12px}
  .case-process .case-stage-copy{display:contents}
  .case-page .case-process .case-stage-copy h4{grid-column:2;grid-row:1}
  .case-page .case-process .case-stage-copy p{grid-column:1/-1;grid-row:2}
  .case-autoplay:not([data-auto-ready]) .case-auto-viewport,.case-autoplay[data-auto-static] .case-auto-viewport{grid-template-columns:minmax(0,1fr)}
}
/* CSS also handles live preference changes, independent of JS event timing. */
@media(prefers-reduced-motion:reduce){
  [data-auto-clone]{display:none!important}
  .case-autoplay .case-auto-viewport{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .case-autoplay .case-auto-viewport>*{width:auto;max-width:100%}
}
@media(prefers-reduced-motion:reduce) and (max-width:650px){.case-autoplay .case-auto-viewport{grid-template-columns:minmax(0,1fr)}}

/* The brief is a composed spread: origin, task, then personal responsibility.
   Titles always stay with their own copy. The video above remains full-width. */
.case-page .case-context-story--brief{max-width:none;gap:32px;grid-area:auto}
.case-context-story--brief>.case-narrative-group{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:start}
.case-context-story--brief .case-narrative-group>.case-copy{padding-top:0;border-top:0}
.case-context-story--brief .case-narrative-group>.case-copy:first-child{padding-top:28px}
.case-context-story--brief .case-narrative-group>.case-copy+ .case-copy{padding:28px 32px;background:var(--color-soft);border:1px solid var(--color-rule);border-radius:24px}
.case-context-story--brief>.case-copy{padding-top:32px;border-top:1px solid var(--color-rule)}
.case-context-story--brief>.case-copy .case-copy-body{max-width:760px}

/* Chapter rail and narrative have different roles, not two competing H3 cards.
   The original dense research sheet spans the entire grid below both columns. */
.case-research-opening{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.65fr);gap:32px 48px;align-items:start;min-width:0}
.case-research-introduction,.case-research-narrative,.case-research-proof{min-width:0}
.case-research-introduction>.case-chapter-heading{margin:0;max-width:none}
.case-research-introduction .case-chapter-heading p{max-width:360px}
.case-research-narrative{display:grid;gap:32px;max-width:760px}
.case-research-narrative>.case-copy+ .case-copy{padding-top:32px;border-top:1px solid var(--color-rule)}
.case-research-proof{grid-column:1/-1}
.case-research-proof .case-media{gap:12px}
.case-chapter--editorial>.case-blocks{margin-top:64px}

/* Interface chapters are grouped by user task. These distances include every
   gap/padding contribution instead of accidentally adding 56px + 40px. */
#interface>.case-blocks{gap:0}
#interface .case-feature{margin-top:48px;padding-top:31px;border-top:1px solid var(--color-rule)}
#interface .case-feature:first-child{margin-top:0;padding-top:0;border-top:0}
#interface .case-feature[data-case-spacing="connected"]{margin-top:48px;padding-top:0;border-top:0}
#interface .case-feature--sequence{grid-template-columns:minmax(0,1fr);gap:40px}
.case-sequence-step{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.6fr);gap:40px;align-items:start;min-width:0}
.case-sequence-step>.case-feature-media{min-width:0}
#interface>.case-screen-reel{margin-top:32px;padding-top:31px}

@media(max-width:1199.98px){
  .case-research-opening{grid-template-columns:minmax(0,1fr);gap:32px}
  .case-research-introduction>.case-chapter-heading{max-width:760px}
  .case-research-introduction .case-chapter-heading p{max-width:680px}
  .case-research-narrative{max-width:760px}
  .case-context-story--brief>.case-narrative-group{gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .case-context-story--brief .case-narrative-group>.case-copy+ .case-copy{padding:24px}
  .case-context-story--brief .case-narrative-group>.case-copy:first-child{padding-top:24px}
  .case-sequence-step{grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr);gap:32px}
}
@media(max-width:809.98px){
  .case-page .case-context-story--brief,.case-context-story--brief>.case-narrative-group{gap:28px;grid-template-columns:minmax(0,1fr)}
  .case-context-story--brief .case-narrative-group>.case-copy+ .case-copy{padding:24px 20px;border-radius:18px}
  .case-context-story--brief .case-narrative-group>.case-copy:first-child{padding-top:0}
  .case-context-story--brief>.case-copy{padding-top:28px}
  .case-research-opening{gap:28px}
  .case-research-narrative{gap:28px}
  .case-research-narrative>.case-copy+ .case-copy{padding-top:28px}
  .case-chapter--editorial>.case-blocks{margin-top:48px}
  #interface .case-feature{margin-top:32px;padding-top:23px}
  #interface .case-feature[data-case-spacing="connected"]{margin-top:36px;padding-top:0}
  #interface .case-feature--sequence{gap:36px}
  .case-sequence-step{grid-template-columns:minmax(0,1fr);gap:28px}
  #interface>.case-screen-reel{margin-top:24px;padding-top:23px}
}

/* v58 is scoped to STADION. Homepage files and brand type scales stay intact. */
.case-page[data-case="stadion"]{
  --case-chapter-top:88px;--case-chapter-bottom:96px;--case-content-inset:24px;
  --case-scene-gap:112px;--case-connected-gap:80px;--case-scene-before:64px;
}
.case-page[data-case="stadion"] .case-chapter{padding-block:var(--case-chapter-top) var(--case-chapter-bottom)}
.case-page[data-case="stadion"] .case-copy{gap:12px}
.case-page[data-case="stadion"] .case-copy-body{gap:8px}
.case-page[data-case="stadion"] .case-chapter-heading{margin-bottom:48px}
.case-page[data-case="stadion"] .case-blocks{gap:80px}
.case-page[data-case="stadion"] .case-feature{position:relative;padding-top:32px}
.case-page[data-case="stadion"] .case-feature:first-child{padding-top:0}
.case-page[data-case="stadion"] .case-feature--wide{gap:48px}
.case-page[data-case="stadion"] .case-feature-media{gap:32px}
.case-page[data-case="stadion"] .case-context-preview{margin-bottom:64px}
/* Trim the encoded 44px bars plus their 2px dark/codec fringe, not the phones. */
.case-page[data-case="stadion"] .case-context-preview .case-video-wrap{aspect-ratio:480/247}
.case-page[data-case="stadion"] .case-process-band{margin:80px -24px -96px;padding:80px 24px 88px}
.case-page[data-case="stadion"] .case-process{gap:40px}
.case-page[data-case="stadion"] .case-process ol{gap:24px}
.case-page[data-case="stadion"] .case-stage-number{color:var(--color-accent)}
.case-page[data-case="stadion"] .case-research-opening{row-gap:48px}
.case-page[data-case="stadion"] .case-research-introduction>.case-chapter-heading{margin:0}
.case-page[data-case="stadion"] .case-chapter--editorial>.case-blocks{margin-top:96px}
.case-page[data-case="stadion"] .case-system-evidence{gap:64px}
.case-page[data-case="stadion"] .case-system-summary>.case-chapter-heading{margin:0}

/* One controlled interval per scene; close paragraphs never set chapter rhythm. */
.case-page[data-case="stadion"] #interface>.case-blocks{gap:0}
.case-page[data-case="stadion"] #interface .case-feature{margin-top:var(--case-scene-before);padding-top:calc(var(--case-scene-gap) - var(--case-scene-before));border-top:0}
.case-page[data-case="stadion"] #interface .case-feature:first-child{margin-top:0;padding-top:0}
.case-page[data-case="stadion"] #interface .case-feature[data-case-spacing="connected"]{margin-top:var(--case-connected-gap);padding-top:0}
.case-page[data-case="stadion"] #interface .case-feature--sequence{gap:var(--case-connected-gap)}
.case-page[data-case="stadion"] #interface>.case-screen-reel{margin-top:64px;padding-top:48px;border-top:0}

/* Every full-rail internal divider meets the same transparent 14px stars.
   The line and masks are separate: no opaque square covers a surface. */
.case-page[data-case="stadion"] :is(.case-feature:not(:first-child),.case-screen-reel){border-top:0;position:relative}
.case-page[data-case="stadion"] :is(.case-feature:not(:first-child),.case-screen-reel)::before{
  content:'';position:absolute;pointer-events:none;left:calc(-1 * var(--case-content-inset));right:calc(-1 * var(--case-content-inset));top:0;height:1px;background:var(--color-rule);
}
.case-page[data-case="stadion"] :is(.case-feature:not(:first-child),.case-screen-reel)::after{
  content:'';position:absolute;pointer-events:none;left:calc(-1 * var(--case-content-inset) - 7px);right:calc(-1 * var(--case-content-inset) - 7px);top:-7px;height:14px;background:var(--color-ink);z-index:2;
  mask-image:url('/assets/grid-star.svg'),url('/assets/grid-star.svg');mask-size:14px 14px;mask-position:left center,right center;mask-repeat:no-repeat;
  -webkit-mask-image:url('/assets/grid-star.svg'),url('/assets/grid-star.svg');-webkit-mask-size:14px 14px;-webkit-mask-position:left center,right center;-webkit-mask-repeat:no-repeat;
}
.case-page[data-case="stadion"] #interface .case-feature[data-case-spacing="connected"]::before,
.case-page[data-case="stadion"] #interface .case-feature[data-case-spacing="connected"]::after{content:none}
.case-page[data-case="stadion"] .case-chapter::before,.case-page[data-case="stadion"] .case-chapter::after,
.case-page[data-case="stadion"] .case-process-band::before,.case-page[data-case="stadion"] .case-process-band::after{z-index:2;flex:none}

/* Title and explanation start beside the figures, not above their column. */
.case-page[data-case="stadion"] .case-outcome-composition{grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);gap:24px 40px;padding:32px;margin-bottom:64px}
.case-page[data-case="stadion"] .case-outcome-composition>.case-chapter-heading{grid-column:1;grid-row:1;margin:0}
.case-page[data-case="stadion"] .case-outcome-body{display:contents}
.case-page[data-case="stadion"] .case-outcome-story{grid-column:1;grid-row:2;align-content:start}
.case-page[data-case="stadion"] .case-outcome-composition .case-results{grid-column:2;grid-row:1/3;align-self:stretch;align-content:center;gap:28px;padding:32px;background:var(--color-accent);color:#000;border:0;border-radius:20px}
.case-page[data-case="stadion"] .case-results>div{padding:0;gap:12px}
.case-page[data-case="stadion"] .case-results>div+div{border-top:1px solid #0003;padding-top:28px}
.case-page[data-case="stadion"] .case-results strong{color:#000}
.case-page[data-case="stadion"] .case-results p{color:#171717;font-size:16px;line-height:1.5}

/* Case routes are always in Projects: the retained SSR dot must agree. */
html[data-case-route] nav .framer-1f4mxxz{transform:rotate(-90deg)!important;opacity:1!important;pointer-events:none}

/* Match the actual homepage project cards, not a separate grey-card system. */
.case-page[data-case="stadion"] .case-more{display:block;position:relative;padding:0}
.case-more-heading{position:relative;padding:64px 24px;border-bottom:1px solid var(--color-rule)}
.case-more-heading::before,.case-more-heading::after{content:'';position:absolute;bottom:-7px;width:14px;height:14px;background:var(--color-ink);mask:url('/assets/grid-star.svg') center/contain no-repeat;-webkit-mask:url('/assets/grid-star.svg') center/contain no-repeat;z-index:2;pointer-events:none}
.case-more-heading::before{left:-7px}.case-more-heading::after{right:-7px}
.case-page[data-case="stadion"] .case-more-grid{gap:0;align-items:stretch}
.case-page[data-case="stadion"] .case-more-grid>.case-project-card{box-sizing:border-box;position:relative;flex:0 0 50%;width:50%;display:flex;flex-direction:column;gap:0;min-width:0;padding:64px 24px;border:0;border-radius:0;background:transparent;overflow:visible;color:var(--color-ink);text-decoration:none}
.case-project-card::after{content:'';position:absolute;right:0;top:0;bottom:0;width:1px;background:var(--color-rule);pointer-events:none}
.case-project-image{position:relative;flex:none;width:100%;aspect-ratio:4/3;border-radius:26px;overflow:hidden;box-shadow:.1763px .764px .7841px -.1429px #00000008,.4319px 1.8717px 1.9208px -.2857px #00000008,.8184px 3.5465px 3.6397px -.4286px #00000008,1.4288px 6.1913px 6.354px -.5714px #0000000a,2.4867px 10.7756px 11.0588px -.7143px #0000000a,4.5546px 19.7367px 20.2555px -.8571px #0000000f,9px 39px 40.025px -1px #0000001a}
.case-page[data-case="stadion"] .case-project-image img{position:absolute;inset:0;width:100%;height:100%;max-width:none;border-radius:0;margin:0;object-fit:cover;transform:scale(1);transition:transform 550ms cubic-bezier(.2,.7,.2,1)}
.case-page[data-case="stadion"] [data-project="dirft"] .case-project-image img{inset:auto;left:50%;top:75%;width:145%;height:145%;transform:translate(-50%,-75%) scale(1)}
.case-page[data-case="stadion"] .case-project-caption{display:flex;align-items:flex-start;gap:20px;padding:24px 0 0;background:transparent}
.case-project-copy{display:grid;gap:8px;min-width:0;flex:1}
.case-page[data-case="stadion"] .case-project-copy h3{font:500 35px/1.4 var(--font-display);letter-spacing:normal;text-transform:none;text-wrap:balance;transition:color 180ms ease}
.case-page[data-case="stadion"] .case-project-copy p{font:400 16px/1.6 var(--font-body);text-wrap:pretty;color:var(--color-muted)}
.case-project-arrow{display:grid;place-items:center;flex:none;width:49px;height:49px;border-radius:50%;background:var(--color-soft);color:var(--color-ink);transition:background-color 180ms,color 180ms}
.case-project-arrow svg{width:24px;height:24px}
.case-project-card:is(:hover,:focus-visible) h3{color:var(--color-accent)}
.case-project-card:is(:hover,:focus-visible) .case-project-arrow{background:var(--color-accent);color:#000}
.case-page[data-case="stadion"] .case-more[data-auto-static] .case-more-grid,
.case-page[data-case="stadion"] .case-more:not([data-auto-ready]) .case-more-grid{gap:0}
.case-page[data-case="stadion"] .case-more[data-auto-static] .case-project-card,
.case-page[data-case="stadion"] .case-more:not([data-auto-ready]) .case-project-card{width:auto;border-bottom:1px solid var(--color-rule)}
@media(hover:hover) and (pointer:fine){
  .case-project-card:is(:hover,:focus-visible) .case-project-image img{transform:scale(1.035)}
  .case-page[data-case="stadion"] [data-project="dirft"]:is(:hover,:focus-visible) .case-project-image img{transform:translate(-50%,-75%) scale(1.035)}
}
@media(max-width:1199.98px){
  .case-page[data-case="stadion"] .case-project-copy p{font-size:15px;line-height:1.6}
  .case-page[data-case="stadion"] .case-outcome-composition{gap:24px 32px}
  .case-page[data-case="stadion"] .case-outcome-composition .case-results{padding:24px}
}
@media(max-width:809.98px){
  .case-page[data-case="stadion"]{--case-chapter-top:56px;--case-chapter-bottom:64px;--case-content-inset:16px;--case-scene-gap:72px;--case-connected-gap:56px;--case-scene-before:40px}
  .case-page[data-case="stadion"] .case-chapter-heading{margin-bottom:40px}
  .case-page[data-case="stadion"] .case-blocks{gap:48px}
  .case-page[data-case="stadion"] .case-feature{padding-top:24px;gap:32px}
  .case-page[data-case="stadion"] .case-feature--wide{gap:32px}
  .case-page[data-case="stadion"] .case-feature-media{gap:24px}
  .case-page[data-case="stadion"] .case-context-preview{margin-bottom:40px}
  .case-page[data-case="stadion"] .case-process-band{margin:56px -16px -64px;padding:56px 16px 64px}
  .case-page[data-case="stadion"] .case-process{gap:32px}
  .case-page[data-case="stadion"] .case-process ol{gap:20px}
  .case-page[data-case="stadion"] .case-research-opening{row-gap:32px}
  .case-page[data-case="stadion"] .case-chapter--editorial>.case-blocks{margin-top:64px}
  .case-page[data-case="stadion"] .case-system-evidence{gap:40px}
  .case-page[data-case="stadion"] #interface>.case-screen-reel{margin-top:40px;padding-top:32px}
  .case-page[data-case="stadion"] .case-outcome-composition{grid-template-columns:minmax(0,1fr);gap:20px;padding:24px 20px;margin-bottom:40px}
  .case-page[data-case="stadion"] .case-outcome-story{grid-column:1;grid-row:2}
  .case-page[data-case="stadion"] .case-outcome-composition .case-results{grid-column:1;grid-row:3;padding:24px;border-radius:18px;gap:24px}
  .case-page[data-case="stadion"] .case-results>div+div{padding-top:24px}
  .case-more-heading{padding:48px 16px}
  .case-page[data-case="stadion"] .case-more-grid>.case-project-card{flex-basis:85%;width:85%;padding:64px 16px 62px}
  .case-project-image{border-radius:26px}
  .case-page[data-case="stadion"] .case-project-caption{display:grid;grid-template-columns:minmax(0,1fr) 49px;column-gap:20px;row-gap:8px}
  .case-project-copy{display:contents}
  .case-page[data-case="stadion"] .case-project-copy h3{grid-column:1;grid-row:1;font-size:25px;align-self:center}
  .case-page[data-case="stadion"] .case-project-copy p{grid-column:1/-1;grid-row:2}
  .case-project-arrow{grid-column:2;grid-row:1}
}
@media(prefers-reduced-motion:reduce){
  .case-page[data-case="stadion"] .case-more-grid{gap:0}
  .case-page[data-case="stadion"] .case-more-grid>.case-project-card{width:auto;border-bottom:1px solid var(--color-rule)}
  .case-page[data-case="stadion"] .case-project-image img{transition:none}
}