/* JOY'S BOX V35 — stable cinematic mobile motion
   Desktop V30 remains untouched. Mobile uses native sticky + rAF, not ScrollTrigger pinning. */
:root{--v35-ease:cubic-bezier(.16,1,.3,1);--v35-gold:#d8bb6b}

@media(max-width:900px){
  html.v35-mobile,html.v35-mobile body{overflow-x:clip!important}
  html.v35-mobile body{overscroll-behavior-x:none}

  /* One-shot reveals: never reset on exit, so no flicker/replay flashes. */
  html.v35-mobile .v35-reveal{
    opacity:.001!important;
    transform:translate3d(var(--v35-x,0),var(--v35-y,28px),0) rotate(var(--v35-r,0deg)) scale(var(--v35-s,.992))!important;
    transition:opacity .58s ease var(--v35-delay,0s),transform .82s var(--v35-ease) var(--v35-delay,0s)!important;
    will-change:auto!important;
  }
  html.v35-mobile .v35-reveal.v35-in{opacity:1!important;transform:none!important}
  html.v35-mobile .v35-reveal--left{--v35-x:-26px;--v35-y:8px}
  html.v35-mobile .v35-reveal--right{--v35-x:26px;--v35-y:8px}
  html.v35-mobile .v35-reveal--up{--v35-y:34px}
  html.v35-mobile .v35-reveal--soft{--v35-y:18px;--v35-s:.985}

  /* VISION / VALUES / MISSION — scroll deck instead of three static stacked cards. */
  html.v35-mobile .manifesto#about{overflow:visible!important;padding-bottom:72px!important}
  html.v35-mobile .manifesto#about .manifesto__cards{display:block!important;overflow:visible!important;padding:0!important}
  html.v35-mobile .manifesto#about .manifest-card{
    position:sticky!important;top:78px!important;width:100%!important;height:68svh!important;min-height:490px!important;max-height:620px!important;
    margin:0 0 13svh!important;transform-origin:50% 10%!important;z-index:var(--v35-z,1)!important;
    opacity:1!important;filter:brightness(var(--v35-bright,1))!important;box-shadow:0 18px 44px rgba(0,0,0,.17)!important;
    transform:translate3d(0,var(--v35-card-y,0px),0) scale(var(--v35-card-scale,1))!important;transition:none!important;
  }
  html.v35-mobile .manifesto#about .manifest-card:last-child{margin-bottom:18px!important}
  html.v35-mobile .manifest-card>img{transform:translate3d(0,var(--v35-img-y,0px),0) scale(var(--v35-img-scale,1.035))!important;transition:none!important}

  /* MILESTONES — native sticky horizontal reel. The page scroll remains vertical. */
  html.v35-mobile .story-v2{
    position:relative!important;overflow:visible!important;padding:84px 0 0!important;
    min-height:0!important;
  }
  html.v35-mobile .story-v2 .story__head{position:relative;z-index:3}
  html.v35-mobile .v35-story-slot{position:relative!important;height:var(--v35-story-slot,100svh)!important;margin-top:30px!important}
  html.v35-mobile .story-v2 .story-pin{
    position:sticky!important;top:0!important;height:100svh!important;min-height:640px!important;margin-top:0!important;
    display:flex!important;align-items:center!important;overflow:hidden!important;isolation:isolate;
  }
  html.v35-mobile .story-v2 .story-track{
    display:flex!important;width:max-content!important;min-width:max-content!important;max-width:none!important;gap:14px!important;padding:0 18px!important;align-items:center!important;overflow:visible!important;
    transform:translate3d(var(--v35-story-x,0px),0,0)!important;will-change:transform!important;
  }
  html.v35-mobile .story-frame{
    position:relative!important;flex:0 0 84vw!important;width:84vw!important;height:68svh!important;min-height:500px!important;max-height:650px!important;
    border-radius:20px!important;opacity:.42!important;filter:saturate(.78) brightness(.82)!important;
    transform:scale(.955)!important;transition:opacity .34s ease,filter .34s ease,transform .42s var(--v35-ease),box-shadow .42s ease!important;
    box-shadow:0 14px 34px rgba(0,0,0,.14)!important;
  }
  html.v35-mobile .story-frame.is-active{
    opacity:1!important;filter:none!important;transform:scale(1)!important;box-shadow:0 24px 56px rgba(0,0,0,.22)!important;
  }
  html.v35-mobile .story-frame__media img{
    transform:scale(var(--v35-story-img-scale,1.055)) translate3d(var(--v35-story-img-x,0px),0,0)!important;
    transition:transform .55s var(--v35-ease)!important;
  }
  html.v35-mobile .story-frame.is-active .story-frame__media img{--v35-story-img-scale:1.01}
  html.v35-mobile .story-frame__media::after{display:block!important}
  html.v35-mobile .story-frame.is-active .story-frame__media::after{transform:translateX(120%)!important}
  html.v35-mobile .story-frame__note{display:block!important;right:18px!important;bottom:12px!important;font-size:5.5px!important}
  html.v35-mobile .story-progress{
    display:flex!important;position:absolute!important;z-index:8!important;left:18px!important;right:18px!important;bottom:20px!important;
    align-items:center!important;gap:10px!important;color:#fff!important;font:700 7px/1 var(--sans)!important;letter-spacing:.12em!important;
    pointer-events:none!important;
  }
  html.v35-mobile .story-progress i{height:1px!important;flex:1!important;background:rgba(255,255,255,.25)!important;overflow:hidden!important}
  html.v35-mobile .story-progress i b{display:block!important;width:100%!important;height:100%!important;background:var(--v35-gold)!important;transform:scaleX(var(--v35-story-meter,.25))!important;transform-origin:left!important}

  /* SERVICES — directional reveal, no clip reset. */
  html.v35-mobile .service-row{opacity:1!important;clip-path:none!important}

  /* PROCESS — second scroll deck, not a long static card column. */
  html.v35-mobile .process-triptych{overflow:visible!important;padding-bottom:70px!important}
  html.v35-mobile .process-triptych__grid{display:block!important;overflow:visible!important}
  html.v35-mobile .process-panel{
    position:sticky!important;top:80px!important;height:66svh!important;min-height:480px!important;max-height:620px!important;
    margin-bottom:13svh!important;z-index:var(--v35-z,1)!important;transform-origin:50% 10%!important;
    opacity:1!important;filter:brightness(var(--v35-bright,1))!important;border-radius:18px!important;box-shadow:0 18px 42px rgba(0,0,0,.13)!important;
    transform:translate3d(0,var(--v35-card-y,0px),0) scale(var(--v35-card-scale,1))!important;transition:none!important;
  }
  html.v35-mobile .process-panel:last-child{margin-bottom:18px!important}
  html.v35-mobile .process-panel img{transform:translate3d(0,var(--v35-img-y,0px),0) scale(1.035)!important;transition:none!important}

  /* GUEST JOURNEY — keep map geometry, draw the actual line with page scroll. */
  html.v35-mobile .journey{overflow:clip!important}
  html.v35-mobile .journey__map{position:relative!important;opacity:1!important;padding:8px 0 12px!important}
  html.v35-mobile .journey-path{stroke-dasharray:var(--v35-path-length,1400)!important;stroke-dashoffset:var(--v35-path-offset,1400)!important;transition:none!important}
  html.v35-mobile .journey-path--shadow{stroke-dasharray:none!important;stroke-dashoffset:0!important}
  html.v35-mobile .journey-dot{opacity:.28!important;transition:opacity .32s ease,filter .32s ease!important;transform-box:view-box!important;transform-origin:0 0!important}
  html.v35-mobile .journey-dot.is-waypoint-active{opacity:1!important;filter:drop-shadow(0 0 12px rgba(216,187,107,.72))!important}
  html.v35-mobile .journey-list li{opacity:.48!important;transition:opacity .3s ease,background .3s ease,padding .35s var(--v35-ease)!important}
  html.v35-mobile .journey-list li.is-waypoint-active{opacity:1!important;padding-left:12px!important;background:linear-gradient(90deg,rgba(215,187,107,.08),transparent 75%)!important}
  html.v35-mobile .journey-list li::after{display:block!important}

  /* PROJECT ARCHIVE — restore the desktop stacking language on phone. */
  html.v35-mobile .work-archive{overflow:visible!important;padding-bottom:92px!important}
  html.v35-mobile .archive-stack{display:block!important;position:relative!important;overflow:visible!important}
  html.v35-mobile .archive-card{
    position:sticky!important;top:78px!important;height:72svh!important;min-height:510px!important;max-height:660px!important;
    margin:0 0 15svh!important;border-radius:20px!important;z-index:var(--v35-z,1)!important;
    opacity:1!important;filter:brightness(var(--v35-bright,1))!important;
    transform:translate3d(0,var(--v35-card-y,0px),0) scale(var(--v35-card-scale,1))!important;
    transform-origin:50% 10%!important;transition:none!important;box-shadow:0 20px 50px rgba(0,0,0,.22)!important;
  }
  html.v35-mobile .archive-card:last-child{margin-bottom:0!important}
  html.v35-mobile .archive-card>img{
    transform:translate3d(0,var(--v35-img-y,0px),0) scale(var(--v35-img-scale,1.05))!important;
    transform-origin:center!important;transition:none!important;filter:none!important;
  }
  html.v35-mobile .archive-card::after{display:block!important;opacity:var(--v35-glow,0)!important;background:linear-gradient(180deg,rgba(216,187,107,.06),transparent 32%)!important}
  html.v35-mobile .archive-card__bottom h3{transform:none!important}

  /* Remaining sections keep personality but use one-shot, GPU-cheap movement. */
  html.v35-mobile .detail-fragment-v24 img,html.v35-mobile .showreel-card-v13 img,html.v35-mobile .market-card img{
    transition:transform .9s var(--v35-ease)!important;
  }
  html.v35-mobile .v35-media-in img{transform:scale(1.025)!important}
  html.v35-mobile .clients-v23{overflow:hidden!important}

  /* Safari compositing hygiene. */
  html.v35-mobile .story-track,html.v35-mobile .story-frame,html.v35-mobile .archive-card,html.v35-mobile .process-panel,html.v35-mobile .manifest-card{
    -webkit-backface-visibility:hidden;backface-visibility:hidden;
  }
}

@media(max-width:430px){
  html.v35-mobile .story-frame{flex-basis:86vw!important;width:86vw!important}
  html.v35-mobile .story-v2 .story-track{padding-left:16px!important;padding-right:16px!important}
  html.v35-mobile .manifesto#about .manifest-card,html.v35-mobile .process-panel{top:72px!important}
  html.v35-mobile .archive-card{top:72px!important}
}

@media(prefers-reduced-motion:reduce){
  html.v35-mobile .v35-reveal{opacity:1!important;transform:none!important;transition:none!important}
  html.v35-mobile .story-track{transform:none!important}
}
