/* --- Variables (Custom Properties) --- */
:root {
    --color-background: #0a0a0a;
    --color-text: #e5e5e5;
    --color-text-muted: #a3a3a3; /* gray-400 */
    --color-text-header: #d4d4d8; /* gray-200 */
    --color-primary: #4f46e5; /* indigo-600 */
    --color-primary-hover: #4338ca; /* indigo-500 */
}

/* --- Reseteo y Normalización Global --- */
*,
*::before,
*::after {
    box-sizing: border-box; /* Un modelo de caja más intuitivo */
}

body,
html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Evita barras de scroll indeseadas */
}

/* --- Estilos Base para el Proyecto --- */
body.page {
    font-family: 'Inter', sans-serif;
    background-color: var(--color-background);
    color: var(--color-text);
    
    /* Prepara el body para ser un contenedor flex principal */
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Estilos base para elementos comunes si fuera necesario */
h1, h2, h3, p {
    margin: 0;
}

button {
    font-family: inherit; /* Hereda la fuente del body */
}