/* ====== Base (accessibility-first) ====== */
* { box-sizing: border-box; }
html:focus-within { scroll-behavior: smooth; }
html, body { margin: 0; padding: 0; }
:root{
  --bg:#0b0f14; --panel:#121821; --muted:#8aa0b2; --text:#e8f0f7;
  --brand1:#7dd3fc; --brand2:#60a5fa; --accent:#22d3ee;
  --success:#34d399; --error:#fb7185; --glass:rgba(255,255,255,0.06);
  --border:rgba(255,255,255,0.12); --shadow:0 8px 30px rgba(0,0,0,0.45);
  --radius:16px;
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
body{
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background: radial-gradient(1200px 600px at 70% -10%, rgba(96,165,250,0.15), transparent),
              radial-gradient(1200px 600px at -10% 20%, rgba(125,211,252,0.15), transparent),
              var(--bg);
  color:var(--text); line-height:1.6;
}
.container{ width:min(1100px,92%); margin:0 auto; }

/* Skip link */
.skip-link{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus{ position:fixed; left:16px; top:16px; width:auto; height:auto; background:var(--accent); color:#00111f; padding:8px 12px; border-radius:12px; box-shadow:var(--shadow); z-index:1000; }

/* Header */
.site-header{ position:sticky; top:0; z-index:50; background:rgba(11,15,20,0.7); backdrop-filter: blur(10px); border-bottom:1px solid var(--border); }
.header-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); font-weight:700; }
.brand .logo{ width:30px; height:30px; }
.nav a{ color:var(--text); text-decoration:none; margin:0 10px; opacity:.9; }
.nav a.btn-sm{ padding:8px 12px; border:1px solid var(--border); border-radius:12px; }
.menu-button{ display:none; background:none; border:0; width:40px; height:40px; }
.menu-button span{ display:block; height:2px; background:var(--text); margin:7px 0; border-radius:2px; }

/* Focus styles */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:2px;
  border-radius:10px;
}

/* Hero */
.hero{ padding:72px 0 40px; }
.hero-grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:28px; align-items:stretch; }
.hero-copy h1{ font-size:clamp(28px,5vw,46px); line-height:1.1; margin:0 0 10px; }
.grad{ background:linear-gradient(90deg, var(--brand1), var(--brand2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.bullets{ padding-left:16px; }
.cta-row{ display:flex; gap:12px; margin-top:14px; }
.btn{ background:linear-gradient(90deg, var(--brand1), var(--brand2)); color:#00111f; border:0; padding:12px 16px; border-radius:12px; font-weight:700; text-decoration:none; display:inline-block; box-shadow:var(--shadow); }
.btn.ghost{ background:transparent; color:var(--text); border:1px solid var(--border); box-shadow:none; }
.btn-full{ width:100%; }

.disclaimer{ font-size:12px; color:var(--muted); margin-top:12px; }

.glass{ background:var(--glass); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.hero-card{ padding:18px; }
.card-head h3{ margin:0 0 4px; }
.form{ display:flex; flex-direction:column; gap:8px; }
.form input,.form select{ background:#0e141b; color:var(--text); border:1px solid var(--border); border-radius:12px; padding:10px 12px; }
.resultado{ min-height:18px; font-weight:600; }

/* Sections */
section{ padding:52px 0; }
section h2{ font-size:28px; margin:0 0 16px; }

.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.step{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:16px; }
.step-number{ width:32px; height:32px; display:grid; place-items:center; border-radius:8px; background:linear-gradient(90deg, var(--brand1), var(--brand2)); color:#00111f; font-weight:800; box-shadow:var(--shadow); }

.coin-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.coin{ background:var(--panel); border:1px solid var(--border); padding:14px; border-radius:14px; }

.plan-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.plan{ background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:18px; position:relative; }
.plan .price{ font-size:22px; font-weight:800; margin:8px 0 12px; }
.plan.featured{ outline:2px solid var(--accent); transform:translateY(-4px); }
.plan .badge{ position:absolute; top:-12px; right:12px; background:var(--accent); color:#00212b; font-weight:800; padding:4px 8px; border-radius:10px; }

.fine{ color:var(--muted); font-size:12px; margin-top:8px; }

.row{ display:grid; grid-template-columns:1.2fr 1fr 1fr 0.8fr auto; gap:12px; align-items:end; }
.col{ display:flex; flex-direction:column; gap:6px; }

.faq details{ background:var(--panel); border:1px solid var(--border); padding:12px 16px; border-radius:14px; margin-bottom:10px; }
.faq summary{ cursor:pointer; }

/* Footer */
.site-footer{ border-top:1px solid var(--border); padding:28px 0; }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr; align-items:center; }
.brand.foot span{ font-weight:800; }
.foot-links a{ color:var(--text); text-decoration:none; margin:0 10px; }

/* Responsive */
@media (max-width: 980px){
  .hero-grid{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .coin-grid{ grid-template-columns:repeat(2,1fr); }
  .plan-grid{ grid-template-columns:1fr; }
  .row{ grid-template-columns:1fr; }
  .nav{ display:none; }
  .menu-button{ display:block; }
  .nav.open{ display:flex; flex-direction:column; position:absolute; top:62px; right:4%; background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:10px; }
}

/* Utility */
.muted{ color:var(--muted); }
.small{ font-size:12px; color:var(--muted); }