/* Valora — hoja de estilos única, sin build. v3 (13-oct-2026): pasada de diseño ("confianza en
   3 segundos" para un propietario del Eixample de 50-70 años): paleta tinta-marino + acento
   cálido, tipografía con carácter (serif de sistema en titulares, sin depender de ningún CDN
   externo para no penalizar rendimiento ni tocar la CSP), más aire, jerarquía clara entre
   "ver la horquilla" (gratis, sin dar datos) y "que me llame una agente" (el objetivo real). */
:root{
  --azul:#15335c; --azul-osc:#0a1f3d; --acento:#b9733a; --acento-osc:#8f5826;
  --verde:#1a8f5c; --crema:#faf7f1; --gris-100:#f4f1ea; --gris-300:#ddd7c9;
  --gris-600:#5c564c; --texto:#20201c; --rojo:#b3261e; --radio:14px;
  --sombra:0 4px 18px rgba(30,25,10,.09); --sombra-grande:0 10px 34px rgba(20,16,8,.14);
  --max:760px; --max-ancho:1100px;
  --fuente-titulo:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,"Noto Serif",serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
/* v6 (13-oct-2026), accesibilidad "fácil para todas las edades": texto base >= 18px. Se fija
   en <html> (no en <body>) para que todos los tamaños en rem del resto de la hoja (que son
   relativos a la raíz) escalen con él, no solo el texto que hereda directamente de body. */
html{font-size:18px}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--texto); background:#fff; line-height:1.55; font-size:1rem;
}
img{max-width:100%}
a{color:var(--azul)}
h1,h2,h3{font-family:var(--fuente-titulo); font-weight:700; letter-spacing:-0.01em}
.contenedor{max-width:var(--max); margin:0 auto; padding:0 20px}
.contenedor--ancho{max-width:var(--max-ancho)}

/* Cabecera */
.cabecera{border-bottom:1px solid var(--gris-300); padding:16px 0; background:#fff}
.cabecera__fila{display:flex; align-items:center; justify-content:space-between; gap:10px; max-width:var(--max-ancho); margin:0 auto; padding:0 20px}
.marca{font-family:var(--fuente-titulo); font-weight:700; font-size:1.3rem; color:var(--azul-osc); text-decoration:none}
.idiomas{display:flex; gap:14px; font-size:.9rem}
@media (max-width:420px){
  .cabecera__fila{flex-wrap:wrap}
  .marca{font-size:1.05rem}
  .idiomas{gap:8px; font-size:.78rem}
}
.idiomas a{text-decoration:none; color:var(--gris-600)}
.idiomas a[aria-current="true"]{color:var(--azul-osc); font-weight:700; text-decoration:underline}

/* ---------------------------------------------------------------- Hero */
.hero{padding:40px 0 36px; background:linear-gradient(180deg,var(--crema) 0%,#fff 100%)}
.hero__grid{max-width:var(--max-ancho); margin:0 auto; padding:0 20px; display:grid; grid-template-columns:1.05fr 1fr; gap:40px; align-items:start}
@media (max-width:860px){ .hero__grid{grid-template-columns:1fr; gap:24px} }
.hero__kicker{margin:0 0 10px; font-size:.82rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--acento-osc)}
.hero__titulo{font-size:2.1rem; line-height:1.18; margin:0 0 14px; color:var(--azul-osc)}
@media (max-width:480px){ .hero__titulo{font-size:1.7rem} }
.hero__subtitulo{color:var(--gris-600); margin:0 0 20px; font-size:1.05rem; max-width:34ch}
.hero__confianza{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px}
.hero__confianza li{display:flex; align-items:flex-start; gap:10px; font-size:.95rem; color:var(--texto)}
.hero__check{display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:var(--verde); color:#fff; font-size:.72rem; flex:none; margin-top:1px}

.tarjeta{background:#fff; border:1px solid var(--gris-300); border-radius:var(--radio); padding:22px; box-shadow:var(--sombra); margin-bottom:16px}
.tarjeta--hero{box-shadow:var(--sombra-grande); border-color:#e4ddcb}
.tarjeta--hero h2{margin-top:0; font-size:1.15rem; color:var(--azul-osc)}

.campo{margin-bottom:14px}
.campo label{display:block; font-weight:600; margin-bottom:6px; font-size:1rem}
.campo input[type=text], .campo input[type=number], .campo input[type=tel], .campo input[type=email], .campo select{
  width:100%; min-height:48px; padding:12px 14px; border:1.5px solid var(--gris-300); border-radius:9px; font-size:1rem; background:#fff; font-family:inherit;
}
.campo-direccion{font-size:1.1rem!important; padding:15px 16px!important}
.campo input:focus, .campo select:focus{outline:2px solid var(--azul); outline-offset:1px}
.campo-ayuda{font-size:.88rem; color:var(--gris-600); margin-top:4px}
.fila-2{display:grid; grid-template-columns:1fr 1fr; gap:10px}
@media (max-width:480px){ .fila-2{grid-template-columns:1fr} }

/* v6: enlace secundario con área de toque de 48px aunque sea texto subrayado, no un botón. */
.enlace-secundario{display:inline-flex; align-items:center; min-height:48px; margin-top:4px; background:none; border:none; padding:4px 0; color:var(--gris-600); font-size:.95rem; text-decoration:underline; cursor:pointer; font-family:inherit}
.enlace-secundario:hover{color:var(--azul)}

.chips{display:flex; flex-wrap:wrap; gap:8px}
.chip{display:inline-flex; align-items:center; min-height:48px; border:1.5px solid var(--gris-300); border-radius:999px; padding:9px 16px; font-size:.98rem; cursor:pointer; background:#fff; user-select:none; font-family:inherit}
.chip[aria-pressed="true"]{border-color:var(--azul); background:#eaf0fb; font-weight:700; color:var(--azul-osc)}

.boton{display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:48px; padding:14px 18px; border-radius:10px; border:none; font-size:1.05rem; font-weight:700; cursor:pointer; text-decoration:none; font-family:inherit}
.boton--primario{background:var(--azul); color:#fff}
.boton--primario:hover{background:var(--azul-osc)}
.boton--grande{padding:17px 20px; font-size:1.12rem; background:var(--acento); box-shadow:0 6px 16px rgba(185,115,58,.33)}
.boton--grande:hover{background:var(--acento-osc)}
.boton--whatsapp{background:#1aa95b; color:#fff}
.boton--fantasma{background:#fff; color:var(--azul); border:1.5px solid var(--azul)}
.boton[disabled]{opacity:.55; cursor:not-allowed}

.autocompletar{position:relative}
.autocompletar__lista{position:absolute; left:0; right:0; top:100%; background:#fff; border:1px solid var(--gris-300); border-radius:8px; box-shadow:var(--sombra); z-index:20; max-height:260px; overflow:auto; margin-top:4px}
.autocompletar__item{padding:10px 12px; cursor:pointer; font-size:.95rem; border-bottom:1px solid var(--gris-100)}
.autocompletar__item:hover,.autocompletar__item[aria-selected="true"]{background:var(--gris-100)}
.autocompletar__vacio{padding:10px 12px; color:var(--gris-600); font-size:.9rem}

/* ---------------------------------------------------------- Tira de confianza */
.confianza-tira{background:var(--azul-osc); color:#fff; padding:18px 0}
.confianza-tira__fila{display:flex; flex-wrap:wrap; gap:22px 34px; align-items:center; justify-content:center; max-width:var(--max-ancho); margin:0 auto; padding:0 20px}
.confianza-item{display:flex; align-items:center; gap:10px; font-size:.88rem; color:#dfe6f0; text-align:left}
.confianza-item strong{font-family:var(--fuente-titulo); font-size:1.4rem; color:#fff; line-height:1}
.confianza-item--agente{gap:10px}
.confianza-agente__foto{width:40px; height:40px; border-radius:50%; object-fit:cover; flex:none}
.confianza-agente__texto{display:flex; flex-direction:column; gap:1px}
.confianza-agente__texto strong{font-family:inherit; font-size:.92rem; color:#fff}
.confianza-agente__texto span{font-size:.82rem; color:#c9d3e0}

/* ---------------------------------------------------------- Cómo funciona */
.pasos{padding:40px 0; background:var(--gris-100)}
.pasos h2{text-align:center; margin:0 0 28px; color:var(--azul-osc); font-size:1.5rem}
.pasos__grid{max-width:var(--max-ancho); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
@media (max-width:760px){ .pasos__grid{grid-template-columns:1fr} }
.paso-card{background:#fff; border:1px solid var(--gris-300); border-radius:var(--radio); padding:22px; text-align:left}
.paso-card__num{display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--azul); color:#fff; font-weight:700; font-family:var(--fuente-titulo); margin-bottom:12px}
.paso-card h3{margin:0 0 8px; font-size:1.05rem; color:var(--azul-osc)}
.paso-card p{margin:0; color:var(--gris-600); font-size:.92rem}

.seccion-formulario{padding-top:36px}

/* ---------------------------------------------------------- Resultado */
.resultado{text-align:center; padding:12px 0 4px}
.resultado__distrito{display:inline-block; background:var(--gris-100); color:var(--azul-osc); font-weight:700; font-size:.82rem; padding:5px 12px; border-radius:999px; margin-bottom:10px}
.resultado__rango{font-size:clamp(1.5rem,7.5vw,2.2rem); overflow-wrap:anywhere; font-weight:700; font-family:var(--fuente-titulo); color:var(--azul-osc); margin:4px 0}
.resultado__eurm2{color:var(--gris-600); font-size:.95rem}
.aviso-zona{background:#fdf3e7; border:1px solid var(--acento); border-radius:8px; padding:10px 12px; font-size:.88rem; margin:12px 0; color:#6e4823; text-align:left}
.aviso-legal{font-size:.8rem; color:var(--gris-600); margin-top:10px}
.factores{list-style:none; padding:0; margin:10px 0; display:flex; flex-direction:column; gap:6px}
.factor{display:flex; justify-content:space-between; font-size:.92rem; padding:6px 10px; border-radius:6px; background:var(--gris-100)}
.factor--sube{color:#136c37}
.factor--baja{color:#8a2d20}
.fuentes{font-size:.82rem; color:var(--gris-600); padding-left:18px; margin:6px 0}

.honeypot{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

.consentimiento{display:flex; gap:10px; align-items:flex-start; font-size:.9rem; margin:10px 0}
.consentimiento input{margin-top:3px}

.cta-agente{background:linear-gradient(180deg,#fff 0%,var(--crema) 100%); border:1.5px solid var(--acento); border-radius:var(--radio); padding:22px; margin:18px 0; text-align:center}
.cta-agente__titulo{font-family:var(--fuente-titulo); font-size:1.2rem; color:var(--azul-osc); margin:0 0 6px}
.cta-agente p{margin:0 0 10px}

.enlaces-contacto-flotantes{margin-top:18px; text-align:center}

/* ---------------------------------------------------------------- FAQ */
.faq{margin-top:22px}
.faq h2{margin-top:0; color:var(--azul-osc); font-size:1.3rem}
.faq-item{border-bottom:1px solid var(--gris-300); padding:12px 0}
.faq-item:last-child{border-bottom:none}
.faq-item summary{cursor:pointer; font-weight:700; font-size:.98rem; color:var(--texto)}
.faq-item summary::marker{color:var(--acento)}
.faq-item p{margin:10px 0 0; color:var(--gris-600); font-size:.92rem}

.pie{border-top:1px solid var(--gris-300); margin-top:30px; padding:28px 0; font-size:.85rem; color:var(--gris-600); background:var(--gris-100)}
.pie a{color:var(--gris-600); margin-right:14px}
.pie__atribucion{margin-top:10px; font-size:.78rem}

.mensaje-error{color:var(--rojo); font-size:.88rem; margin-top:6px}
[hidden]{display:none!important}

.lista-municipios{display:grid; grid-template-columns:1fr 1fr; gap:4px 20px; padding:0; margin:12px 0; list-style:none}
@media (max-width:480px){ .lista-municipios{grid-template-columns:1fr} }
.lista-municipios a{display:block; padding:6px 0; text-decoration:none}

table.tabla-precios{width:100%; border-collapse:collapse; font-size:.92rem; margin:14px 0}
table.tabla-precios th, table.tabla-precios td{text-align:left; padding:8px 10px; border-bottom:1px solid var(--gris-300)}

.breadcrumb{font-size:.82rem; color:var(--gris-600); margin-bottom:10px}
.breadcrumb a{color:var(--gris-600)}

/* --- Panel (mini-CRM) --- */
.panel-login{max-width:360px; margin:60px auto; padding:0 18px}
.panel-contenedor{max-width:1150px; margin:0 auto; padding:20px 16px 48px}
.panel-cabecera{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:16px}
.panel-filtros{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px}
.panel-filtros select{padding:8px 10px; border:1px solid var(--gris-300); border-radius:6px}
.subtitular{color:var(--gris-600); font-size:1rem; margin:0 0 24px}
.error-mensaje{color:var(--rojo); font-size:.88rem; margin:8px 0}
.tabla-scroll{overflow-x:auto; border:1px solid var(--gris-300); border-radius:var(--radio)}
table.leads{border-collapse:collapse; width:100%; min-width:1000px}
table.leads th, table.leads td{padding:8px 10px; border-bottom:1px solid var(--gris-300); text-align:left; font-size:.85rem}
table.leads th{background:var(--gris-100); position:sticky; top:0}
table.leads tr.nuevo-urgente{background:#fdeceb}
table.leads select, table.leads input[type="date"]{padding:5px; font-size:.82rem; border:1px solid var(--gris-300); border-radius:4px}
table.leads textarea{width:100%; min-height:40px; font-size:.82rem; border:1px solid var(--gris-300); border-radius:4px; padding:4px}
.boton-mini{font-size:.78rem; padding:6px 8px; background:var(--azul); color:#fff; border:none; border-radius:4px; cursor:pointer; text-decoration:none; display:inline-block}
.boton-mini.secundario{background:#666}
.boton-mini + .boton-mini{margin-top:4px}
.consentimiento-info{font-size:.75rem; color:var(--gris-600); white-space:nowrap}
table.leads tr.lead-rapido{background:#f3f0ff}

/* ---------------------------------------------------------- v6: progreso de pasos */
.progreso{display:flex; align-items:center; gap:8px; margin-bottom:14px; font-size:.9rem; color:var(--gris-600); font-weight:600}
.progreso__paso{display:flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:var(--gris-300); color:var(--texto); font-size:.82rem; flex:none}
.progreso__paso[aria-current="true"]{background:var(--azul); color:#fff}
.progreso__texto{white-space:nowrap}

/* ---------------------------------------------------------- v6: "Prefiero que me llamen" y
   captura rápida de teléfono cuando la dirección está fuera de zona. Un único patrón visual
   para los dos: nombre + teléfono + un consentimiento, nada más. */
.cta-llamame{display:inline-flex; align-items:center; justify-content:center; min-height:48px; margin-top:12px; width:100%; padding:13px 18px; border-radius:10px; border:2px solid var(--azul); background:#fff; color:var(--azul-osc); font-size:1rem; font-weight:700; cursor:pointer; font-family:inherit}
.cta-llamame:hover{background:var(--gris-100)}
.captura-rapida{margin-top:14px; padding-top:14px; border-top:1px dashed var(--gris-300)}
.captura-rapida[hidden]{display:none}
.captura-rapida__ok{color:var(--verde); font-weight:700; font-size:1rem}
.fuera-zona{background:#fdf3e7; border:1.5px solid var(--acento); border-radius:var(--radio); padding:18px; margin-top:14px}
.fuera-zona p{margin:0 0 10px; color:#6e4823}