.anchor-block-slider {
    --abs-padding-v:            30px;
    --abs-padding-top:          var(--abs-padding-v);
    --abs-padding-bottom:       var(--abs-padding-v);
    --abs-max-width:            1440px;
    --abs-gap:                  20px;
    --abs-contained-padding-h:  30px;
    --abs-slider-indent-h: max(
        var(--abs-contained-padding-h),
        calc((100vw - var(--abs-max-width)) / 2 + var(--abs-contained-padding-h))
    );
    --abs-slot-w:               calc(100vw - 2 * var(--abs-slider-indent-h));
    --abs-peek:                 40px;
    --abs-card-radius:          8px;
    --abs-arrow-size:           28px;
    --abs-transition:           0.35s cubic-bezier(0.4, 0, 0.2, 1);
    --abs-img-height:           440px;
    --abs-img-height-tablet:    344px;
    --abs-img-height-mobile:    310px;
    --abs-bg:                   #ffffff;
    --abs-title-color:          #000000;
    --abs-btn-color:            #000000;
    --abs-arrow-filter:         none;
}

.anchor-block-slider.anchor-block-slider--dark {
    --abs-bg:           #000000;
    --abs-title-color:  #ffffff;
    --abs-btn-color:    #ffffff;
    --abs-arrow-filter: invert(1);
}

.anchor-block-slider {
    background-color:    var(--abs-bg);
    padding-block-start: var(--abs-padding-top);
    padding-block-end:   var(--abs-padding-bottom);
    padding-inline:      0;
    overflow:            visible;
    transition:          background-color var(--abs-transition);
}

.anchor-block-slider__inner {
    max-width:      100%;
    margin-inline:  auto;
    padding-inline: 0;
    box-sizing:     border-box;
}

.anchor-block-slider__inner--contained {
    max-width:      var(--abs-max-width);
    margin-inline:  auto;
    padding-inline: var(--abs-contained-padding-h);
    box-sizing:     border-box;
}

.anchor-block-slider__header {
    max-width:      var(--abs-max-width);
    margin-inline:  auto;
    padding-inline: var(--abs-contained-padding-h);
    box-sizing:     border-box;
}

.anchor-block-slider__title {
    font-size:      clamp(1.875rem, 4vw, 3.125rem);
    font-weight:    400;
    text-align:     center;
    margin:         0 0 1rem;
    color:          var(--abs-title-color);
    transition:     color var(--abs-transition);
}

.anchor-block-slider__subtitle {
    font-size:     1.0625rem;
    font-weight:   400;
    text-align:    center;
    color:         var(--abs-title-color);
    transition:    color var(--abs-transition);
    max-width:     860px;
    margin-inline: auto;
    margin-bottom: 2.5rem;
    line-height:   1.6;
}
.anchor-block-slider__subtitle p { margin: 0; }

.anchor-block-slider__viewport {
    margin-top:    2.5rem;
    overflow-x:    visible;
    overflow-y:    hidden;
    border-radius: 0;
}

.anchor-block-slider__track {
    display:                    flex;
    flex-wrap:                  nowrap;
    gap:                        var(--abs-gap);
    overflow-x:                 auto;
    scroll-behavior:            smooth;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x:      contain;
    scrollbar-width:            none;
    -ms-overflow-style:         none;
    padding-bottom:             4px;
    cursor:                     grab;
    user-select:                none;
    padding-inline-start:       var(--abs-slider-indent-h);
    padding-inline-end:         var(--abs-slider-indent-h);
}
.anchor-block-slider__track::-webkit-scrollbar { display: none; }
.anchor-block-slider__track.is-dragging        { cursor: grabbing; scroll-behavior: auto; }

.anchor-block-slider__controls {
    display:         flex;
    justify-content: center;
    align-items:     center;
    gap:             12px;
    margin-top:      2rem;
}

.anchor-block-slider__item--view-1 {
    flex:      0 0 calc(var(--abs-slot-w) - var(--abs-peek));
    min-width: 0;
}
.anchor-block-slider__item--view-2 {
    flex:      0 0 calc((var(--abs-slot-w) - var(--abs-gap) * 1 - var(--abs-peek)) / 2);
    min-width: 0;
}
.anchor-block-slider__item--view-3 {
    flex:      0 0 calc((var(--abs-slot-w) - var(--abs-gap) * 2 - var(--abs-peek)) / 3);
    min-width: 0;
}
.anchor-block-slider__item--view-4 {
    flex:      0 0 calc((var(--abs-slot-w) - var(--abs-gap) * 3 - var(--abs-peek)) / 4);
    min-width: 0;
}

.anchor-block-slider__card {
    display:                     block;
    position:                    relative;
    overflow:                    hidden;
    border-radius:               var(--abs-card-radius);
    block-size:                  var(--abs-img-height);
    background-color:            #1a1a1a;
    text-decoration:             none;
    -webkit-tap-highlight-color: transparent;
}
.anchor-block-slider__card:is(a):hover .anchor-block-slider__image,
.anchor-block-slider__card:is(a):focus-visible .anchor-block-slider__image {
    transform: scale(1.04);
}

.anchor-block-slider__image {
    display:         block;
    width:           100%;
    height:          100%;
    object-fit:      cover;
    object-position: center;
    transition:      transform 0.5s ease;
    will-change:     transform;
}

.anchor-block-slider__overlay {
    position:       absolute;
    inset:          0;
    background:     linear-gradient(to top, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.30) 35%, transparent 65%);
    display:        flex;
    align-items:    flex-end;
    padding:        1.25rem 1.5rem;
    pointer-events: none;
}

.anchor-block-slider__label {
    color:       #ffffff;
    font-size:   clamp(1.25rem, 1.25vw, 1.1875rem);
    font-weight: 600;
}

.anchor-block-slider__btn {
    display:                     inline-flex;
    align-items:                 center;
    justify-content:             center;
    width:                       44px;
    height:                      44px;
    padding:                     0;
    background:                  none;
    border:                      none;
    border-radius:               50%;
    cursor:                      pointer;
    flex-shrink:                 0;
    -webkit-tap-highlight-color: transparent;
    transition:                  opacity var(--abs-transition), transform 0.15s ease;
}
.anchor-block-slider__btn:hover:not(:disabled)  { opacity: 0.5; }
.anchor-block-slider__btn:active:not(:disabled) { transform: scale(0.9); }
.anchor-block-slider__btn:disabled              { opacity: 0.2; cursor: default; pointer-events: none; }
.anchor-block-slider__btn:focus-visible         { outline: 2px solid var(--abs-btn-color); outline-offset: 3px; }

.anchor-block-slider__arrow {
    display:        block;
    width:          var(--abs-arrow-size);
    height:         var(--abs-arrow-size);
    pointer-events: none;
    filter:         var(--abs-arrow-filter);
    transition:     filter var(--abs-transition);
    flex-shrink:    0;
    transform:      scaleX(-1);
}
.anchor-block-slider__btn--next .anchor-block-slider__arrow { transform: scaleX(1); }

@media (max-width: 1400px) {
    .anchor-block-slider { --abs-max-width: 1140px; }
}

@media (max-width: 1199px) {
    .anchor-block-slider__card {
        block-size: var(--abs-img-height-tablet);
    }
}

@media (max-width: 1024px) {
    .anchor-block-slider {
        --abs-max-width:           1440px;
        --abs-contained-padding-h: 40px;
    }
}

@media (max-width: 767px) {
    .anchor-block-slider {
        --abs-contained-padding-h: 20px;
        --abs-padding-v:           20px;
        --abs-padding-top:         var(--abs-padding-v);
        --abs-padding-bottom:      var(--abs-padding-v);
        --abs-gap:                 15px;
    }

    .anchor-block-slider__inner,
    .anchor-block-slider__inner--contained { padding-inline: 0; }

    .anchor-block-slider__viewport {
        overflow-x:    auto;
        overflow-y:    hidden;
        border-radius: 0;
        margin-top:    1.5rem;
    }

    .anchor-block-slider__track {
        padding-inline-start: 0;
        padding-inline-end:   0;
    }

    .anchor-block-slider__item--view-1,
    .anchor-block-slider__item--view-2,
    .anchor-block-slider__item--view-3,
    .anchor-block-slider__item--view-4 {
        flex:      0 0 calc((100% - var(--abs-gap) * 0.5) / 1.1);
        min-width: 0;
    }

    .anchor-block-slider__track {
        padding-inline-start: var(--abs-contained-padding-h) !important;
        padding-inline-end:   var(--abs-contained-padding-h) !important;
    }

    .anchor-block-slider__card {
        block-size: var(--abs-img-height-mobile);
    }

    .anchor-block-slider__label { font-size: 1.25rem; }

    .anchor-block-slider__controls { margin-top: 1.5rem; }
}

@media (max-width: 375px) {
    .anchor-block-slider__label { font-size: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
    .anchor-block-slider__track  { scroll-behavior: auto; }
    .anchor-block-slider__image,
    .anchor-block-slider__btn    { transition: none; }
}