:root{
  --bg:#06140c; --bg-2:#0a1f12; --card:#0c2a17; --card-2:#0f3a20;
  --border:#1f7a45; --border-soft:#15623a;
  --green:#2bff88; --green-2:#7dffb0; --green-deep:#0b9a4e;
  --lime:#b6ff3c; --amber:#ffd23c; --red:#ff4d4d;
  --text:#d8ffe8; --text-2:#84c9a3; --text-3:#4f8c69;
  --font:'Space Grotesk',sans-serif; --mono:'JetBrains Mono',monospace;
}
*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ font-family:var(--font); background:var(--bg); color:var(--text); line-height:1.6; overflow-x:hidden; }
body::before{
  content:''; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.4;
  background:
    radial-gradient(700px circle at 80% -5%, rgba(43,255,136,.10), transparent 60%),
    radial-gradient(600px circle at 0% 100%, rgba(43,255,136,.07), transparent 55%);
}
a{ color:inherit; }
::selection{ background:var(--green); color:#04130a; }

/* ── TOP SALE MARQUEE ── */
.marquee{
  background:var(--green); color:#04130a; overflow:hidden; white-space:nowrap;
  font-family:var(--mono); font-weight:700; font-size:.82rem; letter-spacing:.5px;
  border-bottom:2px solid #04130a;
}
.marquee span{ display:inline-block; padding:.5rem 0; animation:scroll 22s linear infinite; }
@keyframes scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ── FAKE SHOP NAV ── */
.shopbar{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
  padding:.8rem 1.5rem; background:rgba(6,20,12,.92); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border-soft);
}
.logo{ font-family:var(--mono); font-weight:700; font-size:1.05rem; color:var(--green); }
.logo small{ color:var(--text-3); font-weight:400; }
.searchbox{
  flex:1; min-width:180px; display:flex; align-items:center; gap:.5rem;
  background:var(--bg-2); border:1px solid var(--border-soft); border-radius:8px;
  padding:.5rem .9rem; font-family:var(--mono); font-size:.8rem; color:var(--text-3);
}
.cart{ font-family:var(--mono); font-size:.82rem; color:var(--green); white-space:nowrap; }

.wrap{ max-width:1080px; margin:0 auto; padding:1.5rem; }
.crumbs{ font-family:var(--mono); font-size:.72rem; color:var(--text-3); margin:.5rem 0 1.2rem; }
.crumbs b{ color:var(--green-2); }

/* ── PRODUCT HERO ── */
.product{ display:grid; grid-template-columns:1fr 1.15fr; gap:2rem; align-items:start; }
@media(max-width:820px){ .product{ grid-template-columns:1fr; } }

.pimg{
  position:relative; aspect-ratio:1; border-radius:18px; overflow:hidden;
  background:
    repeating-linear-gradient(45deg, #0a2412 0 14px, #0c2a17 14px 28px);
  border:1px solid var(--border-soft);
  display:flex; align-items:center; justify-content:center; text-align:center;
}
.pimg .face{ font-size:5.5rem; filter:drop-shadow(0 0 22px rgba(43,255,136,.55)); }
.pimg .cap{ position:absolute; bottom:0; left:0; right:0; padding:.7rem; font-family:var(--mono); font-size:.68rem; color:var(--text-2); background:linear-gradient(180deg,transparent,rgba(0,0,0,.6)); }
.badge-off{
  position:absolute; top:14px; left:14px; z-index:2;
  background:var(--red); color:#fff; font-family:var(--mono); font-weight:700;
  font-size:.95rem; padding:.5rem .7rem; border-radius:50%; width:64px; height:64px;
  display:flex; align-items:center; justify-content:center; text-align:center; line-height:1;
  transform:rotate(-12deg); box-shadow:0 6px 22px rgba(255,77,77,.4);
}
.badge-stock{
  position:absolute; top:14px; right:14px; z-index:2;
  background:#04130a; color:var(--lime); border:1px solid var(--lime);
  font-family:var(--mono); font-weight:700; font-size:.66rem;
  padding:.35rem .6rem; border-radius:6px; animation:blink 1.3s step-end infinite;
}
@keyframes blink{ 50%{ opacity:.35; } }

.deal-tag{
  display:inline-flex; align-items:center; gap:.5rem;
  background:rgba(43,255,136,.12); border:1px solid var(--green);
  color:var(--green); font-family:var(--mono); font-weight:700; font-size:.72rem;
  padding:.32rem .8rem; border-radius:100px; margin-bottom:1rem;
  text-transform:uppercase; letter-spacing:.5px;
}
.dot{ width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 0 rgba(43,255,136,.6); animation:pulse 1.8s infinite; }
@keyframes pulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(43,255,136,.55);} 50%{ box-shadow:0 0 0 7px rgba(43,255,136,0);} }

.ptitle{ font-size:clamp(1.6rem,3.6vw,2.3rem); font-weight:700; line-height:1.15; color:var(--text); letter-spacing:-.5px; }
.ptitle .hl{ color:var(--green); text-shadow:0 0 26px rgba(43,255,136,.4); }
.psub{ font-family:var(--mono); font-size:.82rem; color:var(--text-2); margin-top:.5rem; }

.stars{ display:flex; align-items:center; gap:.6rem; margin:.9rem 0 1.2rem; font-size:.86rem; }
.stars .s{ color:var(--amber); letter-spacing:2px; font-size:1rem; }
.stars .n{ font-family:var(--mono); color:var(--text-2); }
.stars a{ font-family:var(--mono); color:var(--green); text-decoration:none; font-size:.78rem; }

.pricebox{ background:var(--bg-2); border:1px dashed var(--green-deep); border-radius:14px; padding:1.2rem 1.3rem; margin-bottom:1.1rem; }
.price-row{ display:flex; align-items:baseline; gap:.8rem; flex-wrap:wrap; }
.price-now{ font-family:var(--mono); font-size:2rem; font-weight:700; color:var(--green); line-height:1; }
.price-old{ font-family:var(--mono); font-size:1rem; color:var(--text-3); text-decoration:line-through; }
.price-save{ font-family:var(--mono); font-size:.72rem; color:#04130a; background:var(--lime); padding:.2rem .55rem; border-radius:5px; font-weight:700; }
.price-note{ font-family:var(--mono); font-size:.74rem; color:var(--text-2); margin-top:.55rem; }

.timer{ display:flex; align-items:center; gap:.6rem; font-family:var(--mono); font-size:.8rem; color:var(--amber); margin-top:.7rem; }
.timer b{ background:#04130a; border:1px solid var(--amber); padding:.18rem .45rem; border-radius:5px; color:var(--amber); letter-spacing:1px; }

.checks{ list-style:none; display:flex; flex-direction:column; gap:.5rem; margin:1.1rem 0 1.4rem; font-family:var(--mono); font-size:.82rem; color:var(--text-2); }
.checks li::before{ content:'✓ '; color:var(--green); font-weight:700; }

.cta{ display:flex; flex-direction:column; gap:.7rem; }
.btn{ font-family:var(--mono); font-weight:700; font-size:.92rem; padding:1rem 1.4rem; border-radius:11px; text-decoration:none; display:flex; align-items:center; justify-content:center; gap:.6rem; transition:all .2s; cursor:pointer; border:none; }
.btn-buy{ background:var(--green); color:#04130a; box-shadow:0 8px 30px rgba(43,255,136,.32); }
.btn-buy:hover{ background:var(--green-2); transform:translateY(-2px); box-shadow:0 12px 38px rgba(43,255,136,.5); }
.btn-row{ display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
@media(max-width:480px){ .btn-row{ grid-template-columns:1fr; } }
.btn-ghost{ background:transparent; color:var(--green-2); border:1px solid var(--border); font-size:.82rem; padding:.8rem 1rem; }
.btn-ghost:hover{ border-color:var(--green); background:rgba(43,255,136,.06); }
.buy-note{ font-family:var(--mono); font-size:.7rem; color:var(--text-3); text-align:center; margin-top:.2rem; }

/* ── SECTIONS ── */
section.blk{ margin-top:2.4rem; }
.blk-h{ font-family:var(--mono); font-size:.74rem; color:var(--green); text-transform:uppercase; letter-spacing:1.5px; margin-bottom:1rem; display:flex; align-items:center; gap:.5rem; }
.blk-h::before{ content:'▸'; }

.specs{ width:100%; border-collapse:collapse; font-family:var(--mono); font-size:.82rem; background:var(--bg-2); border:1px solid var(--border-soft); border-radius:12px; overflow:hidden; }
.specs td{ padding:.7rem 1rem; border-bottom:1px solid var(--border-soft); }
.specs tr:last-child td{ border-bottom:none; }
.specs td:first-child{ color:var(--text-3); width:38%; }
.specs td:last-child{ color:var(--text); }

.box-g{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.8rem; }
.box-c{ background:var(--card); border:1px solid var(--border-soft); border-radius:12px; padding:1.1rem 1.2rem; transition:.25s; }
.box-c:hover{ border-color:var(--green); transform:translateY(-3px); }
.box-c h4{ font-size:.92rem; color:var(--text); margin-bottom:.6rem; }
.tags{ display:flex; flex-wrap:wrap; gap:.35rem; }
.tag{ font-family:var(--mono); font-size:.68rem; padding:.18rem .5rem; border-radius:5px; background:#04130a; border:1px solid var(--border-soft); color:var(--green-2); }

.reviews{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:.9rem; }
.rev{ background:var(--card); border:1px solid var(--border-soft); border-radius:12px; padding:1.2rem; }
.rev .rs{ color:var(--amber); letter-spacing:1px; font-size:.85rem; }
.rev .verified{ font-family:var(--mono); font-size:.62rem; color:var(--green); margin-left:.4rem; }
.rev p{ font-size:.9rem; color:var(--text); margin:.55rem 0; line-height:1.6; }
.rev .who{ font-family:var(--mono); font-size:.72rem; color:var(--text-3); }

.fbt{ display:flex; align-items:center; gap:.9rem; flex-wrap:wrap; background:var(--bg-2); border:1px solid var(--border-soft); border-radius:12px; padding:1.3rem; }
.fbt .item{ text-align:center; font-family:var(--mono); font-size:.74rem; color:var(--text-2); }
.fbt .item .ic{ font-size:2.2rem; display:block; margin-bottom:.4rem; }
.fbt .plus{ font-size:1.6rem; color:var(--green); }
.fbt .eq{ font-size:1.6rem; color:var(--green); }
.fbt .total{ margin-left:auto; font-family:var(--mono); color:var(--green); font-weight:700; font-size:.9rem; }

footer{ margin-top:3rem; padding:2.2rem 1.5rem; text-align:center; font-family:var(--mono); font-size:.7rem; color:var(--text-3); border-top:1px solid var(--border-soft); }
footer a{ color:var(--green); text-decoration:none; }
.disclaimer{ max-width:640px; margin:1rem auto 0; line-height:1.7; }

/* ── MODAL ── */
.modal{ position:fixed; inset:0; z-index:300; display:none; align-items:center; justify-content:center; padding:1rem; background:rgba(2,8,4,.8); backdrop-filter:blur(4px); }
.modal.show{ display:flex; }
.modal-card{ width:100%; max-width:440px; background:var(--bg-2); border:1px solid var(--green); border-radius:16px; padding:1.6rem; box-shadow:0 20px 60px rgba(0,0,0,.6); }
.modal-card h3{ color:var(--green); font-size:1.2rem; margin-bottom:.2rem; }
.modal-card .msub{ font-family:var(--mono); font-size:.72rem; color:var(--text-3); margin-bottom:1.1rem; line-height:1.6; }
.modal-card label{ font-family:var(--mono); font-size:.64rem; color:var(--text-3); display:block; margin-bottom:.25rem; text-transform:uppercase; letter-spacing:.5px; }
.modal-card input, .modal-card textarea{ width:100%; padding:.7rem .9rem; margin-bottom:.85rem; background:#04130a; border:1px solid var(--border-soft); border-radius:8px; color:var(--text); font-family:var(--font); font-size:.9rem; outline:none; }
.modal-card input:focus, .modal-card textarea:focus{ border-color:var(--green); }
.modal-card textarea{ min-height:90px; resize:vertical; }
.modal-x{ float:right; cursor:pointer; color:var(--text-3); font-family:var(--mono); font-size:1.05rem; background:none; border:none; }
.modal-x:hover{ color:var(--green); }
.modal-msg{ font-family:var(--mono); font-size:.78rem; margin-top:.5rem; min-height:1.1rem; }

/* ── UTILITY (replaces former inline styles, so CSP needs no 'unsafe-inline') ── */
.lime{ color:var(--lime); }
.search-q{ color:var(--green); margin-left:auto; }
.g{ color:var(--green); }
.btn-full{ width:100%; }
.btn-wide{ max-width:420px; margin:0 auto; }
.final-cta{ text-align:center; background:var(--bg-2); border:1px dashed var(--green); border-radius:16px; padding:2.4rem 1.4rem; }
.stock-alert{ font-family:var(--mono); color:var(--lime); font-weight:700; font-size:.8rem; letter-spacing:1px; margin-bottom:.6rem; }
.final-h{ font-size:clamp(1.5rem,4vw,2.2rem); color:var(--green); text-shadow:0 0 26px rgba(43,255,136,.4); }
.final-p{ font-family:var(--mono); color:var(--text-2); font-size:.85rem; margin:.8rem auto 1.6rem; max-width:520px; }