*{
	margin:0;
	padding:0;
    box-sizing: border-box;
    font-family: 'Acme', sans-serif;
}

:root {
     /* 🎨 COLORES PRINCIPALES */
    --color-principal: #C31615;
    --color-fondo: #1a1a1a;
    --color-naranja-base: #6FBF6A;
    --color-naranja-suave: #fb923c;
    --color-gris-claro: #f5f5f5;
    --color-texto: #9ca3af;
    

    /* 🌈 COLORES SECUNDARIOS */
    --color-red: #C31615;
    --color-black: #000000;
    --color-white: #FFFFFF;

    /* ✍️ TIPOGRAFÍA */
    --fuente-secundaria: 'Chicle', sans-serif;
    --tamano-base: 0.8vw;
    --tamano-titulo: clamp(1.8rem, 2.4vw, 2.8rem);
    --tamano-subtitulo: clamp(1.2rem, 1.5vw, 1.8rem);
    --tamano-texto: clamp(1rem, 1.1vw, 1.4rem);
    --tamano-pequeno: clamp(0.9rem, 1vw, 1.2rem);
    --peso-normal: 400;
    --peso-negrita: 600;

    /* 📏 ESPACIADO Y BORDES */
    --margin-pequeno: 0.5vw;
    --margin-medio: 0.8vw;
    --margin-grande: 1.5vw;
    --padding-pequeno: 0.5vw;
    --padding-medio: 1vw;
    --padding-grande: 2vw;
    --radio-borde: 1.6vh;
    --radio-boton: 1vh;

    /* 🌫️ SOMBRAS */
    --sombra-suave: 0 2px 5px rgba(0,0,0,0.1);
    --sombra-media: 0 4px 10px rgba(0,0,0,0.15);
    --sombra-fuerte: 0 6px 15px rgba(0,0,0,0.2);

    /* ⚙️ TRANSICIONES */
    --transicion-rapida: 0.2s ease-in-out;
    --transicion-media: 0.4s ease;
    --transicion-lenta: 0.6s ease;

    /* 🧱 CAPAS (Z-INDEX) */
    --z-header: 100;
    --z-menu: 200;
    --z-modal: 1000;
    --z-loading: 2000;
}