/* Container Spacing */
.brand--slick-carousel .slick-list {
    margin: 0 auto;
    padding: 0 !important;
    width: 85%;
    overflow: hidden;
}


/* Individual Slide Wrapper */
.brand--slick-carousel .carousel-item {
    text-align: center;
    padding: 10px;
    outline: none;
    --tw-scale-x: 85%;
    --tw-scale-y: 85%;
    --tw-scale-z: 85%;
    scale: var(--tw-scale-x)var(--tw-scale-y);
    transition-property: all;
    --tw-duration: .5s;
    transition-duration: .5s;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
    opacity: .4;
    cursor: pointer;
}
.brand--slick-carousel .carousel-item.slick-current {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    scale: var(--tw-scale-x)var(--tw-scale-y);
    opacity: 1;
}
.brand--slick-carousel .carousel-item:hover {
    opacity: .7;
}
.brand--slick-carousel .carousel-item.slick-current:hover {
    opacity: 1;
}


/* The Circle Image Container */
.brand--slick-carousel .carousel-item picture {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin: 0 auto;
    width: calc(var(--spacing)*30);
    height: calc(var(--spacing)*30);
    border-radius: 3.40282e38px;
    background-color: var(--color-white);
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-shadow-color: color-mix(in oklab,oklab(55.7537% .134997 -.213369/.3) var(--tw-shadow-alpha),transparent);
    --tw-ring-color: #e5e5e5;
    --tw-brightness: brightness(75%);
    filter: var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,);    
    transition-property: all;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
    --tw-duration: .5s;
    transition-duration: .5s;
    overflow: hidden;
}
.brand--slick-carousel .carousel-item.slick-current picture {
    --tw-ring-color: #9333ea;
    --tw-brightness: brightness(100%);
}

.brand--slick-carousel .carousel-item picture img {
    width: calc(var(--spacing)*20);
    height: calc(var(--spacing)*20);
    object-fit: contain;
    --tw-grayscale: grayscale(0%);
    filter: var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,);
    transition-property: all;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
    --tw-duration: .7s;
    transition-duration: .7s;
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,);
}
.brand--slick-carousel .carousel-item.slick-current picture img {
    --tw-grayscale: grayscale(0%);
}
.brand--slick-carousel .carousel-item picture:hover img {
    --tw-scale-x: 110%;
    --tw-scale-y: 110%;
    --tw-scale-z: 110%;
    scale: var(--tw-scale-x)var(--tw-scale-y);
}


/* Typography */
.brand--slick-carousel .carousel-item h3 {
    margin-top: calc(var(--spacing)*4);
    font-size: var(--text-lg);
    line-height: var(--tw-leading,var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: #0a0a0a;
    opacity: 0;
}
.brand--slick-carousel .carousel-item.slick-current h3 {
    opacity: 1;
}

.brand--slick-carousel .carousel-item .description {
    margin-inline: auto;
    margin-top: calc(var(--spacing)*1);
    max-width: 160px;
    font-size: var(--text-xs);
    line-height: var(--tw-leading,var(--text-xs--line-height));
    color: #6a6a6a;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    opacity: 0;
}
.brand--slick-carousel .carousel-item.slick-current .description {
    opacity: 1;
}


/* Customizing Slick Arrows */
.brand--slick-carousel .slick-prev,
.brand--slick-carousel .slick-next {
    position: absolute;
    top: 50%;
    margin-top: calc(-1*(var(--spacing)*8 + 2*14px));
    padding: calc(var(--spacing)*6);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: #e5e5e5;
    border-radius: 3.40282e38px;
    background-color: color-mix(in oklab,var(--color-white)90%,transparent);
    font-size: 0;
    --tw-translate-y: -50%;
    translate: var(--tw-translate-x)var(--tw-translate-y);
    --tw-duration: .3s;
    transition-duration: .3s;
    transition-property: all;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
    --tw-backdrop-blur: blur(var(--blur-xl));
    -webkit-backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);
    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    cursor: pointer;
}
@media (max-width: 480px) {
    .brand--slick-carousel .slick-prev,
    .brand--slick-carousel .slick-next {
        padding: calc(var(--spacing)*4);
    }
}
.brand--slick-carousel .slick-prev:hover,
.brand--slick-carousel .slick-next:hover {
    --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color,#00000040);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    background-color: var(--color-white);
    border-color: #9333ea;
    --tw-scale-x: 110%;
    --tw-scale-y: 110%;
    --tw-scale-z: 110%;
    scale: var(--tw-scale-x)var(--tw-scale-y);
}
.brand--slick-carousel .slick-prev {
    left: 0;
}
.brand--slick-carousel .slick-next {
    right: 0;
}
@media (max-width: 480px) {
    .brand--slick-carousel .slick-prev {
        left: -10px;
    }
    .brand--slick-carousel .slick-next {
        right: -10px;
    }
}

.brand--slick-carousel .slick-prev:after,
.brand--slick-carousel .slick-next:after {
    display: block;
    position: relative;
    width: 10px;
    height: 10px;
    content: '';
    border-style: solid;
    border-color: #404040;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.brand--slick-carousel .slick-prev:hover:after,
.brand--slick-carousel .slick-next:hover:after {
    border-color: #9333ea;
}
.brand--slick-carousel .slick-prev:after {
    left: 2px;
    border-bottom-width: 2px;
    border-left-width: 2px;
}
.brand--slick-carousel .slick-next:after {
    right: 2px;
    border-top-width: 2px;
    border-right-width: 2px;
}


/* Customizing Slick Dots */
.brand--slick-carousel .slick-dots {
    gap: calc(var(--spacing)*2.5);
    display: flex;
    justify-content: center;
    margin-top: calc(var(--spacing)*8);
    list-style: none;
}

.brand--slick-carousel .slick-dots li button {
    width: calc(var(--spacing)*2);
    height: calc(var(--spacing)*2);
    border-radius: 3.40282e38px;
    background-color: #e5e5e5;
    font-size: 0;
    appearance: button;
    --tw-duration: .5s;
    transition-duration: .5s;
    transition-property: all;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
    cursor: pointer;
}
.brand--slick-carousel .slick-dots li button:hover {
    background-color: #9333ea80;
    width: calc(var(--spacing)*4);
}
.brand--slick-carousel .slick-dots li.slick-active button,
.brand--slick-carousel .slick-dots li.slick-active button:hover {
    width: calc(var(--spacing)*12);
    --tw-gradient-position: to right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
    --tw-gradient-from: #9333ea;
    --tw-gradient-stops: var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position));
    --tw-gradient-to: #a855f7;
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);
    box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);
    --tw-shadow-color: color-mix(in oklab,oklab(55.7537% .134997 -.213369/.3) var(--tw-shadow-alpha),transparent);
}