/* encontramostucasa.es — hoja de estilo del portal */

:root{
  --tinta:#22282e;
  --tinta-suave:#5b6870;
  --tinta-tenue:#8b979d;
  --linea:#e3e8e9;
  --linea-fuerte:#c9d2d4;
  --papel:#ffffff;
  --papel-2:#f5f7f7;
  --marca:#106678;          /* teal del tejado (media del degradado #19798B-#075568) */
  --marca-clara:#e2eef1;
  --oscuro:#2a3238;         /* el gris de las letras ETC */
  --acento:#a87c1b;         /* dorado del logo, oscurecido para que se lea */
  --dorado:#e0b23c;         /* el dorado del logotipo, solo decorativo */
  --serif:"Playfair Display", Georgia, "Times New Roman", serif;
  --sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --radio:10px;
  --sombra:0 1px 2px rgba(22,26,29,.06), 0 8px 24px rgba(22,26,29,.05);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--papel); color:var(--tinta);
  font-family:var(--sans); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit}
:focus-visible{outline:2px solid var(--marca); outline-offset:2px}

.contenedor{max-width:1320px; margin:0 auto; padding:0 24px}

/* ---------- cabecera ---------- */
.cabecera{
  position:sticky; top:0; z-index:50; background:var(--papel);
  border-bottom:1px solid var(--linea);
}
.cabecera-int{position:relative}
.cabecera-int{display:flex; align-items:center; gap:32px; height:76px}
.logo{display:flex; align-items:center; gap:10px; flex-shrink:0}
.logo-marca{height:50px; width:auto; display:block; flex-shrink:0}
.logo-texto{display:flex; flex-direction:column; line-height:1.05}
.logo-texto b{font-size:17px; letter-spacing:-.015em; font-weight:700}
.logo-texto span{font-size:10.5px; color:var(--tinta-tenue); letter-spacing:.16em; text-transform:uppercase}
.nav{display:flex; gap:28px; margin-left:auto; align-items:center}
.nav a{font-size:15px; color:var(--tinta-suave); transition:color .15s}
.nav a:hover, .nav a[aria-current]{color:var(--marca)}
.nav-destacado{
  border:1px solid var(--marca); color:var(--marca) !important; border-radius:999px;
  padding:8px 16px; font-weight:500;
}
.nav-destacado:hover{background:var(--marca); color:#fff !important}


/* ---------- menu de movil ---------- */
.hamburguesa{
  display:none; margin-left:auto; width:44px; height:44px; border:1px solid var(--linea);
  border-radius:9px; background:var(--papel); cursor:pointer; padding:0;
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.hamburguesa span{
  display:block; width:20px; height:2px; background:var(--tinta); border-radius:2px;
  transition:transform .2s, opacity .2s;
}
body.menu-abierto .hamburguesa span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.menu-abierto .hamburguesa span:nth-child(2){opacity:0}
body.menu-abierto .hamburguesa span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:860px){
  .cabecera-int{height:66px; padding:0; flex-wrap:nowrap; gap:14px}
  .hamburguesa{display:flex}
  .logo-marca{height:42px}
  .logo-texto b{font-size:15px}

  .nav{
    display:none; position:absolute; left:0; right:0; top:100%;
    background:var(--papel); border-bottom:1px solid var(--linea);
    box-shadow:0 14px 30px rgba(22,26,29,.12);
    flex-direction:column; align-items:stretch; gap:0; padding:8px 20px 18px;
    margin-left:0; width:auto;
  }
  body.menu-abierto .nav{display:flex}
  .nav a{
    padding:14px 4px; font-size:16px; border-bottom:1px solid var(--linea);
  }
  .nav a:last-child{border-bottom:0}
  .nav-destacado{
    text-align:center; margin-top:12px; padding:14px 16px !important;
    border-radius:9px;
  }
}

/* ---------- portada ---------- */
.hero{
  position:relative; min-height:520px; display:grid; place-items:center;
  background:
    linear-gradient(180deg, rgba(7,45,55,.76), rgba(7,45,55,.56) 45%, rgba(7,45,55,.82)),
    image-set(url("/img/ontinyent.webp") type("image/webp"), url("/img/ontinyent.jpg") type("image/jpeg"))
    center/cover no-repeat,
    var(--marca);
  text-align:center; padding:80px 24px;
}
.hero h1{
  font-family:var(--serif); color:#fff; font-weight:600;
  font-size:clamp(2rem,4.6vw,3.5rem); line-height:1.12; margin:0 0 14px;
  text-wrap:balance; text-shadow:0 2px 20px rgba(0,0,0,.25);
}
.hero h1 em{font-style:italic}
.hero-sub{color:rgba(255,255,255,.92); margin:0 0 32px; font-size:1.05rem}

/* ---------- buscador ---------- */
.buscador{
  position:relative; z-index:20;
  background:rgba(255,255,255,.94); backdrop-filter:blur(6px);
  border-radius:var(--radio); padding:14px; display:flex; flex-wrap:wrap; gap:10px;
  box-shadow:var(--sombra); max-width:1080px; margin:0 auto; width:100%;
}
.buscador--pagina{
  background:var(--papel-2); box-shadow:none; border:1px solid var(--linea);
  margin-bottom:24px;
}
.campo{position:relative; flex:1 1 165px; min-width:0}
.campo select, .campo input{
  width:100%; height:48px; padding:0 14px; border:1px solid var(--linea-fuerte);
  border-radius:8px; background:var(--papel); color:var(--tinta); font-size:15px;
  appearance:none;
}
.campo select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235b6870' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:34px;
}
.campo input::placeholder{color:var(--tinta-tenue)}
.btn-buscar{
  height:48px; padding:0 26px; border:0; border-radius:8px; background:var(--oscuro);
  color:#fff; font-size:15px; font-weight:500; cursor:pointer; display:flex;
  align-items:center; gap:8px; transition:background .15s;
}
.btn-buscar:hover{background:#1b2026}



/* ---------- desplegables de filtro ---------- */
.desplegable{position:relative; flex:1 1 170px; min-width:0}
.desplegable > summary{
  list-style:none; cursor:pointer; height:48px; padding:0 34px 0 14px;
  border:1px solid var(--linea-fuerte); border-radius:8px; background:var(--papel);
  display:flex; align-items:center; font-size:15px; color:var(--tinta);
  white-space:nowrap; overflow:hidden;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235b6870' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
}
.desplegable > summary::-webkit-details-marker{display:none}
.desplegable[open] > summary{border-color:var(--marca); box-shadow:0 0 0 3px var(--marca-clara)}
.dp-texto{overflow:hidden; text-overflow:ellipsis}
/* En movil los filtros van a dos columnas y no cabe el rotulo entero:
   cada uno lleva una version corta que se enciende en ese mismo punto. */
.dp-corto{display:none}

.dp-panel{
  position:absolute; z-index:60; top:calc(100% + 6px); left:0; min-width:270px;
  max-width:340px; max-height:min(58vh, 420px); overflow-y:auto;
  background:var(--papel); border:1px solid var(--linea-fuerte); border-radius:10px;
  box-shadow:0 12px 34px rgba(22,26,29,.14); padding:12px;
}
.desplegable .dp-grupo{
  margin:12px 0 6px; font-size:10.5px; letter-spacing:.11em; text-transform:uppercase;
  color:var(--tinta-tenue); font-weight:500;
}
.desplegable .dp-grupo:first-child{margin-top:2px}
.dp-opcion{
  display:flex; align-items:center; gap:10px; padding:7px 8px; border-radius:6px;
  font-size:14.5px; cursor:pointer;
}
.dp-opcion:hover{background:var(--papel-2)}
.dp-opcion input{width:16px; height:16px; accent-color:var(--marca); flex-shrink:0; margin:0}
.dp-opcion span{flex:1; min-width:0}
.dp-opcion b{
  font-weight:400; font-size:12.5px; color:var(--tinta-tenue);
  font-variant-numeric:tabular-nums;
}
.dp-opcion--suelta{margin-top:14px; border-top:1px solid var(--linea); padding-top:12px; border-radius:0}

.desplegable .dp-nota{
  margin:0 0 8px; font-size:12px; line-height:1.45; color:var(--tinta-tenue);
  background:var(--papel-2); padding:8px 10px; border-radius:6px;
}
.dp-botones{display:flex; flex-wrap:wrap; gap:6px}
.dp-boton{cursor:pointer}
.dp-boton input{position:absolute; opacity:0; pointer-events:none}
.dp-boton span{
  display:inline-block; padding:7px 13px; border:1px solid var(--linea-fuerte);
  border-radius:7px; font-size:13.5px; transition:all .12s;
}
.dp-boton:hover span{border-color:var(--marca)}
.dp-boton input:checked + span{background:var(--marca); border-color:var(--marca); color:#fff}
.dp-boton input:focus-visible + span{outline:2px solid var(--marca); outline-offset:2px}

.dp-precio{display:flex; gap:10px}
.dp-precio label{
  flex:1; display:flex; flex-direction:column; gap:5px; font-size:12px;
  color:var(--tinta-suave);
}
.dp-precio input{
  height:42px; padding:0 11px; border:1px solid var(--linea-fuerte); border-radius:7px;
  font-size:14.5px; width:100%; font-variant-numeric:tabular-nums;
}
.dp-rangos{display:flex; flex-direction:column; gap:4px}
.dp-rango{
  text-align:left; background:none; border:0; padding:7px 8px; border-radius:6px;
  font-size:14px; color:var(--tinta); cursor:pointer;
}
.dp-rango:hover{background:var(--papel-2); color:var(--marca)}

.dp-pie{
  position:sticky; bottom:-12px; margin:12px -12px -12px; padding:10px 12px;
  background:var(--papel); border-top:1px solid var(--linea);
}
.dp-aplicar{
  width:100%; height:40px; border:0; border-radius:7px; background:var(--oscuro);
  color:#fff; font-size:14px; font-weight:500; cursor:pointer;
}
.dp-aplicar:hover{background:#1b2026}

.campo--ref{flex:1 1 170px}
.filtros-activos{
  margin:10px 0 0; font-size:13.5px; color:var(--tinta-suave);
}
.filtros-activos a{color:var(--marca); text-decoration:underline; text-underline-offset:3px}
.bloque-buscador:not(.bloque-buscador--pagina) .filtros-activos{color:rgba(255,255,255,.85); text-align:center}
.bloque-buscador:not(.bloque-buscador--pagina) .filtros-activos a{color:#fff}

/* ---------- pastillas de operacion ---------- */
.bloque-buscador{max-width:1080px; margin:0 auto; width:100%}
.bloque-buscador--pagina{max-width:none; margin-bottom:24px}
.pastillas{display:flex; gap:8px; margin-bottom:12px; justify-content:center}
.bloque-buscador--pagina .pastillas{justify-content:flex-start}
.pastilla{
  padding:8px 20px; border-radius:999px; font-size:14px; font-weight:500;
  background:rgba(255,255,255,.9); color:var(--tinta-suave);
  border:1px solid transparent; transition:all .15s;
}
.bloque-buscador--pagina .pastilla{background:var(--papel); border-color:var(--linea)}
.pastilla:hover{color:var(--marca)}
.pastilla--activa{background:var(--oscuro); color:#fff}
.bloque-buscador--pagina .pastilla--activa{background:var(--oscuro); border-color:var(--oscuro); color:#fff}

/* ---------- secciones ---------- */
.seccion{padding:72px 0}
.seccion--gris{background:var(--papel-2)}
.seccion h2{
  font-family:var(--serif); font-weight:600; font-size:clamp(1.5rem,3vw,2.1rem);
  margin:0 0 6px; letter-spacing:-.01em; color:var(--marca); text-wrap:balance;
}
.seccion h2 em{font-style:italic}
.seccion h2::after{
  content:""; display:block; width:46px; height:3px; border-radius:2px;
  background:var(--dorado); margin-top:14px;
}
.seccion-intro{color:var(--tinta-suave); margin:0 0 32px; max-width:62ch}

/* ---------- rejilla de fichas ---------- */
.rejilla{
  display:grid; gap:26px;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
}
.ficha{
  background:var(--papel); border:1px solid var(--linea); border-radius:var(--radio);
  overflow:hidden; display:flex; flex-direction:column;
  transition:box-shadow .18s, transform .18s;
}
.ficha:hover{box-shadow:var(--sombra); transform:translateY(-2px)}
.ficha-foto{position:relative; aspect-ratio:4/3; background:var(--papel-2); overflow:hidden}
.ficha-foto img{width:100%; height:100%; object-fit:cover}
.ficha-foto .sinfoto{
  width:100%; height:100%; display:grid; place-items:center;
  color:var(--tinta-tenue); font-size:13px; background:var(--papel-2);
}
.etiqueta-op{
  position:absolute; top:12px; left:12px; background:rgba(24,24,24,.86); color:#fff;
  font-size:11px; letter-spacing:.09em; text-transform:uppercase;
  padding:5px 11px; border-radius:5px;
}
.etiqueta-agencia{
  position:absolute; bottom:12px; left:12px; background:rgba(255,255,255,.93);
  color:var(--tinta); font-size:11.5px; padding:5px 11px; border-radius:5px;
  font-weight:500;
}
.ficha-cuerpo{padding:18px 18px 20px; display:flex; flex-direction:column; gap:9px; flex:1}
.ficha-tipo{
  font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--tinta-tenue);
}
.ficha h3{
  font-family:var(--serif); font-size:1.12rem; font-weight:600; margin:0;
  line-height:1.3; letter-spacing:-.005em;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.ficha-lugar{color:var(--tinta-suave); font-size:14px; margin:0}
.ficha-datos{
  display:flex; gap:16px; font-size:13.5px; color:var(--tinta-suave);
  border-top:1px solid var(--linea); padding-top:12px; margin-top:auto;
  font-variant-numeric:tabular-nums;
}
.ficha-pie{display:flex; align-items:baseline; justify-content:space-between; gap:12px}
.precio{
  font-family:var(--serif); font-size:1.35rem; font-weight:600; color:var(--acento);
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.precio--consultar{font-size:1rem; color:var(--tinta-suave); font-family:var(--sans)}
.ref{font-size:12px; color:var(--tinta-tenue); font-variant-numeric:tabular-nums}
.ficha-enlace{
  display:block; text-align:center; padding:12px; background:var(--papel-2);
  border-top:1px solid var(--linea); font-size:14px; font-weight:500; color:var(--marca);
  transition:background .15s;
}
.ficha-enlace:hover{background:var(--marca-clara)}


.ficha-cabecilla{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.ficha-estado{
  font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; font-weight:500;
  padding:3px 9px; border-radius:4px; background:var(--papel-2); color:var(--tinta-suave);
}
.ficha-estado--obra_nueva{background:var(--marca-clara); color:var(--marca)}
.ficha-estado--reformado{background:var(--marca-clara); color:var(--marca)}
.ficha-estado--a_reformar{background:#fbf0e2; color:#8a5a12}
.dato-m2{color:var(--tinta-tenue)}

/* ---------- barra de resultados ---------- */
.barra-resultados{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom:26px;
}
.barra-resultados p{margin:0; color:var(--tinta-suave)}
.barra-resultados b{color:var(--tinta); font-size:1.15rem; font-family:var(--serif)}
.orden{display:flex; align-items:center; gap:10px; font-size:14px; color:var(--tinta-suave)}
.orden select{
  height:40px; border:1px solid var(--linea-fuerte); border-radius:8px;
  padding:0 12px; background:var(--papel); font-size:14px;
}

/* ---------- vacío ---------- */
.vacio{
  text-align:center; padding:80px 20px; border:1px dashed var(--linea-fuerte);
  border-radius:var(--radio); color:var(--tinta-suave);
}
.vacio h3{font-family:var(--serif); color:var(--tinta); margin:0 0 8px; font-size:1.3rem}

/* ---------- paginación ---------- */
.paginacion{margin-top:44px; display:flex; justify-content:center}
.paginacion nav{display:flex; gap:6px; flex-wrap:wrap; justify-content:center}
.paginacion a, .paginacion span{
  min-width:40px; height:40px; padding:0 12px; display:grid; place-items:center;
  border:1px solid var(--linea); border-radius:8px; font-size:14px; color:var(--tinta-suave);
}
.paginacion a:hover{border-color:var(--marca); color:var(--marca)}
.paginacion [aria-current]{background:var(--marca); border-color:var(--marca); color:#fff}

/* ---------- cifras ---------- */
.cifras{display:flex; flex-wrap:wrap; gap:44px; margin-top:8px}
.cifra b{
  display:block; font-family:var(--serif); font-size:2.2rem; color:var(--marca);
  line-height:1.1; font-variant-numeric:tabular-nums;
}
.cifra span{font-size:14px; color:var(--tinta-suave)}


/* ---------- formularios y ficha propia ---------- */
.cont-estrecho{max-width:900px}
.trampa{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

.formulario{display:flex; flex-direction:column; gap:26px; margin-top:8px}
.formulario fieldset{
  border:1px solid var(--linea); border-radius:var(--radio); padding:22px 24px 26px;
  margin:0; display:flex; flex-direction:column; gap:18px; background:var(--papel);
}
.formulario legend{
  font-family:var(--serif); font-size:1.12rem; font-weight:600; padding:0 10px;
  color:var(--marca);
}
.fila{display:flex; gap:16px; flex-wrap:wrap}
.fila > *{flex:1 1 190px; min-width:0}
.campo-form{display:flex; flex-direction:column; gap:6px}
.campo-form > span{font-size:13.5px; font-weight:500; color:var(--tinta)}
.campo-form input[type=text], .campo-form input[type=email], .campo-form input[type=tel],
.campo-form input[type=number], .campo-form select, .campo-form textarea{
  border:1px solid var(--linea-fuerte); border-radius:8px; padding:11px 13px;
  font-size:15px; font-family:inherit; color:var(--tinta); background:var(--papel);
  width:100%;
}
.campo-form textarea{resize:vertical; line-height:1.55}
.campo-form input:focus, .campo-form select:focus, .campo-form textarea:focus{
  outline:none; border-color:var(--marca); box-shadow:0 0 0 3px var(--marca-clara);
}
.campo-form small{font-size:12.5px; color:var(--tinta-suave); line-height:1.5}
.campo-form input[type=file]{
  border:1px dashed var(--linea-fuerte); border-radius:8px; padding:14px;
  background:var(--papel-2); font-size:14px; width:100%;
}
.nota-campo{
  margin:0; font-size:13.5px; color:var(--tinta-suave); background:var(--papel-2);
  padding:11px 14px; border-radius:8px;
}

.casillas{display:flex; flex-wrap:wrap; gap:8px}
.casilla{
  display:flex; align-items:flex-start; gap:9px; cursor:pointer; font-size:14px;
  border:1px solid var(--linea); border-radius:8px; padding:9px 13px; background:var(--papel);
}
.casilla:hover{border-color:var(--marca)}
.casilla input{accent-color:var(--marca); width:16px; height:16px; margin:2px 0 0}
.casilla--legal{
  border:0; padding:0; background:none; align-items:flex-start; line-height:1.5;
  color:var(--tinta-suave); font-size:13.5px;
}
.casilla--legal:hover{border:0}

.btn-enviar{
  align-self:flex-start; border:0; border-radius:8px; background:var(--oscuro);
  color:#fff; font-size:15px; font-weight:500; padding:14px 30px; cursor:pointer;
}
.btn-enviar:hover{background:#1b2026}

.aviso{
  border-radius:var(--radio); padding:16px 20px; margin:0 0 24px; font-size:14.5px;
  line-height:1.55;
}
.aviso b{display:block; margin-bottom:4px}
.aviso p{margin:0}
.aviso ul{margin:6px 0 0; padding-left:18px}
.aviso--ok{background:var(--marca-clara); color:#0f4a54; border-left:3px solid var(--marca)}
.aviso--error{background:#fdecea; color:#8a2b1c; border-left:3px solid #c0392b}

/* ---------- ficha de particular ---------- */
.miga{font-size:13px; color:var(--tinta-tenue); margin-bottom:18px}
.miga a{color:var(--tinta-suave)}
.miga a:hover{color:var(--marca)}
.ficha-detalle{
  display:grid; gap:34px;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);
  align-items:start;
}
.ficha-galeria{grid-column:1; display:flex; flex-direction:column; gap:10px}
.ficha-galeria img{
  width:100%; border-radius:var(--radio); border:1px solid var(--linea);
  aspect-ratio:4/3; object-fit:cover;
}
.ficha-info{grid-column:1; display:flex; flex-direction:column; gap:14px}
.ficha-info h1{
  font-family:var(--serif); font-size:clamp(1.5rem,3.2vw,2.1rem); font-weight:600;
  margin:0; line-height:1.2; letter-spacing:-.015em;
}
.etiqueta-op--suelta{position:static; align-self:flex-start}
.precio--grande{font-size:2rem; margin:0}
.precio--grande .mes{font-family:var(--sans); font-size:.95rem; color:var(--tinta-suave)}
.ficha-cifras{
  display:flex; flex-wrap:wrap; gap:26px; list-style:none; padding:16px 0; margin:0;
  border-top:1px solid var(--linea); border-bottom:1px solid var(--linea);
  font-size:14px; color:var(--tinta-suave);
}
.ficha-cifras b{
  display:block; font-family:var(--serif); font-size:1.35rem; color:var(--tinta);
  font-variant-numeric:tabular-nums;
}
.ficha-texto p{margin:0 0 14px; max-width:70ch}
.ficha-h3{font-family:var(--serif); font-size:1.1rem; margin:8px 0 0}
.ficha-equipo{
  display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0;
}
.ficha-equipo li{
  font-size:13.5px; background:var(--papel-2); border-radius:999px; padding:7px 14px;
  color:var(--tinta-suave);
}
.ficha-ref{font-size:12.5px; color:var(--tinta-tenue); margin:10px 0 0}

.ficha-contacto{
  grid-column:2; grid-row:1 / span 2; position:sticky; top:100px;
  border:1px solid var(--linea); border-radius:var(--radio); padding:22px;
  background:var(--papel-2); display:flex; flex-direction:column; gap:14px;
}
.ficha-contacto h3{font-family:var(--serif); font-size:1.2rem; margin:0}
.ficha-contacto > p{margin:0; font-size:14px; color:var(--tinta-suave)}
.ficha-contacto form{display:flex; flex-direction:column; gap:13px}

@media (max-width:900px){
  .ficha-detalle{grid-template-columns:1fr}
  .ficha-galeria, .ficha-info, .ficha-contacto{grid-column:1}
  .ficha-contacto{grid-row:auto; position:static}
}


/* ---------- paginas de aterrizaje y datos de mercado ---------- */
.cont-medio{max-width:1040px}
.landing-h1{
  font-family:var(--serif); font-size:clamp(1.7rem,3.6vw,2.5rem); font-weight:600;
  margin:0 0 14px; line-height:1.15; letter-spacing:-.02em; color:var(--marca);
  text-wrap:balance;
}
.landing-h2{
  font-family:var(--serif); font-size:1.35rem; font-weight:600; margin:38px 0 12px;
  letter-spacing:-.01em;
}
.landing-entrada{font-size:1.06rem; color:var(--tinta-suave); max-width:74ch; margin:0 0 22px}
.landing-entrada strong{color:var(--tinta); font-weight:600}
.landing-nota{font-size:13.5px; color:var(--tinta-tenue); margin:-6px 0 14px}
.landing-cifras{
  display:flex; flex-wrap:wrap; gap:34px; padding:20px 24px; margin:0 0 10px;
  background:var(--papel-2); border-radius:var(--radio);
}
.landing-zonas{margin-top:26px}
.landing-relacionadas{margin-top:46px; padding-top:34px; border-top:1px solid var(--linea)}
.landing-texto{
  margin-top:44px; padding-top:34px; border-top:1px solid var(--linea);
  color:var(--tinta-suave);
}
.landing-texto p{margin:0 0 15px; max-width:74ch}

.tabla-envoltura{overflow-x:auto; border:1px solid var(--linea); border-radius:var(--radio)}
.tabla-datos{width:100%; border-collapse:collapse; font-size:14.5px; min-width:520px}
.tabla-datos thead th{
  text-align:left; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--tinta-tenue); font-weight:500; padding:12px 14px;
  background:var(--papel-2); border-bottom:1px solid var(--linea-fuerte);
}
.tabla-datos td{padding:12px 14px; border-bottom:1px solid var(--linea)}
.tabla-datos tbody tr:last-child td{border-bottom:none}
.tabla-datos .num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.tabla-datos thead .num{text-align:right}
.tabla-datos b{color:var(--acento); font-weight:600}
.tabla-datos a{color:var(--marca); text-decoration:underline; text-underline-offset:3px}


/* ---------- paginas legales ---------- */
.texto-legal{color:var(--tinta-suave)}
.texto-legal h1{
  font-family:var(--serif); font-size:clamp(1.7rem,3.4vw,2.3rem); font-weight:600;
  color:var(--marca); margin:0 0 6px; letter-spacing:-.018em;
}
.texto-legal h2{
  font-family:var(--serif); font-size:1.25rem; font-weight:600; color:var(--tinta);
  margin:34px 0 10px; letter-spacing:-.01em;
}
.texto-legal h3{
  font-size:1rem; font-weight:600; color:var(--tinta); margin:22px 0 8px;
}
.texto-legal p{margin:0 0 14px; max-width:74ch; line-height:1.65}
.texto-legal ul{margin:0 0 16px; padding-left:1.2rem; max-width:74ch; display:flex;
  flex-direction:column; gap:8px; line-height:1.6}
.texto-legal strong{color:var(--tinta); font-weight:600}
.texto-legal a{color:var(--marca); text-decoration:underline; text-underline-offset:3px}
.texto-legal code{
  font-family:ui-monospace,Consolas,monospace; font-size:.86em;
  background:var(--papel-2); padding:2px 6px; border-radius:4px; color:var(--tinta);
}
.legal-fecha{font-size:13px; color:var(--tinta-tenue); margin:0 0 26px !important}
.legal-entrada{
  font-size:1.02rem; background:var(--papel-2); border-radius:var(--radio);
  padding:18px 22px; margin-bottom:26px !important;
}
.legal-base{
  font-size:13.5px; background:var(--marca-clara); border-radius:8px;
  padding:10px 14px; margin-bottom:18px !important;
}
.legal-base b{color:var(--marca)}
.lista-datos{list-style:none; padding:0 !important; margin-bottom:20px !important}
.lista-datos li{
  display:flex; gap:10px; flex-wrap:wrap; padding:9px 0;
  border-bottom:1px solid var(--linea);
}
.lista-datos b{
  min-width:170px; color:var(--tinta-tenue); font-weight:500; font-size:12px;
  letter-spacing:.08em; text-transform:uppercase; padding-top:2px;
}
.legal-pie{
  margin-top:40px !important; padding-top:22px; border-top:1px solid var(--linea);
  font-size:14px;
}
.pie-enlaces-legales{display:flex; gap:18px; flex-wrap:wrap}
.pie-enlaces-legales a{text-decoration:underline; text-underline-offset:3px}


/* ---------- favoritos y acceso ---------- */
.ficha{position:relative}
/* ---------- botones de accion sobre la foto ---------- */
.acciones-ficha{
  position:absolute; top:10px; right:10px; z-index:3;
  display:flex; flex-direction:column; gap:8px;
}
.redondo{
  width:38px; height:38px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(255,255,255,.92); color:var(--tinta-tenue);
  display:grid; place-items:center; padding:0;
  box-shadow:0 1px 4px rgba(22,26,29,.18);
  transition:transform .15s, color .15s, background .15s;
}
.redondo svg{fill:none; stroke:currentColor; stroke-width:2; stroke-linejoin:round; stroke-linecap:round}
.redondo:hover{transform:scale(1.08); background:#fff}
.redondo:disabled{opacity:.5; cursor:wait}
.corazon:hover{color:#c2413a}
.corazon--activo{color:#c2413a}
.corazon--activo svg{fill:currentColor}
.campana:hover{color:var(--acento)}
.campana--activa{color:var(--acento)}
.campana--activa svg path:first-child{fill:currentColor}
@media (prefers-reduced-motion:reduce){.redondo{transition:none}}

.aviso-fugaz{
  position:fixed; left:50%; bottom:26px; transform:translateX(-50%);
  background:var(--oscuro); color:#fff; padding:13px 22px; border-radius:9px;
  font-size:14.5px; z-index:300; box-shadow:0 8px 26px rgba(22,26,29,.28);
  animation:fugaz-entra .22s ease both; max-width:calc(100vw - 32px); text-align:center;
}
.aviso-fugaz--sale{animation:fugaz-sale .5s ease both}
@keyframes fugaz-entra{from{opacity:0; transform:translate(-50%,12px)}to{opacity:1; transform:translate(-50%,0)}}
@keyframes fugaz-sale{to{opacity:0; transform:translate(-50%,12px)}}
@media (prefers-reduced-motion:reduce){
  .aviso-fugaz, .aviso-fugaz--sale{animation:none}
}


.nav-cuenta{display:flex; align-items:center; gap:8px}
.nav-cuenta img, .nav-iniciales{
  width:28px; height:28px; border-radius:50%; object-fit:cover; flex-shrink:0;
}
.nav-iniciales{
  background:var(--marca); color:#fff; display:grid; place-items:center;
  font-size:11px; font-weight:600; letter-spacing:.02em;
}
.nav-cuenta-n{
  background:var(--acento); color:#fff; font-size:11px; font-weight:600;
  border-radius:999px; padding:1px 7px; min-width:20px; text-align:center;
}
.nav-entrar{font-weight:500}
.nav-salir{display:flex}
.nav-salir button{
  border:0; background:none; color:var(--tinta-tenue); font-size:14px;
  cursor:pointer; padding:0; font-family:inherit;
}
.nav-salir button:hover{color:var(--marca); text-decoration:underline}

.cont-acceso{max-width:520px}
.tarjeta-acceso{
  border:1px solid var(--linea); border-radius:var(--radio); padding:38px 34px;
  background:var(--papel); text-align:center;
}
.tarjeta-acceso h1{
  font-family:var(--serif); font-size:1.7rem; font-weight:600; margin:0 0 12px;
  color:var(--marca); letter-spacing:-.018em;
}
.tarjeta-acceso > p{color:var(--tinta-suave); margin:0 0 26px; font-size:15.5px; line-height:1.6}
.btn-google{
  display:inline-flex; align-items:center; justify-content:center; gap:11px;
  width:100%; padding:14px 22px; border:1px solid var(--linea-fuerte);
  border-radius:9px; background:var(--papel); font-size:15.5px; font-weight:500;
  color:var(--tinta); transition:background .15s, border-color .15s;
}
.btn-google:hover{background:var(--papel-2); border-color:var(--tinta-tenue)}
.acceso-nota{
  font-size:13px; color:var(--tinta-tenue); margin:20px 0 0; line-height:1.55;
}
.acceso-nota a{color:var(--marca); text-decoration:underline; text-underline-offset:3px}

.favoritos-cab{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:20px; flex-wrap:wrap; margin-bottom:6px;
}
.favoritos-cab .landing-h1{margin-bottom:0}
.favoritos-cuenta{color:var(--tinta-suave); margin:0 0 26px}
.favoritos-retirados{margin-top:48px; padding-top:32px; border-top:1px solid var(--linea)}
.lista-retirados{list-style:none; padding:0; margin:18px 0 0; display:flex;
  flex-direction:column; gap:10px}
.lista-retirados li{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:14px 18px; background:var(--papel-2); border-radius:var(--radio);
  opacity:.75;
}
.lista-retirados li > span:first-child{font-weight:500; flex:1 1 240px}
.lista-retirados .p-sub{display:block; font-size:13px; color:var(--tinta-tenue)}
.lista-retirados .quitar{
  border:1px solid var(--linea-fuerte); background:var(--papel); border-radius:7px;
  padding:7px 14px; font-size:13px; cursor:pointer; font-family:inherit;
}
.lista-retirados .quitar:hover{border-color:var(--marca); color:var(--marca)}

@media (max-width:860px){
  .nav-cuenta{padding:14px 4px}
  .nav-salir{border-bottom:0; padding:10px 4px}
}


/* ---------- aviso de cookies ---------- */
.aviso-cookies{
  position:fixed; left:0; right:0; bottom:0; z-index:200;
  background:var(--papel); border-top:1px solid var(--linea-fuerte);
  box-shadow:0 -8px 30px rgba(22,26,29,.13);
  padding:18px 20px;
}
.aviso-cookies[hidden]{display:none}
.aviso-cookies-int{
  max-width:1100px; margin:0 auto; display:flex; align-items:center; gap:26px;
  flex-wrap:wrap; justify-content:space-between;
}
.aviso-cookies-titulo{
  margin:0 0 4px; font-family:var(--serif); font-size:1.05rem; font-weight:600;
  color:var(--tinta);
}
.aviso-cookies-texto{
  margin:0; font-size:14px; color:var(--tinta-suave); max-width:74ch; line-height:1.55;
}
.aviso-cookies-texto a{color:var(--marca); text-decoration:underline; text-underline-offset:3px}
.aviso-cookies-botones{display:flex; gap:10px; flex-wrap:wrap; flex-shrink:0}
.btn-cookies{
  border-radius:8px; padding:12px 22px; font-size:14.5px; font-weight:500;
  cursor:pointer; font-family:inherit; border:1px solid var(--linea-fuerte);
  background:var(--papel); color:var(--tinta);
}
.btn-cookies--no:hover{border-color:var(--tinta-tenue)}
.btn-cookies--si{background:var(--oscuro); border-color:var(--oscuro); color:#fff}
.btn-cookies--si:hover{background:#1b2026}

@media (max-width:700px){
  .aviso-cookies-int{gap:16px}
  .aviso-cookies-botones{width:100%}
  .btn-cookies{flex:1 1 auto; text-align:center}
}


/* ---------- bajadas de precio ---------- */
.con-bajada{position:relative; display:flex; flex-direction:column}
.marca-bajada{
  position:absolute; top:12px; left:12px; z-index:4;
  background:#1f7a45; color:#fff; border-radius:6px; padding:6px 11px;
  font-size:12px; font-weight:600; line-height:1.3;
}
.marca-bajada b{display:block; font-weight:400; font-size:11px; opacity:.9}
.con-bajada .etiqueta-op{display:none}
.antes-costaba{
  margin:8px 2px 0; font-size:13px; color:var(--tinta-tenue);
}
.antes-costaba s{color:var(--tinta-suave)}

/* ---------- invitacion a registrarse ---------- */
.invitacion{
  position:fixed; right:22px; bottom:22px; z-index:150; width:330px; max-width:calc(100vw - 32px);
  background:var(--papel); border:1px solid var(--linea-fuerte); border-radius:12px;
  padding:22px 22px 18px; box-shadow:0 16px 44px rgba(22,26,29,.20);
}
.invitacion[hidden]{display:none}
.invitacion--entra{animation:sube .28s ease both}
@keyframes sube{from{opacity:0; transform:translateY(14px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){.invitacion--entra{animation:none}}
.invitacion-cerrar{
  position:absolute; top:8px; right:10px; border:0; background:none; cursor:pointer;
  font-size:24px; line-height:1; color:var(--tinta-tenue); padding:4px 8px;
}
.invitacion-cerrar:hover{color:var(--tinta)}
.invitacion-titulo{
  margin:0 0 8px; font-family:var(--serif); font-size:1.16rem; font-weight:600;
  color:var(--tinta); padding-right:20px;
}
.invitacion-texto{margin:0 0 18px; font-size:14px; line-height:1.55; color:var(--tinta-suave)}
.invitacion-texto strong{color:var(--tinta)}
.invitacion-boton{
  display:block; text-align:center; background:var(--oscuro); color:#fff;
  border-radius:8px; padding:12px 18px; font-size:14.5px; font-weight:500;
}
.invitacion-boton:hover{background:#1b2026}
.invitacion-luego{
  display:block; width:100%; margin-top:8px; border:0; background:none; cursor:pointer;
  font-size:13.5px; color:var(--tinta-tenue); font-family:inherit; padding:8px;
}
.invitacion-luego:hover{color:var(--tinta-suave)}

@media (max-width:560px){
  .invitacion{right:12px; left:12px; bottom:12px; width:auto}
}

/* ---------- pie ---------- */
.pie{background:var(--oscuro); color:#c9d1d4; margin-top:0; padding:60px 0 0}
.pie-int{display:grid; gap:40px; grid-template-columns:repeat(auto-fit, minmax(230px,1fr))}
.pie h4{
  color:#fff; font-family:var(--serif); font-weight:600; font-size:1.15rem; margin:0 0 16px;
}
.pie ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px}
.pie a:hover{color:#fff}
.pie p{margin:0 0 10px; font-size:14.5px}
.pie-legal{
  margin-top:52px; border-top:1px solid rgba(255,255,255,.12); padding:20px 0;
  font-size:13px; color:#8b979d; display:flex; flex-wrap:wrap; gap:12px 24px;
  justify-content:space-between;
}

/* ---------- accesos por tipologia ---------- */
.atajos{display:flex; flex-wrap:wrap; gap:10px; margin-top:30px}
.atajo{
  display:inline-flex; align-items:baseline; gap:7px; padding:9px 16px;
  border:1px solid var(--linea-fuerte); border-radius:999px; background:var(--papel);
  font-size:14px; transition:all .15s;
}
.atajo:hover{border-color:var(--marca); color:var(--marca)}
.atajo b{font-weight:500}
.atajo span{color:var(--tinta-tenue); font-size:12.5px; font-variant-numeric:tabular-nums}

@media (max-width:860px){
  .hero{min-height:420px; padding:48px 18px}
  .seccion{padding:52px 0}
  .btn-buscar{width:100%; justify-content:center}
  .campo{flex:1 1 140px}
  .desplegable{flex:1 1 calc(50% - 5px)}
  /* Los nombres de las agencias no caben a media fila */
  .desplegable--ancho{flex-basis:100%}
  .dp-largo{display:none}
  .dp-corto{display:inline}
  .dp-panel{min-width:0; width:calc(100vw - 68px); max-width:none}
}

/* En moviles estrechos (360px y menos) el nombre de agencia mas largo
   -Avangard Mediterranean Properties- no entra a 15px. */
@media (max-width:380px){
  .desplegable > summary{font-size:14px; padding-right:28px}
}
