/* ===== Motion system (added by js/motion.js; disabled for prefers-reduced-motion) ===== */
/* --- scroll reveal: elements start hidden, then play a keyframe once (no leftover transforms, so hover effects still work) --- */
.js-motion [data-reveal]:not(.in){opacity:0}
.js-motion [data-reveal].in{animation:mRise .85s cubic-bezier(.2,.7,.2,1) var(--d,0s) backwards}
@keyframes mRise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.js-motion .section h2.in::after{animation:mBar .9s cubic-bezier(.2,.7,.2,1) .25s backwards}
@keyframes mBar{from{width:0}}
.js-motion .loc.main.in{animation-name:mRise}
.js-motion .gallery figure.in{animation-name:mZoomIn}
@keyframes mZoomIn{from{opacity:0;transform:scale(.94) translateY(24px)}to{opacity:1;transform:none}}

/* --- hero --- */
.hero{position:relative;overflow:hidden}
.hero .wrap{position:relative;z-index:1}
.hero-line{display:block;width:64px;height:3px;margin-bottom:18px;border-radius:3px;background:#c9962e}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-block:.2em;margin-block:-.2em}
.w>span{display:inline-block}
.js-motion .hero:not(.go) .w>span{transform:translateY(120%)}
.js-motion .hero.go .w>span{animation:mWord 1s cubic-bezier(.2,.8,.2,1) calc(var(--wi)*.1s + .3s) backwards}
@keyframes mWord{from{transform:translateY(120%);opacity:0}to{transform:none;opacity:1}}
.js-motion .hero:not(.go) :is(.tagline,.btn,.wrap>p:not(.tagline)){opacity:0}
.js-motion .hero:not(.go) .hero-line{width:0}
.js-motion .hero.go .hero-line{animation:mLine 1s cubic-bezier(.2,.8,.2,1) .1s backwards}
@keyframes mLine{from{width:0}}
.js-motion .hero.go .tagline{animation:mFade .9s ease .2s backwards}
.js-motion .hero.go .wrap>p:not(.tagline){animation:mFadeUp 1s cubic-bezier(.2,.7,.2,1) 1s backwards}
.js-motion .hero.go .btn{animation:mFadeUp 1s cubic-bezier(.2,.7,.2,1) 1.2s backwards}
@keyframes mFade{from{opacity:0}}
@keyframes mFadeUp{from{opacity:0;transform:translateY(22px)}}
/* gold shimmer sweeping across the call-to-action */
.hero .btn{position:relative;overflow:hidden}
.hero .btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,#fff9 50%,transparent 65%);transform:translateX(-120%);animation:mSheen 4.5s ease-in-out 2.6s infinite}
[dir=rtl] .hero .btn::after{transform:translateX(120%);animation-name:mSheenRtl}
@keyframes mSheen{0%{transform:translateX(-120%)}35%,100%{transform:translateX(120%)}}
@keyframes mSheenRtl{0%{transform:translateX(120%)}35%,100%{transform:translateX(-120%)}}
/* slow zoom + parallax on the background image */
.bg-layer{will-change:transform;animation:mKen 28s ease-in-out infinite alternate}
@keyframes mKen{from{transform:translate3d(0,var(--py,0px),0) scale(1.05)}to{transform:translate3d(0,var(--py,0px),0) scale(1.14)}}
/* scroll cue */
.scroll-cue{position:absolute;z-index:1;bottom:26px;inset-inline-start:50%;translate:-50% 0;width:26px;height:42px;border:2px solid #d9a63daa;border-radius:14px;transition:opacity .4s}
[dir=rtl] .scroll-cue{translate:50% 0}
.scroll-cue::before{content:"";position:absolute;top:8px;left:50%;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#f0c15a;animation:mCue 1.8s cubic-bezier(.6,0,.3,1) infinite}
@keyframes mCue{0%{transform:translateY(0);opacity:1}70%,100%{transform:translateY(14px);opacity:0}}
.js-motion .hero:not(.go) .scroll-cue{opacity:0}
.scrolled-y .scroll-cue{opacity:0;pointer-events:none}
@media(max-width:899px){.scroll-cue{display:none}}
@media(prefers-reduced-motion:reduce){
 .bg-layer,.hero .btn::after,.scroll-cue::before{animation:none!important}
}

/* ================= Section headings: words rise out of a mask ================= */
.js-motion .section h2[data-reveal]{opacity:1!important;animation:none!important}
.js-motion .section h2[data-reveal]:not(.in) .w>span{transform:translateY(120%)}
.js-motion .section h2[data-reveal].in .w>span{animation:mWord .95s cubic-bezier(.2,.8,.2,1) calc(var(--wi)*.1s) backwards}

/* ================= Products ================= */
.card.product{position:relative;transition:transform .2s ease-out,box-shadow .35s}
@media(hover:hover) and (pointer:fine){
 .card.product:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-8px);box-shadow:0 26px 50px #5a0f1644}
}
/* ================= Cards: cursor-aware spotlight (all cards) ================= */
@media(hover:hover) and (pointer:fine){
 .card{position:relative;overflow:hidden;transition:transform .25s ease-out,box-shadow .35s}
 .card:hover{transform:translateY(-6px)}
 .card>*{position:relative;z-index:1}
}

/* ================= Buttons: click ripple ================= */
.btn,.wa-btn,.chip,.map-tab,.map-open,.map-dir,.ps-nav,.ps-pause{position:relative;overflow:hidden}
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:#ffffff55;pointer-events:none;animation:rippleFx .6s ease-out forwards}
@keyframes rippleFx{to{transform:scale(2.6);opacity:0}}
@media(prefers-reduced-motion:reduce){.ripple{display:none}}
/* photo unrolls like a curtain while easing out of a zoom */
.js-motion .card.product.in .pic img{animation:mCurtain 1.25s cubic-bezier(.2,.7,.2,1) calc(var(--d,0s) + .1s) backwards}
@keyframes mCurtain{from{clip-path:inset(0 0 100% 0);scale:1.3}to{clip-path:inset(0);scale:1}}
.js-motion .card.product.in .body>*{animation:mFadeUp .8s cubic-bezier(.2,.7,.2,1) calc(var(--d,0s) + .55s) backwards}
.js-motion .card.product.in .body>p{animation-delay:calc(var(--d,0s) + .68s)}

/* ================= Gallery ================= */
.js-motion .gallery figure.in{animation:mWipe 1.05s cubic-bezier(.2,.7,.2,1) var(--d,0s) backwards}
@keyframes mWipe{from{opacity:0;clip-path:inset(22% 0 0 0 round 16px);transform:translateY(46px)}to{opacity:1;clip-path:inset(0 round 16px);transform:none}}
.js-motion .gallery figure.in img{animation:mSettle 1.4s cubic-bezier(.2,.7,.2,1) var(--d,0s) backwards}
@keyframes mSettle{from{scale:1.35}to{scale:1}}
.gallery img{transform:scale(1.08);translate:0 var(--gy,0px)}     /* extra scale gives room for the scroll parallax */
.gallery figure:hover img{transform:scale(1.17)}
.gallery figure{transition:filter .45s}
.gallery:hover figure:not(:hover){filter:saturate(.6) brightness(.78)}
.gallery button{position:relative;overflow:hidden}
.gallery .cap{position:absolute;z-index:2;inset-inline:0;bottom:0;padding:44px 16px 14px;color:#f5f3ee;font-weight:600;font-size:.92rem;line-height:1.4;
 background:linear-gradient(0deg,#120506ee,transparent);transform:translateY(100%);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.gallery figure:hover .cap,.gallery button:focus-visible .cap{transform:none}
.gallery .zi{position:absolute;z-index:2;top:12px;inset-inline-end:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
 color:#d9a63d;background:#1a0709cc;border:1px solid #c9962eaa;opacity:0;transform:scale(.6) rotate(-20deg);transition:.4s cubic-bezier(.3,1.4,.5,1)}
.gallery figure:hover .zi{opacity:1;transform:none}
@media(hover:none){.gallery .cap{transform:none;font-size:.8rem;padding-top:28px}.gallery .zi{display:none}.gallery:hover figure:not(:hover){filter:none}}

/* ================= Lightbox with navigation ================= */
.lightbox{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:64px 24px 48px;cursor:default}
.lightbox.bye{opacity:0;transition:opacity .25s}
.lb-stage{display:flex;justify-content:center;max-width:100%}
.lightbox .lb-img{max-width:min(92vw,1200px);max-height:72vh;width:auto;height:auto;cursor:default}
.lb-img.to-next{animation:lbNext .5s cubic-bezier(.2,.8,.2,1)}.lb-img.to-prev{animation:lbPrev .5s cubic-bezier(.2,.8,.2,1)}
[dir=rtl] .lb-img.to-next{animation-name:lbPrev}[dir=rtl] .lb-img.to-prev{animation-name:lbNext}
@keyframes lbNext{from{opacity:0;transform:translateX(60px) scale(.96)}}
@keyframes lbPrev{from{opacity:0;transform:translateX(-60px) scale(.96)}}
.lightbox .lb-cap{min-height:1.4em;text-align:center}
.lb-count{color:#d9a63d;font-size:.85rem;letter-spacing:.12em;direction:ltr}
.lightbox .lb-nav{top:50%;translate:0 -50%;width:54px;height:54px;font-size:0;display:grid;place-items:center;border-radius:50%;border:1.5px solid #c9962e;background:#1a0709b3;color:#d9a63d;cursor:pointer;transition:background .25s,transform .25s}
.lightbox .lb-nav:hover{background:#c9962e}.lightbox .lb-nav:hover i{border-color:#1a0508}
.lightbox .lb-nav.prev{inset-inline-start:22px;inset-inline-end:auto}.lightbox .lb-nav.next{inset-inline-end:22px;inset-inline-start:auto}
.lb-nav i{display:block;width:13px;height:13px;border:solid #d9a63d;border-width:0 0 3px 3px;rotate:45deg;margin-inline-start:5px;transition:border-color .25s}
.lb-nav.next i{rotate:-135deg;margin-inline-start:0;margin-inline-end:5px}
[dir=rtl] .lb-nav i{scale:-1 1}
@media(max-width:899px){.lightbox .lb-nav{top:auto;bottom:22px;translate:0}.lightbox .lb-img{max-height:64vh}}
@media(prefers-reduced-motion:reduce){.card.product,.gallery figure,.gallery img,.lb-img{transition:none!important;animation:none!important}}