/** Shopify CDN: Minification failed

Line 213:4 Unexpected "{"
Line 213:5 Expected identifier but found "%"
Line 215:5 Expected identifier but found "%"

**/
/*
 * ob-banner-slider.css
 * Shopify Horizon 4.1.1 Compatible
 */

/* Contenedor principal */
.ob-banner-slider-section .ob-slider {
  display: block;
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
  touch-action: pan-y pinch-zoom;
}

.ob-banner-slider-section .ob-slider__track {
  display: flex;
  width: 100%;
  transition: transform 0.5s ease-in-out;
  will-change: transform;
}

.ob-banner-slider-section .ob-slider__slide {
  flex: 0 0 100%;
  width: 100%;
  position: relative;
}

.ob-banner-slider-section .ob-slider__link {
  display: block;
  width: 100%;
  text-decoration: none;
}

.ob-banner-slider-section .ob-slider__picture {
  display: block;
  width: 100%;
}

.ob-banner-slider-section .ob-slider__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  max-width: 100%;
}

/* Accessibility */
.ob-banner-slider-section .ob-slider__slide{

    visibility:visible;

    pointer-events:auto;

}

/* Desktop Drag Cursor */
.ob-banner-slider-section.ob-slider--dragging {
  cursor: grabbing;
}

.ob-banner-slider-section.ob-slider--dragging .ob-slider__track {
  transition: none;
}

/*==============================================================
OB PAGINATION
==============================================================*/

.ob-slider__pagination{

    --ob-pagination-padding:12px;
    --ob-pagination-gap:8px;
    --ob-dot-size:8px;
    --ob-active-width:30px;
    --ob-active-height:8px;
    --ob-pagination-radius:999px;
    --ob-pagination-bottom:24px;

    position:absolute;
    left:50%;
    bottom:var(--ob-pagination-bottom);

    transform:translateX(-50%);

    display:flex;
    align-items:center;
    justify-content:center;

    gap:var(--ob-pagination-gap);
    padding:8px var(--ob-pagination-padding);
    border-radius:var(--ob-pagination-radius);

    z-index:20;

    background:color-mix(
        in srgb,
        var(--ob-pagination-bg) calc(var(--ob-pagination-bg-opacity) * 100%),
        transparent
    );

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

    transition:.30s ease;

}

/*----------------------------------*/
/* DOT */
/*----------------------------------*/

.ob-slider__dot{

    appearance:none;
    -webkit-appearance:none;

    border:none;
    outline:none;

    cursor:pointer;

    padding:0;
    margin:0;

    width:var(--ob-dot-size);
    height:var(--ob-dot-size);

    border-radius:50%;

    background:color-mix(
        in srgb,
        var(--ob-dot-color) calc(var(--ob-dot-opacity) * 100%),
        transparent
    );

    transition:
        width .28s ease,
        height .28s ease,
        border-radius .28s ease,
        background-color .28s ease;
}

/*----------------------------------*/
/* ACTIVE */
/*----------------------------------*/

.ob-slider__dot.is-active{

    width:var(--ob-active-width);
    height:var(--ob-active-height);

    border-radius:999px;

    background:color-mix(
        in srgb,
        var(--ob-active-color) calc(var(--ob-active-opacity) * 100%),
        transparent
    );

}

/*==============================================================
DESKTOP SCALE
==============================================================*/

@media screen and (min-width:750px){

    .ob-slider__pagination{
        scale:calc(var(--ob-pagination-size-desktop) / 100);
    }

    .ob-slider__pagination{
        left:50%;
        right:auto;
        transform:translateX(-50%);
    }

    .ob-slider__pagination[style*="--ob-position-desktop:left"]{
        left:24px;
        right:auto;
        transform:none;
    }

    .ob-slider__pagination[style*="--ob-position-desktop:center"]{
        left:50%;
        right:auto;
        transform:translateX(-50%);
    }

    .ob-slider__pagination[style*="--ob-position-desktop:right"]{
        right:24px;
        left:auto;
        transform:none;
    }

}

/*==============================================================
DESKTOP ARROW
==============================================================*/

@media screen and (min-width:750px){

    {% comment %}
    visibility
    {% endcomment %}

    .ob-slider__arrows{

        display:flex;

    }

    .ob-slider__arrow{

        width:var(--ob-arrow-desktop-width);

        height:var(--ob-arrow-desktop-height);

    }

    .ob-slider__arrow--prev{

        left:var(--ob-arrow-side);

    }

    .ob-slider__arrow--next{

        right:var(--ob-arrow-side);

    }

    .ob-slider__arrows:not(.ob-slider__arrows--desktop){

    display:none;

    }

}

.ob-slider__arrows{

    opacity:0;

    transition:.25s ease;

}

.ob-slider:hover .ob-slider__arrows{

    opacity:1;

}

/*==============================================================
MOBILE SCALE
==============================================================*/

@media screen and (max-width:749px){

    .ob-slider__pagination{
        bottom:18px;
        scale:calc(var(--ob-pagination-size-mobile) / 100);
    }

    .ob-slider__pagination{
        left:50%;
        right:auto;
        transform:translateX(-50%);
    }

    .ob-slider__pagination[style*="--ob-position-mobile:left"]{
        left:16px;
        right:auto;
        transform:none;
    }

    .ob-slider__pagination[style*="--ob-position-mobile:center"]{
        left:50%;
        right:auto;
        transform:translateX(-50%);
    }

    .ob-slider__pagination[style*="--ob-position-mobile:right"]{
        right:16px;
        left:auto;
        transform:none;
    }

}

/*==============================================================
MOBILE ARROW
==============================================================*/

@media screen and (max-width:749px){

    .ob-slider__arrow{

        width:var(--ob-arrow-mobile-width);

        height:var(--ob-arrow-mobile-height);

    }

    .ob-slider__arrow--prev{

        left:var(--ob-arrow-side);

    }

    .ob-slider__arrow--next{

        right:var(--ob-arrow-side);

    }

    .ob-slider__arrows{

    opacity:1;

    }

    .ob-slider__arrows:not(.ob-slider__arrows--mobile){

    display:none;

    }

}

/*==============================================================
ARROWS
==============================================================*/

.ob-slider__arrows{

    position:absolute;

    inset:0;

    z-index:40;

    pointer-events:none;

}

.ob-slider__arrow{

    position:absolute;

    top:var(--ob-arrow-top);

    transform:translateY(-50%);

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    pointer-events:auto;

    border:none;

    outline:none;

    padding:0;

    transition:
    background .25s ease,
    opacity .25s ease,
    transform .25s ease;

    border-radius:var(--ob-arrow-radius);

    background:color-mix(
        in srgb,
        var(--ob-arrow-bg)
        calc(var(--ob-arrow-bg-opacity) * 100%),
        transparent
    );

    color:color-mix(
        in srgb,
        var(--ob-arrow-color)
        calc(var(--ob-arrow-opacity) * 100%),
        transparent
    );

    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);

}

.ob-slider__arrow:hover{

    transform:
    translateY(-50%)
    scale(1.08);

    filter:brightness(1.08);

}

.ob-slider__arrow:active{

    transform:
    translateY(-50%)
    scale(.96);

}

.ob-slider__arrow svg{

    width:var(--ob-arrow-size);

    height:var(--ob-arrow-size);

    display:block;

}