/* UrbanHive — page transition + hover/tap effects. Load AFTER uh.css / pages.css on every page */

/* ── page transition: orange curtain wipe (replaces the counter loader) ── */
.pt{position:fixed;inset:0;z-index:200;display:flex;pointer-events:none}
.pt b{flex:1;background:var(--o);transform:scaleY(0);transform-origin:top;animation:ptOut .8s cubic-bezier(.7,0,.2,1) both;animation-delay:calc(var(--k)*70ms + .12s);margin-right:-1px}
.pt__t{position:absolute;inset:0;display:grid;place-items:center;font:400 clamp(4rem,16vw,15rem)/1 var(--d);letter-spacing:.03em;color:var(--bone);text-transform:uppercase;animation:ptT .8s both}
.pt.go{pointer-events:auto}
.pt.go b{transform-origin:bottom;animation:ptIn .55s cubic-bezier(.7,0,.2,1) both;animation-delay:calc(var(--k)*55ms)}
.pt.go .pt__t{animation:ptTi .45s .2s both}
@keyframes ptOut{from{transform:scaleY(1)}to{transform:scaleY(0)}}
@keyframes ptIn{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes ptT{0%,35%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-40px)}}
@keyframes ptTi{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.pt{display:none}}

/* ── scroll smoothness helpers ── */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-stopped{overflow:hidden}
.lenis [data-lenis-prevent]{overscroll-behavior:contain}
html{-webkit-tap-highlight-color:transparent}

/* ── text roll (nav, header links) ── */
.rl{display:inline-block;overflow:hidden;vertical-align:bottom;height:1.3em;line-height:1.3;position:relative}
.rl>span{display:block;transition:transform .5s cubic-bezier(.7,0,.2,1)}
.rl>span+span{color:var(--o)}
a:active .rl>span,a:focus-visible .rl>span{transform:translateY(-100%)}
@media(hover:hover){a:hover .rl>span{transform:translateY(-100%)}}

/* ── header ── */
.hd .lg{transition:background .4s,color .4s}
.hd .lg img{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.hd .hm{display:none;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--ink);border-radius:50%;transition:background .3s,color .3s,transform .3s}
.hd .hm svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hd .hm:active{background:var(--ink);color:var(--bone);transform:scale(.9)}
.hd .lg:active{background:var(--ink);color:var(--bone)}
.hd .mn{transition:color .3s,transform .3s}.hd .mn:active{color:var(--o);transform:scale(.92)}
@media(hover:hover){
.hd .lg:hover{background:var(--ink);color:var(--bone)}.hd .lg:hover img{transform:rotate(-8deg) scale(1.1)}
.hd .mn:hover{color:var(--o)}
}
@media(max-width:860px){.hd .ic a.hm{display:flex}}

/* ── mobile menu: staggered entrance + tap feedback ── */
.mnav a{opacity:0;transform:translateY(50px);transition:opacity .5s,transform .7s cubic-bezier(.2,.8,.2,1),color .3s}
.mnav.open a{opacity:1;transform:none;transition-delay:calc(var(--i,0)*70ms + .25s)}
.mnav a:nth-child(1){--i:0}.mnav a:nth-child(2){--i:1}.mnav a:nth-child(3){--i:2}.mnav a:nth-child(4){--i:3}
.mnav.open a:active{transform:translateX(18px);color:var(--o);transition-delay:0s}
@media(hover:hover){.mnav.open a:hover{transform:translateX(18px);color:var(--o);transition-delay:0s}}

/* ── buttons ── */
.pill,.fl button,.opts button,.sz button,.qv__h,.pc__h,.pc__qv,.x,.mn,.fq__i button,.cd--all,.rs,.ft2__up{overflow:hidden}
.pill{position:relative;transition:background .35s,color .35s,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.pill:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.38) 50%,transparent 70%);transform:translateX(-130%);pointer-events:none}
.pill:active{transform:scale(.94)}
.fl button:active,.opts button:active,.sz button:active,.cd--all:active{transform:scale(.93)}
.qv__h:active,.pc__h:active{transform:scale(.85)}
.x:active{transform:scale(.92)}
.pc__qv:active{background:var(--o)}
.fq__i button{transition:color .3s,padding-left .4s cubic-bezier(.2,.8,.2,1)}
.fq__i button:active{color:var(--o);padding-left:.6rem}
@media(hover:hover){
.pill:hover{transform:translateY(-3px);box-shadow:0 10px 24px -10px rgba(21,17,15,.55)}
.pill:hover:before{transform:translateX(130%);transition:transform .8s}
.fl button:hover,.opts button:hover,.sz button:hover{transform:translateY(-2px)}
.fq__i button:hover{color:var(--o);padding-left:.6rem}
.x:hover{transform:rotate(-3deg) scale(1.05)}
.wl__it button:hover{color:var(--o)}
}

/* ── cards & tiles ── */
.cd h3{transition:color .3s}
.cat span:after{content:"→";display:inline-block;margin-left:.5rem;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.ci a span{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.ci a:active{background:var(--o);color:var(--bone)}.ci a:active span{transform:translateX(10px)}
.stats div b{display:block;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.band{transition:opacity .3s}
@media(hover:hover){
.cd:hover h3{color:var(--o)}
.cat:hover span:after{transform:translateX(8px)}
.ci a:hover span{transform:translateX(10px)}
.stats div:hover b{transform:translateY(-8px)}
.band:hover>div{animation-play-state:paused}
}
@media(hover:none){
.cd:active .cd__im img+img{opacity:1}.cd:active h3{color:var(--o)}
.cat:active span:after{transform:translateX(8px)}
}


/* ── tap ripple ── */
.rp{position:absolute;border-radius:50%;background:currentColor;opacity:.22;transform:scale(0);animation:rp .65s ease-out forwards;pointer-events:none}
@keyframes rp{to{transform:scale(1);opacity:0}}
@media(prefers-reduced-motion:reduce){.rp{display:none}.pill:before{display:none}}

/* ───────── footer (v2) ───────── */
.ft2{position:relative;background:var(--ink);color:var(--bone);padding:clamp(5rem,12vh,9rem) var(--pad) 0;overflow:hidden}
.ft2__k{font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.ft2__big{position:relative;isolation:isolate;display:flex;justify-content:space-between;align-items:center;gap:1rem;margin:1.2rem 0 clamp(3rem,8vh,6rem);padding:clamp(1rem,2.4vw,2rem) 0;border-block:1px solid rgba(245,240,232,.25);font:400 clamp(3.2rem,11.5vw,13rem)/.92 var(--d);text-transform:uppercase;overflow:hidden}
.ft2__big:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--o);transform:translateY(101%);transition:transform .6s cubic-bezier(.7,0,.2,1)}
.ft2__big em{font:300 .55em/1 var(--s);text-transform:none;color:var(--o);font-style:italic;transition:color .4s}
.ft2__big i{font-style:normal;color:var(--o);transition:transform .5s cubic-bezier(.2,.8,.2,1),color .4s}
.ft2__big:active:before{transform:none}.ft2__big:active em,.ft2__big:active i{color:var(--bone)}
.ft2__rows a{position:relative;display:grid;grid-template-columns:4rem 1fr auto;align-items:center;padding:1.1rem 0;border-top:1px solid rgba(245,240,232,.18);font:400 clamp(2.4rem,5vw,5.2rem)/1 var(--d);text-transform:uppercase;transition:padding .5s cubic-bezier(.2,.8,.2,1),color .3s}
.ft2__rows a:last-child{border-bottom:1px solid rgba(245,240,232,.18)}
.ft2__rows span{font:400 12px var(--m);color:var(--o);letter-spacing:.1em}
.ft2__rows i{font-style:normal;color:var(--o);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.ft2__rows a.on b{color:var(--o)}
.ft2__rows a:active{padding-left:1.2rem;color:var(--o)}.ft2__rows a:active i{transform:translateX(10px)}
.ft2__info{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;padding:clamp(3rem,8vh,5rem) 0 clamp(2rem,5vh,3rem)}
.ft2__info h4{font:400 1.8rem/1 var(--d);letter-spacing:.05em;color:var(--o);margin-bottom:1rem}
.ft2__info p,.ft2__info a{display:block;width:fit-content;font-size:13px;line-height:2.1;opacity:.88}
.ft2__info a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s cubic-bezier(.2,.8,.2,1),color .3s}
.ft2__info a:active{background-size:100% 1px;color:var(--o)}
.ft2__wm{display:flex;justify-content:space-between;margin:0 calc(var(--pad)*-1);padding:0 var(--pad);font:400 clamp(5rem,21.5vw,30rem)/.8 var(--d);color:transparent;-webkit-text-stroke:1px rgba(245,240,232,.38);user-select:none;cursor:default}
.ft2__wm span{transition:color .35s,-webkit-text-stroke-color .35s,transform .6s cubic-bezier(.2,.8,.2,1)}
.ft2__wm span:active{color:var(--o);-webkit-text-stroke-color:var(--o);transform:translateY(-5%)}
.ft2__bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.3rem 0 1.5rem;border-top:1px solid rgba(245,240,232,.18);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.ft2__up{position:relative;background:0;border:1px solid currentColor;color:inherit;border-radius:99px;padding:.65rem 1.2rem;font:inherit;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s,transform .3s}
.ft2__up:active{background:var(--bone);color:var(--ink);transform:scale(.93)}
@media(hover:hover){
.ft2__big:hover:before{transform:none}.ft2__big:hover em,.ft2__big:hover i{color:var(--bone)}.ft2__big:hover i{transform:translate(.12em,-.12em)}
.ft2__rows a:hover{padding-left:1.4rem;color:var(--o)}.ft2__rows a:hover i{transform:translateX(12px)}
.ft2__info a:hover{background-size:100% 1px;color:var(--o)}
.ft2__wm span:hover{color:var(--o);-webkit-text-stroke-color:var(--o);transform:translateY(-5%)}
.ft2__up:hover{background:var(--bone);color:var(--ink)}
}
@media(max-width:860px){.ft2__info{grid-template-columns:1fr 1fr}.ft2__rows a{grid-template-columns:2.6rem 1fr auto}.ft2__bar{justify-content:center;text-align:center}}
@media(max-width:560px){.ft2__info{grid-template-columns:1fr}.ft2__wm{-webkit-text-stroke-width:.8px}}
.ft2__rows b{font-weight:400;line-height:.84;padding-top:.06em}
.ft2__rows span,.ft2__rows i{align-self:center;line-height:1}
@media(min-width:561px){.ft2__big{font-size:clamp(3rem,9vw,11rem)}.ft2__big>span{white-space:nowrap}}