:root {
    --scrollBarFonColor: #ff757c;
    --textColor: #3f2e1d;
    --borderColor: #3f2e1d;
    --accent: #ff757c;

    --maxWidthSwiper: 1120px;
}

.swiper{

    max-width: var(--maxWidthSwiper);
   
}


#reviews h2 {
    margin: 0;
}

/* Карточка */
.reviews_item {
    background: radial-gradient(120% 80% at 80% 0%, rgba(255, 195, 77, 0.12), transparent 40%), radial-gradient(120% 80% at 0% 20%, rgba(255, 90, 118, 0.1), transparent 45%);
    

    padding: 15px 15px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 22px;
    width: 500px !important;
}

/* Хедер карточки */
.reviews_item-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}

/* Аватар */
.avatarReview {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 72px;
}

/* Имя и звёзды */
.reviewer_item-name {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nameReviewsWrapper {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.nameReviewsWrapper h3,
.nameReviewsWrapper .defaultH3 {
    margin: 0;
    
}
.nameReviewsWrapper p {
   
    margin: 0;
    font-style: italic;
    opacity: 0.75;
}

/* Звёзды */
.reviewer_item-stars {
    display: flex;
    gap: 4px;
}
.reviewer_item-stars p {
    margin: 0;
    font-size: 20px;
    color: #ffc700;
}

/* Текст отзыва */
.reviews_item > .defaultP {
    
    margin: 0;
 
    line-height: 1.4;
}

/* Контейнер слайдов */
#reviews .swiper-slide {
    height: auto;
    display: flex;
    flex-direction: column;
    
}

/* Шапка секции (заголовок + стрелки) */
#reviews .reviews-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
   
}

/* Контейнер стрелок */
#reviews .reviews-nav {
    display: flex;
    align-items: center;
    gap: 12px;
        margin-bottom: 30px;
}


/* Кнопки-стрелки */
#reviews .rev-btn {
    width: 20px !important;
    aspect-ratio: 1;
    border-radius: 50%;
padding: 7px 17px;
    place-items: center;
    background: transparent;
    border: 1px solid #465362;
    color: #465362;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.2s;
   
}
#reviews .rev-btn::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(135deg); /* ← prev */
}
#reviews .rev-btn.next::before {
    transform: rotate(-45deg); /* → next */
}
#reviews .rev-btn:hover {
    transform: translateY(-1px);
}

/* Неактивная стрелка */
#reviews .rev-btn.is-disabled {
    opacity: 0.35;
    pointer-events: none;
}

/* Адаптив */

@media (max-width: 640px) {
    #reviews .reviews-nav {
        display: none;
    }

    .reviews_item {
        max-width: 80% !important;
    }


 
    
}

/* ===== Gallery (как Reviews, но крупнее) ===== */
#gallery .gallery-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* Кнопки-стрелки — те же, что в Reviews */
#gallery .gallery-nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

#gallery .gal-btn::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(135deg); /* ← prev */
}
#gallery .gal-btn.next::before {
    transform: rotate(-45deg); /* → next */
}
#gallery .gal-btn:hover {
    transform: translateY(-1px);
}
#gallery .gal-btn.is-disabled {
    opacity: 0.35;
    pointer-events: none;
}

/* Слайды — больше, чем отзывы */
#gallery .swiper-slide {
    height: auto;
    display: flex;
    flex-direction: column;
}
#gallery .gallery_item {
    width: 860px !important; /* ширина слайда (variable width) */
    height: 520px; /* высота на десктопе */
    border-radius: 24px;
    overflow: hidden;
}
#gallery .gallery_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Адаптив для крупного слайдера */
@media (max-width: 1440px) {
    #gallery .gallery_item {
        width: 760px !important;
        height: 500px;
    }
}
@media (max-width: 1200px) {
    #gallery .gallery_item {
        width: 680px !important;
        height: 460px;
    }
}
@media (max-width: 1024px) {
    #gallery .gallery_item {
        width: 600px !important;
        height: 420px;
    }
}
@media (max-width: 768px) {
    #gallery .gallery_item {
        width: 86vw !important;
        height: 340px;
        border-radius: 18px;
    }

    #reviews .swiper {
  
    padding-top: 0 !important;
     padding-left: 20px !important;
}

    #gallery .gal-btn {
        padding: 7px 17px !important;
    }

    /* #gallery .gallery-nav {
        display: none;
    } как и у reviews */
}

#gallery .gallery-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* Контейнер стрелок — как у reviews */
#gallery .gallery-nav {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 42px;
}

/* Кнопки — 1 в 1 как #reviews .rev-btn */
#gallery .gal-btn {
    width: 20px !important;
    aspect-ratio: 1;
    border-radius: 50%;

    /* центрирование и вид */
    place-items: center;
    background: rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.15);
    color: #474747;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.2s;
    padding: 13px 35px;
}
#gallery .gal-btn::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(135deg); /* ← prev */
}
#gallery .gal-btn.next::before {
    transform: rotate(-45deg); /* → next */
}
#gallery .gal-btn:hover {
    transform: translateY(-1px);
}

/* Состояние disabled — тот же класс */
#gallery .gal-btn.is-disabled {
    opacity: 0.35;
    pointer-events: none;
}

/* Мобилки: прячем стрелки, как в reviews */
/* @media (max-width: 640px) {
    #gallery .gallery-nav {
        display: none;
    }
} */
.swiperControls {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    /* height: 100%; */

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    z-index: 50;
}
/* .swiperControls .active {
    background: linear-gradient(
        to right,
        var(--red) 0%,
        var(--orangeDarker) 100%
    ) !important;
} */

.swiperControls .arrow-left,
.swiperControls .arrow-right {
    width: 52px;
    height: 52px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background-color: var(--ultraDark30);
    transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1);
    /* background: linear-gradient(
        to right,
        var(--red) 0%,
        var(--orangeDarker) 100%
    ); */
}
.swiperControls .arrow-left img,
.swiperControls .arrow-right img {
    height: 26%;
    object-fit: contain;
}
.swiperControls .arrow-left img {
    transform: translateX(-2px);
}
.swiperControls .arrow-right img {
    transform: translateX(-2px);
}
.swiperControls .arrow-right img {
    scale: -1 1;
}

.swiperControls .disabled {
    transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1);
    /* background: var(--blackDarker) !important; */
    opacity: 0.4;
}
@media (max-width: 1500px) {
    .swiperControls {
        width: 96vw;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
    }
}
@media (max-width: 768px) {
    .swiperControls {
        /* width: 88.5vw; */
        width: calc(86vw + (58 * ((100vw - 360px) / (768 - 360))));
    }
    .swiperControls .arrow-left,
    .swiperControls .arrow-right {
        width: 40px;
        height: 40px;
    }
    .swiperControls .arrow-left img,
    .swiperControls .arrow-right img {
        transform: translateX(-1px);
    }
}