:root {
  --azul: #0c2340;
  --primario: #2875ed;
  --fondo: #f3f7fc;
  --texto: #243b58;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--texto);
  background: var(--fondo);
}

a { text-decoration: none; }

.contenedor {
  width: min(1120px, 90%);
  margin: auto;
}

.portada {
  background: linear-gradient(125deg, #0c2340, #154b89);
  color: white;
}

.barra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 0;
  gap: 20px;
}

.marca {
  color: white;
  font-size: 22px;
  font-weight: bold;
}

.marca span { color: #71b5ff; }

nav { display: flex; gap: 25px; }

nav a { color: #d7e8ff; font-size: 14px; }

nav a:hover { color: white; }

.hero {
  padding: 95px 0 115px;
  max-width: 750px;
}

.etiqueta {
  color: #96c3ff;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: bold;
}

h1 {
  font-size: clamp(36px, 6vw, 62px);
  line-height: 1.1;
  margin: 18px 0;
  letter-spacing: -1.5px;
}

.hero p {
  font-size: 19px;
  line-height: 1.7;
  color: #d5e3f3;
  max-width: 650px;
}

.boton {
  display: inline-block;
  background: var(--primario);
  color: white;
  padding: 16px 25px;
  border-radius: 9px;
  font-weight: bold;
  margin-top: 22px;
}

.boton:hover { background: #165ccc; }

.seccion {
  padding: 75px 0;
  text-align: center;
}

.seccion h2 {
  font-size: clamp(25px, 4vw, 34px);
  color: var(--azul);
  margin: 0 0 15px;
}

.subtitulo {
  color: #61748c;
  line-height: 1.7;
  max-width: 680px;
  margin: 0 auto 35px;
}

.tarjetas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  text-align: left;
}

.tarjeta {
  background: white;
  border: 1px solid #e2eaf5;
  padding: 28px;
  border-radius: 15px;
}

.icono { font-size: 30px; }

.tarjeta h3 {
  color: var(--azul);
  margin: 18px 0 10px;
}

.tarjeta p {
  font-size: 14px;
  line-height: 1.8;
  color: #61748c;
}

.proceso { background: white; }

.pasos {
  display: flex;
  gap: 25px;
  justify-content: center;
  flex-wrap: wrap;
}

.paso {
  background: var(--fondo);
  padding: 25px;
  border-radius: 12px;
  flex: 1;
  min-width: 180px;
}

.numero {
  color: var(--primario);
  font-size: 28px;
  font-weight: bold;
}

footer {
  background: #081a30;
  color: #b4c7dd;
  padding: 30px 0;
  text-align: center;
  font-size: 13px;
}

@media (max-width: 700px) {
  .barra { flex-direction: column; }
  nav { gap: 16px; }
  .hero { padding: 65px 0 80px; }
  .hero p { font-size: 16px; }
  .tarjetas { grid-template-columns: 1fr; }
  .seccion { padding: 50px 0; }
}

/* v1.6 · Portada con acceso claro */
.portada-v16{min-height: min(730px,100svh);background:radial-gradient(circle at 10% 15%,#1a5484 0%,transparent 34%),linear-gradient(135deg,#09192d,#10375b 70%,#0b2d4a)}
.barra-v16{padding-top:26px;padding-bottom:26px}
.navegacion-v16{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.navegacion-v16 a{color:#e5f2ff}
.navegacion-v16 .navegacion-acceso{border:1px solid rgba(255,255,255,.36);border-radius:11px;padding:11px 17px;font-weight:700}
.navegacion-v16 .navegacion-acceso:hover{background:rgba(255,255,255,.12)}
.portada-contenido-v16{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,425px);gap:clamp(24px,5vw,82px);align-items:center;padding-top:70px;padding-bottom:100px}
.presentacion-v16 h1{max-width:720px;font-size:clamp(40px,4.7vw,66px)}
.presentacion-v16 p{max-width:610px;color:#d4e4f4;font-size:clamp(16px,1.45vw,19px);line-height:1.65}
.ventajas-v16{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:30px;color:#c9e8f3;font-size:13px}
.acceso-tarjeta-v16{padding:clamp(26px,3vw,36px);border-radius:22px;background:#fff;color:#1c2e42;box-shadow:0 22px 55px rgba(3,13,24,.22);text-align:left}
.acceso-icono-v16{display:flex;justify-content:center;align-items:center;width:50px;height:50px;border-radius:16px;background:#e1f4f1;color:#0d7b68;font-size:28px;font-weight:700}
.acceso-kicker-v16{font-size:11px;letter-spacing:1.7px;text-transform:uppercase;color:#0d806d;font-weight:800;margin:21px 0 8px}
.acceso-tarjeta-v16 h2{font-size:27px;letter-spacing:-.5px;color:#102942;margin:0 0 10px}
.acceso-tarjeta-v16 p:not(.acceso-kicker-v16){font-size:15px;line-height:1.6;color:#64758b;margin:0 0 18px}
.acceso-tarjeta-v16 .acceso-principal-v16{display:block;width:100%;background:#147a72;border-radius:11px;text-align:center;margin-top:18px;padding:16px;color:#fff}
.acceso-tarjeta-v16 .acceso-principal-v16:hover{background:#0b655e}
.acceso-ayuda-v16{display:block;text-align:center;color:#69798c;font-size:12px;margin-top:10px}
.acceso-separador-v16{display:flex;align-items:center;gap:12px;margin:24px 0 12px;color:#8290a0;font-size:11px}
.acceso-separador-v16:before,.acceso-separador-v16:after{content:"";height:1px;background:#dde5eb;flex:1}
.acceso-secundario-v16{display:block;padding:10px;text-align:center;color:#1b5678;font-size:14px;font-weight:700}
.acceso-secundario-v16:hover{text-decoration:underline}
.seccion-v16{padding-top:70px;padding-bottom:85px}
.seccion-intro-v16{margin-bottom:30px}
.etiqueta-oscura-v16{color:#16776d}
.tarjetas-v16 .tarjeta{box-shadow:0 8px 25px #102b440a}
@media(max-width:820px){.portada-contenido-v16{grid-template-columns:1fr;max-width:650px;padding-top:35px;padding-bottom:65px}.presentacion-v16 h1{font-size:clamp(36px,8vw,49px)}.acceso-tarjeta-v16{max-width:520px;width:100%}.portada-v16{min-height:0}}
@media(max-width:520px){.barra-v16{flex-direction:row;align-items:flex-start}.navegacion-v16{justify-content:flex-end;gap:6px}.navegacion-v16>a:first-child:not(.navegacion-acceso){display:none}.portada-contenido-v16{padding-top:18px;padding-bottom:45px}.presentacion-v16 h1{font-size:36px}.presentacion-v16 p{font-size:15px}.ventajas-v16{gap:8px 12px;font-size:12px}.acceso-tarjeta-v16{padding:24px}.seccion-v16{padding:50px 0}}