@font-face {
    font-family: "Inter";
    src: url("../assets/fonts/Inter-Regular.eot");
    src: url("../assets/fonts/Inter-Regular.eot?#iefix")
            format("embedded-opentype"),
        url("../assets/fonts/Inter-Regular.woff2") format("woff2"),
        url("../assets/fonts/Inter-Regular.woff") format("woff"),
        url("../assets/fonts/Inter-Regular.ttf") format("truetype"),
        url("../assets/fonts/Inter-Regular.svg#Inter-Regular") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("../assets/fonts/Inter-SemiBold.eot");
    src: url("../assets/fonts/Inter-SemiBold.eot?#iefix")
            format("embedded-opentype"),
        url("../assets/fonts/Inter-SemiBold.woff2") format("woff2"),
        url("../assets/fonts/Inter-SemiBold.woff") format("woff"),
        url("../assets/fonts/Inter-SemiBold.ttf") format("truetype"),
        url("../assets/fonts/Inter-SemiBold.svg#Inter-SemiBold") format("svg");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("../assets/fonts/Inter-Medium.eot");
    src: url("../assets/fonts/Inter-Medium.eot?#iefix")
            format("embedded-opentype"),
        url("../assets/fonts/Inter-Medium.woff2") format("woff2"),
        url("../assets/fonts/Inter-Medium.woff") format("woff"),
        url("../assets/fonts/Inter-Medium.ttf") format("truetype"),
        url("../assets/fonts/Inter-Medium.svg#Inter-Medium") format("svg");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "NewYork";
    src: url("../assets/fonts/NewYork.eot");
    src: url("../assets/fonts/NewYork.eot?#iefix") format("embedded-opentype"),
        url("../assets/fonts/NewYork.woff2") format("woff2"),
        url("../assets/fonts/NewYork.woff") format("woff"),
        url("../assets/fonts/NewYork.ttf") format("truetype"),
        url("../assets/fonts/NewYork.svg#NewYork") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Montserrat";
    src: url("../assets/fonts/Montserrat-Regular.eot");
    src: url("../assets/fonts/Montserrat-Regular.eot?#iefix")
            format("embedded-opentype"),
        url("../assets/fonts/Montserrat-Regular.woff2") format("woff2"),
        url("../assets/fonts/Montserrat-Regular.woff") format("woff"),
        url("../assets/fonts/Montserrat-Regular.ttf") format("truetype"),
        url("../assets/fonts/Montserrat-Regular.svg#Montserrat-Regular")
            format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    -webkit-text-size-adjust: 100%;
    scrollbar-width: thin;
}

li {
    list-style: none;
}

a {
    text-decoration: none;
    color: rgba(255, 255, 255, 0.65);
    font-family: "Inter";
}

img {
    object-fit: cover;
    -o-object-fit: cover;
}

body {
    font-family: "Montserrat";
    font-weight: normal;
    font-size: 1rem;
    line-height: 100%;
}
:root {
    --main-oxra: #aa8e72;
    --primary-white: #ffffff;
    --primary-padding: 5.556vw;
    --site-black: #191919;
    --site-secondary-black: #121212;
    --site-black-lighter: #1e1e1e;
    --link_white: rgba(255, 255, 255, 0.65);
}

.site_footer {
    background-color: var(--site-secondary-black);
    padding-top: 3rem;
    padding-bottom: 2.313rem;
}

.footer_top_wrapper .footer_links_nav {
    display: flex;
    align-items: start;
    flex-wrap: wrap;
    gap: 11.944vw;
}

.footer_top_wrapper .footer_links_nav a {
    font-family: "Inter";
    font-weight: 400;
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.65);
    line-height: 200%;
    transition: 0.3s;
}
.footer_top_wrapper .footer_links_nav a:hover {
    opacity: 0.3;
    text-decoration: underline;
}
.site_footer .nav_item_wrapper .footer_nav_item_title {
    font-size: 1.063rem;
    line-height: 200%;
    color: var(--primary-white);
}

.custom_container {
    max-width: 1440px;
    margin-inline: auto;
    padding-inline: var(--primary-padding);
}

.separator {
    border-top: 0.063rem solid rgba(255, 255, 255, 0.07);
}

.footer_bottom_wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    gap: 1.25rem;
}
.footer_bottom_wrapper .social_list {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.footer_bottom_wrapper svg {
    width: 1.375rem;
    height: 1.375rem;
}
.footer_bottom_wrapper .social_list a {
    background: #232323;
    border-radius: 50%;
    padding: 0.563rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.footer_bottom_wrapper .footer_rights_info {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.5);
}

.site_footer .separator {
    margin-top: 2rem;
    margin-bottom: 1.25rem;
}

/* site-header */

.site_header {
    background-color: var(--site-black);
    padding-block: 1rem;
}

.site_header .custom_container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
}

.site_header .burger_icon {
    display: none;
    width: max-content;
    height: max-content;
}
.site_header .burger_icon svg {
    width: 2rem;
    height: 2rem;
}
.header-nav_switch_wrapper {
    display: flex;
    align-items: center;
    gap: 2.5rem;
    transition: 0.4s;
}
.site_header .header_logo {
    width: 104px;
    height: 33px;
}

.site_header .header_logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    -o-object-fit: contain;
    object-position: left;
}

.site_header .language_switcher svg {
    width: 10px;
    height: 8px;
}

.site_header .phone_number_switcher svg {
    width: 12px;
    height: 6px;
}

.header_nav .header_nav_list {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.header_nav_list .header_nav_item a,
.phone_number_switcher a {
    transition: 0.3s;
}
.header_nav_list .header_nav_item a:hover,
.phone_number_switcher a:hover {
    opacity: 0.3;
}

.header_switcher_wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.header_switcher_wrapper .language_switcher {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.header_switcher_wrapper .language_switcher span {
    color: var(--primary-white);
}

.header_switcher_wrapper .phone_number_switcher {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.header_switcher_wrapper .phone_number_switcher .arrow_top_down_holder {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.header_switcher_wrapper .arrow_top_down_holder .arrow_up,
.header_switcher_wrapper .arrow_top_down_holder .arrow_down {
    height: 0.6rem;
    display: flex;
    align-items: center;
}

/* home page styles */
.page_home .home_container .swiper-container {
    background-color: var(--site-black);
}

.page_home .home_container.swiper-container {
    height: 80vh;
    width: 100%;
}

.page_home .swiper-slide {
}
.page_home .home_container .swiper-slide img {
    width: 100%;
    height: 100%;
    filter: brightness(0.5);
}

.home_swiper_slide {
    position: relative;
    height: 40vw;
    width: 100vw;
}
.home_swiper_slide .slider_abso_img {
    height: 100%;
    width: 100%;
}
.slider_content_wrapper {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0.6rem;
    position: absolute;
    left: 12.083vw;
    top: 50%;
    transform: translateY(-50%);
}

.slider_content_wrapper .slider_subtitle {
    font-size: 0.875rem;
    color: var(--main-oxra);
    font-family: "NewYork";
    font-weight: normal;
}

.slider_content_wrapper .slider_title {
    font-size: 2.5rem;
    color: var(--primary-white);
    line-height: 115%;
}

.slider_content_wrapper .slider_description {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.938rem;
}

.slider_content_wrapper .slider_content_btn {
    border: none;
    outline: none;
    border-radius: 0.313rem;
    padding: 1.25rem 2.688rem;
    width: 100%;
    min-width: 10.438rem;
    max-width: max-content;
    cursor: pointer;
    text-align: center;
}

.slider_item_button_wrapper {
    display: flex;
    align-items: center;
    gap: 0.438rem;
    margin-top: 1rem;
}

.slider_content_wrapper .slider_content_btn span {
    font-size: 0.875rem;
    font-weight: 500;
}
.slider_content_wrapper .slider_item_btn_left {
    background-color: var(--main-oxra);
    border: 0.063rem solid var(--main-oxra);
}
.slider_content_wrapper .slider_item_btn_right {
    border: 0.063rem solid var(--primary-white);
    background-color: transparent;
}
.slider_content_btn,
.view_all_massages_btn,
.view_all_staff_btn {
    transition: 0.3s;
}
.view_all_massages_btn:hover,
.view_all_staff_btn:hover {
    opacity: 0.3;
}
.slider_content_btn:hover {
    scale: 0.9;
}

.slider_content_wrapper .slider_item_btn_left span {
    color: #121212;
}

.slider_content_wrapper .slider_item_btn_right span {
    color: var(--primary-white);
}

.swiper-container {
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.swiper-container .swiper-wrapper {
    width: max-content;
    height: 100%;
    display: flex;
}
.swiper-wrapper .swiper-slide {
    overflow: hidden;
}

.swiper-button-prev,
.swiper-button-next {
    position: absolute;
    top: calc(50% - 24px);
    transform: translateY(-50%);
    z-index: 100;
    background: rgb(70, 68, 69);
    outline: none;
    border: none;
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    cursor: pointer;
}
.swiper-button-prev svg,
.swiper-button-next svg {
    width: 8px;
    height: 12px;
}

.swiper-button-prev {
    left: 20px;
}
.swiper-button-next {
    right: 20px;
}

.massages_types_wrapper {
    background-color: var(--site-secondary-black);
    padding-top: 3rem;
    padding-bottom: 3rem;
    padding-inline: var(--primary-padding);
}

.massages_types_title_wrapper,
.services_types_title_wrapper,
.staff_title_wrapper,
.esthetic_videos_title_wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem;
}

.massages_types_title_wrapper h2,
.services_types_title_wrapper h2,
.add_service_title_wrapper h2,
.staff_title_wrapper h2,
.esthetic_title_wrapper h2,
.comfort_convenience_title h2,
.reviews_wrapper .reviews_title h2,
.main_faq_title h2,
.esthetic_videos_title_wrapper h2 {
    color: var(--main-oxra);
    font-size: 1.25rem;
    font-family: "Inter";
    font-weight: 600;
}

.massages_desc_title h2 {
    font-family: "Montserrat";
    color: var(--main-oxra);
}
.page_description {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 2.5rem;
}

.page_description p {
    font-size: 1rem;
    max-width: 100%;
    margin-inline: auto;
    text-align: start;
    color: var(--primary-white);
    line-height: 120%;
    font-weight: 400;
}

.page_description p:first-of-type {
    margin-top: 2rem;
}

.page_description p {
    margin-bottom: 1rem;
}

.massages_types_title_wrapper a,
.staff_title_wrapper a,
.services_types_title_wrapper a,
.esthetic_videos_title_wrapper a {
    color: var(--primary-white);
    font-size: 0.875rem;
    font-family: "Inter";
    font-weight: 500;
}

.massages_slide_wrapper,
.services_slide_wrapper,
.add_services_card_wrapper {
    margin-top: 1.5rem;
}

.massages_slide_wrapper .massage_slide_image_wrapper,
.add_card_image_wrapper {
    width: 19.0625rem;
    max-width: 19.0625rem;
    height: 164px;
    overflow: hidden;
    position: relative;
    transition: 0.3s;
}
@media (max-width: 31.25rem) {
    .massages_slide_wrapper .massage_slide_image_wrapper,
    .add_card_image_wrapper {
        width: 100%;
        max-width: 100%;
    }
}
.massages_slide_wrapper .massages_swiper_slide,
.services_swiper_slide {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: 0.3s;
}
.massages_slide_wrapper .massages_swiper_slide .massage_image,
.add_card_image_wrapper .card_image {
    transition: 0.3s;
}

.massages_slide_wrapper .massages_swiper_slide .massage_image:hover,
.add_card_image_wrapper .card_image:hover {
    transform: scale(1.3);
}
.massage_slide_content_wrapper svg,
.service_slide_content_wrapper svg,
.add_service_card_hours svg {
    width: 1rem;
    height: 1rem;
}

.massage_slide_content_wrapper,
.service_slide_content_wrapper,
.add_card_content_wrapper {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0.875rem;
}

.massage_slide_content_wrapper
    .massage_slide_title_wrapper
    .massage_slide_title,
.service_slide_content_wrapper
    .service_slide_title_wrapper
    .service_slide_title,
.add_card_content_wrapper .add_card_title_wrapper .add_service_title {
    color: var(--primary-white);
    font-size: 0.875rem;
    font-weight: 600;
}

.massage_slide_info .massage_slide_hours_wrapper,
.service_slide_info .service_slide_hours_wrapper,
.add_card_hours_wrapper {
    display: flex;
    align-items: center;
    gap: 1.125rem;
}
.massage_slide_hours_wrapper .massage_slide_hours,
.service_slide_hours_wrapper .service_slide_hours,
.add_card_hours_wrapper .add_service_card_hours {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.massage_slide_hours .massage_slide_hours_info,
.service_slide_hours .service_slide_hours_info,
.add_service_card_hours .add_card_hours_info {
    color: var(--primary-white);
}

.massage_slide_hours_wrapper .massage_slide_price,
.service_slide_hours_wrapper .service_slide_price,
.add_card_hours_wrapper .add_card_price {
    color: var(--primary-white);
    display: flex;
    align-items: center;
    gap: 0.2rem;
}

.page_home .swiper-wrapper .swiper-slide,
.page_home .swiper {
    overflow: hidden;
}
.spa_services_wrapper {
    padding-inline: var(--primary-padding);
    padding-block: 3rem;
    background-color: var(--site-black-lighter);
}

.additionals_service_wrapper {
    padding-inline: var(--primary-padding);
    padding-block: 3rem;
    background-color: var(--site-secondary-black);
}

.swiper-services .services_slide_image_wrapper {
    overflow: hidden;
    position: relative;
    transition: 0.3s;
    height: 296px;
}
.swiper-services .services_slide_image_wrapper img {
    height: 100%;
    max-width: 25.813rem;
    height: 100%;
    transition: transform 0.3s ease;
}
.swiper-services .services_slide_image_wrapper img:hover {
    transform: scale(1.3);
}

.add_services_card_wrapper {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 1rem;
}
.add_service_cards_wrapper .add_card_image_wrapper .card_image {
    height: 100%;
    max-height: 10.25rem;
    width: 19rem;
    max-width: 19rem;
}

.add_service_cards_wrapper .add_service_cards {
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 1.25rem;
    flex-wrap: wrap;
    width: 100%;
}

.staff_wrapper {
    padding-inline: var(--primary-padding);
    padding-block: 3rem;
    background-color: var(--site-secondary-black);
}
.staff_wrapper .swiper-container {
    margin-top: 1.5rem;
}

.staff_slide_image_wrapper {
    height: 562px;
    position: relative;
    overflow: hidden;
}
.staff_slide_image_wrapper .staff_image {
    height: 100%;
    transition: 0.3s;
}

.staff_slide_image_wrapper .staff_image:hover {
    transform: scale(1.3);
}

.inner-swiper .swiper-wrapper {
    display: flex;
}

.inner-swiper .swiper-slide {
    width: 100%;
    flex-shrink: 0;
}

.inner-swiper {
    height: 200px; /* or whatever height you want */
}

.staff_slide_content_wrapper {
    margin-top: 1.688rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.staff_slide_title_wrapper .staff_slide_title {
    font-size: 1.25rem;
    color: var(--primary-white);
}

.staff_person_info_wrapper {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.65);
}

/* faq styles start */

.faq-container {
    max-width: 100%;
    margin: auto;
}

.faq-item {
    background: var(--site-secondary-black);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    overflow: hidden;
    transition: all 0.3s ease;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    cursor: pointer;
    font-weight: bold;
    user-select: none;
}

.faq-question p {
    font-size: 1rem;
    color: var(--primary-white);
    font-weight: 500;
    transition: 0.3s;
}
.faq-question p:hove {
    opacity: 0.3;
}
.faq-answer p {
    font-size: 0.875rem;
    color: var(--primary-white);
}
.faq-arrow {
    transition: transform 0.3s ease;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 1rem;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

.faq-item.active .faq-answer {
    max-height: 500px;
    padding-bottom: 1rem;
}

.faq-item.active .faq-arrow {
    transform: rotate(90deg);
}

.esthetic_content_right .faq-container svg {
    width: 14px;
    height: 12px;
}
/* faq styles end */

.esthetic_medicine_wrapper {
    padding-inline: var(--primary-padding);
    background-color: var(--site-secondary-black);
    padding-top: 1rem;
    padding-bottom: 3.813rem;
}

.esthetic_content_wrapper {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7.5vw;
}

.esthetic_content_left {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 1.25rem;
    width: 40%;
    max-width: 484px;
}
.esthetic_content_right {
    width: 60%;
}

.esthetic_doctor_name {
    width: 100%;
    text-align: center;
}
.esthetic_doctor_name span {
    font-weight: 500;
    font-size: 1rem;
    color: var(--primary-white);
}
.esthetic_content_left img {
    width: 100%;
    height: 548px;
    object-position: top;
}

.comfort_convenience_wrapper {
    padding-inline: var(--primary-padding);
    padding-bottom: 2rem;
    background-color: var(--site-secondary-black);
}

.comfort_convenience_wrapper .comfort_convenience_title {
    margin-top: 2rem;
}

.comforts_cards_wrapper {
    margin-top: 1.75rem;
}

.comforts_cards_wrapper svg {
    width: 1.75rem;
    height: 1.75rem;
}

.comforts_cards_wrapper .comforts_card {
    display: flex;
    align-items: start;
    gap: 0.75rem;
    width: 100%;
    max-width: 19rem;
    transition: 0.3s;
}
.comforts_cards_wrapper .comforts_card:hover {
    scale: 1.1;
}

.comfort_convenience_wrapper .comforts_cards_wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(304px, 1fr));
    gap: 3rem 6.5rem;
    max-width: 100%;
}

.comforts_cards_wrapper .card_content {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0.75rem;
    margin-top: 0.5rem;
}
.comforts_cards_wrapper .card_content .comfort_card_title {
    color: var(--primary-white);
    font-weight: 600;
    font-size: 0.875rem;
}
.comforts_cards_wrapper .card_content .comfort_card_description {
    color: rgba(255, 255, 255, 0.65);
    font-weight: 400;
    font-size: 0.875rem;
}

.rest_rooms_wrapper {
    padding-inline: var(--primary-padding);
    background-color: var(--site-secondary-black);
}

.rooms_cards_wrapper {
    margin-top: 2rem;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1.25rem;
    width: 100%;
    flex-wrap: wrap;
}

.rooms_cards_wrapper svg {
    width: 0.875rem;
    height: 0.875rem;
}

.rooms_cards_wrapper .room_card {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: max-content;
}
.rooms_cards_wrapper .room_card > img {
    width: 23rem;
    height: 22.75rem;
    max-width: 23rem;
}
.rooms_cards_wrapper .room_card_content {
    position: absolute;
    bottom: 0;
    left: 1rem;
    right: 1rem;
    bottom: 1.438rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 2rem);
}
.rooms_cards_wrapper .room_card_content a {
    color: var(--primary-white);
    font-size: 1.25rem;
    text-decoration: underline;
    transition: 0.3s;
}
.rooms_cards_wrapper .room_card_content a:hover {
    scale: 1.1;
}
.reviews_wrapper {
    background-color: var(--site-secondary-black);
    padding-inline: var(--primary-padding);
    padding-top: 3rem;
}

.reviews_cards_wrapper {
    margin-top: 1.5rem;
}

.reviews_cards_wrapper .review_card {
    background-color: var(--site-black);
    width: 100%;
    max-width: 25.813rem;
    padding-inline: 0.75rem;
    padding-top: 1.25rem;
    padding-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 1rem;
    transition: 0.3s;
}
.reviews_cards_wrapper .review_card:hover {
    scale: 1.2;
}

.reviews_cards_wrapper .review_card .separator {
    width: 100%;
}
.review_card .review_card_user {
    display: flex;
    justify-content: start;
    gap: 0.75rem;
    align-items: center;
}
.review_card .review_user_info {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0.375rem;
}
.review_card .review_user_info .user_name {
    font-size: 0.875rem;
    color: var(--primary-white);
    font-weight: 500;
}

.review_card .review_user_info .stars {
    width: 132px;
    height: 14px;
    object-fit: cover;
}
.review_card .review_card_user .user_pic {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
}

.review_card .review_description {
    font-size: 0.875rem;
    color: var(--primary-white);
    font-weight: 500;
}

.reviews_cards_wrapper {
    display: flex;
    flex-direction: row;
    justify-content: start;
    gap: 1.25rem;
    flex-wrap: wrap;
    width: 100%;
}

.main_faq_wrapper {
    padding-inline: var(--primary-padding);
    background-color: var(--site-secondary-black);
    padding-block: 3rem;
}

/* main faq styles start */
.main-faq {
    width: 100%;
    margin-top: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0.5rem;
}

.main-faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 0.7rem 1rem;
    font-weight: 600;
    color: var(--primary-white);
    font-size: 0.938rem;
    transition: background 0.3s;
    background-color: var(--site-black);
    border-radius: 0.25rem;
}

/* .main-faq-question:hover {
  background: #f9f9f9;
} */

.main-faq-icon {
    font-size: 2rem;
    font-weight: 300;
    transition: transform 0.3s;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    padding: 0.3rem;
    color: var(--site-black);
}

.main-faq-answer {
    max-height: 0;
    opacity: 0;
    transform: translateY(-10px);
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.4s ease, transform 0.4s ease,
        padding 0.3s ease;
    padding: 0 1rem;
    background-color: var(--site-black);
}
.main-faq-answer p {
    color: var(--primary-white);
    font-weight: 400;
    font-size: 14px;
}
.main-faq-item {
    width: 100%;
}
.main-faq-item.active .main-faq-answer {
    max-height: 300px;
    padding-bottom: 1rem;
    max-height: 300px;
    opacity: 1;
    transform: translateY(0);
    padding: 0.2rem 1rem;
}

.main-faq-item.active .main-faq-icon {
    content: "-";
    transform: rotate(180deg);
}

/* main faq styles end */

.site_map_wrapper {
    background-color: var(--site-black);
    padding-inline: var(--primary-padding);
    padding-block: 3rem;
}
.site_map_frame_wrapper {
    display: flex;
    justify-content: center;
}
.site_map_frame_wrapper p {
    width: 65%;
}

/* Page styles start */
.single_page {
    padding-inline: var(--primary-padding);
    background-color: var(--site-secondary-black);
    padding-block: 2rem;
}

.single_page .massages_types_wrapper,
.single_page .staff_wrapper,
.single_page .spa_services_wrapper,
.single_page .additionals_service_wrapper,
.single_page .rest_rooms_wrapper {
    padding-inline: unset;
    padding-top: 2rem;
    padding-bottom: 2rem;
    background-color: var(--site-secondary-black);
}

.single_page_title {
    margin-top: 3rem;
}

.single_page_title h1 {
    text-align: center;
    font-size: 24px;
    color: var(--main-oxra);
}

.breadcrumbs_wrapper .breadcrumbs_list {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    gap: 0.5rem;
}
.breadcrumbs_list .breadcrumbs_item a {
    font-size: 0.875rem;
    color: var(--primary-white);
    font-weight: 500;
    text-decoration: underline;
}

.breadcrumbs_list .breadcrumbs_item_active span {
    font-size: 0.875rem;
    color: var(--main-oxra);
    font-weight: 500;
}

.breadcrumbs_wrapper svg {
    width: 10px;
    height: 12px;
}

.single_page .swiper {
    width: 100%;
}
/* Page styles end */

/* Contact page start */
.contact_page_wrapper {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
    padding-bottom: 3rem;
    width: 100%;
}

.input_wraper {
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 100%;
    gap: 0.5rem;
}

.input_wraper label {
    font-size: 0.875rem;
    color: var(--main-oxra);
    font-family: "Inter";
    font-weight: 500;
}
.input_wraper input,
.input_wraper textarea {
    width: 100%;
    outline: none;
    border: none;
    padding: 1rem;
    border-radius: 0.25rem;
    border: 2px solid var(--main-oxra);
}
.input_wraper textarea {
    resize: none;
    width: 100%;
    height: 10rem;
}
.contact_page_form {
    width: 100%;
    max-width: 600px;
}
.contact_page_wrapper form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.single__page .site_footer {
    background-color: var(--site-black-lighter);
}

.esthetic_videos_wrapper {
    margin-top: 3rem;
}

.videos_card_wrapper {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    justify-content: center;
}
.videos_card_wrapper .video_card {
    width: 100%;
    max-width: 21.875rem;
}

.videos_card_wrapper video {
    width: 100%;
}

.contact_btn {
    color: black;
    background-color: var(--main-oxra);
    border: 0.063rem solid var(--main-oxra);
    padding: 1rem;
    border-radius: 0.25rem;
    width: 100%;
    font-size: 1rem;
    font-family: "Montserrat";
    text-align: center;
    cursor: pointer;
    font-weight: 500;
}

.add_card_content_wrapper {
    max-width: 19rem;
}

.page-16 .page_description p:first-of-type,
.page-19 .page_description p:first-of-type {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 1.25rem;
    justify-content: center;
    margin-bottom: 25px;
}
.page-16 .page_description,
.page-19 .page_description {
    margin-top: 0;
}
.page-16 .page_description p:first-of-type img,
.page-19 .page_description p:first-of-type img {
    width: 225px;
    height: 250px;
}

.page-22 .page_description {
    margin-top: 0;
}

.page-22 .page_description p:first-of-type {
    margin-top: 0;
}

.massages_slide_wrapper .massages_swiper_slide .massage_image {
    width: 100%;
    height: 100%;
}

.massage_slide_content_wrapper {
    width: 100%;
    max-width: 19.0625rem;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
    border: none !important;
    color: #aa8e72 !important;
}

.page-7 .page_description {
    margin-top: 0 !important;
}
.page-7 .page_description p:nth-child(2) {
    margin-top: 28px;
}
.page-7 .page_description p:first-of-type {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
    gap: 20px;
}
.loadMoreBtn,
.loadMoreVideoBtn {
    color: black;
    outline: none;
    border-radius: 0.313rem;
    padding: 1.25rem 2.688rem;
    width: 100%;
    min-width: 10.438rem;
    font-size: 16px;
    max-width: max-content;
    cursor: pointer;
    text-align: center;
    background-color: var(--main-oxra);
    border: 0.063rem solid var(--main-oxra);
    margin-top: 25px;
    display: flex;
    justify-content: center;
    margin-inline: auto;
}

.page-gallery,
.page-video {
    padding-block: 24px !important;
}
.pricelist-title-wrapper.title-wrapper {
    margin-top: 32px;
}

.gallery-title-wrapper {
    margin-top: 32px;
}

/* Contact page end */

@media (max-width: 1200px) {
    .rooms_cards_wrapper {
        align-items: center;
        justify-content: center;
    }
}
@media (max-width: 1024px) {
    .site_map_frame_wrapper p {
        width: 100%;
    }
    .site_header {
        position: relative;
    }
    .header-nav_switch_wrapper {
        display: block;
        transition: 0.4s;
    }
    .site_header .burger_icon {
        display: block;
        cursor: pointer;
    }

    .site_header .custom_container {
        justify-content: space-between;
    }

    .site_header .header_nav .header_nav_list {
        gap: 2rem;
    }

    .site_header .header-nav_switch_wrapper {
        position: absolute;
        top: 4.25rem;
        z-index: 1000;
        background-color: var(--site-black-lighter);
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        align-items: start;
        left: -100%;
        transform: translateX(-100%);
        transition: 0.3s;
        width: 50%;
        min-width: 15.625rem;
        height: 100vh;
        transition: 0.4s;
    }

    .site_header.active .header-nav_switch_wrapper {
        left: 0;
        transform: translateX(0);
        transition: 0.4s;
    }
    .site_header .header_nav_list {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .esthetic_content_wrapper {
        flex-direction: column;
        gap: 3rem;
    }
    .esthetic_content_left,
    .esthetic_content_right {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .add_service_cards {
        justify-content: center;
    }
}

@media (max-width: 420px) {
    .rooms_cards_wrapper .room_card img {
        width: 100%;
    }
    .rooms_cards_wrapper .room_card {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .home_container .swiper-wrapper .swiper-slide,
    .home_container .swiper {
        height: calc(100vh - 68px) !important;
    }
    .add_service_cards_wrapper .add_card_image_wrapper .card_image,
    .add_services_card_wrapper,
    .add_card_image_wrapper {
        width: 100%;
    }

    .add_card_image_wrapper {
        justify-content: center;
        display: flex;
    }
    .slider_content_wrapper {
        top: 80%;
        left: 2.5rem;
        right: 2.5rem;
    }
    .slider_content_wrapper .slider_content_btn {
        padding: 1rem;
        min-width: unset;
        max-width: none;
    }
    .massage_slide_content_wrapper,
    .service_slide_content_wrapper,
    .add_card_content_wrapper,
    .add_services_card_wrapper {
        align-items: center;
    }
    .staff_slide_content_wrapper {
        display: flex;
        align-items: center;
        gap: 0.4rem;
    }
    .faq-question p {
        padding: 0.063rem;
    }
}
/* ome page styles */

@media (max-width: 44.25rem) {
    .add_service_cards_wrapper .add_service_cards {
        justify-content: center;
    }

    .page-10 .page_description {
        margin-top: 0;
    }
    .page-10 .site_footer,
    .page-7 .site_footer,
    .page-13 .site_footer,
    .page-25 .site_footer {
      padding-top: 0;
    }

  .page-13 .page_description {
    margin-top: 10px;
  }
}