:root{--bg:#0b1220;--surface:#0f172a;--muted:#12233d;--accent:#3b82f6;--accent2:#06b6d4;--text:#e6eefb}
*{box-sizing:border-box}
body{margin:0;font-family:'Outfit',system-ui,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(1000px 500px at 10% 10%,#0d1a34,#0b1220),var(--bg);color:var(--text)}
.wrap{max-width:1200px;margin:0 auto}
.topbar{position:sticky;top:0;z-index:10;background:rgba(13,26,52,.65);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06)}
.topbar .inner{display:flex;align-items:center;justify-content:space-between;padding:10px 18px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:44px;object-fit:contain}
.brand span{font-weight:700;letter-spacing:.4px}
.cta{display:inline-flex;align-items:center;gap:8px;padding:.7rem 1rem;border-radius:10px;background:linear-gradient(90deg,var(--accent),var(--accent2));color:#fff;text-decoration:none;box-shadow:0 8px 24px rgba(59,130,246,.35);transition:.25s}
.cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(6,182,212,.35)}
.split{display:grid;grid-template-columns:1.15fr 1fr;min-height:78vh;position:relative;z-index:0}
.left{display:flex;align-items:center;justify-content:center;padding:60px 28px}
.left .content{max-width:640px}
.kicker{color:#a3c8ff;text-transform:uppercase;letter-spacing:.2em;font-size:.78rem}
h1{font-size:clamp(2rem,4.2vw,3.6rem);line-height:1.08;margin:.3rem 0;background:linear-gradient(180deg,#fff,#cfe6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:#c9defb;font-size:1.05rem}
.right{position:relative;overflow:hidden}
.bgimg{position:absolute;inset:0;background:url('../img/fondo.jpg') center/cover no-repeat;z-index:0}
.bgmask{position:absolute;inset:0;background:linear-gradient(135deg,rgba(9,18,33,.1),rgba(9,18,33,.75) 55%,rgba(9,18,33,.92));mix-blend-mode:multiply;z-index:0}
.wave{position:absolute;left:-60px;bottom:-1px;width:140%;height:160px;background:radial-gradient(60% 100% at 50% 0,rgba(6,182,212,.28),rgba(59,130,246,.12) 60%,transparent 65%);z-index:0}
.section{background:linear-gradient(180deg,var(--surface),#0b1529);border:1px solid #14203a;border-radius:22px;overflow:hidden;box-shadow:0 28px 80px rgba(0,0,0,.45);margin:0 auto 40px;position:relative;z-index:2}
.grid{display:grid;grid-template-columns:1.2fr .8fr;gap:0}
.panel{padding:28px 28px 40px}
.panelA{background:linear-gradient(125deg,#0e1f3a,#0b162b)}
.panelB{background:linear-gradient(125deg,#0b162b,#0e1f3a)}
.panel h2{margin:0 0 10px;font-size:1.2rem;color:#7cc3ff}
.lead{font-size:1.08rem;line-height:1.75;color:#dbe9ff}
.muted{font-size:1.02rem;line-height:1.75;color:#c8d8f5}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:24px;background:linear-gradient(90deg,rgba(59,130,246,.12),rgba(6,182,212,.08))}
.card{background:#0d1a34;border:1px solid #1a335c;border-radius:16px;padding:18px;transform:translateY(10px) scale(.98);opacity:0;transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .6s}
.card h3{margin:0 0 .4rem;color:#94caff;font-size:1rem}
.card p{margin:0;color:#cfe2ff;font-size:.95rem}
.foot{padding:34px;text-align:center;color:#a4c3e9}
.tilt{transition:transform .15s}
@media (max-width:980px){.split{grid-template-columns:1fr}.grid{grid-template-columns:1fr}.panel{padding:22px}.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cards{grid-template-columns:1fr}.brand img{height:38px}}