/*
Theme Name: faces
Version: 999
Update URI: false

--------------------------------------------------------------*/
#edittag {
	max-width: 100% !important;
}

.services-slide:nth-child(even) .services-slide__img img {
    object-fit: cover;
}

.services-slide:nth-child(odd) .services-slide__img img {
    object-fit: cover;
}

.programm-block__desc-text .accordeon__title {
    text-transform: none !important;
}

.booking-stiky:hover {
	color: var(--white) !important;
}
/* Начальное состояние кнопки */
.homebtn {
	bottom: 55px !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease, visibility 0.6s ease;
    /* Если кнопка должна быть зафиксирована, убедитесь, что есть position: fixed или sticky */
}

/* Класс, который будет добавляться через JS */
.homebtn.is-visible {
    opacity: 1;
    visibility: visible;
}

/* Если мы наводим на ссылку внутри слайдера, скрываем блок с кастомным курсором */
.banners-slider:has(.banner-slide-link:hover) .cursor-nav {
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s ease; /* Плавное исчезновение */
}

.cstminfo a {
display: block !important;	
}

.otcstm1 {
	display: flex;
    justify-content: flex-end;
    align-items: center;
}
.otcstm2 {
	text-align: center;
}

.footer__form {
    z-index: 9 !important;
}

.footer__body .image-1 img {
    border-radius: 12px 12px 40px 40px;
}

.footer__body .image-2 img {
	border-radius: 40px 40px 12px 12px;
}

.coock {
    padding: 15px !important;
    padding-left: 24px !important;
}

section.location .counter-block__img img {
    border-radius: 12px;
}

section.programm-info .programm-block__img img {
	 border-radius: 12px;
}

@media (max-width: 768px) {
.service-item__img {
display: grid;
}
}

.accordeon__summary::-webkit-details-marker {
    display: none;
}

/* Основной контейнер первого экрана */
.main-screen {
    position: relative;
    height: 100vh;
    overflow: hidden;
    display: flex;
    align-items: center;
}

/* Слайдер на заднем плане */
.main-screen__slider {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

/* Контейнер с контентом поверх слайдера */
.main-screen .container {
    position: relative;
    z-index: 2;
    pointer-events: none; /* Чтобы клики проходили сквозь контейнер к слайдеру */
}

/* Возвращаем кликабельность элементам внутри контента */
.main-screen-info {
    pointer-events: auto;
}

/* Слайды и их фон */
.main-screen-slide, 
.main-screen-slide__bg {
    width: 100%;
    height: 100%;
}

.main-screen-slide__bg {
    background-size: cover;
    background-position: center;
}

/* Затемняющий слой поверх слайда */
.main-screen-slide::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
}




/* Внешние отступы для всей секции */
.certificate {
    padding-top: 80px;    /* Отступ сверху */
    padding-bottom: 20px;  /* Отступ снизу */
}

/* Контейнер для ссылок */
.certificate__inner {
    display: flex;            /* Выстраиваем в ряд */
    justify-content: flex-end; /* Сдвигаем к правому краю */
    gap: 20px;                /* Расстояние между ссылками 20px */
    text-transform: uppercase; /* Все заглавными */
}

/* Оформление ссылок (по желанию) */
.certificate__inner a, 
.certificate__inner span {
    text-decoration: none;
    color: #000000; 
    font-size: 16px;
	font-weight: 400;	
}

/* Состояние при наведении (Hover) */
.certificate__inner a:hover {
    color: #808080;         
}

/* Адаптив для мобильных устройств (ширина экрана менее 768px) */
@media (max-width: 768px) {
    .certificate {
        padding-top: 40px; /* Уменьшаем отступ сверху на мобильных */
    }

    .certificate__inner {
        flex-direction: column;   /* Выстраиваем элементы вертикально */
        align-items: flex-end;    /* Прижимаем к правому краю */
        gap: 12px;                /* Можно уменьшить расстояние между ссылками */
    }

    .certificate__inner a, 
	.certificate__inner span {
        font-size: 14px;          /* Уменьшаем размер шрифта */
        text-align: right;        /* Выравниваем текст внутри ссылки по правому краю */
    }
}


    /* 1. Резервируем место, чтобы заголовок не прыгал */
    #block-search {
        box-sizing: border-box;
        background: inherit;
        min-height: 102px; /* Высота формы */
        
        /* 2. Настраиваем анимацию появления */
        opacity: 0;
        animation: fadeInForm 0.8s ease-in-out forwards;
        animation-delay: 1.5s; /* Ждем 1.5 сек, пока скрипт TL отработает */
    }

    /* Сама анимация */
    @keyframes fadeInForm {
        from { opacity: 0; transform: translateY(5px); }
        to { opacity: 1; transform: translateY(0); }
    }

.booking {
    max-width: 1251px;
    margin: 0 auto;
    width: 100%;
}

.header-fix .lang {
    select {
color: var(--black);		
	}
}

/* Лого строго по центру */
.header__menu {
    flex: 1;
}

.header__logo {
    flex: 0 0 auto;
}

.header__info {
    flex: 1;
    justify-content: flex-end; 
}

.location-block__info24p h3 {
	font-size: 24px !important;
}

@media (max-width: 767.5px) {
    .location-block__info24p h3 {
        font-size: 16px !important;
    }
}


.header__info .phone {
    white-space: nowrap; /* Запрещает перенос текста на новую строку */
    flex-shrink: 0;      /* Запрещает элементу сжиматься меньше его контента */
}



/* Делаем горизонтальные градиенты для слайдера в прогрмме лояльности */
@media (max-width: 1024px) {
    .programm-slider {
        -webkit-mask-image: linear-gradient(to right, 
            transparent 0%, 
            black 15%, 
            black 85%, 
            transparent 100%
        );
        mask-image: linear-gradient(to right, 
            transparent 0%, 
            black 15%, 
            black 85%, 
            transparent 100%
        );
    }
}




.fixed-loyalty a {
    transition: color 0.3s ease; 
}
.fixed-loyalty a svg path {
    transition: stroke 0.3s ease;
}
.fixed-loyalty a:hover {
    color: #808080;
}
.fixed-loyalty a:hover svg path {
    stroke: #808080;
}

.lang {
	select:hover {
	color: var(--black);	
	opacity: 0.5;
	transition: 0.3s ease;	
	}
}

.banner-slide-info {
    transition: color 0.3s ease;
}
.banner-slide-info svg path {
    transition: stroke 0.3s ease;
}
.banner-slide-link:hover .banner-slide-info {
    color: #808080;
}
.banner-slide-link:hover svg path {
    stroke: #808080;
}


.checkbox-label a {
    transition: color 0.3s ease; 
}
.checkbox-label a:hover {
    color: #808080;   
}

.email-form__btn {
    transition: color 0.3s ease;
}
.email-form__btn:hover {
    color: #808080; 
}

.footer__bottom ul li a {
    transition: color 0.3s ease;
}
.footer__bottom ul li a:hover {
    color: #808080;
}

.not-found__text a {
    transition: color 0.3s ease;
}
.not-found__text a:hover {
    color: #808080;
}

.rooms-navigation a:hover {
    opacity: 0.7; 
}
.rooms-navigation a {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.room-item__text-char a {
    transition: color 0.3s ease;
}
.room-item__text-char a:hover {
    color: #808080;
}

.tab-desc__desc a {
    transition: color 0.3s ease;
}
.tab-desc__desc a:hover {
    color: #808080;
}

.accordeon__title {
    transition: color 0.3s ease;
}
.accordeon__summary:hover .accordeon__title {
    color: #808080;
}

.contacts__desc a {
    transition: color 0.3s ease;
}
.contacts__desc a:hover {
    color: #808080; 
}

.services-menu ul li a {
    transition: color 0.3s ease;
}
.services-menu ul li a:hover {
    color: #808080; 
}


.service-desc a {
    transition: color 0.3s ease;
}
.service-desc a svg path {
    transition: stroke 0.3s ease;
}
.service-desc a:hover {
    color: #808080;
}
.service-desc a:hover svg path {
    stroke: #808080;
}


.coock-btn {
    transition: background-color 0.3s ease;
}	
.coock-btn:hover {
    background-color: #808080;
}