/* Nysin motion: measured entrances, depth and responsive interaction. */
.hero{overflow:hidden;background-image:none}
.hero::before{content:"";position:absolute;inset:-85px 0;z-index:-2;background:#05090f url('assets/hero.png') center 55%/cover no-repeat;transform:translateY(var(--hero-shift,0px));pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 85% 55%,#526dff19,transparent 55%);animation:hero-light 2s ease-out both}
.hero-content{position:relative}.hero-content h1 em{color:var(--yellow);text-shadow:0 0 50px #ffe65320}
.hero-bottom{border-top:1px solid #ffffff20;padding-top:18px}
.hero-bottom>a{transition:color .25s,transform .25s}.hero-bottom>a:hover{color:var(--yellow);transform:translateY(3px)}
.button,.header-cta{position:relative;overflow:hidden;isolation:isolate;transition:transform .3s,box-shadow .3s,background .3s,border-color .3s}
.button::after{content:"";position:absolute;inset:-60% -50%;pointer-events:none;background:linear-gradient(110deg,transparent 42%,#ffffff50 50%,transparent 58%);transform:translateX(-100%)}
.button:hover::after{animation:button-sheen .65s ease-out}
.button.yellow:hover{box-shadow:0 8px 32px #ffe65326}.button span,.header-cta span,.product-body button span{display:inline-block;transition:transform .3s}
.button:hover span,.header-cta:hover span,.product-body button:hover span{transform:translate(3px,-3px)}
.header-cta:hover{border-color:var(--yellow);background:#ffe6530c}
.header-categories a{position:relative;overflow:hidden}.header-categories a::after{content:"";position:absolute;bottom:0;left:15%;width:70%;height:2px;background:var(--yellow);transform:scaleX(0);transition:transform .35s}
.header-categories a:hover::after,.header-categories a[aria-current]::after{transform:scaleX(1)}
.pillars a{transition:background .35s}.pillars a:hover{background:#526dff0d}.pillars b{transition:color .3s}.pillars a:hover b{color:var(--yellow)}
.filters button{transition:background .25s,color .25s,border-color .25s,transform .25s}.filters button:hover{border-color:var(--yellow);transform:translateY(-2px)}
.product-card{border-radius:10px;overflow:hidden;transition:transform .3s ease-out,border-color .3s,box-shadow .3s}.product-card:hover,.product-card:focus-within{border-color:#6479c1;box-shadow:0 16px 40px #0005}
.product-image img{transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.service{transition:padding-left .3s,border-color .3s}.service:hover{padding-left:10px;border-color:#526dff}
.values article{transition:border-color .35s}.values article:hover{border-color:var(--yellow)}
.visit-card{border-radius:12px;box-shadow:0 20px 65px #0002}.spa-visual{border-radius:12px;overflow:hidden}
dialog[open]{animation:dialog-enter .3s cubic-bezier(.2,.7,.2,1)}dialog[open]::backdrop{animation:backdrop-enter .3s ease-out}
@keyframes hero-light{from{opacity:0}to{opacity:1}}
@keyframes button-sheen{to{transform:translateX(100%)}}
@keyframes dialog-enter{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}
@media(hover:hover) and (pointer:fine){.product-card:hover{transform:perspective(1000px) translateY(-6px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))}}
@media(max-width:1000px){.hero::before{background-position:60% center}}
@media(max-width:650px){.hero::before{inset:0;background-position:64% center}.product-card{border-radius:7px}.hero-bottom{padding-top:14px}}
@media(prefers-reduced-motion:reduce){.hero::before{transform:none!important}.product-card:hover,.button:hover,.filters button:hover,.hero-bottom>a:hover{transform:none!important}.service:hover{padding-left:0}}
