/* JSOFY R16.5: one device, one uninterrupted vertical screen rail.
   The physical handset stays pinned while the story panels pass beneath it.
   No Bevel assets/code and no scroll-snapping, per-frame easing or page swapping. */
.page-home .r165-phone-viewport{position:absolute;inset:0;overflow:hidden;contain:paint;background:#ecf0f8}
.page-home .r165-phone-track{position:absolute;left:0;top:0;width:100%;display:flex;flex-direction:column;transform:translate3d(0,0,0);will-change:transform;transition:none!important;backface-visibility:hidden}
.page-home .r165-phone-page{position:relative;flex:0 0 var(--r165-page-height,650px);height:var(--r165-page-height,650px);min-height:0;overflow:hidden;padding:110px 8% 73px;box-sizing:border-box;color:#1d2330;background:radial-gradient(ellipse at 94% 52%,#dddefe,transparent 64%),linear-gradient(155deg,#f8faff 0%,#e6eaf5 100%);display:flex;flex-direction:column;gap:12px}
.page-home .r165-phone-page--catalog{background:radial-gradient(ellipse at 10% 70%,#eadce7,transparent 58%),linear-gradient(155deg,#f7f5f5,#e6ecfa)}
.page-home .r165-phone-page--web{background:radial-gradient(ellipse at 100% 80%,#babaf2,transparent 60%),linear-gradient(155deg,#eff4ff,#dedff6)}
.page-home .r165-phone-page--account{background:radial-gradient(ellipse at 90% 80%,#a3d9db,transparent 57%),linear-gradient(155deg,#eaf6f7,#e3edf7)}
.page-home .r165-phone-page--home{background:radial-gradient(ellipse at 90% 66%,#9acbc3,transparent 60%),linear-gradient(155deg,#eff9f6,#e1ebe7)}
.page-home .r165-screen-eyebrow{font-size:10px;line-height:1.35;font-weight:800;letter-spacing:.17em;color:#66718b;text-transform:uppercase}
.page-home .r165-phone-page h4{font-size:clamp(20px,2vw,31px);line-height:1.14;letter-spacing:-.06em;margin:0;color:#222b40;font-weight:800}
.page-home .r165-screen-feature{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;border-radius:20px;border:1px solid #ffffffcc;box-shadow:0 18px 38px #34466227;background:#c9d2ee}
.page-home .r165-screen-feature img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 19%}
.page-home .r165-phone-page--pos .r165-screen-feature img,.page-home .r165-phone-page--home .r165-screen-feature img{object-fit:contain;object-position:center top;background:#e8ecf6}
.page-home .r165-screen-pill{font-size:10px;font-weight:800;color:#4d5982;align-self:flex-start;white-space:nowrap;border-radius:100px;padding:8px 12px;background:#fff9;border:1px solid #fff9}
.page-home .r165-screen-rows{display:grid;grid-template-columns:1fr;gap:7px}
.page-home .r165-screen-rows>div{background:#fffffff2;border:1px solid #ffffffad;box-shadow:0 5px 12px #4a576915;display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:12px;font-size:10px;color:#38445e;font-weight:700}
.page-home .r165-screen-rows>div span:nth-child(2){flex:1}
.page-home .r165-ui-icon{font-size:14px;color:#6074bb}
.page-home .r165-phone-progress{position:absolute;z-index:8;right:3.1%;top:28%;bottom:25%;width:3px;border-radius:99px;background:#d6d9e980;overflow:hidden}
.page-home .r165-phone-progress i{display:block;width:100%;height:100%;transform:scaleY(0);transform-origin:top center;background:linear-gradient(#8a93dc,#4e5ca7);border-radius:inherit}
/* Sticky device has just one visual position in the viewport; the app UI scrolls within it. */
.page-home .r164-phone-pin{z-index:4;transition:none!important}
.page-home .r164-device{transition:none!important}
.page-home .r164-device-glass{overflow:hidden}
.page-home .r164-ui-top{top:44px}
.page-home .r164-device-island,.page-home .r164-device-status{pointer-events:none}
.page-home .r164-ui-bottom{pointer-events:none}
.page-home .r164-step-content{transition:opacity .55s ease,transform .55s cubic-bezier(.2,.75,.15,1)}
.page-home .r164-step:not(.is-current) .r164-step-content{opacity:.72}
.page-home .r164-step.is-current .r164-step-content{opacity:1}
.page-home .r164-step-link{pointer-events:auto}
@media (max-width:850px){
 /* Mobile preserves readable, independent screenshots inside each real chapter. */
 .page-home .r164-phone-overlay{display:none}
 .page-home .r164-step:not(.is-current) .r164-step-content{opacity:1}
}
@media (prefers-reduced-motion:reduce){
 .page-home .r165-phone-track{transform:none!important;will-change:auto!important}
 .page-home .r164-step-content{opacity:1!important;transform:none!important;transition:none!important}
}
.r163-save-data .r165-phone-track{will-change:auto!important}
