/* High Risk Supplements: help hub for peptide + high-risk supplement store owners (run by BIGR Impact Media) */
:root {
  --navy:#03060d; --navy2:#08101d; --panel:#0a1322; --line:rgba(80,160,255,.18);
  --blue:#2f7bff; --cyan:#19c3ff; --violet:#8b5cf6; --ink:#eef4ff; --mist:#a9b8cc; --dim:#6c7d93;
  --paper:#020409; --pink:#ff5d7a; --dark:#f2f6ff; --body:#b4c1d3;
  --disp:'Space Grotesk','Inter',sans-serif; --txt:'Inter',-apple-system,'Segoe UI',sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--txt); background:var(--paper); color:var(--body); -webkit-font-smoothing:antialiased; font-size:16px; line-height:1.65; }
a { color:inherit; text-decoration:none; }
img, video { max-width:100%; display:block; }
.wrap { max-width:1160px; margin:0 auto; padding:0 24px; }
.grad { background:linear-gradient(100deg,var(--cyan) 10%,var(--blue) 55%,var(--violet) 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; font-family:var(--disp); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--cyan); }
.eyebrow::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px var(--cyan); }

/* buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; font-family:var(--disp); font-weight:700; font-size:15px; padding:15px 24px; border-radius:12px; transition:transform .2s, box-shadow .2s, background .2s; cursor:pointer; border:0; }
.btn.primary { color:#fff; background:linear-gradient(100deg,var(--blue),var(--cyan)); box-shadow:0 12px 30px rgba(47,123,255,.4); }
.btn.primary:hover { box-shadow:0 18px 40px rgba(47,123,255,.55); }
.btn.ghost { color:var(--ink); border:1.5px solid rgba(255,255,255,.22); background:rgba(255,255,255,.04); }
.btn.ghost:hover { border-color:var(--cyan); }
.btn.light { color:var(--ink); background:rgba(255,255,255,.05); border:1.5px solid rgba(255,255,255,.16); }
.btn.light:hover { border-color:var(--cyan); }
.btn .arr { transition:transform .2s; } .btn:hover .arr { transform:none; }

/* header */
.hdr { position:sticky; top:0; z-index:50; background:rgba(2,4,9,.78); backdrop-filter:blur(14px); border-bottom:1px solid rgba(255,255,255,.07); }
.hdr .wrap { display:flex; align-items:center; gap:28px; height:68px; }
.logo { display:flex; align-items:center; gap:10px; font-family:var(--disp); font-weight:700; font-size:16px; letter-spacing:.02em; color:#fff; }
.logo .mark { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; background:linear-gradient(135deg,var(--blue),var(--cyan)); box-shadow:0 0 18px rgba(25,195,255,.5); }
.logo .mark svg { width:17px; height:17px; stroke:#fff; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.logo b { color:var(--cyan); font-weight:700; }
.hdr nav { display:flex; gap:24px; margin-left:auto; font-size:14.5px; font-weight:500; color:var(--mist); }
.hdr nav a:hover { color:#fff; }
.hdr .btn { padding:11px 18px; font-size:14px; }
@media (max-width:860px) { .hdr nav { display:none; } .hdr .btn { margin-left:auto; } .logo span.full { display:none; } }

/* dark hero with live dots */
.hero { position:relative; overflow:hidden; background:radial-gradient(900px 500px at 80% -10%,rgba(47,123,255,.28),transparent 60%), radial-gradient(700px 500px at 0% 100%,rgba(139,92,246,.18),transparent 60%), var(--navy); color:var(--ink); }
.hero .bgfx { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.hero .wrap { position:relative; z-index:2; }
.hero h1 { font-family:var(--disp); font-weight:700; color:#fff; letter-spacing:-.02em; line-height:1.06; text-wrap:balance; }
.chips { display:flex; flex-wrap:wrap; gap:8px; }
.chips span { font-size:12.5px; font-weight:600; color:var(--ink); padding:7px 12px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); }

/* sections */
section { padding:84px 0; }
.sec-h { max-width:720px; margin-bottom:38px; }
.sec-h.c { margin-left:auto; margin-right:auto; text-align:center; }
.sec-h h2 { font-family:var(--disp); font-size:clamp(28px,3.6vw,42px); font-weight:700; line-height:1.12; letter-spacing:-.015em; color:var(--dark); margin-top:10px; text-wrap:balance; }
.sec-h p { margin-top:12px; font-size:17px; color:var(--mist); }
.dark { background:var(--navy); color:var(--ink); position:relative; overflow:hidden; }
.dark .sec-h h2 { color:#fff; } .dark .sec-h p { color:var(--mist); }
.dark .bgfx { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.dark .wrap { position:relative; z-index:2; }

/* cards */
.card { background:linear-gradient(180deg,#0b1526,#060b15); border:1px solid rgba(80,160,255,.16); border-radius:18px; box-shadow:0 18px 44px rgba(0,0,0,.45); position:relative; overflow:hidden; transition:transform .25s, box-shadow .25s, border-color .25s; }
.card::before { content:''; position:absolute; left:0; right:0; top:0; height:4px; background:linear-gradient(90deg,var(--cyan),var(--blue),var(--violet)); }
a.card:hover { transform:translateY(-4px); box-shadow:0 26px 60px rgba(0,0,0,.6), 0 0 30px rgba(25,195,255,.14); border-color:rgba(25,195,255,.45); }
.dcard { background:linear-gradient(180deg,rgba(47,123,255,.10),rgba(255,255,255,.02)); border:1px solid var(--line); border-radius:18px; }

/* reveal */
@media (prefers-reduced-motion:no-preference) {
  .js .rv { opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); transition-delay:var(--d,0ms); }
  .js .rv.in { opacity:1; transform:none; }
}

/* footer */
.ftr { background:var(--navy); color:var(--dim); padding:46px 0 34px; font-size:13.5px; }
.ftr .wrap { display:flex; flex-wrap:wrap; gap:18px 40px; align-items:center; justify-content:space-between; }
.ftr a:hover { color:#fff; }
.ftr .note { flex-basis:100%; font-size:12.5px; color:var(--mist); border-top:1px solid rgba(255,255,255,.06); padding-top:18px; }

/* phone sticky CTA */
.mbar { display:none; }
@media (max-width:760px) {
  section { padding:60px 0; }
  .mbar { display:flex; position:fixed; left:12px; right:12px; bottom:12px; z-index:60; padding:10px; gap:10px; align-items:center; border-radius:16px; background:rgba(5,11,22,.92); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.1); box-shadow:0 16px 40px rgba(0,0,0,.4); transform:translateY(140%); transition:transform .35s ease; }
  .mbar.on { transform:none; }
  .mbar span { flex:1; font-size:13px; font-weight:600; color:#fff; line-height:1.3; padding-left:6px; }
  .mbar .btn { padding:11px 14px; font-size:13.5px; }
  body { padding-bottom:0; }
}

/* backdrop: fine grid fading to the edges, two slow glows, pointer spotlight (replaces the dots) */
.bgx { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.bgx::before { content:''; position:absolute; inset:0;
  background-image:linear-gradient(rgba(120,170,255,.07) 1px,transparent 1px), linear-gradient(90deg,rgba(120,170,255,.07) 1px,transparent 1px);
  background-size:56px 56px; -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 30%,transparent 80%); mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 30%,transparent 80%); }
.bgx .g1, .bgx .g2 { position:absolute; border-radius:50%; filter:blur(80px); }
.bgx .g1 { width:560px; height:560px; left:-120px; top:-160px; background:rgba(47,123,255,.32); }
.bgx .g2 { width:520px; height:520px; right:-140px; bottom:-200px; background:rgba(139,92,246,.24); }
.bgx .sp { position:absolute; width:620px; height:620px; left:var(--mx,70%); top:var(--my,30%); transform:translate(-50%,-50%); border-radius:50%;
  background:radial-gradient(circle,rgba(25,195,255,.13),transparent 60%); transition:left .6s ease, top .6s ease; }
@media (prefers-reduced-motion:no-preference) {
  .bgx .g1 { animation:gx1 22s ease-in-out infinite alternate; }
  .bgx .g2 { animation:gx2 26s ease-in-out infinite alternate; }
}
@keyframes gx1 { to { transform:translate(220px,120px) scale(1.15); } }
@keyframes gx2 { to { transform:translate(-200px,-100px) scale(.9); } }

/* logo + mega menu (white panel, blue accents) */
.logo-svg { height:38px; width:auto; display:block; }
.mnav { display:flex; align-items:center; gap:6px; margin-left:auto; }
.mm { position:relative; }
.mm-t, .mn-l { font-family:var(--txt); font-size:14.5px; font-weight:600; color:var(--mist); background:none; border:0; padding:10px 12px; border-radius:10px; cursor:pointer; display:flex; align-items:center; gap:6px; transition:color .2s, background .2s; }
.mm-t i { font-style:normal; font-size:11px; transition:transform .25s; }
.mm-t:hover, .mn-l:hover, .mm.open .mm-t { color:#fff; background:rgba(255,255,255,.06); }
.mm.open .mm-t i { transform:rotate(180deg); }
.mm-p { position:absolute; top:calc(100% + 12px); left:50%; transform:translate(-50%,8px); width:min(720px,92vw); background:#07101e; border:1px solid rgba(80,160,255,.2); border-radius:16px; overflow:hidden;
  box-shadow:0 30px 70px rgba(0,20,60,.45), 0 0 0 1px rgba(47,123,255,.12); opacity:0; visibility:hidden; transition:opacity .2s, transform .2s, visibility 0s linear .2s; z-index:70; }
.mm-p::before { content:''; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,var(--cyan),var(--blue),var(--violet)); }
.mm.open .mm-p { opacity:1; visibility:visible; transform:translate(-50%,0); transition-delay:0s; }
.mm-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:16px; }
.mm-grid.three { grid-template-columns:1fr 1fr 1fr; }
.mm-i { display:flex; gap:12px; align-items:flex-start; padding:12px; border-radius:12px; transition:background .2s; }
.mm-i:hover { background:rgba(47,123,255,.12); }
.mm-ic { flex:none; width:36px; height:36px; border-radius:10px; display:grid; place-items:center; background:rgba(47,123,255,.16); transition:background .2s; }
.mm-ic svg { width:19px; height:19px; stroke:var(--cyan); fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.mm-i:hover .mm-ic { background:linear-gradient(135deg,var(--blue),var(--cyan)); } .mm-i:hover .mm-ic svg { stroke:#fff; }
.mm-i b { display:block; font-family:var(--disp); font-size:15px; color:var(--dark); line-height:1.25; }
.mm-i small { display:block; font-size:12.5px; color:var(--mist); line-height:1.4; margin-top:2px; }
.mm-i:hover b { color:var(--cyan); }
.mm-f { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:12px 20px; background:rgba(255,255,255,.05); border-top:1px solid rgba(255,255,255,.09); font-size:13px; color:var(--mist); }
.mm-f a, a.lk { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px; border:1.5px solid rgba(25,195,255,.4); background:rgba(25,195,255,.06); color:var(--cyan); font-weight:700; font-size:13px; white-space:nowrap; transition:background .2s, border-color .2s; }
.mm-f a:hover, a.lk:hover { border-color:var(--cyan); background:rgba(25,195,255,.14); }
.pt-p a.lk { margin-left:6px; background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.28); color:#fff; }
.pt-p a.lk:hover { background:rgba(255,255,255,.12); border-color:#fff; }
.burger { display:none; margin-left:12px; width:42px; height:42px; border-radius:10px; border:1px solid rgba(255,255,255,.15); background:none; cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:5px; }
.burger span { width:18px; height:2px; background:#fff; transition:transform .25s, opacity .25s; }
.burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.mob { display:none; background:#050a14; border-top:3px solid; border-image:linear-gradient(90deg,var(--cyan),var(--violet)) 1; max-height:calc(100vh - 68px); overflow:auto; }
.mob.open { display:block; }
.mob .wrap { display:flex; flex-direction:column; padding-top:6px; padding-bottom:20px; }
.mob-g { font-family:var(--disp); font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--cyan); padding:16px 0 6px; }
.mob a:not(.btn) { padding:12px 0; border-bottom:1px solid rgba(255,255,255,.09); font-weight:600; color:var(--dark); display:flex; justify-content:space-between; }
.mob a:not(.btn)::after { content:'›'; color:var(--cyan); font-size:18px; line-height:1; }
.mob .btn { margin-top:18px; }
@media (max-width:980px) { .mnav { display:none; } .burger { display:flex; } .hdr-cta { margin-left:auto; } }
@media (max-width:520px) { .hdr-cta { display:none; } .burger { margin-left:auto; } .logo-svg { height:32px; } }
.hdr .mnav { gap:4px; }


/* ===== black + futuristic blue: Netflix-style rows ===== */
body { background:var(--paper); }
section { position:relative; }
.nrows { padding:26px 0 60px; background:linear-gradient(180deg,#020409,#03070f 50%,#020409); overflow:hidden; }
.nrow { margin:0 0 34px; }
.nrow-h { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:6px; }
.nrow-h h2 { font-family:var(--disp); font-size:clamp(19px,2.1vw,25px); font-weight:700; color:#fff; letter-spacing:-.01em; }
.nrow-h h2 span { font-family:var(--txt); font-size:14px; font-weight:500; color:var(--dim); margin-left:8px; letter-spacing:0; }
.nrow-h a { flex:none; font-size:13.5px; font-weight:700; color:var(--cyan); opacity:.85; } .nrow-h a:hover { opacity:1; }
.stage { position:relative; }
.track { display:flex; gap:14px; overflow-x:auto; overflow-y:visible; scroll-snap-type:x proximity; scroll-padding:0 max(24px,calc((100vw - 1160px)/2 + 24px));
  padding:26px max(24px,calc((100vw - 1160px)/2 + 24px)) 34px; scrollbar-width:none; overscroll-behavior-x:contain;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.track::-webkit-scrollbar { display:none; }
.tile { --ry:0deg; --tz:0px; --s:1; flex:none; width:clamp(232px,24vw,300px); scroll-snap-align:start; position:relative; display:block; text-align:left; font:inherit; color:inherit;
  background:none; border:0; padding:0; cursor:pointer; transform:perspective(1100px) rotateY(var(--ry)) translateZ(var(--tz)) scale(var(--s)); transform-origin:50% 50%;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), filter .35s; will-change:transform; filter:brightness(var(--br,1)); }
.tile .art { position:relative; display:block; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#02040a;
  box-shadow:0 14px 34px rgba(0,0,0,.6), inset 0 0 0 1px rgba(120,180,255,.14); transition:box-shadow .35s; }
.tile .art img { width:100%; height:100%; object-fit:cover; }
.tile .art::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 35%,rgba(2,4,10,.92)); pointer-events:none; }
.tile .ttl { position:absolute; left:14px; right:14px; bottom:11px; z-index:2; }
.tile .ttl small { display:block; font-family:var(--disp); font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ac); filter:brightness(1.35); margin-bottom:3px; }
.tile .ttl b { display:block; font-family:var(--disp); font-size:15.5px; font-weight:700; line-height:1.22; color:#fff; text-wrap:balance; text-shadow:0 2px 12px rgba(0,0,0,.8); }
.tile .more { display:flex; flex-direction:column; gap:8px; max-height:0; opacity:0; overflow:hidden; padding:0 4px; transition:max-height .35s, opacity .3s, padding .35s; }
.tile .more span { font-size:13px; line-height:1.5; color:var(--mist); }
.tile .more i { font-style:normal; font-size:12.5px; font-weight:700; color:var(--ac); filter:brightness(1.3); }
.tile .badge { position:absolute; top:10px; right:10px; z-index:2; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:4px 8px; border-radius:999px; color:#cfe6ff; background:rgba(2,6,14,.7); border:1px solid rgba(120,180,255,.25); backdrop-filter:blur(6px); }
.tile .badge.yt { color:#fff; background:rgba(255,0,0,.82); border-color:transparent; }
@media (hover:hover) {
  .tile:hover, .tile:focus-visible { --s:1.07; --br:1.12; z-index:3; }
  .tile:hover .art, .tile:focus-visible .art { box-shadow:0 24px 50px rgba(0,0,0,.7), 0 0 0 1.5px var(--ac), 0 0 40px color-mix(in srgb,var(--ac) 45%,transparent); }
  .tile:hover .more, .tile:focus-visible .more { max-height:120px; opacity:1; padding:12px 4px 0; }
}
.tile.soon .art img { filter:saturate(.7) brightness(.8); }
/* video tiles: duotone in the row colour so every card matches; true colours on hover */
.tile .play { position:absolute; left:50%; top:42%; z-index:2; width:52px; height:52px; margin:-26px 0 0 -26px; border-radius:50%; display:grid; place-items:center; background:rgba(2,6,14,.55); border:1.5px solid rgba(255,255,255,.7); backdrop-filter:blur(4px); transition:transform .3s, background .3s; }
.tile .play svg { width:20px; height:20px; fill:#fff; margin-left:3px; }
.tile.vid:hover .play { transform:scale(1.12); background:var(--ac); border-color:transparent; }
.nav { position:absolute; top:26px; bottom:34px; z-index:5; width:max(24px,calc((100vw - 1160px)/2 + 10px)); min-width:44px; border:0; cursor:pointer; color:#fff; font-size:38px; line-height:1;
  background:linear-gradient(90deg,rgba(2,4,9,.92),transparent); opacity:0; transition:opacity .25s; }
.nav.next { right:0; background:linear-gradient(270deg,rgba(2,4,9,.92),transparent); } .nav.prev { left:0; }
.stage:hover .nav { opacity:.9; } .nav:hover { color:var(--cyan); } .nav[disabled] { visibility:hidden; }
@media (hover:none) { .nav { display:none; } }
@media (max-width:640px) { .tile { width:68vw; } .track { gap:10px; padding-top:18px; padding-bottom:22px; } .nrow { margin-bottom:22px; } }

/* billboard */
.bill { min-height:min(88vh,760px); display:flex; align-items:flex-end; padding:120px 0 70px; background:#000; }
.bill-bg { position:absolute; inset:0; overflow:hidden; }
.bill-bg img, .bill-yt iframe { position:absolute; top:50%; left:58%; width:max(100%,177.78vh); height:max(56.25vw,100%); transform:translate(-50%,-50%) scale(1.1); object-fit:cover; border:0; pointer-events:none; }
.bill-bg img { filter:grayscale(.6) brightness(.55) contrast(1.1); }
.bill-yt { position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease; } .bill-yt.on { opacity:1; }
.bill-yt iframe { filter:saturate(.75) brightness(.7) contrast(1.05); }
.bill-bg .sh1 { position:absolute; inset:0; background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.92) 30%,rgba(0,0,0,.35) 62%,rgba(0,0,0,.15)); }
.bill-bg .sh2 { position:absolute; inset:0; background:linear-gradient(0deg,#020409 0%,rgba(2,4,9,.4) 26%,transparent 50%), radial-gradient(900px 500px at 75% 30%,rgba(47,123,255,.22),transparent 70%); mix-blend-mode:normal; }
.bill-bg .scan { position:absolute; inset:0; background:repeating-linear-gradient(0deg,rgba(120,180,255,.035) 0 1px,transparent 1px 3px); pointer-events:none; }
.bill-in { position:relative; z-index:2; width:100%; }
.bill h1 { font-size:clamp(40px,6vw,76px); max-width:12.5em; margin:16px 0 16px; }
.bill .sub { font-size:19px; color:var(--mist); max-width:34em; margin-bottom:26px; }
.bill-now { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:26px; }
.bill-now span { font-size:13px; color:var(--dim); } .bill-now span b { color:var(--cyan); font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:11px; margin-right:6px; }
@media (max-width:760px) { .bill { min-height:auto; padding:84px 0 46px; } .bill-bg img { left:50%; } .bill .sub { font-size:17px; } }

/* video modal */
.ytm { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px; background:rgba(0,2,8,.86); backdrop-filter:blur(10px); }
.ytm[hidden] { display:none; }
.ytm-in { position:relative; width:min(1100px,100%); }
.ytm-f { aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:#000; box-shadow:0 40px 120px rgba(0,0,0,.8), 0 0 0 1px rgba(25,195,255,.35), 0 0 80px rgba(25,195,255,.18); }
.ytm-f iframe { width:100%; height:100%; border:0; display:block; }
.ytm-t { margin-top:12px; color:var(--mist); font-size:14px; }
.ytm-x { position:absolute; right:-6px; top:-50px; width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06); color:#fff; font-size:26px; line-height:1; cursor:pointer; }
.ytm-x:hover { border-color:var(--cyan); color:var(--cyan); }

/* dark versions of the old light blocks */
.hero-w { background:#000 !important; border-bottom:1px solid rgba(255,255,255,.06) !important; }
.discl { background:rgba(255,190,90,.06) !important; border-color:rgba(255,200,120,.3) !important; color:#f0dfbf !important; } .discl b { color:#ffcf73 !important; }
.answer2, .tblw, .faq2 details, .fld .in { border-color:rgba(80,160,255,.2) !important; }
.tbl th { color:var(--cyan) !important; } .tbl td { color:var(--ink) !important; }
.chips2 button { color:var(--ink) !important; border-color:rgba(80,160,255,.3) !important; }
.chips2 button.on { color:#fff !important; border-color:transparent !important; }
.fld input, .fld select, .mailf input[type=email] { color:var(--ink); background:transparent; } .mailf input[type=email] { border-color:rgba(255,255,255,.16) !important; }
.fld select option { background:#0a1322; }
.how code { background:rgba(255,255,255,.07) !important; }
.g-sec .num, .rel-grid .tag, .all .tag, .more h4, .tier .nm, .mw summary, .upd a, .pop a, .eyebrow.b { color:var(--cyan) !important; }
.eyebrow.b::before { background:var(--cyan) !important; box-shadow:0 0 10px var(--cyan) !important; }
.more a:hover, .sk a.q:hover, .sk a.q span { color:var(--cyan) !important; }
.mid, .ask, .vialbox, .rv2 { background:linear-gradient(160deg,#0b1730,#050a14) !important; border:1px solid rgba(80,160,255,.18); }
.whoc { background:rgba(255,255,255,.03) !important; border-color:rgba(80,160,255,.2) !important; box-shadow:none !important; }
.whoc:hover { border-color:var(--cyan) !important; box-shadow:0 0 30px rgba(25,195,255,.15) !important; }
.askres a:hover, .askres a.on { background:rgba(25,195,255,.1) !important; color:var(--cyan) !important; }
.askres { border:1px solid rgba(80,160,255,.25); }
.ftr { background:#000; border-top:1px solid rgba(255,255,255,.06); }
@media (prefers-reduced-motion:reduce) { .tile { transform:none !important; transition:none; } }
.tile[hidden], .nrow[hidden] { display:none; }
.bill .ask { margin:0; max-width:640px; background:rgba(4,10,22,.75) !important; backdrop-filter:blur(10px); border-color:rgba(80,160,255,.3) !important; }
.bill .ask input { color:#fff; } .bill .ask input::placeholder { color:var(--dim); }
.bill .pop { justify-content:flex-start; }
.whobar { padding:10px 0 20px; background:#020409; } .whobar .who { margin:0 auto; max-width:none; }
.nrows .sec-h h2 { color:#fff; }
.rel2 { padding-top:10px; }
/* hub footer with faint vial */
.ftr.hub { position:relative; overflow:hidden; padding:80px 0 30px; background:#000; }
.ftr.hub .wrap { display:block; position:relative; z-index:2; }
.ftr-glow { position:absolute; right:-10%; bottom:-40%; width:70%; height:120%; background:radial-gradient(closest-side,rgba(25,195,255,.12),transparent); pointer-events:none; }
.ftr-mark { position:absolute; right:-4%; bottom:-26%; width:min(640px,70vw); height:auto; opacity:.13; pointer-events:none; filter:drop-shadow(0 0 18px rgba(25,195,255,.5)); }
.ftr-top { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; }
.ftr-brand p { margin:16px 0 22px; font-size:14.5px; color:var(--mist); max-width:30ch; line-height:1.6; }
.ftr-brand .btn { padding:12px 18px; font-size:14px; }
.ftr-col h4 { font-family:var(--disp); font-size:11.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--cyan); margin-bottom:14px; }
.ftr-col a { display:block; padding:6px 0; font-size:14px; color:var(--mist); transition:color .2s, transform .2s; }
.ftr-col a:hover { color:#fff; transform:translateX(3px); }
.ftr.hub .note { border-top:1px solid rgba(255,255,255,.07); padding-top:22px; font-size:12.5px; color:#5d6d84; max-width:900px; }
.ftr-base { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:22px; font-size:12.5px; color:#4d5b70; letter-spacing:.04em; }
@media (max-width:900px) { .ftr-top { grid-template-columns:1fr 1fr; } .ftr-brand { grid-column:1/-1; } .ftr-mark { width:90vw; bottom:-12%; right:-30%; } }
@media (max-width:760px) { .ftr.hub { padding-bottom:100px; } }
/* white dropdown menus (Danny 22 Oct: clearer) */
.mm-p { background:#fff !important; border:0 !important; box-shadow:0 30px 70px rgba(0,0,0,.55), 0 0 0 1px rgba(47,123,255,.18) !important; }
.mm-p .mm-i:hover { background:rgba(47,123,255,.07); }
.mm-p .mm-ic { background:rgba(47,123,255,.1); } .mm-p .mm-ic svg { stroke:var(--blue); }
.mm-p .mm-i:hover .mm-ic { background:linear-gradient(135deg,var(--blue),var(--cyan)); } .mm-p .mm-i:hover .mm-ic svg { stroke:#fff; }
.mm-p .mm-i b { color:#0b1220; } .mm-p .mm-i:hover b { color:var(--blue); }
.mm-p .mm-i small { color:#5a6a7e; }
.mm-p .mm-f { background:#f3f7fc; color:#4a5a6e; border-top:1px solid rgba(11,18,32,.06); }
.mm-p .mm-f a { background:#fff; color:var(--blue); border-color:rgba(47,123,255,.35); } .mm-p .mm-f a:hover { background:#eef4ff; border-color:var(--blue); }
.mob { background:#fff !important; }
.mob-g { color:var(--blue) !important; }
.mob a:not(.btn) { color:#0b1220 !important; border-bottom-color:rgba(11,18,32,.07) !important; }
.mob a:not(.btn)::after { color:var(--blue) !important; }
/* white sections (Danny 22 Oct): home checklist + guide article text. Dark panels inside keep their own colours. */
.light { --dark:#0b1220; --body:#2a3647; --mist:#4a5a6e; --dim:#6c7d93; background:#fff; color:var(--body); }
.light .mid, .light .ask { --dark:#f2f6ff; --body:#b4c1d3; --mist:#a9b8cc; --dim:#6c7d93; }
.light .sec-h h2 { color:#0b1220; } .light .sec-h p { color:#4a5a6e; }
.light .eyebrow { color:var(--blue) !important; } .light .eyebrow::before { background:var(--blue); box-shadow:0 0 10px rgba(47,123,255,.5); }
.light .card { background:#fff; border:1px solid rgba(47,123,255,.16); box-shadow:0 18px 44px rgba(20,60,140,.10); }
.light a.card:hover { box-shadow:0 26px 60px rgba(20,60,140,.18); border-color:rgba(47,123,255,.45); }
.light .cl h3, .light .tick, .light .g-sec h2 { color:#0b1220; }
.light .cl p { color:#56667a; }
.light .g-sec p { color:#2a3647; }
.light .g-sec .num { color:var(--blue) !important; }
.light .more h4 { color:var(--blue) !important; } .light .more a { color:#0b1220; border-bottom-color:rgba(11,18,32,.07); } .light .more a:hover { color:var(--blue) !important; }
#checklist.light { padding:90px 0; background:radial-gradient(800px 400px at 15% 0%,rgba(47,123,255,.08),transparent 70%), #fff; }
.g-body.light { padding-bottom:70px; }
/* molecule hero (replaces the YouTube background) */
.bill { background:#000; }
.bill-bg .glow { position:absolute; right:-8%; top:-10%; width:70%; height:120%; background:radial-gradient(closest-side,rgba(47,123,255,.22),rgba(25,195,255,.06) 60%,transparent); }
.molfx { position:absolute; inset:0; width:100%; height:100%; display:block; }
.bill-bg .sh1 { background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.85) 26%,rgba(0,0,0,.2) 55%,transparent 75%); }
.bill-bg .sh2 { background:linear-gradient(0deg,#020409 0%,transparent 30%); }
.mol-cap { position:absolute; right:max(24px,calc((100vw - 1160px)/2 + 24px)); bottom:44px; z-index:3; text-align:right; opacity:0; transform:translateY(6px); transition:opacity .4s, transform .4s; pointer-events:none; }
.mol-cap.in { opacity:1; transform:none; }
.mol-cap small { display:block; font-family:var(--disp); font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--cyan); }
.mol-cap b { display:block; font-family:var(--disp); font-size:30px; font-weight:700; color:#fff; letter-spacing:-.01em; line-height:1.1; margin:4px 0 2px; text-shadow:0 0 24px rgba(25,195,255,.45); }
.mol-cap span { display:block; font-size:14px; color:var(--mist); font-variant-numeric:tabular-nums; } .mol-cap sub, .mol-cap sup { font-size:.7em; }
.mol-cap em { display:block; font-style:normal; font-size:11px; color:#4d5d74; margin-top:4px; letter-spacing:.04em; }
.molbg { opacity:.55; }
.g-hero .molbg { opacity:.8; }
.mol-cap.sm { bottom:18px; } .mol-cap.sm b { font-size:18px; } .mol-cap.sm span { font-size:12px; } .mol-cap.sm em { display:none; }
@media (max-width:900px) {
  .bill-bg .sh1 { background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.75) 55%,#020409); }
  .mol-cap { left:24px; right:auto; text-align:left; top:84px; bottom:auto; } .mol-cap b { font-size:20px; }
  .bill { padding-top:300px; }
  .molbg { opacity:.3; } .mol-cap.sm { display:none; }
}

/* video cards: true-colour thumbnails + muted hover preview (desktop) */
.tile.vid .prev { position:absolute; inset:0; z-index:1; opacity:0; transition:opacity .5s; background:#000; }
.tile.vid .prev.on { opacity:1; }
.tile.vid .prev iframe { position:absolute; left:50%; top:50%; width:118%; height:118%; transform:translate(-50%,-50%); border:0; pointer-events:none; }
.tile.vid.previewing .play { opacity:0; }
.tile.vid.previewing .art::after { background:linear-gradient(180deg,transparent 55%,rgba(2,4,10,.9)); }
/* cards pop more: lighter scrim, brighter edge, lift on hover */
.tile .art::after { background:linear-gradient(180deg,transparent 48%,rgba(2,6,16,.88)) !important; }
.tile .art { box-shadow:0 16px 38px rgba(0,0,0,.65), inset 0 0 0 1px rgba(140,200,255,.22), 0 0 0 1px rgba(0,0,0,.4); }
.tile .ttl b { font-size:16px; }
/* design 2: tall poster cards (alternate rows) */
.nrow.tall .tile { width:clamp(176px,15.5vw,214px); }
.nrow.tall .tile .art { aspect-ratio:2/3; border-radius:16px; }
.nrow.tall .tile .art img { object-position:66% 50%; }
.nrow.tall .tile.pq .art img[src*="/m-"] { object-position:64% 50%; }
.nrow.tall .tile .art::after { background:linear-gradient(180deg,transparent 40%,rgba(2,6,16,.94)) !important; }
.nrow.tall .tile .ttl { left:14px; right:14px; bottom:14px; }
.nrow.tall .tile .ttl b { font-size:18px; line-height:1.18; }
.nrow.tall .tile .ttl small { font-size:10px; margin-bottom:6px; }
.nrow.tall .tile .play { top:38%; }
.nrow.tall .tile .badge { top:12px; right:12px; }
.nrow.tall .tile .more span { display:none; }
@media (max-width:640px) { .nrow.tall .tile { width:44vw; } .nrow.tall .tile .ttl b { font-size:15px; } }
.tile .art img { position:absolute; inset:0; }
/* branded audience panels under the hero */
.who2 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.wc { position:relative; display:block; min-height:196px; border-radius:18px; overflow:hidden; isolation:isolate; background:#050b18;
  box-shadow:0 20px 50px rgba(0,0,0,.55), inset 0 0 0 1px rgba(140,200,255,.16); transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.wc::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; z-index:2; background:linear-gradient(var(--ac),transparent); }
.wc-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:80% 50%; opacity:.55; z-index:-1; transition:opacity .4s, transform .6s cubic-bezier(.2,.7,.2,1); }
.wc::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#030814 0%,rgba(3,8,20,.86) 45%,rgba(3,8,20,.25)); }
.wc-in { display:flex; flex-direction:column; height:100%; min-height:196px; padding:22px 22px 20px; }
.wc-tag { font-family:var(--disp); font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--ac); filter:brightness(1.35); }
.wc b { font-family:var(--disp); font-size:24px; font-weight:700; color:#fff; letter-spacing:-.015em; margin:8px 0 6px; line-height:1.1; }
.wc-l { font-size:14px; line-height:1.5; color:var(--mist); max-width:24ch; }
.wc-go { margin-top:auto; padding-top:16px; display:inline-flex; align-items:center; gap:8px; font-family:var(--disp); font-size:14px; font-weight:700; color:#fff; }
.wc-go i { font-style:normal; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--ac); color:#fff; transition:transform .3s; box-shadow:0 0 18px color-mix(in srgb,var(--ac) 60%,transparent); }
.wc:hover { transform:translateY(-4px); box-shadow:0 28px 60px rgba(0,0,0,.6), inset 0 0 0 1.5px var(--ac), 0 0 40px color-mix(in srgb,var(--ac) 30%,transparent); }
.wc:hover .wc-bg { opacity:.85; transform:scale(1.06); } .wc:hover .wc-go i { transform:translateX(4px); }
.whobar { padding:6px 0 26px; }
@media (max-width:860px) { .who2 { grid-template-columns:1fr; } .wc, .wc-in { min-height:160px; } }
