/* Mobile touch layout: one document scroller; desktop retains its cinematic timeline. */
body.mobile-native .visual-stage,body.mobile-native #atmosphere,body.mobile-native .detail-backdrop{display:none}
body.mobile-native:not(.detail-page) .chapter{height:auto;min-height:100svh;position:relative;isolation:isolate;background:#080d0c;scroll-margin-top:0}
body.mobile-native:not(.detail-page) .chapter:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(180deg,#04080730,#04080740 35%,#040807db 85%,#080d0c),var(--mobile-scene);background-position:center top;background-size:cover;pointer-events:none}
body.mobile-native .chapter .panel{position:relative;inset:auto;min-height:100svh;height:auto;max-height:none;overflow:visible;opacity:1!important;visibility:visible;pointer-events:auto;transform:none!important;will-change:auto;padding:150px 7% 110px;justify-content:center;background:transparent}
body.mobile-native .chapter .hero{padding-top:max(210px,30svh)}
body.mobile-native .chapter .project-panel{padding-top:max(180px,25svh)}
body.mobile-native .chapter .services-panel{display:flex;flex-direction:column;align-items:stretch;gap:30px}
body.mobile-native .chapter .service-list{width:100%}
body.mobile-native .chapter .project-tabs{position:static;display:flex;flex-wrap:wrap;margin-top:28px;gap:12px;order:2}
body.mobile-native .chapter .project-tabs a{min-height:48px;flex:1;min-width:75px;padding:10px 0}
body.mobile-native .chapter .art-note{position:static;margin-top:14px;order:3;line-height:1.6}
body.mobile-native .chapter footer{position:static;margin-top:35px}
body.mobile-native .journey-ui{bottom:0;left:0;right:0;padding:12px 6% max(12px,env(safe-area-inset-bottom));background:linear-gradient(transparent,#060b09eb 35%);font-size:8px}
body.mobile-native .journey-ui .scroll-prompt{display:none}
body.mobile-native .scene-controls button{width:44px;height:44px}
body.mobile-native button,body.mobile-native summary,body.mobile-native a{touch-action:manipulation;-webkit-tap-highlight-color:#ff6b3530}
body.mobile-native .detail-view [aria-hidden="true"]{pointer-events:none}
body.mobile-native .detail-view button{position:relative;z-index:2;min-height:48px}
body.mobile-native .detail-view button>svg{pointer-events:none}
body.mobile-native .detail-view [role="group"]{min-width:0}
body.mobile-native .detail-view input,body.mobile-native .detail-view select,body.mobile-native .detail-view textarea{font-size:16px}
body.mobile-native .performance-scene,body.mobile-native .search-scene,body.mobile-native .web-scene,body.mobile-native .social-scene,body.mobile-native .brand-scene,body.mobile-native .studios-scene,body.mobile-native .contact-scene,body.mobile-native .trust-hero-image{pointer-events:none}
body.mobile-native .hero-picture img,body.mobile-native .trust-hero-image img{animation:ons-mobile-hero 18s ease-in-out infinite alternate!important;animation-play-state:paused!important;transform-origin:50% 35%;backface-visibility:hidden}
body.mobile-native .contact-visible .hero-picture img,body.mobile-native .motion-visible .hero-picture img,body.mobile-native .motion-visible .trust-hero-image img{animation-play-state:running!important}
body.mobile-native.reduced .hero-picture img,body.mobile-native.reduced .trust-hero-image img{animation:none!important;transform:none!important}
@keyframes ons-mobile-hero{from{transform:scale(1)}to{transform:scale(1.035)}}
@media(max-width:900px),(pointer:coarse){
 .performance-controls,.discovery-controls,.web-device-controls,.social-format-controls,.social-purpose-controls,.brand-pillar-controls,.brand-touch-controls,.studios-capture-controls,.studios-format-controls,.case-step-controls,.principle-buttons{display:flex;flex-wrap:wrap;gap:10px}
 .performance-controls button,.discovery-controls button,.web-device-controls button,.social-format-controls button,.social-purpose-controls button,.brand-pillar-controls button,.brand-touch-controls button,.studios-capture-controls button,.studios-format-controls button,.case-step-controls button,.principle-buttons button{flex:1 1 100px;min-width:0;min-height:48px;white-space:normal;line-height:1.45}
 .web-build-controls.web-journey{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .web-build-controls.web-journey button{min-width:0;min-height:140px;padding:16px 12px}
 .web-build-controls.web-journey button svg{max-height:60px}
 .web-build-controls.web-journey button strong{font-size:21px}
 .web-build-controls.web-journey .stage-caption{font-size:11px;line-height:1.45}
 .detail-view section{scroll-margin-top:100px}
}
@media(prefers-reduced-motion:reduce){body.mobile-native .hero-picture img,body.mobile-native .trust-hero-image img{animation:none!important;transform:none!important}}


/* Explicit Motion on takes precedence over the initial device preference.
   The reduced class still disables motion until the visitor opts in. */
body.motion-enabled .hero-picture img,
body.motion-enabled .trust-hero-image img{
 animation:ons-restored-hero 20s ease-in-out infinite alternate!important;
 animation-play-state:paused!important;
}
body.motion-enabled .motion-visible .hero-picture img,
body.motion-enabled .motion-visible .trust-hero-image img,
body.motion-enabled .contact-visible .hero-picture img{animation-play-state:running!important}
body.motion-enabled.mobile-native .hero-picture img,
body.motion-enabled.mobile-native .trust-hero-image img{animation-name:ons-mobile-hero!important}
@keyframes ons-restored-hero{from{transform:scale(1)}to{transform:scale(1.07)}}
body.mobile-native:not(.detail-page) .chapter{overflow:clip}
body.motion-enabled.mobile-native:not(.detail-page) .chapter:before{
 animation:ons-mobile-hero 18s ease-in-out infinite alternate!important;
 animation-play-state:paused!important;
 transform-origin:50% 35%;
}
body.motion-enabled.mobile-native:not(.detail-page) .chapter.scene-motion-visible:before{animation-play-state:running!important}

/* Keep industry scene links above neighbouring artwork and captions. */
.project-tabs{z-index:3}
body.mobile-native .chapter .project-tabs{position:relative;inset:auto;isolation:isolate}
.project-tabs [data-project-scene]{position:relative;z-index:1;pointer-events:auto;touch-action:manipulation;align-items:center;cursor:pointer}