/* colors */
html {
    --cl-main-dark: #22211f;
    --cl-main-dark-2: #31331f;
    --cl-main-light: #ebe5dc;
    --cl-main-light-2: #d5cdbc;
    --cl-secondary-dark: #455763;
    --cl-secondary-light: #919c9d;
    --cl-white-1: #ebe5dc;
    --cl-white-2: #ebe2da;
    --cl-white-3: #d6c9b4;
}

.bg-main-dark {
    background-color: var(--cl-main-dark);
}
.bg-secondary-dark {
    background-color: var(--cl-secondary-dark);
}

.text-main-light {
    color: var(--cl-main-light);
}
.text-main-light-2 {
    color: var(--cl-main-light-2);
}

.text-main-dark {
    color: var(--cl-main-dark);
}
.text-main-dark-2 {
    color: var(--cl-main-dark-2);
}

.text-white-1 {
    color: var(--cl-white-1);
}
.text-white-2 {
    color: var(--cl-white-2);
}
.text-white-3 {
    color: var(--cl-white-3);
}

.text-secondary-light {
    color: var(--cl-secondary-light);
}
.text-secondary-dark {
    color: var(--cl-secondary-dark);
}

.custom-tooltip {
    --bs-tooltip-bg: var(--bd-violet-bg);
    --bs-tooltip-color: var(--bs-white);
}

/* font */
* {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

/* bg gradient */
body {
    /* background: linear-gradient(-45deg, var(--cl-white-3), var(--cl-white-2), var(--cl-white-1)); */
    background: var(--cl-white-1);
    background-size: 200% 200%;
    /* animation: gradient 5s ease infinite; */
    height: 100vh;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

/* nav font styles */
#nav--menu li {
    font-size: 18px;
    font-weight: 500;
}

/* offices img animation */
#offices--section img {
    transition: 0.5s;
    &:hover {
        transform: scale(1.05);
    }
}

/* features img animation */
#features--section .service {
    transition: 0.5s;
    &:hover {
        transform: scale(1.03);
    }
}

/* pricing */
.check--yes {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg height='24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2344aa99' d='M9.707 19.121a.997.997 0 01-1.414 0l-5.646-5.647a1.5 1.5 0 010-2.121l.707-.707a1.5 1.5 0 012.121 0L9 14.171l9.525-9.525a1.5 1.5 0 012.121 0l.707.707a1.5 1.5 0 010 2.121z'/%3E%3C/svg%3E");
    height: 1.5rem;
    width: 1.5rem;
    display: block;
    margin: 0 auto;
    color: #44aa99;
}

.check--no {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg height='24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23bb7777' d='M18.364 5.636a1.5 1.5 0 00-2.121 0L12 9.879 7.757 5.636a1.5 1.5 0 00-2.121 2.121L9.879 12l-4.243 4.243a1.5 1.5 0 002.121 2.121L12 14.121l4.243 4.243a1.5 1.5 0 002.121-2.121L14.121 12l4.243-4.243a1.5 1.5 0 000-2.121z'/%3E%3C/svg%3E");
    height: 1.5rem;
    width: 1.5rem;
    display: block;
    margin: 0 auto;
}

/* wiki page */
/* .accordion--wrapper {
    z-index: 1020;
    height: fit-content;
} */

.icon--container {
    width: 30px;
    height: 30px;
}

.accordion {
    --bs-accordion-bg: rgba(248, 249, 250, 0.4);
    --bs-accordion-border-radius: 1rem;
    --bs-accordion-inner-border-radius: 1rem;
    --bs-accordion-active-bg: var(--cl-main-dark);
    --bs-accordion-active-color: var(--cl-main-light);
    --bs-accordion-btn-focus-box-shadow: none;
}

.accordion-button {
    font-weight: 500;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-body .btn.active {
    /* color: black !important;  */
    font-weight: bold;
}

/* btns */
.btn-outline-light {
    --bs-btn-color: var(--cl-main-light);
    --bs-btn-border-color: var(--cl-main-light);
}

.btn-outline-light:hover {
    --bs-btn-hover-color: var(--cl-main-dark);
    --bs-btn-hover-border-color: var(--cl-main-light);
    --bs-btn-hover-bg: var(--cl-main-light);
}

.btn-outline-dark {
    --bs-btn-color: var(--cl-main-dark);
    --bs-btn-border-color: var(--cl-main-dark);
}

.btn-outline-dark:hover {
    --bs-btn-hover-color: var(--cl-main-light);
    --bs-btn-hover-border-color: var(--cl-main-dark);
    --bs-btn-hover-bg: var(--cl-main-dark);
}

/* clients-section */
.clients-section img {
    height: 120px;
    width: 120px;
    object-fit: contain;
}

.swiper-button-prev,
.swiper-button-next {
    color: #333; /* колір стрілок */
    top: 40%; /* вертикальне вирівнювання */
}

.swiper-button-prev {
    left: -2px; /* вихід за межі контейнера */
}

.swiper-button-next {
    right: -2px; /* вихід за межі контейнера */
}