:root{
  --bg:#07080b;
  --text:#eef0f4;
  --muted:#9aa3b2;
  --line:rgba(255,255,255,.08);
  --gold:#d4af37;
  --gold-2:#f2d473;
  --accent:#7b5cff;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; color:var(--text);
  font-family:Outfit,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  line-height:1.55; letter-spacing:.2px;
  background:
    radial-gradient(1000px 500px at 70% -10%, rgba(123,92,255,.25), transparent 60%),
    radial-gradient(800px 400px at 20% -20%, rgba(212,175,55,.18), transparent 55%),
    radial-gradient(1400px 900px at 50% 110%, rgba(123,92,255,.14), transparent 60%),
    var(--bg);
}
.starfield{position:fixed; inset:0; pointer-events:none; background:
  radial-gradient(1px 1px at 10% 20%, #fff8 60%, transparent 61%),
  radial-gradient(1px 1px at 30% 80%, #fff6 60%, transparent 61%),
  radial-gradient(1px 1px at 70% 30%, #fff7 60%, transparent 61%),
  radial-gradient(1px 1px at 85% 60%, #fff5 60%, transparent 61%);
  opacity:.35; filter:blur(.2px)
}
.wrap{min-height:100dvh; display:grid; place-items:center; padding:32px}
.shell{
  width:min(1100px,100%); padding:clamp(24px,3.6vw,44px); border-radius:28px; position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border:1px solid var(--line);
  box-shadow:0 10px 40px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.02);
}
.top{display:flex; align-items:center; gap:18px}
.logo{width:72px; height:72px; border-radius:18px; overflow:hidden; box-shadow:0 0 0 2px rgba(212,175,55,.24), 0 12px 30px rgba(212,175,55,.22)}
.brand h1{margin:0; font-size:clamp(28px,4.6vw,44px); letter-spacing:.3px}
.brand .tag{color:var(--muted)}
.hero{margin-top:22px; display:grid; gap:12px}
.headline{font-size:clamp(26px,4.2vw,40px); font-weight:700}
.subtitle{color:var(--muted); max-width:70ch}
.cta-row{margin-top:16px; display:flex; gap:12px; flex-wrap:wrap}
input[type=email]{
  flex:1; min-width:240px; padding:14px 16px; border-radius:14px; border:1px solid var(--line);
  background:#0e1118; color:#fff; outline:none; font-size:16px;
}
input[type=email]::placeholder{color:#8f96a3}
.btn{appearance:none; cursor:pointer; border:0; border-radius:14px; padding:14px 18px; font-weight:800; font-size:16px}
.btn-primary{background:linear-gradient(180deg, var(--gold-2), var(--gold)); color:#121212; box-shadow:0 10px 30px rgba(212,175,55,.35)}
.btn-ghost{background:transparent; color:var(--text); border:1px solid var(--line)}
.legal{margin-top:10px; color:#8d96a6; font-size:13px}
.divider{height:1px; background:linear-gradient(90deg, transparent, var(--line), transparent); margin:26px 0}
.ebook{display:flex; gap:18px; align-items:center; background:rgba(255,255,255,.03); border:1px solid var(--line); padding:16px; border-radius:16px}
.cover{width:68px; height:90px; border-radius:10px; background:linear-gradient(180deg,#2b2b2b,#141414); border:1px solid rgba(255,255,255,.08); display:grid; place-items:center; font-weight:800; color:var(--gold)}
.ebook h3{margin:0 0 4px 0; font-size:19px}
.ebook p{margin:0; color:#b9c1cf; font-size:14px}
footer{margin-top:26px; color:#8fa0b6; font-size:13px; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap}
a{color:var(--gold-2)}
/* Social links */
.social{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.social a{display:inline-flex; align-items:center; gap:8px; text-decoration:none; padding:8px 10px; border-radius:10px; border:1px solid rgba(255,255,255,.12)}
.social svg{width:18px; height:18px; fill:currentColor}
.social a:hover{background:rgba(255,255,255,.06)}
@media (max-width:560px){
  .top{flex-direction:column; align-items:flex-start}
  .cta-row{flex-direction:column}
}