/* Vyral Motion System V6 — motion designed around usability, not magnification */
:root{--v6-ease:cubic-bezier(.22,1,.36,1);--v6-stroke:#eeeaf4}
html{scroll-behavior:smooth}body.v6-ready{animation:v6-page-enter .44s var(--v6-ease) backwards}
@keyframes v6-page-enter{from{opacity:.4;filter:blur(3px);transform:translateY(8px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
body.v6-leaving main,body.v6-leaving .cd-intro,body.v6-leaving .cd-section{opacity:0!important;filter:blur(3px);transform:translateY(-5px);transition:opacity .23s ease,filter .23s ease,transform .23s ease!important}
body.v6-leaving{pointer-events:none}body.v6-leaving .header,body.v6-leaving .cd-header{pointer-events:none}
/* Accessible sticky header */
.header,.cd-header{transition:box-shadow .3s ease,background .3s ease,border-color .3s ease}.header-inner,.cd-header-inner{transition:min-height .35s var(--v6-ease),padding .35s var(--v6-ease)}
.header.v6-compact,.cd-header.v6-compact{box-shadow:0 6px 24px rgba(37,22,76,.07);background:#fffffff5!important;border-color:#f2edf7}
.header.v6-compact .header-inner,.cd-header.v6-compact .cd-header-inner{min-height:60px!important}.header.v6-compact .brand img,.cd-header.v6-compact .cd-brand img{transform:scale(.91);transition:transform .3s var(--v6-ease)}
/* Homepage cinematics: fade, translate and soft blur; no image scaling */
.v5-hero-slide{transition:opacity .75s var(--v6-ease),transform .78s var(--v6-ease),filter .78s ease,visibility .78s!important;transform:translateX(46px)!important;filter:blur(8px);background:transparent}
.v5-hero-slide.is-active{transform:translateX(0)!important;filter:blur(0)}
.v5-hero-writing>*{transition:opacity .62s var(--v6-ease),transform .68s var(--v6-ease);opacity:0;transform:translateY(20px)}
.v5-hero-slide.is-active .v5-hero-writing>*{opacity:1;transform:translateY(0)}
.v5-hero-writing>*:nth-child(2){transition-delay:.055s}.v5-hero-writing>*:nth-child(3){transition-delay:.11s}.v5-hero-writing>*:nth-child(4){transition-delay:.17s}.v5-hero-writing>*:nth-child(5){transition-delay:.22s}
.v5-hero-slide .v5-main-img{animation:none!important;transform:none!important;object-fit:contain!important;filter:drop-shadow(0 22px 34px #655b7c21)}
.v5-hero-art:before{transition:opacity .72s ease,background .72s ease}.v5-hero-slide:not(.is-active) .v5-hero-art:before{opacity:.3}
/* Product cards react without altering image position or scale */
.product-card,.v5-highlight-card,.v2-category-card{transition:transform .28s var(--v6-ease),box-shadow .28s ease,border-color .28s ease!important;will-change:auto}
.product-card:hover{transform:translateY(-4px)!important;box-shadow:0 18px 40px #34204f13!important}
.product-card .product-image img,.product-card:hover .product-image img,.image-stage img,.image-stage:hover img{transform:none!important;object-fit:contain!important}
.add-btn,.v5-btn,.btn,.cd-btn{transition:background .25s ease,color .25s ease,transform .25s var(--v6-ease),box-shadow .25s ease!important}
.add-btn:active,.btn:active,.cd-btn:active{transform:scale(.97)!important}
.add-btn:hover{background:linear-gradient(112deg,#f32faf,#8744ed,#13b9f5)!important;color:white!important;border-color:transparent!important;box-shadow:0 10px 20px #a75ddd33!important}
/* Scroll reveal: only added by JS when IntersectionObserver is available */
.v6-scroll-item{opacity:0;transform:translateY(21px);filter:blur(2px);transition:opacity .62s var(--v6-ease),transform .62s var(--v6-ease),filter .62s var(--v6-ease)}
.v6-scroll-item.v6-shown{opacity:1;transform:translateY(0);filter:blur(0)}
/* Real image loading indicator; removed on load/error */
.v6-image-loading{opacity:.3!important;transition:opacity .35s ease!important}
.v6-image-ready{opacity:1;transition:opacity .35s ease}
/* Flying cart thumbnail */
.v6-flying-img{position:fixed!important;z-index:10000;pointer-events:none;object-fit:contain!important;object-position:center!important;background:#fff;border:1px solid #e7e1ef;border-radius:18px;box-shadow:0 18px 60px #6f44b142;will-change:transform,opacity;mix-blend-mode:normal!important}
.count-badge.v6-bump,.v6-bump .count-badge{animation:v6-bag-pop .4s var(--v6-ease)}@keyframes v6-bag-pop{0%{transform:scale(.65)}55%{transform:scale(1.35)}100%{transform:scale(1)}}
.drawer,.detail-drawer{transition:transform .43s var(--v6-ease),visibility .43s,opacity .35s ease!important}
.cart-item,.detail-drawer-item{animation:v6-cart-appear .38s var(--v6-ease) both}@keyframes v6-cart-appear{from{opacity:0;transform:translateX(13px)}to{opacity:1;transform:translateX(0)}}
.wishlist.v6-heart-beat,.header-btn.v6-heart-beat{animation:v6-heart-beat .36s var(--v6-ease)}@keyframes v6-heart-beat{0%,100%{transform:scale(1)}52%{transform:scale(1.18)}}
/* Gallery fade is applied to image only; frame and sizing never change */
#detailMainImage{transition:opacity .25s ease!important;transform:none!important;object-fit:contain!important}#detailMainImage.v6-swapping{opacity:.12!important}
/* 8 checkout steps */
#checkoutContent.v6-check-in{animation:v6-check-slide .43s var(--v6-ease) both}
@keyframes v6-check-slide{from{opacity:.12;transform:translateX(22px);filter:blur(3px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
#checkoutContent.v6-check-back{animation:v6-check-back .43s var(--v6-ease) both}
@keyframes v6-check-back{from{opacity:.12;transform:translateX(-22px);filter:blur(3px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
.v3-progress-fill,#checkoutProgress{transition:width .45s var(--v6-ease)!important}
.check-step .num{transition:transform .3s var(--v6-ease),background .3s,color .3s}.check-step.done .num{animation:v6-done .38s var(--v6-ease)}
@keyframes v6-done{from{transform:scale(.5);opacity:.3}to{transform:scale(1);opacity:1}}
.v3-finish-icon{animation:v6-success .65s var(--v6-ease) both}@keyframes v6-success{0%{transform:scale(.42) rotate(-16deg);opacity:0}70%{transform:scale(1.13) rotate(5deg)}100%{transform:scale(1) rotate(0);opacity:1}}
/* Vyral Control layered app reveal */
.cd-hero>div>*{transition:opacity .55s var(--v6-ease),transform .6s var(--v6-ease)}.cd-poster{animation:none!important;transform:none!important}
.cd-platform .cd-btn:hover{background:linear-gradient(110deg,#f94cb5,#8656fa,#1aa7e9);color:#fff;border-color:transparent}
.v6-hero-layer{opacity:0;transform:translateY(20px)}.v6-hero-layer.v6-shown{opacity:1;transform:translateY(0)}
/* Smooth skeleton, only shown while content is being actually filtered or media loading */
.product-skeleton{background:linear-gradient(110deg,#f8f6fb 8%,#f0edf8 18%,#f9f8fc 33%);background-size:240% 100%;animation:v6-shimmer 1.25s ease-in-out infinite}@keyframes v6-shimmer{to{background-position-x:-200%}}
@media(max-width:780px){.v5-hero-slide{transform:translateX(28px)!important}.v5-hero-slide.is-active{transform:translateX(0)!important}.v6-scroll-item{transform:translateY(14px)}.header.v6-compact .header-inner{min-height:58px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}body.v6-ready,body.v6-leaving main,.v5-hero-slide,.v5-hero-writing>*,.product-card,.add-btn,.v5-btn,.btn,.cd-btn,.v6-scroll-item,.v6-flying-img,.v6-image-loading,.v6-image-ready,#checkoutContent,.check-step .num,.v3-finish-icon,.count-badge,.cd-poster,.v6-hero-layer{animation:none!important;transition:none!important;transform:none!important;filter:none!important;opacity:1!important}.v6-flying-img{display:none!important}}
