/* One animation per surface; gentler movement and a continuous close. */
:root{--drip-ease:cubic-bezier(.25,.75,.25,1)}
.hero-copy{animation:none}
.hero h1,.hero .intro,.hero-actions{animation:softContentIn .85s var(--drip-ease) both}
.hero .intro{animation-delay:.08s}.hero-actions{animation-delay:.16s}
.product{animation:none;transition:transform .55s var(--drip-ease)}
.motion-reveal{transform:translateY(12px);transition:opacity .8s ease,transform .8s var(--drip-ease)}
.product.motion-reveal.motion-visible{transform:none}
button,a,select{transition:transform .32s var(--drip-ease),background-color .35s ease,color .35s ease,border-color .35s ease,box-shadow .4s ease}
button:active,.cta:active,.primary:active,.channel-card:active,dialog .primary:active{transform:scale(.99)}
.hero-actions .cta,.product-image,.product-image img,.hero-products img{transition:transform .65s var(--drip-ease),box-shadow .6s ease,filter .6s ease,background-color .35s ease}
.hero-actions .cta:hover{transform:translateY(-2px)}
.product:hover .product-image{transform:translateY(-2px)}
.product:hover .product-image img{transform:scale(1.025)}
.product:hover .quick{transform:none}
.filters button:hover{transform:translateY(-1px)}
dialog[open],#productDialog[open]{animation:softDialogIn .48s var(--drip-ease) both}
dialog[open]::backdrop{animation:softBackdropIn .48s ease both}
dialog[open].motion-closing,#productDialog[open].motion-closing{animation:softDialogOut .32s cubic-bezier(.4,0,.7,1) both;pointer-events:none}
dialog[open].motion-closing::backdrop{animation:softBackdropOut .32s ease both}
@keyframes softContentIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes softDialogIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes softDialogOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(6px)}}
@keyframes softBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes softBackdropOut{from{opacity:1}to{opacity:0}}
.hero-products figure:nth-child(n){animation:heroSoftFloat 12s ease-in-out infinite;translate:none;transform:none;filter:none;transition:none}
.hero-products figure:nth-child(2){animation-delay:-4s}
.hero-products figure:nth-child(3){animation-delay:-8s}
.hero-products figure:nth-child(n):hover{translate:none;transform:none;filter:none}
.hero-products figure:nth-child(1) img,.hero-products figure:nth-child(1):hover img{transform:none}
.hero-products figure:nth-child(2) img,.hero-products figure:nth-child(2):hover img{transform:rotate(-12deg) scale(1.3)}
.hero-products figure:nth-child(3) img,.hero-products figure:nth-child(3):hover img{transform:rotate(-14deg) scale(1.04)}
.hero-products figure:nth-child(n) img{transition:transform .95s cubic-bezier(.25,.46,.45,.94);will-change:transform}
@media(hover:hover){
 .hero-products figure:nth-child(1):hover img{transform:translateY(-5px) scale(1.025)}
 .hero-products figure:nth-child(2):hover img{transform:rotate(-9deg) scale(1.33)}
 .hero-products figure:nth-child(3):hover img{transform:rotate(-11deg) scale(1.07)}
}
.hero-products figure:nth-child(1).is-touched img{transform:translateY(-5px) scale(1.025)}
.hero-products figure:nth-child(2).is-touched img{transform:rotate(-9deg) scale(1.33)}
.hero-products figure:nth-child(3).is-touched img{transform:rotate(-11deg) scale(1.07)}
@keyframes heroSoftFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(max-width:600px){.hero-products figure:nth-child(2) img,.hero-products figure:nth-child(2):hover img{transform:rotate(-12deg) scale(1.25)}.hero-products figure:nth-child(2).is-touched img{transform:rotate(-9deg) scale(1.28)}}
.product-gallery-stage{position:relative;isolation:isolate;overflow:hidden;border-radius:16px}
#productDialog .detail .gallery-ghost{position:absolute;inset:0;width:100%;height:100%;max-height:none;pointer-events:none;z-index:1;object-fit:contain}
.product-thumbs button{transition:border-color .35s ease,background .35s ease,transform .45s var(--drip-ease)}
.product-thumbs button:hover{transform:translateY(-1px)}
dialog::backdrop,.account-dialog::backdrop,#productDialog::backdrop{background:#11111199;backdrop-filter:blur(8px)}
.tickets-shortcut,.product-edit,.product-delete,.catalog-owner-tools button,.ticket-inbox-card,.order-card,.ticket-choice-actions>*,.chat-quick button{transition:transform .4s var(--drip-ease),box-shadow .5s ease,border-color .35s ease,background-color .35s ease,color .35s ease}
.chat-message{animation:softMessageIn .45s var(--drip-ease) both}
@keyframes softMessageIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes countPop{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@media(max-width:600px){dialog::backdrop,.account-dialog::backdrop,#productDialog::backdrop{backdrop-filter:blur(6px)}}
@media(hover:none){.product:hover .product-image,.hero-actions .cta:hover,.filters button:hover{transform:none}.product:hover .product-image img{transform:none}.product:hover .quick{background:#fff;color:#111}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.motion-reveal{opacity:1;transform:none}}