:root{
  --azul:#1a4fa0; --azul-osc:#123a78; --naranja:#e86c00; --crema:#faf6f0;
  --tinta:#232323; --gris:#5d5d5d; --verde:#2e7d32; --rojo:#c62828;
  --borde:#e5ddd2; --blanco:#ffffff; --radio:18px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Segoe UI",system-ui,-apple-system,sans-serif;color:var(--tinta);background:var(--crema);font-size:19px;line-height:1.6}
a{color:var(--azul)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:4px solid var(--naranja);outline-offset:2px}
.contenedor{max-width:1080px;margin:0 auto;padding:0 24px}
header.topbar{background:var(--blanco);border-bottom:1px solid var(--borde);position:sticky;top:0;z-index:10}
.topbar-fila{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:12px;flex-wrap:wrap}
.marca{font-size:24px;font-weight:800;color:var(--azul);text-decoration:none;display:flex;align-items:center;gap:10px}
.topbar-acciones{display:flex;align-items:center;gap:14px}
.idioma{font-size:16px;text-decoration:none;border:2px solid var(--borde);border-radius:999px;padding:6px 14px;color:var(--tinta);background:var(--blanco)}
.cta-mini{background:var(--naranja);color:#fff;text-decoration:none;font-weight:700;padding:10px 18px;border-radius:999px;font-size:17px}

/* HERO */
.hero{padding:64px 0 48px;background:linear-gradient(180deg,var(--blanco) 0%,var(--crema) 100%)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.cejilla{display:inline-block;background:#eef3fb;color:var(--azul);font-weight:700;font-size:16px;padding:6px 14px;border-radius:999px;margin-bottom:18px}
h1{font-size:46px;line-height:1.15;font-weight:850;letter-spacing:-.5px}
h1 .resalte{color:var(--naranja)}
.hero p.que-es{margin-top:16px;font-size:18px;color:var(--azul-osc);max-width:32em;border-left:4px solid var(--azul);padding-left:14px}
.hero p.baja{margin-top:18px;font-size:21px;color:var(--gris);max-width:34em}
.hero-cta{margin-top:28px;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.boton-principal{background:var(--naranja);color:#fff;font-size:21px;font-weight:800;padding:16px 30px;border-radius:14px;text-decoration:none;border:none;cursor:pointer;box-shadow:0 4px 14px rgba(232,108,0,.35)}
.boton-principal:hover{background:#cf6000}
.nota-cta{font-size:17px;color:var(--gris)}
.hero-confianza{margin-top:26px;display:flex;gap:20px;flex-wrap:wrap;font-size:16.5px;color:var(--gris)}
.hero-confianza span{display:flex;align-items:center;gap:7px}

/* Capturas reales de la aplicación */
.captura{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--borde);box-shadow:0 18px 50px rgba(18,58,120,.25);background:var(--blanco)}
.ampliable{display:block;cursor:zoom-in;border-radius:16px}

/* Visor de imagen ampliada */
.visor{border:none;padding:0;background:transparent;max-width:none;max-height:none;overflow:visible}
.visor::backdrop{background:rgba(18,58,120,.88)}
.visor img{display:block;max-width:min(1400px,94vw);max-height:88vh;width:auto;height:auto;border-radius:12px;background:var(--blanco);box-shadow:0 24px 70px rgba(0,0,0,.5);cursor:zoom-out}
.visor-cerrar{position:fixed;top:18px;right:18px;width:56px;height:56px;border:none;border-radius:50%;background:var(--blanco);color:var(--tinta);font-size:26px;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.visor-cerrar:hover{background:var(--crema)}
.leyenda-pantalla{text-align:center;font-size:15px;color:var(--gris);margin-top:12px}
.galeria{margin-top:36px;display:grid;grid-template-columns:1fr 1fr;gap:26px}
.galeria figure{margin:0}
.galeria figcaption{margin-top:12px;font-size:17px;color:var(--gris);text-align:center}

/* Secciones */
section{padding:64px 0}
.titulo-seccion{font-size:34px;font-weight:800;line-height:1.2;max-width:24em}
.sub-seccion{margin-top:12px;font-size:20px;color:var(--gris);max-width:36em}
.banda-blanca{background:var(--blanco);border-top:1px solid var(--borde);border-bottom:1px solid var(--borde)}

/* Dolores */
.citas{margin-top:34px;display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.cita{background:var(--blanco);border:1px solid var(--borde);border-left:6px solid var(--naranja);border-radius:var(--radio);padding:22px 24px;font-size:20px;font-style:italic}
.cita b{display:block;margin-top:10px;font-style:normal;font-size:15px;color:var(--gris);font-weight:600}
.giro{margin-top:30px;font-size:23px;font-weight:700;color:var(--azul-osc);max-width:32em}

/* Pasos */
.pasos{margin-top:36px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.paso{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio);padding:26px}
.paso .num{width:44px;height:44px;border-radius:50%;background:var(--azul);color:#fff;font-weight:800;font-size:21px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.paso h3{font-size:21px;margin-bottom:8px}
.paso p{font-size:17.5px;color:var(--gris)}

/* Funciones */
.funciones{margin-top:36px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.funcion{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio);padding:24px}
.funcion .icono{font-size:34px}
.funcion h3{font-size:20.5px;margin:10px 0 6px}
.funcion p{font-size:17px;color:var(--gris)}

/* Objeciones */
.objeciones{margin-top:36px;display:grid;grid-template-columns:1fr 1fr;gap:22px}
.objecion{border-radius:var(--radio);padding:30px;color:#fff}
.o-segura{background:var(--azul-osc)}
.o-simple{background:var(--verde)}
.objecion h3{font-size:25px;margin-bottom:14px}
.objecion ul{list-style:none;display:grid;gap:10px}
.objecion li{padding-left:30px;position:relative;font-size:18px}
.objecion li::before{content:"✓";position:absolute;left:0;font-weight:800}

/* Comparación */
.tabla-marco{margin-top:36px;overflow-x:auto;background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio)}
table{border-collapse:collapse;width:100%;min-width:640px}
th,td{padding:16px 20px;text-align:left;font-size:18px;border-bottom:1px solid var(--borde)}
thead th{font-size:19px}
thead th:nth-child(2){color:var(--gris)}
thead th:nth-child(3){color:var(--azul);background:#eef3fb}
td:nth-child(3){background:#f4f8ff;font-weight:600}
tbody tr:last-child td{border-bottom:none}
.si{color:var(--verde);font-weight:800}.no{color:var(--rojo);font-weight:800}

/* Dignidad */
.dignidad{background:var(--azul-osc);color:#fff;text-align:center}
.dignidad h2{font-size:36px;font-weight:850;max-width:22em;margin:0 auto;line-height:1.25}
.dignidad p{margin-top:16px;font-size:20px;color:#c9d8f2;font-style:italic}

/* FAQ */
.faq{margin-top:30px;display:grid;gap:12px;max-width:820px}
details{background:var(--blanco);border:1px solid var(--borde);border-radius:14px;padding:18px 22px}
summary{font-size:19.5px;font-weight:700;cursor:pointer}
details p{margin-top:10px;color:var(--gris);font-size:18px}

/* Formulario y precio */
.zona-form{background:var(--blanco);border:2px solid var(--azul);border-radius:22px;padding:40px;max-width:760px;margin:40px auto 0}
.zona-form h3{font-size:26px}
.precio-linea{margin-top:14px;display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.precio-linea .tachado{text-decoration:line-through;color:var(--gris);font-size:22px}
.precio-linea .oferta{color:var(--naranja);font-weight:850;font-size:40px;line-height:1}
.precio-linea .detalle{font-size:18px;font-weight:600}
.zona-form .precio{margin-top:8px;font-size:17px;color:var(--gris)}
form{margin-top:22px;display:grid;gap:16px}
label{font-weight:700;font-size:17px}
input,select{width:100%;padding:14px;font-size:18px;border:2px solid var(--borde);border-radius:12px;margin-top:6px;background:var(--blanco);color:var(--tinta)}
.fila-doble{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ok-envio{display:none;background:#e8f5e9;border:1px solid #a5d6a7;color:var(--verde);border-radius:12px;padding:16px;font-weight:700}
.privacidad{font-size:15px;color:var(--gris)}

footer{background:var(--blanco);border-top:1px solid var(--borde);padding:34px 0;font-size:16px;color:var(--gris)}
.pie{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

@media (max-width:860px){
  h1{font-size:34px}
  .hero-grid,.citas,.objeciones,.galeria{grid-template-columns:1fr}
  .pasos,.funciones{grid-template-columns:1fr}
  .fila-doble{grid-template-columns:1fr}
  .titulo-seccion{font-size:28px}
  .dignidad h2{font-size:28px}
  section{padding:48px 0}
}