/* Phone adaptations retain the approved desktop composition and scroll sequence. */
@media(max-width:760px){
 html{scroll-padding-bottom:calc(78px + env(safe-area-inset-bottom,0px));-webkit-text-size-adjust:100%}
 body{overflow-x:clip}
 .header{padding-left:max(14px,env(safe-area-inset-left,0px));padding-right:max(14px,env(safe-area-inset-right,0px))}
 .header-socials a{min-height:44px;display:inline-flex;align-items:center}
 .client-rail{padding-bottom:max(5px,env(safe-area-inset-bottom,0px));padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(8px,env(safe-area-inset-right,0px))}
 .client-rail-track{touch-action:pan-x;overscroll-behavior-x:contain;scroll-padding-inline:14px;gap:6px}
 .client-rail-track a{min-height:44px;padding-inline:8px;min-width:80px;-webkit-tap-highlight-color:transparent}
 .client-rail-track img{width:76px;max-height:28px}
 .client-rail-track [data-brand=yoleau] img{width:76px}
 .client-rail-track .pack-logo{max-width:76px}
 .chapter-case .client-website{min-height:44px;margin-top:5px;margin-bottom:3px}
 .chapter-case .can-film-controls button{min-height:44px;min-width:44px}
 .chapter-case .project-details[open]{bottom:calc(84px + env(safe-area-inset-bottom,0px))!important;-webkit-overflow-scrolling:touch}
 #contact.contact-banner{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
 #contact .contact-signature>a{min-height:44px;display:flex;align-items:center;width:fit-content}
 .footer{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))!important}
 .case-story-body a,.contact-signature a{overflow-wrap:anywhere}
}
@media(max-width:760px) and (max-height:650px){
 .chapter-case .client-website{margin-top:0;margin-bottom:0}
 .chapter-case.chapter-stack .case-story{padding-top:calc(var(--story-top,250px) - 8px)!important}
}
@media(hover:none){
 a,button,summary{touch-action:manipulation}
 .client-rail-track a{touch-action:pan-x}
}
/* Landscape phones retain the desktop two-column story within the visible stage. */
@media(max-width:1000px) and (max-height:500px) and (orientation:landscape){
 .chapter-case .case-story{height:calc(100% - 78px - env(safe-area-inset-bottom,0px))!important;padding:8px 22px!important;justify-content:center!important}
 .chapter-case .case-story>div{width:44%!important;max-width:390px!important}
 .chapter-case .case-story h4{font-size:23px!important;line-height:1.04!important;margin-bottom:8px!important}
 .chapter-case .case-story-body>p{font-size:12px!important;line-height:1.4!important}
 .chapter-case .client-website{margin:3px 0 0;min-height:36px}
 .chapter-case .project-details{margin-top:0!important}
 .chapter-case .project-details summary{min-height:36px!important}
 .chapter-case .project-details[open]{inset:8px 16px 82px!important;overflow-y:auto}
 .client-rail{padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(8px,env(safe-area-inset-right,0px))}
}
/* Mobile revision: portrait staging, optical title centering, and square opening film. */
@media(max-width:760px){
 .opening-signature{top:40%}
 .hero .film-stage{inset:calc(50% - 38px) 0 auto;height:auto;aspect-ratio:1;transform:translateY(-50%) scale(var(--film-scale,1));overflow:hidden}
 .hero .film-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .studio-purpose,.clients-announcement{inset:0 0 calc(78px + env(safe-area-inset-bottom,0px));padding:0 20px;align-items:center;justify-content:center;text-align:center}
 .studio-purpose span{position:static;margin:0 0 20px;font-size:26px;line-height:1;text-align:center}
 .studio-purpose strong{font-size:12.6vw;text-align:center;letter-spacing:-.055em}
 .clients-announcement h2{width:100%;text-align:center;font-size:16vw;margin:0}
 .client-rail-track{scroll-behavior:auto;overflow-anchor:none}
 .chapter-case .case-pack picture{display:contents}
 .chapter-case .case-pack img{object-position:50% 50%!important}
 #yoleau.chapter-case .case-pack img[data-portrait]{width:var(--photo-w)!important;height:var(--photo-h)!important}
 #contact .contact-portrait{overflow-anchor:none}
 #contact .contact-portrait>img{aspect-ratio:1;width:100%;height:auto;max-height:none}
 .footer{min-height:240px;padding-bottom:calc(130px + env(safe-area-inset-bottom,0px))!important;overflow-anchor:none}
 .footer #motion-toggle{min-height:44px}
}
@media(max-width:760px){
 .hero .film-stage{top:calc(43% - 38px)}
 .studio-purpose{bottom:calc(190px + env(safe-area-inset-bottom,0px))}
 .chapter-case .project-film iframe{pointer-events:none!important}
 .chapter-case .project-film{touch-action:pan-y}
 .scroll-bubbles i{left:clamp(12px,var(--bx),calc(100% - var(--bs) - 12px))}
 .yoleau-side-bubbles,.world-bubbles{left:12px;right:12px}
 .client-rail{backdrop-filter:none;background:#101213}
}

/* Shorter native scroll journey on phones; desktop and static mode stay intact. */
@media(max-width:760px){
 html:not(.reduced-motion):not(.no-webgl) .chapter-case:is(#ciao,#yoleau,#dunn,#uma-ipa,#lefort,#fylgo,#source,#bellevoye){height:275svh}
 .photo-bottle-world{contain:layout paint}
 .photo-product{filter:none}
 #bellevoye.photographic-bottle .photo-product{filter:none}
}
/* Release offscreen phone paint layers while keeping the native scroll geometry. */
@media(max-width:760px){
 .mobile-stage-sleep>.case-pin,.mobile-stage-sleep>.hero-pin{content-visibility:hidden}
 .mobile-stage-sleep .case-pin *,.mobile-stage-sleep .hero-pin *{animation-play-state:paused!important;will-change:auto!important}
}
/* A vertical swipe on the fixed client rail must still scroll the page. */
@media(max-width:760px){
 .client-rail-track,.client-rail-track a{touch-action:pan-x pan-y}
}
/* Mobile contact: the same pink editorial banner, two people together. */
@media(max-width:760px){
 #contact.contact-banner{padding:48px 12px 32px;min-height:0}
 #contact .contact-heading{padding:0 3px}
 #contact .contact-title-mobile,#contact .contact-invitation,#contact .contact-eyebrow{display:none}
 #contact .contact-title-desktop{display:block;font-family:"Arial Black",Arial,sans-serif;font-weight:900;letter-spacing:-.06em}
 #contact h2{font-size:clamp(25px,7.4vw,48px);line-height:.97;-webkit-text-stroke:.7px currentColor}
 #contact .contact-duo{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px;margin:56px auto 0;max-width:560px}
 #contact .contact-retro-signature{display:block;position:absolute;width:60%;height:auto;left:50%;top:-49px;transform:translateX(-50%) rotate(-5deg);z-index:0;pointer-events:none}
 #contact .contact-portrait{z-index:1;padding:0;min-width:0}
 #contact .contact-portrait>img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;max-height:none}
 #contact .contact-signature{margin:5px 2px 0;gap:0;align-items:center;text-align:center}
 #contact .contact-signature h3{font-size:clamp(22px,6vw,32px);margin:0}
 #contact .contact-signature>a{font-size:clamp(10px,2.9vw,15px);gap:3px;min-height:44px;white-space:nowrap;overflow-wrap:normal}
 #contact .contact-signature .contact-profile{font-size:10px;min-height:36px}
 /* Modern Source journey instead of the legacy flattened carton. */
 #source.source-machine-chapter .scene-slot,#source.source-machine-chapter .product-atmosphere,#source.source-machine-chapter .case-wash{display:none}
 #source.source-machine-chapter .case-story,#source.source-machine-chapter .case-story-body>p{color:#302313}
 #source.chapter-case .case-pack{padding:0!important;inset:0 0 78px}
 #source.chapter-case .case-pack img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
 #source.chapter-case .case-pack:after{background:none}
 .source-journey{position:absolute;inset:0;z-index:3;overflow:hidden;pointer-events:none}
 .source-journey[hidden]{display:none}
 .source-journey-ground{position:absolute;inset:0;background:url('assets/generated/worlds/source-distinct-nov6-mobile.webp') center/cover}
 .source-inside{position:absolute;overflow:hidden;background:#17130f}
 .source-inside>canvas{display:block;width:100%;height:100%}
 .source-dose-caption{position:absolute;left:6%;bottom:16%;color:#fff5e9;font:600 24px/1.1 Arial,sans-serif;opacity:var(--dose-caption,0)}
}
@media(max-width:760px){
 #source.source-machine-chapter .case-story{padding:60px 22px 0!important;justify-content:flex-start!important}
 #source.source-machine-chapter .case-story>div{width:100%!important;max-width:none!important}
 #source.source-machine-chapter .case-story h4{font-size:29px!important;margin-bottom:12px!important}
 #source.source-machine-chapter .case-story-body>p{font-size:14px!important;line-height:1.45!important}
}