/* 2-SMT product page shared styles — matches main site design system */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --blue:#0B132B; --purple:#4A0E4E; --green:#004D40;
  --teal:#00BFA5; --gold:#FFD700; --white:#FFFFFF;
  --muted:rgba(255,255,255,0.55); --border:rgba(255,255,255,0.10);
  --bg:#0d1117;
}
html { scroll-behavior: smooth; }
body { font-family:'Inter',sans-serif; background:var(--bg); color:#fff; min-height:100vh; line-height:1.6; }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:999; display:flex; align-items:center; justify-content:space-between;
  padding:1rem 2.5rem; background:rgba(11,19,43,0.92); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); }
.nav-logo { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:900; letter-spacing:2px; color:#fff; text-decoration:none; }
.nav-logo em { color:var(--teal); font-style:normal; }
.nav-back { font-size:.85rem; color:var(--muted); text-decoration:none; transition:color .2s; }
.nav-back:hover { color:var(--teal); }
@media (max-width:600px){ nav{ padding:.85rem 1.25rem; } .nav-logo{ font-size:1.25rem; } }

/* HERO */
.hero { min-height:78vh; display:flex; flex-direction:column; justify-content:center; padding:8rem 2rem 5rem;
  background:linear-gradient(140deg, var(--blue) 0%, #16093a 60%, var(--purple) 100%); position:relative; }
.hero::after { content:''; position:absolute; bottom:0; left:0; right:0; height:120px; background:linear-gradient(transparent, var(--bg)); }
.hero-inner { max-width:840px; margin:0 auto; text-align:center; position:relative; z-index:2; }
.tier-badge { display:inline-block; font-family:'Roboto Mono',monospace; font-size:.7rem; letter-spacing:3px; text-transform:uppercase;
  padding:.4rem 1rem; border-radius:99px; margin-bottom:1.5rem; }
.tier-badge.tier-free { background:rgba(0,191,165,.15); border:1px solid rgba(0,191,165,.4); color:var(--teal); }
.tier-badge.tier-1 { background:rgba(206,147,216,.12); border:1px solid rgba(206,147,216,.35); color:#CE93D8; }
.tier-badge.tier-2 { background:rgba(0,191,165,.12); border:1px solid rgba(0,191,165,.35); color:var(--teal); }
.tier-badge.tier-3 { background:rgba(155,89,182,.12); border:1px solid rgba(155,89,182,.35); color:#bb86fc; }
.tier-badge.tier-4 { background:rgba(255,215,0,.12); border:1px solid rgba(255,215,0,.4); color:var(--gold); }
.tier-badge.tier-5 { background:rgba(0,191,165,.18); border:1px solid var(--teal); color:var(--teal); }
.hero h1 { font-family:'Playfair Display',serif; font-size:clamp(2.2rem, 6vw, 4.4rem); font-weight:900; line-height:1.1; margin-bottom:1.25rem; }
.hero h1 em { color:var(--teal); font-style:italic; }
.hero-sub { font-size:1.05rem; color:var(--muted); max-width:560px; margin:0 auto 2.5rem; line-height:1.8; }
.price-line { font-family:'Playfair Display',serif; font-size:clamp(1.8rem, 4vw, 2.6rem); font-weight:700; color:var(--teal); margin-bottom:.5rem; }
.price-line .strike { font-size:.6em; color:rgba(255,255,255,.3); text-decoration:line-through; margin-right:.5rem; }
.price-sub { font-size:.85rem; color:var(--muted); margin-bottom:2rem; }

/* CTA buttons */
.btn { display:inline-block; padding:1rem 2.4rem; border-radius:6px; font-weight:700; font-size:.95rem; letter-spacing:.5px;
  text-decoration:none; cursor:pointer; transition:all .2s; border:none; }
.btn-stripe { background:#635bff; color:#fff; box-shadow:0 4px 14px rgba(99,91,255,.35); }
.btn-stripe:hover { background:#7773ff; transform:translateY(-2px); box-shadow:0 8px 24px rgba(99,91,255,.45); }
.btn-success { background:var(--teal); color:#0B132B; box-shadow:0 4px 14px rgba(0,191,165,.35); }
.btn-success:hover { background:#26d4ba; transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,191,165,.45); }
.btn-outline { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.4); }
.btn-outline:hover { border-color:var(--teal); color:var(--teal); }
.btn-gold { background:var(--gold); color:#0B132B; box-shadow:0 4px 14px rgba(255,215,0,.3); }
.btn-gold:hover { background:#ffe340; transform:translateY(-2px); box-shadow:0 8px 24px rgba(255,215,0,.4); }
.btn-large { padding:1.2rem 3rem; font-size:1rem; }
.btn-row { display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; }
.secure-note { font-family:'Roboto Mono',monospace; font-size:.7rem; letter-spacing:1.5px; color:rgba(255,255,255,.35); margin-top:1rem; }

/* CONTENT SECTIONS */
section { padding:5rem 2rem; }
.container { max-width:880px; margin:0 auto; }
.eyebrow { font-family:'Roboto Mono',monospace; font-size:.72rem; letter-spacing:3px; text-transform:uppercase; color:var(--teal); margin-bottom:1rem; }
.s-title { font-family:'Playfair Display',serif; font-size:clamp(1.6rem, 3.5vw, 2.4rem); font-weight:700; line-height:1.2; margin-bottom:1.25rem; }
.s-sub { font-size:.95rem; color:var(--muted); max-width:560px; line-height:1.75; margin-bottom:2.5rem; }

#whats-inside { background:var(--blue); }
.bullet-list { list-style:none; display:flex; flex-direction:column; gap:1.1rem; max-width:680px; margin:0 auto; }
.bullet-list li { display:flex; gap:1rem; font-size:.98rem; line-height:1.7; color:rgba(255,255,255,.85); padding:1.15rem 1.25rem; background:rgba(255,255,255,.03);
  border:1px solid var(--border); border-left:3px solid var(--teal); border-radius:6px; }
.bullet-list li::before { content:'▸'; color:var(--teal); font-size:1.2rem; flex-shrink:0; line-height:1; padding-top:2px; }
.bullet-list strong { color:#fff; display:block; margin-bottom:.25rem; }

#price { background:#111827; text-align:center; }
.price-card { max-width:480px; margin:0 auto; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:12px; padding:3rem 2.5rem; }
.price-card .price-line { margin-bottom:.75rem; }

#faq { background:var(--bg); }
.faq-item { background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:6px; padding:1.25rem 1.5rem; margin-bottom:1rem; }
.faq-item h3 { font-family:'Playfair Display',serif; font-size:1.05rem; margin-bottom:.6rem; color:#fff; }
.faq-item p { font-size:.88rem; color:var(--muted); line-height:1.7; }

/* FOOTER */
footer { background:#000; padding:2.5rem 2rem; border-top:1px solid var(--border); text-align:center; }
.foot-promise { display:inline-block; background:rgba(0,191,165,.1); border:1px solid rgba(0,191,165,.3); border-radius:99px;
  padding:.4rem 1rem; font-size:.72rem; letter-spacing:2px; color:var(--teal); margin-bottom:1.25rem; }
footer p { font-size:.78rem; color:rgba(255,255,255,.35); line-height:1.7; }
footer a { color:rgba(255,255,255,.55); text-decoration:none; transition:color .2s; }
footer a:hover { color:var(--teal); }

/* SUCCESS PAGE specific */
.success-hero { min-height:65vh; }
.success-icon { width:80px; height:80px; border-radius:50%; background:rgba(0,191,165,.15); border:3px solid var(--teal);
  display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem; font-size:2.5rem; color:var(--teal); }
.download-card { max-width:520px; margin:3rem auto; background:linear-gradient(140deg,#16093a 0%,var(--blue) 100%);
  border:1px solid var(--teal); border-radius:12px; padding:2.5rem; text-align:center; }
.download-card h3 { font-family:'Playfair Display',serif; font-size:1.4rem; margin-bottom:1rem; }
.download-card p { color:var(--muted); margin-bottom:1.5rem; font-size:.92rem; }
.next-steps { max-width:680px; margin:0 auto; }
.step { display:flex; gap:1.25rem; padding:1.5rem; background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:6px; margin-bottom:1rem; }
.step-num { width:36px; height:36px; flex-shrink:0; background:var(--teal); color:#0B132B; border-radius:50%; display:flex; align-items:center;
  justify-content:center; font-weight:700; font-family:'Playfair Display',serif; }
.step-body { flex:1; }
.step-body h4 { font-family:'Playfair Display',serif; font-size:1.05rem; margin-bottom:.4rem; }
.step-body p { font-size:.88rem; color:var(--muted); line-height:1.65; }

/* RESPONSIVE */
@media (max-width:600px) {
  section { padding:3.5rem 1.25rem; }
  .hero { padding:7rem 1.25rem 4rem; }
  .price-card { padding:2rem 1.5rem; }
  .download-card { padding:2rem 1.25rem; margin:2rem 1rem; }
  .btn-large { padding:1rem 2rem; }
  .step { padding:1.25rem; }
}