:root{
  --bg:#0b0e13;
  --panel:#0f1520;
  --card:#121a2a;
  --ink:#0e121a;
  --text:#f3f6fb;
  --muted:#aeb9cc;
  --muted-2:#c8cfdb;
  --line:#1f2633;
  --brand:#f0b90b;
  --patriot-red:#ef233c;
  --patriot-blue:#3b82f6;
  --offset-top:70px; /* trust bar height + spacing */
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  background:var(--bg);
  color:var(--text);
  font-family:Manrope, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  padding-bottom:18px; /* no sticky bar */
}
:focus-visible{outline:2px dashed rgba(240,185,11,.8); outline-offset:2px}

/* Headings use Sora */
h1,h2,h3,h4,h5,h6,.fw-900{font-family:"Sora", Manrope, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial}

/* TRUST BAR (no dots) */
.trust-bar{
  position:sticky; top:0; z-index:1100;
  background:#0b0b0b; color:#fff; border-bottom:1px solid #131820;
  overflow:hidden; white-space:nowrap; height:40px; display:flex; align-items:center;
}
.trust-track{display:inline-flex; align-items:center; gap:28px; animation:marquee 30s linear infinite; padding-left:16px}
.trust-item{display:inline-flex; align-items:center; gap:.5rem; font-size:.95rem; color:#e9eef6}
.trust-item i{color:#f0b90b}
@keyframes marquee{from{transform:translateX(0)} to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){ .trust-track{animation:none} }

/* Pills & buttons */
.brand-badge{
  display:inline-block;
  background:linear-gradient(90deg,rgba(59,130,246,.28),rgba(239,35,60,.25));
  border:1px solid rgba(255,255,255,.28);
  color:#fff; padding:.35rem .6rem; border-radius:999px;
  font-weight:800; font-size:.85rem; letter-spacing:.03em;
}
.btn-brand{
  background:linear-gradient(90deg,var(--patriot-red),var(--patriot-blue));
  color:#fff; font-weight:900; border:none; letter-spacing:.02em;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
  padding:.85rem 1.2rem;
}
.btn-brand:hover{filter:brightness(.98)}
.btn-outline-light{border-color:#2c3446; color:#e7ecf3}
.btn-outline-light:hover{background:#1a2233; border-color:#3a445a}

.section{padding:5rem 0}
.bg-ink{background:var(--ink)}
.text-muted-2{color:var(--muted-2)}
.text-muted-3{color:var(--muted)}
.text-patriot{color:var(--patriot-blue)}
.card-soft{background:var(--card); border:1px solid var(--line); border-radius:1rem}

/* Anchor offsets */
[id]{scroll-margin-top:var(--offset-top)}

/* HERO */
.hero{position:relative; padding:6.5rem 0 6rem; overflow:hidden}
.hero-bg{position:absolute; inset:0; filter:brightness(.45) saturate(1.05)}
.hero-bg-patriot-hero{
  background:
    radial-gradient(900px 400px at 10% 0%, rgba(59,130,246,.24), transparent 60%),
    radial-gradient(900px 400px at 90% 0%, rgba(239,35,60,.24), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.55)),
    url("https://images.unsplash.com/photo-1598986646512-5a9b7f3f5b5c?q=80&w=1920&auto=format&fit=crop") center/cover no-repeat;
}
.hero-grad{position:absolute; inset:auto 0 0 0; height:40%; background:linear-gradient(180deg,rgba(11,14,19,0),rgba(11,14,19,1))}
#particles{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:.6}
.fw-900{font-weight:900}
.tracking-1{letter-spacing:.08em}
.hero-title{text-shadow:0 4px 18px rgba(0,0,0,.55)}
.hero-lead{color:#dbe2ee}
.coin-hero{
  width:min(520px,90%);
  border-radius:1.25rem;
  border:2px solid rgba(255,255,255,.08);
  box-shadow:0 30px 80px rgba(0,0,0,.35);
}
.patriotic-ring{box-shadow:0 0 0 6px rgba(59,130,246,.25), 0 0 0 12px rgba(239,35,60,.18)}

/* BUY PACKS */
.pack-card{
  position:relative; overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  border:1px solid #243049;
}
.pack-card:hover{transform:translateY(-8px); box-shadow:0 22px 70px rgba(0,0,0,.35)}
.pack-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:.75rem}
.pill{
  display:inline-block; padding:.28rem .55rem; border-radius:.5rem;
  font-weight:800; font-size:.8rem; border:1px solid transparent;
  color:#fff; background:rgba(46,204,113,.22); border-color:#295c44;
}
.timer{
  display:inline-flex; align-items:center; gap:.35rem; padding:.26rem .55rem; border-radius:.5rem;
  color:#cfe4ff; background:rgba(15,21,32,.85); border:1px solid #2f3a52; font-weight:700; font-size:.78rem;
}
.pack-media{position:relative; margin-bottom:.75rem}
.pack-img{width:100%; height:auto;padding: 20px; object-fit:cover; border-radius:.75rem; border:1px solid var(--line)}
.viewers-chip{
  position:absolute; top:10px; right:10px;
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.26rem .6rem; border-radius:999px; font-weight:700; font-size:.75rem;
  color:#cfe4ff; background:rgba(15,21,32,.92); border:1px solid #2f3a52;
  opacity:.9; transform:translateY(-4px); transition:opacity .2s, transform .2s;
}
.pack-card:hover .viewers-chip{opacity:1; transform:translateY(0)}
.viewers-chip i{color:#9ad6ff}
.pack-title{font-family:"Sora", Manrope, system-ui; font-size:1.3rem; font-weight:800; margin:.6rem 0 .2rem}
.stars i{color:#f3c623}
.price-wrap .old{color:#9aa6ba; text-decoration:line-through; margin-right:.5rem}
.price-wrap .new{font-weight:900; font-size:1.35rem}
.low-stock{color:#ffd166; background:rgba(255,209,102,.08); border:1px dashed #ffd166; padding:.25rem .5rem; border-radius:.4rem; display:inline-flex; align-items:center; gap:.4rem}

/* Ribbon */
.ribbon{
  position:absolute; top:0; right:-40px; transform:rotate(35deg) translateY(8px);
  background:linear-gradient(90deg,#ffd861,#f0b90b); color:#111; font-weight:900; font-size:.8rem;
  padding:.35rem 2.25rem; box-shadow:0 8px 20px rgba(240,185,11,.25); letter-spacing:.05em;
}

/* Subtle stripes */
.stripes{background-image: repeating-linear-gradient(135deg, rgba(239,35,60,.06) 0, rgba(239,35,60,.06) 10px, transparent 10px, transparent 20px);}

/* ROADMAP */
.roadmap-hero{
  position:relative; overflow:hidden;
  background:
    linear-gradient(180deg, rgba(11,14,19,0.55), rgba(11,14,19,0.95)),
    url("https://images.unsplash.com/photo-1558470598-4ddc6b8bf0b0?q=80&w=1920&auto=format&fit=crop") center/cover no-repeat;
  border-top:1px solid #1a2231; border-bottom:1px solid #1a2231;
}

/* MODAL & STEPPER + Telegram */
.modal-content { background: var(--card); border: 1px solid var(--line); border-radius: 1rem; overflow:hidden }
.modal .btn-close { filter: invert(1); }
.modal-accent{height:6px; background:linear-gradient(90deg,var(--patriot-red),var(--patriot-blue))}
.copy-wrap .form-control{background:#0f1520; border:1px solid #273042; color:#e7ecf3}
.copy-wrap .form-control:focus{border-color:#3c4a64; box-shadow:none}
.stepper .step{display:flex; flex-direction:column; align-items:center; gap:.25rem; color:var(--muted)}
.stepper .step span{display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#0f1520; border:1px solid var(--line); font-weight:800}
.stepper .step.active{color:#fff}
.stepper .step.active span{border-color:rgba(240,185,11,.7); box-shadow:0 0 0 4px rgba(240,185,11,.12)}
.summary .old{color:#9aa6ba; text-decoration:line-through}
.summary .save{color:#8fec9a}
.tg-help{display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap}
.tg-caption{
  font-size:.95rem; color:#cfe4ff; background:#0f1725;
  border:1px solid #2f3a52; padding:.52rem .7rem; border-radius:.65rem
}
.tg-fab{
  display:inline-grid; place-items:center; width:46px; height:46px;
  border-radius:50%; background:radial-gradient(circle at 30% 30%, #3aa8ff, #1f6fe0);
  color:#fff; border:1px solid #2d4f8b; box-shadow:0 8px 24px rgba(0,0,0,.35);
  text-decoration:none; font-size:1.25rem;
}
.tg-fab:hover{filter:brightness(1.05)}

/* TIMELINE */
.timeline{position:relative; padding-left:1rem; margin-top:.5rem}
.timeline::before{content:""; position:absolute; left:12px; top:0; bottom:0; width:2px; background:linear-gradient(var(--patriot-blue),var(--patriot-red)); opacity:.5}
.tl-item{position:relative; padding-left:2.25rem; margin-bottom:1.25rem}
.tl-dot{position:absolute; left:4px; top:.35rem; width:.9rem; height:.9rem; border-radius:50%; background:linear-gradient(90deg,var(--patriot-red),var(--patriot-blue)); box-shadow:0 0 0 4px rgba(255,255,255,.08)}
.tl-card{background:var(--panel); border:1px solid var(--line); border-radius:.85rem; padding:.9rem 1rem}
.tl-now .tl-card{border-color:rgba(240,185,11,.55); box-shadow:0 16px 40px rgba(240,185,11,.08)}

/* TESTIMONIALS */
.testimonial{border-radius:1rem}
.avatar{width:56px; height:56px; border-radius:50%; object-fit:cover; border:1px solid var(--line)}

/* FAQ */
.faq-clean .accordion-button{background:var(--panel); color:var(--text); border-bottom:1px solid #1e2635; box-shadow:none}
.faq-clean .accordion-button:not(.collapsed){color:#fff; background:#111827}
.faq-clean .accordion-button:focus{box-shadow:none}
.faq-clean .accordion-body{color:var(--muted-2)}

/* Footer */
footer{background:#0a0d13}

/* AOS timing */
[data-aos]{transition-timing-function:cubic-bezier(.2,.8,.2,1)!important}

/* VALUE PITCH */
.value-card{
  position:relative; overflow:hidden; border:1px solid var(--line);
  background:
    radial-gradient(900px 300px at -10% -20%, rgba(59,130,246,.18), transparent 60%),
    radial-gradient(900px 300px at 110% -10%, rgba(239,35,60,.18), transparent 60%),
    var(--card);
  border-radius:1.25rem;
}
.value-card::before{
  content:""; position:absolute; inset:-2px; border-radius:inherit;
  background:conic-gradient(from 0deg, var(--patriot-red), var(--patriot-blue), var(--patriot-red));
  filter:blur(18px); opacity:.25; z-index:0;
}
.value-pill{
  position:relative; z-index:1; display:inline-flex; align-items:center; gap:.35rem;
  padding:.32rem .7rem; border-radius:999px; font-weight:800; font-size:.8rem;
  background:rgba(15,21,32,.9); border:1px solid #2f3a52; color:#cfe4ff;
}
.value-text{position:relative; z-index:1}
.value-points{position:relative; z-index:1}
.value-points li{color:var(--muted-2); display:flex; align-items:flex-start}
.value-points i{color:#8fec9a; margin-top:.15rem}
.hl{
  background:linear-gradient(180deg, rgba(240,185,11,.28), rgba(240,185,11,0) 70%);
  padding:0 .1rem; border-radius:.2rem;
}
.scarcity-meter{
  width:220px; height:10px; background:#0f1725; border:1px solid #2f3a52;
  border-radius:999px; overflow:hidden; position:relative;
}
.scarcity-meter span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg, var(--patriot-red), var(--patriot-blue));
  box-shadow:inset 0 0 14px rgba(240,185,11,.25);
  animation:fillMeter 1.4s ease forwards;
}
@keyframes fillMeter{from{width:0} to{width:var(--meter-width,78%)}}
.value-flag{
  position:absolute; inset:0; z-index:0; opacity:.08; pointer-events:none;
  background:url("https://images.unsplash.com/photo-1558470598-4ddc6b8bf0b0?q=80&w=1920&auto=format&fit=crop") center/cover no-repeat;
  mix-blend-mode:overlay;
}

/* ===== ENHANCEMENTS FOR YOUR 7 INSTRUCTIONS ===== */

/* Countdown visual boxes */
.countdown{
  display:flex; gap:.6rem; justify-content:flex-start; flex-wrap:wrap
}
.cd-box{
  background:#0f1725; border:1px solid #2f3a52; border-radius:.75rem;
  padding:.65rem .9rem; min-width:84px; text-align:center;
  box-shadow:0 8px 24px rgba(0,0,0,.25)
}
.cd-box .cd-val{display:block; font-weight:900; font-size:1.4rem; line-height:1}
.cd-box .cd-lbl{display:block; font-size:.75rem; color:var(--muted-2); margin-top:.2rem}

/* Clearer QR + address */
#qrcode canvas{width:220px!important; height:220px!important}
#btcAddress{
  font-weight:800; letter-spacing:.03em; text-align:center;
  background:#0f1725; border:1px solid #2f3a52; color:#e7ecf3
}
.input-group-text{background:#0f1725; border:1px solid #2f3a52; color:#cfe4ff}

/* Mobile polish */
@media (max-width: 575.98px){
  .hero{padding:5rem 0 4rem}
  .section{padding:3.75rem 0}
  .pack-title{font-size:1.15rem}
  .price-wrap .new{font-size:1.25rem}
  .cd-box{min-width:70px; padding:.5rem .7rem}
  .tg-caption{font-size:.95rem; width:100%}
}

/* Success flash for copy */
.btn.copied{animation:flash .75s ease}
@keyframes flash{0%{box-shadow:0 0 0 0 rgba(240,185,11,.7)} 100%{box-shadow:0 0 0 18px rgba(240,185,11,0)}}
