/* English review: a wide, held device journey. Other locales retain their layout. */
.wide-journey {position:relative;height:720svh;margin:65px auto 90px;width:min(1380px,calc(100% - 80px))}
.wide-sticky {position:sticky;top:80px;height:calc(100svh - 95px);display:flex;flex-direction:column;justify-content:flex-start}
.wide-copy {position:relative;flex:0 0 145px;text-align:center;width:min(940px,100%);margin:10px auto 0}
.wide-copy article {position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s,transform .45s}
.wide-copy article.is-active {opacity:1;visibility:visible}
.wide-copy h2 {font-size:clamp(40px,4.5vw,68px);font-weight:500;letter-spacing:-.045em;line-height:1.08;margin:0 0 18px}
.wide-copy p {font-size:clamp(17px,1.35vw,20px);line-height:1.5;max-width:820px;margin:0 auto;color:var(--muted)}
.wide-copy .wide-performance {font-size:14px;margin-top:10px;color:var(--dim)}
.wide-art.journey-stage {position:relative;top:auto;flex:1;height:auto;min-height:0;max-height:700px;width:100%;align-self:auto;margin:0;isolation:isolate}
.wide-art .journey-panel {transition:opacity .32s ease;visibility:visible;pointer-events:none}
.wide-art .scene-mic .device-phone {width:42%;transform:translateY(var(--camera-y,0px)) rotateX(var(--camera-pitch,0deg)) rotateY(var(--camera-yaw,0deg)) rotateZ(-90deg) scale(var(--camera-scale,1))}
.wide-art .device-phone video {position:absolute;left:50%;top:50%;width:216%;height:46.3%;transform:translate(-50%,-50%) rotate(90deg)}
.wide-art .device-ipad {width:min(88%,calc((100svh - 250px) * 1.65));margin:0 auto}
.wide-art .device-mac {width:min(100%,calc((100svh - 280px) * 1.65));margin:0 auto}
.wide-art .scene-concert {overflow:hidden}
.wide-art .scene-concert video {width:100%;height:100%;object-fit:contain;display:block}
.wide-art .show-device {will-change:transform}
@media(max-width:900px){.wide-journey{width:calc(100% - 36px)}.wide-copy{flex-basis:170px}.wide-copy h2{font-size:42px}}
@media(max-width:700px){
 .wide-journey{height:640svh;margin:40px auto 60px;width:calc(100% - 24px)}
 .wide-sticky{top:78px;height:calc(100svh - 90px)}
 .wide-copy{flex-basis:210px;padding:0 12px}.wide-copy h2{font-size:37px;line-height:1.08}.wide-copy p{font-size:16px;line-height:1.45}.wide-copy .wide-performance{font-size:12px}
 .wide-art.journey-stage{display:block;flex:1;max-height:360px}.wide-art .scene-mic .device-phone{width:52%}
 .wide-art .device-ipad{width:100%}.wide-art .device-mac{width:105%}.wide-art .scene-concert video{object-fit:contain}
}


.wide-art .device-ipad{transform:translateY(calc(var(--camera-y,0px) - 8px)) rotateX(calc(-35deg + var(--camera-pitch,0deg))) rotateY(var(--camera-yaw,0deg)) scale(var(--camera-scale,1))}
@media(max-width:700px){.wide-art .device-ipad{transform:translateY(var(--camera-y,0px)) rotateX(var(--camera-pitch,0deg)) rotateY(var(--camera-yaw,0deg)) scale(var(--camera-scale,1))}}

@media(prefers-reduced-motion:reduce){
 .wide-copy article,.wide-art .journey-panel{transition:none}
 .wide-art .show-device{will-change:auto}
}

/* The English collection is an expandable, responsive grid. */
.visual-atlas-grid .visual-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto;gap:32px 24px;overflow:visible;scroll-snap-type:none;padding:0}
.visual-atlas-grid .visual-list li{border:0;padding:0}
.visual-atlas-grid .visual-list li[hidden]{display:none}
.visual-atlas-grid .visual-preview{margin-bottom:12px}
.visual-atlas-grid .visual-preview picture{border:0}
.visual-atlas-grid .visual-preview img{transition:transform .18s ease}
.visual-atlas-grid .visual-preview:hover img{transform:scale(1.025)}
.visual-atlas-grid .visual-caption h3{font-size:18px;line-height:1.3}
.visual-atlas-grid .visual-description{margin-top:8px;-webkit-line-clamp:3}
.visual-grid-controls{text-align:center;margin-top:32px}
.visual-grid-controls button{font:inherit;font-size:15px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:8px;padding:12px 20px;cursor:pointer}
.visual-grid-controls button:hover{border-color:var(--warm);color:var(--warm)}
.visual-grid-controls button:focus-visible{outline:2px solid var(--warm);outline-offset:5px}
.visual-grid-controls button[hidden]{display:none}
@media(max-width:1279px){.visual-atlas-grid .visual-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:980px){.visual-atlas-grid .visual-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.visual-atlas-grid .visual-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.visual-atlas-grid .visual-caption h3{font-size:16px}.visual-atlas-grid .visual-description{font-size:13px}}
@media(max-width:359px){.visual-atlas-grid .visual-list{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.visual-atlas-grid .visual-preview img{transition:none}.visual-atlas-grid .visual-preview:hover img{transform:none}}

.home-v2 #visuals{scroll-margin-top:110px}

html:not([lang^="en"]) .wide-copy{flex-basis:190px}
html:not([lang^="en"]) .wide-copy h2{font-size:clamp(36px,4vw,60px)}
@media(max-width:700px){html:not([lang^="en"]) .wide-copy{flex-basis:240px}html:not([lang^="en"]) .wide-copy h2{font-size:34px}}
