:root{
  --base:#FFFFFF; --elev:#F3F7FC; --card:#FFFFFF; --carbon:#EDF3F9;
  --line:#E2EAF2; --line2:#D0DBE6;
  --hi:#0B2236; --mid:#56697B; --low:#8B9BAB;
  --ice:#4A5667; --ice-deep:#2B3440; --ice-light:var(--ice-light); --ice-rgb:74,86,103; --platinum:#3E5163;
  --glow:rgba(var(--ice-rgb),.14);
  --shadow:0 24px 60px -28px rgba(11,34,54,.22);
  --shadow-sm:0 10px 30px -16px rgba(11,34,54,.18);
  --display:"Clash Display","Satoshi",ui-sans-serif,system-ui,sans-serif;
  --body:"Satoshi",ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --maxw:1240px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--body); background:var(--base); color:var(--hi);
  line-height:1.55; overflow-x:hidden; -webkit-font-smoothing:antialiased;
  font-feature-settings:"ss01","cv01";
}
::selection{background:rgba(var(--ice-rgb),.16);color:var(--ice-deep)}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-.02em;line-height:1.04;color:var(--hi)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.mono{font-family:var(--mono);font-weight:400}
.eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--ice);display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:linear-gradient(90deg,var(--ice),transparent)}
.muted{color:var(--mid)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-weight:500;font-size:14.5px;letter-spacing:.01em;padding:14px 26px;border-radius:100px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),background .3s,border-color .3s;
  position:relative;white-space:nowrap;
}
.btn-primary{
  background:linear-gradient(180deg,var(--ice-light),var(--ice));color:#fff;font-weight:700;
  box-shadow:0 14px 34px -12px rgba(var(--ice-rgb),.5),inset 0 1px 0 rgba(255,255,255,.25);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 22px 50px -14px rgba(var(--ice-rgb),.6)}
.btn-ghost{border:1px solid var(--line2);color:var(--hi);background:#fff}
.btn-ghost:hover{border-color:var(--ice);color:var(--ice);background:rgba(var(--ice-rgb),.05);transform:translateY(-2px)}
.btn svg{width:16px;height:16px}

/* ---------- announce bar ---------- */
.announce{
  background:linear-gradient(90deg,rgba(var(--ice-rgb),.07),rgba(var(--ice-rgb),.02));
  border-bottom:1px solid var(--line); font-size:12px;
  padding:8px 0; color:var(--mid); letter-spacing:.04em; position:relative; z-index:60;
  overflow:hidden; white-space:nowrap;
}
.announce-track{display:flex;flex-wrap:nowrap;width:max-content;animation:vanta-marquee 45s linear infinite;will-change:transform}
.announce:hover .announce-track{animation-play-state:paused}
.announce-half{flex:0 0 auto;display:flex;flex-wrap:nowrap;align-items:center}
.announce-seq{flex:0 0 auto;display:inline-flex;align-items:center;white-space:nowrap;padding:0 4px}
.announce b{color:var(--hi);font-weight:600}
.announce .dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--ice);
  margin:0 14px;vertical-align:middle;box-shadow:0 0 8px rgba(var(--ice-rgb),.6);animation:pulse 2.4s infinite}
@keyframes vanta-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.announce-track{animation:none;justify-content:center;width:100%}}
@keyframes pulse{0%,100%{opacity:.4}50%{opacity:1}}

/* ---------- navbar ---------- */
.nav{position:sticky;top:0;z-index:50;transition:background .4s,border-color .4s,backdrop-filter .4s,box-shadow .4s}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px;border-bottom:1px solid transparent;transition:border-color .4s}
.nav.scrolled{background:rgba(255,255,255,.8);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);box-shadow:0 6px 24px -16px rgba(11,34,54,.2)}
.nav.scrolled .nav-inner{border-bottom-color:var(--line)}
.logo{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:.02em;color:var(--hi)}
.logo .mark{width:30px;height:30px;flex:0 0 30px}
.logo span small{font-family:var(--mono);font-size:8.5px;letter-spacing:.3em;color:var(--ice);display:block;margin-top:-2px;font-weight:400}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-links a, .nav-links .navitem{
  font-size:14px;color:var(--mid);padding:9px 14px;border-radius:9px;transition:color .25s,background .25s;
  display:inline-flex;align-items:center;gap:5px;position:relative;
}
.nav-links a:hover,.nav-links .navitem:hover{color:var(--hi);background:rgba(11,34,54,.05)}
.navitem .chev{width:13px;height:13px;transition:transform .3s;opacity:.7}
.has-drop:hover .chev{transform:rotate(180deg)}
.nav-actions{display:flex;align-items:center;gap:6px}
.icon-btn{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;color:var(--mid);transition:.25s;position:relative}
.icon-btn:hover{color:var(--hi);background:rgba(11,34,54,.05)}
.icon-btn svg{width:19px;height:19px}
.cart-count{position:absolute;top:5px;right:5px;min-width:17px;height:17px;border-radius:9px;background:var(--ice);
  color:#fff;font-family:var(--mono);font-size:10px;font-weight:500;display:grid;place-items:center;padding:0 4px;
  box-shadow:0 0 10px rgba(var(--ice-rgb),.5);transform:scale(0);transition:transform .35s var(--ease)}
.cart-count.show{transform:scale(1)}

/* mega dropdown */
.has-drop{position:relative}
.drop{
  position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(8px);
  width:560px;background:rgba(255,255,255,.98);backdrop-filter:blur(24px);border:1px solid var(--line2);
  border-radius:18px;padding:14px;opacity:0;visibility:hidden;transition:.32s var(--ease);
  box-shadow:0 30px 70px -20px rgba(11,34,54,.28);display:grid;grid-template-columns:1fr 1fr;gap:4px;
}
.has-drop:hover .drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.drop::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
.drop-item{padding:13px 14px;border-radius:12px;transition:background .25s;display:flex;gap:13px;align-items:flex-start}
.drop-item:hover{background:rgba(var(--ice-rgb),.06)}
.drop-item .di-ic{width:38px;height:38px;flex:0 0 38px;border-radius:10px;display:grid;place-items:center;
  background:rgba(var(--ice-rgb),.08);border:1px solid var(--line);color:var(--ice)}
.drop-item .di-ic svg{width:18px;height:18px}
.drop-item h5{font-family:var(--body);font-weight:700;font-size:14px;color:var(--hi);letter-spacing:0}
.drop-item p{font-size:12px;color:var(--low);margin-top:2px;line-height:1.4}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:60px 0 80px;overflow:hidden;
  background:linear-gradient(180deg,#fff 0%,#eef4fc 100%)}
#molecule{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.6}
.hero-glow{position:absolute;border-radius:50%;filter:blur(90px);z-index:0;pointer-events:none}
.hg1{width:560px;height:560px;background:radial-gradient(circle,rgba(var(--ice-rgb),.14),transparent 70%);top:-180px;right:-120px}
.hg2{width:480px;height:480px;background:radial-gradient(circle,rgba(47,123,242,.1),transparent 70%);bottom:-160px;left:-140px}
.hero-grid-tex{position:absolute;inset:0;z-index:0;opacity:.7;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 75%)}
.hero-wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;gap:50px;align-items:center;width:100%}
.hero-pill{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line2);background:#fff;
  border-radius:100px;padding:7px 7px 7px 16px;font-size:12.5px;color:var(--mid);margin-bottom:30px;box-shadow:var(--shadow-sm)}
.hero-pill b{color:var(--hi);font-weight:600}
.hero-pill .tag{background:rgba(var(--ice-rgb),.1);color:var(--ice);border:1px solid rgba(var(--ice-rgb),.25);
  font-family:var(--mono);font-size:10px;padding:3px 10px;border-radius:100px;letter-spacing:.08em}
.hero h1{font-size:clamp(42px,6.2vw,80px);font-weight:600;margin-bottom:24px}
.hero h1 .grad{background:linear-gradient(120deg,var(--ice-light),var(--ice) 50%,var(--ice-deep));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p.lead{font-size:clamp(16px,1.5vw,18.5px);color:var(--mid);max-width:520px;margin-bottom:38px;line-height:1.65}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:46px}
.cred-row{display:flex;gap:30px;flex-wrap:wrap}
.cred{display:flex;flex-direction:column;gap:3px}
.cred .num{font-family:var(--mono);font-size:26px;color:var(--hi);font-weight:500;letter-spacing:-.02em}
.cred .num .u{color:var(--ice);font-size:18px}
.cred .lbl{font-size:11.5px;color:var(--low);letter-spacing:.04em}

/* hero product render */
.hero-vis{position:relative;display:grid;place-items:center;min-height:460px}
.vial-card{position:relative;width:300px;height:430px;border-radius:26px;
  background:linear-gradient(165deg,#ffffff,#f2f7fd);border:1px solid var(--line2);
  box-shadow:0 50px 110px -34px rgba(11,34,54,.3),inset 0 1px 0 #fff;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:30px;overflow:hidden;
  animation:floaty 7s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
.vial-card .ring{position:absolute;top:-90px;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--ice-rgb),.18),transparent 65%)}
.vial{width:96px;height:240px;position:relative;margin-bottom:auto;margin-top:34px;filter:drop-shadow(0 18px 36px rgba(var(--ice-rgb),.28))}
.vial .glass{position:absolute;inset:0;top:34px;border-radius:14px 14px 18px 18px;
  background:linear-gradient(120deg,rgba(var(--ice-rgb),.06),rgba(255,255,255,.5));
  border:1px solid rgba(11,34,54,.16);overflow:hidden}
.vial .liquid{position:absolute;bottom:0;left:0;right:0;height:62%;
  background:linear-gradient(180deg,#4d8df5,#2B3440);
  box-shadow:inset 0 4px 14px rgba(255,255,255,.35)}
.vial .liquid::before{content:"";position:absolute;top:-6px;left:0;right:0;height:8px;background:#7aa9f7;border-radius:50%}
.vial .cap{position:absolute;top:0;left:50%;transform:translateX(-50%);width:54px;height:40px;
  background:linear-gradient(180deg,#d6e0ec,#aebccb);border-radius:7px;border:1px solid var(--line2)}
.vial .cap::after{content:"";position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:62px;height:12px;background:#c2cedb;border-radius:3px;border:1px solid var(--line)}
.vial-card .v-meta{width:100%;border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;align-items:flex-end}
.vial-card .v-meta h4{font-size:18px}
.vial-card .v-meta .pur{font-family:var(--mono);font-size:12px;color:var(--ice)}
.vial-card .v-meta .pr{font-family:var(--mono);font-size:20px;color:var(--hi)}
.float-badge{position:absolute;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border:1px solid var(--line2);
  border-radius:14px;padding:11px 15px;display:flex;align-items:center;gap:10px;font-size:12.5px;
  box-shadow:var(--shadow);animation:floaty 7s ease-in-out infinite}
.float-badge svg{width:18px;height:18px;color:var(--ice)}
.float-badge b{font-weight:700;color:var(--hi)}.float-badge small{color:var(--low);display:block;font-size:10.5px}
.fb1{top:34px;left:-26px;animation-delay:.8s}
.fb2{bottom:60px;right:-30px;animation-delay:1.6s}

/* ---------- trust strip ---------- */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;background:var(--elev)}
.strip-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.strip-item{display:flex;align-items:center;gap:11px;color:var(--mid);font-size:13.5px;letter-spacing:.02em}
.strip-item svg{width:19px;height:19px;color:var(--ice);flex:0 0 19px}
.strip-item b{color:var(--hi);font-weight:600}

/* ---------- section base ---------- */
section.blk{padding:108px 0;position:relative}
.sec-head{max-width:680px;margin-bottom:54px}
.sec-head.center{margin:0 auto 56px;text-align:center}
.sec-head h2{font-size:clamp(30px,3.6vw,46px);margin:18px 0 18px}
.sec-head p{color:var(--mid);font-size:16px;line-height:1.6}
.sec-head.center .eyebrow{justify-content:center}
.sec-head.center .eyebrow::after{content:"";width:22px;height:1px;background:linear-gradient(90deg,transparent,var(--ice))}

/* ---------- product grid ---------- */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcard{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;
  transition:transform .55s var(--ease),border-color .4s,box-shadow .55s var(--ease);overflow:hidden;box-shadow:var(--shadow-sm)}
.pcard::after{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;opacity:0;transition:opacity .5s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(var(--ice-rgb),.08),transparent 60%)}
.pcard:hover{transform:translateY(-7px);border-color:rgba(var(--ice-rgb),.4);box-shadow:0 34px 70px -28px rgba(11,34,54,.3)}
.pcard:hover::after{opacity:1}
.pcard-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}
.pc-cat{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--low)}
.lab-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;
  color:var(--ice);background:rgba(var(--ice-rgb),.08);border:1px solid rgba(var(--ice-rgb),.2);border-radius:100px;padding:4px 10px}
.lab-badge svg{width:11px;height:11px}
.pc-vis{height:168px;border-radius:14px;background:
  radial-gradient(circle at 50% 30%,rgba(var(--ice-rgb),.07),transparent 60%),
  linear-gradient(165deg,#f6faff,#eaf1f9);
  border:1px solid var(--line);display:grid;place-items:center;margin-bottom:18px;position:relative;overflow:hidden}
.pc-vis .mini-vial{width:46px;height:118px;position:relative;transition:transform .6s var(--ease)}
.pcard:hover .pc-vis .mini-vial{transform:translateY(-6px) scale(1.05)}
.pc-vis .mini-vial .g{position:absolute;inset:0;top:18px;border-radius:8px 8px 11px 11px;background:linear-gradient(120deg,rgba(var(--ice-rgb),.06),rgba(255,255,255,.5));border:1px solid rgba(11,34,54,.14);overflow:hidden}
.pc-vis .mini-vial .l{position:absolute;bottom:0;left:0;right:0;height:58%;background:linear-gradient(180deg,#4d8df5,#2B3440)}
.pc-vis .mini-vial .c{position:absolute;top:0;left:50%;transform:translateX(-50%);width:28px;height:22px;background:linear-gradient(180deg,#d6e0ec,#aebccb);border-radius:5px;border:1px solid var(--line2)}
.pc-vis .pur-tag{position:absolute;top:12px;right:12px;font-family:var(--mono);font-size:11px;color:var(--ice)}
.pcard h3{font-size:19px;font-family:var(--body);font-weight:700;letter-spacing:0;margin-bottom:5px}
.pcard .sub{font-size:13px;color:var(--mid);margin-bottom:16px;min-height:38px}
.pc-foot{display:flex;align-items:center;justify-content:space-between;padding-top:16px;border-top:1px solid var(--line)}
.pc-price{font-family:var(--mono);font-size:22px;color:var(--hi)}
.pc-price small{color:var(--low);font-size:12px}
.add-btn{width:42px;height:42px;border-radius:12px;background:rgba(var(--ice-rgb),.08);border:1px solid rgba(var(--ice-rgb),.25);
  color:var(--ice);display:grid;place-items:center;transition:.3s}
.add-btn:hover{background:var(--ice);color:#fff;transform:scale(1.08)}
.add-btn svg{width:19px;height:19px}
.stars{display:flex;gap:2px;margin-bottom:14px}
.stars svg{width:13px;height:13px;color:var(--ice);fill:var(--ice)}
.stars span{font-size:11.5px;color:var(--low);margin-left:6px;font-family:var(--mono)}

/* ---------- science stats ---------- */
.science{background:var(--elev);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--card);box-shadow:var(--shadow-sm)}
.stat{padding:38px 30px;border-right:1px solid var(--line);position:relative;overflow:hidden}
.stat:last-child{border-right:none}
.stat .sn{font-family:var(--mono);font-size:46px;font-weight:500;letter-spacing:-.03em;color:var(--hi);line-height:1}
.stat .sn .u{color:var(--ice);font-size:30px}
.stat .sl{color:var(--mid);font-size:13.5px;margin-top:12px}
.sci-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:24px}
.sci-card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:30px;transition:.45s var(--ease);box-shadow:var(--shadow-sm)}
.sci-card:hover{border-color:rgba(var(--ice-rgb),.35);transform:translateY(-5px);box-shadow:var(--shadow)}
.sci-ic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;margin-bottom:20px;
  background:rgba(var(--ice-rgb),.08);border:1px solid var(--line2);color:var(--ice)}
.sci-ic svg{width:23px;height:23px}
.sci-card h4{font-family:var(--body);font-weight:700;font-size:17px;margin-bottom:9px}
.sci-card p{color:var(--mid);font-size:13.5px;line-height:1.6}

/* ---------- categories ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cat-card{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line);min-height:230px;
  display:flex;flex-direction:column;justify-content:flex-end;padding:26px;transition:.5s var(--ease);cursor:pointer;
  background:linear-gradient(165deg,#ffffff,#eef4fc);box-shadow:var(--shadow-sm)}
.cat-card:hover{border-color:rgba(var(--ice-rgb),.4);transform:translateY(-5px);box-shadow:var(--shadow)}
.cat-card .cglow{position:absolute;top:-40px;right:-40px;width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--ice-rgb),.16),transparent 65%);opacity:.6;transition:.5s}
.cat-card:hover .cglow{opacity:1;transform:scale(1.15)}
.cat-card .cnum{position:absolute;top:24px;left:26px;font-family:var(--mono);font-size:12px;color:var(--low)}
.cat-card .cic{position:absolute;top:22px;right:24px;color:var(--ice);opacity:.7;transition:.5s}
.cat-card:hover .cic{opacity:1;transform:translateY(-4px)}
.cat-card .cic svg{width:26px;height:26px}
.cat-card h3{font-size:24px;position:relative;z-index:2;margin-bottom:6px}
.cat-card p{color:var(--mid);font-size:13px;position:relative;z-index:2;margin-bottom:14px}
.cat-card .clink{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--ice);text-transform:uppercase;
  display:inline-flex;align-items:center;gap:7px;position:relative;z-index:2}
.cat-card .clink svg{width:13px;height:13px;transition:transform .4s}
.cat-card:hover .clink svg{transform:translateX(4px)}

/* ---------- best sellers carousel ---------- */
.carousel-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px;gap:20px;flex-wrap:wrap}
.car-nav{display:flex;gap:10px}
.car-nav button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line2);color:var(--hi);
  display:grid;place-items:center;transition:.3s;background:#fff}
.car-nav button:hover{border-color:var(--ice);color:var(--ice);background:rgba(var(--ice-rgb),.06)}
.car-nav button svg{width:18px;height:18px}
.car-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 28px 22px;margin:0 -28px;
  scrollbar-width:none}
.car-track::-webkit-scrollbar{display:none}
.car-item{scroll-snap-align:start;flex:0 0 300px}

/* ---------- research (unused) ---------- */
.research{background:var(--elev);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* ---------- faq ---------- */
.faq-wrap{max-width:820px;margin:0 auto}
.faq-item{border:1px solid var(--line);border-radius:16px;margin-bottom:13px;overflow:hidden;background:var(--card);transition:border-color .3s,box-shadow .3s;box-shadow:var(--shadow-sm)}
.faq-item.open{border-color:rgba(var(--ice-rgb),.4)}
.faq-q{width:100%;text-align:left;padding:22px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px;
  font-family:var(--body);font-weight:700;font-size:16px;color:var(--hi)}
.faq-q .fic{flex:0 0 28px;width:28px;height:28px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;
  transition:.4s var(--ease);color:var(--ice)}
.faq-item.open .fic{transform:rotate(45deg);background:rgba(var(--ice-rgb),.12);border-color:var(--ice)}
.faq-q .fic svg{width:15px;height:15px}
.faq-a{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.faq-a div{padding:0 24px 24px;color:var(--mid);font-size:14.5px;line-height:1.7}

/* ---------- newsletter band ---------- */
.nl-band{position:relative;border:1px solid var(--line2);border-radius:26px;padding:60px;overflow:hidden;
  background:linear-gradient(150deg,#eaf2fe,#f7faff);box-shadow:var(--shadow-sm)}
.nl-band .nlglow{position:absolute;top:-120px;right:-80px;width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--ice-rgb),.16),transparent 65%)}
.nl-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.nl-inner h2{font-size:clamp(28px,3vw,40px);margin-bottom:14px}
.nl-inner p{color:var(--mid);font-size:15.5px;max-width:440px}
.nl-form{display:flex;gap:11px;flex-wrap:wrap}
.nl-form input{flex:1;min-width:200px;background:#fff;border:1px solid var(--line2);border-radius:100px;
  padding:15px 22px;color:var(--hi);font-family:var(--body);font-size:14.5px;outline:none;transition:.3s}
.nl-form input:focus{border-color:var(--ice);box-shadow:0 0 0 3px rgba(var(--ice-rgb),.12)}
.nl-form input::placeholder{color:var(--low)}
.nl-note{font-family:var(--mono);font-size:11px;color:var(--low);margin-top:14px}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:72px 0 0;background:var(--elev)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:40px;padding-bottom:54px;border-bottom:1px solid var(--line)}
.foot-brand .logo{margin-bottom:18px}
.foot-brand p{color:var(--mid);font-size:13.5px;max-width:300px;line-height:1.65;margin-bottom:22px}
.foot-soc{display:flex;gap:10px}
.foot-soc a{width:40px;height:40px;border-radius:11px;border:1px solid var(--line);display:grid;place-items:center;
  color:var(--mid);transition:.3s;background:#fff}
.foot-soc a:hover{color:var(--ice);border-color:rgba(var(--ice-rgb),.4);background:rgba(var(--ice-rgb),.05)}
.foot-soc svg{width:18px;height:18px}
.foot-col h5{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--low);margin-bottom:20px}
.foot-col a{display:block;color:var(--mid);font-size:14px;margin-bottom:13px;transition:color .25s,transform .25s}
.foot-col a:hover{color:var(--ice);transform:translateX(3px)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;flex-wrap:wrap;gap:16px}
.foot-bottom p{font-size:12.5px;color:var(--low)}
.foot-bottom .fb-links{display:flex;gap:24px}
.foot-bottom .fb-links a{font-size:12.5px;color:var(--low);transition:.25s}
.foot-bottom .fb-links a:hover{color:var(--mid)}
.disclaimer{background:var(--base);border-top:1px solid var(--line);padding:18px 0;text-align:center}
.disclaimer p{font-size:11px;color:var(--low);line-height:1.6;max-width:900px;margin:0 auto;font-family:var(--mono)}

/* ---------- cart drawer ---------- */
.overlay{position:fixed;inset:0;background:rgba(11,34,54,.4);backdrop-filter:blur(4px);z-index:90;opacity:0;visibility:hidden;transition:.4s}
.overlay.show{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100%;width:420px;max-width:90vw;background:var(--base);border-left:1px solid var(--line2);
  z-index:100;transform:translateX(100%);transition:transform .5s var(--ease);display:flex;flex-direction:column;
  box-shadow:-30px 0 80px -20px rgba(11,34,54,.3)}
.drawer.show{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:24px;border-bottom:1px solid var(--line)}
.drawer-head h3{font-size:19px;display:flex;align-items:center;gap:10px}
.drawer-head .dc{font-family:var(--mono);font-size:12px;color:var(--ice);background:rgba(var(--ice-rgb),.1);padding:2px 9px;border-radius:100px}
.drawer-body{flex:1;overflow-y:auto;padding:18px 24px}
.cart-line{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.cart-line .cl-vis{width:56px;height:56px;flex:0 0 56px;border-radius:12px;border:1px solid var(--line);
  background:radial-gradient(circle at 50% 30%,rgba(var(--ice-rgb),.1),transparent),#f6faff;display:grid;place-items:center;color:var(--ice)}
.cart-line .cl-vis svg{width:22px;height:22px}
.cart-line h5{font-family:var(--body);font-weight:700;font-size:14px}
.cart-line small{font-family:var(--mono);font-size:11px;color:var(--low)}
.cart-line .cl-price{margin-left:auto;font-family:var(--mono);color:var(--hi);font-size:14px}
.empty-cart{text-align:center;padding:70px 24px;color:var(--low)}
.empty-cart .ec-ic{width:70px;height:70px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;
  margin:0 auto 22px;color:var(--low)}
.empty-cart .ec-ic svg{width:30px;height:30px}
.empty-cart h4{font-family:var(--body);font-weight:700;color:var(--mid);margin-bottom:8px}
.empty-cart p{font-size:13px;margin-bottom:24px}
.drawer-foot{padding:24px;border-top:1px solid var(--line)}
.drawer-foot .row{display:flex;justify-content:space-between;margin-bottom:8px;color:var(--mid);font-size:13.5px}
.drawer-foot .row.tot{color:var(--hi);font-size:17px;font-family:var(--mono);margin:14px 0 18px;padding-top:14px;border-top:1px solid var(--line)}
.drawer-foot .btn{width:100%}

/* ---------- mobile nav + sticky cta ---------- */
.hamburger{display:none;width:42px;height:42px;border-radius:11px;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.hamburger span{width:20px;height:1.8px;background:var(--hi);border-radius:2px;transition:.35s var(--ease)}
.hamburger.active span:nth-child(1){transform:translateY(6.8px) rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:translateY(-6.8px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;top:0;background:rgba(255,255,255,.98);backdrop-filter:blur(20px);z-index:80;
  transform:translateY(-100%);transition:transform .55s var(--ease);padding:100px 28px 40px;display:flex;flex-direction:column;overflow-y:auto}
.mobile-menu.show{transform:translateY(0)}
.mobile-menu a{font-family:var(--display);font-size:30px;font-weight:600;padding:14px 0;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;color:var(--hi);opacity:0;transform:translateY(20px)}
.mobile-menu a svg{width:20px;height:20px;color:var(--low)}
.mobile-menu.show a{animation:mItem .5s var(--ease) forwards}
@keyframes mItem{to{opacity:1;transform:translateY(0)}}
.mobile-menu .mm-cta{margin-top:auto;padding-top:30px;display:flex;gap:12px}
.mobile-menu .mm-cta .btn{flex:1;justify-content:center;text-align:center;font-family:var(--body);font-weight:700;font-size:16px;letter-spacing:.01em;padding:16px 22px;border-bottom:0}
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:70;padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.92);backdrop-filter:blur(20px);border-top:1px solid var(--line2);gap:12px;align-items:center;
  transform:translateY(120%);transition:transform .5s var(--ease);box-shadow:0 -10px 30px -16px rgba(11,34,54,.2)}
.sticky-cta.show{transform:translateY(0)}
.sticky-cta .sc-info{flex:1}
.sticky-cta .sc-info small{font-family:var(--mono);font-size:10px;color:var(--low);display:block}
.sticky-cta .sc-info b{font-size:14px;color:var(--hi)}
.sticky-cta .btn{flex:0 0 auto}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
.stagger>*{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.stagger.in>*{opacity:1;transform:none}
.stagger.in>*:nth-child(1){transition-delay:.05s}
.stagger.in>*:nth-child(2){transition-delay:.13s}
.stagger.in>*:nth-child(3){transition-delay:.21s}
.stagger.in>*:nth-child(4){transition-delay:.29s}
.stagger.in>*:nth-child(5){transition-delay:.37s}
.stagger.in>*:nth-child(6){transition-delay:.45s}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .hero-wrap{grid-template-columns:1fr;gap:60px}
  .hero-vis{order:-1;min-height:380px}
}
@media(max-width:900px){
  .nav-links{display:none}
  .hamburger{display:flex}
  .desktop-only{display:none}
  .nav-actions a.icon-btn[aria-label="Account"]{display:grid}
  .nav-actions{gap:2px}
  .icon-btn{width:38px;height:38px}
  .prod-grid,.cat-grid,.sci-cards{grid-template-columns:1fr 1fr}
  .stat-grid{grid-template-columns:1fr 1fr}
  .stat:nth-child(2){border-right:none}
  .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line)}
  .nl-inner{grid-template-columns:1fr;gap:28px}
  .foot-grid{grid-template-columns:1fr 1fr;gap:36px}
  .foot-brand{grid-column:1/-1}
}
@media(max-width:640px){
  .wrap{padding:0 20px}
  section.blk{padding:74px 0}
  .prod-grid,.cat-grid,.sci-cards{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr 1fr}
  .stat{padding:28px 22px}
  .stat .sn{font-size:38px}
  .strip-inner{justify-content:flex-start;gap:14px 22px}
  .strip-item{font-size:12.5px}
  .hero{min-height:auto;padding:48px 0 40px}
  .hero-cta{flex-direction:column;align-items:stretch}
  .hero-cta .btn{width:100%}
  .cred-row{gap:22px}
  .sticky-cta{display:flex}
  .nl-band{padding:36px 26px}
  .float-badge{display:none}
  .vial-card{width:250px;height:380px}
  .foot-grid{grid-template-columns:1fr}
  .foot-bottom{flex-direction:column;align-items:flex-start}
  .has-footer-pad{padding-bottom:90px}
}


/* ============================================================
   WOOCOMMERCE THEMING — match VANTA clinical white/blue brand
   ============================================================ */
.woocommerce-page main.wrap, .woocommerce main.wrap{padding:120px 0 90px}
.woocommerce h1,.woocommerce h2{color:var(--hi)}
.woocommerce-breadcrumb{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--low);margin-bottom:26px}
.woocommerce-breadcrumb a{color:var(--ice)}
.woocommerce .woocommerce-result-count{color:var(--mid);font-size:13px}
.woocommerce .woocommerce-ordering select{background:#fff;border:1px solid var(--line2);border-radius:100px;padding:10px 16px;color:var(--hi);font-family:var(--body)}

/* product loop -> VANTA cards */
.woocommerce ul.products{display:grid !important;grid-template-columns:repeat(4,1fr);gap:18px;margin:0;padding:0;list-style:none}
.woocommerce ul.products li.product{width:auto !important;margin:0 !important;float:none !important;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:var(--shadow-sm);transition:transform .5s var(--ease),border-color .4s,box-shadow .5s var(--ease);position:relative;overflow:hidden;text-align:left}
.woocommerce ul.products li.product:hover{transform:translateY(-7px);border-color:rgba(var(--ice-rgb),.4);box-shadow:0 34px 70px -28px rgba(11,34,54,.3)}
.woocommerce ul.products li.product a img{border-radius:12px;margin:0 0 13px;background:linear-gradient(165deg,#f6faff,#eaf1f9);border:1px solid var(--line)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--body) !important;font-weight:700;font-size:16px;color:var(--hi);padding:0 0 5px;line-height:1.3}
.woocommerce ul.products li.product .price{color:var(--hi) !important;font-family:var(--mono);font-size:17px;display:block;margin-bottom:12px}
.woocommerce ul.products li.product .price del{color:var(--low);opacity:.7;font-weight:400;margin-right:6px}
.woocommerce ul.products li.product .price ins{text-decoration:none;color:var(--ice)}
.woocommerce ul.products li.product .star-rating{margin:0 0 12px;color:var(--ice)}
.woocommerce ul.products li.product .onsale{background:var(--ice);color:#fff;border-radius:100px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;min-height:auto;min-width:auto;padding:5px 12px;top:14px;right:14px;left:auto;margin:0;line-height:1.4}

/* buttons */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce .button.alt,.woocommerce #place_order{
  background:linear-gradient(180deg,var(--ice-light),var(--ice)) !important;color:#fff !important;border-radius:100px !important;font-family:var(--body);font-weight:700;font-size:14px;padding:13px 26px !important;border:none;transition:transform .4s var(--ease),box-shadow .4s var(--ease);box-shadow:0 14px 34px -12px rgba(var(--ice-rgb),.5);text-shadow:none}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce .button.alt:hover,.woocommerce #place_order:hover{transform:translateY(-2px);box-shadow:0 22px 50px -14px rgba(var(--ice-rgb),.6);background:linear-gradient(180deg,var(--ice-light),var(--ice-deep)) !important}
.woocommerce a.button.alt.disabled,.woocommerce button.button.disabled{opacity:.5}
.woocommerce .button.wc-backward,.woocommerce a.added_to_cart{background:#fff !important;color:var(--ice) !important;border:1px solid var(--line2);box-shadow:none}

/* notices */
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-radius:14px;border:1px solid var(--line2);background:#fff;color:var(--hi);box-shadow:var(--shadow-sm);padding:16px 20px 16px 50px}
.woocommerce-message{border-top:3px solid var(--ice)}
.woocommerce-info{border-top:3px solid #4d8df5}
.woocommerce-error{border-top:3px solid #e0556b}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{color:var(--ice);left:18px}

/* forms / inputs */
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce .select2-container .select2-selection,.woocommerce-page #order_review input,.woocommerce form .form-row select{
  background:#fff;border:1px solid var(--line2);border-radius:12px;padding:13px 16px;color:var(--hi);font-family:var(--body);box-shadow:none}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus{border-color:var(--ice);box-shadow:0 0 0 3px rgba(var(--ice-rgb),.12);outline:none}
.woocommerce form .form-row label{color:var(--mid);font-size:13px;font-weight:500}

/* tables (cart / order) */
.woocommerce table.shop_table{border:1px solid var(--line);border-radius:16px;border-collapse:separate;background:#fff;overflow:hidden}
.woocommerce table.shop_table th{color:var(--hi);font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:var(--elev)}
.woocommerce table.shop_table td{border-top:1px solid var(--line);color:var(--mid)}
.woocommerce .cart_totals h2,.woocommerce-checkout h3{color:var(--hi)}
.woocommerce .cart-collaterals .cart_totals,.woocommerce-checkout #order_review,.woocommerce-checkout .woocommerce-checkout-review-order{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow-sm)}
.woocommerce-checkout #payment{background:var(--elev);border-radius:16px}
.woocommerce .quantity input.qty{background:#fff;border:1px solid var(--line2);border-radius:10px;color:var(--hi);padding:8px}

/* single product */
.woocommerce div.product .product_title{font-family:var(--display);color:var(--hi)}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--hi);font-family:var(--mono);font-size:26px}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:var(--elev);border-color:var(--line);border-radius:10px 10px 0 0}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#fff}
.woocommerce span.onsale{background:var(--ice);color:#fff}
.woocommerce .woocommerce-product-gallery{border:1px solid var(--line);border-radius:18px;padding:14px;background:#fff}

/* pagination */
.woocommerce nav.woocommerce-pagination ul{border:none;gap:6px;display:flex;justify-content:center}
.woocommerce nav.woocommerce-pagination ul li{border:none}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{border:1px solid var(--line2);border-radius:10px;color:var(--hi);background:#fff}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--ice);color:#fff;border-color:var(--ice)}

/* account */
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;padding:0}
.woocommerce-account .woocommerce-MyAccount-navigation li{border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:#fff}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active{border-color:var(--ice)}
.woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:12px 16px;color:var(--mid)}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{color:var(--ice)}

/* homepage product loops inside our sections */
#carTrack ul.products{display:flex !important;grid-template-columns:none !important;flex-wrap:nowrap;gap:20px}
#carTrack ul.products li.product{flex:0 0 290px;scroll-snap-align:start}

@media(max-width:1100px){ .woocommerce ul.products{grid-template-columns:repeat(3,1fr)} }
@media(max-width:820px){ .woocommerce ul.products{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .woocommerce ul.products{grid-template-columns:1fr} }
@media(max-width:640px){ .woocommerce-page main.wrap,.woocommerce main.wrap{padding:100px 0 80px} }

/* ============================================================
   VIDEO HERO (top of homepage) — editable in Customizer
   ============================================================ */
.video-hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;background:#05070a}
.video-hero .vh-media{position:absolute;inset:0;z-index:0}
.video-hero .vh-media video,.video-hero .vh-media img{width:100%;height:100%;object-fit:cover;display:block}
.video-hero .vh-media iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:177.78vh;min-width:100%;height:56.25vw;min-height:100%;border:0;pointer-events:none}
.video-hero .vh-overlay{position:absolute;inset:0;z-index:1}
.video-hero.ov-light  .vh-overlay{background:linear-gradient(180deg,rgba(5,7,10,.22),rgba(5,7,10,.38))}
.video-hero.ov-medium .vh-overlay{background:linear-gradient(180deg,rgba(5,7,10,.45),rgba(5,7,10,.62))}
.video-hero.ov-dark   .vh-overlay{background:linear-gradient(180deg,rgba(5,7,10,.62),rgba(5,7,10,.8))}
.video-hero .vh-content{position:relative;z-index:2;text-align:center;max-width:860px;margin:0 auto;padding:0 28px;color:#fff}
.video-hero .vh-content .eyebrow{color:#B8C2CF;justify-content:center}
.video-hero .vh-content .eyebrow::before{background:linear-gradient(90deg,#B8C2CF,transparent)}
.video-hero .vh-content h1{color:#fff;font-size:clamp(40px,6vw,76px);font-weight:600;letter-spacing:-.02em;margin:18px 0 18px;text-shadow:0 2px 30px rgba(0,0,0,.3)}
.video-hero .vh-content p{color:rgba(255,255,255,.84);font-size:clamp(16px,1.6vw,19px);line-height:1.6;max-width:620px;margin:0 auto 32px}
.vh-scroll{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.7);width:44px;height:44px;border:1px solid rgba(255,255,255,.25);border-radius:50%;display:grid;place-items:center;animation:vhbounce 2.2s ease-in-out infinite;transition:.3s}
.vh-scroll:hover{color:#fff;border-color:rgba(255,255,255,.6)}
.vh-scroll svg{width:20px;height:20px}
@keyframes vhbounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}
@media(max-width:640px){
  .video-hero{min-height:78vh}
  .vh-scroll{bottom:16px}
}


/* newsletter submit states */
.nl-note.is-success{color:var(--ice)}
.nl-note.is-error{color:#d6455e}
.nl-form button[disabled]{opacity:.65;pointer-events:none}


/* uploaded logo image used as the brand mark */
.logo img.mark{width:auto;height:46px;flex:0 0 auto;object-fit:contain;display:block}

/* ============================================================
   VARIABLE PRODUCTS — dosage selector on the product page
   ============================================================ */
.woocommerce div.product form.cart .variations{margin:0 0 20px;border:none}
.woocommerce div.product form.cart .variations td{padding:6px 0;vertical-align:middle;border:none}
.woocommerce div.product form.cart .variations td.label{padding-right:16px}
.woocommerce div.product form.cart .variations td.label label{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--low);font-weight:500;margin:0}
.woocommerce div.product form.cart .variations select{min-width:210px;background:#fff;border:1px solid var(--line2);border-radius:12px;padding:12px 16px;color:var(--hi);font-family:var(--body);font-size:14.5px;cursor:pointer;transition:.25s}
.woocommerce div.product form.cart .variations select:focus{border-color:var(--ice);box-shadow:0 0 0 3px rgba(var(--ice-rgb),.12);outline:none}
.woocommerce div.product form.cart a.reset_variations{display:inline-block;margin-top:6px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ice)}
.woocommerce div.product .woocommerce-variation-price .price,.woocommerce div.product .single_variation .price{font-family:var(--mono);color:var(--hi);font-size:26px}
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:6px}
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .quantity input.qty{background:#fff;border:1px solid var(--line2);border-radius:10px;color:var(--hi);padding:10px}


/* ── Countdown Bar (top of page) ─────────────────────────────── */
.vanta-cd{
  --cd-bg:#0A0D12;
  --cd-accent:#3A4656;
  position:relative; z-index:60; overflow:hidden;
  color:#fff;
  padding:10px 18px;
  background:linear-gradient(100deg,
    var(--cd-bg) 0%,
    var(--cd-accent) 50%,
    var(--cd-bg) 100%);
  background-size:220% 100%;
  animation:vcdFlow 9s ease-in-out infinite;
  border-bottom:1px solid rgba(255,255,255,.14);
  box-shadow:0 6px 24px -14px rgba(0,0,0,.7);
}
@keyframes vcdFlow{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
/* Moving light sweep */
.vanta-cd::before{
  content:"";position:absolute;top:0;bottom:0;left:-40%;width:40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);
  transform:skewX(-18deg);animation:vcdSweep 6.5s ease-in-out infinite;pointer-events:none;z-index:2}
@keyframes vcdSweep{0%{left:-45%}55%{left:130%}100%{left:130%}}

/* Flickering white lights */
.vcd-stars{position:absolute;inset:0;pointer-events:none;z-index:1}
.vcd-stars span{position:absolute;width:2.5px;height:2.5px;background:#fff;border-radius:50%;opacity:0;
  box-shadow:0 0 7px rgba(255,255,255,.9);animation:vcdTwinkle 3s infinite}
.vcd-stars span:nth-child(1){top:22%;left:6%;animation-delay:0s;animation-duration:2.6s}
.vcd-stars span:nth-child(2){top:64%;left:11%;animation-delay:.5s;animation-duration:3.1s}
.vcd-stars span:nth-child(3){top:34%;left:22%;animation-delay:1.1s;animation-duration:2.4s}
.vcd-stars span:nth-child(4){top:74%;left:31%;animation-delay:.3s;animation-duration:3.4s}
.vcd-stars span:nth-child(5){top:18%;left:44%;animation-delay:1.6s;animation-duration:2.7s}
.vcd-stars span:nth-child(6){top:58%;left:52%;animation-delay:.8s;animation-duration:3.0s}
.vcd-stars span:nth-child(7){top:28%;left:63%;animation-delay:2.0s;animation-duration:2.5s}
.vcd-stars span:nth-child(8){top:70%;left:71%;animation-delay:1.3s;animation-duration:3.3s}
.vcd-stars span:nth-child(9){top:20%;left:82%;animation-delay:.6s;animation-duration:2.8s}
.vcd-stars span:nth-child(10){top:62%;left:90%;animation-delay:1.9s;animation-duration:3.2s}
.vcd-stars span:nth-child(11){top:44%;left:36%;animation-delay:2.4s;animation-duration:2.6s}
.vcd-stars span:nth-child(12){top:48%;left:78%;animation-delay:1.0s;animation-duration:3.5s}
@keyframes vcdTwinkle{0%,100%{opacity:0;transform:scale(.7)}50%{opacity:1;transform:scale(1.5)}}
@media (prefers-reduced-motion: reduce){
  .vanta-cd{animation:none;background-position:50% 50%}
  .vanta-cd::before{display:none}
  .vcd-stars span{animation:none;opacity:.5}
}

.vcd-inner{
  position:relative;z-index:3;max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}

.vcd-head{display:inline-flex;align-items:center;gap:7px;font-size:.6rem;font-weight:800;
  letter-spacing:.2em;text-transform:uppercase;color:#fff;opacity:.8}
.vcd-head::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;
  box-shadow:0 0 8px #fff;animation:vcdPulse 2s infinite}
@keyframes vcdPulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}

.vcd-offer{font-size:1rem;font-weight:900;letter-spacing:.01em;color:#fff;
  text-shadow:0 1px 12px rgba(0,0,0,.28)}

.vcd-use{font-size:.6rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72)}

/* Code button — glowing white pill, links to shop */
.vcd-code{display:inline-flex;align-items:center;gap:6px;text-decoration:none;
  background:#fff;color:var(--cd-bg);border-radius:30px;padding:5px 15px;
  font-size:.8rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
  box-shadow:0 0 0 0 rgba(255,255,255,.6);animation:vcdGlow 2.4s ease-in-out infinite;
  transition:transform .15s}
.vcd-code:hover{transform:translateY(-1px) scale(1.04)}
.vcd-code svg{color:var(--cd-accent)}
@keyframes vcdGlow{0%,100%{box-shadow:0 0 10px 0 rgba(255,255,255,.35)}50%{box-shadow:0 0 20px 3px rgba(255,255,255,.65)}}

/* Timer — boxed digits */
.vcd-timer{display:inline-flex;align-items:center;gap:5px}
.vcd-seg{display:inline-flex;align-items:baseline;gap:2px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
  border-radius:8px;padding:3px 8px;font-size:.62rem;font-weight:600;
  color:rgba(255,255,255,.8);letter-spacing:.02em;backdrop-filter:blur(4px)}
.vcd-seg b{color:#fff;font-weight:900;font-size:.92rem;font-variant-numeric:tabular-nums;min-width:2ch;
  display:inline-block;text-align:center;text-shadow:0 1px 6px rgba(0,0,0,.3)}
.vcd-timer.vcd-ended{background:none;border:none;padding:5px 8px;
  color:#fff;font-weight:800;font-size:.82rem;letter-spacing:.06em}

/* Extra CTA button */
.vcd-btn{display:inline-flex;align-items:center;gap:6px;text-decoration:none;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);color:#fff;
  border-radius:30px;padding:5px 15px;font-size:.76rem;font-weight:800;letter-spacing:.03em;
  transition:background .2s,transform .15s;backdrop-filter:blur(4px)}
.vcd-btn:hover{background:rgba(255,255,255,.26);transform:translateY(-1px)}
.vcd-btn svg{transition:transform .2s}
.vcd-btn:hover svg{transform:translateX(3px)}

@media (max-width:680px){
  .vcd-inner{gap:9px}
  .vcd-head{display:none}
  .vcd-offer{font-size:.9rem;flex-basis:100%;text-align:center}
  .vcd-btn{display:none}
  .vcd-seg{padding:2px 6px}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Safeguard: preformatted/code content must wrap, never force page overflow ──
   If a description is accidentally pasted as a code/preformatted block, it would
   otherwise render as one non-wrapping line and stretch the whole product layout
   past the viewport. These rules make such content wrap and stay within its box. */
pre,
code,
.wp-block-preformatted,
.wp-block-code,
.vpdp-desc pre,
.entry-content pre {
  white-space: pre-wrap;      /* wrap long lines instead of a single overflowing line */
  overflow-wrap: anywhere;    /* break unbreakable strings (long URLs, tokens) */
  word-break: break-word;
  max-width: 100%;
}
/* Keep any child of the product summary/description within its container width. */
.vpdp-desc { overflow-wrap: anywhere; }
.vpdp-desc > *,
.vpdp-desc img,
.vpdp-desc pre { max-width: 100%; }
/* ─────────────────────────────────────────────────────────────── */

/* ── Hero CTA stack (Shop + Discord) ─────────────────────────── */
.vh-ctas{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  margin-top:-10px; /* lifts the pair slightly so Discord sits in the old whitespace */
}
.vh-ctas .btn{ min-width:250px; justify-content:center; }

/* Discord button — brand blurple, matches the site's rounded pill CTAs */
.btn-discord{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  background:#5865F2;color:#fff;border:1px solid #5865F2;
  border-radius:999px;padding:15px 34px;
  font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.82rem;
  text-decoration:none;
  box-shadow:0 6px 22px -8px rgba(88,101,242,.85);
  transition:background .2s,transform .15s,box-shadow .2s;
}
.btn-discord:hover{
  background:#4752C4;border-color:#4752C4;
  transform:translateY(-2px);
  box-shadow:0 10px 28px -8px rgba(88,101,242,.95);
}
.btn-discord:active{ transform:translateY(0); }
.btn-discord svg{ flex:0 0 auto; }

@media (max-width:640px){
  .vh-ctas{ gap:10px; margin-top:-6px; }
  .vh-ctas .btn{ min-width:0; width:min(84vw,300px); }
  .btn-discord{ padding:13px 24px; font-size:.78rem; }
}
/* ─────────────────────────────────────────────────────────────── */


/* ── Post-Purchase Survey (shortcode: [vanta_survey]) ────────────── */

/* Center the page title + content on any page using the survey shortcode */
body.vanta-survey-page .entry-title,
body.vanta-survey-page .page-title,
body.vanta-survey-page h1{text-align:center}
body.vanta-survey-page .entry-content,
body.vanta-survey-page .page-content{margin-left:auto;margin-right:auto}

.vanta-survey{max-width:560px;margin:0 auto 10px;padding:6px 20px;text-align:center;box-sizing:border-box}

/* ── Card shell: animated gradient border + glow ── */
.vs-card{position:relative;overflow:hidden;border-radius:26px;padding:2px;
	background:linear-gradient(130deg,var(--ice,#4A5667),#6f9bff,var(--ice-deep,#2B3440),var(--ice,#4A5667));
	background-size:300% 300%;animation:vsBorderFlow 8s ease infinite;
	box-shadow:0 18px 50px -22px rgba(74,86,103,.75)}
@keyframes vsBorderFlow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

.vs-inner{position:relative;z-index:2;background:#fff;border-radius:24px;padding:34px 28px 30px}

/* Twinkling stars behind the card content */
.vs-stars{position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:26px;overflow:hidden}
.vs-stars span{position:absolute;width:3px;height:3px;background:#fff;border-radius:50%;opacity:0;
	box-shadow:0 0 7px rgba(255,255,255,.95);animation:vsTwinkle 3s infinite}
.vs-stars span:nth-child(1){top:8%;left:7%;animation-delay:0s;animation-duration:2.7s}
.vs-stars span:nth-child(2){top:16%;left:88%;animation-delay:.5s;animation-duration:3.2s}
.vs-stars span:nth-child(3){top:52%;left:3%;animation-delay:1.1s;animation-duration:2.5s}
.vs-stars span:nth-child(4){top:76%;left:94%;animation-delay:.3s;animation-duration:3.4s}
.vs-stars span:nth-child(5){top:92%;left:12%;animation-delay:1.6s;animation-duration:2.8s}
.vs-stars span:nth-child(6){top:5%;left:46%;animation-delay:.9s;animation-duration:3.0s}
.vs-stars span:nth-child(7){top:95%;left:60%;animation-delay:2.0s;animation-duration:2.6s}
.vs-stars span:nth-child(8){top:36%;left:97%;animation-delay:1.3s;animation-duration:3.3s}
.vs-stars span:nth-child(9){top:64%;left:1%;animation-delay:.7s;animation-duration:2.9s}
.vs-stars span:nth-child(10){top:24%;left:29%;animation-delay:2.3s;animation-duration:3.1s}
@keyframes vsTwinkle{0%,100%{opacity:0;transform:scale(.7)}50%{opacity:1;transform:scale(1.5)}}

/* ── Offer banner (full-width, top of card) ── */
.vs-banner{position:relative;overflow:hidden;
	margin:-34px -28px 20px;padding:13px 18px;
	border-radius:24px 24px 0 0;
	background:linear-gradient(100deg,var(--ice-deep,#2B3440),var(--ice,#4A5667) 48%,#4f8bff 62%,var(--ice-deep,#2B3440));
	background-size:220% 100%;animation:vsBtnFlow 7s ease infinite;
	color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;
	box-shadow:0 8px 22px -14px rgba(74,86,103,.95)}
.vs-banner svg{flex:0 0 auto;opacity:.95;animation:vsGiftBob 2.8s ease-in-out infinite}
@keyframes vsGiftBob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(-6deg)}}
.vs-banner-text{font-size:.88rem;font-weight:900;letter-spacing:.07em;line-height:1.2;
	text-shadow:0 1px 8px rgba(0,0,0,.22)}
.vs-banner-text em{font-style:normal;opacity:.75;margin:0 2px;font-weight:800}
.vs-banner-shine{position:absolute;top:0;bottom:0;left:-45%;width:40%;
	background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
	transform:skewX(-18deg);animation:vsShine 4.2s ease-in-out infinite;pointer-events:none}

/* ── Locked pill ── */
.vs-lock{display:inline-flex;align-items:center;gap:7px;margin-bottom:14px;
	padding:6px 14px;border-radius:999px;background:var(--elev,#f3f7fc);
	border:1px solid var(--line,#e4ecf4);color:var(--mid,#6b7f95);
	font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.vs-lock svg{animation:vsLockWiggle 3.4s ease-in-out infinite;transform-origin:center}
@keyframes vsLockWiggle{0%,88%,100%{transform:rotate(0)}91%{transform:rotate(-9deg)}95%{transform:rotate(9deg)}}

.vs-card h2{margin:0 0 8px;font-size:1.45rem;font-weight:900;color:var(--hi,#0B2236);line-height:1.22}
.vs-sub{margin:0 0 22px;color:var(--mid,#6b7f95);font-size:.93rem}

/* ── Options ── */
.vs-options{display:flex;flex-direction:column;gap:10px;margin-bottom:22px;text-align:left}
.vs-opt{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;
	border:1.5px solid var(--line,#e4ecf4);border-radius:14px;background:#fff;
	cursor:pointer;overflow:hidden;
	transition:border-color .2s,background .2s,box-shadow .2s,transform .18s}
.vs-opt:hover{border-color:#9dbcf5;transform:translateX(3px)}
.vs-opt input{position:absolute;opacity:0;pointer-events:none}
.vs-opt-dot{flex:0 0 auto;width:19px;height:19px;border-radius:50%;
	border:2px solid var(--line2,#d6e0ea);background:#fff;position:relative;transition:border-color .2s}
.vs-opt-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;
	background:var(--ice,#4A5667);transform:scale(0);transition:transform .22s cubic-bezier(.34,1.56,.64,1)}
.vs-opt-label{font-weight:700;color:var(--hi,#0B2236);font-size:.95rem}
.vs-opt:has(input:checked){border-color:var(--ice,#4A5667);background:#f2f7ff;
	box-shadow:0 6px 18px -10px rgba(74,86,103,.85)}
.vs-opt:has(input:checked) .vs-opt-dot{border-color:var(--ice,#4A5667)}
.vs-opt:has(input:checked) .vs-opt-dot::after{transform:scale(1)}

/* ── Submit button (shimmering) ── */
.vs-submit{position:relative;overflow:hidden;width:100%;
	display:inline-flex;align-items:center;justify-content:center;gap:9px;
	background:linear-gradient(100deg,var(--ice-deep,#2B3440),var(--ice,#4A5667),var(--ice-deep,#2B3440));
	background-size:200% 100%;animation:vsBtnFlow 5s ease infinite;
	color:#fff;border:none;border-radius:999px;padding:16px 26px;cursor:pointer;
	font-size:.92rem;font-weight:800;letter-spacing:.05em;
	box-shadow:0 12px 30px -12px rgba(74,86,103,.95);
	transition:transform .16s,box-shadow .2s,opacity .2s}
@keyframes vsBtnFlow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.vs-submit::after{content:"";position:absolute;top:0;bottom:0;left:-45%;width:38%;
	background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);
	transform:skewX(-18deg);animation:vsShine 3.6s ease-in-out infinite}
@keyframes vsShine{0%{left:-45%}55%{left:130%}100%{left:130%}}
.vs-submit:hover{transform:translateY(-2px);box-shadow:0 16px 36px -12px rgba(74,86,103,1)}
.vs-submit:active{transform:translateY(0)}
.vs-submit[disabled]{opacity:.72;cursor:default;transform:none}
.vs-submit.is-loading::after{animation-duration:1.1s}

.vs-err{margin:14px 0 0;color:#d64545;font-size:.85rem;font-weight:700}

/* Shake when submitting with nothing selected */
.vs-shake{animation:vsShake .42s cubic-bezier(.36,.07,.19,.97)}
@keyframes vsShake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}
	30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}

/* Form exit */
.vs-card.is-opening{animation:vsOpenOut .42s ease forwards}
@keyframes vsOpenOut{to{opacity:0;transform:scale(.94) translateY(-8px)}}

/* ── Reveal panel ── */
.vs-reveal{opacity:0;transform:scale(.9)}
.vs-reveal.is-in{animation:vsPop .55s cubic-bezier(.34,1.56,.64,1) forwards}
@keyframes vsPop{to{opacity:1;transform:scale(1)}}
.vs-reveal .vs-inner{background:linear-gradient(170deg,#fff 0%,#f4f8ff 100%)}

/* Radiating rays behind the unlock icon */
.vs-rays{position:absolute;top:-40px;left:50%;width:340px;height:340px;
	transform:translateX(-50%);z-index:1;pointer-events:none;opacity:.5;
	background:conic-gradient(from 0deg,transparent 0deg,rgba(74,86,103,.16) 12deg,transparent 24deg,
		transparent 36deg,rgba(74,86,103,.16) 48deg,transparent 60deg,
		transparent 72deg,rgba(74,86,103,.16) 84deg,transparent 96deg,
		transparent 108deg,rgba(74,86,103,.16) 120deg,transparent 132deg,
		transparent 144deg,rgba(74,86,103,.16) 156deg,transparent 168deg,
		transparent 180deg,rgba(74,86,103,.16) 192deg,transparent 204deg,
		transparent 216deg,rgba(74,86,103,.16) 228deg,transparent 240deg,
		transparent 252deg,rgba(74,86,103,.16) 264deg,transparent 276deg,
		transparent 288deg,rgba(74,86,103,.16) 300deg,transparent 312deg,
		transparent 324deg,rgba(74,86,103,.16) 336deg,transparent 348deg);
	animation:vsSpin 22s linear infinite}
@keyframes vsSpin{to{transform:translateX(-50%) rotate(360deg)}}

.vs-unlocked{width:64px;height:64px;margin:0 auto 12px;border-radius:50%;
	background:linear-gradient(140deg,var(--ice,#4A5667),var(--ice-deep,#2B3440));color:#fff;
	display:flex;align-items:center;justify-content:center;
	box-shadow:0 12px 30px -10px rgba(74,86,103,.9),0 0 0 8px rgba(74,86,103,.1);
	animation:vsUnlockPop .6s cubic-bezier(.34,1.56,.64,1) .1s both}
@keyframes vsUnlockPop{from{transform:scale(0) rotate(-25deg)}to{transform:scale(1) rotate(0)}}

.vs-unlocked-tag{display:inline-block;margin-bottom:8px;
	font-size:.66rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:var(--ice,#4A5667)}

.vs-big{font-size:2.5rem!important;letter-spacing:-.02em;margin:0 0 6px!important;
	background:linear-gradient(120deg,var(--ice,#4A5667),#5b8dff,var(--ice-deep,#2B3440));
	background-size:200% auto;-webkit-background-clip:text;background-clip:text;
	-webkit-text-fill-color:transparent;animation:vsBtnFlow 4s ease infinite}

/* "+ FREE Research Water" line under the big 25% */
.vs-plus{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 14px}
.vs-plus::before,.vs-plus::after{content:"";height:1px;flex:1;max-width:46px;
	background:linear-gradient(90deg,transparent,var(--line2,#d6e0ea),transparent)}
.vs-plus span{font-size:.86rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase;
	color:var(--hi,#0B2236);white-space:nowrap}

/* Code chip */
.vs-code{position:relative;display:inline-flex;align-items:center;gap:10px;margin:8px 0 4px;
	background:var(--hi,#0B2236);color:#fff;border:2px dashed rgba(255,255,255,.34);
	border-radius:14px;padding:14px 26px;cursor:pointer;
	font-size:1.15rem;font-weight:900;letter-spacing:.14em;
	box-shadow:0 12px 30px -12px rgba(11,34,54,.9);transition:transform .16s,background .2s}
.vs-code:hover{background:var(--ice-deep,#2B3440);transform:translateY(-2px)}
.vs-code em{display:none;font-style:normal;position:absolute;top:-32px;left:50%;transform:translateX(-50%);
	background:var(--ice,#4A5667);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.04em;
	padding:5px 12px;border-radius:9px;white-space:nowrap;box-shadow:0 6px 16px -6px rgba(74,86,103,.9)}
.vs-code.is-copied em{display:block;animation:vsPop .3s ease}

.vs-shop{display:inline-flex;align-items:center;gap:7px;margin:16px 0 0;
	color:var(--ice,#4A5667);font-weight:800;font-size:.92rem;text-decoration:none;
	transition:gap .18s}
.vs-shop:hover{gap:11px}
.vs-note{margin:12px 0 0;font-size:.78rem;color:var(--mid,#6b7f95)}

@media (max-width:480px){
	.vanta-survey{padding:6px 16px}
	.vs-inner{padding:30px 20px 26px;border-radius:20px}
	.vs-card{border-radius:22px}
	.vs-card h2{font-size:1.22rem}
	.vs-big{font-size:2.1rem!important}
	.vs-banner{margin:-30px -20px 18px;padding:12px 14px;gap:7px;border-radius:20px 20px 0 0}
	.vs-banner-text{font-size:.76rem;letter-spacing:.05em}
	.vs-plus span{font-size:.78rem}
	.vs-code{font-size:1rem;padding:13px 20px;letter-spacing:.1em}
}
@media (prefers-reduced-motion: reduce){
	.vs-card,.vs-submit,.vs-banner,.vs-banner svg,.vs-rays,.vs-big,.vs-stars span,.vs-lock svg{animation:none!important}
	.vs-submit::after,.vs-banner-shine{display:none}
	.vs-reveal{opacity:1;transform:none}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Promo Popup ─────────────────────────────────────────────── */
.vpromo{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px}
.vpromo[hidden]{display:none}
.vpromo-veil{position:absolute;inset:0;background:rgba(11,34,54,.62);backdrop-filter:blur(3px);
	opacity:0;transition:opacity .26s}
.vpromo.is-open .vpromo-veil{opacity:1}

.vpromo-box{position:relative;z-index:2;width:100%;max-width:440px;
	border-radius:26px;padding:2px;overflow:hidden;
	background:linear-gradient(130deg,var(--ice,#4A5667),#6f9bff,var(--ice-deep,#2B3440),var(--ice,#4A5667));
	background-size:300% 300%;animation:vsBorderFlow 8s ease infinite;
	box-shadow:0 30px 70px -20px rgba(11,34,54,.7);
	opacity:0;transform:translateY(18px) scale(.96);transition:opacity .3s,transform .34s cubic-bezier(.34,1.4,.64,1)}
.vpromo.is-open .vpromo-box{opacity:1;transform:translateY(0) scale(1)}

.vpromo-in{position:relative;z-index:2;background:#fff;border-radius:24px;padding:36px 30px 26px;text-align:center}

.vpromo-stars{position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:26px;overflow:hidden}
.vpromo-stars span{position:absolute;width:3px;height:3px;background:#fff;border-radius:50%;opacity:0;
	box-shadow:0 0 7px rgba(255,255,255,.95);animation:vsTwinkle 3s infinite}
.vpromo-stars span:nth-child(1){top:6%;left:9%;animation-delay:0s}
.vpromo-stars span:nth-child(2){top:14%;left:90%;animation-delay:.6s}
.vpromo-stars span:nth-child(3){top:88%;left:6%;animation-delay:1.2s}
.vpromo-stars span:nth-child(4){top:94%;left:86%;animation-delay:.4s}
.vpromo-stars span:nth-child(5){top:46%;left:2%;animation-delay:1.8s}
.vpromo-stars span:nth-child(6){top:58%;left:97%;animation-delay:.9s}
.vpromo-stars span:nth-child(7){top:3%;left:52%;animation-delay:2.2s}
.vpromo-stars span:nth-child(8){top:97%;left:44%;animation-delay:1.5s}

.vpromo-x{position:absolute;top:12px;right:12px;z-index:5;width:32px;height:32px;border-radius:50%;
	border:none;background:rgba(255,255,255,.9);color:var(--hi,#0B2236);cursor:pointer;
	display:flex;align-items:center;justify-content:center;
	box-shadow:0 3px 10px -3px rgba(11,34,54,.4);transition:background .18s,transform .18s}
.vpromo-x:hover{background:#fff;transform:rotate(90deg)}

.vpromo-eyebrow{display:inline-block;margin-bottom:10px;padding:5px 14px;border-radius:999px;
	background:var(--elev,#f3f7fc);border:1px solid var(--line,#e4ecf4);
	font-size:.64rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--ice,#4A5667)}
.vpromo-box h2{margin:0 0 10px;font-size:1.6rem;line-height:1.2;font-weight:900;letter-spacing:-.01em;
	background:linear-gradient(120deg,var(--ice,#4A5667),#5b8dff,var(--ice-deep,#2B3440));
	background-size:200% auto;-webkit-background-clip:text;background-clip:text;
	-webkit-text-fill-color:transparent;animation:vsBtnFlow 5s ease infinite}
.vpromo-sub{margin:0 0 20px;font-size:.92rem;line-height:1.55;color:var(--mid,#6b7f95)}

.vpromo-code{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 20px}
.vpromo-code-lbl{font-size:.64rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--mid,#6b7f95)}
.vpromo-code-btn{position:relative;background:var(--hi,#0B2236);color:#fff;border:2px dashed rgba(255,255,255,.34);
	border-radius:12px;padding:11px 22px;cursor:pointer;
	font-size:1rem;font-weight:900;letter-spacing:.13em;
	box-shadow:0 10px 26px -12px rgba(11,34,54,.9);transition:background .2s,transform .16s}
.vpromo-code-btn:hover{background:var(--ice-deep,#2B3440);transform:translateY(-2px)}
.vpromo-code-btn em{display:none;font-style:normal;position:absolute;top:-30px;left:50%;transform:translateX(-50%);
	background:var(--ice,#4A5667);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.03em;
	padding:4px 11px;border-radius:8px;white-space:nowrap}
.vpromo-code-btn.is-copied em{display:block}

.vpromo-cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px;
	background:linear-gradient(100deg,var(--ice-deep,#2B3440),var(--ice,#4A5667),var(--ice-deep,#2B3440));
	background-size:200% 100%;animation:vsBtnFlow 5s ease infinite;
	color:#fff;border-radius:999px;padding:15px 26px;text-decoration:none;
	font-size:.9rem;font-weight:800;letter-spacing:.04em;
	box-shadow:0 12px 30px -12px rgba(74,86,103,.95);transition:transform .16s}
.vpromo-cta::after{content:"";position:absolute;top:0;bottom:0;left:-45%;width:38%;
	background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);
	transform:skewX(-18deg);animation:vsShine 3.8s ease-in-out infinite}
.vpromo-cta:hover{transform:translateY(-2px)}

.vpromo-no{display:block;width:100%;margin:12px 0 0;background:none;border:none;cursor:pointer;
	font-size:.8rem;font-weight:700;color:var(--mid,#6b7f95);text-decoration:underline;padding:6px}
.vpromo-no:hover{color:var(--hi,#0B2236)}
.vpromo-fine{margin:14px 0 0;font-size:.7rem;line-height:1.5;color:var(--mid,#6b7f95);opacity:.85}

@media (max-width:480px){
	.vpromo{padding:16px}
	.vpromo-in{padding:32px 22px 22px;border-radius:20px}
	.vpromo-box{border-radius:22px}
	.vpromo-box h2{font-size:1.35rem}
	.vpromo-sub{font-size:.86rem}
}
@media (prefers-reduced-motion: reduce){
	.vpromo-box,.vpromo-cta,.vpromo-box h2,.vpromo-stars span{animation:none!important}
	.vpromo-cta::after{display:none}
	.vpromo-box{transition:opacity .2s}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Free Gift Picker ([vanta_free_gift]) ────────────────────── */
.vgift{margin:18px 0;padding:20px 22px;border-radius:18px;
	background:linear-gradient(150deg,#f2f7ff,#eaf1fe);
	border:1.5px solid #cfe0fb;box-shadow:0 10px 28px -18px rgba(74,86,103,.7)}
.vgift-ico{font-size:1.15rem;line-height:1}
.vgift-head{display:flex;align-items:center;gap:9px;margin-bottom:6px}
.vgift-head strong{font-size:1.02rem;font-weight:900;color:var(--hi,#0B2236)}
.vgift-sub{margin:0 0 16px;font-size:.86rem;line-height:1.5;color:var(--mid,#6b7f95)}

.vgift-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.vgift-lbl{flex:0 0 auto;min-width:112px;font-size:.78rem;font-weight:800;
	letter-spacing:.05em;text-transform:uppercase;color:var(--ice,#4A5667)}
.vgift-select{flex:1 1 200px;padding:11px 14px;border-radius:11px;
	border:1.5px solid #cfe0fb;background:#fff;color:var(--hi,#0B2236);
	font-size:.92rem;font-weight:600;cursor:pointer;
	transition:border-color .18s,box-shadow .18s}
.vgift-select:focus{outline:none;border-color:var(--ice,#4A5667);
	box-shadow:0 0 0 3px rgba(74,86,103,.16)}

.vgift-status{margin:10px 0 0;font-size:.8rem;font-weight:700;color:var(--ice,#4A5667);min-height:1.2em}
.vgift-fine{margin:10px 0 0;font-size:.72rem;line-height:1.5;color:var(--mid,#6b7f95);opacity:.9}

/* Progress state (not yet earned) */
.vgift-progress{display:flex;align-items:center;gap:9px;
	font-size:.88rem;font-weight:700;color:var(--hi,#0B2236);
	background:var(--elev,#f3f7fc);border-color:var(--line,#e4ecf4);box-shadow:none}

@media (max-width:520px){
	.vgift{padding:18px 16px;border-radius:15px}
	.vgift-lbl{min-width:0;flex:1 1 100%}
	.vgift-select{flex:1 1 100%}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Free Gift: upsell nudge + placement under the shipping bar ── */
.vgift-mount{margin:0}
.vgift-mount .vgift{margin-top:14px}

.vgift-upsell{display:flex;align-items:center;gap:9px;margin:14px 0 0;
	padding:11px 14px;border-radius:12px;
	background:#fff;border:1.5px dashed #cfe0fb;
	font-size:.86rem;font-weight:700;line-height:1.4;color:var(--hi,#0B2236)}
.vgift-up-ico{font-size:1rem;line-height:1;flex:0 0 auto}

/* "One away" gets urgency: solid accent border + soft pulse */
.vgift-upsell.is-close{
	border-style:solid;border-color:var(--ice,#4A5667);
	background:linear-gradient(100deg,#F3F5F8,#ffffff);
	box-shadow:0 0 0 0 rgba(74,86,103,.5);
	animation:vgiftPulse 2.4s ease-in-out infinite}
@keyframes vgiftPulse{
	0%,100%{box-shadow:0 0 0 0 rgba(74,86,103,.34)}
	50%{box-shadow:0 0 0 7px rgba(74,86,103,0)}}

/* Progress state also sits nicely under the shipping bar */
.vgift-progress{margin-top:14px}

@media (prefers-reduced-motion: reduce){
	.vgift-upsell.is-close{animation:none}
}
@media (max-width:520px){
	.vgift-upsell{font-size:.8rem;padding:10px 12px}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Free Research Water notice (THANKYOU25) ───────────── */
.vgift-bacwater{
	background:linear-gradient(150deg,#eefaf4,#e6f6ef);
	border-color:#bfe6d4;
	box-shadow:0 10px 28px -18px rgba(26,127,55,.55)}
.vgift-bacwater .vgift-head strong{color:#12603a}
.vgift-bacwater .vgift-sub{color:#3f6b57}
.vgift-bacwater .vgift-fine{color:#4a7a63}
/* ─────────────────────────────────────────────────────────────── */

/* ── Subscribe & Save discount explainer ─────────────────────── */
.vgift-subnote{display:flex;align-items:flex-start;gap:8px;
	margin:10px 0 0;padding:11px 14px;border-radius:11px;
	background:var(--elev,#f3f7fc);border:1px solid var(--line,#e4ecf4);
	font-size:.78rem;line-height:1.5;color:var(--mid,#6b7f95)}
.vgift-subnote-ico{flex:0 0 auto;font-size:.9rem;line-height:1.35;color:var(--ice,#4A5667);font-weight:900}
@media (max-width:520px){.vgift-subnote{font-size:.74rem;padding:10px 12px}}
/* ─────────────────────────────────────────────────────────────── */

/* ── Cash App / Zelle payment method ─────────────────────────── */
.vp2p-fields{margin-top:8px;padding:14px 16px;border-radius:12px;
	background:var(--elev,#f3f7fc);border:1px solid var(--line,#e4ecf4)}
.vp2p-row{margin-bottom:6px;font-size:.9rem;color:var(--hi,#0B2236)}
.vp2p-row code{background:#fff;border:1px solid var(--line,#e4ecf4);border-radius:6px;
	padding:2px 8px;font-weight:700;color:var(--ice,#4A5667)}
.vp2p-instr{margin:10px 0 0;font-size:.82rem;color:var(--mid,#6b7f95)}
.vp2p-note{margin:8px 0 0;font-size:.76rem;color:var(--mid,#6b7f95);font-style:italic}

.vp2p-thankyou{margin:20px 0;padding:22px 24px;border-radius:16px;
	background:linear-gradient(150deg,#fff7e6,#fef3d9);border:1.5px solid #f0d999}
.vp2p-thankyou h3{margin:0 0 8px;font-size:1.1rem;font-weight:900;color:var(--hi,#0B2236)}
.vp2p-thankyou p{margin:0 0 10px;font-size:.9rem;color:#6b5a2e}
.vp2p-ref{background:#fff;border-radius:10px;padding:12px 16px;margin:12px 0!important;
	border:1.5px dashed #d9a441}
.vp2p-ref span{display:block;font-size:.72rem;font-weight:700;letter-spacing:.04em;
	text-transform:uppercase;color:#8a7238;margin-bottom:4px}
.vp2p-ref strong{font-size:1.15rem;letter-spacing:.08em;color:var(--hi,#0B2236)}
.vp2p-status{font-size:.82rem!important;color:#8a7238!important}
/* ─────────────────────────────────────────────────────────────── */

/* ── Checkout Login / Sign-up page ───────────────────────────── */
.vlogin{max-width:460px;margin:0 auto;padding:0 0 40px}
.vlogin-pane{display:none}
.vlogin[data-mode="login"] .vlogin-pane[data-pane="login"],
.vlogin[data-mode="register"] .vlogin-pane[data-pane="register"]{display:block}

.vlogin-title{margin:0 0 26px;font-size:2.5rem;font-weight:800;letter-spacing:-.02em;
	color:#111;line-height:1.1}
.vlogin-sub{margin:-16px 0 24px;font-size:.92rem;color:var(--mid,#6b7f95);line-height:1.5}

.vlogin-error{margin:0 0 18px;padding:12px 15px;border-radius:10px;
	background:#fdecec;border:1px solid #f5c2c2;color:#b32d2e;
	font-size:.88rem;font-weight:600;line-height:1.45}

.vlogin-label{display:block;margin:0 0 8px;font-size:1rem;font-weight:500;color:#333}
.vlogin-input{width:100%;box-sizing:border-box;
	padding:17px 18px;margin:0 0 22px;
	border:1px solid #e2e6ea;border-radius:12px;background:#fff;
	font-size:1rem;color:#111;
	transition:border-color .18s,box-shadow .18s}
.vlogin-input::placeholder{color:#9aa4ae}
.vlogin-input:focus{outline:none;border-color:var(--ice,#4A5667);
	box-shadow:0 0 0 3px rgba(74,86,103,.13)}

.vlogin-pwrap{position:relative}
.vlogin-pwrap .vlogin-input{padding-right:52px}
.vlogin-eye{position:absolute;top:17px;right:14px;
	background:none;border:none;padding:0;cursor:pointer;color:#8a949e;
	display:flex;align-items:center;justify-content:center;transition:color .18s}
.vlogin-eye:hover,.vlogin-eye.is-on{color:var(--ice,#4A5667)}

.vlogin-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 26px}
.vlogin-check{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.vlogin-check input{position:absolute;opacity:0;pointer-events:none}
.vlogin-box{width:24px;height:24px;border-radius:7px;border:2px solid #d6dde4;background:#fff;
	display:flex;align-items:center;justify-content:center;color:#fff;flex:0 0 auto;
	transition:background .18s,border-color .18s}
.vlogin-box svg{opacity:0;transition:opacity .15s}
.vlogin-check input:checked + .vlogin-box{background:var(--ice,#4A5667);border-color:var(--ice,#4A5667)}
.vlogin-check input:checked + .vlogin-box svg{opacity:1}
.vlogin-check-lbl{font-size:1rem;color:#333}
.vlogin-forgot{font-size:1rem;color:var(--ice,#4A5667);text-decoration:none;font-weight:500;white-space:nowrap}
.vlogin-forgot:hover{text-decoration:underline}

.vlogin-btn{width:100%;padding:19px 24px;border:none;border-radius:999px;cursor:pointer;
	background:linear-gradient(180deg,#4A5667,#2B3440);color:#fff;
	font-size:1.1rem;font-weight:700;letter-spacing:.01em;
	box-shadow:0 10px 26px -12px rgba(43,52,64,.9);
	transition:transform .15s,box-shadow .2s,filter .2s}
.vlogin-btn:hover{transform:translateY(-1px);filter:brightness(1.06)}
.vlogin-btn:active{transform:translateY(0)}

.vlogin-or{display:flex;align-items:center;gap:16px;margin:30px 0}
.vlogin-or::before,.vlogin-or::after{content:"";flex:1;height:1px;background:#e2e6ea}
.vlogin-or span{font-size:1rem;color:#8a949e}

.vlogin-social{display:flex;flex-direction:column;gap:14px}
.vlogin-social a,.vlogin-social .nsl-button{width:100%!important;border-radius:999px!important}

.vlogin-alt{margin:34px 0 0;font-size:1rem;color:#333;text-align:left}
.vlogin-alt a{color:var(--ice,#4A5667);font-weight:600;text-decoration:none}
.vlogin-alt a:hover{text-decoration:underline}

@media (max-width:480px){
	.vlogin{padding:30px 20px 48px}
	.vlogin-title{font-size:2.1rem;margin-bottom:22px}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Slide-out Cart Drawer ───────────────────────────────────── */
body.vcd-lock{overflow:hidden}
.vcart-drawer{position:fixed;inset:0;z-index:100000;visibility:hidden;pointer-events:none}
.vcart-drawer.is-open{visibility:visible;pointer-events:auto}
.vcd-veil{position:absolute;inset:0;background:rgba(11,34,54,.45);opacity:0;transition:opacity .3s}
.vcart-drawer.is-open .vcd-veil{opacity:1}

.vcd-panel{position:absolute;top:0;right:0;bottom:0;width:min(430px,100%);
	background:#fff;display:flex;flex-direction:column;
	transform:translateX(100%);transition:transform .34s cubic-bezier(.32,.72,0,1);
	box-shadow:-8px 0 40px -12px rgba(11,34,54,.4)}
.vcart-drawer.is-open .vcd-panel{transform:translateX(0)}

/* Scoped to .vcd-panel: the countdown bar's heading uses the same class name,
   and this rule was overriding it because it appears later in the file. */
.vcd-panel .vcd-head{display:flex;align-items:center;justify-content:space-between;
	padding:20px 22px;border-bottom:1px solid #eceff3;flex:0 0 auto}
.vcd-panel .vcd-head h2{margin:0;font-size:1.5rem;font-weight:800;color:#111;letter-spacing:-.01em}
.vcd-close{background:none;border:none;padding:4px;cursor:pointer;color:#111;
	display:flex;transition:transform .18s,opacity .18s}
.vcd-close:hover{transform:rotate(90deg);opacity:.6}

.vcd-body{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
.vcd-scroll{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.vcd-foot{flex:0 0 auto;border-top:1px solid #eceff3;padding:16px 20px 20px;background:#fff}

/* Loading dots */
.vcd-loading{display:flex;align-items:center;justify-content:center;gap:7px;padding:60px 0}
.vcd-loading span{width:9px;height:9px;border-radius:50%;background:var(--ice,#4A5667);opacity:.35;
	animation:vcdBounce 1.1s infinite}
.vcd-loading span:nth-child(2){animation-delay:.15s}
.vcd-loading span:nth-child(3){animation-delay:.3s}
@keyframes vcdBounce{0%,80%,100%{transform:scale(.7);opacity:.3}40%{transform:scale(1);opacity:1}}

/* Free shipping progress */
.vcd-ship{padding:16px 20px;border-bottom:1px solid #eceff3}
.vcd-ship-txt{display:flex;align-items:center;gap:9px;font-size:.95rem;color:#333;margin-bottom:10px}
.vcd-ship-txt svg{color:var(--ice,#4A5667);flex:0 0 auto}
.vcd-ship-txt strong{color:var(--ice,#4A5667);font-weight:700}
.vcd-ship-txt .is-done strong{color:#1a7f37}
.vcd-ship-txt .amount{color:inherit}
.vcd-ship-track{height:9px;border-radius:99px;background:#e8edf3;overflow:hidden}
.vcd-ship-track span{display:block;height:100%;border-radius:99px;
	background:linear-gradient(90deg,var(--ice-deep,#2B3440),var(--ice,#4A5667));
	transition:width .4s ease}

/* Items */
.vcd-items{padding:16px 20px;display:flex;flex-direction:column;gap:14px}
.vcd-item{display:flex;gap:14px;padding:14px;border:1px solid #eceff3;border-radius:16px;background:#fff}
.vcd-item-img{flex:0 0 74px;width:74px;height:74px;border-radius:12px;overflow:hidden;background:#f5f8fc}
.vcd-item-img img{width:100%;height:100%;object-fit:contain;display:block}
.vcd-item-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.vcd-item-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.vcd-item-name{font-size:1.02rem;font-weight:800;color:#111;line-height:1.25}
.vcd-remove{background:none;border:none;padding:0;cursor:pointer;color:#9aa4ae;flex:0 0 auto;
	display:flex;transition:color .18s}
.vcd-remove:hover{color:#b32d2e}
.vcd-badge{align-self:flex-start;margin-top:6px;padding:3px 10px;border-radius:7px;
	background:#eaf1fe;color:var(--ice-deep,#2B3440);font-size:.78rem;font-weight:700}
.vcd-item-bot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px}
.vcd-qty{display:inline-flex;align-items:center;gap:4px;border:1px solid #e2e6ea;border-radius:99px;padding:3px}
.vcd-q{width:30px;height:30px;border:none;background:none;cursor:pointer;border-radius:50%;
	font-size:1.1rem;font-weight:700;color:#333;line-height:1;
	display:flex;align-items:center;justify-content:center;transition:background .18s}
.vcd-q:hover{background:#f0f4f9}
.vcd-q[disabled]{opacity:.32;cursor:not-allowed}
.vcd-q[disabled]:hover{background:none}
.vcd-qn{min-width:22px;text-align:center;font-weight:700;font-size:.95rem;color:#111}
.vcd-max{font-size:.74rem;font-weight:600;color:#9aa4ae;white-space:nowrap}
.vcd-item-price{text-align:right;white-space:nowrap}
.vcd-was{color:#9aa4ae;text-decoration:line-through;font-size:.88rem}
.vcd-now{font-weight:800;font-size:1.05rem;color:#111}

/* Empty */
.vcd-empty{padding:70px 24px;text-align:center;color:#9aa4ae}
.vcd-empty svg{color:#c8d2dc;margin-bottom:14px}
.vcd-empty p{margin:0 0 16px;font-size:1rem}
.vcd-shop-link{display:inline-block;padding:12px 26px;border-radius:99px;
	background:var(--ice,#4A5667);color:#fff;text-decoration:none;font-weight:700;font-size:.92rem}

/* Recommended add-on */
.vcd-rec{display:flex;gap:13px;align-items:center;padding:13px;margin-bottom:14px;
	border-radius:14px;background:#f5f8fc;border:1px solid #e6edf5}
.vcd-rec-img{flex:0 0 58px;width:58px;height:58px;border-radius:10px;overflow:hidden;background:#fff}
.vcd-rec-img img{width:100%;height:100%;object-fit:contain;display:block}
.vcd-rec-main{flex:1 1 auto;min-width:0}
.vcd-rec-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.vcd-rec-name{font-size:.98rem;font-weight:800;color:#111}
.vcd-rec-tag{flex:0 0 auto;padding:4px 11px;border-radius:99px;background:#e4ecf8;
	color:#4a5b6d;font-size:.72rem;font-weight:700}
.vcd-rec-bot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.vcd-rec-price{font-weight:800;color:#111;font-size:1rem}
.vcd-rec-price del{color:#9aa4ae;font-weight:500;font-size:.85rem}
.vcd-rec-add{display:inline-flex;align-items:center;gap:6px;padding:9px 20px;border-radius:99px;
	background:#111;color:#fff;border:none;cursor:pointer;font-size:.92rem;font-weight:700;
	transition:background .18s,transform .15s}
.vcd-rec-add:hover{background:#2a2a2a;transform:translateY(-1px)}
.vcd-rec-add span{font-size:1.05rem;line-height:1}

/* Promo */
.vcd-promo{display:flex;gap:0;margin-bottom:4px}
.vcd-promo-in{flex:1 1 auto;min-width:0;padding:14px 16px;border:1px solid #e2e6ea;
	border-radius:12px 0 0 12px;border-right:none;font-size:.98rem;color:#111;background:#fff}
.vcd-promo-in::placeholder{color:#9aa4ae}
.vcd-promo-in:focus{outline:none;border-color:var(--ice,#4A5667)}
.vcd-promo-btn{flex:0 0 auto;padding:14px 26px;border:none;border-radius:0 12px 12px 0;cursor:pointer;
	background:var(--ice-deep,#2B3440);color:#fff;font-size:.98rem;font-weight:700;transition:filter .18s}
.vcd-promo-btn:hover{filter:brightness(1.1)}
.vcd-promo-msg{margin:8px 0 0;font-size:.84rem;font-weight:600;min-height:1em}
.vcd-promo-msg.is-ok{color:#1a7f37}
.vcd-promo-msg.is-err{color:#b32d2e}

.vcd-coupons{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 0}
.vcd-coupon{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:99px;
	background:#eaf1fe;color:var(--ice-deep,#2B3440);font-size:.8rem;font-weight:800;letter-spacing:.04em}
.vcd-coupon-x{background:none;border:none;padding:0;cursor:pointer;color:inherit;font-size:1.05rem;line-height:1;opacity:.6}
.vcd-coupon-x:hover{opacity:1}

/* Totals */
.vcd-totals{margin:16px 0 0;padding-top:14px;border-top:1px solid #eceff3}
.vcd-trow{display:flex;align-items:center;justify-content:space-between;gap:12px;
	padding:5px 0;font-size:1rem;color:#333}
.vcd-trow.is-save{color:var(--ice,#4A5667);font-weight:600}
.vcd-trow.is-total{margin-top:8px;padding-top:12px;border-top:1px solid #eceff3;
	font-size:1.2rem;font-weight:800;color:#111}

.vcd-checkout{display:flex;align-items:center;justify-content:center;gap:9px;
	margin:16px 0 0;padding:18px 24px;border-radius:99px;text-decoration:none;
	background:linear-gradient(180deg,#4A5667,#2B3440);color:#fff;
	font-size:1.08rem;font-weight:700;
	box-shadow:0 10px 26px -12px rgba(43,52,64,.9);transition:transform .15s,filter .2s}
.vcd-checkout:hover{transform:translateY(-1px);filter:brightness(1.06)}
.vcd-secure{display:flex;align-items:center;justify-content:center;gap:7px;
	margin:12px 0 0;font-size:.84rem;color:#8a949e}

@media (max-width:480px){
	.vcd-panel{width:100%}
	.vcd-panel .vcd-head{padding:18px 18px}
	.vcd-panel .vcd-head h2{font-size:1.35rem}
	.vcd-items,.vcd-ship{padding-left:16px;padding-right:16px}
	.vcd-foot{padding:14px 16px 18px}
}
@media (prefers-reduced-motion: reduce){
	.vcd-panel{transition:none}
	.vcd-veil{transition:none}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Cart Drawer: tightened sizing (overrides the block above) ── */
.vcd-panel .vcd-head{padding:15px 18px}
.vcd-panel .vcd-head h2{font-size:1.12rem;letter-spacing:.01em}
.vcd-close svg{width:20px;height:20px}

.vcd-ship{padding:12px 18px}
.vcd-ship-txt{font-size:.84rem;margin-bottom:8px;gap:8px}
.vcd-ship-txt svg{width:16px;height:16px}
.vcd-ship-track{height:6px}

.vcd-items{padding:12px 18px;gap:10px}
.vcd-item{padding:10px;gap:11px;border-radius:13px}
.vcd-item-img{flex:0 0 58px;width:58px;height:58px;border-radius:10px}
.vcd-item-name{font-size:.9rem;font-weight:700;line-height:1.3}
.vcd-remove svg{width:15px;height:15px}
.vcd-badge{margin-top:4px;padding:2px 8px;border-radius:6px;font-size:.7rem}
.vcd-item-bot{padding-top:8px;gap:8px}
.vcd-qty{padding:2px}
.vcd-q{width:25px;height:25px;font-size:.95rem}
.vcd-qn{min-width:18px;font-size:.85rem}
.vcd-was{font-size:.76rem}
.vcd-now{font-size:.92rem}

.vcd-foot{padding:12px 18px 16px}

.vcd-rec{padding:10px;margin-bottom:10px;gap:10px;border-radius:12px}
.vcd-rec-img{flex:0 0 46px;width:46px;height:46px;border-radius:8px}
.vcd-rec-name{font-size:.86rem}
.vcd-rec-tag{padding:3px 9px;font-size:.66rem}
.vcd-rec-top{margin-bottom:4px}
.vcd-rec-price{font-size:.88rem}
.vcd-rec-add{padding:7px 16px;font-size:.82rem}

.vcd-promo-in{padding:11px 14px;font-size:.88rem;border-radius:10px 0 0 10px}
.vcd-promo-btn{padding:11px 20px;font-size:.88rem;border-radius:0 10px 10px 0}
.vcd-promo-msg{font-size:.78rem}
.vcd-coupon{padding:4px 10px;font-size:.74rem}

.vcd-totals{margin-top:12px;padding-top:11px}
.vcd-trow{padding:4px 0;font-size:.88rem}
.vcd-trow.is-total{margin-top:6px;padding-top:9px;font-size:1.02rem}

.vcd-checkout{margin-top:12px;padding:14px 22px;font-size:.98rem}
.vcd-checkout svg{width:15px;height:15px}
.vcd-secure{margin-top:9px;font-size:.76rem}

/* Gift picker inside the drawer — compact variant */
.vcd-gift{margin:0 0 10px}
.vcd-gift .vgift{margin:0 0 8px;padding:12px 13px;border-radius:12px}
.vcd-gift .vgift-head strong{font-size:.86rem}
.vcd-gift .vgift-sub{font-size:.75rem;margin-bottom:10px;line-height:1.45}
.vcd-gift .vgift-row{gap:7px;margin-bottom:7px}
.vcd-gift .vgift-lbl{min-width:0;flex:1 1 100%;font-size:.68rem}
.vcd-gift .vgift-select{flex:1 1 100%;padding:9px 11px;font-size:.84rem;border-radius:9px}
.vcd-gift .vgift-status{font-size:.74rem;margin-top:7px}
.vcd-gift .vgift-fine,.vcd-gift .vgift-subnote{font-size:.68rem;margin-top:7px;padding:8px 10px}
.vcd-gift .vgift-upsell{font-size:.76rem;padding:9px 11px;margin-top:9px}
.vcd-gift .vgift-progress{font-size:.78rem;padding:11px 13px}

@media (max-width:480px){
	.vcd-items,.vcd-ship{padding-left:14px;padding-right:14px}
	.vcd-foot{padding:11px 14px 15px}
	.vcd-panel .vcd-head{padding:13px 14px}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Cart Drawer: keep the item list visible ─────────────────── */
/* The footer is fixed height; cap it so a long promo/totals block can never
   squeeze the scrolling item list to zero. */
.vcd-scroll{flex:1 1 auto;min-height:120px;overflow-y:auto}
.vcd-foot{max-height:55%;overflow-y:auto}
.vcd-gift{margin:0 18px 12px}
@media (max-width:480px){ .vcd-gift{margin:0 14px 10px} }
/* ─────────────────────────────────────────────────────────────── */

/* ── Cart Drawer footer: condensed ───────────────────────────── */
.vcd-foot{padding:10px 18px 12px;max-height:48%}

/* Applied-code row (replaces the input once a code is in use) */
.vcd-applied{display:flex;align-items:center;gap:7px;
	padding:8px 12px;border-radius:9px;
	background:#F3F5F8;border:1px solid #d3e3fb;color:var(--ice-deep,#2B3440)}
.vcd-applied svg{flex:0 0 auto;color:#1a7f37}
.vcd-applied-code{font-size:.8rem;font-weight:800;letter-spacing:.05em}
.vcd-applied-txt{font-size:.76rem;opacity:.75}
.vcd-applied .vcd-coupon-x{margin-left:auto;font-size:1.1rem;line-height:1}

/* Tighter promo input */
.vcd-promo-in{padding:9px 13px;font-size:.85rem}
.vcd-promo-btn{padding:9px 18px;font-size:.85rem}
.vcd-promo-msg{margin-top:5px;font-size:.74rem;min-height:0}
.vcd-promo-msg:empty{display:none}

/* Tighter totals */
.vcd-totals{margin-top:9px;padding-top:9px}
.vcd-trow{padding:3px 0;font-size:.85rem}
.vcd-trow.is-total{margin-top:5px;padding-top:8px;font-size:.98rem}

/* Tighter checkout area */
.vcd-checkout{margin-top:10px;padding:12px 20px;font-size:.94rem}
.vcd-secure{margin-top:7px;font-size:.72rem}

/* Give the reclaimed height back to the item list */
.vcd-scroll{min-height:180px}
/* ─────────────────────────────────────────────────────────────── */

/* ── Cart Drawer: empty state ────────────────────────────────── */
.vcd-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
	text-align:center;min-height:60vh;padding:40px 26px}
.vcd-empty-title{margin:0 0 8px;font-size:1.62rem;font-weight:600;color:#1a1a1a;line-height:1.25}
.vcd-empty-sub{margin:0 0 30px;font-size:1.02rem;font-weight:400;color:#9aa4ae}
.vcd-empty-btn{display:inline-flex;align-items:center;gap:11px;
	padding:17px 40px;border-radius:999px;text-decoration:none;
	background:linear-gradient(135deg,#2f5fbd,#3f7fe0);color:#fff;
	font-size:1.08rem;font-weight:700;
	box-shadow:0 10px 26px -14px rgba(47,95,189,.9);
	transition:transform .15s,filter .2s}
.vcd-empty-btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.vcd-empty-btn svg{flex:0 0 auto}

/* Empty cart has no footer content, so let the body fill the panel */
.vcd-scroll:has(.vcd-empty){display:flex;flex-direction:column;justify-content:center}
/* ─────────────────────────────────────────────────────────────── */

/* ── Product Details: collapsed with expand toggle ───────────── */
.vanta-details.is-collapsible .vanta-details-body{
	position:relative;
	max-height:200px;overflow:hidden;
	transition:max-height .45s ease}
.vanta-details.is-collapsible .vanta-details-body::after{
	content:"";position:absolute;left:0;right:0;bottom:0;height:90px;
	background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 88%);
	pointer-events:none;transition:opacity .3s}
.vanta-details.is-collapsible.is-open .vanta-details-body{max-height:none}
.vanta-details.is-collapsible.is-open .vanta-details-body::after{opacity:0}

.vanta-details-toggle{display:inline-flex;align-items:center;gap:7px;
	margin:14px 0 0;padding:10px 22px;
	background:#fff;border:1.5px solid var(--line,#e4ecf4);border-radius:999px;
	cursor:pointer;color:var(--ice,#4A5667);
	font-size:.88rem;font-weight:800;letter-spacing:.01em;
	transition:border-color .18s,background .18s,transform .15s}
.vanta-details-toggle:hover{border-color:var(--ice,#4A5667);background:#f5f9ff;transform:translateY(-1px)}
.vanta-details-toggle svg{transition:transform .3s}
.vanta-details.is-open .vanta-details-toggle svg{transform:rotate(180deg)}
.vanta-details-toggle .vd-less{display:none}
.vanta-details.is-open .vanta-details-toggle .vd-more{display:none}
.vanta-details.is-open .vanta-details-toggle .vd-less{display:inline}

@media (max-width:640px){
	.vanta-details.is-collapsible .vanta-details-body{max-height:160px}
	.vanta-details-toggle{width:100%;justify-content:center;padding:12px 20px}
}
@media (prefers-reduced-motion: reduce){
	.vanta-details.is-collapsible .vanta-details-body{transition:none}
	.vanta-details-toggle svg{transition:none}
}
/* ─────────────────────────────────────────────────────────────── */

/* ── Footer contact block (replaces social icons) ────────────── */
.foot-contact{display:flex;flex-direction:column;gap:11px;margin-top:18px}
.foot-contact-row{display:flex;align-items:flex-start;gap:10px;
	color:var(--mid,#6b7f95);font-size:.88rem;line-height:1.5;text-decoration:none;
	transition:color .18s}
a.foot-contact-row:hover{color:var(--ice,#4A5667)}
.foot-contact-row svg{flex:0 0 auto;width:17px;height:17px;margin-top:2px;color:var(--ice,#4A5667);opacity:.85}
.foot-contact-row span{word-break:break-word}
/* ─────────────────────────────────────────────────────────────── */

/* ── Blog / archive listing grid ─────────────────────────────── */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){ .post-grid{grid-template-columns:repeat(2,1fr);gap:18px} }
@media(max-width:600px){ .post-grid{grid-template-columns:1fr;gap:16px} }
/* ─────────────────────────────────────────────────────────────── */

/* ── Sign-up: required marks and consent checkboxes ───────────── */
.vlogin-req{color:#d94a4a;font-weight:700}
.vlogin-consent{display:flex;align-items:flex-start;gap:11px;margin:14px 0 0;
	font-family:var(--body,"Satoshi",sans-serif);font-size:14px;line-height:1.5;
	color:var(--hi,#0b2236);cursor:pointer}
.vlogin-consent input[type="checkbox"]{flex:0 0 auto;width:20px;height:20px;margin:1px 0 0;
	accent-color:var(--ice,#4A5667);cursor:pointer}
.vlogin-consent span{flex:1 1 auto}
.vlogin-consent a{color:var(--ice,#4A5667);text-decoration:none}
.vlogin-consent a:hover{text-decoration:underline}
.vlogin-consent + .vlogin-btn{margin-top:20px}
@media(max-width:560px){.vlogin-consent{font-size:13.5px}}

/* ── Social login: full-width, centred, sized to match Sign in ──────────
   Nextend renders .nsl-container > .nsl-container-buttons > .nsl-button and
   sets inline sizing of its own, so the earlier width rule never reached the
   real button. These target its actual structure and override its defaults. */
.vlogin-social .nsl-container{width:100%!important;max-width:none!important;text-align:center!important}
.vlogin-social .nsl-container-buttons{display:flex!important;flex-direction:column!important;
	align-items:stretch!important;justify-content:center!important;
	width:100%!important;max-width:none!important;gap:14px!important}
.vlogin-social .nsl-container-buttons a,
.vlogin-social .nsl-button{
	display:flex!important;align-items:center!important;justify-content:center!important;
	width:100%!important;max-width:none!important;
	min-height:60px!important;height:auto!important;
	border-radius:999px!important;box-sizing:border-box!important;
	padding:0 22px!important;margin:0!important}
/* Nextend sizes the label and icon independently of the button. */
.vlogin-social .nsl-button-label-container{
	flex:0 1 auto!important;width:auto!important;
	font-family:var(--body,"Satoshi",sans-serif)!important;
	font-size:17px!important;font-weight:600!important;line-height:1.2!important;
	text-align:center!important;margin:0!important;padding:0!important}
/* Nextend pads this container and sizes the svg inside it, so setting the
   container alone left the glyph small. Zero the padding, fix the box, and
   force the svg to fill it. */
.vlogin-social .nsl-button-svg-container{
	flex:0 0 auto!important;
	display:flex!important;align-items:center!important;justify-content:center!important;
	width:34px!important;height:34px!important;
	min-width:34px!important;min-height:34px!important;
	padding:0!important;margin:0 14px 0 0!important}
.vlogin-social .nsl-button-svg-container svg{
	width:34px!important;height:34px!important;
	min-width:34px!important;min-height:34px!important;
	max-width:none!important;max-height:none!important;display:block!important}
/* Some Nextend versions size the glyph via a custom property. */
.vlogin-social .nsl-button{--nsl-button-svg-size:34px!important}

/* Centre the "Don't have an account? Sign up" line under it. */
.vlogin-alt{text-align:center}

@media(max-width:560px){
	.vlogin-social .nsl-button{min-height:56px!important}
	.vlogin-social .nsl-button-label-container{font-size:16px!important}
	.vlogin-social .nsl-button-svg-container,
	.vlogin-social .nsl-button-svg-container svg{
		width:30px!important;height:30px!important;
		min-width:30px!important;min-height:30px!important}
}

/* ── Single post: keep .wrap's horizontal padding ─────────────────────────
   single.php previously set padding inline as "120px 0 90px", which zeroed the
   left/right padding .wrap provides and let body text run to the screen edge on
   mobile. Vertical spacing is set here so the horizontal value survives. */
.vpost-wrap{padding-top:120px;padding-bottom:90px}
@media(max-width:900px){
  .vpost-wrap{padding-top:96px;padding-bottom:64px}
}
@media(max-width:560px){
  .vpost-wrap{padding-top:84px;padding-bottom:56px;padding-left:20px;padding-right:20px}
  /* Tables are the one element that can still overflow a narrow viewport. */
  .vpost-wrap .entry-content table{display:block;width:100%;overflow-x:auto;
    -webkit-overflow-scrolling:touch}
  .vpost-wrap .entry-content pre{overflow-x:auto}
  .vpost-wrap .entry-content img{max-width:100%;height:auto}
}

/* ── Hero live badge (replaces the Discord button) ────────────────────────
   Matches the landing template's badge: solid core dot plus an expanding ring.
   Renders as an <a> when a URL is set, otherwise a <span>. */
.vh-live{
	display:inline-flex; align-items:center; gap:10px;
	padding:11px 20px 11px 16px;
	border:1px solid rgba(34,161,92,.32); border-radius:100px;
	background:rgba(34,161,92,.10);
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:14.5px; font-weight:600; line-height:1;
	color:#1c7a48; text-decoration:none; white-space:nowrap;
	transition:background .18s ease, border-color .18s ease;
}
a.vh-live:hover{background:rgba(34,161,92,.16); border-color:rgba(34,161,92,.5)}
.vh-live-dot{
	position:relative; flex:0 0 auto;
	width:9px; height:9px; border-radius:50%;
	background:#22a15c; box-shadow:0 0 8px 1px rgba(34,161,92,.75);
}
.vh-live-dot::after{
	content:""; position:absolute; inset:0;
	border-radius:50%; background:#22a15c;
	animation:vh-live-pulse 2s cubic-bezier(.24,.72,.4,1) infinite;
}
@keyframes vh-live-pulse{
	0%   { transform:scale(1);   opacity:.65; }
	70%  { transform:scale(3.2); opacity:0; }
	100% { transform:scale(3.2); opacity:0; }
}
@media(prefers-reduced-motion:reduce){ .vh-live-dot::after{animation:none} }
@media(max-width:640px){
	.vh-live{font-size:13.5px; padding:10px 17px 10px 14px; white-space:normal}
}

/* ── Product card: fulfilment speed badge ─────────────────────────────── */
.vanta-pcard-ship{
	display:inline-flex; align-items:center; gap:5px;
	align-self:flex-start; margin-top:7px;
	padding:4px 10px 4px 8px;
	border:1px solid #f0dcb0; border-radius:100px;
	background:#fdf6e6;
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:11.5px; font-weight:700; letter-spacing:.01em;
	color:#8a6414; line-height:1.5; white-space:nowrap;
}
.vanta-pcard-ship svg{
	width:11px; height:11px; flex:0 0 auto;
	fill:#e8a317;
}
@media(max-width:560px){
	.vanta-pcard-ship{font-size:10.5px; padding:3px 8px 3px 7px; margin-top:6px}
	.vanta-pcard-ship svg{width:10px; height:10px}
}

/* ── Product card v2 ───────────────────────────────────────────────────────
   Single blue price, promo line, category, badge overlaid on the image, and a
   full-width gradient Add button. Overrides the earlier rules further up. */

.vanta-pcard-media{position:relative; display:block}

/* Badge moves off the body and onto the image, bottom-left. */
.vanta-pcard-ship{
	position:absolute; left:10px; bottom:10px; z-index:2;
	display:inline-flex; align-items:center; gap:5px;
	margin:0;
	padding:5px 11px 5px 9px;
	border:1px solid rgba(255,255,255,.6); border-radius:100px;
	background:rgba(255,255,255,.92);
	-webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
	box-shadow:0 2px 8px -2px rgba(11,34,54,.22);
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:11.5px; font-weight:700; color:#8a6414; line-height:1.5; white-space:nowrap;
}
.vanta-pcard-ship svg{width:11px; height:11px; fill:#e8a317; flex:0 0 auto}

/* Price: one figure, brand blue, no struck-through original. */
.vanta-pcard-price{display:flex; flex-direction:column; gap:5px; margin-top:2px}
.vanta-pcard-pricerow{
	display:flex; align-items:baseline; gap:6px; flex-wrap:wrap;
	font-family:var(--display,"Clash Display",sans-serif);
	font-weight:700; font-size:21px; line-height:1.2; color:var(--ice,#4A5667);
}
.vanta-pcard-from{
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:14px; font-weight:600; color:var(--ice,#4A5667);
}
.vanta-pcard-pricerow .woocommerce-Price-amount{color:var(--ice,#4A5667)}
.vanta-pcard-pricerow del{display:none}

.vanta-pcard-promo{
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:11.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
	color:var(--ice,#4A5667);
}
.vanta-pcard-cat{
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:13px; color:var(--mid,#8a93a3); line-height:1.4;
}

/* Single full-width action. */
.vanta-pcard-actions{display:block; margin-top:14px}
.vanta-pcard-actions .vanta-pcard-btn{width:100%; display:block; text-align:center}

.vanta-pcard-btn--solid{
	padding:14px 18px; border:0; border-radius:100px;
	background:linear-gradient(135deg,#2b7bff 0%,#4A5667 52%,#2B3440 100%);
	color:#fff; font-family:var(--body,"Satoshi",sans-serif);
	font-weight:700; font-size:15px; letter-spacing:.01em; cursor:pointer;
	box-shadow:0 8px 20px -10px rgba(74,86,103,.85);
	transition:box-shadow .18s ease, transform .18s ease, filter .18s ease;
}
.vanta-pcard-btn--solid:hover{
	filter:brightness(1.06);
	transform:translateY(-1px);
	box-shadow:0 12px 26px -10px rgba(74,86,103,.95);
	color:#fff;
}

@media(max-width:560px){
	.vanta-pcard-pricerow{font-size:18px}
	.vanta-pcard-from{font-size:12.5px}
	.vanta-pcard-promo{font-size:10.5px}
	.vanta-pcard-cat{font-size:12px}
	.vanta-pcard-btn--solid{padding:12px 14px; font-size:13.5px}
	.vanta-pcard-ship{left:7px; bottom:7px; font-size:10.5px; padding:4px 9px 4px 7px}
	.vanta-pcard-ship svg{width:10px; height:10px}
}

/* ── Product card: match the reference typography ─────────────────────────
   Sans throughout (no display face on the price), tighter vertical rhythm,
   and a near-black pill button rather than the blue gradient. */

.vanta-pcard-body{padding-top:16px}

.vanta-pcard-title{
	font-family:var(--body,"Satoshi",sans-serif)!important;
	font-size:16px!important; font-weight:700!important; line-height:1.3!important;
	letter-spacing:0!important; color:var(--hi,#0b2236)!important;
	margin:0 0 10px!important;
}

.vanta-pcard-price{gap:4px; margin-top:0}

.vanta-pcard-pricerow{
	font-family:var(--body,"Satoshi",sans-serif);
	font-weight:700; font-size:20px; line-height:1.25;
	color:var(--ice,#4A5667); gap:5px;
}
.vanta-pcard-from{
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:20px; font-weight:700; color:var(--ice,#4A5667);
}

.vanta-pcard-promo{
	font-size:11px; font-weight:700; letter-spacing:.03em;
	color:var(--ice,#4A5667); margin-top:1px;
}
.vanta-pcard-cat{
	font-size:13.5px; color:#9aa4af; margin-top:3px;
}

.vanta-pcard-actions{margin-top:16px}

/* Near-black pill, as in the reference. */
.vanta-pcard-btn--solid{
	padding:15px 18px; border-radius:100px;
	background:#16181d;
	font-family:var(--body,"Satoshi",sans-serif);
	font-weight:700; font-size:15px; letter-spacing:0;
	box-shadow:none;
}
.vanta-pcard-btn--solid:hover{
	background:#000; filter:none; transform:none;
	box-shadow:0 8px 20px -10px rgba(0,0,0,.5); color:#fff;
}

@media(max-width:560px){
	.vanta-pcard-title{font-size:14.5px!important; margin-bottom:8px!important}
	.vanta-pcard-pricerow,.vanta-pcard-from{font-size:17px}
	.vanta-pcard-promo{font-size:10px}
	.vanta-pcard-cat{font-size:12px}
	.vanta-pcard-btn--solid{padding:13px 14px; font-size:13.5px}
}

/* ── Product card: tighten to match the reference ─────────────────────────
   Larger, heavier title; "From" set in the same blue and weight as the figure;
   vertical rhythm pulled in throughout. Appended last so it wins. */

.vanta-pcard-body{padding-top:14px!important}

.vanta-pcard-title{
	font-size:17.5px!important;
	font-weight:800!important;
	line-height:1.25!important;
	margin:0 0 4px!important;   /* was 10px — closes the gap above the price */
	color:#12212f!important;
}

.vanta-pcard-price{gap:2px!important; margin-top:0!important}

/* "From" is part of the price, not a label: same colour, same weight. */
.vanta-pcard-pricerow{
	font-size:20px!important; font-weight:700!important;
	color:var(--ice,#4A5667)!important;
	gap:5px!important; line-height:1.3!important; margin:0!important;
}
.vanta-pcard-from{
	font-size:20px!important; font-weight:700!important;
	color:var(--ice,#4A5667)!important;
}

.vanta-pcard-promo{font-size:11px!important; margin-top:0!important; line-height:1.4!important}
.vanta-pcard-cat{font-size:13px!important; margin-top:2px!important; line-height:1.4!important}

.vanta-pcard-actions{margin-top:12px!important}
.vanta-pcard-btn--solid{padding:14px 18px!important}

@media(max-width:560px){
	.vanta-pcard-body{padding-top:12px!important}
	.vanta-pcard-title{font-size:15.5px!important; margin-bottom:3px!important}
	.vanta-pcard-pricerow,.vanta-pcard-from{font-size:17.5px!important}
	.vanta-pcard-cat{font-size:12px!important}
	.vanta-pcard-actions{margin-top:10px!important}
	.vanta-pcard-btn--solid{padding:12px 14px!important}
}

/* ── Cart drawer: one-click offer banner ──────────────────────────────────
   Mirrors the homepage countdown bar gradient so the promotion reads as one
   campaign across the site. */
.vcd-apply{
	display:flex; align-items:center; justify-content:space-between; gap:12px;
	width:100%; margin:0 0 10px; padding:12px 12px 12px 16px;
	border:0; border-radius:12px; cursor:pointer; text-align:left;
	color:#fff;
	background:linear-gradient(100deg,
		var(--cd-bg,#0A0D12) 0%,
		var(--cd-accent,#3A4656) 50%,
		var(--cd-bg,#0A0D12) 100%);
	background-size:200% 100%;
	box-shadow:0 6px 18px -10px rgba(0,0,0,.7);
	transition:background-position .5s ease, transform .16s ease;
}
.vcd-apply:hover{background-position:100% 0; transform:translateY(-1px)}
.vcd-apply.is-busy{opacity:.65; pointer-events:none}

.vcd-apply-txt{display:flex; flex-direction:column; gap:2px; min-width:0}
.vcd-apply-line{
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:13.5px; font-weight:800; line-height:1.3; color:#fff;
}
.vcd-apply-code{
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
	color:rgba(255,255,255,.72);
}
.vcd-apply-btn{
	flex:0 0 auto;
	padding:8px 18px; border-radius:100px;
	background:#fff; color:var(--cd-bg,#0A0D12);
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:12.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase;
}
@media(max-width:480px){
	.vcd-apply{padding:11px 10px 11px 13px; gap:9px}
	.vcd-apply-line{font-size:12.5px}
	.vcd-apply-btn{padding:7px 14px; font-size:11.5px}
}

/* Picker heading: the discount condition sits under the label. */
.vanta-pcard-pick-l{display:block; line-height:1.4}
.vanta-pcard-pick-note{
	display:block; margin-top:3px;
	font-style:normal; font-weight:600;
	font-size:9.5px; letter-spacing:.04em; text-transform:none;
	color:var(--ice,#4A5667);
}

/* ── Product search overlay ───────────────────────────────────────────────
   Distinct vs- prefix: the vcd- namespace is already shared between the
   countdown bar and cart drawer and has caused collisions twice. */
.vsearch{position:fixed; inset:0; z-index:1200; display:none}
.vsearch.is-open{display:block}
body.vsearch-lock{overflow:hidden}

.vsearch-veil{position:absolute; inset:0; background:rgba(8,17,31,.5);
	-webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px)}

.vsearch-panel{
	position:relative; z-index:2;
	width:min(760px, calc(100% - 28px));
	margin:70px auto 0; max-height:calc(100vh - 110px);
	display:flex; flex-direction:column;
	background:#fff; border-radius:16px; overflow:hidden;
	box-shadow:0 30px 70px -20px rgba(8,17,31,.55);
	animation:vsIn .18s ease-out;
}
@keyframes vsIn{from{opacity:0; transform:translateY(-8px)}to{opacity:1; transform:none}}

.vsearch-bar{display:flex; align-items:center; gap:12px; padding:16px 18px;
	border-bottom:1px solid var(--line,#e2eaf2); flex:0 0 auto}
.vsearch-ico{width:20px; height:20px; color:var(--low,#8b9bab); flex:0 0 auto}
.vsearch-input{
	flex:1 1 auto; min-width:0; border:0; outline:0; background:none;
	font-family:var(--body,"Satoshi",sans-serif); font-size:16.5px; color:var(--hi,#0b2236);
}
.vsearch-input::placeholder{color:var(--low,#8b9bab)}
.vsearch-input::-webkit-search-cancel-button{display:none}
.vsearch-x{background:none; border:0; padding:4px; cursor:pointer; color:var(--mid,#56697b); display:flex}
.vsearch-x svg{width:20px; height:20px}

.vsearch-body{padding:18px; overflow-y:auto; -webkit-overflow-scrolling:touch}

.vsearch-h{margin:0 0 10px; font-family:var(--body,"Satoshi",sans-serif);
	font-size:14.5px; font-weight:800; color:var(--hi,#0b2236)}
.vsearch-h--split{margin-top:20px}
.vsearch-h--split span{color:var(--ice,#4A5667)}

.vsearch-chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:6px}
.vsearch-chip{
	display:inline-flex; align-items:center; gap:6px;
	padding:8px 14px; border-radius:100px;
	background:var(--elev,#f3f7fc); border:1px solid var(--line,#e2eaf2);
	font-family:var(--body,"Satoshi",sans-serif); font-size:13.5px; font-weight:600;
	color:var(--hi,#0b2236); text-decoration:none; transition:border-color .15s, color .15s;
}
.vsearch-chip:hover{border-color:var(--ice,#4A5667); color:var(--ice,#4A5667)}
.vsearch-chip svg{width:12px; height:12px; opacity:.55}

.vsearch-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.vsearch-card{border:1px solid var(--line,#e2eaf2); border-radius:14px; overflow:hidden;
	display:flex; flex-direction:column; background:#fff; transition:border-color .16s}
.vsearch-card:hover{border-color:var(--ice,#4A5667)}
.vsearch-card[hidden]{display:none}
.vsearch-media{display:block; background:var(--elev,#f3f7fc)}
.vsearch-media img{width:100%; height:auto; display:block}
.vsearch-info{padding:12px 13px 13px; display:flex; flex-direction:column; flex:1 1 auto}
.vsearch-name{margin:0 0 4px; font-family:var(--body,"Satoshi",sans-serif);
	font-size:14.5px; font-weight:800; line-height:1.25}
.vsearch-name a{color:var(--hi,#0b2236); text-decoration:none}
.vsearch-price{margin:0; font-family:var(--body,"Satoshi",sans-serif);
	font-size:15px; font-weight:700; color:var(--ice,#4A5667)}
.vsearch-promo{margin:2px 0 0; font-family:var(--body,"Satoshi",sans-serif);
	font-size:10.5px; font-weight:700; letter-spacing:.03em; color:var(--ice,#4A5667)}
.vsearch-btn{
	margin-top:10px; padding:10px 12px; border-radius:100px;
	background:#16181d; color:#fff; text-align:center; text-decoration:none;
	font-family:var(--body,"Satoshi",sans-serif); font-size:13px; font-weight:700;
}
.vsearch-btn:hover{background:#000; color:#fff}

.vsearch-empty{margin:24px 0; text-align:center;
	font-family:var(--body,"Satoshi",sans-serif); font-size:14.5px; color:var(--mid,#56697b)}

@media(max-width:700px){
	.vsearch-panel{margin-top:56px; width:calc(100% - 20px); max-height:calc(100vh - 84px)}
	.vsearch-grid{grid-template-columns:repeat(2,1fr); gap:10px}
	.vsearch-body{padding:14px}
	.vsearch-name{font-size:13px}
	.vsearch-price{font-size:14px}
	.vsearch-btn{font-size:12px; padding:9px 10px}
	.vsearch-input{font-size:16px}
}

/* Desktop keeps the grid; the subtitle is only used in the mobile list. */
.vsearch-sub{display:none}

/* ── Search overlay: mobile list view ─────────────────────────────────────
   A grid rather than nested flex: the desktop card sets flex-direction:column
   and that was being inherited, stacking image, name and price vertically.
   Grid areas pin the layout regardless of what the parent declares. */
@media(max-width:700px){
	.vsearch-grid{display:block!important}

	.vsearch-card{
		display:grid!important;
		grid-template-columns:56px 1fr auto;
		grid-template-areas:"media name price"
		                    "media sub  price";
		align-items:center;
		column-gap:13px; row-gap:2px;
		border:0!important; border-radius:0!important;
		border-bottom:1px solid var(--line,#e2eaf2)!important;
		padding:13px 0; background:none;
	}
	.vsearch-card:last-child{border-bottom:0!important}

	.vsearch-media{
		grid-area:media;
		width:56px; height:56px; border-radius:11px; overflow:hidden;
		background:var(--elev,#f3f7fc);
	}
	.vsearch-media img{width:100%; height:100%; object-fit:cover; display:block}

	/* The info wrapper is dissolved so its children sit directly on the card
	   grid — display:contents is what lets the grid areas above apply. */
	.vsearch-info{display:contents!important}

	.vsearch-name{
		grid-area:name; align-self:end;
		margin:0!important; font-size:15.5px!important; font-weight:800!important;
		line-height:1.25!important; min-width:0;
	}
	.vsearch-name a{
		display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
	}

	.vsearch-sub{
		display:block!important; grid-area:sub; align-self:start;
		margin:0!important;
		font-family:var(--body,"Satoshi",sans-serif);
		font-size:12.5px; line-height:1.35; color:var(--low,#8b9bab);
		overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0;
	}

	.vsearch-price{
		grid-area:price; justify-self:end;
		margin:0!important; font-size:15.5px!important; font-weight:800!important;
		color:var(--hi,#0b2236)!important; white-space:nowrap;
	}

	/* Not part of the list layout. */
	.vsearch-promo{display:none!important}
	.vsearch-btn{display:none!important}

	.vsearch-body{padding:16px 18px}
	.vsearch-h{font-size:16.5px; margin-bottom:11px}
	.vsearch-h--split{margin-top:20px}
	.vsearch-chips{gap:7px}
	.vsearch-chip{font-size:13.5px; padding:9px 15px; max-width:100%}
	.vsearch-chip span,.vsearch-chip{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
	.vsearch-chip svg{width:12px; height:12px; flex:0 0 auto}
}

/* Overflow link shown when a search matches more than the rendered limit. */
.vsearch-more{
	display:block; margin-top:14px; padding:12px;
	text-align:center; border-radius:10px;
	background:var(--elev,#f3f7fc);
	font-family:var(--body,"Satoshi",sans-serif);
	font-size:13.5px; font-weight:700; color:var(--ice,#4A5667); text-decoration:none;
}
.vsearch-more:hover{background:#e8f0fb; color:var(--ice-deep,#2B3440)}
.vsearch-more[hidden]{display:none}


/* ── Search overlay: hidden cards must actually hide ──────────────────────
   The mobile list sets display:grid with !important, which was overriding the
   [hidden] attribute — every product stayed visible regardless of the result
   limit. This restores it. */
.vsearch-card[hidden]{display:none!important}
.vsearch-more[hidden]{display:none!important}
.vsearch-empty[hidden]{display:none!important}

/* ── Nav: keep the action icons on one line ───────────────────────────────
   Adding the search icon pushed the row past its width on smaller screens and
   the logo block wrapped underneath. */
.nav-inner{flex-wrap:nowrap; gap:12px}
.nav-actions{flex-wrap:nowrap; flex:0 0 auto}
.nav-brand,.nav-logo{flex:0 0 auto; min-width:0}
.nav-links{min-width:0}

@media(max-width:900px){
	.nav-inner{gap:8px}
	.nav-actions{gap:2px}
	.nav-actions .icon-btn{padding:6px}
	.nav-actions .icon-btn svg{width:20px; height:20px}
}
@media(max-width:420px){
	.nav-actions .icon-btn{padding:5px}
	.nav-actions .icon-btn svg{width:19px; height:19px}
}

/* ── Hero live badge: brighter, glowing green ─────────────────────────────
   The muted tint was hard to read over the video. */
.vh-live{
	background:linear-gradient(135deg,#22c55e 0%,#16a34a 55%,#15803d 100%)!important;
	border:1px solid rgba(134,239,172,.85)!important;
	color:#fff!important;
	font-weight:700!important;
	text-shadow:0 1px 2px rgba(0,0,0,.28);
	box-shadow:
		0 0 0 4px rgba(34,197,94,.16),
		0 6px 20px -6px rgba(22,163,74,.75),
		inset 0 1px 0 rgba(255,255,255,.28);
	animation:vhLiveGlow 2.6s ease-in-out infinite;
}
a.vh-live:hover{
	background:linear-gradient(135deg,#2ee06a 0%,#19b352 55%,#178a43 100%)!important;
	border-color:#bbf7d0!important;
}
@keyframes vhLiveGlow{
	0%,100%{box-shadow:0 0 0 4px rgba(34,197,94,.14),0 6px 20px -6px rgba(22,163,74,.65),inset 0 1px 0 rgba(255,255,255,.28)}
	50%    {box-shadow:0 0 0 7px rgba(34,197,94,.07),0 10px 28px -6px rgba(22,163,74,.95),inset 0 1px 0 rgba(255,255,255,.28)}
}
/* Dot reads as white against the now-saturated background. */
.vh-live-dot{background:#ffffff!important; box-shadow:0 0 10px 2px rgba(255,255,255,.9)!important}
.vh-live-dot::after{background:#ffffff!important}

@media(prefers-reduced-motion:reduce){
	.vh-live{animation:none}
}

/* ── Countdown bar: keep it on one line on phones ─────────────────────────
   .vcd-inner wraps by default, which pushed the heading onto its own row. */
@media(max-width:700px){
	.vanta-cd{padding:8px 12px}
	.vcd-inner{flex-wrap:nowrap; gap:8px; justify-content:center}
	.vcd-offer{font-size:.8rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
	.vcd-use{display:none}
	.vcd-code{padding:4px 11px; font-size:.68rem; flex:0 0 auto}
	.vcd-code svg{width:9px; height:9px}
}
@media(max-width:400px){
	.vcd-offer{font-size:.72rem}
	.vcd-code{padding:4px 9px; font-size:.62rem; letter-spacing:.06em}
}

/* Search result thumbnails: fill the tile regardless of source aspect ratio. */
.vsearch-media img{width:100%; height:100%; object-fit:cover; display:block}

/* ── Countdown bar: single row on mobile ──────────────────────────────────
   An earlier rule sets .vcd-offer{flex-basis:100%} at 680px, which forced the
   offer text onto its own full-width line and left a gap above the code pill.
   These override it so heading, offer and code sit inline. */
@media(max-width:700px){
	.vanta-cd{padding:7px 10px!important}
	.vcd-inner{
		flex-wrap:nowrap!important;
		gap:7px!important;
		justify-content:center!important;
		align-items:center!important;
	}
	.vcd-offer{
		flex:0 1 auto!important;
		flex-basis:auto!important;
		font-size:.82rem!important;
		text-align:left!important;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
		min-width:0;
	}
	.vcd-use{display:none!important}
	.vcd-code{flex:0 0 auto!important; padding:4px 11px!important; font-size:.66rem!important}
	.vcd-code svg{width:9px!important; height:9px!important}
}
@media(max-width:400px){
	.vcd-offer{font-size:.74rem!important}
	.vcd-code{padding:4px 9px!important; font-size:.6rem!important; letter-spacing:.05em!important}
}

/* Placeholder tint while a search thumbnail has not been fetched yet. */
.vsearch-media img.vs-lazy{background:var(--elev,#f3f7fc)}

/* ── Product card price: was / now / From ─────────────────────────────────
   "From" in ink, the list price struck through in grey, the promotional price
   in brand blue. Overrides the earlier single-figure rules. */
.vanta-pcard-pricerow{
	display:flex!important; align-items:baseline!important;
	flex-wrap:wrap!important; gap:6px!important;
}

.vanta-pcard-from{
	color:var(--hi,#12212f)!important;
	font-size:20px!important; font-weight:700!important;
}

/* An earlier rule hid every <del> in the price row; this one is intentional. */
.vanta-pcard-pricerow del,
.vanta-pcard-was{
	display:inline!important;
	color:var(--low,#9aa4af)!important;
	font-size:15.5px!important; font-weight:600!important;
	text-decoration:line-through!important;
	text-decoration-thickness:1.5px;
}
.vanta-pcard-was .woocommerce-Price-amount{color:var(--low,#9aa4af)!important}

.vanta-pcard-now{
	display:inline!important; background:none!important; text-decoration:none!important;
	color:var(--ice,#4A5667)!important;
	font-size:20px!important; font-weight:700!important;
}
.vanta-pcard-now .woocommerce-Price-amount{color:var(--ice,#4A5667)!important}

@media(max-width:560px){
	.vanta-pcard-from,.vanta-pcard-now{font-size:17px!important}
	.vanta-pcard-was{font-size:13.5px!important}
	.vanta-pcard-pricerow{gap:5px!important}
}

/* "From" removed from product cards; hide the rule in case it renders elsewhere. */
.vanta-pcard-from{display:none!important}

/* Subscriptions withdrawn — hide any residual Subscribe & Save controls. */
.vpdp-sub-toggle,
.vpdp-subscribe,
.vpdp-sub-card,
.wps_sfw_subscription_message,
.wps-sfw-subscription-price,
.subscription-details{display:none!important}
