*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#0a0a0a; --bg2:#111; --bg3:#181818;
  --border:rgba(255,255,255,0.07);
  --orange:#f7931a; --orange-dim:rgba(247,147,26,0.12); --orange-glow:rgba(247,147,26,0.25);
  --text:#e8e8e8; --text-muted:#666; --text-dim:#999;
  --radius:12px;
}
body{font-family:'Sora',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%}

/* HEADER */
header{position:sticky;top:0;z-index:100;background:rgba(10,10,10,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.header-inner{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:20px}
.logo{display:flex;align-items:center;flex-shrink:0}
nav{display:flex;align-items:center;gap:2px;margin-left:26px}
nav>a{padding:6px 14px;font-size:13px;font-weight:500;color:var(--text-dim);border-radius:6px;transition:color .2s,background .2s;position:relative}
nav>a:hover{color:#fff;background:rgba(255,255,255,.06)}
.nav-item{position:relative;display:inline-flex}
.nav-item>a{padding:6px 14px;font-size:13px;font-weight:500;color:var(--text-dim);border-radius:6px;transition:color .2s,background .2s}
.nav-item>a:hover{color:#fff;background:rgba(255,255,255,.06)}
.dropdown{position:absolute;top:100%;left:0;background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:8px;min-width:180px;padding:6px 0;display:none}
.nav-item:hover .dropdown{display:block;z-index:200}
.dropdown a{display:block;padding:9px 18px;font-size:13px;color:#ccc}
.dropdown a:hover{color:var(--orange);background:rgba(247,147,26,.08)}
.header-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.btn-support{padding:7px 16px;font-size:13px;font-weight:600;color:#000;background:var(--orange);border-radius:20px}
.nav-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.nav-toggle span{width:22px;height:2px;background:var(--text);border-radius:2px;transition:.25s}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* LAYOUT */
.wrap{max-width:940px;margin:0 auto;padding:0 24px}
section{padding:56px 0}
h1{font-size:clamp(34px,5.4vw,52px);font-weight:800;line-height:1.1;letter-spacing:-.02em}
h2{font-size:clamp(22px,3vw,28px);font-weight:700;letter-spacing:-.01em;margin-bottom:22px}
h3{font-size:16px;font-weight:600;margin-bottom:6px}
p{color:var(--text-dim)}
.label{display:inline-block;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin-bottom:14px}

/* HERO */
.hero{padding:64px 0 44px;border-bottom:1px solid var(--border);background:radial-gradient(900px 380px at 50% -12%,var(--orange-dim),transparent 70%)}
.hero-top{display:flex;gap:26px;align-items:center;flex-wrap:wrap}
.hero-icon{width:104px;height:104px;border-radius:24px;box-shadow:0 16px 44px rgba(0,0,0,.55)}
.hero p.lead{font-size:18px;color:var(--text-dim);margin-top:12px;max-width:620px}
.byline{font-size:13px;color:var(--text-muted);margin-top:16px}
.byline a{color:var(--orange)}
.cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:26px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 24px;border-radius:30px;font-size:15px;font-weight:600;transition:.2s}
.btn-primary{background:var(--orange);color:#000}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px var(--orange-glow)}
.btn-ghost{border:1px solid rgba(255,255,255,.16);color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.06)}
.meta{font-size:12.5px;color:var(--text-muted);font-family:'Space Mono',monospace}

/* TARJETAS */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:22px}
.card .ico{font-size:22px;margin-bottom:10px;display:block}
.card p{font-size:14px}

/* PASOS */
.steps{counter-reset:paso;display:grid;gap:14px}
.step{position:relative;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px 20px 62px}
.step::before{counter-increment:paso;content:counter(paso);position:absolute;left:20px;top:19px;width:26px;height:26px;border-radius:50%;background:var(--orange);color:#000;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}
.step p{font-size:14px;margin-top:4px}
.step code,code{font-family:ui-monospace,'SF Mono',Menlo,'Segoe UI Symbol',monospace;font-size:12.5px;background:var(--bg3);border:1px solid var(--border);padding:2px 6px;border-radius:5px;color:var(--orange);white-space:nowrap}

/* AVISO */
.nota{display:flex;gap:12px;background:var(--orange-dim);border:1px solid rgba(247,147,26,.28);border-radius:var(--radius);padding:18px 20px;margin-top:18px}
.nota strong{color:var(--orange)}
.nota p{color:var(--text);font-size:14px}

/* TABLA */
table{width:100%;border-collapse:collapse;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
th,td{text-align:left;padding:13px 18px;font-size:14px;border-bottom:1px solid var(--border)}
th{background:var(--bg3);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);font-weight:600}
tr:last-child td{border-bottom:none}
td:first-child{white-space:nowrap;font-family:ui-monospace,'SF Mono',Menlo,'Segoe UI Symbol',monospace;font-size:15px;color:var(--orange);width:150px}

footer{border-top:1px solid var(--border);padding:38px 24px;text-align:center;color:var(--text-muted);font-size:13px}
.footer-logo{font-weight:800;font-size:18px;color:var(--text);margin-bottom:8px}
.footer-logo span{color:var(--orange)}

@media(max-width:1200px) and (min-width:821px){
  nav>a,.nav-item>a{padding:6px 9px;font-size:12.5px}
}
@media(max-width:820px){
  .nav-item{display:block;width:100%}
  .nav-item>a{display:block;padding:12px 16px;font-size:15px;color:var(--text)}
  nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;background:var(--bg2);border-bottom:1px solid var(--border);padding:12px 16px 20px;gap:2px}
  nav.open{display:flex}
  nav>a{padding:12px 16px;font-size:15px;color:var(--text)}
  .dropdown{display:block;position:static;background:transparent;border:none;padding:4px 0 4px 16px;min-width:0}
  .dropdown a{padding:8px 12px;font-size:14px;color:var(--text-dim)}
  .nav-toggle{display:flex}
  .header-right .btn-support{display:none}
  td:first-child{width:auto}
}
