:root{--fondo:#FBF8FD;--lavanda:#DDD6F3;--menta:#CDE8DA;--durazno:#FBD9C9;--manteca:#FAEFC4;--cielo:#D2E6F4;--tinta:#38405A;--suave:#6B7391;--linea:#E8E3F1;--acento:#8E7CC3;--display:"Bricolage Grotesque","Trebuchet MS",sans-serif;--texto:"Figtree","Segoe UI",system-ui,sans-serif}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--fondo);color:var(--tinta);font:17px/1.6 var(--texto)}
a{color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--acento);outline-offset:3px;border-radius:8px}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--display);letter-spacing:-.015em;line-height:1.15}
h2{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:16px}
section{padding:52px 0}

/* Encabezado */
header{background:var(--lavanda);border-radius:0 0 40px 40px}
header.grande{padding-bottom:84px}
header.chico{padding-bottom:30px}
.top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 0;flex-wrap:wrap}
.marca{font-family:var(--display);font-weight:700;font-size:1.35rem;text-decoration:none}
.marca img{display:block;width:clamp(110px,16vw,160px);height:auto}
nav{display:flex;gap:4px;flex-wrap:wrap}
nav a{text-decoration:none;padding:8px 16px;border-radius:999px;font-weight:500;font-size:.95rem}
nav a:hover{background:rgba(255,255,255,.6)}
.tel{background:#fff;font-weight:600;padding:8px 18px;border-radius:999px;text-decoration:none;font-size:.95rem}
.portada{padding:40px 0 0}
.portada h1{font-size:clamp(2.2rem,5.5vw,3.8rem);max-width:16ch;letter-spacing:-.025em}
.portada p{margin-top:14px;max-width:46ch;opacity:.85;font-size:1.1rem}

/* Formularios y botones */
label{display:block;font-size:.86rem;font-weight:600;margin-bottom:4px}
select,input,textarea{width:100%;font:inherit;color:inherit;background:var(--fondo);border:1.5px solid var(--linea);border-radius:14px;padding:11px 14px}
select:focus,input:focus,textarea:focus{border-color:var(--acento);outline:none;box-shadow:0 0 0 3px var(--lavanda)}
textarea{resize:vertical}
.fila{margin-bottom:12px}
.boton{border:1.5px solid transparent;border-radius:999px;background:var(--acento);color:#fff;font:600 1rem var(--texto);padding:13px 26px;cursor:pointer;text-decoration:none;display:inline-block;text-align:center}
.boton:hover{background:#7d6bb3}
.boton.claro{background:#fff;color:var(--tinta);border-color:var(--linea)}
.boton.claro:hover{background:var(--manteca)}
.nota{font-size:.85rem;color:var(--suave);margin-top:8px}

/* Buscador y listado */
.buscador{margin-top:-52px;position:relative;background:#fff;border:1.5px solid var(--linea);border-radius:28px;padding:22px;display:grid;grid-template-columns:repeat(4,1fr) auto;gap:14px;align-items:end;box-shadow:0 20px 44px -28px rgba(90,80,140,.55)}
.cabeza{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
#cuenta{color:var(--suave)}
.grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:20px}
.card{background:#fff;border:1.5px solid var(--linea);border-radius:24px;overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .15s}
.card:hover{transform:translateY(-3px)}
.foto{aspect-ratio:4/3;display:grid;place-items:center;position:relative}
.foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.foto svg,.visor svg{width:64px;opacity:.55}
.sello{display:inline-block;background:var(--menta);padding:3px 14px;border-radius:999px;font-size:.86rem;font-weight:600}
.foto .sello{position:absolute;left:12px;top:12px;background:#fff}
.info{padding:18px 20px 20px}
.precio{font-family:var(--display);font-weight:700;font-size:1.5rem}
.info h3{font-size:1.08rem;margin:4px 0 2px;font-weight:500}
.zona{color:var(--suave);font-size:.95rem}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.info .chips{margin-top:12px}
.chips span{background:#fff;border:1.5px solid var(--linea);border-radius:999px;padding:3px 14px;font-size:.88rem;font-weight:500}
.vacio{grid-column:1/-1;background:var(--manteca);border-radius:24px;padding:32px;text-align:center}

/* Nosotros, tasación, contacto */
.nos{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center}
.cifras{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cifras div{border-radius:22px;padding:22px}
.cifras b{display:block;font-family:var(--display);font-size:2rem}
.c1{background:var(--menta)}.c2{background:var(--durazno)}.c3{background:var(--cielo)}.c4{background:var(--manteca)}
.tasacion{background:var(--durazno);border-radius:36px;padding:44px 34px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.tasacion h2{margin-bottom:6px}
.contacto{display:grid;grid-template-columns:1fr 1fr;gap:36px}

/* Ficha de propiedad */
.migas{font-size:.92rem;color:var(--suave)}
.migas a{text-decoration:none}.migas a:hover{text-decoration:underline}
header.chico h1{font-size:clamp(1.8rem,4vw,2.8rem);max-width:26ch;margin-top:4px}
.galeria{margin-top:28px}
.visor{position:relative;border-radius:26px;overflow:hidden;background:var(--menta);aspect-ratio:16/9;max-height:78vh;width:100%;display:grid;place-items:center;box-shadow:0 22px 48px -28px rgba(90,80,140,.55)}
.visor img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;cursor:zoom-in}
.flecha{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border:0;border-radius:50%;background:rgba(255,255,255,.92);font-size:1.7rem;line-height:1;cursor:pointer;color:var(--tinta);z-index:2}
.flecha:hover{background:#fff}
.ant{left:16px}.sig{right:16px}
.contador{position:absolute;right:16px;bottom:16px;background:rgba(255,255,255,.92);padding:4px 14px;border-radius:999px;font-size:.9rem;font-weight:600;z-index:2}
.tiras{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 6px}
.tiras button{flex:0 0 110px;height:76px;border:3px solid transparent;border-radius:14px;padding:0;overflow:hidden;cursor:pointer;background:var(--lavanda)}
.tiras button[aria-current="true"]{border-color:var(--acento)}
.tiras img{width:100%;height:100%;object-fit:cover;display:block}
.cuerpo{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;margin-top:36px;align-items:start}
.cuerpo section{padding:0 0 38px}
.ficha{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:12px}
.dato{border-radius:18px;padding:16px 18px;min-width:0}
.dato b{display:block;font-family:var(--display);font-size:1.45rem;line-height:1.2;overflow-wrap:anywhere}
.dato span{font-size:.92rem;opacity:.78}
.descr{max-width:64ch;font-size:1.05rem;white-space:pre-line}
.mapa iframe{width:100%;height:320px;border:0;border-radius:22px;background:var(--cielo);display:block}
.mapa p{margin-top:10px}
.aviso{font-size:.82rem;color:var(--suave);line-height:1.5;max-width:70ch}
aside{position:sticky;top:20px}
.tarjeta{background:#fff;border:1.5px solid var(--linea);border-radius:26px;padding:26px;box-shadow:0 18px 40px -26px rgba(90,80,140,.5)}
.tarjeta .precio{font-size:2.3rem;margin:10px 0 4px}
.cod{font-size:.9rem;color:var(--suave)}
.acciones{display:grid;gap:10px;margin:18px 0 22px}
.acciones .boton{display:block;padding:12px 20px;font-size:.98rem}
.tarjeta h3{font-size:1.1rem;margin-bottom:12px}
.tarjeta form .boton{width:100%;margin-top:6px}
#ok{font-weight:600;margin-top:10px}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
#lb{border:0;background:rgba(30,34,50,.95);width:100vw;height:100vh;max-width:none;max-height:none;padding:0}
#lb img{position:absolute;inset:0;margin:auto;max-width:94vw;max-height:90vh;object-fit:contain}
.cerrar{position:absolute;right:18px;top:18px;width:46px;height:46px;border:0;border-radius:50%;background:#fff;font-size:1.5rem;cursor:pointer;z-index:3}

footer{background:var(--menta);border-radius:36px 36px 0 0;padding:36px 0 26px;margin-top:30px}
.pie{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
footer h3{font-size:1.1rem;margin-bottom:6px}
footer p{font-size:.95rem}
.legal{margin-top:22px;font-size:.83rem;opacity:.75}

@media (max-width:900px){
  .buscador{grid-template-columns:1fr 1fr}
  .buscador .boton{grid-column:1/-1}
  .nos,.contacto,.cuerpo{grid-template-columns:1fr}
  aside{position:static}
  .visor{aspect-ratio:4/3}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card{transition:none}}
