/* ============================================================
   TOKENS — Sistema de diseño Tacos Aragón
   Paleta cálida: blancos, amarillo y naranja de carbón.
   Único archivo donde se definen valores crudos de diseño.
   ============================================================ */

:root {
    /* ---- Neutros cálidos ----
       Ningún blanco es puro: todos llevan algo de amarillo para que
       la página se sienta de taquería y no de hoja de cálculo. */
    --ta-blanco: #FFFFFF;
    --ta-crema: #FFFBF5;
    --ta-arena: #FDF1E3;
    --ta-arena-honda: #F7E3CD;
    --ta-borde: #EFDCC5;

    /* ---- Marca ---- */
    --ta-amarillo: #FFC115;
    --ta-amarillo-claro: #FFD75E;
    --ta-amarillo-honda: #E8A700;

    --ta-naranja: #F26D1D;
    --ta-naranja-claro: #FF8A3D;
    --ta-naranja-honda: #D4520B;

    /* Rojo de brasa, solo para acentos y estados urgentes. */
    --ta-brasa: #C2320E;

    /* ---- Carbón: el oscuro de la marca ----
       Café muy oscuro en vez de negro, para que combine con lo cálido. */
    --ta-carbon: #22190F;
    --ta-carbon-suave: #3B2C1D;

    /* ---- Texto ---- */
    --ta-texto: #2A1F14;
    --ta-texto-medio: #6B5A47;
    --ta-texto-suave: #94806A;
    --ta-texto-invertido: #FFFBF5;

    /* ---- Estados ---- */
    --ta-verde: #1E8E3E;
    --ta-verde-claro: #E6F4EA;
    --ta-whatsapp: #25D366;

    /* ---- Tipografía ----
       Anton para titulares: condensada y pesada, el registro visual
       de las cadenas grandes. Inter para todo lo que se lee de corrido. */
    --ta-fuente-titulo: 'Anton', 'Arial Narrow', sans-serif;
    --ta-fuente-texto: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --txt-xs: 0.75rem;
    --txt-sm: 0.875rem;
    --txt-base: 1rem;
    --txt-lg: 1.125rem;
    --txt-xl: 1.25rem;
    --txt-2xl: 1.5rem;
    --txt-3xl: 2rem;
    --txt-4xl: 2.75rem;

    /* Titulares que se adaptan al ancho sin media queries. */
    --txt-hero: clamp(2.75rem, 11vw, 6rem);
    --txt-seccion: clamp(1.75rem, 5vw, 3rem);

    --peso-normal: 400;
    --peso-medio: 500;
    --peso-semi: 600;
    --peso-fuerte: 700;
    --peso-negro: 800;

    --alto-apretado: 1.05;
    --alto-titulo: 1.15;
    --alto-normal: 1.6;
    --alto-suelto: 1.75;

    /* ---- Espaciado: escala de 8 ---- */
    --esp-1: 0.25rem;
    --esp-2: 0.5rem;
    --esp-3: 0.75rem;
    --esp-4: 1rem;
    --esp-5: 1.5rem;
    --esp-6: 2rem;
    --esp-7: 3rem;
    --esp-8: 4rem;
    --esp-9: 6rem;

    /* Aire vertical entre secciones, elástico en móvil. */
    --esp-seccion: clamp(3rem, 8vw, 6rem);

    /* ---- Radios ---- */
    --radio-sm: 8px;
    --radio: 14px;
    --radio-lg: 22px;
    --radio-xl: 32px;
    --radio-full: 999px;

    /* ---- Sombras: tintadas en café, nunca gris neutro ---- */
    --sombra-sm: 0 1px 3px rgba(84, 48, 16, 0.08);
    --sombra: 0 4px 14px rgba(84, 48, 16, 0.10);
    --sombra-md: 0 10px 30px rgba(84, 48, 16, 0.13);
    --sombra-lg: 0 22px 55px rgba(84, 48, 16, 0.20);
    --sombra-boton: 0 6px 18px rgba(242, 109, 29, 0.35);

    /* ---- Movimiento ---- */
    --trans-rapida: 140ms cubic-bezier(0.4, 0, 0.2, 1);
    --trans: 240ms cubic-bezier(0.4, 0, 0.2, 1);
    --trans-lenta: 480ms cubic-bezier(0.4, 0, 0.2, 1);

    /* ---- Estructura ---- */
    --ancho-max: 1200px;
    --ancho-texto: 68ch;
    --alto-nav: 68px;

    /* ---- Capas ----
       Centralizadas para que no aparezcan z-index mágicos por ahí. */
    --capa-base: 1;
    --capa-sticky: 100;
    --capa-nav: 200;
    --capa-barra-pedido: 300;
    --capa-modal: 400;
}

/* La página está pensada en claro. Se declara explícitamente para que
   ningún visor la pinte sobre un fondo oscuro heredado. */
:root {
    color-scheme: light;
}
