/* ============================================================
   NUCLEO — tokens de diseno + estilos base
   tokens.css se fusiono aqui el 2026-08-10: siempre se cargaban juntos y en
   este orden, asi que separarlos solo costaba una peticion bloqueante mas.
   nav.css NO se fusiono a proposito: comparte selectores (.site-nav.is-open,
   .topbar__nav.is-open) con site.css y home-sequence.css, y gana porque carga
   DESPUES. Adelantarlo invierte la cascada y rompe el menu de telefono.
   ============================================================ */

/* ---------- tokens de diseno ---------- */
:root {
  --ink: #232320;
  --ink-soft: #5a5852;
  --paper: #ffffff;
  --paper-warm: #f6f4ef;
  --orange: #e0701e;
  --orange-text: #a84f0f; /* darkened for small text/links on light backgrounds — passes WCAG AA (≥4.5:1); --orange itself is ~3.2:1, use only for large/graphic elements */
  --green: #63c21a;
  --dark: #1f1e1c;
  --blueprint-line: #3a3a38;
  --font-sans: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
}

/* ---------- base ---------- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
h1, h2, h3 { font-weight: 300; line-height: 1.05; letter-spacing: -0.01em; }
a { color: inherit; text-decoration: none; }

/* ---------- saltar al contenido (WCAG 2.4.1) ----------
   Primer elemento enfocable del documento. Invisible hasta que recibe foco:
   quien navega con teclado o lector de pantalla se salta el menú entero, que
   en el Home significa saltarse las 9 etapas de la secuencia. */
.saltar {
  position: absolute; left: 12px; top: -100px; z-index: 999;
  padding: 12px 20px; border-radius: 0 0 10px 10px;
  background: var(--ink); color: #fff; font-size: 15px; font-weight: 600;
  transition: top .25s ease;
}
.saltar:focus { top: 0; }

/* ---------- higiene de interacción (todas las páginas) ---------- */
html { -webkit-tap-highlight-color: transparent; }

/* Nada se selecciona salvo los datos de contacto y los campos de formulario. */
body { -webkit-user-select: none; -moz-user-select: none; user-select: none; }
input, textarea, select,
a[href^="tel:"], a[href^="mailto:"], a[href*="wa.me"],
address, .contact-row, .site-footer__nav p, .selectable {
  -webkit-user-select: text; -moz-user-select: text; user-select: text;
}

/* El foco azul del navegador se va, pero quien navega con teclado
   necesita saber dónde está: aro naranja solo con :focus-visible. */
:focus:not(:focus-visible) { outline: none; }
:focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 3px;
  border-radius: 2px;
}
a, button { -webkit-touch-callout: none; }
a[href^="tel:"], a[href^="mailto:"], a[href*="wa.me"], .selectable {
  -webkit-touch-callout: default;
}