/* waiv-scenes.css — pinned NFC x-ray scene, real-product collection, parallax */

/* parallax layers are JS-driven; just hint the compositor */
[data-parallax]{will-change:transform;}

/* ───────────────────────── PINNED NFC SCENE ───────────────────────── */
.nfc-track{position:relative;height:380vh;
  background:linear-gradient(180deg,#000814 0%,#00102b 38%,#00102b 62%,#000814 100%);}
.nfc-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate;}

.nfc-bg{position:absolute;inset:0;z-index:0;pointer-events:none;}
.nfc-bg-grid{position:absolute;inset:-20% -10%;opacity:.5;
  background-image:linear-gradient(rgba(120,160,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(120,160,255,.06) 1px,transparent 1px);
  background-size:60px 60px;mask-image:radial-gradient(72% 72% at 50% 45%,#000 30%,transparent 78%);}
.nfc-bg-glow{position:absolute;width:760px;height:760px;left:50%;top:46%;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,213,39,.16),transparent 70%);filter:blur(70px);}

.nfc-head{position:absolute;top:8.5vh;left:0;right:0;text-align:center;z-index:4;padding:0 24px;}
.nfc-head .wv-kicker{justify-content:center;}
.nfc-head h2{font-size:clamp(30px,4vw,56px);font-weight:800;letter-spacing:-.035em;color:#fff;margin:0;line-height:1;text-wrap:balance;}
.nfc-head h2 em{font-style:normal;color:var(--yellow);}

.nfc-stage{position:relative;width:min(580px,68vw);aspect-ratio:1.585;perspective:1700px;z-index:2;transform:translateY(2vh);}
.nfc-card{position:absolute;inset:0;border-radius:5%/8%;overflow:hidden;transform-style:preserve-3d;will-change:transform;
  box-shadow:0 50px 90px -28px rgba(0,2,12,.9);}
.nfc-card .wv-card-gloss,.nfc-card .wv-card-brushed,.nfc-card .wv-card-grain,.nfc-card .wv-card-sheen{position:absolute;inset:0;pointer-events:none;}

/* face that dissolves */
.nfc-face{position:absolute;inset:0;padding:7.5% 8%;display:flex;flex-direction:column;z-index:2;will-change:opacity;}
.nfc-face .wv-card-logo{height:15%;align-self:flex-start;}
.nfc-face .wv-card-nfc{position:absolute;right:8%;top:9%;width:13%;aspect-ratio:1;}
.nfc-face .wv-card-meta{margin-top:auto;display:flex;align-items:center;gap:9px;
  font-family:'Space Mono',monospace;font-size:1.7%;letter-spacing:.18em;color:rgba(234,201,130,.6);text-transform:uppercase;}

/* x-ray internals */
.nfc-xray{position:absolute;inset:0;z-index:3;opacity:0;will-change:opacity;overflow:hidden;border-radius:inherit;}
.nfc-xray-dim{position:absolute;inset:0;background:radial-gradient(125% 125% at 56% 46%,rgba(0,8,22,.55),rgba(0,5,14,.9));}
.nfc-coil{position:absolute;inset:10% 8%;}
.nfc-coil span{position:absolute;border:1.5px solid #EAC982;border-radius:5%;
  box-shadow:0 0 8px rgba(234,201,130,.6);opacity:0;will-change:opacity;}
.nfc-coil span:nth-child(1){inset:0;}
.nfc-coil span:nth-child(2){inset:4.5%;}
.nfc-coil span:nth-child(3){inset:9%;}
.nfc-coil span:nth-child(4){inset:13.5%;}
.nfc-coil span:nth-child(5){inset:18%;}
.nfc-coil span:nth-child(6){inset:22.5%;}
.nfc-coil span:nth-child(7){inset:27%;}
.nfc-trace{position:absolute;right:40%;top:47%;width:13%;height:2px;background:#EAC982;box-shadow:0 0 6px #EAC982;opacity:0;}
.nfc-chip{position:absolute;right:27%;top:38%;width:17%;aspect-ratio:1.2;border-radius:14%;opacity:0;will-change:opacity,transform;
  background:linear-gradient(140deg,#222732,#4a5160 52%,#161922);
  box-shadow:0 0 22px rgba(255,213,39,.55),inset 0 0 0 1px rgba(200,218,255,.5),inset 0 2px 4px rgba(255,255,255,.2);}
.nfc-chip::before{content:"";position:absolute;inset:22%;border-radius:12%;
  background:repeating-linear-gradient(0deg,rgba(234,201,130,.9) 0 2px,transparent 2px 5px),repeating-linear-gradient(90deg,rgba(234,201,130,.6) 0 2px,transparent 2px 5px);opacity:.7;}
.nfc-chip i{position:absolute;background:#EAC982;border-radius:1px;box-shadow:0 0 5px #EAC982;}
.nfc-chip i:nth-child(1){top:-9px;left:28%;width:2px;height:10px;}
.nfc-chip i:nth-child(2){top:-9px;left:62%;width:2px;height:10px;}
.nfc-chip i:nth-child(3){bottom:-9px;left:28%;width:2px;height:10px;}
.nfc-chip i:nth-child(4){bottom:-9px;left:62%;width:2px;height:10px;}
.nfc-scan{position:absolute;left:0;right:0;height:18%;top:-18%;opacity:0;
  background:linear-gradient(180deg,transparent,rgba(255,213,39,.22),transparent);}

/* pulse rings emitted from chip */
.nfc-pulse{position:absolute;left:50%;top:50%;z-index:1;pointer-events:none;}
.nfc-pulse span{position:absolute;left:0;top:0;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;
  border:1.5px solid rgba(255,213,39,.5);transform:scale(.2);opacity:0;}
.nfc-sticky.is-live .nfc-pulse span{animation:nfc-pulse 3s ease-out infinite;}
.nfc-sticky.is-live .nfc-pulse span:nth-child(2){animation-delay:1s;}
.nfc-sticky.is-live .nfc-pulse span:nth-child(3){animation-delay:2s;}
@keyframes nfc-pulse{0%{transform:scale(.2);opacity:.8}100%{transform:scale(4.2);opacity:0}}

/* annotations */
.nfc-anno{position:absolute;display:flex;align-items:flex-start;gap:9px;z-index:5;
  font-family:'Space Mono',monospace;font-size:12px;line-height:1.45;letter-spacing:.05em;color:rgba(230,235,255,.82);
  opacity:0;transform:translateY(6px);transition:opacity .5s,transform .5s;pointer-events:none;white-space:nowrap;}
.nfc-anno b{color:var(--yellow);font-weight:700;letter-spacing:.08em;}
.nfc-anno-dot{width:7px;height:7px;border-radius:50%;background:var(--yellow);margin-top:3px;flex:none;box-shadow:0 0 10px rgba(255,213,39,.9);}
.nfc-anno.is-on{opacity:.92;transform:none;}
.nfc-anno-chip{top:30%;left:calc(100% + 18px);}
.nfc-anno-coil{bottom:24%;right:calc(100% + 18px);text-align:right;flex-direction:row-reverse;}
.nfc-anno-coil .nfc-anno-dot{margin-top:3px;}
@media (max-width:900px){.nfc-anno{display:none;}}

/* caption + progress */
.nfc-caps{position:absolute;bottom:9vh;left:0;right:0;text-align:center;z-index:4;padding:0 24px;}
.nfc-cap{position:relative;height:2.4em;}
.nfc-cap p{position:absolute;left:0;right:0;margin:0;font-size:clamp(17px,1.8vw,24px);font-weight:600;letter-spacing:-.01em;
  color:rgba(230,235,255,.9);opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s;text-wrap:balance;}
.nfc-cap p.is-on{opacity:1;transform:none;}
.nfc-cap p em{font-style:normal;color:var(--yellow);}
.nfc-dots{display:flex;gap:9px;justify-content:center;margin-top:22px;}
.nfc-dots i{width:34px;height:3px;border-radius:2px;background:rgba(230,235,255,.18);transition:background .35s;}
.nfc-dots i.is-on{background:var(--yellow);box-shadow:0 0 10px rgba(255,213,39,.7);}

@media (prefers-reduced-motion: reduce){
  .nfc-sticky.is-live .nfc-pulse span{animation:none;}
}

/* ───────────────────────── REAL-PRODUCT COLLECTION ───────────────────────── */
.coll{position:relative;padding:clamp(90px,11vw,140px) 0;overflow:hidden;}
.coll-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;
  max-width:1200px;margin:0 auto;padding:0 clamp(28px,5vw,64px);}
.coll-head .wv-sec-lede{margin-top:18px;}
.coll-arrows{display:flex;gap:12px;flex:none;}
.coll-arrow{width:54px;height:54px;border-radius:50%;cursor:pointer;border:none;display:flex;align-items:center;justify-content:center;
  background:rgba(230,235,255,.05);box-shadow:inset 0 0 0 1px rgba(230,235,255,.18);color:var(--frost);transition:background .2s,transform .2s,box-shadow .2s;}
.coll-arrow:hover{background:rgba(255,213,39,.14);box-shadow:inset 0 0 0 1px rgba(255,213,39,.4);transform:translateY(-2px);}
.coll-arrow:disabled{opacity:.3;cursor:default;transform:none;background:rgba(230,235,255,.04);}
.coll-arrow svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}

.coll-viewport{margin-top:50px;overflow:hidden;cursor:grab;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);}
.coll-viewport.is-drag{cursor:grabbing;}
.coll-track{display:flex;gap:26px;padding:0 clamp(28px,5vw,64px) 12px;width:max-content;will-change:transform;}
.coll-card{flex:0 0 auto;width:296px;user-select:none;}
.coll-shot{position:relative;height:392px;border-radius:22px;overflow:hidden;display:flex;align-items:center;justify-content:center;
  box-shadow:inset 0 0 0 1px rgba(230,235,255,.1),0 30px 60px -30px rgba(0,4,20,.8);transition:transform .4s cubic-bezier(.2,.7,.3,1),box-shadow .4s;}
.coll-card:hover .coll-shot{transform:translateY(-6px);box-shadow:inset 0 0 0 1px rgba(255,213,39,.3),0 40px 70px -28px rgba(0,4,20,.9);}
.coll-shot::after{content:"";position:absolute;inset:0;background-image:var(--noise);background-size:150px;opacity:.1;mix-blend-mode:overlay;pointer-events:none;}
.coll-shot-glow{position:absolute;width:120%;height:60%;left:-10%;top:18%;border-radius:50%;filter:blur(50px);opacity:.55;}
.coll-img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;object-position:center;
  transition:transform .6s cubic-bezier(.2,.7,.3,1);pointer-events:none;}
.coll-card:hover .coll-img{transform:scale(1.06);}
.coll-fallback{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;text-align:center;padding:24px;}
.coll-fb-mark{font-family:'Ubuntu',sans-serif;font-weight:700;font-size:40px;line-height:1;letter-spacing:-.03em;
  color:rgba(255,255,255,.95);text-shadow:0 2px 14px rgba(0,0,0,.3);}
.coll-fb-name{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.7);}
.coll-fallback.is-light .coll-fb-mark{color:rgba(20,30,45,.92);text-shadow:0 2px 14px rgba(255,255,255,.3);}
.coll-fallback.is-light .coll-fb-name{color:rgba(20,30,45,.62);}
.coll-tag{position:absolute;top:16px;left:16px;z-index:2;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.85);padding:6px 11px;border-radius:999px;background:rgba(0,8,20,.5);
  backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);}
.coll-tag.is-custom{color:var(--yellow);box-shadow:inset 0 0 0 1px rgba(255,213,39,.4);}
.coll-meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:20px;}
.coll-name{font-size:20px;font-weight:700;letter-spacing:-.02em;color:#fff;margin:0;}
.coll-price{font-family:'Space Mono',monospace;font-size:14px;color:var(--yellow);white-space:nowrap;}
.coll-sub{font-size:13.5px;color:rgba(230,235,255,.55);margin:5px 0 0;}

.coll-progress{position:relative;height:3px;border-radius:2px;background:rgba(230,235,255,.1);margin:38px auto 0;
  max-width:1200px;width:calc(100% - 2*clamp(28px,5vw,64px));overflow:hidden;}
.coll-progress-bar{position:absolute;top:0;left:0;height:100%;border-radius:2px;background:var(--yellow);box-shadow:0 0 10px rgba(255,213,39,.6);}

/* ───────────────────────── TYPOGRAPHY: Ubuntu headings / Karla body ───────────────────────── */
body,.wv-home,.hb-hero,.wv-hero,.wv-tile{font-family:'Karla',system-ui,sans-serif;}

/* headings → Ubuntu (caps at 700; large weights map to bold) */
.hb-display,.wv-display,.wv-sec-title,.nfc-head h2,.wv-cta h2,
.coll-name,.wv-tx-t,.wv-step-t,.wv-finish-now h3,.wv-ol-name,
.wv-biz-card h4,.wv-ol-feat h4,.wv-biz-stat b,.wv-ol-float .wv-num{
  font-family:'Ubuntu',system-ui,sans-serif;
}
/* Ubuntu's top weight is 700 — keep display weights from requesting unavailable 800/900 */
.hb-display,.wv-display,.wv-sec-title,.nfc-head h2,.wv-cta h2,.wv-biz-stat b{font-weight:700;}