/* ═══════════════════════════════════════════════════════════════════════════
   VARIANTE E · "azul/blanco tecnológico" sobre la variante C evolucionada
   (héroe centrado con foto difuminada, tarjeta única, precio en blanco tipo
   ticket, FAQs y 4 sub-pasos). Sin verde en toda la página.
   Re-piel completa sobre la Variante C. Pedido: fondo degradado azul/blanco
   con aire tecnológico, todo más cuidado y más intuitivo.
   · SOLO cambia el CSS: la lógica, los identificadores, las clases que toca el
     JS (.on .open .hecho .vis .bad .late .aviso .conpresu .solicitud-enviada)
     y los puntos de anclaje de la foto del héroe se conservan tal cual.
   · El héroe pasa a azul PROFUNDO: el titular blanco pasa de 2,06:1 a >9:1 y
     por fin cumple contraste sin contornos ni sombras-truco.
   · El verde/teal de Selia se queda SOLO donde es marca: la póliza y la franja
     del precio. El resto de la página vive en azul/blanco.
   · Firma visual: fondo con malla de puntos + auroras azules fijas, muy
     sutiles, que se apagan bajo las tarjetas.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --ink:#0a1e3c; --ink-2:#28456e; --grey:#5b7290; --grey-2:#8ca0bc;
  --blue:#1f6bff; --blue-d:#1250d4; --blue-l:#eaf1ff; --blue-xl:#f4f8ff;
  --cyan:#22b8f0; --cyan-l:#e6f7fe;
  --green:#1f6bff; --green-d:#1250d4; --green-l:#eaf1ff; --mint:#8fd2ff; /* re-apuntados a azul: el JS pinta con var(--green-d) y así el verde desaparece sin tocar la lógica */
  --gold:#c98a1e; --gold-l:#fdf6e8;
  --orange:#f4731f; --orange-d:#df5f0d; --orange-l:#fef1e7;
  --line:#dce7f8; --line-2:#c6d6ef;
  --card:#ffffff;
  --sh-1:0 1px 2px rgba(10,30,60,.06);
  --sh-2:0 1px 2px rgba(10,30,60,.05),0 10px 30px rgba(18,64,150,.10);
  --sh-3:0 2px 4px rgba(10,30,60,.06),0 18px 50px rgba(18,64,150,.16);
  --r:20px;
  --disp:'Space Grotesk',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{font-family:'Nunito',sans-serif;color:var(--ink);background:#f5f9ff}
/* ── FONDO TECNOLÓGICO: degradado azul→blanco + malla de puntos + auroras ──
   Va en un pseudo-elemento FIJO del body: se pinta una vez, no se repinta al
   hacer scroll y no toca al DOM. Las tarjetas blancas se recortan encima. */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 520px at 12% -6%, rgba(31,107,255,.14), transparent 62%),
    radial-gradient(780px 480px at 88% 4%, rgba(34,184,240,.13), transparent 60%),
    radial-gradient(1000px 700px at 50% 112%, rgba(31,107,255,.10), transparent 64%),
    linear-gradient(180deg,#eef4ff 0%,#f7faff 42%,#ffffff 100%)}
body::after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(31,107,255,.10) 1px,transparent 1.4px);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.16) 46%,transparent 82%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.16) 46%,transparent 82%)}
img{max-width:100%}
button{font:inherit;cursor:pointer}
::selection{background:rgba(31,107,255,.18)}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}

/* ── cabecera: blanca traslúcida con desenfoque, línea inferior fina ──────── */
.bar{background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:13px;padding-bottom:13px}
.bar img{height:31px;width:auto}
.seal{display:inline-flex;align-items:center;gap:9px;background:var(--blue-l);color:var(--blue-d);
  border:1px solid #cddffc;border-radius:999px;padding:8px 16px}
.seal::before{content:'✓';font-weight:900;font-size:12px}
.seal b{font-size:11px;font-weight:900;letter-spacing:.9px;text-transform:uppercase}
/* Distintivo SOLO de móvil. Azul sólido #1250d4 con blanco: 6,6:1, CUMPLE
   (la versión verde anterior se quedaba en 3,41:1 y estaba avisada). */
.seal-movil{display:none}
@media(max-width:620px){
  .seal{display:none}
  .seal-movil{display:inline-flex;align-items:center;gap:8px;background:var(--blue-d);color:#fff;
    border-radius:999px;padding:7px 15px;margin-left:auto;flex:0 0 auto}
  .seal-movil::before{content:'';width:7px;height:7px;border-radius:50%;background:#9dc4ff;flex:0 0 auto}
  .seal-movil b{font-size:11.5px;font-weight:900;letter-spacing:.4px;text-transform:uppercase;white-space:nowrap}
}
@media(max-width:360px){
  .seal-movil{padding:6px 11px;gap:6px}
  .seal-movil::before{width:6px;height:6px}
  .seal-movil b{font-size:10.5px;letter-spacing:.2px}
}

/* ── héroe: azul claro premium, CENTRADO, con la foto de bordes difuminados ──
   Estructura de la variante C nueva (titular centrado + foto entre los ticks y
   la calculadora) con la piel azul/blanco: titular en tinta con degradado
   sutil hacia azul (13:1 sobre el fondo, con @supports y color de reserva),
   "pase lo que pase" en pastilla azul, chips de cristal y dos auroras que
   respiran. Sustituye el truco del contorno blanco de los ticks (1,4:1 medido
   y avisado el 04/08): estos chips miden 12,6:1 y cumplen de verdad. */
.hero{background:
    radial-gradient(820px 460px at 85% -10%, rgba(34,184,240,.20), transparent 60%),
    radial-gradient(640px 420px at 6% 30%, rgba(31,107,255,.16), transparent 62%),
    linear-gradient(170deg,#cfe2ff 0%,#e2eeff 46%,#f2f7ff 100%);
  color:var(--ink);position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:-20%;pointer-events:none;z-index:0;
  background:
    radial-gradient(closest-side at 24% 30%, rgba(31,107,255,.16), transparent),
    radial-gradient(closest-side at 78% 62%, rgba(34,184,240,.16), transparent);
  animation:aurora 16s ease-in-out infinite alternate}
@keyframes aurora{
  from{transform:translate3d(-2%,-1%,0) scale(1)}
  to{transform:translate3d(2%,2%,0) scale(1.06)}
}
.hero::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(rgba(31,107,255,.16) 1px,transparent 1.4px);
  background-size:24px 24px;
  -webkit-mask-image:linear-gradient(120deg,rgba(0,0,0,.55),transparent 62%);
  mask-image:linear-gradient(120deg,rgba(0,0,0,.55),transparent 62%)}
.hero .wrap{max-width:1100px;margin:0 auto;padding:52px 22px 88px;position:relative;z-index:2}
/* medidas del titular de la variante C (38px de arranque, centrado a 640) */
.hero h1{font-family:var(--disp);font-weight:700;font-size:clamp(38px,5.4vw,52px);line-height:1.08;
  max-width:640px;margin:0 auto;text-align:center;letter-spacing:-.02em;color:var(--ink);
  animation:sube .6s cubic-bezier(.2,.7,.2,1) both}
/* degradado tinta→azul SOLO donde background-clip:text existe; si no, se queda
   el color de tinta de arriba y no hay riesgo de texto invisible */
@supports((-webkit-background-clip:text) or (background-clip:text)){
  .hero h1{background:linear-gradient(115deg,#0a1e3c 30%,#123a7a 62%,#1f6bff 105%);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  .hero h1 .hl{-webkit-text-fill-color:#fff}
}
.hero h1 .hl{display:inline-block;background:linear-gradient(135deg,#2f7bff,#0d3fae);color:#fff;
  border-radius:14px;padding:.04em .3em;box-shadow:0 12px 30px rgba(18,80,212,.35);line-height:1.15}
/* la foto difuminada de la variante C, con un halo azul muy suave detrás */
.herofoto{margin:26px auto 0;max-width:560px;position:relative;
  animation:sube .7s .12s cubic-bezier(.2,.7,.2,1) both}
.herofoto::before{content:'';position:absolute;inset:12% -5% 2%;z-index:0;
  background:radial-gradient(closest-side,rgba(31,107,255,.20),transparent 72%);
  filter:blur(10px)}
.herofoto img{width:100%;display:block;position:relative;z-index:1;aspect-ratio:16/10;object-fit:cover;object-position:50% 40%;
  filter:saturate(1.04);
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 13%,#000 87%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 11%,#000 84%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 13%,#000 87%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 11%,#000 84%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
/* chips de cristal centrados (medidas de la variante C: 40px arriba, columna) */
.hero .checks{list-style:none;margin:34px auto 0;display:flex;flex-direction:column;gap:10px;
  width:max-content;max-width:100%}
.hero .checks li{display:flex;align-items:center;gap:11px;font-size:16px;font-weight:800;color:var(--ink);
  background:rgba(255,255,255,.78);border:1px solid #d3e3fb;
  border-radius:999px;padding:9px 18px 9px 10px;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 6px 18px rgba(30,80,180,.12);
  animation:sube .6s cubic-bezier(.2,.7,.2,1) both}
.hero .checks li:nth-child(1){animation-delay:.08s}
.hero .checks li:nth-child(2){animation-delay:.16s}
.hero .checks li:nth-child(3){animation-delay:.24s}
.hero .checks .em{font-size:17px;line-height:1;flex:0 0 auto}
.hero .checks i{flex:0 0 26px;height:26px;border-radius:50%;
  background:linear-gradient(140deg,#2f7bff,#0d3fae);color:#fff;
  display:grid;place-items:center;box-shadow:0 3px 9px rgba(18,80,212,.35)}
.hero .checks svg{width:13px;height:13px}
@media(max-width:600px){
  /* el titular baja de tamaño en móvil y la pastilla pasa a EN LÍNEA con
     box-decoration-break: en vez de un bloque enorme, el resalte acompaña al
     texto línea a línea, con relleno y sombra más discretos */
  .hero h1{font-size:clamp(30px,8.4vw,38px)}
  .hero h1 .hl{display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone;
    padding:.06em .24em;border-radius:10px;box-shadow:0 6px 16px rgba(18,80,212,.28)}
  /* una sola línea por chip (decisión de la variante C); el clamp baja a 2,9vw
     porque el chip añade relleno e icono que el texto suelto de antes no tenía.
     MEDIDO a 390 y 360 px con la frase más larga. */
  .hero .checks{margin-top:26px}
  .hero .checks li{white-space:nowrap;font-size:clamp(9.5px,2.9vw,16px);gap:7px;padding:7px 11px 7px 7px}
  .hero .checks i{flex:0 0 19px;height:19px}
  .hero .checks svg{width:10px;height:10px}
  .hero .checks .em{font-size:13px}
}
@keyframes sube{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hero .foto{--fh:460px;
  position:absolute;right:calc(50% - 188px);bottom:calc(44px - 0.19 * var(--fh));
  height:var(--fh);width:auto;z-index:1;
  filter:drop-shadow(0 16px 32px rgba(20,60,150,.30))}
@media(max-width:1100px){ .hero .foto{right:calc(50% - 175px);--fh:330px} }
@media(max-width:980px){ .hero .foto{right:6%} }
@media(max-width:760px){
  .hero .wrap{padding:40px 22px 96px}
  .hero h1{max-width:10.5em}
  .hero .foto{--fh:clamp(232px,62vw,400px);right:8px}
}
@media(prefers-reduced-motion:reduce){
  .hero::before{animation:none}
  .hero h1,.hero .checks li,.herofoto,.hero .foto{animation:none}
}

/* ── zona de la calculadora: mismas proporciones (la foto depende de ellas) ── */
#paso2,#paso3,#calc{scroll-margin-top:78px}
.calczone{max-width:720px;margin:-44px auto 0;padding:0 22px;position:relative;z-index:3;
  display:grid;grid-template-columns:1fr;gap:26px;align-items:start}
/* en esta variante la póliza lateral no existe: la tarjeta va sola y centrada.
   Los estilos .poliza/.pz-* se conservan por si algún día se reactiva. */
.poliza-wrap{display:none}
body.solicitud-enviada .poliza-wrap{display:none}


/* ── la póliza previsualizada: teal de marca, chrome refinado ─────────────── */
.poliza{border-radius:var(--r);overflow:hidden;background:#fff;border:1px solid var(--line);
  box-shadow:var(--sh-3)}
.poliza-top{background:
    radial-gradient(340px 200px at 85% -20%, rgba(143,210,255,.35), transparent 65%),
    linear-gradient(150deg,#1f6bff 0%,#0d3fae 100%);
  color:#fff;padding:20px 22px 22px;position:relative}
.poliza-top::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.3px);background-size:20px 20px;
  -webkit-mask-image:linear-gradient(115deg,rgba(0,0,0,.6),transparent 60%);
  mask-image:linear-gradient(115deg,rgba(0,0,0,.6),transparent 60%)}
.poliza-top>*{position:relative}
.pz-et{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:900;
  letter-spacing:1.6px;text-transform:uppercase;opacity:.92;margin-bottom:10px}
.pz-precio{font-family:var(--disp);font-weight:700;font-size:40px;line-height:1;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums}
.pz-precio small{font-size:16px;font-weight:700;font-family:'Nunito',sans-serif;letter-spacing:0}
.pz-anual{font-size:13px;font-weight:700;opacity:.92;margin-top:5px}
.pz-logo{background:#fff;border-radius:14px;margin-top:16px;padding:14px;display:flex;
  align-items:center;justify-content:center;min-height:74px;box-shadow:0 4px 14px rgba(9,40,110,.22)}
.pz-logo img{max-height:44px;max-width:180px}
/* el marcador "tu compañía" llega con estilo en línea (Baloo 2): se re-tipa aquí */
.pz-logo span{font-family:var(--disp)!important;color:var(--grey-2)!important;font-weight:700!important}
.poliza-body{padding:16px 22px 20px}
.pz-row{display:flex;justify-content:space-between;gap:14px;padding:11px 0;
  border-bottom:1px solid #eef3fb;font-size:14px}
.pz-row span{color:var(--grey);font-weight:700}
.pz-row b{color:var(--ink);font-weight:800;text-align:right}
.pz-checks{list-style:none;margin:14px 0 16px;display:flex;flex-direction:column;gap:8px}
.pz-checks li{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:700;color:var(--ink-2)}
.pz-checks i{color:var(--green-d);font-style:normal;font-weight:900}
/* botón azul oscuro liso (#1250d4, blanco 6,6:1: CUMPLE con margen) */
.pz-cta{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:none;
  border-radius:14px;padding:16px;background:#1250d4;color:#fff;font-family:var(--disp);
  font-weight:700;font-size:16px;box-shadow:0 8px 22px rgba(18,80,212,.35);transition:.15s;cursor:pointer}
.pz-cta:hover{background:#0d3fae;transform:translateY(-1px)}
.pz-cta:focus-visible{outline:3px solid rgba(31,107,255,.5);outline-offset:2px}
.pz-cta:active{transform:translateY(0) scale(.99)}
.pz-cta:disabled{background:#c9d5e6;color:#f4f8ff;box-shadow:none;transform:none;cursor:not-allowed}

/* ── la tarjeta calculadora ───────────────────────────────────────────────── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  box-shadow:var(--sh-3)}
/* franja del precio: BLANCA tipo ticket (decisión de la variante C: el precio
   en la primera pantalla, sobre blanco) con un tinte azul muy suave arriba y el
   corte de "entradilla" en línea discontinua. El filo superior degradado es la
   firma de la tarjeta. */
.card{position:relative}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;z-index:2;
  background:linear-gradient(90deg,var(--blue),var(--cyan))}
.pricebox{background:
    radial-gradient(460px 240px at 50% -30%, rgba(31,107,255,.10), transparent 70%),
    linear-gradient(180deg,#f8fbff 0%,#fff 100%);
  color:var(--ink);padding:24px 26px;position:relative;border-bottom:2px dashed var(--line-2)}
.pricebox::before{content:none}
.pricebox > *{position:relative;z-index:1}
.pricebox .ph{text-align:center;font-size:11px;font-weight:900;letter-spacing:1.7px;text-transform:uppercase;
  color:var(--grey);margin-bottom:14px;font-family:'Nunito',sans-serif}
.roles{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-bottom:18px}
.roles button{border:1.5px solid var(--line-2);background:#fff;border-radius:999px;
  padding:11px 22px;font-size:13.5px;font-weight:900;color:var(--ink);transition:.14s;cursor:pointer;
  letter-spacing:.6px;text-transform:uppercase}
.roles button:hover{border-color:var(--blue)}
.roles button.on{background:var(--blue);color:#fff;border-color:var(--blue);
  box-shadow:0 4px 14px rgba(31,107,255,.30)}
@media(max-width:520px){ .roles button{padding:10px 16px;font-size:12.5px} }
.plogo{display:flex;align-items:center;justify-content:center;margin-bottom:12px}
/* tope 92px MEDIDO contra la resolución real de los logos: no se toca */
.plogo img{max-height:92px;max-width:250px;background:#fff;border-radius:12px;padding:14px 22px;
  border:1px solid var(--line);box-shadow:var(--sh-1)}
@media(max-width:520px){ .plogo img{max-height:80px;padding:12px 18px} }
.ptag{text-align:center;font-size:10.5px;font-weight:900;letter-spacing:1.4px;color:var(--grey);
  text-transform:uppercase;margin-bottom:10px}
.pmes{text-align:center;font-family:var(--disp);font-weight:700;font-size:52px;line-height:1;color:#0d3fae;
  letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pmes span{font-size:17px;font-weight:600;letter-spacing:0;color:var(--grey)}
.panual{text-align:center;font-size:14px;font-weight:800;color:var(--ink-2);margin:8px 0 3px}
.pnote{text-align:center;font-size:11px;font-weight:700;color:var(--grey);margin-top:10px;line-height:1.5}
/* compañía sin pago mensual (Surne por debajo de 30 €/mes): dicho junto al precio */
.pper{text-align:center;font-size:12.5px;font-weight:700;color:var(--ink-2);margin-top:6px;line-height:1.45}
.pstate{display:flex;flex-direction:column;align-items:center;gap:13px;text-align:center;padding:16px 6px;
  font-weight:700;color:var(--ink);font-size:14.5px;line-height:1.55}
.spin{width:38px;height:38px;border:3px solid var(--line-2);border-top-color:var(--blue);border-radius:50%;
  animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.retry{background:var(--blue);color:#fff;border:none;border-radius:999px;padding:11px 22px;
  font-family:var(--disp);font-weight:700;font-size:14px}
.pstate a{color:var(--blue-d);font-weight:900;text-decoration:underline}
/* barra de capital dentro de la franja del precio (misma mecánica sincronizada) */
.pbcap{margin:16px 2px 0;text-align:left}
.pbcap-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  font-size:12.5px;font-weight:800;color:var(--ink-2)}
.pbcap-top b{font-family:var(--disp);font-weight:700;font-size:22px;letter-spacing:-.02em;color:#0d3fae;
  font-variant-numeric:tabular-nums}
.pbcap .capslider{margin:10px 0 6px}
.pbcap-minmax{display:flex;justify-content:space-between;font-size:10.5px;font-weight:800;color:var(--grey-2)}
/* ── descuento de campaña (-20 %) ────────────────────────────────────────────
   ⚠️ PRECIO DE ESCAPARATE, NO UN DESCUENTO REAL (ver el aviso del JS: el
   tachado es el precio real / 0,8; se apaga entero con PROMO_DTO = 0).
   Contrastes sobre su fondo real: gris #5b7290 sobre blanco 4,9:1 · etiqueta
   blanca sobre rojo #d92d20 4,83:1. */
.pantes{display:flex;align-items:center;justify-content:center;gap:9px;margin-bottom:7px}
.pantes s{color:var(--grey);font-size:19px;font-weight:800;text-decoration-thickness:2px}
.pantes em{font-style:normal;background:#d92d20;color:#fff;font-size:12.5px;font-weight:900;
  letter-spacing:.06em;padding:4px 9px;border-radius:7px}
.pz-antes{font-size:14px;font-weight:800;margin-bottom:3px;font-family:'Nunito',sans-serif}
.pz-antes s{opacity:.85}
.pz-antes em{font-style:normal;background:#fff;color:#0d3fae;font-size:11px;font-weight:900;
  padding:2px 7px;border-radius:6px;margin-left:7px;vertical-align:2px}
.sp-price s{font-family:'Nunito',sans-serif;font-size:12.5px;font-weight:700;opacity:.72;margin-right:7px}
.rp s{color:var(--grey);font-size:15px;font-weight:800;margin-right:8px}

/* los campos */
.fields{padding:24px 26px 26px}
@media(max-width:520px){ .fields{padding:20px 18px 22px} .pricebox{padding:20px 18px 22px} }
.blk{margin-bottom:22px}
.blk:last-of-type{margin-bottom:22px}
.card h3{font-family:var(--disp);font-weight:700;font-size:15.5px;margin-bottom:11px;
  display:flex;align-items:center;gap:10px;color:var(--ink);letter-spacing:-.01em}
/* números de paso: cuadraditos azul degradado, se leen como un recorrido */
.card h3 em{font-style:normal;width:26px;height:26px;border-radius:9px;
  background:linear-gradient(140deg,var(--blue),var(--cyan));color:#fff;
  display:grid;place-items:center;font-size:12px;font-weight:900;font-family:'Nunito',sans-serif;flex:0 0 auto;
  box-shadow:0 3px 9px rgba(31,107,255,.35)}

.fnac{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:9px}
.fnac label{display:block;font-size:10px;font-weight:900;color:var(--grey-2);margin-bottom:6px;
  text-transform:uppercase;letter-spacing:1px}
.fnac input{width:100%;border:1.5px solid var(--line-2);border-radius:12px;padding:13px 10px;font:inherit;
  font-weight:800;font-size:18px;text-align:center;background:#fff;outline:none;transition:.14s;color:var(--ink)}
.fnac input:hover{border-color:#a9c2ec}
.fnac input:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,107,255,.15)}
.fnac input.bad{border-color:#c62a1c;background:#fdf4f3}
/* El placeholder iba con el mismo peso y tamaño que un valor ya escrito (18px,
   font-weight 800, casi negro): a golpe de vista parecía la fecha ya rellenada.
   Aquí se marca claramente como "ejemplo, no dato": más fino, más pequeño y en
   el gris de las etiquetas, no en var(--ink). */
.fnac input::placeholder{color:var(--grey-2);font-weight:600;font-size:16px;opacity:1}
.edadbox{margin-top:11px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--blue-l);border:1px solid #d4e2fb;border-radius:12px;padding:10px 15px;
  font-size:11.5px;font-weight:900;color:var(--blue-d);text-transform:uppercase;letter-spacing:.8px}
.edadbox b{font-family:var(--disp);font-size:21px;color:var(--ink);font-weight:700;letter-spacing:0;text-transform:none;white-space:nowrap;flex:0 0 auto}
.ferr{display:none;margin-top:9px;font-size:12.5px;font-weight:800;color:#c62a1c}
.ferr.on{display:block}

.capval{font-family:var(--disp);font-weight:700;font-size:29px;color:var(--ink);margin-bottom:2px;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums}
input[type=range].capslider{width:100%;appearance:none;-webkit-appearance:none;height:6px;border-radius:99px;
  background:linear-gradient(90deg,var(--blue),var(--cyan));outline:none;margin:12px 0 7px}
input[type=range].capslider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:26px;height:26px;
  border-radius:50%;background:#fff;border:4px solid var(--blue);box-shadow:0 3px 10px rgba(10,30,60,.28);cursor:grab}
input[type=range].capslider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;
  border:4px solid var(--blue);cursor:grab}
input[type=range].capslider:focus-visible{box-shadow:0 0 0 4px rgba(31,107,255,.20)}
.caplbl{display:flex;justify-content:space-between;font-size:11px;font-weight:800;color:var(--grey-2);
  text-transform:uppercase;letter-spacing:.8px}

.cob{display:grid;grid-template-columns:1fr 1fr;gap:9px}
@media(max-width:560px){ .cob{grid-template-columns:1fr} }
.cob button{position:relative;border:1.5px solid var(--line-2);background:#fff;border-radius:14px;
  padding:13px 34px 13px 14px;text-align:left;transition:.14s}
.cob button:hover{border-color:var(--blue);box-shadow:var(--sh-1)}
/* elegido = borde azul + fondo azul claro + tic arriba a la derecha: se ve DE
   UN VISTAZO cuál está activo, que antes solo lo decía el borde */
.cob button.on{border-color:var(--blue);background:var(--blue-xl);box-shadow:0 0 0 3px rgba(31,107,255,.12)}
.cob button.on::after{content:'✓';position:absolute;top:9px;right:9px;width:19px;height:19px;border-radius:50%;
  background:var(--blue);color:#fff;font-size:11px;font-weight:900;display:grid;place-items:center;
  box-shadow:0 2px 6px rgba(31,107,255,.4)}
.cob .t{display:block;font-family:var(--disp);font-weight:700;font-size:14px;color:var(--ink)}
.cob .d{display:block;font-size:11px;font-weight:700;color:var(--grey-2);margin-top:2px;line-height:1.35}
.cob button:disabled{opacity:.4;cursor:not-allowed}
.cob button:disabled:hover{border-color:var(--line-2);box-shadow:none}
.cobnote{display:none;margin-top:9px;font-size:12px;font-weight:800;color:#8a5406;
  background:var(--gold-l);border:1px solid #f0dcae;border-radius:10px;padding:9px 12px}
.cobnote.on{display:block}

/* desplegable de compañía */
.ciadd{position:relative}
.ciadd-trigger{width:100%;display:flex;align-items:center;gap:11px;border:1.5px solid var(--line-2);
  border-radius:14px;padding:11px 14px;background:#fff;cursor:pointer;transition:.14s;text-align:left}
.ciadd-trigger:hover{border-color:var(--blue);box-shadow:var(--sh-1)}
.ciadd.open .ciadd-trigger{border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,107,255,.15)}
.ciadd-trigger[disabled]{opacity:.6;cursor:default;background:var(--blue-xl);box-shadow:none;border-color:var(--line-2)}
.ciadd-logo{flex:0 0 62px;width:62px;height:24px;object-fit:contain;object-position:left center}
.ciadd-cur{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.ciadd-cur b{font-weight:800;font-size:14px;color:var(--ink)}
.ciadd-cur small{font-weight:900;font-size:10px;letter-spacing:.6px;text-transform:uppercase}
.ciadd-cur .ph{font-weight:700;color:var(--grey-2);font-size:13px}
.ciadd-pr{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink);white-space:nowrap;flex:0 0 auto;
  font-variant-numeric:tabular-nums}
.ciadd-pr span{font-size:10px;color:var(--grey-2);font-weight:700}
/* sin pago mensual: el equivalente al mes, debajo del recibo de verdad */
.ciadd-pr small{display:block;text-align:right;font-family:'Nunito',sans-serif;font-size:10.5px;font-weight:700;
  color:var(--grey);line-height:1.2;margin-top:1px}
@keyframes ciaprPulse{
  0%{transform:scale(1)}
  35%{transform:scale(1.32);color:var(--blue-d)}
  100%{transform:scale(1);color:var(--ink)}
}
.ciadd-pr.late{animation:ciaprPulse .45s ease-out;transform-origin:right center;display:inline-block}
@media(prefers-reduced-motion:reduce){ .ciadd-pr.late{animation:none} }
.ciadd-chev{color:var(--blue);font-size:10px;transition:.2s;flex:0 0 auto}
@media(max-width:560px){
  /* en pantallas estrechas el conjunto logo+nombre+RECOMENDADA+precio quedaba
     apelotonado: logo más pequeño, letras ajustadas y hueco garantizado */
  .ciadd-trigger{gap:10px;padding:12px 12px}
  .ciadd-logo{flex:0 0 46px;width:46px;height:22px}
  .ciadd-cur{padding-right:2px}
  .ciadd-cur b{font-size:13.5px}
  .ciadd-cur small{font-size:8.5px;letter-spacing:.35px}
  .ciadd-pr{font-size:15px}
  .ciadd-pr span{font-size:9px}
  .ciadd-row{gap:10px}
  .ciadd-row .ciadd-info b{font-size:13.5px}
  .edadbox{gap:10px;padding:10px 13px}
}
.ciadd.open .ciadd-chev{transform:rotate(180deg)}
.ciadd-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:25;background:#fff;
  border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--sh-3);padding:5px;
  max-height:min(340px,60vh);overflow-y:auto}
.ciadd-list::-webkit-scrollbar{width:8px}
.ciadd-list::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
.ciadd-list[hidden]{display:none}
.ciadd-row{width:100%;display:flex;align-items:center;gap:11px;padding:11px 12px;border:none;background:#fff;
  border-radius:10px;cursor:pointer;transition:.12s;text-align:left}
.ciadd-row:hover{background:var(--blue-xl)}
.ciadd-row.on{background:var(--blue-l);box-shadow:inset 3px 0 0 var(--blue)}
.ciadd-row .ciadd-info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.ciadd-row .ciadd-info b{font-size:14px;color:var(--ink);font-weight:800}
.ciadd-row .ciadd-info small{font-size:10px;font-weight:900;letter-spacing:.6px;text-transform:uppercase}
.tg-reco{color:#0e7490} /* cian oscuro, distinguible del azul (4,9:1) */
.tg-bar{color:var(--blue-d)}
.tg-prem{color:var(--gold)}

/* desplegable de forma de pago: mismo componente que el de compañía (ciadd),
   pero el subtítulo aquí es texto descriptivo normal ("cada 3 meses"), no una
   insignia en mayúsculas como "Recomendada" — se pisa el estilo de <small>
   solo dentro de .pagodd para no tocar el desplegable de compañía. */
.pagodd .ciadd-cur small,
.pagodd .ciadd-row .ciadd-info small{font-weight:600;font-size:12px;letter-spacing:normal;
  text-transform:none;color:var(--grey-2)}
@media(max-width:560px){
  /* la regla de arriba pesa más que el ajuste móvil de .ciadd-cur small de
     más arriba (una clase más de especificidad), así que sin esto el
     subtítulo del pago se quedaba grande en móvil mientras el resto del
     mismo componente sí se encogía. */
  .pagodd .ciadd-cur small,
  .pagodd .ciadd-row .ciadd-info small{font-size:10.5px}
}

.btn-cta{display:block;width:100%;background:linear-gradient(150deg,#ff8a2e,var(--orange-d));color:#fff;
  border:none;border-radius:14px;padding:17px;font-family:var(--disp);font-weight:700;font-size:17px;
  transition:.15s;box-shadow:0 10px 26px rgba(244,115,31,.38)}
.btn-cta:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 14px 30px rgba(244,115,31,.42)}
.btn-cta:focus-visible{outline:3px solid rgba(244,115,31,.5);outline-offset:2px}
.btn-cta:active{transform:translateY(0) scale(.99)}
.btn-cta:disabled{background:#dfe6f2;color:#9aa9c2;box-shadow:none;transform:none;cursor:not-allowed;filter:none}
.card .mini-legal{text-align:center;font-size:11.5px;font-weight:700;color:var(--grey-2);margin-top:11px;line-height:1.5}

/* ── tira de aseguradoras ─────────────────────────────────────────────────── */
.marcas{background:rgba(255,255,255,.75);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;margin-top:46px}
.marcas .wrap{display:flex;align-items:center;gap:22px;max-width:1120px}
.marcas .rot{flex:0 0 auto;font-size:11px;font-weight:900;letter-spacing:1.3px;text-transform:uppercase;
  color:var(--grey-2);white-space:nowrap}
.marquesina{flex:1 1 auto;min-width:0;overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq-pista{display:flex;width:max-content;animation:desliza 34s linear infinite;will-change:transform}
@media(hover:hover) and (pointer:fine){
  .marquesina:hover .mq-pista{animation-play-state:paused}
}
.mq-grupo{display:flex;align-items:center;gap:52px;padding-right:52px}
.mq-grupo img{height:48px;width:auto;max-width:190px;object-fit:contain;transition:.2s;flex:0 0 auto}
.mq-grupo img.lg-asisa{height:40px}
/* Cáser y Helvetia son logos más cuadrados: a 48px se ven pequeños (MEDIDO) */
.mq-grupo img.lg-caser{height:62px}
.mq-grupo img.lg-helvetia{height:60px}
.mq-grupo img:hover{transform:scale(1.08)}
@keyframes desliza{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:620px){ .marcas .rot{display:none} .mq-grupo{gap:40px;padding-right:40px} .mq-grupo img{height:38px} .mq-grupo img.lg-asisa{height:32px} .mq-grupo img.lg-caser{height:48px} .mq-grupo img.lg-helvetia{height:46px} .mq-pista{animation-duration:17s} }
@media(prefers-reduced-motion:reduce){ .mq-pista{animation:none} }

/* ===== recuadro de la campaña del regalo =====
   ⚠️ Sigue siendo <section>, NO <div>: los apartados de abajo se colorean con
   :nth-of-type, que cuenta divs. */
.promo{background:linear-gradient(160deg,#e7f0ff 0%,#d9e9ff 100%);border:1px solid #b8d2f8;
  border-radius:var(--r);padding:34px 30px;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),var(--sh-1)}
.promo-cab{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-bottom:22px}
.promo-pill{background:#1250d4;color:#fff;font-size:12.5px;font-weight:900;letter-spacing:.08em;
  padding:8px 15px;border-radius:99px;white-space:nowrap}
.promo-logo{margin-left:auto;height:46px;width:auto;flex:0 0 auto}
.promo-cab h3{flex:1 1 100%;font-family:var(--disp);font-weight:700;font-size:22px;color:var(--ink);
  line-height:1.25;letter-spacing:-.01em}
.promo-card{display:flex;align-items:center;gap:30px;background:#fff;border:1px solid #dfeafc;
  border-radius:14px;padding:28px 30px;box-shadow:var(--sh-1)}
.promo-em{font-size:46px;line-height:1;flex:0 0 auto}
.promo-foto{width:200px;height:auto;flex:0 0 auto;object-fit:contain;margin:4px 6px}
.promo-txt{flex:1;min-width:0}
.promo-txt b{display:block;font-family:var(--disp);font-weight:700;font-size:20px;
  color:var(--green-d);line-height:1.35;margin-bottom:9px}
.promo-txt small{display:block;font-size:14px;font-weight:700;color:var(--ink-2);line-height:1.5}
/* "¡GRATIS!" en ámbar con letra marrón oscura: par medido a 5,6:1, se conserva */
.promo-free{display:inline-block;vertical-align:middle;background:#ffb020;color:#6b2d00;
  border-radius:99px;padding:5px 17px;font-family:'Nunito',sans-serif;font-size:23px;font-weight:900;
  letter-spacing:.03em;white-space:nowrap;margin-left:9px;box-shadow:0 4px 12px rgba(244,124,32,.42)}
.promo-cond{display:inline-block;margin-top:13px;background:var(--green-l);color:var(--green-d);
  border-radius:99px;padding:7px 17px;font-size:16px;font-weight:900;white-space:nowrap}
@media(max-width:620px){
  .promo{padding:26px 18px}
  .promo-pill-largo{display:none}
  .promo-pill{font-size:12px;padding:7px 13px}
  .promo-logo{height:36px}
  .promo-cab h3{font-size:18.5px}
  .promo-card{flex-direction:column;align-items:center;text-align:center;gap:18px;padding:24px 18px}
  .promo-em{font-size:38px}
  .promo-foto{width:200px;order:2}
  .promo-txt{order:1}
  .promo-txt b{font-size:16.5px}
  .promo-txt small{font-size:13px}
  .promo-free{font-size:17px;padding:4px 13px;margin-left:6px}
  .promo-cond{font-size:14px;padding:6px 14px}
}

/* ── apartados: tarjetas blancas unificadas, acento fino de color arriba ────
   Antes cada apartado llevaba borde grueso de un color distinto y quedaba
   recargado. Ahora: mismo chrome blanco para todos y el color de cada uno
   reducido a una LÍNEA fina superior + el azulejo del icono. Se sigue
   distinguiendo cada bloque, pero la página respira. Mantiene :nth-of-type. */
.info{max-width:1120px;margin:40px auto 0;padding:0 22px;display:flex;flex-direction:column;gap:22px}
.pinfo{background:#fff;border-radius:var(--r);padding:30px;border:1px solid var(--line);
  box-shadow:var(--sh-2);position:relative;overflow:hidden;
  opacity:0;transform:translateY(26px);transition:opacity .55s ease,transform .55s ease}
.pinfo.vis{opacity:1;transform:none}
.pinfo::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--blue),var(--cyan))}
.pinfo:nth-of-type(1)::before{background:linear-gradient(90deg,#22b8f0,#1f6bff)}
.pinfo:nth-of-type(2)::before{background:linear-gradient(90deg,var(--blue),var(--cyan))}
.pinfo:nth-of-type(3)::before{background:linear-gradient(90deg,#c98a1e,#f2c66a)}
.pinfo:nth-of-type(4)::before{background:linear-gradient(90deg,#7c5cff,#22b8f0)}
.pinfo:nth-of-type(5)::before{background:linear-gradient(90deg,#f4731f,#ffab5e)}
.pinfo h3{font-family:var(--disp);font-weight:700;font-size:22px;margin-bottom:20px;letter-spacing:-.01em;
  display:flex;align-items:center;gap:11px}
.pinfo h3 .ic{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:20px;flex:0 0 auto;
  box-shadow:var(--sh-1)}
.pinfo:nth-of-type(1) h3 .ic{background:var(--cyan-l)}
.pinfo:nth-of-type(2) h3 .ic{background:var(--blue-l)}
.pinfo:nth-of-type(3) h3 .ic{background:var(--gold-l)}
.pinfo:nth-of-type(4) h3 .ic{background:#efeaff}
.pinfo:nth-of-type(5) h3 .ic{background:var(--orange-l)}
.pinfo .cols{display:grid;grid-template-columns:1fr 1fr;gap:11px 26px}
@media(max-width:640px){ .pinfo .cols{grid-template-columns:1fr} }
.pinfo .it{display:flex;gap:11px;align-items:center;font-size:14.5px;font-weight:600;color:var(--ink-2);line-height:1.5}
.pinfo .it i{flex:0 0 22px;height:22px;border-radius:50%;background:linear-gradient(140deg,#2f7bff,#0d3fae);
  color:#fff;display:grid;place-items:center;box-shadow:0 2px 7px rgba(31,107,255,.35)}
.pinfo .it svg{width:12px;height:12px}
/* pasos en cascada */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:820px){ .steps{grid-template-columns:1fr 1fr} }
@media(max-width:520px){ .steps{grid-template-columns:1fr} }
.steps .stp{background:var(--blue-xl);border:1px solid #dbe7fb;border-radius:14px;padding:20px;font-size:15.5px;
  color:var(--ink-2);font-weight:600;line-height:1.55;transition:.18s;
  opacity:0;transform:translateY(14px)}
.pinfo.vis .steps .stp{opacity:1;transform:none;transition:opacity .5s ease,transform .5s ease,box-shadow .18s,border-color .18s}
.pinfo.vis .steps .stp:nth-child(1){transition-delay:.05s}
.pinfo.vis .steps .stp:nth-child(2){transition-delay:.13s}
.pinfo.vis .steps .stp:nth-child(3){transition-delay:.21s}
.pinfo.vis .steps .stp:nth-child(4){transition-delay:.29s}
.pinfo.vis .steps .stp:nth-child(5){transition-delay:.37s}
.pinfo.vis .steps .stp:nth-child(6){transition-delay:.45s}
.steps .stp:hover{box-shadow:0 10px 26px rgba(31,107,255,.14);transform:translateY(-3px);border-color:#bcd4fa;background:#fff}
.steps .stp .em{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-size:17px;font-weight:700;
  color:var(--blue-d);margin-bottom:9px}
.steps .stp .em i{font-style:normal;font-size:23px}
/* razones */
.trust3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:700px){ .trust3{grid-template-columns:1fr} }
.tc{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 20px;font-size:13.5px;
  font-weight:600;color:var(--ink-2);line-height:1.6;text-align:center;transition:.18s;box-shadow:var(--sh-1)}
.tc:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(18,64,150,.14);border-color:#c9dbf7}
.tc .em{display:block;font-family:var(--disp);font-weight:700;font-size:27px;color:var(--ink);
  margin-bottom:6px;letter-spacing:-.02em}
.tc .em i{display:block;font-style:normal;font-size:32px;line-height:1;margin-bottom:8px;
  animation:flota 3.4s ease-in-out infinite}
.tc:nth-child(2) .em i{animation-delay:.5s}
.tc:nth-child(3) .em i{animation-delay:1s}
@keyframes flota{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
/* reseñas: carrusel nativo con scroll-snap, sin librerías */
.rvwrap{position:relative}
.reviews{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:2px 2px 4px;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
.reviews::-webkit-scrollbar{display:none}
.reviews .rv{flex:0 0 100%;scroll-snap-align:start}
.rvnav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:38px;height:38px;
  border-radius:50%;border:1px solid var(--line-2);background:#fff;color:var(--ink);
  font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(10,30,60,.18);transition:.14s;font-family:var(--disp);padding-bottom:3px}
.rvnav:hover{border-color:var(--blue);color:var(--blue-d)}
.rvnav:focus-visible{outline:3px solid rgba(31,107,255,.45);outline-offset:2px}
.rvnav[disabled]{opacity:.35;cursor:default;box-shadow:none}
.rvnav.prev{left:-13px}
.rvnav.next{right:-13px}
@media(max-width:640px){ .rvnav.prev{left:-4px} .rvnav.next{right:-4px} }
.rvdots{display:flex;justify-content:center;gap:7px;margin-top:12px}
.rvdots button{width:8px;height:8px;border-radius:50%;border:none;padding:0;cursor:pointer;
  background:var(--line-2);transition:.15s}
.rvdots button.on{background:var(--blue);width:22px;border-radius:99px}
@media(prefers-reduced-motion:reduce){ .reviews{scroll-behavior:auto} }
.reviews .rv{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;position:relative;
  display:flex;flex-direction:column;box-shadow:var(--sh-1)}
.reviews .rv::before{content:'"';position:absolute;top:2px;right:16px;font-family:var(--disp);font-size:62px;
  line-height:1;color:var(--blue);opacity:.14}
.reviews .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(140deg,#0a2f6e,#1f6bff);
  box-shadow:0 0 0 3px #dbe7fb;
  color:#fff;font-family:var(--disp);font-weight:700;font-size:14px;display:flex;align-items:center;
  justify-content:center;margin-bottom:10px;order:-1}
.reviews .st{color:#f5a623;font-size:15px;letter-spacing:3px;margin-bottom:9px}
.reviews .rt{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--ink);margin-bottom:7px}
.reviews .rq{color:var(--ink-2);font-size:14.5px;font-weight:600;line-height:1.55;margin:0 0 12px;font-style:normal}
.reviews .rn{font-weight:900;color:var(--grey);font-size:12px;text-transform:uppercase;letter-spacing:.9px}

/* ── paso 2 y 3 ───────────────────────────────────────────────────────────── */
#paso2,#paso3{max-width:1120px;margin:34px auto 0;padding:0 22px}
.card2{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px;max-width:600px;
  margin:0 auto;box-shadow:var(--sh-3)}
@media(max-width:560px){ .card2{padding:24px 20px} }
.back{display:inline-block;color:var(--grey);font-weight:800;font-size:12.5px;cursor:pointer;margin-bottom:14px;text-decoration:none}
.back:hover{color:var(--blue-d)}
.card2 h2{font-family:var(--disp);font-weight:700;font-size:27px;margin-bottom:7px;letter-spacing:-.02em}
.card2 .sub{color:var(--grey);font-size:14.5px;font-weight:600;margin-bottom:24px;line-height:1.55}
.pasoInd{display:inline-block;font-size:10.5px;font-weight:900;letter-spacing:1.4px;color:var(--blue-d);
  text-transform:uppercase;margin-bottom:9px;background:var(--blue-l);border:1px solid #d4e2fb;
  border-radius:999px;padding:5px 12px}
.resumen2{display:flex;flex-direction:column;align-items:flex-start;gap:7px;background:var(--green-l);
  border-radius:14px;border:1.5px solid #c9dcfa;padding:18px 20px;margin-bottom:24px;box-shadow:var(--sh-1)}
.resumen2 img{height:34px;width:auto;max-width:120px;object-fit:contain;margin-bottom:3px}
@media(max-width:560px){ .resumen2 img{height:30px;max-width:100px} .resumen2{padding:16px 17px} }
.resumen2 .rp{font-family:var(--disp);font-weight:700;font-size:27px;line-height:1.1;color:var(--ink);font-variant-numeric:tabular-nums}
/* el nombre de compañía sin logo llega con Baloo 2 en línea: se re-tipa */
.resumen2 b{font-family:var(--disp)!important}
.resumen2 .rd{font-size:13px;font-weight:700;color:var(--ink-2);line-height:1.65}
.fld{margin-bottom:22px}
.fld label{display:block;font-size:11px;font-weight:900;color:var(--ink-2);margin-bottom:8px;
  text-transform:uppercase;letter-spacing:1px}
.inp{width:100%;border:1.5px solid var(--line-2);border-radius:12px;padding:15px 14px;font:inherit;font-weight:700;
  font-size:15px;background:#fff;outline:none;transition:.14s;color:var(--ink)}
.inp:hover{border-color:#a9c2ec}
.inp:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,107,255,.15)}
.inp.bad{border-color:#c62a1c;background:#fdf4f3}
.telrow{display:flex;gap:9px}
.telrow .telcc{flex:0 0 74px;width:74px;text-align:center;font-weight:800}
.telrow .telnum{flex:1 1 auto;min-width:0}
select.inp{appearance:auto;cursor:pointer}
.err2{display:none;margin-top:7px;font-size:12.5px;font-weight:800;color:#c62a1c}
.err2.on{display:block}
.mini2{color:var(--grey-2);font-size:11.5px;font-weight:700;text-align:center;margin-top:13px;line-height:1.6}
.mini2 a{color:var(--blue-d)}
.okic{width:60px;height:60px;border-radius:50%;background:var(--green-l);color:var(--green);display:grid;
  place-items:center;margin:4px auto 15px}
.okic svg{width:28px;height:28px}
.fin-h{text-align:center}
.ref{display:inline-block;border:1.5px dashed var(--line-2);color:var(--blue-d);border-radius:999px;
  padding:9px 20px;font-weight:900;font-size:12.5px;margin:13px auto;text-align:center;letter-spacing:.6px}
.fin-cia{display:inline-flex;align-items:center;vertical-align:middle;background:#fff;
  border:1px solid var(--line-2);border-radius:10px;padding:7px 13px;margin:0 4px;box-shadow:var(--sh-1)}
.fin-cia img{height:34px;width:auto;max-width:110px;object-fit:contain;display:block}
@media(max-width:560px){ .fin-cia{padding:6px 10px} .fin-cia img{height:28px;max-width:92px} }
.ciapdf{display:flex;width:100%;margin:14px auto 4px;background:#fff;border:1.5px solid var(--line-2);
  border-radius:12px;padding:12px;font-family:'Nunito',sans-serif;font-size:13.5px;font-weight:800;
  color:var(--blue-d);cursor:pointer;align-items:center;justify-content:center;gap:8px;
  transition:border-color .15s,background .15s}
.ciapdf:hover{border-color:var(--blue);background:var(--blue-xl)}
.ciapdf:focus-visible{outline:3px solid rgba(31,107,255,.45);outline-offset:2px}
.pdfic{background:#c0392b;color:#fff;font-size:10px;font-weight:800;padding:3px 6px;
  border-radius:4px;letter-spacing:.04em;flex:0 0 auto}

/* ── piezas nuevas del paso 2 (beneficiarios, fecha de comienzo, IBAN) ─────── */
/* la fecha de comienzo: campo de texto + botón de calendario al lado */
.finirow{display:flex;gap:9px}
.finirow .inp{flex:1 1 auto;min-width:0}
.finical{position:relative;flex:0 0 54px;display:grid;place-items:center;border:1.5px solid var(--line-2);
  border-radius:12px;background:#fff;font-size:19px;transition:.14s;cursor:pointer}
.finical:hover{border-color:var(--blue)}
.finical:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,107,255,.15)}
.finical input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0}
/* nota tranquilizadora bajo el IBAN. Azul claro: --ink-2 encima da 9,4:1 y el
   negrita --blue-d 6,2:1; ambos pasan el 4,5:1 (remedido tras el cambio a azul). */
.notaseg{display:flex;gap:9px;align-items:flex-start;margin-top:9px;padding:11px 13px;
  border-radius:12px;background:var(--blue-l);border:1px solid #cddffc}
.notaseg .ic{font-size:15px;line-height:1.5;flex:0 0 auto}
.notaseg p{font-size:12.5px;font-weight:700;color:var(--ink-2);line-height:1.55}
.notaseg b{color:var(--blue-d);font-weight:900}
/* cabecera pequeña de los sub-pasos 4 y 5 */
.sp5head{margin:4px 0 16px}
.sp5head b{font-family:var(--disp);font-weight:700;font-size:19px;color:var(--ink);display:block;margin-bottom:2px}
.sp5head span{font-size:12.5px;font-weight:700;color:var(--grey)}
/* mini-póliza: resumen compacto de lo elegido, a propósito pequeña para que el
   campo del IBAN se vea sin bajar */
.minipoliza{background:var(--blue-xl);border:1.5px solid #c9dcfa;border-radius:12px;
  padding:12px 16px;margin-bottom:18px;position:relative;overflow:hidden}
.minipoliza::before{content:'';position:absolute;top:0;bottom:0;left:0;width:3px;
  background:linear-gradient(180deg,var(--blue),var(--cyan))}
.mp-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;
  padding:6.5px 0;border-bottom:1px dashed #d6e3f8}
.mp-row:last-child{border-bottom:none}
.mp-row span{color:var(--grey);font-weight:900;text-transform:uppercase;font-size:10.5px;
  letter-spacing:.8px;flex:0 0 auto}
.mp-row b{color:var(--ink);font-weight:800;text-align:right;min-width:0;overflow-wrap:anywhere;line-height:1.45}
/* los dos desplegables del IBAN */
.ibfaq{border:1.5px solid var(--line-2);border-radius:12px;margin-bottom:9px;background:#fff;transition:border-color .15s}
.ibfaq[open]{border-color:#b6cdf1}
.ibfaq summary{cursor:pointer;font-weight:800;font-size:13.5px;color:var(--ink);
  padding:12px 14px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:10px}
.ibfaq summary::-webkit-details-marker{display:none}
.ibfaq summary::after{content:'\25be';color:var(--blue);transition:transform .2s;flex:0 0 auto}
.ibfaq[open] summary::after{transform:rotate(180deg)}
.ibfaq p{font-size:12.5px;font-weight:600;color:var(--ink-2);line-height:1.6;padding:0 14px 12px}
.ibfaq b{font-weight:900}

/* ── venta cruzada ────────────────────────────────────────────────────────── */
.xsell{margin-top:40px;border:1.5px solid #f6c39a;border-radius:var(--r);padding:38px 22px 18px;
  position:relative;text-align:left;background:linear-gradient(180deg,#fff7f0,#fef1e5);
  box-shadow:var(--sh-2);animation:xspop .35s ease both}
@keyframes xspop{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.xsell .badge{position:absolute;top:-27px;left:50%;transform:translateX(-50%);
  background:linear-gradient(150deg,#ff8a2e,var(--orange-d));color:#fff;font-family:var(--disp);font-weight:700;
  font-size:23px;letter-spacing:.01em;padding:14px 30px;border-radius:999px;white-space:nowrap;
  box-shadow:0 10px 26px rgba(244,115,31,.45);animation:latido 2.6s ease-in-out infinite}
@keyframes latido{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.045)}}
@media(max-width:560px){ .xsell .badge{font-size:17px;padding:11px 20px;top:-22px} }
@media(prefers-reduced-motion:reduce){ .xsell .badge{animation:none} }
.xsell h3{font-family:var(--disp);font-weight:700;color:var(--ink);font-size:20px;line-height:1.22;margin:9px 0 10px}
.xsell p{color:var(--grey);font-size:14.5px;margin:0 0 6px;line-height:1.55}
.xsell .xs-lead{margin:0 0 16px}
.xsell .xs-cia{display:flex;align-items:center;gap:11px;flex-wrap:wrap;color:var(--grey-2);font-size:11px;
  font-weight:900;letter-spacing:.9px;text-transform:uppercase;margin:0 0 8px}
/* 42px es el TOPE de nitidez del logo incrustado (122x42): no se sube */
.xsell .xs-logo{height:42px;width:auto;max-width:190px;object-fit:contain}
@media(max-width:440px){ .xsell .xs-logo{height:38px;max-width:165px} }
.xsell .precio{display:flex;align-items:baseline;gap:10px;margin:13px 0 2px}
.xsell .precio .antes{color:var(--grey-2);text-decoration:line-through;font-size:16px;font-weight:700}
.xsell .precio .ahora{font-family:var(--disp);font-weight:700;color:var(--ink);font-size:31px;line-height:1;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.xsell .precio .mes{color:var(--grey);font-size:13px;font-weight:700}
.xsell .cta{display:block;width:100%;margin-top:15px;background:linear-gradient(150deg,#ff8a2e,var(--orange-d));
  color:#fff;border:none;border-radius:14px;padding:15px;font-family:var(--disp);font-weight:700;font-size:16px;
  cursor:pointer;transition:.15s;box-shadow:0 8px 20px rgba(244,115,31,.34)}
.xsell .cta:hover{filter:brightness(1.05);transform:translateY(-2px)}
.xsell .mini{color:var(--grey-2);font-size:11.5px;font-weight:700;text-align:center;margin-top:10px;line-height:1.5}
.xsell.hecho{background:var(--green-l);border-color:#a9c8f5}
.spin-sm{width:15px;height:15px;border-width:2px;margin:0;display:inline-block;vertical-align:-3px}
.xsell .xs-nota{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:800;color:var(--ink-2);margin:10px 0 0}
.xsell .xs-nota[hidden]{display:none}
.xsell .xs-nota .spin-sm{border-color:var(--line-2);border-top-color:var(--orange);flex:0 0 auto}
.xsell .xs-nota.aviso{color:#8a5406}
.xs-extra{margin-top:17px;padding-top:17px;border-top:1.5px dashed #f0c9a4}
.xs-extra-h{font-family:var(--disp);font-weight:700;color:var(--ink);font-size:15.5px;margin-bottom:5px}
.xs-extra-sub{color:var(--grey);font-size:12.5px;margin:0 0 12px;line-height:1.5}
.xs-row{display:flex;gap:8px;align-items:center;margin-bottom:9px}
.xs-in{border:1.5px solid #f0c9a4;border-radius:11px;padding:11px 12px;font-family:'Nunito',sans-serif;font-weight:700;
  font-size:14px;color:var(--ink);background:#fff;outline:none;transition:.14s}
.xs-in:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(244,115,31,.15)}
.xs-nom{flex:1 1 auto;min-width:0}
.xs-dni{flex:0 0 108px;width:108px}
.xs-edad{flex:0 0 72px;width:72px;text-align:center}
.xs-del{flex:0 0 34px;height:34px;border:1.5px solid #f0c9a4;background:#fff;color:var(--grey-2);border-radius:10px;
  font-size:18px;line-height:1;cursor:pointer;font-weight:700;transition:.14s}
.xs-del:hover{border-color:#c62a1c;color:#c62a1c}
.xs-add{background:none;border:2px dashed #f0c9a4;color:var(--orange-d);border-radius:11px;padding:16px 14px;
  font-family:var(--disp);font-weight:700;font-size:18px;cursor:pointer;width:100%;transition:.14s;margin-top:3px}
.xs-add:hover{border-color:var(--orange);background:#fff}
.xs-add[disabled]{opacity:.45;cursor:default}
@media(max-width:560px){
  .xs-row{flex-wrap:wrap} .xs-nom{flex:1 1 100%} .xs-dni{flex:1 1 auto;width:auto} .xs-edad{flex:0 0 72px}
}

/* ── cookies ──────────────────────────────────────────────────────────────── */
.ckbanner{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;padding:14px;
  background:rgba(8,22,48,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.ckbanner.on{display:flex;justify-content:center}
.ckbox{background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(6,18,44,.35);max-width:720px;width:100%;padding:20px 22px}
.ckbox p{color:var(--ink-2);font-size:13.5px;line-height:1.6;margin:0 0 13px}
.ckbox a{color:var(--blue-d);font-weight:800}
.ckrow{display:flex;gap:9px;flex-wrap:wrap}
.ckbtn{border:none;border-radius:11px;padding:12px 18px;font-family:var(--disp);font-weight:700;font-size:14px;cursor:pointer;transition:.14s}
.ckbtn:hover{transform:translateY(-1px)}
.ckb-si{background:linear-gradient(150deg,#ff8a2e,var(--orange-d));color:#fff}
.ckb-no{background:var(--ink);color:#fff}
.ckb-cfg{background:var(--blue-l);color:var(--blue-d)}
.ckb-save{background:var(--blue);color:#fff;align-self:flex-start}
.ckopts{margin:0 0 13px;padding:13px 15px;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;gap:10px}
.ckopts[hidden]{display:none}
.ckopts label{font-size:13.5px;color:var(--ink-2);font-weight:700;display:flex;gap:10px;align-items:center}
@media(max-width:560px){ .ckrow{flex-direction:column} .ckrow .ckbtn{width:100%} }

/* ── pie: azul marino profundo, remate del degradado de la página ─────────── */
footer{background:linear-gradient(180deg,#0a1e3c,#071630);color:#8ea6c6;padding:44px 0 40px;
  font-size:12.5px;font-weight:600;line-height:1.75;margin-top:48px;position:relative}
footer::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--blue),var(--cyan))}
footer .fg{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
footer img{height:21px;width:auto;filter:brightness(0) invert(1);opacity:.85;margin-bottom:12px;display:block}
footer a{color:#7fc0ff}

/* ── barra fija: cristal oscuro con filo azul→cian ────────────────────────── */
.stickybar{position:fixed;left:0;right:0;bottom:0;background:rgba(8,22,48,.92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;z-index:60;
  transform:translateY(110%);transition:.25s;border-top:0}
.stickybar::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--blue),var(--cyan))}
.stickybar.on{transform:none}
.stickybar .in{max-width:1120px;margin:0 auto;padding:12px 22px;display:flex;align-items:center;
  justify-content:space-between;gap:14px}
.sp-price{font-family:var(--disp);font-weight:700;font-size:18px;font-variant-numeric:tabular-nums}
.sp-price .sp-per{font-size:12px}
@media(max-width:340px){ .sp-price .sp-per{display:block;line-height:1.15} }
.sp-price small{display:block;font-family:'Nunito',sans-serif;font-weight:700;font-size:11px;color:#8fd2ff;
  letter-spacing:.6px;text-transform:uppercase}
.sp-btn{background:linear-gradient(150deg,#ff8a2e,var(--orange-d));color:#fff;border:none;border-radius:12px;
  padding:13px 28px;font-family:var(--disp);font-weight:700;font-size:15px;box-shadow:0 6px 18px rgba(244,115,31,.4)}
.sp-btn:hover{filter:brightness(1.05)}
/* botón de llamada: 44x44 mínimo táctil, blanco sobre la barra oscura (14:1) */
.sp-call{flex:0 0 auto;width:44px;height:44px;padding:0;background:#fff;color:var(--blue-d);
  border:1.5px solid #fff;border-radius:12px;font-size:19px;cursor:pointer;
  line-height:1;display:flex;align-items:center;justify-content:center;transition:.14s;
  box-shadow:0 3px 10px rgba(0,0,0,.25)}
.sp-call:hover{background:var(--blue-l);border-color:var(--blue-l)}
.sp-call:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.sp-call.hecho{background:var(--green-l);border-color:var(--mint);cursor:default;box-shadow:none}
.sp-call.hecho:hover{background:var(--green-l);border-color:var(--mint)}
.stickybar .in .sp-der{display:flex;align-items:center;gap:10px;flex:0 0 auto}
@media(max-width:560px){ .sp-price{font-size:15px} .sp-btn{padding:12px 18px;font-size:14px}
  .stickybar .in{padding:12px 14px;gap:10px} .stickybar .in .sp-der{gap:8px} }

/* ── "prefiero que me llame un asesor": VISIBLE hasta que da su teléfono ────
   La retirada del botón es solo para DESPUÉS del paso de nombre/DNI/teléfono
   — con el número ya en la mano, el botón sobra. La regla dinámica vive en
   pintaBotonAsesor(): con
   S.datos.telefono dado, apaga #asCalc, #asForm y #spAsesor. Aquí solo se
   apaga .p-cta2 (pantalla final: ahí el teléfono ya se dio siempre). */
.p-cta2{display:none!important}

.asesor{display:block;width:100%;margin:11px auto 0;background:#fff;
  border:1.5px dashed #b6cdf1;border-radius:12px;padding:11px 14px;cursor:pointer;
  font-family:var(--disp);font-size:14.5px;font-weight:700;color:var(--blue-d);
  text-align:center;line-height:1.35;transition:.15s}
.asesor:hover{background:var(--blue-xl);border-color:var(--blue)}
.asesor:focus-visible{outline:3px solid rgba(31,107,255,.45);outline-offset:2px}
a.asesor{text-decoration:none}
.asesor small{display:block;font-family:'Nunito',sans-serif;font-size:12.5px;font-weight:700;
  color:var(--grey);margin-top:2px}
.asesor.hecho{border-style:solid;border-color:#a9c8f5;background:var(--green-l);color:var(--green-d);cursor:default}
.asesor.hecho:hover{background:var(--green-l);border-color:#a9c8f5}

/* ventana de la llamada (z 160: por delante del presupuesto, que va a 150) */
.asov{position:fixed;inset:0;z-index:160;display:none;background:rgba(8,22,48,.55);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:18px;overflow-y:auto}
.asov.on{display:flex;align-items:center;justify-content:center}
.asbox{background:#fff;border-radius:var(--r);max-width:430px;width:100%;padding:24px 22px 20px;
  box-shadow:0 24px 70px rgba(6,18,44,.4);position:relative}
.asx{position:absolute;top:12px;right:12px;border:none;background:var(--blue-l);border-radius:10px;
  width:34px;height:34px;font-size:15px;font-weight:800;cursor:pointer;color:var(--ink);line-height:1}
.asx:hover{background:#d9e6fb}
.asbox h3{font-family:var(--disp);font-weight:700;font-size:22px;color:var(--ink);
  margin:0 34px 6px 0;line-height:1.25;letter-spacing:-.01em}
.asbox .assub{font-size:13.5px;font-weight:600;color:var(--grey);line-height:1.55;margin-bottom:16px}
.asok{text-align:center}
.asok .em{font-size:38px;display:block;margin-bottom:6px}
.asotel{display:block;text-align:center;margin-top:13px;font-size:13px;font-weight:700;
  color:var(--grey);line-height:1.5}
.asotel a{color:var(--blue-d);font-weight:900;text-decoration:none;white-space:nowrap}
.asacepta{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--ink-2);
  line-height:1.5;margin-top:4px;cursor:pointer;font-weight:600}
.asacepta input{width:19px;height:19px;flex:0 0 auto;margin-top:1px;accent-color:var(--blue)}
.asacepta a{color:var(--blue-d);font-weight:800}

/* ── el presupuesto imprimible ────────────────────────────────────────────── */
.presuov{position:fixed;inset:0;z-index:150;display:none;background:rgba(8,22,48,.55);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);overflow-y:auto}
.presuov.on{display:block}
.presubar{position:sticky;top:0;z-index:2;background:linear-gradient(150deg,#0a2f6e,#1a5fe0);color:#fff;
  padding:11px 14px;display:flex;align-items:center;gap:11px;flex-wrap:wrap;box-shadow:0 4px 14px rgba(6,18,44,.3)}
.presubar b{font-size:14.5px;font-weight:800}
.presubar .sp{flex:1;min-width:6px}
.presubtn{background:#fff;color:var(--blue-d);border:none;border-radius:10px;padding:10px 17px;
  font-family:var(--disp);font-size:15px;font-weight:700;cursor:pointer;white-space:nowrap}
.presubtn:hover{background:var(--blue-l)}
.presubtn.wa{color:#075E54;display:inline-flex;align-items:center;gap:8px}
.presubtn.wa svg{width:18px;height:18px;fill:#25D366;flex:0 0 auto}
.presux{background:rgba(255,255,255,.2);color:#fff;border:none;border-radius:10px;width:40px;height:40px;
  font-size:19px;font-weight:800;cursor:pointer;line-height:1;flex:0 0 auto}
.presux:hover{background:rgba(255,255,255,.34)}
.presubtn:focus-visible,.presux:focus-visible{outline:3px solid #fff;outline-offset:2px}
@media(max-width:600px){
  .presubar .sp{display:none}
  .presubar b{order:0}
  .presux{order:1;margin-left:auto}
  .presubar::after{content:'';flex:0 0 100%;height:0;order:2}
  .presubar{gap:6px}
  .presubtn{order:3;padding:10px 9px;font-size:14.5px;flex:1 1 auto;justify-content:center}
  .presubtn.wa{gap:6px}
  .presubtn:not(.wa){order:4}
}
.presuhoja{max-width:780px;margin:18px auto 40px;background:#fff;padding:32px 34px 28px;border-radius:12px;
  box-shadow:0 18px 50px rgba(6,18,44,.35)}
@media(max-width:600px){ .presuhoja{padding:22px 18px;margin:12px 10px 30px} }
.p-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
  border-bottom:3px solid var(--blue);padding-bottom:14px;margin-bottom:18px}
.p-lselia{height:42px;width:auto}
.p-meta{text-align:right;font-size:12px;line-height:1.7;color:var(--grey)}
.p-meta b{color:var(--ink)}
.p-h1{font-family:var(--disp);font-weight:700;font-size:22px;color:var(--ink);margin-bottom:4px;line-height:1.25}
.p-sub{font-size:13.5px;color:var(--grey);margin-bottom:18px;line-height:1.5}
.p-cia{display:flex;align-items:center;gap:14px;background:var(--blue-xl);border:1px solid #d4e2fb;
  border-radius:10px;padding:12px 15px;margin-bottom:20px}
.p-et{font-size:11.5px;color:var(--grey);font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.p-nb{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--ink)}
.p-lcia{height:34px;width:auto;margin-left:auto}
.p-h2{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--blue-d);text-transform:uppercase;
  letter-spacing:.05em;margin:20px 0 8px}
.p-t{width:100%;border-collapse:collapse;font-size:13.5px}
.p-t td{padding:7px 0;border-bottom:1px solid #eef3fb;vertical-align:top}
.p-t td:first-child{color:var(--grey);width:52%;font-weight:600}
.p-t td:last-child{color:var(--ink);font-weight:800;text-align:right}
.p-caja{background:var(--green-l);border:1.5px solid #a9c8f5;border-radius:12px;padding:16px 18px;margin-top:10px}
.p-mes{font-family:var(--disp);font-weight:700;font-size:34px;color:var(--green-d);line-height:1.1;
  font-variant-numeric:tabular-nums}
.p-mes span{font-size:15px;color:var(--grey)}
.p-an{font-size:13.5px;color:var(--grey);margin-bottom:10px;font-weight:600}
.p-nota{font-size:12px;color:var(--grey);margin-top:9px;line-height:1.5;font-weight:600}
.p-ul{margin:6px 0 0 18px;font-size:13.5px;line-height:1.75;font-weight:600;color:var(--ink-2)}
.p-ul b{color:var(--ink)}
.p-pasos{margin:6px 0 0 18px;font-size:13.5px;line-height:1.8;font-weight:600;color:var(--ink-2)}
.p-legal{background:var(--gold-l);border:1px solid #f0dcae;border-radius:9px;padding:11px 13px;
  font-size:11.5px;line-height:1.6;color:#7a5b06;margin-top:18px;font-weight:600}
.p-foot{margin-top:20px;border-top:1px solid var(--line);padding-top:13px;font-size:11px;
  line-height:1.65;color:var(--grey);font-weight:600}
.p-foot b{color:var(--ink)}
.p-cta{display:block;width:100%;margin-top:20px;background:linear-gradient(150deg,#ff8a2e,var(--orange-d));
  color:#fff;border:none;border-radius:14px;padding:16px;font-family:var(--disp);font-weight:700;font-size:17px;
  cursor:pointer;box-shadow:0 8px 22px rgba(244,115,31,.34)}
.p-cta:hover{filter:brightness(1.05)}
.p-cta2{display:block;width:100%;margin-top:10px;background:#fff;
  border:1.5px dashed #b6cdf1;border-radius:12px;padding:13px 14px;cursor:pointer;
  font-family:var(--disp);font-size:15px;font-weight:700;color:var(--blue-d);
  text-align:center;line-height:1.35;transition:.15s}
.p-cta2:hover{background:var(--blue-xl);border-color:var(--blue)}
.p-cta2:focus-visible{outline:3px solid rgba(31,107,255,.45);outline-offset:2px}
.p-cta2 small{display:block;font-family:'Nunito',sans-serif;font-size:12.5px;font-weight:700;
  color:var(--grey);margin-top:3px}
.p-cta2.hecho{border-style:solid;border-color:#a9c8f5;background:var(--green-l);color:var(--green-d);cursor:default}
.p-cta2.hecho:hover{background:var(--green-l);border-color:#a9c8f5}
/* al imprimir con el presupuesto abierto: en el papel, solo la hoja */
@media print{
  body.conpresu>*{display:none!important}
  body.conpresu>.presuov{display:block!important;position:static!important;background:#fff!important;
    overflow:visible!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  body.conpresu .presubar{display:none!important}
  body.conpresu .presuhoja{box-shadow:none!important;margin:0!important;padding:0!important;
    max-width:none!important;border-radius:0!important}
  body.conpresu .p-cta,body.conpresu .p-cta2{display:none!important}
  @page{size:A4;margin:14mm}
}

@media(prefers-reduced-motion:reduce){
  .pinfo,.steps .stp{opacity:1!important;transform:none!important;transition:none!important}
  .tc .em i{animation:none}
}
  .faqs details{background:#fff;border:1.5px solid var(--line-2);border-radius:14px;padding:14px 17px;margin-bottom:10px;
    transition:border-color .15s,box-shadow .15s}
  .faqs details:hover{border-color:#b6cdf1}
  .faqs details[open]{border-color:#b6cdf1;box-shadow:var(--sh-1)}
  /* la flecha va en un hueco fijo a la izquierda (sangría francesa): si la
     pregunta salta a una segunda línea, arranca alineada con la primera */
  .faqs summary{font-family:var(--disp);font-weight:700;cursor:pointer;color:var(--ink);
    font-size:15.5px;line-height:1.45;list-style:none;position:relative;padding-left:25px;
    letter-spacing:-.01em}
  .faqs summary::-webkit-details-marker{display:none}
  .faqs summary::before{content:'\25b8';position:absolute;left:3px;top:-1px;color:var(--blue);
    transition:transform .2s;transform-origin:40% 55%}
  .faqs details[open] summary::before{transform:rotate(90deg)}
  .faqs p{margin:9px 0 2px 25px;font-size:14px;line-height:1.65;color:var(--ink-2);font-weight:600}
  .faqs a{color:var(--blue-d)}
/* por encima de «Te llamamos» (160) y del presupuesto (150): el aviso legal se abre
   desde la casilla de «Te llamamos» y antes quedaba debajo, sin verse (07/10/2026) */
.lgov{position:fixed;inset:0;z-index:170;display:none;background:rgba(11,31,51,.55);backdrop-filter:blur(3px);padding:20px}
.lgov.on{display:flex;align-items:center;justify-content:center}
.lgbox{background:#fff;border-radius:18px;max-width:760px;width:100%;max-height:min(86vh,900px);display:flex;flex-direction:column;box-shadow:0 24px 70px rgba(11,31,51,.4)}
.lghead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 20px;border-bottom:1px solid #e3ecf3}
.lghead b{font-family:'Space Grotesk',sans-serif;font-size:18px;color:#0b1f33}
.lgx{border:none;background:#eef3f7;border-radius:10px;width:34px;height:34px;font-size:15px;font-weight:800;cursor:pointer;color:#0b1f33}
.lgx:hover{background:#e0e9f0}
.lgbody{padding:4px 22px 26px;overflow-y:auto;line-height:1.6;font-family:'Nunito',sans-serif}
.lgbody h2{font-family:'Space Grotesk',sans-serif;font-size:16.5px;margin:20px 0 6px;color:#0b1f33}
.lgbody h3{font-family:'Space Grotesk',sans-serif;font-size:14.5px;margin:15px 0 5px;color:#0b1f33}
.lgbody p,.lgbody li,.lgbody td,.lgbody th{font-size:13.5px;color:#5b7186;font-weight:600}
.lgbody b{color:#0b1f33}
.lgbody mark{background:#fff3bf;border-radius:4px;padding:1px 6px;font-weight:800}
.lgbody a{color:#2f6df6;font-weight:700}
.lgbody table{border-collapse:collapse;width:100%;margin:10px 0}
.lgbody th,.lgbody td{border:1px solid #dbe6ef;padding:7px 9px;text-align:left;vertical-align:top}
.lgbody th{background:#eef4f9}
.lgbody .aviso{background:#fdf1e7;border:1.5px solid #f4c9a4;border-radius:12px;padding:12px 14px;margin:12px 0}
.lgdoc[hidden]{display:none!important}
/* tablas de la política de cookies en móvil: cada fila, una tarjeta (antes se salían de lado) */
@media (max-width:560px){
  .lgbody table,.lgbody tbody,.lgbody tr,.lgbody td{display:block;width:100%}
  .lgbody tr:has(th){display:none}
  .lgbody tr{border:1px solid #dbe6ef;border-radius:10px;margin:8px 0;padding:5px 0}
  .lgbody td{border:0;padding:3px 11px}
  .lgbody td code{word-break:break-all}
  .lgbody td:nth-child(2)::before{content:'Titular: '}
  .lgbody td:nth-child(4)::before{content:'Duración: '}
  .lgbody td:nth-child(2)::before,.lgbody td:nth-child(4)::before{color:#0b1f33;font-weight:800}
}
/* ── ronda de arreglos del 30/09/2026 ────────────────────────────────────── */
/* «← Atrás» ahora es un <button> de verdad (teclado y lectores de pantalla):
   mismo aspecto que el enlace de antes. */
button.back{background:none;border:0;padding:0;font:inherit;font-weight:800;font-size:12.5px;
  color:var(--grey);line-height:inherit}
.back:focus-visible,.btn-cta:focus-visible{outline:3px solid rgba(31,107,255,.45);outline-offset:2px;border-radius:6px}
/* notas pequeñas bajo un campo (fecha movida a mañana, IBAN completado desde
   la cuenta de 20 dígitos, DNI a reescribir tras recargar) */
.nota-fini,.nota-iban{text-align:left;margin-top:7px;color:var(--blue-d);font-size:12.5px;font-weight:800}
/* sello de pago seguro junto al IBAN, debajo de su botón («Continuar →») y su línea.
   Desde el 10/10/2026 a cualquier ancho (antes solo en el móvil) y en un
   recuadro suave, como en vidaseguros.selia.es. */
.sello-iban{display:block;margin:-4px 0 14px;padding:9px 12px;border-radius:10px;background:var(--blue-l,#eaf2ff);
  font-size:12px;font-weight:800;line-height:1.45;color:var(--blue-d);text-align:center}
/* la línea tranquilizadora y la privacidad, pegadas al botón del IBAN
   (como en tusegurovida) */
/* 14/10/2026: con el móvil ya dado, «que me llame un asesor» solo en horario
   laboral (ver aplicaHorarioLlamada en app.js) */
body.sin-llamada #asCalc,body.sin-llamada #asForm,body.sin-llamada #spAsesor,body.sin-llamada #asPresu{display:none!important}
.cierranota{font-size:12px;font-weight:700;color:var(--grey);line-height:1.5;text-align:center;margin:8px 0 14px}
.cierranota a{color:var(--blue-d);font-weight:800;white-space:nowrap}
/* Móvil, sub-pasos 2 a 4: el resumen de arriba se compacta para que los campos
   (sobre todo el IBAN del último) se vean antes sin bajar. En el 1 se queda
   como estaba: es el que presenta lo que se va a contratar. */
@media(max-width:600px){
  #paso2[data-sp="2"],#paso2[data-sp="3"],#paso2[data-sp="4"]{margin-top:12px}
  #paso2[data-sp="2"] .card2,#paso2[data-sp="3"] .card2,#paso2[data-sp="4"] .card2{padding:16px 16px 20px}
  #paso2[data-sp="2"] .back,#paso2[data-sp="3"] .back,#paso2[data-sp="4"] .back{margin-bottom:8px}
  #paso2[data-sp="2"] .pasoInd,#paso2[data-sp="3"] .pasoInd,#paso2[data-sp="4"] .pasoInd{margin-bottom:6px}
  #paso2[data-sp="2"] #paso2h2,#paso2[data-sp="3"] #paso2h2{font-size:20px;margin-bottom:10px}
  #paso2[data-sp="4"] #paso2h2,
  #paso2[data-sp="2"] #paso2sub,#paso2[data-sp="3"] #paso2sub,#paso2[data-sp="4"] #paso2sub{display:none}
  #paso2[data-sp="2"] .resumen2,#paso2[data-sp="3"] .resumen2,#paso2[data-sp="4"] .resumen2{
    flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:9px 12px;margin-bottom:14px}
  #paso2[data-sp="2"] .resumen2 img,#paso2[data-sp="3"] .resumen2 img,#paso2[data-sp="4"] .resumen2 img{height:20px;max-width:72px;margin:0}
  #paso2[data-sp="2"] .resumen2 .rp,#paso2[data-sp="3"] .resumen2 .rp,#paso2[data-sp="4"] .resumen2 .rp{font-size:17px}
  #paso2[data-sp="2"] .resumen2 .rd,#paso2[data-sp="3"] .resumen2 .rd,#paso2[data-sp="4"] .resumen2 .rd{font-size:11.5px;line-height:1.4}
  #paso2[data-sp="4"] .sp5head{margin:0 0 10px}
  #paso2[data-sp="4"] .sp5head b{font-size:17px}
  #paso2[data-sp="4"] .minipoliza{padding:6px 12px;margin-bottom:12px}
  #paso2[data-sp="4"] .mp-row{padding:3px 0;font-size:12px;gap:10px}
  #paso2[data-sp="4"] .mp-row span{font-size:9.5px;letter-spacing:.5px}
  #paso2[data-sp="4"] .mp-row b{line-height:1.35}
}
#fin h2:focus{outline:none}

/* ===== cuestionario de salud tras el IBAN (15/10/2026, como en tusegurovida /vida) =====
   #spSqCuest (paso2.html, lo maneja salud.js): las tarjetas .sq-* de /vida con
   los colores y letras de esta web. */
#paso2 .sq-head{display:flex;gap:12px;align-items:center;margin:4px 0 6px}
#paso2 .sq-head-ic{width:46px;height:46px;flex:none;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--cyan));display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:0 6px 16px rgba(31,107,255,.25)}
#paso2 .sq-head b{display:block;font-family:var(--disp);font-weight:700;font-size:20px;color:var(--ink);line-height:1.2}
#paso2 .sq-head span{display:block;font-size:13.5px;font-weight:600;color:var(--grey);line-height:1.4;margin-top:2px}
#paso2 .sq-quien{margin:12px 0 16px;padding:11px 14px;border:1.5px dashed var(--line-2);border-radius:12px;background:var(--blue-xl);font-size:14px;font-weight:600;color:var(--ink)}
#paso2 .sq{margin:12px 0;padding:14px 16px;border:1.5px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--sh-1);transition:border-color .15s,box-shadow .15s}
#paso2 .sq:hover{border-color:var(--line-2)}
#paso2 .sq.bad{border-color:#c62a1c;background:#fdf4f3}
#paso2 .sq-top{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
#paso2 .sq-num{flex:none;width:26px;height:26px;border-radius:50%;background:var(--blue-l);color:var(--blue-d);font-weight:800;font-size:13.5px;display:flex;align-items:center;justify-content:center;margin-top:1px}
#paso2 .sq.bad .sq-num{background:#fbe1de;color:#c62a1c}
#paso2 .sq-p{margin:2px 0 0;font-weight:700;color:var(--ink);font-size:15px;line-height:1.4}
#paso2 .sq-si-no{display:flex;gap:10px;padding-left:36px}
#paso2 .sq-btn,#paso2 .sq-mp{flex:1;max-width:140px;padding:11px 0;border:1.5px solid var(--line-2);border-radius:999px;background:#fff;font:inherit;font-size:15px;font-weight:800;color:var(--ink);cursor:pointer;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
#paso2 .sq-btn:hover,#paso2 .sq-mp:hover{border-color:var(--blue)}
#paso2 .sq-btn:focus-visible,#paso2 .sq-mp:focus-visible{outline:3px solid rgba(31,107,255,.45);outline-offset:2px}
#paso2 .sq-btn.on,#paso2 .sq-mp.on{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 4px 12px rgba(31,107,255,.28)}
#paso2 .sq-extra{margin:10px 0 0 36px;padding:10px;border-radius:10px;background:var(--blue-xl)}
#paso2 .sq-extra textarea.inp{min-height:68px;resize:none;line-height:1.4;padding:10px 12px;font-weight:600}
#spSqCuest .fld label{font-size:12px}
#spSqCuest .inp::placeholder{color:var(--grey-2);font-weight:500;opacity:1}
#paso2 .sq-mp-row{padding-left:0}
#paso2 .sq-uni{display:flex;align-items:center;gap:10px}
#paso2 .sq-uni .inp{max-width:110px}
#paso2 .sq-uni span{font-size:14px;color:var(--grey);font-weight:700}
#paso2 .sq-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
#paso2 .sq-datos{margin:0 0 14px;padding:14px 16px 0;border:1.5px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--sh-1)}
#paso2 .sq-datos-t{font-weight:800;color:var(--ink);margin:0 0 10px;font-size:15px}
#spSqCuest .err2{margin:12px 0 4px}
#spSqCuest .btn-cta{margin-top:14px}
#spSqCuest .nota-fini{margin:0 0 12px}
/* nacionalidad (solo con NIE): se escribe para buscar o se elige de la lista, como en /vida */
#paso2 .nacdd .inp{padding-right:46px}
#paso2 .nacdd-chev{position:absolute;right:3px;top:3px;bottom:3px;width:42px;border:0;border-radius:10px;background:transparent;color:var(--blue);font-size:11px;cursor:pointer;transition:transform .2s}
#paso2 .nacdd.open .nacdd-chev{transform:rotate(180deg)}
#paso2 .nacdd-list{position:relative;top:auto;margin-top:6px;max-height:min(300px,45vh);box-shadow:0 8px 22px rgba(10,30,60,.12)}
#paso2 .nacdd-g{padding:9px 12px 4px;font-size:11px;font-weight:900;letter-spacing:.6px;text-transform:uppercase;color:var(--grey)}
#paso2 .nacdd-list .ciadd-row{font:inherit;font-weight:700;font-size:15px;color:var(--ink);padding:11px 12px;min-height:44px}
#paso2 .nacdd-list .ciadd-row.act{background:var(--blue-l);box-shadow:inset 3px 0 0 var(--blue)}
#paso2 .nacdd-nada{padding:11px 12px;font-size:13.5px;font-weight:700;color:var(--grey)}
@media (max-width:520px){#paso2 .sq-si-no{padding-left:0}#paso2 .sq-extra{margin-left:0}#paso2 .sq{padding:12px}#paso2 .sq-p{font-size:14px}}
/* móvil: arriba, compacto como en los sub-pasos 2 a 4 (el título, el texto y el resumen no se ven en el cuestionario) */
@media(max-width:600px){
  #paso2[data-sp="6"]{margin-top:12px}
  #paso2[data-sp="6"] .card2{padding:16px 16px 20px}
  #paso2[data-sp="6"] .back{margin-bottom:8px}
  #paso2[data-sp="6"] .pasoInd{margin-bottom:6px}
}