/* =========================================================================
   site.css — Estilos propios que extienden Tailwind/daisyUI.
   El grueso visual sale de utility classes en los templates; acá sólo
   van cosas que no se pueden expresar en utilidades o que valen reutilizar.
   ========================================================================= */

:root {
  --paper:  #FBF7F0;
  --sand:   #F1E9D8;
  --line:   #E4D9C2;
  --ink:    #1F1B16;
  --dim:    #6B6259;
  --moss:   #5C7A50;
  --forest: #2F4A35;
  --terra:  #B5612F;
  --clay:   #C99A6B;
}

/* Hero pattern: tela vegetal sutil, no obstruye el contenido */
.hero-leaves {
  background-image:
    radial-gradient(ellipse 60% 50% at 20% 10%, rgba(92,122,80,0.16), transparent 70%),
    radial-gradient(ellipse 70% 50% at 90% 0%, rgba(201,154,107,0.18), transparent 70%),
    linear-gradient(180deg, #FBF7F0 0%, #F5EEDD 100%);
}

/* Tarjetas con sensación de papel */
.card-paper {
  background: linear-gradient(180deg, #FFFDF8 0%, #FBF7F0 100%);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 1px 0 rgba(31,27,22,0.04), 0 12px 28px -16px rgba(31,27,22,0.18);
}

/* Pill de estado de lote, coherente entre tooltip / modal / lista */
.estado-pill {
  display: inline-block;
  font: 500 11px 'JetBrains Mono', monospace;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 9999px;
}
.estado-pill[data-s="free"]     { background: rgba(92,122,80,0.12);  color: #2F4A35; }
.estado-pill[data-s="reserved"] { background: rgba(216,154,60,0.16); color: #8B5A1F; }
.estado-pill[data-s="sold"]     { background: rgba(181,64,79,0.10);  color: #8C2E3A; }

/* Embed del mapa (dark) dentro de página clara: enmarcado con borde cálido */
.map-frame {
  background: #07090d;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  position: relative;
}
.map-frame .map-overlay-fade {
  pointer-events: none;
  position: absolute; inset: 0;
  box-shadow: inset 0 0 80px rgba(0,0,0,0.45);
  border-radius: 18px;
}

/* Tipografía display */
h1, h2, h3, .font-display {
  font-family: 'Fraunces', serif;
  font-feature-settings: 'opsz' on;
}

/* Foco accesible visible sobre fondos claros */
:focus-visible {
  outline: 2px solid var(--moss);
  outline-offset: 2px;
  border-radius: 6px;
}
