/* Formulario previo a WhatsApp. Usa los tokens de estilos-lucom.css. */
.fl-fondo{position:fixed;inset:0;z-index:9000;background:rgba(10,11,13,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .18s ease}
.fl-fondo.abierto{opacity:1;pointer-events:auto}
.fl-caja{background:#fff;border-radius:16px;width:100%;max-width:520px;max-height:92vh;overflow-y:auto;box-shadow:0 30px 70px rgba(0,0,0,.4);transform:translateY(12px);transition:transform .18s ease}
.fl-fondo.abierto .fl-caja{transform:none}

.fl-top{position:relative;padding:20px 24px 18px;background:var(--dark,#16171a);color:#fff;border-radius:16px 16px 0 0;overflow:hidden;isolation:isolate}
.fl-top img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 32%;z-index:-2}
.fl-top::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,15,17,.93) 0%,rgba(14,15,17,.78) 48%,rgba(70,16,11,.5) 100%)}
.fl-top h2{font-size:21px;font-weight:900;letter-spacing:-.02em;line-height:1.2;max-width:22ch}
.fl-top p{font-size:14px;color:rgba(255,255,255,.78);margin-top:6px;line-height:1.45;max-width:34ch}
.fl-cerrar{position:absolute;top:12px;right:12px;width:38px;height:38px;border:0;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;font-size:20px;line-height:1;cursor:pointer;z-index:1}
.fl-cerrar:hover{background:rgba(0,0,0,.7)}

.fl-cuerpo{padding:16px 24px 20px}
.fl-fila{display:grid;gap:10px}
.fl-fila--2{grid-template-columns:1fr 1fr}
.fl-fila--calle{grid-template-columns:1fr 110px}
/* Espaciado ajustado: el formulario entra casi entero sin scrollear.
   Los campos siguen en 46px, que es el mínimo cómodo para tocar con el dedo. */
.fl-campo{display:grid;gap:4px;margin-bottom:10px}
.fl-campo label{font-size:13px;font-weight:800;color:var(--texto-fuerte,#2D2D2D)}
.fl-campo label span{color:var(--texto-2,#6C6C6C);font-weight:500}
.fl-campo input,.fl-campo select{width:100%;font-family:inherit;font-size:16px;font-weight:500;color:var(--texto-fuerte,#2D2D2D);background:#fff;border:1.5px solid var(--borde,#DBDBDB);border-radius:10px;padding:11px 14px;min-height:46px;transition:border-color .15s,box-shadow .15s}
.fl-campo input:focus,.fl-campo select:focus{outline:0;border-color:var(--dark,#16171a);box-shadow:0 0 0 3px rgba(22,23,26,.12)}
.fl-campo input[aria-invalid="true"],.fl-campo input[aria-invalid="true"]:focus{border-color:var(--rojo,#DA291C);background:#fff7f6;box-shadow:0 0 0 3px rgba(218,41,28,.13)}
/* provincia: lista con buscador. La flecha la dibujamos nosotros porque la del
   select nativo cambia de forma y de alto en cada sistema. */
.fl-combo{position:relative}
.fl-combo input{padding-right:38px}
.fl-combo-flecha{position:absolute;right:14px;top:50%;width:11px;height:11px;margin-top:-7px;pointer-events:none;
  border-right:2.2px solid var(--texto-2,#6C6C6C);border-bottom:2.2px solid var(--texto-2,#6C6C6C);
  transform:rotate(45deg);transition:transform .15s ease}
.fl-combo input[aria-expanded="true"]~.fl-combo-flecha{transform:rotate(225deg);margin-top:-2px}
.fl-combo-lista{position:absolute;z-index:3;top:calc(100% + 4px);left:0;right:0;max-height:214px;overflow-y:auto;
  background:#fff;border:1.5px solid var(--borde,#DBDBDB);border-radius:10px;box-shadow:0 14px 30px rgba(22,23,26,.16);
  list-style:none;padding:5px;margin:0}
.fl-combo-lista[hidden]{display:none}
.fl-combo-lista li{padding:9px 11px;border-radius:7px;font-size:15px;font-weight:500;color:var(--texto,#3C3C3C);cursor:pointer;line-height:1.3}
.fl-combo-lista li:hover,.fl-combo-lista li.activo{background:#F1F2F4;color:var(--texto-fuerte,#2D2D2D)}
.fl-combo-lista li[aria-selected="true"]{font-weight:800;color:var(--texto-fuerte,#2D2D2D)}
.fl-combo-vacio{color:var(--texto-2,#6C6C6C);cursor:default}
.fl-combo-vacio:hover{background:none}
/* sin alto reservado: el error aparece solo cuando hay algo que decir */
.fl-error{font-size:12.5px;font-weight:700;color:var(--rojo,#DA291C);line-height:1.35}
.fl-error:empty{display:none}

.fl-si-no{display:flex;gap:10px}
.fl-si-no button{flex:1;min-height:46px;border:1.5px solid var(--borde,#DBDBDB);background:#fff;border-radius:10px;font-family:inherit;font-size:15px;font-weight:700;color:var(--texto-2,#6C6C6C);cursor:pointer;transition:all .15s}
/* el rojo queda reservado para los errores: la opción elegida va en negro */
.fl-si-no button[aria-pressed="true"]{border-color:var(--dark,#16171a);background:var(--dark,#16171a);color:#fff}

.fl-enviar{width:100%;min-height:52px;border:0;border-radius:50px;background:#25D366;color:#fff;font-family:inherit;font-size:17px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:6px}
.fl-enviar:hover{background:#1FBE5B}
.fl-enviar:disabled{opacity:.6;cursor:default}
.fl-enviar svg{width:21px;height:21px;fill:currentColor}
.fl-legal{font-size:11.5px;color:var(--texto-2,#6C6C6C);text-align:center;line-height:1.45;margin-top:10px}
.fl-legal a{text-decoration:underline}

.fl-ok{display:none;padding:30px 24px 26px;text-align:center}
.fl-ok.visible{display:block}
.fl-ok-ico{width:58px;height:58px;border-radius:50%;background:#E8F8EE;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.fl-ok-ico svg{width:28px;height:28px;stroke:#25D366;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.fl-ok h3{font-size:20px;font-weight:900;color:var(--texto-fuerte,#2D2D2D)}
.fl-ok p{font-size:14.5px;color:var(--texto-2,#6C6C6C);margin-top:8px;line-height:1.5;max-width:42ch;margin-left:auto;margin-right:auto}

/* escritorio: QR para seguir en el celular */
.fl-qr{display:none;margin-top:18px}
.fl-qr.visible{display:block}
.fl-qr-caja{width:186px;height:186px;margin:0 auto;padding:12px;background:#fff;border:1.5px solid var(--borde,#DBDBDB);border-radius:14px;display:flex;align-items:center;justify-content:center}
.fl-qr-caja svg,.fl-qr-caja canvas{width:100%;height:100%}
.fl-qr-pasos{font-size:13.5px;color:var(--texto-2,#6C6C6C);margin-top:12px;line-height:1.6}
.fl-qr-pasos b{color:var(--texto-fuerte,#2D2D2D)}
.fl-secundarios{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.fl-sec{min-height:44px;padding:0 18px;border-radius:50px;border:1.5px solid var(--borde,#DBDBDB);background:#fff;color:var(--texto-fuerte,#2D2D2D);font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.fl-sec:hover{border-color:var(--texto-2,#6C6C6C);color:var(--texto-fuerte,#2D2D2D)}
.fl-abrir-wa{display:none;width:100%;min-height:54px;margin-top:18px;border-radius:50px;background:#25D366;color:#fff;font-size:17px;font-weight:800;align-items:center;justify-content:center;gap:10px}
.fl-abrir-wa.visible{display:flex}
.fl-abrir-wa:hover{color:#fff;background:#1FBE5B}
.fl-abrir-wa svg{width:21px;height:21px;fill:currentColor}

@media(max-width:620px){
  .fl-fondo{padding:0;align-items:flex-end}
  /* dvh: con la barra del navegador de iOS/Android, 100vh se corta */
  .fl-caja{max-width:none;max-height:92vh;max-height:92dvh;border-radius:18px 18px 0 0}
  .fl-top{border-radius:18px 18px 0 0;padding:18px 18px 16px}
  .fl-top h2{font-size:19px}
  .fl-top p{font-size:13.5px}
  /* el último campo no queda tapado por la barra de gestos */
  .fl-cuerpo,.fl-ok{padding:14px 18px calc(16px + env(safe-area-inset-bottom))}
  /* en celular, provincia y localidad conviven en una fila: una es fija */
  .fl-fila--2{grid-template-columns:.85fr 1.15fr;gap:9px}
  .fl-fila--calle{grid-template-columns:1fr 92px;gap:9px}
  .fl-campo{margin-bottom:9px}
  .fl-enviar{position:sticky;bottom:0;box-shadow:0 -10px 18px rgba(255,255,255,.9)}
  /* en el celular la sesión de WhatsApp está en la app, no en la web */
  .fl-secundarios [data-fl="web"]{display:none}
}
@media(prefers-reduced-motion:reduce){.fl-fondo,.fl-caja{transition:none}}

/* 20-oct-2026: encabezado «logo | Consultá cobertura / por WhatsApp» (pedido de Tomás).
   .fl-top img es la foto de fondo (absoluta): el logo la pisa con más especificidad. */
.fl-encab{display:flex;align-items:center;gap:14px;padding-right:40px}
.fl-top img.fl-logo{position:static;inset:auto;display:block;flex:none;width:auto;height:30px;object-fit:contain;z-index:auto;margin:0}
.fl-sep{flex:none;width:1px;align-self:stretch;min-height:40px;background:rgba(255,255,255,.5)}
.fl-encab h2{max-width:none;line-height:1.15}
@media (max-width:600px){.fl-encab{gap:12px}.fl-top img.fl-logo{height:24px}.fl-sep{min-height:36px}}

/* 20-oct-2026 (Tomás): un poco de aire a los costados y la página detrás, oscurecida y
   desenfocada. Antes, en el celular, la caja iba de borde a borde desde abajo. */
.fl-fondo{background:rgba(10,11,13,.58);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
@media(max-width:620px){
  .fl-fondo{padding:10px 10px calc(10px + env(safe-area-inset-bottom))}
  .fl-caja{border-radius:18px;max-height:88vh;max-height:88dvh}
}
/* 20-oct-2026 (Tomás): título un 5 % más chico y etiquetas un poco más livianas. */
.fl-top .fl-encab h2{font-size:20px}
.fl-campo label{font-weight:700}
@media(max-width:620px){.fl-top .fl-encab h2{font-size:18px}}
/* 20-oct-2026: campos un 15 % más bajos (46 → 39 px) para un formulario más compacto */
.fl-campo input,.fl-campo select{padding-top:8px;padding-bottom:8px;min-height:39px}
.fl-si-no button{min-height:39px}
/* 22-oct-2026, respuesta al toque (INP 754 ms en Clarity): el blur solo con el formulario
   abierto; cerrado, el fondo queda oculto del todo y no se pinta. En el celular, blur más liviano. */
.fl-fondo{visibility:hidden;-webkit-backdrop-filter:none;backdrop-filter:none;transition:opacity .18s ease,visibility 0s linear .18s}
.fl-fondo.abierto{visibility:visible;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);transition:opacity .18s ease}
@media(max-width:620px){.fl-fondo.abierto{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}}
