/* ============================================================================
   Andén — tokens de la landing (fuente de verdad: ../DESIGN.md en anden-docs)
   Base neutra cálida (stone), un solo acento Arcilla. Sin grises fríos,
   sin #000000, sin degradados en texto, sin neones.
   ========================================================================== */

/* Fuentes autohospedadas (Outfit variable 400–700, JetBrains Mono 500–600).
   Descargadas de Google Fonts (licencia OFL) — ver assets/fuentes/. */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../assets/fuentes/outfit-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../assets/fuentes/outfit-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500 600;
  font-display: swap;
  src: url('../assets/fuentes/jetbrains-mono-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500 600;
  font-display: swap;
  src: url('../assets/fuentes/jetbrains-mono-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Color (DESIGN.md §2) */
  --papel: #faf7f2;          /* fondo principal */
  --superficie: #ffffff;     /* tarjetas, inputs */
  --tinta: #1c1917;          /* texto primario (nunca #000) */
  --piedra: #78716c;         /* texto secundario, metadata */
  --borde: #e7e0d8;          /* bordes 1px, divisores */
  --arcilla: #b4552d;        /* ACENTO ÚNICO */
  --arcilla-oscura: #a64d28; /* arcilla oscurecida 8% (estado presionado) */
  --arcilla-suave: #f3e4dc;  /* fondos de acento tenues */
  --musgo: #4d7c0f;          /* éxito */
  --ambar: #b45309;          /* pendiente */
  --ladrillo: #a33a2e;       /* error / mora */
  --noche: #292524;          /* superficie oscura (tarjeta héroe, footer) */
  --blanco-calido: #fff8f3;  /* texto sobre Arcilla o Noche */
  /* Derivado (no está en DESIGN.md): Tinta al 78 % sobre Papel para párrafos
     largos secundarios. Piedra Suave sobre Papel da 4.49:1 (justo bajo AA a
     16 px); este tono conserva la calidez y pasa AA con holgura (~7.9:1). */
  --texto-2: color-mix(in srgb, var(--tinta) 78%, var(--papel));
  /* Piedra Suave para TEXTO: un paso más oscura que el token de la app
     (#78716C = 4.49:1 sobre Papel) para pasar AA en cuerpo y notas (5.4:1).
     El token original se conserva para íconos, divisores y placeholders. */
  --piedra-texto: #6b6560;

  /* Tipografía (DESIGN.md §3, escala ampliada para web de marketing) */
  --font-display: 'Outfit', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Cascadia Mono', 'SFMono-Regular', Consolas, monospace;
  --fs-body: 1rem;            /* 16px base, nunca < 14px */
  --fs-small: 0.875rem;       /* 14px: metadata, notas al pie */
  --fs-label: 0.8125rem;      /* 13px: solo labels de formulario en peso 600 */
  --fs-h3: 1.125rem;          /* 18px */
  --fs-h2: clamp(1.5rem, 1.15rem + 1.6vw, 2.125rem);   /* 24 → 34px */
  --fs-h1: clamp(2rem, 1.4rem + 2.2vw, 3rem);         /* 32 → 48px, dos líneas en escritorio */
  --lh-body: 1.5;
  --tracking-display: -0.02em;
  --medida: 65ch;

  /* Forma (DESIGN.md §4) */
  --r-boton: 14px;
  --r-tarjeta: 20px;
  --r-chip: 999px;
  --r-input: 14px;
  --h-boton: 52px;
  --sombra-tarjeta: 0 4px 16px rgba(28, 25, 23, 0.06);
  --ring: 0 0 0 4px rgba(180, 85, 45, 0.15);

  /* Espacio (DESIGN.md §5) */
  --seccion: clamp(56px, 9vw, 120px);          /* aire entre secciones grandes */
  --bloque: clamp(24px, 5vw, 48px);            /* entre subsecciones */
  --gutter: clamp(20px, 4vw, 40px);
  --max: 1280px;

  /* Motion (DESIGN.md §6 — springs sin rebote traducidos a curvas) */
  --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);  /* iOS push / damping 1.0 */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);      /* easeOutCubic-ish para cascadas */
  --t-press: 100ms;
  --t-ui: 340ms;
  --t-cascada: 40ms;

  color-scheme: light;
}