.ozs--images .ozs__media{background:transparent}
.ozs--images .ozs__media img{display:block}

/* =========================================================
   Plantilla: Solo imagen - 2 filas (hover)
   grid_2rows aplicado al tipo "images"
   - Sin bordes, sin fondos en las slides
   - 2 filas x N columnas (segun ozs-cols)
   - Efecto hover: ligera elevacion + zoom sutil de la imagen
   ========================================================= */
.ozs--layout-grid_2rows .ozs__track{
    display:grid;
    grid-auto-flow:column;
    grid-template-rows:repeat(2, minmax(0, 1fr));
    grid-auto-columns:calc((100% - (var(--ozs-gap, 22px) * (var(--ozs-cols, 3) - 1))) / var(--ozs-cols, 3));
    gap:var(--ozs-gap, 22px);
    align-items:stretch;
    padding:0;
    list-style:none;
}
.ozs--layout-grid_2rows .ozs__slide{
    min-width:0;
    scroll-snap-align:start;
    background:transparent;
    border:0;
    padding:0;
    margin:0;
    list-style:none;
    overflow:hidden;
    border-radius:12px;
}
.ozs--layout-grid_2rows .ozs__dots{display:none !important}

.ozs--layout-grid_2rows .ozs-img,
.ozs--layout-grid_2rows .oz-img,
.ozs--layout-grid_2rows .ozs__slide > a,
.ozs--layout-grid_2rows .ozs__slide > figure,
.ozs--layout-grid_2rows .ozs__slide > picture,
.ozs--layout-grid_2rows .ozs__slide > div{
    background:transparent;
    border:0;
    border-radius:0;
    padding:0;
    margin:0;
    display:block;
    height:100%;
    box-shadow:none;
}
.ozs--layout-grid_2rows .ozs__slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:12px;
    transition:transform .35s ease, filter .35s ease;
}

/* Hover simple: leve zoom + mayor brillo */
.ozs--layout-grid_2rows .ozs__slide:hover img,
.ozs--layout-grid_2rows .ozs__slide:focus-within img{
    transform:scale(1.035);
    filter:brightness(1.05);
}

/* Header sobre fondo oscuro (dentro de feature respiradores/guantes) */
.myg-home-feature--respirators .ozs--layout-grid_2rows .ozs__header,
.myg-home-feature--gloves .ozs--layout-grid_2rows .ozs__header{
    margin-bottom:24px;
}
.myg-home-feature--respirators .ozs--layout-grid_2rows .ozs__header-text,
.myg-home-feature--gloves .ozs--layout-grid_2rows .ozs__header-text{
    position:relative;
    padding-left:18px;
}
.myg-home-feature--respirators .ozs--layout-grid_2rows .ozs__header-text::before,
.myg-home-feature--gloves .ozs--layout-grid_2rows .ozs__header-text::before{
    content:"";
    position:absolute;
    top:6px;
    left:0;
    width:6px;
    height:calc(100% - 12px);
    background:#F5A623;
    border-radius:3px;
}
.myg-home-feature--respirators .ozs--layout-grid_2rows .ozs__title,
.myg-home-feature--gloves .ozs--layout-grid_2rows .ozs__title{
    color:#ffffff;
    font-size:clamp(1.8rem, 2.4vw, 2.6rem);
    font-weight:800;
    line-height:1.1;
    margin:0;
}
.myg-home-feature--respirators .ozs--layout-grid_2rows .ozs__subtitle,
.myg-home-feature--gloves .ozs--layout-grid_2rows .ozs__subtitle{
    color:rgba(231,237,245,0.88);
    margin:6px 0 0;
    font-size:1rem;
}
/* Color/tamaño/hover de las flechas: regla global en oz-sliders.css */

/* Responsive */
@media (max-width: 1024px){
    .ozs--layout-grid_2rows .ozs__track{
        grid-auto-columns:calc((100% - (var(--ozs-gap, 18px) * (var(--ozs-cols, 2) - 1))) / var(--ozs-cols, 2));
        gap:var(--ozs-gap, 18px);
    }
}
@media (max-width: 768px){
    .ozs--layout-grid_2rows .ozs__track{
        grid-template-rows:repeat(1, minmax(0, 1fr));
        grid-auto-columns:calc(100% - 24px);
        gap:12px;
    }
}

/* =========================================================================
   Quita SOLO el padding-top que la base reserva para las flechas cuando el
   slider no tiene header (--oz-nav-size + 24px).
   Se aplica de dos formas (con cualquiera basta):
     a) AUTOMÁTICO al carrusel del preset id=6117 (por su id oz-slider-6117-*).
     b) MANUAL en cualquier otro: class="sin-espacio-arriba" en el shortcode.
   Especificidad 0,5,0 con !important: vence a la regla base y a su versión en
   @media (max-width:768px), en todos los anchos.
   NOTA: si el slider tiene flechas activas, quedarán sobre la primera fila;
   desactiva "Navegación" (nav="false") si no las quieres ahí.
   ========================================================================= */
.ozs.ozs--images.sin-espacio-arriba:not(.ozs--banner):not(.ozs--has-header),
.ozs.ozs--images[id^="oz-slider-6117-"]:not(.ozs--banner):not(.ozs--has-header) {
    padding-top: 0 !important;
}
