/* =============================================================
   BienesRaicesOne · Sistema de diseño
   Paleta inspirada en ArguedasOne (estética "NOC / terminal"):
   fondos profundos casi negros, verde menta de acento y grises técnicos.
   © 2026 ArguedasOne. Todos los derechos reservados.
   ============================================================= */

:root {
  /* Marca */
  --a1-green:        #2BD9A5; /* acento principal (verde menta "healthy") */
  --a1-green-strong: #12B886;
  --a1-green-soft:   rgba(43, 217, 165, 0.12);
  --a1-amber:        #F5A623; /* acento secundario (precios / alertas) */
  --a1-blue:         #4C8DFF;

  /* Radios y sombras */
  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 22px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.08);
  --shadow:    0 8px 24px rgba(2, 6, 12, .12);
  --shadow-lg: 0 24px 60px rgba(2, 6, 12, .22);

  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", ui-monospace, monospace;

  --header-h: 68px;
  --transition: 180ms cubic-bezier(.4, 0, .2, 1);
}

/* ---------- Tema claro (por defecto) ---------- */
:root, [data-theme="light"] {
  --bg:            #F7F9FB;
  --bg-elevated:   #FFFFFF;
  --surface:       #FFFFFF;
  --surface-2:     #F1F4F8;
  --border:        #E3E8EE;
  --border-strong: #CBD5E1;
  --text:          #0B0F14;
  --text-muted:    #5B6672;
  --text-faint:    #8B98A5;
  --overlay:       rgba(11, 15, 20, .55);
  --header-bg:     rgba(255, 255, 255, .82);
}

/* ---------- Tema oscuro ("NOC") ---------- */
[data-theme="dark"] {
  --bg:            #0B0F14;
  --bg-elevated:   #12181F;
  --surface:       #141A21;
  --surface-2:     #1A222C;
  --border:        #232D38;
  --border-strong: #33404E;
  --text:          #E6EDF3;
  --text-muted:    #94A2B0;
  --text-faint:    #6B7A88;
  --overlay:       rgba(3, 6, 10, .7);
  --header-bg:     rgba(11, 15, 20, .78);
  --shadow:    0 8px 24px rgba(0,0,0,.45);
  --shadow-lg: 0 24px 60px rgba(0,0,0,.55);
}

/* ---------- Base ---------- */
* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
  transition: background var(--transition), color var(--transition);
}

a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 .4em; }

.container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ---------- Botones ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  font-weight: 600;
  font-size: .95rem;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  padding: .65rem 1.2rem;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}
.btn-primary {
  background: var(--a1-green);
  color: #04120D;
  border-color: var(--a1-green);
}
.btn-primary:hover { background: var(--a1-green-strong); transform: translateY(-1px); }
.btn-ghost {
  background: transparent;
  color: var(--text);
  border-color: var(--border-strong);
}
.btn-ghost:hover { background: var(--surface-2); }
.btn-block { width: 100%; }

/* ---------- Badges / chips ---------- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .28rem .6rem;
  border-radius: 999px;
}
.badge-venta   { background: var(--a1-green-soft); color: var(--a1-green-strong); }
.badge-alquiler{ background: rgba(76,141,255,.14); color: var(--a1-blue); }
.badge-featured{ background: rgba(245,166,35,.16); color: var(--a1-amber); }

/* ---------- Utilidades ---------- */
.text-muted { color: var(--text-muted); }
.mono { font-family: var(--font-mono); }
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}
.section { padding: 64px 0; }
.grid { display: grid; gap: 22px; }
