/*!
Theme Name: Wyndham
Theme URI: http://underscores.me/
Author: Codemix
Author URI: http://codemix.com.ua
Description: good work
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: wyndham
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Wyndham is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* General styles and typography
--------------------------------------------- */
@font-face {
  font-family: "Bergamasco";
  font-display: swap;
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Bergamasco/Bergamasco Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Inter";
  font-display: swap;
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Inter/Inter-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Inter";
  font-display: swap;
  font-weight: 500;
  font-style: normal;
  src: url("fonts/Inter/Inter-Medium.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 300;
  font-style: normal;
  src: url("fonts/Montserrat/Montserrat-Light.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 300;
  font-style: italic;
  src: url("fonts/Montserrat/Montserrat-LightItalic.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Montserrat/Montserrat-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 400;
  font-style: italic;
  src: url("fonts/Montserrat/Montserrat-Italic.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 500;
  font-style: normal;
  src: url("fonts/Montserrat/Montserrat-Medium.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 500;
  font-style: italic;
  src: url("fonts/Montserrat/Montserrat-MediumItalic.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 700;
  font-style: normal;
  src: url("fonts/Montserrat/Montserrat-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-display: swap;
  font-weight: 700;
  font-style: italic;
  src: url("fonts/Montserrat/Montserrat-BoldItalic.ttf") format("truetype");
}

body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  text-align: inherit;
  text-transform: none;
  color: #404041;
  background-color: #F7F6F6;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -moz-font-smoothing: grayscale;
}

.center {
  text-align: center;
}

a {
  color: inherit;
}

a {
  transition: 0.15s;
}

a:visited {
  color: inherit;
}

.site {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.site > * {
  width: 100%;
}

.site-main {
  flex: 1;
  margin-left: auto;
  margin-right: auto;
}

.post,
.page {
  margin: 0;
}

.container {
  width: 100%;
  max-width: 1380px;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 577px) {
  .container {
    padding-left: 28px;
    padding-right: 28px;
  }
}

@media (min-width: 1400px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.vertical-alignment {
  display: flex;
  align-items: center;
}
.vertical-alignment span {
  padding: 4px 6px;
}

/* Buttons styles
--------------------------------------------- */
a.button {
  display: inline-flex;
  justify-content: center;
  padding: 8px 24px;
  color: var(--dark-grey);
  font-size: 12px;
  font-weight: 400;
  text-decoration: none;
  background: var(--pure-white);
  border: 1px solid var(--pure-white);
  border-radius: 100px;
}

a.button:active,
a.button:visited {
  color: var(--dark-grey);
}

a.button:focus,
a.button:hover {
  color: var(--dark-grey);
}

.button--primary {
  z-index: 0;
  border: 2px solid var(--charcoal-blue);
  background-color: var(--dark-blue);
  color: var(--off-white);
}


@media (min-width: 576px) {
  .button--primary {
    font-weight: 500;
    padding: 12px 26px;
  }
  .button--primary:hover {
    background-color: var(--charcoal-blue);
  }

}

.wyndham-button-primary {
  padding: 10px 26px;
  font-weight: 500;
}
a.button--secondary {
  color: var(--dark-grey);
  font-weight: 500;
  line-height: 24px;
  background: var(--ecru);
  border: 2px solid var(--ecru);
  padding: 10px 26px;
}

.button__custom {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #364758;
  border-radius: 10em;
  min-height: 36px;
  font-family: "Inter";
  font-size: 14px;
  line-height: 1.1;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: 0.15s;
  padding: 6px 16px 7px;
  background-color: #152A3F;
  color: #E3DCCD !important;
  transition: 0.15s;
  position: relative;
  cursor: pointer;
  z-index: 0;
}

.button__custom:hover {
  background-color: #364758;
  color: #fff !important;
}

.button__custom span {
  color: inherit;
}

.button__custom.button__light:not(:hover) {
  color: #404041 !important;
  background-color: #F7F6F6;
  border-color: rgba(64, 64, 65, 0.1);
}

.button__custom.button__stroke {
  background-color: transparent;
  border: 1px solid #e5e4e4;
  color: #404041 !important;
}

.button__custom.button__stroke:hover {
  border-color: #364758;
  background-color: #364758;
  color: #fff !important;
}

.button__circle {
  display: block;
}

.button__circle img {
  display: block;
  width: 56px;
  height: auto;
}



/* contact styles
--------------------------------------------- */
.list__test {
  margin: 0;
  padding: 0;
  list-style: none;
}

.contact {
  margin-top: 110px;
  position: relative;
  margin-bottom: 8px;
  padding-top: 40px;
  padding-bottom: 40px;
}

.contact:first-child {
  margin-top: 80px;
}

.contact .button__custom {
  min-height: 46px;
  width: 100%;
  margin-top: 24px;
}

.contact .container {
  position: relative;
  z-index: 2;
}

.contact__image {
  display: block;
  position: absolute;
  left: 8px;
  top: 0;
  right: 8px;
  width: calc(100% - 16px);
  height: 100%;
  object-fit: cover;
  border-radius: 32px;
}

.contact__form,
.contact__location {
  background-color: #fff;
  border-radius: 24px;
  max-width: 550px;
  padding: 8px 16px 16px;
}

.form__image {
  display: block;
  width: calc(100% + 16px);
  max-width: none;
  margin-left: -8px;
  border-radius: 24px;
  margin-bottom: 15px;
}

.form__title {
  font-size: 30px;
  font-weight: 500;
  letter-spacing: -0.3px;
  margin-bottom: 10px;
}

.form__description {
  font-size: 14px;
  line-height: 1.35;
  letter-spacing: -0.14px;
  opacity: 0.8;
  max-width: 440px;
  margin-bottom: 28px;
}

.form-field {
  margin-top: 8px;
}

.form-field input {
  display: block;
  width: 100%;
  height: 49px;
  border-radius: 10em;
  font-size: 14px;
  line-height: 1;
  padding: 0 30px;
  background-color: #F7F6F6;
  border: 1px solid #E8E8E8;
}

.form-field input:focus::placeholder {
  opacity: 0;
}

.contact__location {
  margin-top: 16px;
  position: relative;
}

.contact__location-icon {
  position: absolute;
  left: 12px;
  bottom: 12px;
}

.contact__location-icon img {
  display: block;
  width: 24px;
}

.contact__location-title {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.24px;
  margin-bottom: 24px;
}

.contact__location-title span {
  display: inline-block;
  font-size: 14px;
  font-weight: 400;
  opacity: 0.6;
  letter-spacing: normal;
}

.contact__location-buttons {
  padding-left: 30px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}

.contact__location-buttons a {
  display: inline-block;
  text-decoration: none;
  background-color: #F7F6F6;
  font-size: 12px;
  border-radius: 10em;
  padding: 10px 16px;
  margin-left: 8px;
  font-weight: 500;
}

.contact__location-buttons a:hover {
  color: #fff;
  background-color: #364758;
}

@media screen and (max-width: 991px) {
  .contact {
    margin-top: 70px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .contact__form,
  .contact__location {
    max-width: 355px;
  }
  .form__image {
    object-fit: cover;
    height: 132px;
  }
  .form__description {
    font-size: 12px;
  }
  .contact__location {
    padding-bottom: 8px;
  }
  .contact__location-icon {
    bottom: 16px;
  }
  .contact__location-title {
    font-size: 20px;
  }
  .contact__location-title span {
    display: block;
    font-size: 12px;
  }
}

@media screen and (max-width: 767px) {
  /**/
}

@media screen and (max-width: 576px) {
  .contact {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .contact .container {
    padding-left: 16px;
    padding-right: 16px;
  }
  .contact__form,
  .contact__location {
    max-width: none;
  }
  .form__title {
    font-size: 28px;
  }
}

/* Ѕазовые стили сло¤ затемнени¤ и модального окна  */
.overlay {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  display: none;
  /* фон затемнени¤ */
  background-color: rgba(0, 0, 0, 0.65);
  position: fixed; /* фиксированное поцизионирование */
  cursor: default; /* тип курсара */
}
/* активируем слой затемнени¤ */
.overlay:target {
  display: block;
}
/* стили модального окна */
.popuper {
  top: -100%;
  right: 0;
  left: 50%;
  font-size: 14px;
  z-index: 20;
  margin: 0;
  width: 85%;
  min-width: 320px;
  max-width: 600px;
  /* фиксированное позиционирование, окно стабильно при прокрутке */
  position: fixed;
  padding: 40px;
  background: #fefefe;
  /* скругление углов */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-transform: translate(-50%, -500%);
  -ms-transform: translate(-50%, -500%);
  -o-transform: translate(-50%, -500%);
  transform: translate(-50%, -500%);
  -webkit-transition: -webkit-transform 0.6s ease-out;
  -moz-transition: -moz-transform 0.6s ease-out;
  -o-transition: -o-transform 0.6s ease-out;
  transition: transform 0.6s ease-out;
}
/* активируем модальный блок */
.overlay:target+.popuper {
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  top: 20%;
}
/* формируем кнопку закрыти¤ */
.close {
  top: 0px;
  right: 0px;
  width: 30px;
  height: 30px;
  position: absolute;
  padding: 0;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  -webkit-transition: all ease .8s;
  -moz-transition: all ease .8s;
  -ms-transition: all ease .8s;
  -o-transition: all ease .8s;
  transition: all ease .8s;
}
.close:before {
  color: #101010;
  content: "X";
  font-size: 20px;
}
@media screen and (max-width: 999px) {
  .popuper {
    padding: 15px;
  }
  .overlay:target + .popuper {
    top: 10%;
  }
}

#result {
  display: none;
}
.program__about-item-description {
  display: none;
}

/* booking_popup styles
--------------------------------------------- */
.booking_popup {
  position: fixed;
  z-index: 99999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  display: none;
}

.booking_popup.open {
  display: flex;
}

.booking_popup .close-booking_popup {
  position: absolute;
  z-index: 7;
  left: 38px;
  top: 26px;
  appearance: none;
  border: none;
  background-color: transparent;
  padding: 0;
}

.booking_popup .close-booking_popup img {
  display: block;
  width: 34px;
}

.booking_popup-logo {
  display: block;
  width: 160px;
  position: absolute;
  z-index: 6;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0.75;
}

.booking_popup-text,
.booking_popup-blur {
  width: 50%;
  min-width: 50%;
}

.booking_popup-blur {
  position: relative;
  z-index: -1;
}

.booking_popup-blur .blur-base {
  display: block;
  position: relative;
  height: 100%;
  margin-left: -50px;
  background: rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(15px) saturate(120%);
  -webkit-backdrop-filter: blur(15px) saturate(120%);
}

.booking_popup-text {
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.booking_popup-text .booking_popup-title,
.booking_popup-text .booking_popup-description,
.booking_popup-text .button__custom {
  position: relative;
  z-index: 2;
}

.booking_popup-text ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.booking_popup-text ul a:not(:hover) {
  text-decoration: none;
}

.booking_popup-text .links__top {
  position: absolute;
  z-index: 5;
  top: 35px;
  right: 36px;
  display: flex;
}

.booking_popup-text .links__top a {
  color: #D5DEE7;
}

.booking_popup-text .links__top a:hover {
  color: #fff;
}

.booking_popup-text .links__top li {
  margin-left: 35px;
}

.booking_popup-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  z-index: 1;
  left: 0;
  width: 50%;
  height: 50%;
}

.booking_popup-image.top {
  top: 0;
}

.booking_popup-image.bottom {
  bottom: 0;
}

.booking_popup-text-top {
  padding: 120px 38px 24px;
}

.booking_popup-text-bottom {
  padding: 41px 38px 24px;
}

.booking_popup-text-top,
.booking_popup-text-bottom {
  height: 50%;
  position: relative;
  z-index: 5;
}

.booking_popup-text-top .button__custom-blur,
.booking_popup-text-bottom .button__custom-blur {
  position: absolute;
  z-index: 5;
  left: 38px;
  bottom: 24px;
  font-size: 12px;
  border-width: 1px !important;
}

.booking_popup-text-top .button__custom-blur:not(:hover),
.booking_popup-text-bottom .button__custom-blur:not(:hover) {
  border-color: #F7F6F6;
  color: #F7F6F6 !important;
  background: rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(5px) saturate(120%);
  -webkit-backdrop-filter: blur(5px) saturate(120%);
}

.booking_popup-title {
  color: #FFF;
  font-family: Montserrat;
  font-size: 32px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 9px;
}

.booking_popup-description {
  color: #FFF;
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  opacity: 0.6;
}

@media screen and (max-width: 991px) {
  .booking_popup-blur {
    display: none;
  }
  .booking_popup-logo {
    display: none;
  }
  .booking_popup-text {
    width: 100%;
  }
  .booking_popup-text .links__top {
    display: none;
  }
  .booking_popup-image {
    width: 100%;
  }
  .booking_popup .close-booking_popup {
    left: 50%;
    margin-left: -17px;
  }
  .booking_popup-text-top .button__custom-blur,
  .booking_popup-text-bottom .button__custom-blur {
    right: 38px;
    height: 42px;
  }
  .booking_popup-title {
    max-width: 350px;
  }
  .booking_popup-description {
    max-width: 240px;
  }
}

@media screen and (max-width: 576px) {
  .booking_popup .close-booking_popup {
    top: 26px;
  }
  .booking_popup-text-top {
    padding: 100px 16px;
  }
  .booking_popup-text-bottom {
    padding: 16px;
  }
  .booking_popup-text-top .button__custom-blur,
  .booking_popup-text-bottom .button__custom-blur {
    bottom: 16px;
    left: 16px;
    right: 16px;
  }
  .booking_popup-title {
    font-size: 26px;
    max-width: none;
  }
  .booking_popup-description {
    font-size: 12px;
  }
}

@media screen and (min-width: 992px) {
  .booking_popup::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: 0;
    right: 0;
    height: 100%;
    background-image: url("/wp-content/uploads/img/45.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center bottom 0;
  }
}

/*-----------Флип Комнаты----------*/
/* Основной контейнер */
.flip-room {
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
}

/* Скрываем видео фон по умолчанию */
.flip-room .elementor-background-video-container {
  opacity: 0;
  transition: opacity 0.4s ease;
}

/* Показываем видео при наведении */
.flip-room:hover .elementor-background-video-container {
  opacity: 1;
}

/* h1-flip - показываем по умолчанию, скрываем при hover */
.flip-room .h1-flip {
  opacity: 1;
  transition: opacity 0.4s ease;
}

.flip-room:hover .h1-flip {
  opacity: 0;
  pointer-events: none;
}

/* h2-flip - скрываем по умолчанию, показываем при hover */
.flip-room .h2-flip {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
}

.flip-room:hover .h2-flip {
  opacity: 1;
  transform: translateY(0);
}

/* Кнопки - скрываем по умолчанию */
.flip-room .Btn-bron,
.flip-room .Btn-above {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
}

/* Показываем кнопки при hover */
.flip-room:hover .Btn-bron,
.flip-room:hover .Btn-above {
  opacity: 1;
  transform: translateY(0);
}

/* Добавляем темный оверлей при hover для лучшей читаемости */
.flip-room::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0);
  transition: background 0.4s ease;
  z-index: 0;
  pointer-events: none;
}

.flip-room:hover::before {
  background: rgba(0, 0, 0, 0.4);
}

/* Убеждаемся что контент поверх оверлея */
.flip-room > * {
  position: relative;
  z-index: 1;
}

/* Мобильная версия */
@media (max-width: 768px) {
  /* Скрываем h1-flip на мобильных */
  .flip-room .h1-flip {
    opacity: 0;
    pointer-events: none;
  }

  /* Показываем h2-flip сразу на мобильных */
  .flip-room .h2-flip {
    opacity: 1;
    transform: translateY(0);
  }

  /* Показываем видео сразу на мобильных */
  .flip-room .elementor-background-video-container {
    opacity: 1;
  }

  /* Показываем кнопки сразу на мобильных */
  .flip-room .Btn-bron,
  .flip-room .Btn-above {
    opacity: 1;
    transform: translateY(0);
  }

  /* Показываем оверлей сразу на мобильных */
  .flip-room::before {
    background: rgba(0, 0, 0, 0.4);
  }
}

/*-----------конец----------------*/