body { 
    font-family: "Poppins", sans-serif; 
    background-color: #fcfcfc; 
    -webkit-tap-highlight-color: transparent; 
}


.hero-bg { 
    background: linear-gradient(180deg, #ef4444 0%, #cc1d1d 100%); 
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
}

/* ESTILOS DE LOS CHECKBOXES DE INGREDIENTES */
.ing-check:checked + div { 
    background-color: #ef4444 !important; 
    color: white !important; 
    border-color: #ef4444 !important; 
}

.ing-check:not(:checked) + div { 
    background-color: #f1f5f9 !important; 
    color: #94a3b8 !important; 
    border-color: #e2e8f0 !important; 
}

.ing-check:not(:checked) + div i { 
    display: none; 
}

/* ANIMACIÓN PARA EL CARRUSEL DE OPINIONES */
@keyframes marquee {
    0% { transform: translateX(0%); }
    100% { transform: translateX(-100%); }
}

.animate-marquee {
    animation: marquee 35s linear infinite;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* ANIMACIÓN DE TEMBLOR PARA VALIDACIÓN EN ROJO */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}

.animate-shake {
    animation: shake 0.3s ease-in-out;
}

/* AJUSTES DE SCROLL Y BARRAS DE DESPLAZAMIENTO */
html {
    scroll-behavior: smooth;
}

.no-scrollbar::-webkit-scrollbar { 
    display: none; 
}

.no-scrollbar { 
    -ms-overflow-style: none; 
    scrollbar-width: none; 
}

/* MARGEN DE SEGURIDAD PARA LAS ANCLAS DE LA BARRA NAV FIJA */
#contenedor-pizzas, 
#contenedor-especiales, 
#contenedor-fastfood, 
#contenedor-acompañamientos, 
#contenedor-bebidas {
    scroll-margin-top: 70px;
}
/* 1. Reservar espacio para el banner rojo superior */
header, .hero, .banner-superior {
    min-height: 220px;
    contain: layout;
}

/* 2. Reservar espacio para todas las imágenes de la carta */
img {
    aspect-ratio: 4 / 3;
    width: 100%;
    height: auto;
    display: block;
    contain: paint;
}

/* 3. Evitar saltos en la barra lateral o botones de categorías */
nav, .categorias, .menu-categorias {
    min-height: 50px;
}