/* High Risk Supplements: help hub for peptide + high-risk supplement store owners (run by BIGR Impact Media) */
:root {
  --navy:#050b16; --navy2:#0a1424; --panel:#0e1a2e; --line:rgba(80,160,255,.18);
  --blue:#2f7bff; --cyan:#19c3ff; --violet:#8b5cf6; --ink:#eef4ff; --mist:#a9b8cc; --dim:#6c7d93;
  --paper:#f4f7fb; --pink:#ff5d7a; --dark:#0b1220; --body:#2a3647;
  --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(--dark); background:#fff; border:1.5px solid rgba(11,18,32,.12); }
.btn.light:hover { border-color:var(--blue); }
.btn .arr { transition:transform .2s; } .btn:hover .arr { transform:none; }

/* header */
.hdr { position:sticky; top:0; z-index:50; background:rgba(5,11,22,.86); 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:#4a5a6e; }
.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:#fff; border:1px solid rgba(47,123,255,.14); border-radius:18px; box-shadow:0 18px 44px rgba(20,60,140,.10); 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(20,60,140,.18); border-color:rgba(47,123,255,.4); }
.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:#53627a; 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:#fff; 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,.07); }
.mm-ic { flex:none; width:36px; height:36px; border-radius:10px; display:grid; place-items:center; background:rgba(47,123,255,.1); transition:background .2s; }
.mm-ic svg { width:19px; height:19px; stroke:var(--blue); 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:#5a6a7e; line-height:1.4; margin-top:2px; }
.mm-i:hover b { color:var(--blue); }
.mm-f { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:12px 20px; background:#f3f7fc; border-top:1px solid rgba(11,18,32,.06); font-size:13px; color:#4a5a6e; }
.mm-f a, a.lk { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px; border:1.5px solid rgba(47,123,255,.35); background:#fff; color:var(--blue); 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(--blue); background:#eef4ff; }
.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:#fff; 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(--blue); padding:16px 0 6px; }
.mob a:not(.btn) { padding:12px 0; border-bottom:1px solid rgba(11,18,32,.07); font-weight:600; color:var(--dark); display:flex; justify-content:space-between; }
.mob a:not(.btn)::after { content:'›'; color:var(--blue); 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; }

/* white header */
.hdr { background:rgba(255,255,255,.92); border-bottom:1px solid rgba(11,18,32,.08); box-shadow:0 1px 0 rgba(47,123,255,.04); }
.mm-t, .mn-l { color:#3a4a5e; }
.mm-t:hover, .mn-l:hover, .mm.open .mm-t { color:var(--blue); background:rgba(47,123,255,.07); }
.mm-p { box-shadow:0 30px 70px rgba(10,30,80,.18), 0 0 0 1px rgba(47,123,255,.14); }
.burger { border-color:rgba(11,18,32,.14); } .burger span { background:var(--dark); }