/* Existing renders remain an assembled device pair to preserve screen fitting. */
/* Arrival is CSS-native: content also remains available without JavaScript. */
@media(prefers-reduced-motion:no-preference){
 .djc-landing .hero-copy > *{animation:djc-hero-copy 600ms cubic-bezier(.22,1,.36,1) both}
 .djc-landing .hero-copy > :nth-child(2){animation-delay:100ms}
 .djc-landing .hero-copy > :nth-child(3){animation-delay:200ms}
 .djc-landing .hero-copy > :nth-child(4){animation-delay:300ms}
 .djc-landing .hero-picture img{animation:djc-hero-settle 2400ms cubic-bezier(.2,0,0,1) both;transform-origin:65% 50%}
 .djc-landing .header-inner > *{animation:djc-header-arrive 450ms cubic-bezier(.22,1,.36,1) both}
 .djc-landing .scroll-cue{animation:djc-hero-copy 600ms cubic-bezier(.22,1,.36,1) 400ms both}
 .djc-landing details[open] > p{animation:djc-disclosure 280ms cubic-bezier(.2,0,0,1) both}
 .djc-landing .button,.djc-landing .text-link,.djc-landing summary,.djc-landing .menu-toggle{transition:transform 180ms cubic-bezier(.2,0,0,1),color 180ms ease-out,background-color 180ms ease-out}
 .djc-landing .button:active{transform:scale(.98)}
 .djc-landing .menu-toggle:active{transform:scale(.97)}
 .djc-landing .hero-copy > :focus-within{animation:none}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .djc-landing .button:hover{transform:translateY(-3px)}
 .djc-landing .text-link:hover{transform:translateX(3px)}
 .djc-landing summary:hover{color:#66e7e1;transform:translateX(3px)}
 .djc-landing .faq summary:hover{color:#005be9}
}
@keyframes djc-hero-copy{from{opacity:.15;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes djc-hero-settle{from{transform:scale(1.025)}to{transform:scale(1)}}
@keyframes djc-header-arrive{from{opacity:.4;transform:translate3d(0,-8px,0)}to{opacity:1;transform:none}}
@keyframes djc-disclosure{from{opacity:.25;transform:translate3d(0,-6px,0)}to{opacity:1;transform:none}}
.djc-landing .story-scene{transform:translate3d(var(--layer-x,0%),var(--layer-y,0%),0) scale(var(--layer-scale,1));transition:none;transform-origin:center;will-change:auto}
.djc-landing .story-scene:nth-child(1){transform-origin:50% 84%}
.djc-landing .story-scene:nth-child(3){transform-origin:50% 14%}
.djc-landing .djc-story__stage{border-radius:24px;isolation:isolate}
.djc-landing .motion-demo[hidden]{display:none}
.djc-landing .motion-demo{border:1px solid #345473;border-radius:18px;padding:18px;margin-top:28px;max-width:760px;background:#0b2340}
.djc-landing .motion-demo p{margin:0;font-size:12px;color:#b9cce2}
.djc-landing .motion-demo .motion-demo-label{color:#66e7e1;font-weight:800;letter-spacing:.06em;margin-bottom:12px}
.djc-landing .motion-demo-actions,.djc-landing .motion-demo-phases{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.djc-landing .motion-demo button{font:700 13px/1.3 Montserrat,sans-serif;color:#fff;min-height:44px;padding:10px 14px;border:1px solid #5d7d9a;border-radius:10px;background:#102e4c;cursor:pointer;transition:background 160ms ease-out,transform 160ms ease-out}
.djc-landing .motion-demo [data-motion-play],.djc-landing .motion-demo button[aria-pressed=true]{background:#66e7e1;border-color:#66e7e1;color:#031127}
.djc-landing .motion-demo button:hover:not(:disabled){background:#1c4262}
.djc-landing .motion-demo [data-motion-play]:hover:not(:disabled){background:#a1f3ee}
.djc-landing .motion-demo button:active:not(:disabled){transform:scale(.98)}
.djc-landing .motion-demo button:focus-visible{outline:3px solid #ffdb55;outline-offset:3px}
.djc-landing .motion-demo button:disabled{opacity:.55;cursor:default}
.djc-landing.is-enhanced .djc-story[data-demo=active] .story-layout{min-height:0;align-items:center}
.djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__stage{position:relative;top:0;height:min(62svh,620px)}
.djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__chapters{position:relative;top:0;height:min(62svh,620px)}
.djc-landing [data-reveal-kind=device].motion-enter{animation:djc-device-arrive 900ms cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms) both;transform-origin:50% 85%}
.djc-landing [data-reveal-kind=device].motion-enter .product-laptop-screen img{animation:djc-screen-arrive 700ms cubic-bezier(.2,0,0,1) 120ms both}
.djc-landing [data-reveal-kind=device].motion-enter .product-phone-screen img{animation:djc-screen-arrive 700ms cubic-bezier(.2,0,0,1) 220ms both}
@keyframes djc-device-arrive{from{opacity:.25;transform:translate3d(0,30px,0) scale(.96)}to{opacity:1;transform:none}}
@keyframes djc-screen-arrive{from{opacity:.5;transform:translate3d(0,12px,0)}to{opacity:1;transform:none}}
@media(max-width:1050px),(max-aspect-ratio:4/3){
 .djc-landing.is-enhanced .djc-story[data-demo=active] .story-layout{grid-template-columns:1fr;gap:12px}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__stage{height:clamp(360px,55svh,560px)}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__chapters{display:block;height:300px;padding:0}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__chapters li{position:absolute;inset:0;min-height:0;padding:12px 0;opacity:0;visibility:hidden;transform:translateY(16px);border:0}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__chapters li.is-active{opacity:1;visibility:visible;transform:none}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__chapters li h3{max-width:none;font-size:clamp(24px,5vw,34px);margin-block:8px}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .djc-story__chapters li p{margin-block:8px;max-width:none}
 .djc-landing.is-enhanced .djc-story[data-demo=active] .phase-number{font-size:30px}
}
/* A portrait frame preserves the physical platform plaque during zoom. */
@media(max-width:700px),(max-aspect-ratio:4/3){
 .djc-landing .story-picture img{object-fit:contain}
}
@media(max-width:700px){
 .djc-landing.is-enhanced .djc-story__stage{height:clamp(360px,55svh,560px)}
}
@media(prefers-reduced-motion:reduce){
 .djc-landing .hero-copy > *,.djc-landing .hero-picture img,.djc-landing .header-inner > *,.djc-landing .scroll-cue,.djc-landing details[open] > p{animation:none!important;transform:none!important;opacity:1!important}
 .djc-landing .button,.djc-landing .text-link,.djc-landing summary,.djc-landing .menu-toggle{transition:none!important}
 .djc-landing .story-scene{transform:none!important}
 .djc-landing [data-reveal-kind=device],.djc-landing [data-reveal-kind=device] img{animation:none!important;transform:none!important;opacity:1!important}
}
