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

:root {
    /* Colores base */
    --color-white: #fff;
    --color-black: #000;
    --color-gray-dark: #333;
    --color-gray-medium: #666;
    --color-gray-light: #e1e1e1;
    --color-text: #222;

    /* Colores de marca / primarios */
    --color-primary: #33c3f0;
    --color-primary-hover: #2da0c3;
    --color-accent: #007bff;
    --color-danger: red;
    --color-disabled: #B0BEC5;
}


.contenedor {
    max-width: 1170px;
    margin: auto;
}

.categoria-grid {
    display: grid;
    max-width: 1170px;
    margin: 20px auto;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr); /* 4 columnas fijas por defecto */
    padding-bottom: 40px;
}

/* Tablets: 2 columnas */
@media (max-width: 900px) {
    .categoria-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Celulares: 1 columna */
@media (max-width: 600px) {
    .categoria-grid {
        grid-template-columns: 1fr;
    }
}


.categoria__image-container{
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;

}

.categoria__image {
    max-height: 100%;
    max-width: 100%;
}


/*
***************
**********
**** Slider ****
**********
***************
*/