/* ============================================================
SALTIA · Sistema de diseño
saltia.css — hoja de estilo compartida para todas las apps
------------------------------------------------------------
Uso:
Documentación viva: estilo.html
============================================================ */
/* ---- 1. TOKENS (variables de marca) ---- */
:root{
/* Color — modo claro */
--s-ink: #111111; /* texto y trazo principal */
--s-ink-soft: #3a3a3a; /* texto secundario */
--s-muted: #8a8a8a; /* etiquetas, metadatos */
--s-paper: #ffffff; /* fondo principal */
--s-paper-2: #f6f6f4; /* fondo alterno / hover */
--s-line: #e4e4e0; /* bordes y separadores */
/* Estado (uso discreto) */
--s-ok: #2c6e3f;
--s-err: #a8442a;
/* Tipografía */
--s-font-display: 'Spectral', Georgia, serif; /* títulos, editorial */
--s-font-body: 'Jost', system-ui, sans-serif; /* texto, interfaz */
/* Escala tipográfica */
--s-text-xs: 12px;
--s-text-sm: 14px;
--s-text-base: 16px;
--s-text-lg: 20px;
--s-text-xl: clamp(26px, 3vw, 34px);
--s-text-2xl: clamp(30px, 4.5vw, 48px);
--s-text-3xl: clamp(36px, 6vw, 72px);
/* Espaciado (múltiplos de 4) */
--s-space-1: 4px; --s-space-2: 8px; --s-space-3: 12px;
--s-space-4: 16px; --s-space-6: 24px; --s-space-8: 32px;
--s-space-12: 48px; --s-space-16: 64px; --s-space-20: 80px;
/* Otros */
--s-radius: 2px;
--s-maxw: 1180px;
--s-track: .08em; /* letter-spacing base interfaz */
--s-track-wide: .3em;
--s-transition: .3s ease;
}
/* ---- 2. RESET LIGERO ---- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
font-family:var(--s-font-body);
font-weight:300;
color:var(--s-ink);
background:var(--s-paper);
line-height:1.65;
-webkit-font-smoothing:antialiased;
}
/* ---- 3. LOGO ---- */
/* Uso:
Importante: el