/* css/base.css
   ==========================================================================
   Base y Reseteo (Reset)
   ==========================================================================
   Este archivo "limpia" los estilos por defecto que traen los navegadores,
   asegurando que nuestra página se vea igual en Chrome, Safari, Firefox, etc.
   También establece los estilos iniciales del body (el cuerpo de la página).
*/

/* 
  1. Box Sizing
  Asegura que el padding y el border no aumenten el tamaño total de la caja.
*/
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* 
  2. Elementos Raíz y Body
*/
html {
    font-size: 16px;
    /* Tamaño base estándar */
    scroll-behavior: smooth;
    /* Para que al hacer clic en enlaces internos, el scroll sea suave */
}

body {
    /* Aplicamos nuestras variables definidas en variables.css */
    background-color: var(--color-primary);
    font-family: var(--font-sans);
    color: var(--color-cream);

    /* Antialiasing para que las fuentes se vean más nítidas en macOS y Windows */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* Aseguramos que el contenido ocupe al menos el 100% de la altura de la ventana */
    min-height: 100vh;
    width: 100%;

    /* Importante: relative y overflow-x: hidden para evitar scroll horizontal accidental */
    position: relative;
    overflow-x: hidden;

    /* Usamos flexbox para centrar el contenido verticalmente si es menor que la pantalla */
    display: flex;
    flex-direction: column;
}

/* 
  3. Tipografía Base
*/
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
}

p {
    margin: 0;
}

/* 
  4. Enlaces y Botones y Reseteos UI
*/
a {
    text-decoration: none;
    color: inherit;
    /* Hereda el color de su contenedor por defecto */
}

button {
    cursor: pointer;
    border: none;
    background: none;
    font-family: inherit;
}

/* Permitimos que las imágenes se adapten de forma responsiva por defecto */
img {
    max-width: 100%;
    display: block;
}