/* ===== v8: continuous motion, depth, brand words ===== */
html{scroll-behavior:smooth}body{overflow-x:hidden}
.bgfx{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.bgfx i{position:absolute;display:block;will-change:transform}
.bgfx .l1{inset:-20% 0;background-image:radial-gradient(circle,var(--line) 1px,transparent 1.4px);background-size:26px 26px;opacity:.9;transform:translate3d(0,calc(var(--sy,0)*-.12px),0)}
.bgfx .l2{width:900px;height:900px;right:-260px;top:-300px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--k1) 16%,transparent),transparent);transform:translate3d(0,calc(var(--sy,0)*-.35px),0)}
.bgfx .l3{width:700px;height:700px;left:-300px;top:900px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--k2) 14%,transparent),transparent);transform:translate3d(0,calc(var(--sy,0)*-.55px),0)}
.hero{transform:translate3d(0,calc(var(--sy,0)*.18px),0);opacity:calc(1 - var(--sy,0)/1100)}
/* tilt */
.th.rdy{animation:none;opacity:1;transform:perspective(1100px) translate3d(0,calc(var(--py,0px) + var(--hl,0px)),0) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.th.rdy:hover{--hl:-4px;box-shadow:0 1px 2px rgba(10,18,20,.06),0 24px 48px -18px rgba(10,40,48,.35)}
.tgrid{transform:translate3d(var(--gx,0px),var(--gy,0px),0);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.th .ah,.th .wpp,.th .wxp{transform:translate3d(calc(var(--ry,0deg)/1deg*.6px),calc(var(--rx,0deg)/1deg*-.6px),0);transition:transform .5s}
/* continuous loops */
.wb{animation:grow .9s both,br 3.4s ease-in-out infinite!important;animation-delay:calc(var(--d) + 400ms),calc(var(--d)*3 + 1.4s)!important}
@keyframes br{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.82)}}
.hb{animation:grow .9s both,br 4.2s ease-in-out infinite!important;animation-delay:calc(var(--d) + 400ms),calc(var(--d)*2 + 1.6s)!important}
.cp{transform-box:fill-box;transform-origin:center;animation:fade .4s forwards,sh 2.8s ease-in-out infinite!important;animation-delay:calc(var(--d) + 900ms),calc(var(--d)*4 + 1.5s)!important}
@keyframes sh{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.75}}
.band{animation:bb 4s ease-in-out infinite}@keyframes bb{50%{opacity:.22}}
.cdl.x{animation:none;opacity:1}.cdl.x.nw{animation:fade .5s both}
.th.off *,.bt.off *,.off.mq *{animation-play-state:paused!important}
.ar{animation-fill-mode:forwards}
/* brand section */
.brand{position:relative;padding:40px 0 20px}
.mq{overflow:hidden;white-space:nowrap;border-block:1px solid var(--line);padding:16px 0;margin-bottom:56px;font-size:clamp(22px,4vw,54px);letter-spacing:-.02em;font-family:"Bricolage Grotesque",sans-serif;font-weight:700}
.mqt{display:inline-flex;gap:28px;transform:translate3d(calc(var(--sy,0)*-.35px),0,0);will-change:transform}.mqt b{color:var(--k1)}.mqt span:nth-of-type(odd){color:var(--ink)}.mqt span:nth-of-type(even){-webkit-text-stroke:1px var(--ink);color:transparent}
.bw{max-width:1280px;margin:0 auto;padding:0 20px;display:grid;gap:28px}
.bhead h2,.cta h2{font:700 clamp(38px,6vw,64px)/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.035em;margin:0}
.bhead h2 span{background:var(--lime);color:#0A1214;padding:0 .12em;border-radius:.12em}
.bgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.bt{background:var(--tile);border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh);overflow:hidden;display:flex;flex-direction:column;transform:translate3d(0,var(--py,0px),0)}
.bv{position:relative;height:150px;display:grid;place-items:center;overflow:hidden;border-bottom:1px solid var(--line)}
.bx{padding:14px 16px 18px}.bx h3{margin:8px 0 4px;font:700 22px/1.1 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em}.bx p{margin:0;color:var(--ink3);font-size:14px}
.bt .tg{display:inline-flex;gap:6px;align-items:center;font-size:8.5px;letter-spacing:.1em;color:var(--ink2)}.bt .tg i{width:5px;height:5px;border-radius:50%;background:var(--chl)}
.bt-score .bv{background:var(--t-finance)}.bt-kyts .bv{background:var(--t-crypto)}.bt-cups .bv{background:var(--t-tech)}.bt-top .bv{background:var(--t-culture)}
.ring{width:110px;height:110px;transform:rotate(-90deg)}.rb{fill:none;stroke:var(--gd);stroke-width:7}.rf{fill:none;stroke:var(--chl);stroke-width:7;stroke-linecap:round;stroke-dasharray:87 100;animation:rg 6s ease-in-out infinite}
@keyframes rg{0%{stroke-dasharray:0 100}25%,80%{stroke-dasharray:87 100}100%{stroke-dasharray:87 100}}
.rv-n{position:absolute;display:grid;place-items:center;line-height:1}.rv-n b{font-size:26px;font-weight:500;letter-spacing:-.03em}.rv-n small{font-size:8px;color:var(--ax);margin-top:3px}
.chips{position:absolute;inset:0}.chips span{position:absolute;left:calc(14% + var(--d)*22%);bottom:-24px;font-size:10px;font-weight:500;background:var(--tile);border:1px solid var(--line);border-radius:99px;padding:5px 9px;color:var(--up);box-shadow:var(--sh);animation:rise 3.5s linear infinite;animation-delay:var(--d)}
@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}80%{opacity:1}100%{transform:translateY(-160px);opacity:0}}
.kk{width:64px;height:64px;border-radius:18px;background:#0A1214;color:var(--lime);display:grid;place-items:center;font:700 34px "Space Grotesk";position:relative;z-index:1;box-shadow:0 12px 30px -10px rgba(0,0,0,.5);animation:flt 4s ease-in-out infinite}
@keyframes flt{50%{transform:translateY(-6px) rotate(-4deg)}}
.brk{width:78%;height:auto;overflow:visible}.bl{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;animation:dr 6s ease-in-out infinite;vector-effect:non-scaling-stroke}
@keyframes dr{0%{stroke-dashoffset:1}40%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:-1}}
.bn{fill:var(--tile);stroke:var(--ink);stroke-width:1.4}.brk circle:last-of-type{fill:var(--lime);animation:pulse 1.6s infinite}
.cup{position:absolute;right:12px;top:12px;font-size:8px;letter-spacing:.1em;color:var(--ink3)}
.lbd{list-style:none;margin:0;padding:0 18px;width:100%;display:grid;gap:8px;font-size:10px}
.lbd li{display:grid;grid-template-columns:22px 1fr 40px;gap:8px;align-items:center}.lbd .rk{color:var(--ax)}.lbd .bs{text-align:right;color:var(--ink2)}
.lbd .nm{height:8px;border-radius:9px;background:var(--gd);overflow:hidden}.lbd .nm i{display:block;height:100%;width:var(--w);border-radius:9px;background:linear-gradient(90deg,var(--chl),color-mix(in srgb,var(--chl) 40%,transparent));transform-origin:left;animation:lb 5s ease-in-out infinite;animation-delay:var(--d)}
.lbd li:first-child .nm i{background:linear-gradient(90deg,#7DA600,var(--lime))}
@keyframes lb{0%{transform:scaleX(0)}25%,85%{transform:scaleX(1)}100%{transform:scaleX(1)}}
/* CTA */
.cta{max-width:760px;margin:90px auto 40px;padding:56px 24px;text-align:center;border-radius:28px;background:var(--tile);border:1px solid var(--line);box-shadow:var(--sh)}
.cta h2 span{background:var(--lime);color:#0A1214;padding:0 .12em;border-radius:.12em}.cta .sub{margin:16px auto 22px}
.cta form{display:flex;gap:10px;max-width:460px;margin:0 auto}.cta .fine{text-align:center}
.ftw{max-width:1280px;margin:0 auto;padding:0 20px 28px}.ftw footer{display:flex;flex-wrap:wrap;gap:18px;font:400 11px "Martian Mono";border-top:1px solid var(--line);padding-top:16px}.ftw footer a{color:var(--ink3);text-decoration:none}
/* reveal */
.rv{opacity:0;translate:0 26px;transition:opacity .8s cubic-bezier(.2,.8,.2,1),translate .8s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;translate:0 0}
.bgrid .rv:nth-child(2){transition-delay:.08s}.bgrid .rv:nth-child(3){transition-delay:.16s}.bgrid .rv:nth-child(4){transition-delay:.24s}
@media (min-width:900px){
 .bw{grid-template-columns:.8fr 1.4fr;column-gap:56px;padding:0 56px;align-items:start}
 .bhead{position:sticky;top:120px}
 .bv{height:190px}.bgrid{gap:18px}.bgrid .bt:nth-child(even){margin-top:56px}
 .ftw{padding:0 56px 36px}
}
@media (max-width:899px){.hero{transform:none;opacity:1}.bgfx .l2,.bgfx .l3{display:none}.mqt{transform:none;animation:tk 30s linear infinite}.bgrid{grid-template-columns:1fr}.bt{transform:none}.bv{height:130px}.cta{margin:56px 16px 32px;padding:36px 18px}.cta form{flex-direction:column}}
@media (prefers-reduced-motion:reduce){.hero,.bgfx i,.mqt,.bt,.tgrid{transform:none!important;opacity:1!important}.rv{opacity:1;translate:none;transition:none}
 .wb,.hb,.cp,.band,.rf,.chips span,.kk,.bl,.lbd .nm i{animation:none!important;opacity:1}.cp{opacity:1}.hb{opacity:.14}.hb.hl{opacity:.85}.bl{stroke-dashoffset:0}.chips span{bottom:auto;top:calc(12% + var(--d)*16%);opacity:1}}