/* An expanded journey, with the same restrained invitations and landscape. */
.site-header .signature span,.case-header .signature span{font-size:var(--type-label);letter-spacing:0}
.opening-eyebrow{max-width:340px;line-height:1.6}
.project-status{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:var(--type-label);line-height:1.5;margin:0 0 14px}
.project-status:before{content:'';width:4px;height:4px;background:var(--accent)}
.project-intro h1{font-size:var(--type-display)}
.project-intro .role{max-width:330px;line-height:1.5}
.project-intro .project-note{max-width:330px}
#work-index{width:350px;max-width:calc(100vw - 40px);max-height:calc(100svh - 120px);overflow-y:auto;overscroll-behavior:contain;padding:20px 16px;background:#eeedebf5}
#work-index .index-group{font-size:var(--type-label);color:var(--muted);padding:10px 14px 4px;margin:4px 0}
#work-index button{padding:11px 14px;min-height:58px;border-left:1px solid transparent}
#work-index button[aria-current]{border-left-color:var(--accent);background:#dad6ce55}
#work-index button .index-name{color:var(--ink);font-size:var(--type-body);font-family:var(--serif);margin:0}
#work-index button span+span{font-size:var(--type-label);line-height:1.4;max-width:270px;margin-top:4px}
.route-stops{width:clamp(270px,33vw,450px);display:block}
.route-stops>button{width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 15px;min-width:0;color:var(--on-dark)}
.route-stops>button:after{display:none}
#route-current{font-family:var(--serif);font-size:var(--type-body)}
#route-count{font-size:var(--type-label);font-variant-numeric:tabular-nums;opacity:.7}
.route-line{left:0;right:0;bottom:16px}
.case-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin:10px 0 45px;padding:25px 0;border-top:1px solid #b6b2b6;border-bottom:1px solid #b6b2b6}
.case-facts dt{font-size:var(--type-label);color:var(--muted);margin-bottom:10px}
.case-facts dd{font-family:var(--serif);font-size:var(--type-lead);line-height:1.25;margin:0;max-width:300px}
.archive-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:40px;row-gap:55px;margin:10px 0 40px}
.archive-project{margin:0}
.archive-project img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;background:#cdc9c5}
.archive-project figcaption{margin-top:16px}
.archive-project figcaption>span{font-size:var(--type-label)}
.archive-project h4{font-family:var(--serif);font-size:var(--type-lead);font-weight:400;letter-spacing:-.03em;color:var(--ink);margin:6px 0 9px}
.archive-project p{font-size:var(--type-label);margin:0}
.contact-block{padding:55px 0 15px;border-top:1px solid #b6b2b6}
.contact-block h3{font-size:var(--type-section);font-family:var(--serif);font-weight:400;letter-spacing:-.04em;margin:0 0 20px}
.contact-block>p{font-size:var(--type-body);line-height:1.65}
.contact-block .ai-note{font-size:var(--type-label);color:var(--muted);max-width:560px;margin-top:55px}
.case-external{margin:0 0 30px}
@media(max-height:760px) and (min-width:761px){.project-intro h1{font-size:var(--type-section)}.project-intro{top:20%}.project-status{margin-bottom:8px}.project-intro .role{margin-bottom:14px}}
@media(max-width:760px){
 .site-header .signature span,.case-header .signature span{font-size:var(--type-label);max-width:180px;line-height:1.4}
 .site-header .header-actions{gap:8px}
 .project-intro{top:18%;width:78%;max-width:340px}
 .project-intro h1{font-size:var(--type-section)}
 .project-intro .role{max-width:260px;font-size:var(--type-label);margin-bottom:13px}
 .project-status{font-size:var(--type-label);margin-bottom:8px}
 .project-subtitle{max-width:270px}
 .route-stops{width:calc(100% - 120px)}
 .route-stops>button{padding:0 0 15px;gap:12px}
 #route-current{font-size:var(--type-body)}#route-count{font-size:var(--type-label)}
 .route-line{left:0;right:0;bottom:16px}
 .case-summary h2{font-size:var(--type-section)}
 .case-facts{grid-template-columns:1fr;gap:24px;padding:25px 0}
 .case-facts dd{font-size:var(--type-lead);max-width:none}
 .archive-grid{grid-template-columns:1fr;gap:38px}
 .archive-project h4{font-size:var(--type-lead)}
 .case-header .signature{font-size:var(--type-body)}.case-header{padding-left:20px;padding-right:20px}
 .case-header .back-button{font-size:0;gap:0;min-width:35px;min-height:40px;justify-content:center}
 .case-header .back-button .close-icon{font-size:var(--type-body)}
 .contact-block .primary-button{font-size:var(--type-lead);gap:15px}
}
/* Focusing the route after a resize must not scroll the full-screen stage. */
#journey{overflow:clip}

.hubby-gallery{margin:40px 0 50px}.hubby-gallery>div{display:flex;justify-content:center;gap:clamp(16px,4vw,60px);padding:40px 30px;background:#d6d3ca}.hubby-gallery .polar-device{flex:1 1 0;min-width:0;max-width:265px;align-self:flex-start}.hubby-gallery figcaption{margin-top:12px}
@media(max-width:760px){.hubby-gallery>div{overflow-x:auto;justify-content:flex-start;scroll-snap-type:x mandatory;padding:24px;gap:24px;overscroll-behavior-x:contain}.hubby-gallery .polar-device{width:220px;max-width:none;flex:0 0 220px;scroll-snap-align:center}.case-external .primary-button{font-size:var(--type-lead);line-height:1.35;gap:15px}}

/* Polarsteps: the supplied product screens carry the before-and-after story. */
.polar-story{margin:80px 0 35px}
.polar-story-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:64px}
.polar-story-heading h3{font:400 var(--type-section)/1.04 var(--serif);letter-spacing:-.04em;margin:0}
.polar-story-heading>p{font-size:var(--type-label);line-height:1.7;color:var(--muted);max-width:310px;margin:0}
.polar-chapter{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.5fr);gap:clamp(35px,7vw,120px);align-items:start;padding:48px 0 64px;border-top:1px solid #b6b2b6}
.polar-chapter-copy{padding-top:40px;max-width:355px}
.polar-chapter h4{font:400 var(--type-section)/1.08 var(--serif);letter-spacing:-.035em;margin:0 0 22px}
.polar-chapter-copy>p{font-size:var(--type-body);line-height:1.75;margin:0;color:var(--ink)}
.polar-screen-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3.3vw,55px);max-width:660px;width:100%;justify-self:center}
.polar-screen{min-width:0;margin:0}
.polar-screen-label{font-size:var(--type-label);line-height:1.5;min-height:38px;color:var(--muted)}
.polar-screen-open{display:block;position:relative;width:100%;background:transparent;padding:0;color:var(--ink);text-align:left;cursor:zoom-in}
.polar-screen-open img{display:block;width:100%;height:auto;aspect-ratio:393/852;object-fit:contain}
.polar-enlarge{display:block;font-size:var(--type-label);padding:10px 0 0;color:var(--muted)}
.polar-screen figcaption{font-size:var(--type-label);line-height:1.6;max-width:270px;margin-top:8px}
.polar-design-note{font-size:var(--type-label);line-height:1.7;max-width:630px;color:var(--muted);margin:0}
.media-viewer[open]{display:flex;flex-direction:column;align-items:center;opacity:1;transform:none;background:var(--paper);padding:22px 4vw;overflow:auto;transition:none}
.media-viewer::backdrop{background:#232426c9;backdrop-filter:blur(12px)}
.media-viewer-header{display:flex;align-items:center;justify-content:space-between;width:100%;gap:25px;margin-bottom:20px}
.media-viewer-header>p{font-size:var(--type-label);margin:0}
.media-viewer .back-button{min-height:44px}
.media-viewer>.polar-device{padding:0;flex:none;width:min(430px,calc((100svh - 155px)*.48625));max-width:100%;margin:0 auto}
.media-viewer .device-glass img{display:block;width:100%;height:auto;aspect-ratio:393/852;object-fit:contain}
.media-viewer-hint{font-size:var(--type-label);color:var(--muted);line-height:1.6;margin:16px 0 0;text-align:center}
@media(max-width:900px){.polar-chapter{grid-template-columns:1fr;gap:28px}.polar-chapter-copy{padding:0;max-width:560px}.polar-chapter h4 br{display:none}.polar-story-heading{display:block}.polar-story-heading>p{margin-top:24px;max-width:440px}.polar-screen-pair{max-width:610px}.polar-chapter{padding:32px 0 42px}}
@media(max-width:480px){.polar-story{margin-top:48px}.polar-story-heading{margin-bottom:36px}.polar-screen-pair{gap:16px}.polar-screen-label{font-size:var(--type-label);min-height:44px}.polar-screen figcaption{font-size:var(--type-label)}.polar-chapter-copy>p{font-size:var(--type-label)}.media-viewer-header>p{font-size:var(--type-label)}.media-viewer{padding:16px!important}}

/* Nike: the real installation and gameplay give the abstract landmark context. */
.nike-gallery{margin:64px 0 55px}
.nike-gallery-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:34px}
.nike-gallery-heading h3{font:400 var(--type-section)/1.04 var(--serif);letter-spacing:-.04em;margin:0}
.nike-gallery-heading>p{max-width:350px;font-size:var(--type-body);line-height:1.7;color:var(--ink);margin:0}
.nike-gallery figure{margin:0;min-width:0}
.nike-gallery img{display:block;width:100%;height:auto;object-fit:contain}
.nike-motion-pair{margin-bottom:40px}
.nike-motion-pair img{aspect-ratio:16/9;object-fit:contain;background:#ccc9c8}
.nike-gallery .nike-installation{width:100%;margin:0 0 40px}
.nike-gallery-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.nike-gallery figcaption{margin-top:12px;max-width:630px}
.nike-visual-credit{font-size:var(--type-label);line-height:1.7;color:var(--muted);margin:28px 0 0}
.nike-visual-credit a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.nike-gallery{margin:40px 0}.nike-gallery-heading{display:block;margin-bottom:24px}.nike-gallery-heading>p{margin-top:20px;font-size:var(--type-label)}.nike-gallery-pair{grid-template-columns:1fr;gap:28px}.nike-gallery .nike-installation,.nike-motion-pair{margin-bottom:28px}}

.witcher-process{display:grid;grid-template-columns:minmax(220px,.75fr) minmax(0,1.5fr);gap:clamp(30px,6vw,100px);align-items:center;margin:60px 0 50px}
.witcher-process h3{font:400 var(--type-section)/1.07 var(--serif);letter-spacing:-.035em;margin:0 0 24px}
.witcher-process p{max-width:370px;font-size:var(--type-body);line-height:1.75;color:var(--ink);margin:0}
.witcher-process figure{margin:0;min-width:0}
.witcher-process img{display:block;width:100%;height:auto}
.witcher-process figcaption{margin-top:12px}
@media(max-width:760px){.witcher-process{grid-template-columns:1fr;gap:26px;margin:40px 0 32px}.witcher-process p{max-width:none}.witcher-process h3 br{display:none}}

/* Shared full-width media edges, with original image proportions preserved. */
.original-media img{height:auto;min-height:0;max-height:none;object-fit:contain}
.case-film{margin:0 0 48px}
.case-film-player{position:relative;aspect-ratio:16/9;background:#161719}
.case-film-player iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
.case-film figcaption{margin-top:12px}
.case-film figcaption a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.case-film{margin-bottom:32px}}

.case-film-fallback{display:block;position:absolute;inset:0;color:var(--on-dark)}
.case-film-fallback img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.65)}
.case-film-fallback span{position:absolute;left:clamp(20px,4vw,64px);bottom:clamp(20px,4vw,64px);font-family:var(--serif);font-size:var(--type-section);text-decoration:underline;text-underline-offset:8px}

/* Model-specific transparent hardware overlays; the supplied screens stay intact. */
.polar-device{display:block;position:relative;isolation:isolate;width:100%;aspect-ratio:389/800;padding:0;filter:drop-shadow(0 12px 12px #15191b20)}
.polar-device::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:url('./assets/polarsteps/devices/iphone-16.png') center/100% 100% no-repeat}
.polar-device[data-device="18-pro"]::after{background-image:url('./assets/polarsteps/devices/iphone-18-pro.png')}
.device-glass{display:block;position:absolute;left:5.09%;right:5.34%;top:2.25%;bottom:2.375%;overflow:hidden;background:#000;border-radius:13.5% / 6.2%}
.polar-device[data-device="18-pro"] .device-glass{left:4.11%;right:4.11%;top:1.625%;bottom:1.625%;border-radius:14.8% / 6.8%}
.polar-device .device-glass img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain;border-radius:0}
.polar-screen-open .polar-enlarge{padding-top:18px}

/* v51: silent loop videos replace the GIFs; they inherit the old image sizing */
.original-media video{display:block;width:100%;height:auto;background:#ccc9c8;object-fit:contain}
.archive-project video{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;background:#cdc9c5}
.nike-gallery video{display:block;width:100%;height:auto;object-fit:contain}
.nike-motion-pair video{aspect-ratio:16/9;object-fit:contain;background:#ccc9c8}
.site-header .header-actions,.case-header .header-actions{flex-shrink:0}.header-actions button{white-space:nowrap}
/* Static portrait fallback on phones: JS writes an inline scale() transform, which used to wipe out the centring translate */
@media(max-width:760px){#portrait-source{transform:none;translate:-70% 0}}

/* Keep the small source clip contained beside the installation photograph. */
.puma-gallery{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(18px,3vw,40px);margin:32px 0 0}
.puma-gallery figure{margin:0;min-width:0}
.puma-motion-stage{display:grid;place-items:center;aspect-ratio:3/2;background:#ccc9c8;overflow:hidden}
.puma-motion-stage video{display:block;width:100%;max-width:360px;max-height:100%;height:auto;object-fit:contain}
.puma-gallery img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
@media(max-width:600px){.puma-gallery{grid-template-columns:1fr;gap:24px}.puma-motion-stage video{max-width:300px}}
