/* Image-specific choreography. Text keeps the shared, quieter reveal. */
.page-index .image-stage.reveal,.page-index .image-stage.ui-enter{opacity:1!important;transform:none!important;transition:none!important}
.page-index [data-image-entry]{transition:opacity var(--image-time,900ms) var(--ui-ease),transform var(--image-time,900ms) var(--ui-ease),clip-path var(--image-time,900ms) var(--ui-ease);transition-delay:var(--image-delay,0ms)}
.page-index [data-image-entry]:not(.image-entered){opacity:0}
.page-index [data-image-entry="left"]:not(.image-entered){transform:translateX(-32px) scale(.96)}
.page-index [data-image-entry="right"]:not(.image-entered){transform:translateX(32px) scale(.96)}
.page-index [data-image-entry="rise"]:not(.image-entered){transform:translateY(28px) scale(.97)}
.page-index [data-image-entry="settle"]:not(.image-entered){transform:scale(1.07)}
.page-index [data-image-entry="curtain"]{--image-time:1250ms;transform-origin:left center}
.page-index [data-image-entry="curtain"]:not(.image-entered){opacity:1;clip-path:inset(0 100% 0 0);transform:scale(1.025)}
.page-index [data-image-entry="unfold"]:not(.image-entered){opacity:1;clip-path:inset(100% 0 0 0)}
.page-index [data-image-entry].image-entered{opacity:1;transform:none;clip-path:inset(0)}
.page-index .range-tile:hover img.image-entered{transform:scale(1.045);transition-delay:0ms;transition-duration:500ms}
.page-index .company-home-media{overflow:hidden}.page-index .factory-evidence figure{overflow:hidden}
.page-index .selection-photo{transform:translateY(var(--detail-drift,0px));will-change:transform}
.page-index .system-panel:not([hidden]){animation:none}.page-index .system-panel:not([hidden]) .system-overview{animation:ui-panel 400ms var(--ui-ease) both}
.page-index .system-panel:not([hidden]) .system-illustration img.image-entered{animation:solution-image-focus 1050ms var(--ui-ease) both}
@keyframes solution-image-focus{from{opacity:.25;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
@media(min-width:768px){
 .page-index .scene-0.is-active .hero-scene{animation:screen-image-drift 7s ease-out both}
 .page-index .scene-1.is-active .hero-scene{animation:mill-image-drift 7s ease-out both}
 .page-index .scene-2.is-active .hero-scene{animation:dispatch-image-drift 7s ease-out both}
}
@keyframes screen-image-drift{from{transform:scale(1.025)}to{transform:scale(1)}}
@keyframes mill-image-drift{from{transform:translateX(-10px) scale(1.018)}to{transform:translateX(0) scale(1)}}
@keyframes dispatch-image-drift{from{transform:scale(1)}to{transform:scale(1.03)}}
@media(max-width:767px){.page-index [data-image-entry]{--image-time:700ms;transition-delay:0ms}.page-index [data-image-entry="left"]:not(.image-entered){transform:translateX(-14px)}.page-index [data-image-entry="right"]:not(.image-entered){transform:translateX(14px)}.page-index .selection-photo{transform:none;will-change:auto}}
@media(prefers-reduced-motion:reduce){.page-index [data-image-entry],.page-index [data-image-entry]:not(.image-entered){opacity:1;transform:none;clip-path:none;animation:none!important;transition:none!important}.page-index .selection-photo{transform:none;will-change:auto}}

/* Three distinct entrances: screening reveal, mill approach, factory pullback.
   Preserve the existing industrial layout: variance 6 / motion 7 / density 4. */
@media(prefers-reduced-motion:no-preference){
 .page-index .scene-0.is-active{animation:hero-screen-reveal 1.25s cubic-bezier(.22,.68,.12,1) both}
 .page-index .scene-0.is-active .hero-scene{animation:hero-screen-settle 1.8s cubic-bezier(.18,.7,.2,1) both}
 .page-index .scene-1.is-active .hero-scene{animation:hero-mill-approach 1.7s cubic-bezier(.18,.7,.2,1) both}
 .page-index .scene-2.is-active .hero-scene{animation:hero-factory-pullback 5.4s cubic-bezier(.2,.6,.25,1) both;transform-origin:65% 55%}
 .page-index .scene-0.is-active .brand-hero-copy>*{animation:hero-copy-uncover .85s cubic-bezier(.2,.7,.2,1) both;animation-delay:.32s}
 .page-index .scene-1.is-active .brand-hero-copy>*{animation:hero-copy-side .9s cubic-bezier(.2,.7,.2,1) both;animation-delay:.2s}
 .page-index .scene-2.is-active .brand-hero-copy>*{animation:hero-copy-soft 1.2s ease-out both;animation-delay:.25s}
 .page-index .hero-slide.is-active .brand-hero-copy :is(h1,h2){animation-delay:.42s}
 .page-index .hero-slide.is-active .brand-hero-copy p{animation-delay:.58s}
 .page-index .hero-slide.is-active .brand-hero-copy .btn{animation-delay:.74s}
}
@keyframes hero-screen-reveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes hero-screen-settle{from{transform:translateX(3%) scale(1.065)}to{transform:translateX(0) scale(1)}}
@keyframes hero-mill-approach{from{opacity:.25;transform:translateX(4%) scale(.96)}to{opacity:1;transform:translateX(0) scale(1)}}
@keyframes hero-factory-pullback{from{transform:scale(1.18) translateY(1.5%)}to{transform:scale(1) translateY(0)}}
@keyframes hero-copy-uncover{from{opacity:0;clip-path:inset(100% 0 0);transform:translateY(24px)}to{opacity:1;clip-path:inset(0);transform:none}}
@keyframes hero-copy-side{from{opacity:0;transform:translateX(-32px)}to{opacity:1;transform:none}}
@keyframes hero-copy-soft{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:767px) and (prefers-reduced-motion:no-preference){
 .page-index .scene-0.is-active{animation-duration:.9s}
 .page-index .scene-2.is-active .hero-scene{animation-duration:4s}
}
@media(prefers-reduced-motion:reduce){
 .page-index .hero-slide,.page-index .hero-slide .hero-scene,.page-index .hero-slide .brand-hero-copy>*{animation:none!important;transition:none!important;clip-path:none!important;transform:none!important}
}