/* BNU Tap In — homepage v2. Namespaced .hv-* so it layers over styles.css/site.css (nav, footer, cart drawer). */
.hv{
  --bg:#0a0a0a;--raised:#141414;--fg:#f5f5f2;--muted:#8a8a86;--line:#232323;
  --black:#1c1a19;--green:#6b6b45;--cream:#c9ad8f;--pink:#e8b4b8;
  --glow:#c9ad8f;
  --ease:cubic-bezier(.2,.7,.1,1);
  overflow-x:hidden;
}
.hv-wrap{max-width:1280px;margin:0 auto;padding:0 24px}
@media(min-width:900px){.hv-wrap{padding:0 64px}}
.hv section{position:relative;max-width:none;margin-left:0;margin-right:0}
.hv-eyebrow{font-weight:700;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--cream);margin-bottom:18px}
.hv-h2{font-family:var(--anton,"Anton","Arial Narrow Bold",sans-serif);font-weight:400;text-transform:uppercase;font-size:clamp(40px,6.4vw,92px);line-height:.98;letter-spacing:.005em}
.hv-h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
.hv-lead{font-size:clamp(16px,1.5vw,19px);color:#b9b9b3;max-width:540px;line-height:1.6}
.hv-head{margin-bottom:56px}
.hv-link{display:inline-flex;gap:8px;align-items:center;font-weight:600;color:var(--fg);border-bottom:1px solid #ffffff55;padding-bottom:3px;transition:gap .3s var(--ease),border-color .3s}
.hv-link:hover{gap:14px;border-color:var(--fg)}

/* scroll reveal */
.hv-rv{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.hv-rv.in{opacity:1;transform:none}

/* ================= HERO ================= */
.hv-hero{min-height:100svh;padding:104px 0 70px;display:flex;align-items:center;overflow:hidden;background:var(--bg)}
.hv-hero__glow{position:absolute;inset:-20% -10% auto auto;width:90vw;height:90vw;max-width:1100px;max-height:1100px;border-radius:50%;
  background:radial-gradient(circle,var(--glow) 0%,transparent 62%);opacity:.26;filter:blur(30px);transition:background .8s var(--ease),opacity .8s;pointer-events:none}
.hv-hero__inner{position:relative;display:grid;gap:56px;align-items:center;grid-template-columns:1fr;width:100%}
@media(min-width:1000px){.hv-hero__inner{grid-template-columns:1.05fr .95fr;gap:32px}}
.hv-kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--fg);padding:8px 16px 8px 12px;border:1px solid #ffffff22;border-radius:999px;background:#ffffff08;backdrop-filter:blur(8px);margin-bottom:28px}
.hv-kicker i{width:8px;height:8px;border-radius:50%;background:var(--glow);box-shadow:0 0 0 0 var(--glow);animation:pulse 2s infinite;transition:background .6s}
@keyframes pulse{0%{box-shadow:0 0 0 0 #c9ad8f88}70%{box-shadow:0 0 0 12px #c9ad8f00}100%{box-shadow:0 0 0 0 #c9ad8f00}}
.hv-h1{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(52px,7.6vw,120px);line-height:.92;letter-spacing:.005em;margin-bottom:24px}
.hv-h1 .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hv-h1 .ln>span{display:block;transform:translateY(110%);animation:lineup 1.1s var(--ease) forwards}
.hv-h1 .ln:nth-child(2)>span{animation-delay:.12s}
.hv-h1 .ln:nth-child(3)>span{animation-delay:.24s}
@keyframes lineup{to{transform:none}}
.hv-h1 .ln--out>span{color:transparent;-webkit-text-stroke:2px var(--fg)}
.hv-hero .hv-lead{margin-bottom:32px;opacity:0;animation:fadeup 1s .5s var(--ease) forwards}
.hv-cta{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-bottom:44px;opacity:0;animation:fadeup 1s .65s var(--ease) forwards}
@keyframes fadeup{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.hv-proof{display:flex;gap:32px;flex-wrap:wrap;opacity:0;animation:fadeup 1s .8s var(--ease) forwards}
.hv-proof li{display:flex;flex-direction:column;border-left:1px solid #ffffff22;padding-left:16px}
.hv-proof b{font-family:var(--font-display);font-weight:400;font-size:28px;text-transform:uppercase;line-height:1.1}
.hv-proof span{font-size:13px;color:var(--muted)}

.hv-hero__stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:560px}
.hv-ring{position:absolute;border-radius:50%;border:1px solid #ffffff1c;top:42%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.hv-ring.r1{width:min(520px,92vw);aspect-ratio:1;animation:spin 40s linear infinite;border-style:dashed}
.hv-ring.r2{width:min(380px,70vw);aspect-ratio:1;border-color:var(--glow);opacity:.35;transition:border-color .8s}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.hv-tilt{position:relative;width:min(300px,62vw);aspect-ratio:690/960;margin-bottom:-60px;perspective:900px;transition:transform .15s ease-out;z-index:2}
.hv-band{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 40px 50px rgba(0,0,0,.55));animation:bob 6s ease-in-out infinite;transition:opacity .35s}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-16px) rotate(2deg)}}
.hv-band.swap{opacity:0}
.hv-float{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:rgba(20,20,20,.72);backdrop-filter:blur(14px);border:1px solid #ffffff1f;font-size:13px;font-weight:600;white-space:nowrap;opacity:0}
.hv-float i{width:18px;height:18px;border-radius:50%;background:var(--glow);position:relative;transition:background .6s}
.hv-float i::after{content:"";position:absolute;left:5px;top:3px;width:5px;height:9px;border:solid #0a0a0a;border-width:0 2px 2px 0;transform:rotate(45deg)}
.hv-float.f1{top:14%;right:2%;animation:chip 7s 1.2s infinite}
.hv-float.f2{top:46%;left:-2%;animation:chip 7s 3.4s infinite}
.hv-float.f3{top:30%;left:6%;animation:chip 7s 5.4s infinite}
@keyframes chip{0%{opacity:0;transform:translateY(14px) scale(.94)}8%,26%{opacity:1;transform:none}34%,100%{opacity:0;transform:translateY(-10px)}}
@media(max-width:560px){.hv-float.f1{right:-4px}.hv-float.f2{left:-4px}.hv-float.f3{display:none}}

/* purchase card (cart.js needs .acc-card) */
.hv .hv-buy.acc-card{position:relative;z-index:4;width:min(420px,100%);padding:22px;gap:16px;display:flex;flex-direction:column;background:rgba(18,18,18,.78);backdrop-filter:blur(18px);border:1px solid #ffffff1f;border-radius:28px;overflow:visible}
.hv-buy__top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.hv-buy h3{font-family:var(--font-display);font-weight:400;font-size:26px;text-transform:uppercase}
.hv-buy p{font-size:14px;color:var(--muted)}
.hv-price{font-family:var(--font-display);font-size:34px;line-height:1}
.hv-note{font-size:12px;color:var(--muted);text-align:center}
.hv-sw{display:flex;align-items:center;gap:10px}
.hv .hv-sw .swatch{width:30px;height:30px;border-radius:50%;background:var(--swatch);border:2px solid #ffffff22;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s}
.hv .hv-sw .swatch:hover{transform:scale(1.12)}
.hv .hv-sw .swatch.is-active{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--fg)}
.hv .hv-sw .swatches__label{font-size:13px;font-weight:600;color:var(--fg);margin-left:6px}

.hv-scroll{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);width:26px;height:42px;border:1.5px solid #ffffff44;border-radius:14px}
.hv-scroll span{position:absolute;left:50%;top:8px;width:3px;height:8px;border-radius:2px;background:var(--fg);transform:translateX(-50%);animation:wheel 1.8s infinite}
@keyframes wheel{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,14px)}}
@media(max-width:999px){.hv-scroll{display:none}}

/* ================= TICKER ================= */
.hv-ticker{overflow:hidden;border-block:1px solid var(--line);background:var(--raised);padding:20px 0;white-space:nowrap}
.hv-ticker__track{display:inline-flex;gap:36px;align-items:center;animation:tick 38s linear infinite}
.hv-ticker span{font-family:var(--font-display);font-size:clamp(22px,3vw,38px);text-transform:uppercase;letter-spacing:.02em}
.hv-ticker i{font-style:normal;color:var(--cream);font-size:20px}
@keyframes tick{to{transform:translateX(-50%)}}

/* ================= STORY ================= */
.hv-story{padding:110px 0 60px}
.hv-story__grid{display:grid;gap:40px;grid-template-columns:1fr}
@media(min-width:900px){.hv-story__grid{grid-template-columns:1fr 1fr;gap:80px}}
.hv-story__phone{position:sticky;top:96px;align-self:start;height:max-content;z-index:5}
@media(max-width:899px){.hv-story__phone{top:64px;padding:12px 0;background:linear-gradient(var(--bg) 75%,transparent)}}
.hv-phone{position:relative;width:min(300px,64vw);aspect-ratio:9/18.4;margin:0 auto;border-radius:44px;background:#0d0d0d;border:8px solid #1d1d1d;box-shadow:0 0 0 1px #ffffff22,0 50px 80px -20px rgba(0,0,0,.8);overflow:hidden}
@media(max-width:899px){.hv-phone{width:min(210px,52vw)}}
.hv-phone__notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:84px;height:24px;border-radius:14px;background:#000;z-index:5}
.scr{position:absolute;inset:0;padding:54px 18px 18px;display:flex;flex-direction:column;opacity:0;transform:scale(.96);transition:opacity .6s var(--ease),transform .6s var(--ease);pointer-events:none}
[data-step="1"] .s1,[data-step="2"] .s2,[data-step="3"] .s3,[data-step="4"] .s4{opacity:1;transform:none}
/* s1 */
.s1{align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 40%,#2a2623,#0d0d0d 70%)}
.s1__ripple{position:relative;width:150px;height:150px;margin-bottom:28px}
.s1__ripple i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--cream);opacity:0;animation:rip 2.4s infinite}
.s1__ripple i:nth-child(2){animation-delay:.8s}.s1__ripple i:nth-child(3){animation-delay:1.6s}
.s1__ripple::after{content:"";position:absolute;inset:55px;border-radius:50%;background:var(--cream)}
@keyframes rip{0%{transform:scale(.4);opacity:.9}100%{transform:scale(1.6);opacity:0}}
.s1__txt b{display:block;font-size:17px}.s1__txt span{font-size:13px;color:var(--muted)}
/* s2 */
.s2{background:#0a0a0a;padding:46px 10px 10px;overflow:hidden}
/* s3 */
.s3{align-items:center;justify-content:center;text-align:center;gap:6px;background:radial-gradient(circle at 50% 40%,#25271a,#0d0d0d 70%)}
.s3 .chk{width:90px;height:90px;border-radius:50%;background:var(--green);color:var(--fg);display:grid;place-items:center;margin-bottom:18px}
.s3 .chk svg{width:44px;height:44px;stroke-dasharray:40;stroke-dashoffset:40}
[data-step="3"] .s3 .chk svg{animation:draw .7s .25s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.s3 b{font-size:18px}.s3 span{font-size:13px;color:var(--muted)}
/* s4 */
.s4{background:#0d0d0d;gap:12px}
.s4 small{color:var(--muted);font-size:12px;margin-top:6px}
.s4 b{font-family:var(--font-display);font-weight:400;font-size:26px;text-transform:uppercase;margin-bottom:6px}
.s4__card{display:flex;gap:12px;align-items:center;padding:14px;border-radius:18px;background:#1a1a1a;border:1px solid #ffffff14}
.s4__card i{flex:none;width:38px;height:38px;border-radius:50%;background:var(--pink)}
.s4__card+.s4__card i{background:var(--cream)}
.s4__card strong{display:block;font-size:14px}.s4__card span{font-size:12px;color:var(--muted)}
[data-step="4"] .s4__card{animation:slidein .7s var(--ease) both}
[data-step="4"] .s4__card+.s4__card{animation-delay:.2s}
@keyframes slidein{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}

.hv-story__steps{display:flex;flex-direction:column;list-style:none}
.hv-step{min-height:64vh;display:flex;flex-direction:column;justify-content:center;opacity:.28;transition:opacity .5s var(--ease)}
.hv-step.is-on{opacity:1}
@media(max-width:899px){.hv-step{min-height:44vh}}
.hv-step .n{font-family:var(--font-display);font-size:clamp(70px,10vw,140px);line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--cream);transition:color .5s}
.hv-step.is-on .n{color:var(--cream)}
.hv-step h3{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(32px,4vw,52px);margin:10px 0 12px}
.hv-step p{color:#b9b9b3;font-size:18px;max-width:440px;line-height:1.6}

/* ================= COLORS ================= */
.hv-colors{padding:110px 0}
.hv-acc{display:grid;gap:14px;height:min(620px,76vh);min-height:480px;grid-template-columns:4.2fr 1fr 1fr 1fr;transition:grid-template-columns .8s var(--ease)}
.hv-acc[data-open="1"]{grid-template-columns:1fr 4.2fr 1fr 1fr}
.hv-acc[data-open="2"]{grid-template-columns:1fr 1fr 4.2fr 1fr}
.hv-acc[data-open="3"]{grid-template-columns:1fr 1fr 1fr 4.2fr}
.hv-pane{position:relative;flex:1;border:0;border-radius:32px;overflow:hidden;cursor:pointer;color:var(--t);text-align:left;font-family:inherit;
  background:linear-gradient(170deg,var(--c) 0%,var(--c) 28%,#101010 100%);transition:filter .5s;min-width:0;filter:saturate(.8) brightness(.85)}
.hv-pane.is-on{filter:none}
.hv-pane__name{position:absolute;left:28px;top:26px;font-family:var(--font-display);font-size:clamp(26px,3vw,44px);text-transform:uppercase;z-index:2;color:var(--t)}
.hv-pane__sub{position:absolute;left:28px;top:calc(26px + clamp(30px,3.4vw,50px));font-size:14px;font-weight:600;opacity:0;transform:translateY(8px);transition:.6s .15s var(--ease);z-index:2;color:var(--t)}
.hv-pane.is-on .hv-pane__sub{opacity:.85;transform:none}
.hv-pane img{position:absolute;left:50%;bottom:-8%;height:92%;width:auto;max-width:none;transform:translateX(-50%) rotate(-8deg) scale(.72);transform-origin:50% 100%;transition:transform .9s var(--ease);filter:drop-shadow(0 30px 40px rgba(0,0,0,.5))}
.hv-pane.is-on img{transform:translateX(-50%) rotate(6deg) scale(1)}
.hv-pane:not(.is-on):hover img{transform:translateX(-50%) rotate(-4deg) scale(.8)}
@media(max-width:760px){
  .hv-acc{height:auto;min-height:0;gap:10px;grid-template-columns:1fr;grid-template-rows:420px 96px 96px 96px;transition:grid-template-rows .8s var(--ease)}
  .hv-acc[data-open="1"]{grid-template-columns:1fr;grid-template-rows:96px 420px 96px 96px}
  .hv-acc[data-open="2"]{grid-template-columns:1fr;grid-template-rows:96px 96px 420px 96px}
  .hv-acc[data-open="3"]{grid-template-columns:1fr;grid-template-rows:96px 96px 96px 420px}
  .hv-pane{min-height:0}
  .hv-pane__name{top:20px;left:22px}.hv-pane__sub{left:22px;top:60px}
  .hv-pane:not(.is-on) img{opacity:0}
  .hv-pane img{height:86%}
}

/* ================= WATER ================= */
.hv-water{padding:130px 0 150px;overflow:hidden;background:linear-gradient(#0a0a0a,#121211 60%,#0a0a0a)}
.hv-water::before{content:"";position:absolute;left:50%;top:40%;width:1000px;height:1000px;transform:translate(-50%,-50%);background:radial-gradient(circle,#e8b4b822,transparent 60%);pointer-events:none}
.hv-waves{position:absolute;left:0;bottom:0;width:100%;height:220px;pointer-events:none}
.hv-waves path{fill:#c9ad8f14}
.hv-waves .w2{fill:#e8b4b810}
.hv-waves .w1{animation:wave 9s ease-in-out infinite alternate}
.hv-waves .w2{animation:wave 12s ease-in-out infinite alternate-reverse}
@keyframes wave{from{transform:translateX(-4%)}to{transform:translateX(4%)}}
.hv-bubbles i{position:absolute;bottom:-20px;width:14px;height:14px;border-radius:50%;border:1.5px solid #c9ad8f66;animation:rise 9s infinite ease-in}
.hv-bubbles i:nth-child(1){left:8%;animation-delay:0s}.hv-bubbles i:nth-child(2){left:18%;width:9px;height:9px;animation-delay:2s}
.hv-bubbles i:nth-child(3){left:32%;animation-delay:4s;width:20px;height:20px}.hv-bubbles i:nth-child(4){left:46%;animation-delay:1s;width:8px;height:8px}
.hv-bubbles i:nth-child(5){left:64%;animation-delay:3s}.hv-bubbles i:nth-child(6){left:78%;width:11px;height:11px;animation-delay:5s}
.hv-bubbles i:nth-child(7){left:88%;animation-delay:2.5s;width:18px;height:18px}.hv-bubbles i:nth-child(8){left:54%;animation-delay:6s;width:7px;height:7px}
@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:.8}100%{transform:translateY(-640px) translateX(24px);opacity:0}}
.hv-water__inner{display:grid;gap:56px;align-items:center;grid-template-columns:1fr;position:relative}
@media(min-width:900px){.hv-water__inner{grid-template-columns:1.1fr .9fr}}
.hv-water .hv-lead{margin:22px 0 34px}
.hv-specs{display:grid;grid-template-columns:1fr 1fr;gap:14px;list-style:none}
.hv-specs li{border:1px solid #ffffff1c;background:#ffffff08;border-radius:20px;padding:18px 20px;backdrop-filter:blur(6px)}
.hv-specs b{display:block;font-family:var(--font-display);font-weight:400;font-size:24px;text-transform:uppercase}
.hv-specs span{font-size:13px;color:var(--muted)}
.hv-water__img{display:flex;justify-content:center}
.hv-water__img img{width:min(380px,70vw);filter:drop-shadow(0 40px 60px rgba(0,0,0,.6));animation:float2 7s ease-in-out infinite}
@keyframes float2{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(-22px) rotate(4deg)}}

/* ================= WHAT YOU GET (stacked, push-up cards) ================= */
.hv-bento{padding:110px 0 150px}
.hv-stack{display:flex;flex-direction:column;gap:32px;max-width:1120px;padding-bottom:40px}
.hv-tile{position:sticky;top:calc(92px + var(--i) * 28px);min-height:clamp(400px,52vh,480px);border-radius:40px;padding:clamp(28px,4.5vw,60px);
  display:grid;grid-template-columns:1fr;align-items:center;gap:28px;overflow:hidden;border:1px solid #ffffff1a;box-shadow:0 -24px 60px rgba(0,0,0,.5)}
@media(min-width:860px){.hv-tile{grid-template-columns:1fr 1fr;gap:56px}}
.hv-tile h3{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(34px,4.4vw,64px);line-height:.98;margin-bottom:14px}
.hv-tile p{color:#d2d2cb;font-size:clamp(15px,1.4vw,18px);max-width:420px;line-height:1.6}
.hv-tile .tile__txt::before{content:"0" counter(tile);counter-increment:tile;display:block;font-family:var(--font-display);font-size:22px;color:var(--cream);margin-bottom:14px;letter-spacing:.05em}
.hv-stack{counter-reset:tile}
.t-profile{background:linear-gradient(150deg,#6b6b45 0%,#1c1c15 90%)}
.t-contacts{background:linear-gradient(150deg,#5a3d41 0%,#171313 90%)}
.t-any{background:linear-gradient(150deg,#8a7358 0%,#1c1814 90%)}
.t-update{background:linear-gradient(150deg,#2c2c2a 0%,#111 90%)}
.tile__vis{display:flex;justify-content:center;align-items:center;min-width:0}
.t-profile .tile__vis{align-self:end;align-items:flex-end;margin-bottom:calc(-1 * clamp(28px,4.5vw,60px))}
.stack{flex-direction:column;gap:12px;align-items:stretch;width:100%;max-width:420px}
.pill-row{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:999px;background:#ffffff14;border:1px solid #ffffff1c;transition:transform .5s var(--ease)}
.pill-row i{width:34px;height:34px;border-radius:50%}
.pill-row b{font-size:15px}.pill-row span{margin-left:auto;font-size:12px;color:#b9b9b3}
.t-contacts:hover .pill-row:nth-child(1){transform:translateX(10px)}.t-contacts:hover .pill-row:nth-child(3){transform:translateX(-10px)}
.qr{width:190px;height:190px;border-radius:26px;background:#f5f5f2;padding:16px;display:grid;place-items:center;transition:transform .6s var(--ease);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.qr canvas,.qr img{width:100%!important;height:100%!important;display:block}
.t-any:hover .qr{transform:rotate(-6deg) scale(1.05)}
.toggle-demo{display:flex;flex-direction:column;gap:12px;align-items:center;font-size:15px;font-weight:600}
.toggle-demo span{padding:12px 20px;border-radius:999px;background:#ffffff12;border:1px solid #ffffff1c}
.toggle-demo .new{background:var(--cream);color:#0a0a0a;border-color:var(--cream)}
.toggle-demo i{font-style:normal;transform:rotate(90deg);color:var(--cream);font-size:20px}
.mini-phone{width:260px;border-radius:36px 36px 0 0;border:7px solid #0d0d0d;border-bottom:0;background:#0d0d0d;box-shadow:0 30px 60px rgba(0,0,0,.5);transition:transform .8s var(--ease);overflow:hidden}
.mini-phone .rp{border-radius:28px 28px 0 0;border:0}
.t-profile:hover .mini-phone{transform:translateY(-14px)}
@media(max-width:859px){.hv-tile{min-height:0;top:calc(76px + var(--i) * 18px)}}

/* ================= RANGE ================= */
.hv-range{padding:110px 0;background:linear-gradient(#0a0a0a,#101010)}
.hv-products{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:900px){.hv-products{grid-template-columns:repeat(3,1fr)}}
.hv .hv-prod.acc-card{background:var(--raised);border:1px solid var(--line);border-radius:32px;overflow:hidden;display:flex;flex-direction:column;transition:transform .6s var(--ease),border-color .4s}
.hv .hv-prod.acc-card:hover{transform:translateY(-8px);border-color:#ffffff33}
.hv-prod__img{position:relative;aspect-ratio:1/1.05;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 35%,#2b2825,#101010 72%);overflow:hidden}
.hv-prod__img img{height:92%;width:auto;object-fit:contain;transition:transform .8s var(--ease);filter:drop-shadow(0 26px 30px rgba(0,0,0,.5))}
.hv-prod__img.photo{background:#f2f1ed}
.hv-prod__img.photo img{height:100%;width:100%;object-fit:cover;filter:none}
.hv-prod:hover .hv-prod__img img{transform:scale(1.06) rotate(2deg)}
.hv-prod__body{padding:24px 26px 28px;display:flex;flex-direction:column;gap:12px;flex:1}
.hv-prod h3{font-family:var(--font-display);font-weight:400;font-size:30px;text-transform:uppercase;line-height:1}
.hv-prod p{color:#b0b0aa;font-size:15px}
.hv-tag{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:999px;border:1px solid #ffffff33;color:var(--cream)}
.hv-tag--new{background:var(--pink);border-color:var(--pink);color:#0a0a0a}
.hv-buyrow{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:6px}
.hv-bundles{margin-top:48px;padding:36px;border-radius:32px;border:1px solid var(--line);background:var(--raised)}
.hv-bundles h3{font-family:var(--font-display);font-weight:400;font-size:30px;text-transform:uppercase;margin-bottom:20px}
.hv-bundles__row{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:700px){.hv-bundles__row{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.hv-bundles__row{grid-template-columns:repeat(4,1fr)}}
.hv-bundles a{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:20px 22px;border-radius:22px;background:#1a1a1a;border:1px solid #ffffff12;transition:background .3s,transform .4s var(--ease)}
.hv-bundles a:hover{background:var(--cream);color:#0a0a0a;transform:translateY(-4px)}
.hv-bundles b{font-size:16px}.hv-bundles span{font-family:var(--font-display);font-size:24px}
.hv-bundles em{grid-column:1/-1;font-style:normal;font-size:12px;font-weight:700;color:var(--cream)}
.hv-bundles a:hover em{color:#3a3025}

/* ================= COMPARE (stacked) ================= */
.hv-compare{padding:110px 0}
.hv-vs{display:flex;flex-direction:column;gap:16px;max-width:1080px}
.hv-vs__box{border-radius:36px;padding:clamp(28px,4vw,56px);display:grid;gap:28px;grid-template-columns:1fr;position:relative;overflow:hidden;align-items:center}
@media(min-width:860px){.hv-vs__box{grid-template-columns:1fr 1fr;gap:56px}}
.hv-vs__us{background:var(--cream);color:#0a0a0a}
.hv-vs__us::after{content:"";position:absolute;right:-80px;top:-80px;width:280px;height:280px;border-radius:50%;background:var(--pink);opacity:.55;pointer-events:none}
.hv-vs__them{background:var(--raised);border:1px solid var(--line);color:#8a8a86}
.hv-vs__head,.hv-vs ul{position:relative}
.hv-vs h3{font-family:var(--font-display);font-weight:400;font-size:clamp(24px,2.6vw,34px);text-transform:uppercase}
.hv-vs .big{font-family:var(--font-display);font-size:clamp(52px,7vw,104px);line-height:.95;text-transform:uppercase;margin-top:14px}
.hv-vs__them .big{color:#3d3d3a}
.hv-vs ul{list-style:none;display:grid;gap:14px}
.hv-vs li{display:flex;gap:14px;align-items:flex-start;font-size:clamp(15px,1.4vw,18px);font-weight:600}
.hv-vs li i{flex:none;width:26px;height:26px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-size:14px;font-weight:800;margin-top:1px}
.hv-vs__us li i{background:#0a0a0a;color:var(--cream)}
.hv-vs__them li{font-weight:500;text-decoration:line-through;text-decoration-color:#555}
.hv-vs__them li i{background:#232323;color:#777}

/* ================= FAQ (split panel) ================= */
.hv-faq{padding:110px 0}
.hv-fb__chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.hv-fb__chips button{height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:none;color:var(--fg);font:600 14px var(--font-body);cursor:pointer;transition:.3s}
.hv-fb__chips button.on{background:var(--fg);color:#0a0a0a;border-color:var(--fg)}
.hv-fb__grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.hv-fb__grid{grid-template-columns:.9fr 1.1fr;align-items:start}}
.hv-fb__q{display:grid;gap:8px}
.hv-fb__q button{text-align:left;padding:18px 22px;border-radius:20px;border:1px solid var(--line);background:var(--raised);color:#b0b0aa;font:600 16px var(--font-body);cursor:pointer;display:flex;justify-content:space-between;gap:12px;transition:.35s var(--ease)}
.hv-fb__q button:hover{color:var(--fg);border-color:#ffffff33}
.hv-fb__q button.on{background:var(--cream);color:#0a0a0a;border-color:var(--cream);transform:translateX(8px)}
.hv-fb__a{position:sticky;top:96px;border-radius:32px;padding:clamp(28px,4vw,48px);background:linear-gradient(160deg,#6b6b45,#171712 80%);min-height:340px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.hv-fb__a h3{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(30px,4vw,52px);line-height:1}
.hv-fb__a p{font-size:18px;line-height:1.65;color:#e4e4dc}
.hv-fb__a small{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:var(--cream)}
.hv-fb__a .swap{animation:swapin .5s var(--ease)}
@keyframes swapin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:899px){.hv-fb__a{position:static;min-height:0}.hv-fb__q button.on{transform:none}}

/* ================= MISSION ================= */
.hv-mission{padding:0 0 120px;text-align:center;background:var(--bg)}
.hv-mission__bar{display:flex;height:10px;margin-bottom:110px}.hv-mission__bar i{flex:1}
.hv-mission__inner{display:flex;flex-direction:column;align-items:center;gap:26px}
.hv-mark{position:relative;width:min(420px,100%);aspect-ratio:16/9;overflow:hidden;border-radius:26px;background:var(--cream)}
.hv-mark__code{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hv-mark img{width:100%;height:100%;object-fit:cover}
.hv-mission__slogan{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(30px,5vw,68px);line-height:1.02;max-width:980px}
.hv-mission .hv-lead{text-align:center}

/* ================= FINAL ================= */
.hv-final{padding:120px 0;overflow:hidden;text-align:center;background:var(--cream);color:#0a0a0a}
.hv-final__out{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:0;pointer-events:none;opacity:.14}
.hv-final__out span{font-family:var(--font-display);text-transform:uppercase;font-size:clamp(90px,17vw,260px);line-height:.9;white-space:nowrap;color:transparent;-webkit-text-stroke:2px #0a0a0a;animation:slide 40s linear infinite}
.hv-final__out span:nth-child(2){animation-direction:reverse}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-30%)}}
.hv-final__inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:36px}
.hv-final__h{font-size:clamp(64px,13vw,200px);line-height:.9}
.hv-final .btn--solid{background:#0a0a0a;color:var(--fg)}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
  .hv-rv{opacity:1;transform:none}.hv-float{opacity:0}
}

/* ---- profile card that mirrors the live profile page ---- */
.rp{position:relative;background:#141414;border:1px solid #232323;border-radius:22px;overflow:hidden;color:#f5f5f2;text-align:left}
.rp__bar{display:flex;height:4px}.rp__bar i{flex:1}
.rp__banner{height:62px;background:linear-gradient(135deg,#6b6b45 0%,#141414 85%);opacity:.55}
.rp__av{position:absolute;left:16px;top:38px;width:54px;height:54px;border-radius:50%;background:#0a0a0a;border:3px solid #141414;box-shadow:0 0 0 1px #2c2c2c;display:grid;place-items:center;font-family:var(--font-display);font-size:19px;color:#c9ad8f}
.rp__body{padding:34px 16px 16px;display:flex;flex-direction:column}
.rp__name{font-family:var(--font-display);font-weight:400;font-size:24px;text-transform:uppercase;line-height:1.05}
.rp__role{font-size:12px;color:#8a8a86;margin-top:3px}
.rp__hood{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:#6f6f6a;margin-top:6px;font-weight:700}
.rp__tags{display:flex;gap:5px;margin:10px 0 12px;flex-wrap:wrap}
.rp__tags u{text-decoration:none;font-size:10px;color:#8a8a86;border:1px solid #2a2a2a;border-radius:999px;padding:3px 9px}
.rp__link{display:flex;align-items:center;gap:8px;background:#0a0a0a;border:1px solid #232323;border-radius:12px;padding:9px 11px;margin-bottom:6px;font-size:11px;font-weight:600}
.rp__link i{width:14px;height:14px;border-radius:4px;background:#c9ad8f}
.rp__btn{margin-top:8px;background:#f5f5f2;color:#0a0a0a;text-align:center;border-radius:999px;padding:9px;font-size:11px;font-weight:700;border:1px solid #f5f5f2}
.rp__btn--o{background:none;color:#f5f5f2;border-color:#2e2e2e;margin-top:6px}
.mini-phone{width:250px;margin-bottom:-120px;border-radius:34px 34px 0 0;border:7px solid #0d0d0d;border-bottom:0;background:#0d0d0d;box-shadow:0 30px 60px rgba(0,0,0,.5);transition:transform .8s var(--ease);overflow:hidden}
.mini-phone .rp{border-radius:26px 26px 0 0;border:0}
.t-profile:hover .mini-phone{transform:translateY(-18px)}
.rp--sm .rp__name{font-size:21px}

/* ---- mission: wordmark + scan-here ---- */
.hv-mission{text-align:center}
.hv-mission .hv-eyebrow{text-align:center}
.hv-mission .hv-mark{margin:0 auto 48px}
.hv-mission__row{display:grid;grid-template-columns:1fr;justify-items:center}
.hv-mission__txt{display:flex;flex-direction:column;align-items:center;gap:26px;max-width:900px}
.hv-mission__slogan{font-size:clamp(30px,4.2vw,58px)}
.hv-mission .hv-lead{text-align:center}

.hv-more{align-self:flex-start;font-size:14px;font-weight:700;color:var(--cream);border-bottom:1px solid #c9ad8f66;padding-bottom:2px;transition:border-color .3s}
.hv-more:hover{border-color:var(--cream)}