
/* =========================================================
   ONECART PREMIUM MOTION SYSTEM V3
   30+ subtle luxury effects — performance-conscious
   ========================================================= */
:root{--ease-lux:cubic-bezier(.22,.61,.36,1);--ease-soft:cubic-bezier(.16,1,.3,1)}
.pc-lux-reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease-lux),transform .8s var(--ease-lux)}
.pc-lux-reveal.is-in{opacity:1;transform:none}
.pc-lux-fade{opacity:0;transition:opacity .9s var(--ease-lux)}.pc-lux-fade.is-in{opacity:1}
.pc-lux-slide-left{opacity:0;transform:translateX(-28px);transition:.85s var(--ease-lux)}.pc-lux-slide-left.is-in{opacity:1;transform:none}
.pc-lux-slide-right{opacity:0;transform:translateX(28px);transition:.85s var(--ease-lux)}.pc-lux-slide-right.is-in{opacity:1;transform:none}
.pc-lux-scale{opacity:0;transform:scale(.94);transition:.8s var(--ease-lux)}.pc-lux-scale.is-in{opacity:1;transform:scale(1)}
.pc-lux-blur{opacity:0;filter:blur(9px);transform:translateY(12px);transition:1s var(--ease-lux)}.pc-lux-blur.is-in{opacity:1;filter:blur(0);transform:none}
.pc-lux-stagger>*{opacity:0;transform:translateY(18px);transition:.7s var(--ease-lux)}.pc-lux-stagger.is-in>*{opacity:1;transform:none}.pc-lux-stagger.is-in>*:nth-child(2){transition-delay:.08s}.pc-lux-stagger.is-in>*:nth-child(3){transition-delay:.16s}.pc-lux-stagger.is-in>*:nth-child(4){transition-delay:.24s}.pc-lux-stagger.is-in>*:nth-child(5){transition-delay:.32s}.pc-lux-stagger.is-in>*:nth-child(6){transition-delay:.4s}
.lux-image{position:relative;overflow:hidden}.lux-image img{transition:transform 1s var(--ease-lux),filter .6s}.lux-image:hover img{transform:scale(1.055);filter:saturate(1.04)}
.lux-image:after{content:"";position:absolute;inset:0;transform:translateX(-120%);background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.3),transparent 65%);transition:transform .9s var(--ease-lux);pointer-events:none}.lux-image:hover:after{transform:translateX(120%)}
.lux-btn{position:relative;overflow:hidden;transform:translateZ(0);transition:transform .3s var(--ease-lux),box-shadow .3s}.lux-btn:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(6,60,131,.13)}.lux-btn:active{transform:translateY(0) scale(.985)}
.lux-btn:before{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.45);transform:scale(0);opacity:0;pointer-events:none}.lux-btn.rippling:before{animation:luxRipple .55s ease-out}
@keyframes luxRipple{0%{transform:scale(1);opacity:.7}100%{transform:scale(28);opacity:0}}
.lux-link{position:relative}.lux-link:after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1px;background:#0876e8;transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease-lux)}.lux-link:hover:after{transform:scaleX(1);transform-origin:left}
.lux-card{transition:transform .4s var(--ease-lux),box-shadow .4s,border-color .4s}.lux-card:hover{transform:translateY(-8px);box-shadow:0 24px 55px rgba(6,60,131,.1);border-color:#bfd9ec}
.lux-tilt{transform-style:preserve-3d;will-change:transform;transition:transform .18s ease-out}
.lux-tilt>*{transform:translateZ(12px)}
.lux-float{animation:luxFloat 5s ease-in-out infinite}@keyframes luxFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.lux-pulse{animation:luxPulse 2.6s ease-in-out infinite}@keyframes luxPulse{0%,100%{box-shadow:0 0 0 0 rgba(8,118,232,.12)}50%{box-shadow:0 0 0 10px rgba(8,118,232,0)}}
.lux-shimmer{background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);background-size:200% 100%;animation:luxShimmer 3.4s linear infinite}@keyframes luxShimmer{to{background-position:-200% 0}}
.lux-gradient-text{background:linear-gradient(90deg,#063b82,#0876e8,#063b82);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:luxGradient 5s ease infinite}@keyframes luxGradient{0%,100%{background-position:0}50%{background-position:100%}}
.lux-glow-focus:focus{outline:0;box-shadow:0 0 0 4px rgba(8,118,232,.1),0 8px 24px rgba(6,60,131,.06);border-color:#0876e8}
.lux-img-placeholder{background:linear-gradient(110deg,#f4f9fd 8%,#eaf3fa 18%,#f4f9fd 33%);background-size:200% 100%;animation:luxSkeleton 1.4s linear infinite}@keyframes luxSkeleton{to{background-position:-200% 0}}
.lux-modal-backdrop{position:fixed;inset:0;background:rgba(3,25,55,.48);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);opacity:0;visibility:hidden;transition:.35s;z-index:150}.lux-modal-backdrop.open{opacity:1;visibility:visible}
.lux-product-modal{position:fixed;left:50%;top:50%;width:min(920px,calc(100% - 28px));max-height:min(88vh,760px);overflow:auto;transform:translate(-50%,-47%) scale(.95);opacity:0;visibility:hidden;background:#fff;border:1px solid #dce8f2;border-radius:24px;box-shadow:0 35px 100px rgba(2,30,65,.22);transition:.45s var(--ease-soft);z-index:151}.lux-product-modal.open{transform:translate(-50%,-50%) scale(1);opacity:1;visibility:visible}
.lux-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}.lux-modal-image{min-height:440px;background:#f7fbff;display:grid;place-items:center;padding:40px}.lux-modal-image img{width:100%;height:100%;max-height:470px;object-fit:contain;mix-blend-mode:multiply}.lux-modal-copy{padding:40px}.lux-modal-copy h2{font:800 32px/1.1 Poppins;color:#063b82;letter-spacing:-.035em;margin:8px 0 12px}.lux-modal-close{position:absolute;right:16px;top:14px;width:38px;height:38px;border:1px solid #d8e6f0;border-radius:50%;background:#fff;color:#063b82;font-size:19px;z-index:3;cursor:pointer;transition:.25s}.lux-modal-close:hover{transform:rotate(90deg);border-color:#0876e8}
.lux-modal-price{font:800 23px Poppins;color:#0876e8}.lux-modal-old{text-decoration:line-through;color:#94a3b5;font-size:12px;margin-left:8px}.lux-modal-rating{font-size:12px;color:#657993;margin:13px 0 20px}.lux-modal-description{font-size:12px;line-height:1.9;color:#71849a;border-top:1px solid #e3edf5;padding-top:18px}.lux-qty{display:flex;align-items:center;gap:0;border:1px solid #d5e4ef;border-radius:10px;width:max-content;overflow:hidden}.lux-qty button{width:40px;height:40px;border:0;background:#f8fbfe;color:#063b82;font-size:18px;cursor:pointer}.lux-qty span{width:44px;text-align:center;font:700 13px Poppins;color:#063b82}.lux-add{width:100%;margin-top:18px;border:0;background:#0876e8;color:#fff;border-radius:10px;padding:14px;font-weight:800;cursor:pointer;transition:.25s}.lux-add:hover{background:#063b82;transform:translateY(-2px);box-shadow:0 12px 25px rgba(8,118,232,.2)}
.lux-mini-specs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:20px 0}.lux-mini-spec{padding:11px;border:1px solid #e0eaf2;border-radius:9px;font-size:10px;color:#71849a}.lux-mini-spec b{display:block;color:#063b82;font-size:11px;margin-bottom:2px}
.lux-toast{position:fixed;right:22px;bottom:88px;background:#063b82;color:#fff;border-radius:10px;padding:12px 16px;font-size:11px;box-shadow:0 15px 35px rgba(3,35,75,.2);transform:translateY(15px);opacity:0;pointer-events:none;transition:.3s;z-index:170}.lux-toast.show{transform:none;opacity:1}
.product{cursor:pointer}.product .pimg{transition:background .35s}.product:hover .pimg{background:#f3f8fc}.product .pimg img{transition:transform .7s var(--ease-lux),filter .5s}.product:hover .pimg img{transform:scale(1.06)}
.shop-toolbar{position:sticky;top:82px;z-index:15;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);padding:12px 0;border-bottom:1px solid #e8eff5}
.page-enter{animation:luxPageIn .65s var(--ease-lux) both}@keyframes luxPageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:700px){.lux-modal-grid{grid-template-columns:1fr}.lux-modal-image{min-height:260px;padding:24px}.lux-modal-copy{padding:26px}.lux-modal-copy h2{font-size:26px}.lux-mini-specs{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
