.ids-container { 
    width: 100vw !important; /* Fuerza el ancho al 100% de la pantalla */
    margin: 0 !important; 
    padding: 0 2rem !important; /* Esto garantiza tus 2rem de espacio a los lados */
    box-sizing: border-box !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important; /* Centra el contenedor nuevamente */
    margin-right: -50vw !important; /* Centra el contenedor nuevamente */
    max-width: 100vw !important;
}

/* Slider */
.ids-slider { position: relative; border-radius: 12px; overflow: hidden; border: 1px solid #e1e1e1; height: 400px; background: #fff; }
.ids-slider-inner { display: flex; width: 200%; height: 100%; animation: slide 10s infinite; }
.ids-slide-item { width: 50%; height: 100%; position: relative; }
.ids-slide-item img { width: 100%; height: 100%; object-fit: contain; padding: 10px; background: #f4f4f4; box-sizing: border-box; }

/* Banners */
.ids-banners { display: flex; flex-direction: column; gap: 20px; }
.ids-banner-item { height: 190px; border-radius: 12px; overflow: hidden; border: 1px solid #e1e1e1; }
.ids-banner-item img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Overlay */
.ids-overlay { position: absolute; bottom: 0; left: 0; width: 100%; padding: 15px; background: rgba(0,0,0,0.6); color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; pointer-events: none; }

/* Categorías */
/* --- CATEGORÍAS CORREGIDAS --- */
.ids-title { text-align: center; margin: 40px 0 20px; }
.ids-cat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

/* Aumentamos la altura de los banners de categorías (Desktop) */
.ids-cat-item { 
    height: 30rem; /* De 200px a 280px para que se vean más grandes */
    border: 1px solid #e1e1e1; 
    border-radius: 16px; 
    overflow: hidden; 
    background: #fff; 
}
.ids-cat-item img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    display: block;
}

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

@media (max-width: 600px) {
    .ids-hero-section { display: flex; flex-direction: column; }
    .ids-slider { height: 250px; }
    
    /* Aumentamos la altura en móvil para que no se vean tan cuadrados */
    .ids-cat-grid { grid-template-columns: 1fr; }
    .ids-cat-item { height: 40rem; } /* Ajuste de altura en móvil */
}