/* El Sitio Condominio · /lotes/ · hoja de estilos (sin estilos en línea: cumple la CSP del sitio) */
:root{--oliva:#465323;--bosque:#203C30;--marfil:#F5F2E9;--arena:#D8C7AA;--salvia:#9CA889;--carbon:#191D19;
  --disp:#BAC5A7;--res:#D8C7AA;--vend:#7A7D76;--serif:Georgia,"Times New Roman",serif;--sans:Arial,Helvetica,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--marfil);color:var(--carbon);font-family:var(--sans);font-size:16px;line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{color:var(--bosque)}
h1,h2,h3{font-family:var(--serif);font-weight:normal;color:var(--bosque);line-height:1.2}
.saltar{position:absolute;left:-9999px;top:0;background:var(--bosque);color:var(--marfil);padding:8px 12px;z-index:50}
.saltar:focus{left:8px;top:8px}
.envoltura{max-width:1200px;margin:0 auto;padding:0 16px}
[hidden]{display:none!important}
.oculto{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Encabezado */
.encabezado{background:var(--marfil);border-bottom:1px solid rgba(70,83,35,.35)}
.encabezado .envoltura{display:flex;align-items:center;gap:12px;min-height:60px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
/* Logo aprobado en PNG (libro de marca, pág. 4): mínimo 180 px de ancho; el relleno guarda el área de protección (0,5 X). Igual que en el inicio. */
.encabezado .logo{display:block;padding:14px;margin-left:-14px;line-height:0;flex:none}
.encabezado .logo img{width:180px;height:auto}
.menu{display:flex;gap:14px;margin-left:auto;align-items:center;flex-wrap:wrap;font-size:15px}
.menu a{text-decoration:none;color:var(--bosque)}
.menu a[aria-current="page"]{font-weight:bold;border-bottom:2px solid var(--oliva)}
.menu .solo-ancho{display:none}
.boton{display:inline-block;background:var(--bosque);color:var(--marfil)!important;text-decoration:none;padding:10px 16px;border-radius:8px;font-size:15px;line-height:1.2;border:1px solid var(--bosque);text-align:center}
.boton:hover,.boton:focus-visible{background:var(--oliva);border-color:var(--oliva)}
.boton-borde{background:transparent;color:var(--bosque)!important}
.boton-borde:hover,.boton-borde:focus-visible{background:rgba(70,83,35,.08)}
.boton-chico{padding:8px 12px;font-size:14px}

/* Intro */
.intro{padding:20px 0 8px}
.antetitulo{font-family:var(--serif);font-style:italic;color:var(--oliva);margin:0 0 4px;font-size:18px}
.intro h1{font-size:28px;margin:0 0 8px}
.intro p{margin:0 0 8px;max-width:62ch}
.resumen{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:15px;margin:8px 0 0;padding:0;list-style:none}
.resumen li{display:flex;align-items:center;gap:6px}

/* Muestras de estado */
.muestra{width:18px;height:12px;border:1px solid var(--carbon);display:inline-block;flex:none}
.st-disponible{background:var(--disp);color:var(--carbon)}
.st-reservado{background:var(--res);color:var(--carbon)}
.st-vendido{background:var(--vend);color:var(--marfil)}
.st-consultar{background:#fff;color:var(--carbon)}

/* Herramientas del mapa */
.herramientas{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 0}
.buscador{display:flex;gap:6px;flex:1 1 260px;min-width:0}
.buscador input{flex:1;min-width:0;font-size:16px;padding:9px 10px;border:1px solid var(--oliva);border-radius:8px;background:#fff;color:var(--carbon);font-family:var(--sans)}
.herramientas button{font-size:16px;padding:8px 12px;border:1px solid var(--oliva);background:#fff;color:var(--bosque);border-radius:8px;cursor:pointer;font-family:var(--sans);min-width:44px;min-height:42px}
.herramientas button:hover,.herramientas button:focus-visible{background:rgba(70,83,35,.08)}
.zoom{display:flex;gap:6px}
.aviso-busqueda{width:100%;margin:0;font-size:14px;color:#7a2e12;min-height:0}

/* Mapa */
.mapa{position:relative;height:66vh;height:66svh;min-height:380px;background:#fff;border:1px solid rgba(70,83,35,.45);border-radius:10px;overflow:hidden}
#map{width:100%;height:100%;display:block;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
#map:active{cursor:grabbing}
#map:focus{outline:none}
#map:focus-visible{outline:3px solid var(--oliva);outline-offset:-3px}
#map .lote{cursor:pointer;transition:fill .15s}
#map .lote:hover,#map .lote.sel{stroke:var(--oliva);stroke-width:.8}
#map .lote.sel{stroke:#000;stroke-width:1}
/* Letras de bloque y rótulos del plano: no atrapan el toque ni el cursor (así se abre el lote que está debajo) */
#map text{pointer-events:none}
.leyenda{position:absolute;left:8px;top:8px;background:rgba(245,242,233,.95);border:1px solid var(--oliva);border-radius:8px;padding:6px 10px;font-size:13px;margin:0;list-style:none}
.leyenda li{display:flex;align-items:center;gap:8px;margin:2px 0}
.pista{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(25,29,25,.82);color:var(--marfil);padding:10px 14px;border-radius:8px;font-size:15px;pointer-events:none;opacity:0;transition:opacity .2s;text-align:center;max-width:80%}
.pista.ver{opacity:1}

/* Ficha del lote (móvil: hoja inferior) */
.ficha{position:absolute;left:8px;right:8px;bottom:8px;background:#fff;border:1px solid var(--oliva);border-radius:10px;padding:12px 14px;box-shadow:0 4px 18px rgba(0,0,0,.12);max-height:calc(100% - 16px);overflow:auto}
.ficha h2{margin:0 0 6px;font-size:22px;padding-right:36px}
.ficha .cerrar{position:absolute;right:6px;top:4px;border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:#555;width:40px;height:40px}
.ficha .insignia{display:inline-block;padding:3px 10px;border-radius:12px;font-size:13px;margin-bottom:6px;border:1px solid rgba(25,29,25,.25)}
.ficha table{width:100%;border-collapse:collapse;font-size:15px}
.ficha td{padding:3px 0;border-bottom:1px solid #eee}
.ficha td:last-child{text-align:right;font-weight:bold}
.ficha .cta{display:block;margin-top:10px;text-align:center;background:var(--bosque);color:var(--marfil);text-decoration:none;padding:11px;border-radius:8px;font-size:15px}
.ficha .cta:hover,.ficha .cta:focus-visible{background:var(--oliva)}
.ficha .nota-vendido{font-size:14px;margin:8px 0 0;color:#444}
.ficha .tambien{font-size:13px;color:#555;margin:8px 0 0}
.ficha .tambien button{border:0;background:none;color:var(--bosque);text-decoration:underline;cursor:pointer;font-size:13px;padding:0 2px}
/* Celular: ficha más compacta (título e insignia en una línea, datos en dos columnas) para tapar menos el mapa */
@media (max-width:759px){
  .ficha{padding:10px 12px}
  .ficha h2{display:inline-block;margin:0 8px 4px 0;font-size:20px;padding-right:0}
  .ficha .insignia{margin:0 40px 6px 0;vertical-align:3px}
  .ficha tbody{display:grid;grid-template-columns:1fr 1fr;column-gap:14px}
  .ficha tr{display:flex;justify-content:space-between;gap:6px;border-bottom:1px solid #eee}
  .ficha td{border-bottom:0;padding:3px 0}
  .ficha .cta{margin-top:8px;padding:10px}
}

.nota{font-size:13px;color:#555;margin:8px 0 0}
.estado-carga{font-size:14px;color:#7a2e12;margin:6px 0 0}

/* Lista de lotes */
.lista{margin:16px 0 0;background:#fff;border:1px solid rgba(70,83,35,.35);border-radius:10px;padding:0 12px}
.lista summary{cursor:pointer;padding:12px 0;font-family:var(--serif);color:var(--bosque);font-size:18px}
.lista .filtro{display:flex;align-items:center;gap:8px;font-size:15px;margin:0 0 8px}
.tabla-scroll{max-height:420px;overflow:auto;margin-bottom:12px}
.lista table{width:100%;border-collapse:collapse;font-size:14px}
.lista th,.lista td{padding:6px 8px;border-bottom:1px solid #eee;text-align:left}
.lista th{position:sticky;top:0;background:var(--marfil);font-weight:bold}
.lista td.num{text-align:right}
.lista td button{font-size:13px;padding:4px 8px;border:1px solid var(--oliva);background:#fff;color:var(--bosque);border-radius:6px;cursor:pointer}

/* Secciones */
.seccion{padding:28px 0}
.seccion h2{font-size:24px;margin:0 0 8px}
.seccion p{max-width:65ch}
.seccion-blanca{background:#fff}
.figura{margin:12px 0 0}
.figura img{border:1px solid rgba(70,83,35,.25);border-radius:8px;width:100%}
.figura figcaption{font-size:14px;color:#555;margin-top:6px}
.acciones{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.renders{display:grid;gap:16px;grid-template-columns:1fr}
.etiqueta{display:inline-block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;background:var(--arena);color:var(--carbon);padding:2px 8px;border-radius:4px;margin-bottom:6px}
.cierre{background:var(--bosque);color:var(--marfil);padding:32px 0;text-align:center}
.cierre h2{color:var(--marfil);font-size:26px;margin:0 0 6px}
.cierre p{margin:0 auto 14px;max-width:55ch}
.cierre .lema{font-family:var(--serif);font-style:italic;color:var(--arena)}
.cierre .boton{background:var(--marfil);color:var(--bosque)!important;border-color:var(--marfil)}
.pie{padding:18px 0 24px;font-size:14px;color:#444}
.pie a{color:var(--bosque)}
.pie p{margin:4px 0}
.pie-legal{line-height:1.7}
.pie-legal .sep{margin:0 8px;color:var(--oliva)}

/* Escritorio */
@media (min-width:760px){
  .menu .solo-ancho{display:inline}
  .intro{padding:28px 0 10px}
  .intro h1{font-size:34px}
  .mapa{height:72vh;height:72svh;min-height:520px}
  .ficha{left:auto;right:12px;top:12px;bottom:auto;width:290px;max-height:calc(100% - 24px)}
  .leyenda{left:12px;top:auto;bottom:12px;font-size:14px;padding:10px 12px}
  .renders{grid-template-columns:1fr 1fr}
  .seccion h2{font-size:28px}
}
@media (min-width:1024px){
  .encabezado .logo{padding:16px;margin-left:-16px}
  .encabezado .logo img{width:210px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.herramientas,.ficha,.encabezado nav,.cierre .boton{display:none}}
