.history-sliders {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

@media (max-width: 576px) {
    .history-sliders {
        gap: 14px;
    }
}

.history-item {
    display: grid;
    grid-template-columns: 320px 1fr;
    max-height: inherit;
    height: 100%;
    position: relative;
    background: #F3F5F8;
    border-radius: 18px;
    overflow: hidden;
}

.history-item__quantity {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.history-item__quantity span:first-child {
    font-family: 'Intro Bold', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 44px;
    line-height: 50px;
    text-transform: uppercase;
    color: #BE3D3D;
}

.history-item__quantity span:last-child {
    font-family: 'Intro Book', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 120%;
    color: #2A2626;
    max-width: 120px;
}

.history-item__image {
    max-height: 480px;
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    overflow: hidden;
}

.history-item__image img {
    max-width: inherit;
    width: 100%;
    object-fit: contain;
    max-height: 530px;
}

.history-item__text,
.history-item__text p {
    font-family: 'Intro Book', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 120%;
    color: #2A2626;
}
.history-slider .swiper-wrapper {
    align-items: stretch;
    min-height: inherit;
}
.history-slider .swiper-slide {
    height: auto;
}
@media (max-width: 1200px) {
    .history-item__text,
    .history-item__text p {
        font-size: 16px;
        line-height: 145%;
    }
}

@media (max-width: 768px) {
    .history-item {
        grid-template-rows: minmax(100px, max-content) 1fr;
        grid-template-columns: 1fr;
    }
    div.history-item__data {
        order: 2;
        padding: 20px;
    }
    div.history-item__image {
        max-width: 100%;
        max-height: 345px;
        order: 1;
    }
    .history-item__image img {
        max-height: 350px;
    }
    div.history-item__text {
        font-size: 14px;
        line-height: 145%;
    }
    .history-item__quantity span:first-child {
        font-size: 36px;
        line-height: 44px;
    }
    .history-item__quantity span:last-child {
        font-size: 14px;
        line-height: 145%;
        max-width: 100%;
    }
}


@media (max-width: 576px) {
    div.history-item__image {
        max-height: 200px;
    }
    .history-item__image img {
        max-height: 220px;
    }
}

.history-item__data {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
    justify-content: space-between;
    height: 100%;
    padding: 34px 40px;
}



@media (max-width: 768px) {
    .stmd-page .history-slider-navigation {
        display: none !important;
    }
}

@media (max-width: 576px) {
    .history-wrapper .custom-section {
        padding: 20px 0 !important;
    }
}

/* THUMBS */
.history-years-thumbs-slider .history-year {
    font-family: 'Intro Bold', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 28px;
    line-height: 130%;
    color: #BE3D3D;
    text-transform: uppercase;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

@media (max-width: 1360px) {
    .history-years-thumbs-slider .history-year {
        font-size: 20px !important;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:after {
        width: calc(50% - 32px) !important;
    }
}

@media (max-width: 1280px) {
    .history-years-thumbs-slider .history-year {
        font-size: 18px !important;
        line-height: 130%;
    }
}

@media (max-width: 992px) {
    .history-years-thumbs-slider .swiper-slide-thumb-active.swiper-slide:not(:last-child) {
        margin-right: 40px !important;
    }
    .history-years-thumbs-slider .history-year:after {
        width: calc(50% + 45px) !important;
    }
}

@media (max-width: 768px) {
    .history-years-thumbs-slider.swiper {
        overflow: visible;
    }
}

.history-year__inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    position: relative;
}

@media (max-width: 576px) {
    .history-year__inner {
        gap: 14px;
    }
}

.history-years-thumbs-slider .history-circle {
    width: 8px;
    height: 8px;
    background: #BE3D3D;
    border-radius: 4px;
    position: relative;
    z-index: 2;
}

.history-years-thumbs-slider .history-year:before,
.history-years-thumbs-slider .history-year:after {
    content: '';
    width: calc(50% + 10px);
    position: absolute;
    height: 2px;
    bottom: 3px;
    background: #BE3D3D;
}
.history-years-thumbs-slider .history-year:before {
    left: 0;
    right: 50%;
}
.history-years-thumbs-slider .history-year:after {
    left: 50%;
    right: 0;
}

/* Убираем линии у первого и последнего слайда */
.history-years-thumbs-slider .swiper-slide:first-child .history-year:before {
   content: unset;
}
.history-years-thumbs-slider .swiper-slide:last-child .history-year:after {
    content: unset;
}
.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide:last-child .history-year:after {
    content: '' !important;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-year:before,
.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-year:after {
    background: #D9D9D9;
}
.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:before,
.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:after {
    background: #BE3D3D;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide:last-child .history-year:before {
    width: 50%;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:after {
    width: calc(50% - 35px);
}
.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide:last-child .history-year:after {
    width: calc(50% - 40px);
}
.history-years-thumbs-slider .swiper-slide-thumb-active.swiper-slide:last-child .history-year:before {
    width: 50%;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active .swiper-slide:last-child .history-year:after {
    width: calc(50% - 43px);
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide:not(:last-child) .history-year__inner:after {
    content: '';
    width: calc(50% + 10px);
    position: absolute;
    height: 2px;
    bottom: 3px;
    background: #D9D9D9;
    left: 50%;
    right: 0;
    z-index: 1;
}


.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide:hover .history-year {
    color: #BE3D3D !important;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide:hover .history-circle {
    background: #BE3D3D !important;
}


.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-year {
    color: #D9D9D9;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-circle {
    background: #D9D9D9;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide {
    margin-left: auto;
    flex-grow: 1;
}

.history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year {
    align-items: flex-end;
}


.history-years-thumbs-slider .swiper-slide {
    width: auto !important;
}

.history-year__inner {
    white-space: nowrap;
    padding: 0 10px;
}

@media (max-width: 768px) {
    .swiper-free-mode>.swiper-wrapper {
        margin-right: 20px !important;
    }
    .history-years-thumbs-slider .swiper-slide .history-year:before,
    .history-years-thumbs-slider .swiper-slide .history-year:after {
        background: #D9D9D9;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active .history-year:after,
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active .history-year:before,
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-year:before,
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-year:after {
        background: #BE3D3D;
    }
    .history-years-thumbs-slider .history-year {
        color: #D9D9D9;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-year,
    .history-years-thumbs-slider .swiper-slide-thumb-active .history-year {
        color: #BE3D3D;
    }
    .history-years-thumbs-slider .swiper-slide-thumb-active.swiper-slide:not(:last-child) {
        margin-right: 0 !important;
    }
    .history-years-thumbs-slider .swiper-slide-thumb-active.swiper-slide:not(:first-child) {
        margin-left: 40px !important;
    }
    .history-years-thumbs-slider .swiper-slide:last-child {
        margin-right: 0 !important;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:before,
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:after {
        background: #BE3D3D;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active .history-year:before{
        left: -130%;
        right: 0;
        width: 110px !important;
    }
    .history-years-thumbs-slider .swiper-slide:last-child.swiper-slide-thumb-active .history-year:before {
        left: -130%;
        right: 0;
        width: 110px !important;
    }
    .history-years-thumbs-slider .swiper-slide:last-child .history-year:after {
        content: unset!important;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-circle {
        background: #BE3D3D;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide:not(:last-child) .history-year__inner:after {
        width: calc(50% + 10px);
        background: #BE3D3D;
        left: 50%;
        right: 0;
    }
    .history-years-thumbs-slider.swiper .history-year:after {
        width: calc(50% + 34px) !important;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide .history-year:after {
        width: calc(50% - 35px);
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active + .swiper-slide:last-child .history-year:after {
        width: calc(50% - 40px);
    }

    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active .swiper-slide:last-child .history-year:after {
        width: calc(50% - 43px);
    }
    .history-years-thumbs-slider .history-circle {
        background: #D9D9D9;
    }
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active ~ .swiper-slide .history-circle,
    .history-years-thumbs-slider .swiper-slide.swiper-slide-thumb-active .history-circle {
        background: #BE3D3D;
    }

}