/* Base: tokens de color (claro/oscuro), reset y tipografía. */

/* ---------- Tokens: tema claro (por defecto) ---------- */
:root {
  --azul: #0077cc;
  --azul-osc: #005a9c;
  --ocre: #c97a0a;           /* del brochure; hoy sin uso */
  --whatsapp: #25d366;
  --whatsapp-osc: #1ebe5b;
  --oscuro: #1b1d20;          /* fondo de Acabados: oscuro en ambos temas */
  --tinta: #1b1d20;           /* títulos */
  --texto: #3c4046;           /* cuerpo */
  --bg: #ffffff;              /* fondo general */
  --papel: #f5f4f1;           /* fondo de Galería */
  --card: #ffffff;            /* cajas sobre el fondo */
  --linea: #e2e0db;
  --header-bg: rgba(255,255,255,.97);
  --sombra: rgba(0,0,0,.12);
  --max: 1180px;
  --gutter: clamp(16px, 4vw, 40px);
  /* Bordes redondeados: una sola escala para todo el sitio */
  --radio-chico: 8px;    /* chips, etiquetas, links del menú */
  --radio: 14px;         /* botones, ítems de la barra inferior, cajas chicas */
  --radio-grande: 20px;  /* tarjetas, fotos, mapa, barra inferior */
  --header-h: 88px;
  color-scheme: light;
}
/* ---------- Tokens: tema oscuro ----------
   Sin elección guardada sigue al sistema; el switch fuerza data-theme. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --oscuro: #0b0f14; --tinta: #f1f3f5; --texto: #b9c0c9; --bg: #12171e; --papel: #0e1319;
    --card: #19212b; --linea: #2a333e; --header-bg: rgba(18,23,30,.96); --sombra: rgba(0,0,0,.5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --oscuro: #0b0f14; --tinta: #f1f3f5; --texto: #b9c0c9; --bg: #12171e; --papel: #0e1319;
  --card: #19212b; --linea: #2a333e; --header-bg: rgba(18,23,30,.96); --sombra: rgba(0,0,0,.5);
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body {
  margin: 0;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: var(--texto);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  transition: background .25s, color .25s;
}
img { display: block; max-width: 100%; }
/* Íconos del sprite (icons/sprite.svg, Tabler): heredan el color del texto */
.icon { width: 1em; height: 1em; flex: none; }
a { color: inherit; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
h1, h2, h3 {
  font-family: "Bebas Neue", Impact, sans-serif;
  font-weight: 400;
  letter-spacing: .01em;
  line-height: 1;
  color: var(--tinta);
  margin: 0;
}
.chip {
  display: inline-block;
  background: var(--azul);
  color: #fff;
  font-family: "Bebas Neue", sans-serif;
  font-size: 20px;
  letter-spacing: .04em;
  padding: 8px 18px 6px;
  margin-bottom: 22px;
  border-radius: var(--radio-chico);
}
section { padding: clamp(72px, 10vw, 120px) 0; }