/* =============================================================
   destinio · Landing "Destinos Inteligentes"
   Hoja compartida por las TRES versiones: ES · PT · EN.

   ⚠ POR QUE EXISTE ESTE ARCHIVO
   Si cada idioma lleva su CSS inline, en tres semanas son tres disenos
   distintos: alguien toca el espanol, nadie toca el portugues, y el
   brasileno ve una version vieja de la marca. Un solo archivo, un solo
   diseno. Si cambia, cambia para los tres a la vez.
   ============================================================= */

:root{
  --bg:#08080d;--panel:#12121b;--panel2:#191924;--line:rgba(255,255,255,.12);--line2:rgba(255,255,255,.07);
  --tx:#fff;--muted:rgba(255,255,255,.72);--dim:rgba(255,255,255,.45);
  --em:#10b981;--em2:#2dd4bf;--on:#04120c;--soft:rgba(16,185,129,.12);--softb:rgba(16,185,129,.34);
  /* AMBAR = solo cumplimiento (Ley 21.719). Nunca decorativo. */
  --amber:#f59e0b;--amber2:#fbbf24;--amberbg:rgba(245,158,11,.12);--amberb:rgba(245,158,11,.36);
  --ft:Poppins,sans-serif;--fb:Inter,sans-serif;--fm:'JetBrains Mono',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--bg);color:var(--tx);line-height:1.6}
.wrap{max-width:1180px;margin:0 auto;padding:0 26px}
a{color:inherit}

/* ---- NAV · la misma del portal. Una sola nav en todo el sitio. ---- */
nav{position:sticky;top:0;z-index:80;background:rgba(8,8,13,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line2)}
nav .wrap{display:flex;align-items:center;gap:18px;padding:13px 26px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--ft);font-weight:900;font-size:18px;text-decoration:none}
.logo i{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--em),var(--em2));display:grid;place-items:center;font-style:normal;color:var(--on);font-weight:900;font-size:15px}
.logo b{color:var(--em2)}
nav .lk{display:flex;gap:16px;margin-left:auto}
nav a.l{color:var(--dim);text-decoration:none;font-size:13px;font-weight:600;white-space:nowrap}
nav a.l:hover{color:#fff}
nav a.l.is-current{color:#fff}
nav .lang{display:flex;gap:4px;margin-left:18px}
nav .lang a{font-family:var(--ft);font-weight:800;font-size:11px;color:var(--dim);text-decoration:none;padding:5px 9px;border-radius:7px}
nav .lang a:hover{color:#fff}
nav .lang a.is-selected{background:var(--em);color:var(--on)}
nav .navlink{color:var(--muted);text-decoration:none;font-size:13px;font-weight:600;white-space:nowrap;margin-left:14px}
nav .navlink:hover{color:#fff}
nav .cta{background:var(--em);color:var(--on);text-decoration:none;font-family:var(--ft);font-weight:800;font-size:12.5px;padding:9px 15px;border-radius:9px;white-space:nowrap;margin-left:14px}
@media(max-width:1180px){nav .lk{display:none}}
@media(max-width:640px){nav .lang,nav .navlink{display:none}}

/* ---- Barra secundaria · anclas de la seccion ---- */
.subnav{position:sticky;top:56px;z-index:70;background:rgba(8,8,13,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line2)}
.subnav .wrap{display:flex;gap:18px;padding:10px 26px;overflow-x:auto;scrollbar-width:none}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{color:var(--dim);text-decoration:none;font-size:12.5px;font-weight:600;white-space:nowrap}
.subnav a:hover{color:var(--em2)}

/* ---- HERO ---- */
.hero{padding:64px 0 46px;background:radial-gradient(1200px 520px at 82% -14%,rgba(16,185,129,.18),transparent 60%)}
.kick{display:inline-flex;gap:8px;align-items:center;font-family:var(--ft);font-weight:800;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--em2);border:1px solid var(--softb);background:var(--soft);border-radius:999px;padding:6px 14px;margin-bottom:20px}
h1{font-family:var(--ft);font-size:clamp(30px,4.5vw,52px);font-weight:900;line-height:1.04;letter-spacing:-.032em;max-width:1000px}
h1 span{color:var(--em2)}
.hsub{font-size:18px;color:var(--muted);max-width:760px;margin-top:20px}.hsub b{color:#fff}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{font-family:var(--ft);font-weight:800;font-size:14px;padding:13px 22px;border-radius:11px;text-decoration:none;display:inline-block}
.btn.p{background:var(--em);color:var(--on)}
.btn.g{background:var(--panel2);border:1px solid var(--line);color:#fff}
.hpills{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px;padding-top:22px;border-top:1px solid var(--line2)}
.hpill{font-family:var(--fm);font-size:10.5px;font-weight:700;color:var(--dim);background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:7px 12px}
.hpill b{color:var(--em2)}
.hpill.am{border-color:var(--amberb);background:var(--amberbg)}.hpill.am b{color:var(--amber2)}

/* ---- SECCIONES ---- */
section{padding:54px 0;border-top:1px solid var(--line2)}
.eyebrow{font-family:var(--ft);font-weight:800;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--em2);margin-bottom:11px}
.eyebrow.am{color:var(--amber2)}
h2{font-family:var(--ft);font-size:clamp(24px,3.2vw,37px);font-weight:900;line-height:1.12;letter-spacing:-.028em;margin-bottom:12px}
h2 span{color:var(--em2)}h2 span.am{color:var(--amber2)}
.lead{font-size:16.5px;color:var(--muted);max-width:900px;line-height:1.65}.lead b{color:#fff}
.grid{display:grid;gap:15px;margin-top:26px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:21px}
.card .e{font-size:24px;margin-bottom:10px;display:block}
.card h4{font-family:var(--ft);font-size:16px;font-weight:800;margin-bottom:7px}
.card p{font-size:13.5px;color:var(--muted);line-height:1.55}.card p b{color:#fff}
.card .val{margin-top:12px;padding-top:10px;border-top:1px solid var(--line2);font-family:var(--fm);font-size:10.5px;font-weight:700;color:var(--em2)}
.card.ok{background:var(--soft);border-color:var(--softb)}.card.ok h4{color:var(--em2)}
.card.am{background:var(--amberbg);border-color:var(--amberb)}.card.am h4{color:var(--amber2)}.card.am .val{color:var(--amber2)}
.callout{margin-top:24px;border-left:4px solid var(--em);background:var(--soft);border-radius:0 14px 14px 0;padding:19px 24px}
.callout p{font-family:var(--ft);font-size:17px;font-weight:800;color:#fff;line-height:1.4}.callout p span{color:var(--em2)}
.callout .d{font-weight:400;font-size:14px;color:var(--muted);margin-top:8px;line-height:1.6;display:block}.callout .d b{color:#fff}
.note{font-size:12.5px;color:var(--dim);margin-top:14px;line-height:1.6;max-width:960px}.note b{color:var(--muted)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:19px;text-align:center}
.kpi.hot{background:var(--soft);border-color:var(--em)}
.kpi .v{font-family:var(--ft);font-size:24px;font-weight:900;color:#fff;letter-spacing:-.02em}.kpi.hot .v{color:var(--em2)}
.kpi .l{font-size:11.5px;color:var(--dim);margin-top:7px;line-height:1.4}

/* ---- FAQ ---- */
.faq{margin-top:24px;display:flex;flex-direction:column;gap:10px}
details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:2px 18px}
summary{font-family:var(--ft);font-weight:700;font-size:15px;padding:15px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";color:var(--em2);font-weight:900;font-size:20px}
details[open] summary:after{content:"–"}
details p{font-size:14px;color:var(--muted);padding:0 0 16px;line-height:1.6;max-width:920px}

/* ---- FORMULARIO ---- */
.form-sec{background:radial-gradient(900px 400px at 50% 120%,rgba(16,185,129,.14),transparent)}
form{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;max-width:720px;margin-top:24px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
label{font-size:12px;font-weight:600;color:var(--dim);display:block;margin:12px 0 5px}
input,select,textarea{width:100%;background:#0c0c14;border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:#fff;font-family:var(--fb);font-size:14px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--em)}
/* El consentimiento NUNCA viene premarcado. Requisito legal, no preferencia. */
.consent{display:flex;gap:10px;align-items:flex-start;margin-top:16px;font-size:12.5px;color:var(--muted);line-height:1.5}
.consent input{width:18px;height:18px;flex-shrink:0;margin-top:2px}
.form-btn{margin-top:16px;width:100%;background:var(--em);color:var(--on);border:0;font-family:var(--ft);font-weight:800;font-size:15px;padding:14px;border-radius:11px;cursor:pointer}
.form-btn:disabled{opacity:.6;cursor:wait}
.legal{font-size:11px;color:var(--dim);margin-top:12px;line-height:1.5}
/* Honeypot · invisible para la persona, irresistible para el bot */
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden}

footer{border-top:1px solid var(--line2);padding:34px 0;color:var(--dim);font-size:12.5px}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
footer b{color:var(--em2)}
footer a{color:var(--dim);text-decoration:none}footer a:hover{color:#fff}

@media(max-width:860px){.g2,.g3,.g4,.kpis,.frow{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}}
