/*
 * The source styles stay split by responsibility in frontend/css.
 * postcss-import folds them into one production asset during the booking build.
 */
@font-face {
  font-family: "Inter";
  src: url("../../../fonts/inter-variable.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Mont";
  src: url("../../../fonts/mont-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Mont";
  src: url("../../../fonts/mont-semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Mont";
  src: url("../../../fonts/mont-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Mont";
  src: url("../../../fonts/mont-black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Verdana";
  src: url("../../../fonts/verdana.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Verdana";
  src: url("../../../fonts/verdana-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Zinovia";
  src: url("../../../fonts/zinovia.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

h1 {
  font-size: 40px;
  font-weight: 700;
  line-height: 56px;
}

h2 {
  font-size: 36px;
  font-weight: 600;
  line-height: 50px;
}

h2 .decorative {
    font-size: 42px;
    font-weight: 400;
  }

h2.bigger {
    font-size: 40px;
    font-weight: 700;
    line-height: 56px;
  }

h3 {
  font-size: 32px;
  font-weight: 600;
  line-height: 45px;
}

h3 .decorative {
    font-size: 36px;
    font-weight: 400;
  }

h4 {
  font-size: 18px;
  font-weight: 700;
  line-height: 25px;
}

span.decorative {
  font-family: "Zinovia", "Helvetica", sans-serif;
}

@media (max-width: 768px) {
  h1 {
    font-size: 30px;
    line-height: 42px;
  }

  h2 {
    font-size: 24px;
    line-height: 34px;
  }

    h2 .decorative {
      font-size: 27px;
      line-height: 34px;
    }

    h2.bigger {
      font-size: 30px;
      line-height: 42px;
    }

  h3 {
    font-size: 20px;
    line-height: 28px;
  }

    h3 .decorative {
      font-size: 22px;
      line-height: 28px;
    }

  h4 {
    font-size: 16px;
    line-height: 22px;
  }
}

@media (max-width: 576px) {
  h1 {
    font-size: 24px;
    line-height: 34px;
  }

  h2 {
    font-size: 20px;
    line-height: 28px;
  }

    h2 .decorative {
      font-size: 22px;
      line-height: 28px;
    }

    h2.bigger {
      font-size: 24px;
      line-height: 34px;
    }

  h3 {
    font-size: 18px;
    line-height: 25px;
  }

    h3 .decorative {
      font-size: 20px;
      line-height: 25px;
    }

  h4 {
    font-size: 14px;
    line-height: 20px;
  }
}
:root {
  --feature-color: #f06724;
  --feature-color-2: #FF945F;
  --feature-color-3: #F17D42;
  --feature-hover-color: #e46222;
  --secondary-feature-color: #fcbf37;
  --secondary-feature-color-2: #FFB700;
  --yellow-color: #FBAE19;
  --copy-color: #333333;
  --secondary-copy-color: rgba(36, 36, 36, 0.8);
  --border-color: #c6c6c6;

  --container-width: 1110px;
  --container-width-1024: 880px;
  --container-width-768: 580px;
  --container-width-576: calc(100vw - 40px);
  --basic-gap: 24px;
  --in-section-gap: 60px;
  --grid-gap: 30px;

  --amenities-animation-duration: 400ms;

  --light-shadow: drop-shadow(0px 4px 13px rgba(204, 204, 204, 0.8));
  --dark-shadow: drop-shadow(0px 4px 10px rgba(204, 204, 204, 0.4));

  --duration: 5000;
}
@keyframes slideDown {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes bounce {
  0% {
    opacity: 0;
    transform: translateX(-12px);
  }
  60% {
    opacity: 1;
    transform: translateX(0);
  }
  80% {
    opacity: 1;
    transform: translateX(-8px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideLeft {
  0% {
    transform: translateX(200px);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes tap-icon {
  0% {
    background-image: url("../../../img/tap-icon.svg");
  }
  33% {
    background-image: url("../../../img/tap-icon-2.svg");
  }
  66% {
    background-image: url("../../../img/tap-icon-1.svg");
  }
  100% {
    background-image: url("../../../img/tap-icon.svg");
  }
}

@keyframes headline-scroll {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(-50%);
  }
  50% {
    transform: translateY(-50%);
  }
  75% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes headline-scroll-3 {
  0%, 15% {
    transform: translateY(0);
  }
  30%, 45% {
    transform: translateY(-33%);
  }
  60%, 75% {
    transform: translateY(-66%);
  }
  90%, 100% {
    transform: translateY(0);
  }
}

@keyframes headline-scroll-4 {
  0% {
    transform: translateY(0);
  }
  13%, 26% {
    transform: translateY(-25%);
  }
  39%, 52% {
    transform: translateY(-50%);
  }
  65%, 78% {
    transform: translateY(-75%);
  }
  91%, 100% {
    transform: translateY(0);
  }
}

@keyframes circles {
  0% {
    background-image: url("../../../img/vinyl/circles-1.svg");
  }
  14% {
    background-image: url("../../../img/vinyl/circles-2.svg");
  }
  28% {
    background-image: url("../../../img/vinyl/circles-3.svg");
  }
  42% {
    background-image: url("../../../img/vinyl/circles-4.svg");
  }
  56% {
    background-image: url("../../../img/vinyl/circles-5.svg");
  }
  70% {
    background-image: url("../../../img/vinyl/circles-6.svg");
  }
  84% {
    background-image: url("../../../img/vinyl/circles-7.svg");
  }
  100% {
    background-image: url("../../../img/vinyl/circles-1.svg");
  }
}

@keyframes vinyl {
  0% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(90deg);
  }
  50% {
    transform: rotate(180deg);
  }
  75% {
    transform: rotate(270deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes companies-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-1 * (322px * 7 + 157px + 437px + 220px)));
  }
}

@keyframes bubble {
  0% {
    transform: translateX(-300px);
    opacity: 0;
  }
  100% {
    transform: none;
    opacity: 1;
  }
}

@keyframes residents-choice {
  0% {
    background: none;
  }
  10% {
    background: url("../../../img/residents-choice-1.svg") no-repeat center;
  }
  25% {
    background: url("../../../img/residents-choice-2.svg") no-repeat center;
  }
  40% {
    background: url("../../../img/residents-choice-3.svg") no-repeat center;
  }
  55% {
    background: url("../../../img/residents-choice-4.svg") no-repeat center;
  }
  70% {
    background: url("../../../img/residents-choice-5.svg") no-repeat center;
  }
  85% {
    background: url("../../../img/residents-choice-6.svg") no-repeat center;
  }
  100% {
    background: url("../../../img/residents-choice-7.svg") no-repeat center;
  }
}

@keyframes kazan-header {
  0%, 10% {
    background-image: url("../../../img/town/header/kazan-header-1.jpg");
  }
  15%, 25% {
    background-image: url("../../../img/town/header/kazan-header-2.jpg");
  }
  30%, 50% {
    background-image: url("../../../img/town/header/kazan-header-3.jpg");
  }
  55%, 75% {
    background-image: url("../../../img/town/header/kazan-header-4.jpg");
  }
  80%, 100% {
    background-image: url("../../../img/town/header/kazan-header-1.jpg");
  }
}

@keyframes izhevsk-header {
  0%, 10% {
    background-image: url("../../../img/town/header/izhevsk-header-1.jpg");
  }
  15%, 25% {
    background-image: url("../../../img/town/header/izhevsk-header-2.jpg");
  }
  30%, 50% {
    background-image: url("../../../img/town/header/izhevsk-header-3.jpg");
  }
  55%, 75% {
    background-image: url("../../../img/town/header/izhevsk-header-4.jpg");
  }
  80%, 100% {
    background-image: url("../../../img/town/header/izhevsk-header-1.jpg");
  }
}

@keyframes samara-header {
  0%, 10% {
    background-image: url("../../../img/town/header/samara-header-1.jpg");
  }
  15%, 25% {
    background-image: url("../../../img/town/header/samara-header-2.jpg");
  }
  30%, 50% {
    background-image: url("../../../img/town/header/samara-header-3.jpg");
  }
  55%, 75% {
    background-image: url("../../../img/index-top-pic.jpg");
  }
  80%, 100% {
    background-image: url("../../../img/town/header/samara-header-1.jpg");
  }
}

@keyframes ekt-header {
  0%, 10% {
    background-image: url("../../../img/town/header/ekt-header-1.jpg");
  }
  15%, 25% {
    background-image: url("../../../img/town/header/ekt-header-2.jpg");
  }
  30%, 50% {
    background-image: url("../../../img/town/header/ekt-header-3.jpg");
  }
  55%, 75% {
    background-image: url("../../../img/town/header/ekt-header-4.jpg");
  }
  80%, 100% {
    background-image: url("../../../img/town/header/ekt-header-1.jpg");
  }
}

@keyframes top-hint-scroll {
  0% {
    transform: translateY(0);
  }
  13%, 26% {
    transform: translateY(calc(-1 * (100% + 30px)));
  }
  39%, 52% {
    transform: translateY(calc(-1 * (200% + 60px)));
  }
  65%, 78% {
    transform: translateY(calc(-1 * (300% + 90px)));
  }
  91%, 100% {
    transform: translateY(0);
  }
}

@keyframes scroll-arrow {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-5px);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes scissor {
  0% {
    transform: rotateZ(0deg);
  }
  50% {
    transform: rotateZ(15deg);
  }
  100% {
    transform: rotateZ(0deg);
  }
}

@keyframes promo-counter {
  0% { transform: translateY(0); }
  5% { transform: translateY(-72px); }
  10% { transform: translateY(calc(-2 * 72px)); }
  15% { transform: translateY(calc(-3 * 72px)); }
  20% { transform: translateY(calc(-4 * 72px)); }
  25% { transform: translateY(calc(-5 * 72px)); }
  30% { transform: translateY(calc(-6 * 72px)); }
  35% { transform: translateY(calc(-7 * 72px)); }
  40% { transform: translateY(calc(-8 * 72px)); }
  45% { transform: translateY(calc(-9 * 72px)); }
  50% { transform: translateY(calc(-10 * 72px)); }
  55% { transform: translateY(calc(-11 * 72px)); }
  60% { transform: translateY(calc(-12 * 72px)); }
  65% { transform: translateY(calc(-13 * 72px)); }
  70% { transform: translateY(calc(-14 * 72px)); }
  75% { transform: translateY(calc(-15 * 72px)); }
  80% { transform: translateY(calc(-16 * 72px)); }
  85% { transform: translateY(calc(-17 * 72px)); }
  90% { transform: translateY(calc(-18 * 72px)); }
  95% { transform: translateY(calc(-19 * 72px)); }
  100% { transform: translateY(calc(-20 * 72px)); }
}

@keyframes promo-counter-768 {
  0% { transform: translateY(0); }
  5% { transform: translateY(-64px); }
  10% { transform: translateY(calc(-2 * 64px)); }
  15% { transform: translateY(calc(-3 * 64px)); }
  20% { transform: translateY(calc(-4 * 64px)); }
  25% { transform: translateY(calc(-5 * 64px)); }
  30% { transform: translateY(calc(-6 * 64px)); }
  35% { transform: translateY(calc(-7 * 64px)); }
  40% { transform: translateY(calc(-8 * 64px)); }
  45% { transform: translateY(calc(-9 * 64px)); }
  50% { transform: translateY(calc(-10 * 64px)); }
  55% { transform: translateY(calc(-11 * 64px)); }
  60% { transform: translateY(calc(-12 * 64px)); }
  65% { transform: translateY(calc(-13 * 64px)); }
  70% { transform: translateY(calc(-14 * 64px)); }
  75% { transform: translateY(calc(-15 * 64px)); }
  80% { transform: translateY(calc(-16 * 64px)); }
  85% { transform: translateY(calc(-17 * 64px)); }
  90% { transform: translateY(calc(-18 * 64px)); }
  95% { transform: translateY(calc(-19 * 64px)); }
  100% { transform: translateY(calc(-20 * 64px)); }
}

@keyframes promo-slider {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-1 * (360px + 277px + 414px + 334px + 333px + 434px + 426px + 460px + 512px + (8 * 20px)))); }
}

@media only screen and (min-device-pixel-ratio: 1.25),
only screen and (min-resolution: 1.25dppx) {
  @keyframes kazan-header {
    0%, 10% {
      background-image: url("../../../img/town/header/kazan-header-1@2x.jpg");
    }
    15%, 25% {
      background-image: url("../../../img/town/header/kazan-header-2@2x.jpg");
    }
    30%, 50% {
      background-image: url("../../../img/town/header/kazan-header-3@2x.jpg");
    }
    55%, 75% {
      background-image: url("../../../img/town/header/kazan-header-4@2x.jpg");
    }
    80%, 100% {
      background-image: url("../../../img/town/header/kazan-header-1@2x.jpg");
    }
  }

  @keyframes izhevsk-header {
    0%, 10% {
      background-image: url("../../../img/town/header/izhevsk-header-1@2x.jpg");
    }
    15%, 25% {
      background-image: url("../../../img/town/header/izhevsk-header-2@2x.jpg");
    }
    30%, 50% {
      background-image: url("../../../img/town/header/izhevsk-header-3@2x.jpg");
    }
    55%, 75% {
      background-image: url("../../../img/town/header/izhevsk-header-4@2x.jpg");
    }
    80%, 100% {
      background-image: url("../../../img/town/header/izhevsk-header-1@2x.jpg");
    }
  }

  @keyframes samara-header {
    0%, 10% {
      background-image: url("../../../img/town/header/samara-header-1@2x.jpg");
    }
    15%, 25% {
      background-image: url("../../../img/town/header/samara-header-2@2x.jpg");
    }
    30%, 50% {
      background-image: url("../../../img/town/header/samara-header-3@2x.jpg");
    }
    55%, 75% {
      background-image: url("../../../img/index-top-pic@2x.jpg");
    }
    80%, 100% {
      background-image: url("../../../img/town/header/samara-header-1@2x.jpg");
    }
  }
}

@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
html,
body {
  margin: 0;
  padding: 0;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  white-space: nowrap;
  clip-path: inset(100%);
  clip: rect(0 0 0 0);
  overflow: hidden;
}

.no-scroll,
.no-scroll body {
  overflow-y: hidden;
}

.unbutton {
  margin: 0;
  padding: 0;
  color: inherit;
  -webkit-text-decoration: none;
  text-decoration: none;
  background-color: rgba(0, 0, 0, 0);
  box-shadow: none;
  text-shadow: none;
  border: 0;
}

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

h1,
h2,
h3 {
  margin: 0;
}

p {
  margin: 0;
}

img,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

b {
  display: block;
}

i {
  font-style: normal;
}

a,
button {
  color: inherit;
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
}

a[href^="tel"] {
  color: inherit;
  -webkit-text-decoration: none;
  text-decoration: none;
}

figure,
blockquote {
  margin: 0;
}

input,
textarea {
  -webkit-appearance: none;
}

input,
textarea {
  font-size: 14px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

* {
  box-sizing: border-box;
  -webkit-text-size-adjust: none;
}

/* general */

body {
  font-family: "Verdana", "Helvetica", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 0.01em;
  color: #333333;
  color: var(--copy-color);
}

.section {
  padding: 80px 0 0;
}

.overlayed {
  position: relative;
}

.overlayed > * {
  position: relative;
}

.overlayed::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  background-color: #ffffff;
}

.container {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
}

.wrapper {
  display: flex;
  justify-content: space-between;
}

.headline {
  font-family: "Mont", "Helvetica", sans-serif;
}

.headline span {
  white-space: nowrap;
}

.headline span.decorative {
  font-family: "Zinovia", "Helvetica", sans-serif;
}

.headline i {
  color: #f06724;
  color: var(--feature-color);
}

.text {
  font-size: 14px;
  line-height: 28px;
  letter-spacing: 0.001em;
  color: rgba(36, 36, 36, 0.8);
  color: var(--secondary-copy-color);
}

.text i {
  font-weight: 600;
  color: #333333;
  color: var(--copy-color);
}

.button {
  position: relative;
  display: inline-block;
  max-width: 100%;
  border-radius: 8px;
  padding: 14px 14px;
  font-family: "Mont", "Helvetica", sans-serif;;
  font-weight: 600;
  font-size: 18px;
  line-height: 25px;
  letter-spacing: 0.01em;
  color: #ffffff;
  text-align: center;
  -webkit-text-decoration: none;
  text-decoration: none;
  background: #f06724;
  background: var(--feature-color);
  outline: 0;
  opacity: 1;
  transition: background 0.2s ease-in-out;
}

.button.ekb {
  padding: 14px 12px;
}

.button:hover,
.button:focus {
  background: #FBAE19;
  background: var(--yellow-color);
}

.button.telegram {
  padding: 10px 9px;
  background: #2AA1DA;
}

.button.vk {
  padding: 8px 4px 8px 5px;
  background: #4489C8;
}

.button.small {
  padding: 8px 6px 8px 4px;
  width: 34px;
  height: 34px;
}

.button.small > img {
    width: 24px;
    height: 20px;
  }

.button.telegram:hover,
.button.telegram:focus {
  background: #59BDED;
}

.button.vk:hover,
.button.vk:focus {
  background: #80BAEE;
}

.button.icon img,
.button.telegram img {
  float: left;
}

.button:active {
  transform: scale(0.97);
}

.button:disabled {
  opacity: 0.2;
  pointer-events: none;
  cursor: not-allowed;
}

.button svg {
  fill: #ffffff;
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 24px;
  height: 16px;
  margin: auto 0;
  opacity: 0;
  transform: translateX(-32px);
  transition: all 0.2s ease-out;
}

.button:hover svg,
.button:focus svg {
  opacity: 1;
  transform: translateX(0);
}

.button--secondary {
  color: #333333;
  color: var(--copy-color);
  background-color: rgba(51, 51, 51, 0.04);
}

.button--secondary:hover,
.button--secondary:focus {
  background-color: rgba(51, 51, 51, 0.06);
}

.button--ghost {
  padding: 18px 23px;
  color: #f06724;
  color: var(--feature-color);
  background-color: #ffffff;
  border: 1px solid #f06724;
  border: 1px solid var(--feature-color);
}

.button--ghost svg {
  fill: #f06724;
  fill: var(--feature-color);
}

.circle-button {
  width: 56px;
  height: 56px;
  border: 2px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  outline: 0;
  transition: border-color 0.2s ease-out;
}

.circle-button:hover,
.circle-button:focus {
  border-color: rgba(255, 255, 255, 0.4);
}

.slider-control {
  width: 44px;
  height: 44px;
  outline: 0;
  transition: opacity 0.1s ease-out;
}

.slider-control:hover,
.slider-control:focus {
  opacity: 1;
}

.slider-control:disabled {
  opacity: 0.1;
  cursor: default;
  pointer-events: none;
}

.slider-control svg {
  fill: #0f0f15;
  position: relative;
  top: 2px;
  display: inline-block;
  transition: fill 0.1s ease-out;
}

.slider-control:hover svg,
.slider-control:focus svg {
  fill: #f06724;
  fill: var(--feature-color);
}

.abstract {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-areas: "h c c";
  grid-column-gap: 24px;
  -moz-column-gap: 24px;
       column-gap: 24px;
}

.abstract__headline {
  grid-area: h;
}

.abstract__content {
  grid-area: c;
}

.backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #333333;
  z-index: 30;
}

.no-scroll {
  overflow: hidden;
}

.no-scroll-ios {
  position: fixed;
  width: 100%;
}

.group {
  position: relative;
}

.input {
  display: block;
  width: 100%;
  padding: 26px 20px 8px;
  font-family: inherit;
  font-size: 14px;
  line-height: 20px;
  color: inherit;
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid rgba(51, 51, 51, 0.1);
  border-radius: 0;
  outline: 0;
  -webkit-appearance: none;
  transition: border-color 0.2s ease-in;
}

.booking-input {
  display: block;
  width: 100%;
  padding: 16px 56px 16px 44px;
  font-family: inherit;
  font-size: 14px;
  line-height: 20px;
  color: inherit;
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  outline: 0;
  -webkit-appearance: none;
  transition: border-color 0.2s ease-in;
}

.input:focus {
  border-color: rgba(51, 51, 51, 0.3);
}

.input--select {
  height: 100%;
  padding-right: 56px;
}

.top__group > svg:nth-child(1) {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  margin: auto 0;
}

.input--select ~ svg,
.react-datepicker-wrapper ~ svg {
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  margin: auto 0;
  opacity: 0.4;
  transition: opacity 0.2s ease-in;
  pointer-events: none;
}

.input--message {
  height: 74px;
  resize: none;
}

.input--number {
  height: 100%;
  padding-left: 48px;
  padding-right: 48px;
  text-align: center;
  -webkit-appearance: none;
}

.label {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 20px;
  height: 14px;
  margin: auto 0;
  font-size: 14px;
  line-height: 1em;
  color: rgba(51, 51, 51, 0.3);
  pointer-events: none;
  transition: all 0.3s ease-out;
  transform-origin: left;
}

.input:not(:-moz-placeholder) ~ .label {
  color: rgba(51, 51, 51, 0.6);
  transform: scale(0.9) translateY(-12px);
}

.input:focus ~ .label,
.input:not(:placeholder-shown) ~ .label,
.input--select ~ .label,
.react-datepicker-wrapper ~ .label {
  color: rgba(51, 51, 51, 0.6);
  transform: scale(0.9) translateY(-12px);
}

.group--message .label {
  top: 21px;
  bottom: auto;
  bottom: initial;
  padding-right: 24px;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: calc(-1 * 24px);
  left: calc(-1 * var(--basic-gap));
  display: none;
  min-width: 230px;
}

.nav__item:hover .dropdown-menu {
  display: block;
}

.dropdown-menu__list {
  background-color: #ffffff;
  box-shadow: 0 25px 40px 0 rgba(51, 51, 51, 0.1);
}

.dropdown-menu__item {
  display: flex;
  flex-flow: row nowrap;
  gap: 4px;
  align-items: center;
  padding: 10px 28px;
}

.dropdown-menu__item:first-child {
    padding-top: 15px;
  }

.dropdown-menu__item:last-child {
    padding-bottom: 15px;
  }

.dropdown-menu__link {
  display: block;
  font: inherit;
  color: inherit;
  transition: color 0.2s ease-out;
  font-family: "Verdana", "Helvetica", sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
}

.dropdown-menu__link:hover,
.dropdown-menu__link:focus {
  color: #f06724;
  color: var(--feature-color);
}

.caption {
  position: absolute;
  right: 36px;
  bottom: 36px;
  left: 36px;
  display: flex;
  justify-content: space-between;
}

.caption__text {
  display: block;
  padding: 20px 24px 20px 56px;
  font-weight: 600;
  font-size: 14px;
  line-height: 16px;
  color: #0f0f15;
  background-color: #ffffff;
  background-repeat: no-repeat;
  background-size: 16px auto;
  background-position: 24px center;
  border-radius: 28px;
}

.caption__button {
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 24px;
  background-color: #ffffff;
  overflow: hidden;
}

.caption__icons {
  position: relative;
  transition: transform 0.25s ease-in;
}

.caption__arrow {
  position: absolute;
  top: 0;
  right: 120px;
  bottom: 0;
  margin: auto 0;
  transform: translateX(0);
}

.caption__button svg {
  fill: #f06724;
  fill: var(--feature-color);
  transition: fill 0.1s ease-in;
}

.caption__button:hover svg,
.caption__button:focus svg {
  fill: #f06724;
  fill: var(--feature-color);
}

/* responsive */
@media (max-width: 1440px) {
  .container {
    width: 1110px;
    width: var(--container-width);
    margin: 0 auto;
  }
}

@media (max-width: 1024px) {
  .container {
    width: 880px;
    width: var(--container-width-1024);
    margin: 0 auto;
  }
}

@media (max-width: 768px) {
  .container {
    width: 580px;
    width: var(--container-width-768);
    margin: 0 auto;
  }

  .button {
    font-size: 16px;
    line-height: 22px;
    padding: 10px 24px;
  }
    .dropdown-menu__item:first-child {
      padding-top: 12px;
    }

    .dropdown-menu__item:last-child {
      padding-bottom: 0;
    }
}

@media (max-width: 576px) {
  .container {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    margin: 0 auto;
  }
}

/* HEADER */

.page-header {
  position: relative;
  padding: 88px 0 0;
  color: #242424;
  background-color: #ffffff;
}

.inner .page-header {
  display: block;
  min-height: 0;
  min-height: initial;
  padding: 0;
  color: inherit;
  background-image: none;
}

.page-header__movie {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* HEADER -> navigation */

.page-header__nav {
  z-index: 20;
}

.nav {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: left;
  background-color: #ffffff;
}

.nav--sticky {
  position: fixed;
  animation: slideDown 0.3s ease-in;
}

.nav__container {
  position: relative;
  display: grid;
  justify-content: center;
  grid-template-columns: repeat(12, 80px);
  grid-template-rows: 1fr;
  grid-column-gap: 20px;
  -moz-column-gap: 20px;
       column-gap: 20px;
  grid-template-areas: "l l l b b b b b b b b b";
  align-items: center;
  height: 120px;
}

.nav__container.booking {
  grid-template-areas: "l l b b b b b b b b b p";
}

.nav__logo {
  grid-area: l;
  justify-self: center;
  position: relative;
  top: -4px;
  transition: all 0.2s ease-in;
  z-index: 21;
}

a.nav__logo:hover,
a.nav__logo:focus {
  opacity: 0.75;
}

a.nav__logo:active {
  transform: scale(0.95);
}

.nav__logo-pic {
  fill: #242424;
  transition: fill 0.2s ease-in;
}

.nav__menu {
  grid-area: b;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 110;
}

.nav__menu.gap {
  margin-left: 100px;
}

.nav__menu--booking {
  margin: 0 20px 0 auto;
}

.nav__user-wrapper {
  grid-area: p;
}

.nav__item {
  position: relative;
  font-family: inherit;
  font-weight: normal;
  font-size: inherit;
  text-wrap: nowrap;
  letter-spacing: 0.02em;
  text-align: center;
}

.nav__item.hidden {
  display: none;
}

.nav__item:first-child {
  margin-left: 0;
}

.nav__item:last-child {
  display: none;
}

.nav__item--button {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  order: 2;
  display: flex;
  align-items: center;
  margin: 0;
}

.nav__item--has-dropdown.city button {
    font-size: 14px;
    align-items: center;
    gap: 4px;
  }

.nav__item--has-dropdown.city svg {
    stroke: #f06724;
    stroke: var(--feature-color);
    margin-left: 0;
  }

.nav__item--has-dropdown.city a {
    font-size: 14px;
  }

.nav__item--has-dropdown.city .dropdown-menu {
    min-width: 181px;
  }

.nav__item--has-dropdown.city .dropdown-menu__item {
    padding: 10px 24px;
  }

.nav__item--has-dropdown.city .dropdown-menu__item:first-child {
    padding-top: 20px;
  }

.nav__item--has-dropdown.city .dropdown-menu__item:last-child {
    padding-bottom: 20px;
  }

.nav__link {
  font: inherit;
  color: inherit;
  -webkit-text-decoration: none;
  text-decoration: none;
  opacity: 1;
  transition: color 0.2s ease-out;
}

.nav__link.active {
    font-weight: bold;
  }

.nav__link:not(button)::after {
    display: block;
    content: attr(data-text);
    height: 0;
    visibility: hidden;
    overflow: hidden;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    pointer-events: none;
    font-weight: bold;
  }

.nav__item:hover .nav__link,
.nav__link:focus {
  font-weight: bold;
}

.nav__link:active {
  opacity: 0.3;
}

.nav--sticky .nav__link {
  color: #333333;
}

.nav__link--has-dropdown {
  display: flex;
}

.nav__link--has-dropdown svg {
  stroke: #333333;
  margin-left: 5px;
  transition: stroke 0.2s ease-out;
}

.nav__item--has-dropdown:hover .nav__link svg,
.nav__link--has-dropdown:focus svg {
  stroke: #f06724;
  stroke: var(--feature-color);
}

.nav__button {
  min-width: 212px;
  padding: 16px 24px;
}

.nav__user-wrapper > .nav__user {
  /* Показываем иконку пользователя на странице переговорок */
  display: flex;
  justify-content: center;
  align-items: center;
}

.nav__id-wrapper > .nav__user {
  /* Показываем иконку пользователя на странице переговорок */
  display: flex;
  justify-content: center;
  align-items: center;
}



.nav__user {
  display: none;
  padding: 16px 16px;
  background-color: #f9f9f9;
}

.nav__user--entered {
  width: 48px;
  height: 48px;
  padding: 0;

  transition: border-radius 0.2s ease-in;
}

.nav__user-name {
  font-size: 14px;
  font-weight: 600;
  line-height: 14px;
  color: #242424;
  text-transform: uppercase;
}

.nav__profile-dropdown {
  position: absolute;
  top: 116px;
  right: 0;
  z-index: 100;

  display: grid;
  grid-template-columns: 1fr 16px;
  grid-template-areas:
    "identity logout"
    "settings settings";
  grid-column-gap: 24px;
  -moz-column-gap: 24px;
       column-gap: 24px;
  grid-row-gap: 16px;
  row-gap: 16px;
  align-items: center;
  width: 336px;
  min-height: 128px;
  padding: 24px;

  background-color: #ffffff;
  box-shadow: 0px 25px 40px rgba(36, 36, 36, 0.1);

  transform: translate(100vw);
  transition: transform 300ms ease;
}

.nav__profile-arrow {
  position: absolute;
  top: -5px;
  right: 18px;
}

.nav__profile-dropdown--show {
  transform: translate(0);
}

.nav__id-wrapper {
  grid-area: identity;
  display: flex;
}

.nav__name-wrapper {
  margin-left: 24px;
}

.nav__name-wrapper--only-phone {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.nav__name {
  color: rgba(36, 36, 36, 1);
  font-weight: 600;
  line-height: 24px;
}

.nav__phone {
  color: rgba(36, 36, 36, 0.8);
  line-height: 24px;
}

.nav__phone-number {
  position: absolute;
  top: 20px;
  right: 0;
  font-family: "Mont", "Helvetica", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
  color: #f06724 !important;
  color: var(--feature-color) !important;
}

.nav__phone-number > svg {
    float: left;
    margin-top: 3px;
    height: 19px;
    width: 20px;
  }

.nav__logout-button {
  grid-area: logout;
  width: 16px;
  height: 16px;
}

.nav__settings-button {
  grid-area: settings;
  justify-self: start;
  color: rgba(36, 36, 36, 0.8);
  font: inherit;
  line-height: 24px;
  transition: color 0.2s ease-in;
}

.nav__settings-button:hover,
.nav__settings-button:focus {
  color: #f06724;
  color: var(--feature-color);
}

.nav__logout-button svg {
  width: 16px;
  height: 16px;

  fill: #242424;
  transition: fill 0.2s ease-in;
}

.nav__logout-button:hover svg{
  fill: #f06724;
  fill: var(--feature-color);
}

.nav__user svg {
  fill: #242424;
  transition: fill 0.2s ease-in;
}

.nav__user span {
  transition: color 0.2s ease-in;
}

.nav__user:hover svg,
.nav__user:focus svg {
  fill: #f06724;
  fill: var(--feature-color);
}

.nav__user:hover span,
.nav__user:focus span{
  color: #f06724;
  color: var(--feature-color);
}

/* HEADER -> slider */

.page-header__slider {
  z-index: 2;
}

.slider__item {
  padding: 122px 0 136px;
}

.slider__headline {
  max-width: 780px;
  margin-bottom: 34px;
  font-size: 44px;
  line-height: 64px;
}

.slider__text {
  max-width: 520px;
  line-height: 32px;
  color: rgba(255, 255, 255, 0.8);
  opacity: 0.8;
}

.slider__button {
  min-width: 288px;
  margin-top: 82px;
}

/* HEADER -> city navigation */

.city-nav {
  border-top: 1px solid rgba(36, 36, 36, 0.06);
}

.city-nav__wrapper {
  position: relative;
}

.city-nav__wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 64px;
  display: block;
  background-image: linear-gradient(
    270deg,
    #ffffff 0%,
    rgba(255, 255, 255, 0) 100%
  );
  pointer-events: none;
  z-index: 2;
}

.city-nav__menu {
  overflow: scroll;
  scrollbar-width: none;
}

.city-nav__menu::-webkit-scrollbar {
  display: none;
}

.city-nav__list {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 55px;
}

.city-nav__item {
  margin-right: 40px;
}

.city-nav__item:last-child {
  margin-right: 0;
  padding-right: 64px;
}

.city-nav__link {
  position: relative;
  display: inline-block;
  font-weight: 600;
  line-height: 1.4em;
  color: inherit;
  white-space: nowrap;
  transition: color 0.2s ease-in;
}

.city-nav__link:hover,
.city-nav__link:focus {
  color: #f06724;
  color: var(--feature-color);
}

/* HEADER -> picture */

.page-header__picture {
  background-image: url("../../../img/func-kitchen.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.page-header__picture--kazan {
  background-image: url("../../../img/location-top-kazan.jpg");
}

.page-header__picture--samara {
  background-image: url("../../../img/location-top-samara.jpg");
}

.page-header__headline-wrapper {
  display: flex;
  align-items: flex-end;
  min-height: 380px;
  padding: 36px 0;
}

.page-header__headline {
  position: static;
}

.page-header__headline-text {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.377 11.294C-.168 7.305 2.663 1 8 1s8.168 6.305 4.623 10.294L8 16.494l-4.623-5.2z' stroke='%23F06724' stroke-width='2'/%3E%3Ccircle cx='8' cy='7' r='2' stroke='%23F06724' stroke-width='2'/%3E%3C/svg%3E");
}

/* HEADER -> intro */

.description {
  position: relative;
  padding-top: 70px;
}

.description__content.inline {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  gap: 10px;
}

.headline__scroll {
  height: 56px;
  overflow: hidden;
}

.headline__scroll.kazan,
.headline__scroll.izhevsk,
.headline__scroll.samara {
  width: 315px;
}

.headline__scroll.kazan h2,.headline__scroll.izhevsk h2,.headline__scroll.samara h2 {
    animation: headline-scroll-3 5s cubic-bezier(0.7,-1, 0.5, 2) infinite !important;
  }

.headline__scroll.ekt {
  width: auto;
  width: initial;
}

.headline__scroll.ekt h2 {
    animation: headline-scroll-3 5s cubic-bezier(0.7,-1, 0.5, 2) infinite !important;
  }

.headline__scroll.kazan h2,
.headline__scroll.izhevsk h2,
.headline__scroll.samara h2,
.headline__scroll.ekt h2,
.headline__scroll .description__headline {
  background: linear-gradient(0deg, #f06724, #FF945F);
  background: linear-gradient(0deg, var(--feature-color), var(--feature-color-2));
  background: -webkit-linear-gradient(0deg, var(--feature-color), var(--feature-color-2));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: headline-scroll 3.3s cubic-bezier(0.7,-1, 0.5, 2) infinite;
}

.headline__scroll-4 .description__headline {
  animation: headline-scroll-4 6.6s cubic-bezier(0.7,-1, 0.5, 2) infinite;
}

.description__headline {
  max-width: 820px;
  color: #333333;
  color: var(--copy-color);
  font-family: "Mont", "Helvetica", sans-serif;
}

.description__headline.about {
    max-width: -moz-min-content;
    max-width: min-content;
  }

.description__headline.max {
  width: 100%;
  max-width: 100%;
}

.description__text-wrapper {
  display: flex;
  justify-content: space-between;
  max-width: 100%;
  padding-top: 40px;
}

.description__text {
  max-width: 550px;
  font-size: 20px;
  line-height: 28px;
  font-family: "Verdana", "Helvetica", sans-serif;
}

.description__text.ekt {
  max-width: 700px;
}

.description__button {
  min-width: 300px;
  height: 53px;
}

.description__illustration {
  width: 1260px;
  height: 450px;
  margin: 40px auto 0;
  z-index: 2;
  border-radius: 16px;
  background-image: url("../../../img/index-top-pic.jpg");
  background-size: cover;
}

.description__illustration.promo {
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("../../../img/promo/header.webp");
    padding: 25px 40px;
    position: relative;
  }

.description__button.promo {
  background-image: linear-gradient(to right top, #FF945F 5%, #FCBA3A);
  position: absolute;
  right: calc((100vw - 1260px) / 2 + 40px);
  bottom: calc(100vw / 8);
  z-index: 3;
}

.description__button.promo:not(.outside) {
    display: none;
  }

.description__button.promo.outside {
    display: block;
  }

.description__button.promo:hover {
    background-image: linear-gradient(to left top, #FF945F 5%, #FCBA3A);
  }

.description__town {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  height: 74px;
  width: 384px;
  border-radius: 8px;
  filter: drop-shadow(0px 4px 13px rgba(204, 204, 204, 0.8));
  filter: var(--light-shadow);
  background: white;
  margin-left: 5px;
  margin-bottom: 10px;
}

.description__town > h2 {
    font-size: 36px;
    line-height: 50px;
  }

.description__town > svg {
    color: #f06724;
    color: var(--feature-color);
    margin-right: 10px;
  }

.description__opening {
  font-size: 114px;
  line-height: 105px;
  font-weight: bold;
  font-family: "Mont", Helvetica, sans-serif;
  color: white;
}

.description__illustration.franchise {
  background-image: url("../../../img/franchise/top-pic.jpg");
}

.page-header__curve {
  position: relative;
  opacity: 0;
  transition: opacity linear 0.3s;
  background-image: url("../../../img/header-curve.svg");
  background-size: cover;
  width: 100vw;
  height: calc(100vw / 6);
  margin-top: calc(-1* 100vw / 7.3 / 2);
  z-index: 2;
}

.page-header__curve.ekt {
  background-image: url("../../../img/feel-the-rhythm.svg");
}

.page-header__curve.franchise {
  background-image: url("../../../img/franchise/curve.svg");
  background-repeat: no-repeat;
  background-size: contain;
}

.page-header__about {
  position: relative;
  width: 1037px;
  height: 397px;
  margin: 40px auto 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.page-header__about > img {
    position: absolute;
    top: 0;
    right: 0;
    width: 471px;
    height: 397px;
  }

.page-header__about-block {
  width: 671px;
  height: 232px;
  border-radius: 16px;
  padding: 44px;
  background: white;
  filter: drop-shadow(2px 4px 10px rgba(204, 204, 204, 0.3));
  display: flex;
  flex-flow: row nowrap;
  gap: 10px;
  z-index: 1;
}

.page-header__about-block > h3 {
    font-family: "Verdana", "Helvetica", sans-serif;
    font-weight: 400;
    margin-bottom: 0;
  }

.page-header__about-block span.decorative {
    font-size: 34px;
    line-height: 45px;
  }

.page-header__about-block > svg {
    min-width: 24px;
    height: 50px;
    fill: #f06724;
    fill: var(--feature-color);
  }

/* HEADER -> social */

.social {
  display: flex;
  align-items: center;
}

.social__button {
  width: 32px;
  height: 32px;
  margin-right: 16px;
  padding: 6px;
  opacity: 0.5;
}

.social__button:last-child {
  margin-right: 0;
}

.social__button:hover,
.social__button:focus {
  opacity: 1;
}

.social__button svg {
  fill: #ffffff;
}

.social__button:hover svg,
.social__button:focus svg {
  fill: #f06724;
  fill: var(--feature-color);
}

.social__button--vk:hover svg,
.social__button--vk:focus svg {
  fill: #5181b8;
}

.social__button:focus {
  opacity: 0.5;
}

/* HEADER -> contacts */

.page-header__contacts {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  z-index: 2;
}

.contacts__container {
  display: flex;
  align-items: center;
  min-height: 159px;
}

.contacts__down {
  stroke: #ffffff;
  margin-right: 88px;
}

.contacts__down svg {
  margin: auto;
}

.contacts__list {
  display: flex;
}

.contacts__item {
  flex-shrink: 0;
  margin-right: 110px;
}

.contacts__text {
  line-height: 32px;
}

.contacts__text--secondary {
  opacity: 0.5;
}

.contacts__social {
  margin-left: auto;
}

.page-header__otkrytie {
  max-width: calc(100% - 48px);
  width: 1110px;
  width: var(--container-width); 
  margin: auto;
}

.nav__burger.telegram {
  display: none;
}

/* 2x images */

@media only screen and (min-device-pixel-ratio: 1.25),
only screen and (min-resolution: 1.25dppx) {
  .description__illustration {
    background-image: url("../../../img/index-top-pic@2x.jpg");
  }

  .description__illustration.franchise {
    background-image: url("../../../img/franchise/top-pic@2x.jpg");
  }
}

/* RESPONSIVE */

@media only screen and (orientation: landscape) {
  .page-header__otkrytie .vertical {
      display: none;
  }
  .page-header__otkrytie .horizontal {
      display: block;
  }
}

@media only screen and (orientation: portrait) {
  .page-header__otkrytie .vertical {
      display: block;
  }
  .page-header__otkrytie .horizontal {
      display: none;
  }
}

/* responsive */

@media (max-width: 1440px) {
  .nav__container {
    grid-template-columns: repeat(12, 65px);
    -moz-column-gap: 30px;
         column-gap: 30px;
  }

  .city-nav__back-button svg {
    display: none;
  }
}

@media (max-width: 1024px) {
  .page-header {
    padding: 64px 0 0;
  }

  .nav__container {
    grid-template-columns: repeat(9, 80px);
    grid-template-areas: "l l b b b b b b b";
    -moz-column-gap: 20px;
         column-gap: 20px;
    /*height: 64px;*/
    /*max-width: calc(100% - 24px);*/
    /*margin: 0 0 0 auto;*/
    /*padding: 0;*/
  }

  .nav__menu {
    margin: 0;
  }

  .nav__item {
    margin-left: 0;
  }

  .description__illustration {
    width: 880px;
    height: 316px;
  }

  .description__town {
    width: 320px;
    height: 62px;
  }

    .description__town > h2 {
      font-size: 28px;
    }

    .description__town > svg {
      width: 32px;
      height: 32px;
    }

  .description__opening {
    font-size: 80px;
    line-height: 62px;
  }

  .description__button.promo {
    right: calc((100vw - 880px) / 2 + 40px);
  }
}

@media (max-width: 1024px) and (min-width: 769px) {
  .headline__scroll.franchise {
    height: 112px;
  }
}

@media (max-width: 768px) and (min-width: 577px) {
  .headline__scroll.franchise {
    height: 84px;
  }
}

@media (max-width: 768px) {
  .nav,
  .nav--sticky {
    position: fixed;
    animation: none;
  }

  .page-header__movie {
    display: none;
  }

  .description__text-wrapper {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    padding-top: 12px;
  }

    .description__text-wrapper > button {
      margin-top: 0;
    }

  .description__text {
    width: 280px;
    font-size: 14px;
    line-height: 20px;
  }

  .description__button.promo {
    right: calc((100vw - 688px) / 2 + 40px);
    padding: 14px;
    line-height: 25px;
  }

  .nav--sticky .nav__link {
    color: inherit;
  }

  .nav__container {
    height: 64px;
    max-width: 100%;
    margin: 0;
    padding: 0;
    grid-template-areas: "b l w";
    grid-template-columns: repeat(3, 1fr);
    width: 100vw;
  }

  .nav__container.booking {
    grid-template-areas: "b l w";
  }

  .nav__user-wrapper.booking {
    grid-area: w;
    justify-self: end;
    margin-right: 24px;
  }

  .inner .nav {
    border-bottom-color: rgba(51, 51, 51, 0.06);
  }

  .nav--open-menu {
    background-color: #ffffff;
  }

  .nav__logo {
    margin: 0 auto;
    z-index: 20;
  }

  .nav__burger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    grid-area: b;
    background: #f06724;
    background: var(--feature-color);
    border-radius: 50%;
    margin-left: 24px;
  }

  .nav__burger.telegram {
    display: flex;
    grid-area: w;
    width: 44px;
    height: 44px;
    justify-self: end;
    margin-right: 24px;
  }

    .nav__burger.telegram > img {
      width: 24px;
      transform: translate(-1px, 1px);
    }

  .nav__burger.telegram.booking {
    justify-self: start;
  }

  .nav__line {
    position: relative;
    display: block;
    width: 14px;
    height: 2px;
    background-color: white;
  }

  .nav--open-menu .nav__line {
    transform: rotate(-225deg);
  }

  .nav--open-menu .nav__burger.nav__tool-button {
    width: auto;
    height: 44px;
    min-width: 132px;
    padding: 0 12px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 12px;
    border-radius: 18px;
    color: #ffffff;
  }

  .nav--open-menu .nav__burger.nav__tool-button::after {
    content: "(закрыть)";
    font-family: "Mont", "Helvetica", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    white-space: nowrap;
  }

  .nav__line::before,
  .nav__line::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    background-color: inherit;
  }

  .nav__line::before {
    bottom: calc(100% + 3px);
  }

  .nav__line::after {
    top: calc(100% + 3px);
  }

  .nav--open-menu .nav__line::before {
    transform: translateY(5px) rotate(90deg);
  }

  .nav--open-menu .nav__line::after {
    transform: translateY(-5px);
  }

  .nav__item {
    width: 100%;
    min-height: 48px;
    margin-left: 0;
    line-height: 28px;
  }

    .nav__item span.orange {
      color: white;
    }

    .nav__item:last-child {
      display: flex;
      align-items: center;
      gap: 20px;
      min-height: 52px;
      margin-top: 16px;
    }

    .nav__item:last-child > button.unbutton {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 52px;
      height: 52px;
      margin-right: 0;
    }

    .nav__item:last-child > button.unbutton > img,.nav__item:last-child > button.unbutton > svg {
      width: 30px;
      height: 30px;
    }

  .nav__item--button {
    order: 2;
    position: static;
    display: block;
    margin: auto auto 0;
    text-align: center;
  }

  .nav__link {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 48px;
    font-weight: 700;
  }

  .nav__item--has-dropdown.city {
    display: block;
  }

    .nav__item--has-dropdown.city > button {
      justify-content: flex-start;
      width: 100%;
      height: auto;
      margin: 0;
      padding: 0;
      min-height: 48px;
      font-size: 20px;
      line-height: 28px;
      text-align: left;
    }

    .nav__item--has-dropdown.city svg {
      display: none;
    }

    .nav__item--has-dropdown.city .dropdown-menu__item {
      padding: 0;
    }

    .nav__item--has-dropdown.city .dropdown-menu__item:first-child {
      padding-top: 0;
    }

    .nav__item--has-dropdown.city .dropdown-menu__item:last-child {
      padding-bottom: 0;
    }

    .nav__item--has-dropdown.city .dropdown-menu__list {
      padding-left: 24px;
    }

  .nav__menu {
    position: fixed;
    width: 100vw;
    height: auto;
    max-height: 100vh;
    max-height: 100dvh;
    top: 0;
    bottom: auto;
    left: 0;
    display: flex;
    gap: 0;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    overflow-y: auto;
    margin: 0;
    padding: 76px 32px 40px;
    border-top: 1px solid rgba(36, 36, 36, 0.06);
    transform: translateX(-100%);
    transition: transform 180ms ease-out;
    background-color: #f06724;
    background-color: var(--feature-color);
    border-radius: 0 0 24px 24px;
    z-index: 20;
    font-family: "Mont", "Helvetica", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    color: white;
  }

  .nav__menu.gap {
    margin-left: 0;
  }

  .nav__menu::before {
    content: "";
    position: absolute;
    top: 63px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.06);
  }

  .nav--open-menu .nav__menu {
    transform: translateX(0);
  }

  .nav__tool-button {
    width: 44px;
    height: 44px;
    z-index: 21;
    outline: 0;
  }

  .nav__user-wrapper--disabled {
    pointer-events: none;
  }

  .dropdown-menu {
    display: block;
    position: static;
    position: initial;
    width: 100%;
  }

    .dropdown-menu a {
      font-family: "Verdana", "Helvetica", sans-serif;
      display: flex;
      align-items: center;
      min-height: 44px;
      font-size: 20px;
      font-weight: 400;
      line-height: 28px;
    }

  .dropdown-menu__list {
    background-color: inherit;
    box-shadow: none;
  }

    .dropdown-menu__list > li {
      padding: 0;
    }
    .dropdown-menu__item > svg {
      display: none;
    }

  .nav__user {
    border: 1px solid rgba(36, 36, 36, 0.06);
    border-top: 0;
    border-bottom: 0;
    padding: 0;
    background-color: #f06724;
    background-color: var(--feature-color);
    border-radius: 50%;
  }

  .nav__user > svg {
    fill: white;
  }

  .nav__user-wrapper > .nav__user .nav__user-name,
  .nav__user-wrapper > .nav__user:hover .nav__user-name,
  .nav__user-wrapper > .nav__user:focus .nav__user-name {
    color: #ffffff;
  }

  .nav__user--dropdown-icon {
    border: 0;
    background-color: #f9f9f9;
  }

  .nav__user:focus svg,
  .nav__user:hover svg {
    fill: #f9f9f9;
  }

  .nav__profile-dropdown {
    top: 64px;

    width: 100vw;

    border-top: 1px solid rgba(36, 36, 36, 0.06);
    box-shadow: 0 40px 40px -40px rgba(51, 51, 51, 0.1);
  }

  .nav__profile-arrow {
    display: none;
  }

  .slider__headline {
    font-size: 34px;
    line-height: 48px;
  }

  .description {
    padding: 66px 0 96px;
  }

  .description::after {
    display: none;
  }

  .description__button {
    margin-top: 44px;
  }

  .contacts__container {
    min-height: 64px;
  }

  .contacts__down {
    width: 44px;
    height: 44px;
  }

  .page-header .contacts__list {
    display: none;
  }

  .nav__logo-pic {
    width: 80px;
  }

  .nav__item:last-child {
    display: flex;
  }

  .city-nav__container {
    display: block;
  }

  .page-header__slider {
    flex-grow: 1;
    display: flex;
    align-items: stretch;
  }

  .slider__item {
    width: 100%;
  }

  .slider__container {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .slider__headline {
    margin-bottom: 24px;
    font-size: 24px;
    line-height: 34px;
  }

  .slider__text {
    margin-bottom: 24px;
    line-height: 24px;
  }

  .slider__button {
    margin: auto auto 0;
  }

  .description {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 52px 0 0;
  }

  .description::after {
    display: block;
    height: 56px;
  }

  .description__content {
    max-width: none;
    max-width: initial;
    padding: 0;
  }

  .description__content.inline {
    display: block;
  }

    .description__content.inline > h1 {
      text-align: center;
    }

  .headline__scroll {
    height: 34px;
  }

  .headline__scroll.index {
    width: 600px;
    height: 42px;
  }

  .description__headline.about {
    margin: 0 auto;
    text-align: center;
  }

  .description__illustration {
    position: relative;
    width: calc(100% - 80px);
    height: 316px;
    max-height: 50vh;
    margin-top: 64px;
  }

  .description__button {
    width: 279px;
    max-width: 279px;
    min-width: 279px;
  }

  .contacts__down {
    margin-left: -14px;
    border: 0;
  }

  .page-header__contacts .contacts__social {
    display: none;
  }

  .page-header__about {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    height: -moz-max-content;
    height: max-content;
    flex-flow: column nowrap;
  }

    .page-header__about > img {
      width: calc(100vw - 40px);
      width: var(--container-width-576);
      height: calc((100vw - 40px)* 0.8);
      height: calc(calc(100vw - 40px)* 0.8);
      height: calc(var(--container-width-576)* 0.8);
      max-width: 385px;
      max-height: 308px;
      border-radius: 16px;
    }

  .page-header__about-block {
    margin-top: calc(100% - 100px);
    width: 255px;
    padding: 37px 12px;
  }

    .page-header__about-block > svg {
      min-width: 16px;
      height: 32px;
    }

    .page-header__about-block > h2 {
      font-size: 20px;
      line-height: 28px;
    }

    .page-header__about-block span.decorative {
      font-size: 22px;
      line-height: 28px;
    }
}

@media (max-width: 576px) {
  .description__illustration {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    height: 300px;
    margin-top: 12px;
    background: url("../../../img/index-top-pic-mobile.jpg") left no-repeat;
    background-size: cover;
  }

  .description__button {
    min-width: calc(100vw - 40px);
    min-width: var(--container-width-576);
    width: 100%;
  }
    .description__text-wrapper > button {
      margin-top: 12px;
    }

  .description__text {
    font-size: 12px;
    line-height: 17px;
  }

  .page-header__curve {
    background: url("../../../img/header-curve-mobile.svg");
    width: 100vw;
    background-size: cover;
    height: calc(100vw / 4.62);
    margin-top: calc(-1* 100vw / 4.62 / 1.5);
  }

  .page-header__curve.franchise {
    background: url("../../../img/franchise/curve-mobile.svg") no-repeat;
    background-size: cover;
  }

  .description__content.inline {
    display: flex;
    flex-flow: column;
    align-items: center;
    gap: 0;
  }

    .description__content.inline > .description__headline.about {
      max-width: none;
      max-width: initial;
      width: auto;
      width: initial;

    }

    .description__content.inline > .headline__scroll > .about {
      max-width: 220px;
    }

  .headline__scroll.index {
    width: 300px;
    height: 68px;
  }

  .description__illustration.promo {
    padding: 15px 20px;
  }

  .description__town {
    width: 230px;
    height: 42px;
  }

    .description__town > h2 {
      font-size: 18px;
    }

    .description__town > svg {
      width: 24px;
      height: 24px;
    }

  .description__opening {
    font-size: 40px;
    line-height: 32px;
  }

  .description__button.promo {
    position: static;
    position: initial;
  }

  .description__button.promo:not(.outside) {
    display: block;
    width: 100%;
    margin-top: 0;
    margin-top: initial;
    margin-bottom: 80px;
    max-width: none;
    max-width: initial;
    min-width: 0;
    min-width: initial;
  }

  .description__button.promo.outside {
    display: none;
  }
}

@media (max-width: 400px) {
  .nav__burger.telegram.booking {
    margin-left: 12px;
  }
}

@media (max-width: 375px) {
  .nav__burger.telegram.booking {
    margin-left: 0;
  }
}

@media (max-width: 330px) {
  .description__headline.about {
    word-spacing: -6px;
  }
}
/* MAIN */

.location .page-main {
  padding: 0;
}

.inner .page-main {
  padding: 88px 0;
  min-height: calc(100vh - 88px);
}

.page-main__container {
  position: relative;
  z-index: 4;
}

.section__headline {
  text-align: center;
  margin-bottom: 60px;
  margin-bottom: var(--in-section-gap);
}

/* MAIN -> intro */

.location .intro {
  padding-bottom: 0;
}

.intro {
  margin-top: 40px;
  margin-bottom: 100px;
}

.intro__text {
  margin-bottom: 78px;
  display: flex;
  flex-flow: column;
}

.intro__text > h2.mobile {
    display: none;
  }

.intro__text:last-child {
  margin-bottom: 0;
}

.intro__text .headline:nth-child(1) {
  align-self: flex-start;
}

.intro__text .headline:nth-child(2) {
  align-self: flex-end;
}

.intro__text .headline:nth-child(3) {
  align-self: center;
}

.intro__features {
  max-width: 1073px;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  row-gap: 40px;
}

.features__card {
  position: relative;
  width: 331px;
  height: 331px;
  max-width: 331px;
  max-height: 331px;
  border-radius: 16px;
}

.features__card:nth-child(3) {
    transform: rotate(-7deg);
  }

.features__card:nth-child(4) {
    z-index: 0;
  }

.features__card:nth-child(7) {
    transform: rotate(7deg);
  }

.features__card:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.3) 60%, #f06724 105%);
    background: linear-gradient(rgba(0, 0, 0, 0.3) 60%, var(--feature-color) 105%);
    transition: opacity linear 200ms;
    border-radius: 16px;
  }

.features__card:hover:after,.features__card:active:after {
    opacity: 0;
    transition: opacity linear 200ms;
  }

.features__card:hover .features__card--text,.features__card:active .features__card--text {
    opacity: 0;
  }

.features__card:hover > .features__card--top > img,.features__card:active > .features__card--top > img {
    filter: none;
    -ms-filter: none;
    -webkit-filter: none;
  }

.features__card:hover > .features__card--bottom,.features__card:active > .features__card--bottom {
    opacity: 1;
  }

.features__card:nth-child(2):hover > .features__card--bottom,.features__card:nth-child(2):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card:nth-child(3):hover > .features__card--bottom,.features__card:nth-child(3):active > .features__card--bottom {
    transform: translateY(-130px) translateX(-20px) rotate(4deg);
  }

.features__card:nth-child(4):hover > .features__card--bottom,.features__card:nth-child(4):active > .features__card--bottom {
    transform: translateY(-170px) translateX(15px) rotate(-7deg);
  }

.features__card:nth-child(5):hover > .features__card--bottom,.features__card:nth-child(5):active > .features__card--bottom {
    transform: translateY(-170px) translateX(10px) rotate(-7deg);
  }

.features__card:nth-child(6):hover > .features__card--bottom,.features__card:nth-child(6):active > .features__card--bottom {
    transform: translateY(-160px) translateX(15px) rotate(-7deg);
  }

.features__card:nth-child(7):hover > .features__card--bottom,.features__card:nth-child(7):active > .features__card--bottom {
    transform: translateY(-130px) translateX(-15px) rotate(3deg);
  }

.features__card.kazan:nth-child(2):hover > .features__card--bottom,.features__card.kazan:nth-child(2):active > .features__card--bottom {
    transform: translateY(-170px) translateX(15px) rotate(-7deg);
  }

.features__card.kazan:nth-child(3):hover > .features__card--bottom,.features__card.kazan:nth-child(3):active > .features__card--bottom {
    transform: translateY(-130px) translateX(-20px) rotate(4deg);
  }

.features__card.kazan:nth-child(4):hover > .features__card--bottom,.features__card.kazan:nth-child(4):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card.kazan:nth-child(5):hover > .features__card--bottom,.features__card.kazan:nth-child(5):active > .features__card--bottom {
    transform: translateY(-150px) translateX(10px) rotate(-7deg);
  }

.features__card.kazan:nth-child(6):hover > .features__card--bottom,.features__card.kazan:nth-child(6):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card.kazan:nth-child(7):hover > .features__card--bottom,.features__card.kazan:nth-child(7):active > .features__card--bottom {
    transform: translateY(-135px) translateX(-15px) rotate(3deg);
  }

.features__card.samara:nth-child(2):hover > .features__card--bottom,.features__card.samara:nth-child(2):active > .features__card--bottom {
    transform: translateY(-150px) translateX(15px) rotate(-7deg);
  }

.features__card.samara:nth-child(3):hover > .features__card--bottom,.features__card.samara:nth-child(3):active > .features__card--bottom {
    transform: translateY(-150px) translateX(-20px) rotate(4deg);
  }

.features__card.samara:nth-child(4):hover > .features__card--bottom,.features__card.samara:nth-child(4):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card.samara:nth-child(5):hover > .features__card--bottom,.features__card.samara:nth-child(5):active > .features__card--bottom {
    transform: translateY(-190px) translateX(10px) rotate(-7deg);
  }

.features__card.samara:nth-child(6):hover > .features__card--bottom,.features__card.samara:nth-child(6):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card.samara:nth-child(7):hover > .features__card--bottom,.features__card.samara:nth-child(7):active > .features__card--bottom {
    transform: translateY(-130px) translateX(-15px) rotate(3deg);
  }

.features__card.izhevsk:nth-child(2):hover > .features__card--bottom,.features__card.izhevsk:nth-child(2):active > .features__card--bottom {
    transform: translateY(-115px) translateX(15px) rotate(-7deg);
  }

.features__card.izhevsk:nth-child(3):hover > .features__card--bottom,.features__card.izhevsk:nth-child(3):active > .features__card--bottom {
    transform: translateY(-135px) translateX(-20px) rotate(4deg);
  }

.features__card.izhevsk:nth-child(4):hover > .features__card--bottom,.features__card.izhevsk:nth-child(4):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card.izhevsk:nth-child(5):hover > .features__card--bottom,.features__card.izhevsk:nth-child(5):active > .features__card--bottom {
    transform: translateY(-190px) translateX(10px) rotate(-7deg);
  }

.features__card.izhevsk:nth-child(6):hover > .features__card--bottom,.features__card.izhevsk:nth-child(6):active > .features__card--bottom {
    transform: translateY(-130px) translateX(15px) rotate(-7deg);
  }

.features__card.izhevsk:nth-child(7):hover > .features__card--bottom,.features__card.izhevsk:nth-child(7):active > .features__card--bottom {
    transform: translateY(-130px) translateX(-15px) rotate(3deg);
  }

.features__card.ekt:nth-child(2):hover > .features__card--bottom,.features__card.ekt:nth-child(2):active > .features__card--bottom {
    transform: translateY(-230px) translateX(15px) rotate(-7deg);
  }

.features__card.ekt:nth-child(3):hover > .features__card--bottom,.features__card.ekt:nth-child(3):active > .features__card--bottom {
    transform: translateY(-90px) translateX(-20px) rotate(4deg);
  }

.features__card.ekt:nth-child(4):hover > .features__card--bottom,.features__card.ekt:nth-child(4):active > .features__card--bottom {
    transform: translateY(-120px) translateX(15px) rotate(-7deg);
  }

.features__card.ekt:nth-child(5):hover > .features__card--bottom,.features__card.ekt:nth-child(5):active > .features__card--bottom {
    transform: translateY(-160px) translateX(10px) rotate(-7deg);
  }

.features__card.ekt:nth-child(6):hover > .features__card--bottom,.features__card.ekt:nth-child(6):active > .features__card--bottom {
    transform: translateY(-140px) translateX(15px) rotate(-7deg);
  }

.features__card.ekt:nth-child(7):hover > .features__card--bottom,.features__card.ekt:nth-child(7):active > .features__card--bottom {
    transform: translateY(-95px) translateX(-15px) rotate(3deg);
  }

.features__card:nth-child(2)  > .features__card--bottom {
    z-index: 1;
  }

.features__card:nth-child(3)  > .features__card--bottom {
    z-index: 1;
  }

.features__card:nth-child(4)  > .features__card--bottom {
    z-index: 1;
  }

.features__card:nth-child(2) img {
    z-index: 2;
  }

.features__card:nth-child(3) img {
    z-index: 2;
  }

.features__card:nth-child(4) img {
    z-index: 2;
  }

.features__card:nth-child(2):after {
    z-index: 3;
  }

.features__card:nth-child(3):after {
    z-index: 3;
  }

.features__card:nth-child(4):after {
    z-index: 3;
  }

.features__card:nth-child(2) .features__card--text {
    z-index: 4;
  }

.features__card:nth-child(3) .features__card--text {
    z-index: 4;
  }

.features__card:nth-child(4) .features__card--text {
    z-index: 4;
  }

.features__card:nth-child(5)  > .features__card--bottom {
    z-index: 4;
  }

.features__card:nth-child(6)  > .features__card--bottom {
    z-index: 4;
  }

.features__card:nth-child(7)  > .features__card--bottom {
    z-index: 4;
  }

.features__card:nth-child(5) img {
    z-index: 5;
  }

.features__card:nth-child(6) img {
    z-index: 5;
  }

.features__card:nth-child(7) img {
    z-index: 5;
  }

.features__card:nth-child(5):after {
    z-index: 6;
  }

.features__card:nth-child(6):after {
    z-index: 6;
  }

.features__card:nth-child(7):after {
    z-index: 6;
  }

.features__card:nth-child(5) .features__card--text {
    z-index: 7;
  }

.features__card:nth-child(6) .features__card--text {
    z-index: 7;
  }

.features__card:nth-child(7) .features__card--text {
    z-index: 7;
  }

.features__card--text {
  position: absolute;
  color: white;
  margin-top: 241px;
  margin-left: 40px;
  width: 225px;
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 18px;
  line-height: 25px;
  font-weight: bold;
  transition: opacity linear 200ms;
}

.features__card--text.wide {
  width: 240px;
}

.features__card--top {
  width: 100%;
  height: 100%;
  border-radius: 16px;
  overflow: hidden;
}

.features__card--top  > img {
    position: relative;
    width: 331px;
    height: 331px;
    -o-object-fit: cover;
       object-fit: cover;
    filter: blur(4px);
    -ms-filter: blur(4px);
    -webkit-filter: blur(4px);
    transition: filter linear 200ms;
    transition: -ms-filter linear 200ms;
    border-radius: 16px;
  }

.features__card--bottom {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: white;
  border: #FF945F 2px solid;
  border: var(--feature-color-2) 2px solid;
  z-index: -1;
  opacity: 0;
  padding: 24px;
  padding: var(--basic-gap);
  transition: transform linear 300ms, opacity linear 200ms;
}

.features__card--bottom  > .text {
    font-family: "Verdana", "Helvetica", sans-serif;
    line-height: 20px;
  }

/* MAIN -> differences */

.differences {
  position: relative;
  margin-bottom: 100px;
}

.differences__container {
  width: 1030px;
  margin-bottom: 60px;
  margin-bottom: var(--in-section-gap);
  display: grid;
  grid-template-rows: 28px repeat(6, 108px) 28px;
  grid-row-gap: 20px;
  position: relative;
}

.differences__container--overlay {
  width: 1030px;
  height: calc(844px - 20px);
  margin-top: 20px;
  display: grid;
  grid-template-columns: 380px 270px 380px;
  position: absolute;
}

.differences__container--overlay-image {
  background-image: url(../../../img/differences-middle.jpg);
  width: 100%;
  height: 100%;
  background-size: cover;
  border-radius: 16px;
}

.differences__row {
  display: grid;
  grid-template-columns: 380px 270px 380px;
  grid-template-areas: "left middle right";
  font-size: 20px;
  line-height: 28px;
  text-align: center;
}

.differences__row  > .difference.left,.differences__row  > .difference.right {
    filter: drop-shadow(2px 4px 10px rgba(204, 204, 204, 0.3));
    transition: background-color linear 200ms;
  }

.differences__row  > .left,.differences__row  > .right {
    background-color: white;
  }

.differences__row  > .left,.differences__row  > .middle,.differences__row  > .right {
    width: 100%;
    height: 100%;
  }

.differences__row  > .left {
    grid-area: left;
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
  }

.differences__row  > .middle {
    grid-area: middle;
    justify-content: space-between;
  }

.differences__row  > .middle > div.text {
    font-family: "Mont", "Helvetica", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 25px;
    color: white;
  }

.differences__row  > .right {
    grid-area: right;
    border-top-right-radius: 16px;
    border-bottom-right-radius: 16px;
  }

.differences__row  > .differences__header {
    font-family: "Mont", "Helvetica", sans-serif;
    font-weight: bold;
  }

.differences__row  > .difference {
    font-family: "Verdana", "Helvetica", sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 21px;
  }

.differences__row:hover > .difference.left {
    background-color: #DDDDDD;
  }

.differences__row:hover > .difference.right {
    background-color: #FDD17C;
  }

/* MAIN -> amenities */

.amenities .headline.mobile {
    display: none;
  }

.amenities__items {
  width: 100%;
  display: grid;
  grid-template-rows: repeat(2, 238px);
  grid-template-columns: repeat(4, 176px);
  grid-auto-flow: row;
  grid-row-gap: 40px;
  row-gap: 40px;
  justify-content: space-between;
}

.amenities__items.kazan {
  grid-template-rows: repeat(2, 1fr);
  grid-template-columns: repeat(5, 176px);
}

.amenities__items.kazan .amenities__item--circle {
    width: 176px;
    height: 176px;
  }

.amenities__items.izhevsk {
  grid-template-rows: repeat(2, 1fr);
  grid-template-columns: repeat(6, 176px);
}

.amenities__items.izhevsk .amenities__item--circle {
    width: 130px;
    height: 130px;
  }

.amenities__item {
  display: flex;
  flex-flow: column;
  align-items: center;
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 18px;
  line-height: 25px;
  font-weight: bold;
  text-align: center;
  opacity: 0;
  transition: opacity linear 400ms;
  transition: opacity linear var(--amenities-animation-duration);
}

.amenities__item:nth-child(2) {
    transition-delay: 400ms;
    transition-delay: var(--amenities-animation-duration);
  }

.amenities__item:nth-child(3) {
    transition-delay: calc(400ms * 2);
    transition-delay: calc(var(--amenities-animation-duration) * 2);
  }

.amenities__item:nth-child(4) {
    transition-delay: calc(400ms * 3);
    transition-delay: calc(var(--amenities-animation-duration) * 3);
  }

.amenities__item:nth-child(5) {
    transition-delay: calc(400ms * 4);
    transition-delay: calc(var(--amenities-animation-duration) * 4);
  }

.amenities__item:nth-child(6) {
    transition-delay: calc(400ms * 5);
    transition-delay: calc(var(--amenities-animation-duration) * 5);
  }

.amenities__item:nth-child(7) {
    transition-delay: calc(400ms * 6);
    transition-delay: calc(var(--amenities-animation-duration) * 6);
  }

.amenities__item:nth-child(8) {
    transition-delay: calc(400ms * 7);
    transition-delay: calc(var(--amenities-animation-duration) * 7);
  }

.amenities__item:nth-child(9) {
    transition-delay: calc(400ms * 8);
    transition-delay: calc(var(--amenities-animation-duration) * 8);
  }

.amenities__item:nth-child(10) {
    transition-delay: calc(400ms * 9);
    transition-delay: calc(var(--amenities-animation-duration) * 9);
  }

.amenities__item:nth-child(11) {
    transition-delay: calc(400ms * 10);
    transition-delay: calc(var(--amenities-animation-duration) * 10);
  }

.amenities__item:nth-child(12) {
    transition-delay: calc(400ms * 11);
    transition-delay: calc(var(--amenities-animation-duration) * 11);
  }

.amenities__item--circle {
  display: flex;
  align-items: center;
  width: 176px;
  height: 176px;
  border-radius: 88px;
  background-color: #f06724;
  background-color: var(--feature-color);
  margin-bottom: 22px;
}

.amenities__item--circle  > svg {
    margin: 0 auto;
  }

.amenities__item--circle.sofa  > svg {
    margin: -11px auto 0;
  }

.tour {
  position: relative;
  height: 702px;
}

.tour > img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    -o-object-fit: none;
       object-fit: none;
    -o-object-position: top;
       object-position: top;
    height: 691px;
  }

.tour.ekt {
  margin-top: 90px;
}

.tour__headline {
  font-size: 36px;
  font-weight: 600;
  line-height: 46px;
  margin-bottom: 0;
}

.tour__headline-scroll {
  width: 320px;
  height: 46px;
  overflow: hidden;
}

.tour__headline-scroll  > p {
    background: linear-gradient(0deg, #f06724, #FF945F);
    background: linear-gradient(0deg, var(--feature-color), var(--feature-color-2));
    background: -webkit-linear-gradient(0deg, var(--feature-color), var(--feature-color-2));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: headline-scroll-3 5s linear infinite;
  }

.tour__wrapper {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
}

.tour__wrapper--overlay {
  position: absolute;
  top: 0;
  left: 0;
}

.tour__body {
  position: relative;
  display: grid;
  height: calc(702px - 92px);
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 1fr 1fr;
  grid-column-gap: 30px;
  grid-column-gap: var(--grid-gap);
}

.tour__body--text {
  grid-row: 2 / 3;
  grid-column: 3 / span 4;
  font-family: "Verdana", "Helvetica", sans-serif;
  font-size: 14px;
  line-height: 20px;
  justify-self: center;
  padding-left: 20px;
}

.tour__body--text > h4 {
    font-family: "Mont", "Helvetica", sans-serif;
    width: -moz-max-content;
    width: max-content;
    margin: 0;
  }

.tour__body--form {
  position: absolute;
  top: 125px;
  grid-row: 1 / 3;
  grid-column: 8 / span 4;
}

.book {
  margin-top: 100px;
}

.book__wrapper {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
}

.book__headline {
  width: 820px;
  margin-bottom: 60px;
}

.book__images {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 12px;
  opacity: 0;
  transition: opacity linear 0.3s;
}

.book__images img,.book__images picture {
    border-radius: 8px;
  }

.book__images img:nth-child(2) {
    display: block;
  }

.book__images img:nth-child(3) {
    display: none;
  }

.book__images img[src="img/book-3.svg"] {
    display: block;
    height: 285px;
    margin-top: -49px;
  }

.book__images img[src="img/book-3-tablet.svg"] {
    display: none;
  }

.book__images img[src="img/book-3.svg"]:active {
    transform: scale(0.95);
  }

.book__conference-rooms_heading {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  margin-top: 48px;
  background-color: #f06724;
  background-color: var(--feature-color);
  border-radius: 16px;
  height: 148px;
  filter: drop-shadow(2px 4px 10px #ccc);
}

.book__conference-rooms_heading > h2 {
    font-size: 32px;
    line-height: 45px;
    color: white;
    font-weight: 600;
    font-family: "Mont", "Helvetica", sans-serif;
  }

.book_conference-rooms_buttons {
  display: flex;
  justify-content: center;
  margin: -27px;
}

.book_conference-rooms_buttons > form > * {
    height: 54px;
    width: 200px;
    border-radius: 4px;
    border: none;
  }

.book_conference-rooms_buttons > form > select,.book_conference-rooms_buttons > form > input {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 5L8 11L2 5' stroke='%23F06724' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position-x: calc(100% - 10px);
    background-position-y: 19px;
    padding: 0 10px;
    font-family: "Verdana", "Helvetica", sans-serif;
    font-size: 12px;
    color: #333333;
    color: var(--copy-color);
    position: relative;
    outline: none;
  }

.book_conference-rooms_buttons > form > select[name="city"]::before {
    content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 14.6666C8 14.6666 13 10.6666 13 6.33331C13 3.57188 10.7614 1.33331 8 1.33331C5.23857 1.33331 3 3.57188 3 6.33331C3 10.6666 8 14.6666 8 14.6666Z' stroke='%23F06724' stroke-linejoin='round'/%3E%3Cpath d='M8 8.33331C9.10457 8.33331 10 7.43788 10 6.33331C10 5.22875 9.10457 4.33331 8 4.33331C6.89543 4.33331 6 5.22875 6 6.33331C6 7.43788 6.89543 8.33331 8 8.33331Z' stroke='%23F06724' stroke-linejoin='round'/%3E%3C/svg%3E");
    position: absolute;
    left: 0;
    top: 19px;
    transform: translateY(-50%);
  }

.book_conference-rooms_buttons > form > input::-moz-placeholder {
    color: #333333;
    color: var(--copy-color);
    opacity: 1;
  }

.book_conference-rooms_buttons > form > input::placeholder {
    color: #333333;
    color: var(--copy-color);
    opacity: 1;
  }

.book__button {
  background: #FFB700;
  background: var(--secondary-feature-color-2);
  height: 54px;
}

.book__button:hover,.book__button:focus {
    background: linear-gradient(180deg, #F38133 0%, #F7A045 60%, #FCC55B 100%);
  }

.residents {
  margin-top: 150px;
}

.residents__wrapper {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
  position: relative;
}

.residents__wrapper .headline {
    width: 580px;
    text-align: center;
    margin: 0 auto;
  }

.residents__overview {
  margin-top: 22px;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.residents__overview > div.image {
    width: 379px;
    height: 144px;
    background-size: contain !important;
    background-repeat: no-repeat !important;
  }

.residents__overview > div.image > div.text {
    display: none;
  }

.residents__overview > div.image:nth-child(1) {
    background: url("../../../img/vinyl/residents-1.svg");
  }

.residents__overview > div.image:nth-child(2) {
    background: url("../../../img/vinyl/residents-2.svg");
  }

.residents__overview > div.image:nth-child(3) {
    background: url("../../../img/vinyl/residents-3.svg");
  }

.residents__overview > div.image:nth-child(4) {
    background: url("../../../img/vinyl/residents-4.svg");
  }

.residents__overview > div.image:nth-child(5) {
    background: url("../../../img/vinyl/residents-5.svg");
  }

.residents__overview > div.image:nth-child(6) {
    background: url("../../../img/vinyl/residents-6.svg");
  }

.residents__pictures {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  margin-top: 100px;
}

.residents__pictures > img {
    width: 209px;
    height: 248px;
  }

.residents__pictures > img:nth-child(1) {
    margin-top: 48px;
  }

.residents__pictures > img:nth-child(2) {
    margin-top: 154px;
  }

.residents__pictures > img:nth-child(3) {
    margin-top: 55px;
  }

.residents__pictures > img:nth-child(4) {
    margin-top: 105px;
  }

.residents__overlay {
  z-index: -1;
  margin-top: -40px;
  position: absolute;
  left: 100px;
  top: 0;
  width: 884px;
  height: 884px;
  animation: circles 5s infinite;
}

.residents__overlay > img {
    position: absolute;
    top: calc(884px / 2 - 318px / 2);
    left: calc(884px / 2 - 318px / 2);
    animation: vinyl 5s linear infinite;
  }

.companies {
  margin-top: 110px;
}

.companies__wrapper {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

.companies__wrapper > .headline {
    margin: 0 auto;
  }

.companies__wrapper > .headline:nth-child(1) {
    margin-bottom: 0;
  }

.companies__wrapper > .headline > svg {
    float: left;
    margin-right: 15px;
    margin-top: 7px;
  }

.companies__scroll {
  margin-top: 60px;
  display: flex;
  flex-flow: row nowrap;
  animation: companies-scroll 15s linear infinite;
}

.become-resident {
  margin-top: 100px;
}

.become-resident__wrapper {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
}

.become-resident__flex {
  display: flex;
}

.become-resident__flex > img {
    border: 7px solid #FBAE19;
    border: 7px solid var(--yellow-color);
    border-radius: 200px;
    box-sizing: border-box;
    width: 326px;
    transition: border 200ms ease-in;
  }

.become-resident__flex > img.hover {
    border: 7px solid #f06724;
    border: 7px solid var(--feature-color);
  }

.become-resident__flex-button {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
}

.become-resident__flex-button > div.flex-button__text {
    width: 838px;
    height: 216px;
    background-color: #FBAE19;
    background-color: var(--yellow-color);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    margin-left: -55px;
    z-index: -1;
    transition: background-color 200ms ease-in;
  }

.become-resident__flex-button > div.flex-button__text.hover {
    background-color: #f06724;
    background-color: var(--feature-color);
  }

.become-resident__flex-button .heading {
    font-family: "Mont", "Helvetica", sans-serif;
    text-align: center;
  }

.become-resident__flex-button .heading:not(.index) {
    width: 500px;
  }

.become-resident__flex-button > div.flex-button__btn {
    margin-top: -35px;
  }

.become-resident__flex-button button {
    width: 300px;
    outline: 5px solid white;
  }

.contacts {
  margin-top: 150px;
}

.contacts__wrapper {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
}

.contacts__wrapper > .contacts__headline {
    margin-bottom: 50px;
  }

.contacts__wrapper > #yandex-map {
    width: 100%;
    height: 400px;
  }

.contacts__wrapper #yandex-map > iframe {
    border-radius: 16px;
  }

.contacts__towns {
  margin-top: 40px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.contacts__towns.one {
  margin-top: 0;
}

.contacts__town {
  display: flex;
  flex-flow: column nowrap;
  width: 258px;
}

.town__buttons {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.town__buttons > a:nth-child(1) {
    width: 200px;
  }

.town__buttons > a:nth-child(2) {
    width: 54px;
  }

.town__description {
  margin-top: 24px;
  display: flex;
  flex-flow: column nowrap;
}

.town__description-row {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  font-family: "Verdana", "Helvetica", sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.town__description-row:not(:last-child) {
    margin-bottom: 6px;
  }

.description-row__text {
  margin-left: 10px;
}

.follow {
  margin-top: 40px;
}

.follow__wrapper {
  width: 1110px;
  width: var(--container-width);
  margin: 0 auto;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  row-gap: 32px;
}

.follow__card {
  display: flex;
  flex-flow: column nowrap;
  height: 200px;
  border-radius: 16px;
  padding: 40px;
  gap: 17px;
  filter: drop-shadow(2px 4px 10px rgba(204, 204, 204, 0.3));
}

.follow__card.small-gap {
    gap: 10px;
  }

.follow__card:nth-child(3) {
  width: 635px;
  background: #333333;
  background: var(--copy-color);
  color: white;
}

.follow__card:nth-child(4) {
  width: 445px;
  background: white;
}

.follow__card:nth-child(1) {
  width: 445px;
  background: white;
}

.follow__card:nth-child(2) {
  width: 635px;
  background: #333333;
  background: var(--copy-color);
  color: white;
}

.follow__card > button {
  width: 300px;
}

.follow__card > a {
  font-size: 18px;
}

.follow__card-buttons {
  display: flex;
  flex-flow: row nowrap;
  gap: 6px;
}

.follow__card-text {
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 18px;
  line-height: 25px;
  font-weight: 600;
  width: 215px;
}

.follow__card-text.title {
    font-size: 22px;
    line-height: 31px;
  }

.follow__card-text.bold {
    font-weight: 700;
  }

.follow__card-text.wide {
    width: 100%;
  }

.intro__column {
  width: 520px;
  max-width: 46%;
}

.intro__column--border {
  position: relative;
  padding-left: 28px;
}

.intro__column--border::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 4px;
  height: calc(100% - 12px);
  margin: auto;
  background-color: #333333;
  background-color: var(--copy-color);
}

/* MAIN -> glide bullets */

.glide__bullet {
  position: relative;
}

.glide__bullet::after {
  content: "";
  position: absolute;
  top: 0;
  left: 99%;
  bottom: 0;
  width: 100%;
  background-color: inherit;
  transform: scaleX(0);
  transition: transform 0.2s ease-in;
}

.glide__bullet--switching:not(:last-child)::after {
  transform: scaleX(1);
  transform-origin: left;
}

.glide__bullet--switching-back:not(:first-child)::after {
  transform: scaleX(1);
  right: 99%;
  left: auto;
  left: initial;
  transform-origin: right;
}

/* MAIN -> rooms */

.rooms {
  position: relative;
  padding-bottom: 0;
}

.rooms__content {
  position: relative;
}

.rooms__headline {
  max-width: 568px;
}

.rooms__slider {
  margin-top: 80px;
}

.location .rooms__slider {
  margin-top: 0;
}

.rooms__slider .rooms__track {
  position: relative;
  overflow: visible;
}

.rooms__slides-list {
  display: flex;
  cursor: grab;
}

.rooms__slide {
  position: relative;
}

.rooms__pic-wrapper {
  height: 100%;
}

.rooms__pic {
  width: 100%;
  height: 100%;
  max-height: 580px;
  -o-object-fit: cover;
     object-fit: cover;
}

.rooms__caption-text {
  background-image: url("data:image/svg+xml,%3Csvg width='19' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23F06724' d='M1 13h14v2H1z'/%3E%3Cpath d='M2 2h12v3A6 6 0 012 5V2zM14 4h2.5a1.5 1.5 0 010 3H14V4z' stroke='%23F06724' stroke-width='2'/%3E%3C/svg%3E");
  z-index: 2;
}

.rooms__caption-text--room {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 8H5v2h10V8z' fill='%23F06724'/%3E%3Cpath d='M11 9H9v11h2V9zM1 2a2 2 0 104 0 2 2 0 00-4 0zM15 2a2 2 0 104 0 2 2 0 00-4 0zM3 5H1v9h3v6h2v-8H3V5zM17 5v7h-3v8h2v-6h3V5h-2z' fill='%23F06724'/%3E%3C/svg%3E");
}

.rooms__caption-text--work {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0)'%3E%3Cpath d='M1 12a1 1 0 011-1h16a1 1 0 110 2H2a1 1 0 01-1-1zM9 13h2v7H9z' fill='%23F06724'/%3E%3Cpath d='M4 13V4a3 3 0 013-3h6a3 3 0 013 3v9' stroke='%23F06724' stroke-width='2'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.586 20l5.707-5.707L10 15l.707-.707L16.414 20h-2.828L10 16.414 6.414 20H3.586z' fill='%23F06724'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.rooms__caption-text--cabins {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 2H4v16h12V2zM4 0H2v20h16V0H4z' fill='%23F06724'/%3E%3Cpath fill='%23F06724' d='M0 18h20v2H0z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 8a2 2 0 012-2h2v2h-2v4h2v2h-2a2 2 0 01-2-2V8z' fill='%23F06724'/%3E%3C/svg%3E");
}

.rooms__caption-text--chill {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10h2v2h2V4H9v4H5v4h2v-2z' fill='%23F06724'/%3E%3Cpath d='M0 0v16h16V0H0zm14 14H2V2h12v12z' fill='%23F06724'/%3E%3C/svg%3E");
}

.rooms__caption-text--gym {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17 18l-6-5V8l5.5-3.5M3 18l6-5V8L3.5 4.5' stroke='%23F06724' stroke-width='2'/%3E%3Ccircle cx='10' cy='3' r='2' fill='%23F06724'/%3E%3C/svg%3E");
}

/* MAIN -> slider footer */

.slider-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 56px;
  margin-right: -14px;
  padding: 12px 0;
}

.slider-footer__counter {
  margin-right: 120px;
  font-size: 16px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.4);
}

.slider-footer__counter span {
  margin: 0 8px;
}

.slider-footer__index {
  color: #000000;
}

.slider-footer__bullets {
  display: flex;
  flex-grow: 1;
  background-color: rgba(36, 36, 36, 0.1);
  overflow: hidden;
}

.slider-footer__bullet {
  width: 24px;
  flex-grow: 1;
  height: 2px;
  display: block;
  background-color: rgba(255, 255, 255, 0);
}

.slider-footer__bullet.glide__bullet--active {
  background-color: #242424;
}

.slider-footer__bullet--tablet,
.slider-footer__bullet--mobile {
  display: none;
}

.slider-footer__controls {
  margin-left: 38px;
}

/* MAIN -> meetups */

.meetups {
  padding-top: 0;
}

.meetups__illustration {
  width: 100%;
  height: 513px;
  -o-object-fit: cover;
     object-fit: cover;
  margin-bottom: -90px;
}

.meetups__wrapper {
  position: relative;
  width: 1432px;
  max-width: calc(100% - (2 * 24px));
  max-width: calc(100% - (2 * var(--basic-gap)));
  margin: 0 auto;
  padding: 80px 0;
  background-color: #e4f4fe;
}

.meetups__container {
  max-width: calc(100% - 72px);
}

.meetups__text {
  margin-bottom: 20px;
}

.meetups__text:last-child {
  margin-bottom: 0;
}

/* MAIN -> events */

.events {
  padding: 42px 0 0;
  z-index: 2;
}

.location .events {
  position: relative;
  background-color: #f9f9f9;
}

.location .events::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 211px;
  background-color: inherit;
}

.events__headline {
  max-width: 640px;
}

.events__text {
  max-width: 800px;
}

.events__slider .events__track {
  position: relative;
  overflow: visible;
}

.events__slides-list {
  display: flex;
  align-items: stretch;
  margin-top: 80px;
  cursor: grab;
}

.events__slide {
  position: relative;
  flex-shrink: 0;
  width: 496px;
  height: 396px;
  margin-right: 24px;
  background-color: #333333;
  outline: 0;
  overflow: hidden;
}

.events__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 36px 36px 110px;
}

.events__tag {
  max-width: 66%;
  padding: 15px 20px 14px;
  font-weight: 600;
  font-size: 16px;
  line-height: 19px;
  color: #ffffff;
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.events__tag--pics {
  max-width: 30%;
  padding-left: 52px;
  background-image: url("../../../img/pic.svg");
  background-repeat: no-repeat;
  background-position: 18px center;
  background-size: 20px 20px;
}

.events__pic-wrapper {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.events__pic {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.25s ease-in;
}

.events__slide:hover .events__pic,
.events__slide:focus .events__pic {
  transform: scale(1.03);
}

.events__slide:hover .events__icons {
  transform: translateX(119px);
}

.events__caption-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.events__caption-text--work {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0)'%3E%3Cpath d='M0 11a1 1 0 011-1h14a1 1 0 110 2H1a1 1 0 01-1-1z' fill='%23F06724'/%3E%3Cpath fill='%23F06724' d='M7 10h2v6H7z'/%3E%3Cpath d='M3 10V4a3 3 0 013-3h4a3 3 0 013 3v6' stroke='%23F06724' stroke-width='2'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.585 16L8 13.415 5.415 16H2.585l4.707-4.707L8 12l.707-.707L13.414 16h-2.829z' fill='%23F06724'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Cpath fill='%23fff' d='M0 0h16v16H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.events__caption-text--rooms {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 7H4v2h8V7zM9 9H7v7h2V9zM1 2a2 2 0 104 0 2 2 0 00-4 0zM11 2a2 2 0 104 0 2 2 0 00-4 0z' fill='%23F06724'/%3E%3Cpath d='M3 5H1v7h3v4h2v-6H3V5zM13 5v5h-3v6h2v-4h3V5h-2z' fill='%23F06724'/%3E%3C/svg%3E");
}

.events__caption-text--chill {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10h2v2h2V4H9v4H5v4h2v-2z' fill='%23F06724'/%3E%3Cpath d='M0 0v16h16V0H0zm14 14H2V2h12v12z' fill='%23F06724'/%3E%3C/svg%3E");
}

.events__caption-text--events {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.5 15L9 10V7l5-3M1.5 15L7 10V7L2 4' stroke='%23F06724' stroke-width='2'/%3E%3Ccircle cx='8' cy='2' r='2' fill='%23F06724'/%3E%3C/svg%3E");
}

.events__caption-text--lounge {
  background-image: url("data:image/svg+xml,%3Csvg width='19' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23F06724' d='M1 13h14v2H1z'/%3E%3Cpath d='M2 2h12v3A6 6 0 012 5V2zM14 4h2.5a1.5 1.5 0 010 3H14V4z' stroke='%23F06724' stroke-width='2'/%3E%3C/svg%3E");
}

/* MAIN -> organize */

.organize {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 94px;
}

.organize__slider {
  position: relative;
  flex-shrink: 0;
  width: 496px;
  margin-top: 10px;
  margin-right: 104px;
}

.organize__slider .organize__track {
  overflow: hidden;
}

.organize__gallery-list {
  display: flex;
}

.organize__gallery-item {
  position: relative;
}

.organize__gallery-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.organize__footer.slider-footer {
  position: absolute;
  bottom: 36px;
  right: 36px;
  min-height: 0;
  min-height: initial;
  padding: 0;
}


.organize__counter {
  display: none;
}

.organize__controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 24px;
  grid-gap: var(--basic-gap);
}

.organize__control {
  width: 64px;
  height: 64px;
  background-color: #ffffff;
  opacity: 1;
}

.organize__control:disabled {
  opacity: 1;
}

.organize__control svg {
  opacity: 0.5;
  transition: opacity 0.2s ease-out;
}

.organize__control:hover svg,
.organize__control:focus svg {
  opacity: 1;
}

.organize__control:disabled svg {
  opacity: 0.1;
}

.organize__info {
  flex-grow: 1;
}

.organize__headline {
  max-width: 460px;
}

.organize__list {
  margin-top: 56px;
}

.organize__item {
  position: relative;
  margin-bottom: 24px;
  padding-left: 46px;
}

.organize__item:last-child {
  margin-bottom: 0;
}

.organize__pic {
  position: absolute;
  top: 4px;
  left: 0;
}

/* MAIN -> prices */

.location .prices {
  padding-bottom: 88px;
  background-color: #f9f9f9;
}

.prices__wrapper {
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-column-gap: 24px;
  grid-column-gap: var(--basic-gap);
  -moz-column-gap: 24px;
       column-gap: 24px;
  -moz-column-gap: var(--basic-gap);
       column-gap: var(--basic-gap);
}

.prices__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 24px;
  grid-gap: var(--basic-gap);
  gap: 24px;
  gap: var(--basic-gap);
  margin-top: 98px;
  text-align: left;
}

.prices__item {
  display: flex;
  flex-direction: column;
  align-self: start;
  height: 100%;
  max-width: 420px;
  min-height: 412px;
  padding: 32px 36px 36px;
  background-color: #ffffff;
  box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.03);
  transition: box-shadow 0.2s ease-in;
}

.prices__item:hover {
  box-shadow: 0 15px 40px 0 rgba(15, 15, 21, 0.1);
}

.prices__name {
  margin-bottom: 12px;
  font-weight: 800;
  font-size: 22px;
  line-height: 34px;
}

.prices__description {
  margin: 0 -1px 30px;
}

.prices__plans {
  display: flex;
  flex-wrap: wrap;
}

.prices__amount {
  margin-right: 24px;
  margin-right: var(--basic-gap);
  font-size: 14px;
  line-height: 22px;
}

.prices__amount:last-child {
  margin-right: 0;
}

.prices__amount--single-line {
  margin-bottom: 42px;
}

.prices__amount b {
  display: inline;
  vertical-align: baseline;
  font-family: "Mont", "Helvetica", sans-serif;
  font-weight: 800;
  font-size: 22px;
  line-height: 1em;
}

.prices__multiplier {
  position: relative;
  display: inline-block;
  vertical-align: bottom;
  width: 10px;
  height: 12px;
  margin: 0 4px;
}

.prices__multiplier::before,
.prices__multiplier::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #333333;
  transform-origin: center;
}

.prices__multiplier::before {
  transform: rotate(45deg);
}

.prices__multiplier::after {
  transform: rotate(-45deg);
}

.prices__note {
  margin-top: 14px;
}

.prices__footnote {
  margin-top: 38px;
  font-weight: 800;
  font-size: 18px;
  line-height: 28px;
  letter-spacing: 0.01em;
}

.prices__accent {
  margin: 6px 0 36px;
  font-weight: 800;
  font-size: 18px;
  line-height: 34px;
}

.prices__amenities {
  margin: 30px 0 16px;
  padding-top: 30px;
  border-top: 1px solid rgba(51, 51, 51, 0.1);
}

.prices__amenities-item {
  margin-bottom: 12px;
}

.prices__amenities-item svg {
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
}

.prices__button {
  width: 100%;
  margin-top: auto;
}

/* MAIN -> toggler */

.toggler {
  display: flex;
  border: 1px solid #ebebeb;
}

.toggler__label {
  width: 50%;
  padding: 11px 12px;
  font: inherit;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
  background-color: #ffffff;
  border-right: 1px solid #ebebeb;
  cursor: pointer;
  transition: all 0.2s ease-in;
}

.toggler__label:last-of-type {
  border-right: 0;
}

.toggler__input:checked + .toggler__label {
  background-color: rgb(51, 51, 51, 0.04);
}

.toggler__input:not(:checked) + .toggler__label {
  color: rgba(51, 51, 51, 0.6);
}

.toggler__input:not(:checked) + .toggler__label:hover {
  color: #333333;
}

/* MAIN -> speech */

.speech__wrapper {
  position: relative;
  left: 50%;
  display: flex;
  justify-content: space-between;
  width: 100vw;
  padding-right: calc((100vw - 1110px) / 2);
  padding-right: calc((100vw - var(--container-width)) / 2);
  transform: translateX(-50%);
}

.speech__pic {
  margin-right: 104px;
  -o-object-fit: cover;
     object-fit: cover;
}

.speech__headline {
  max-width: 288px;
}

.speech__blockquote {
  margin-bottom: 72px;
}

.speech__text {
  margin-bottom: 22px;
  font-weight: 300;
  font-size: 18px;
  line-height: 28px;
}

.speech__text:last-child {
  margin-bottom: 0;
}

.speech__author {
  display: flex;
  align-items: center;
}

.speech__author-pic {
  width: 64px;
  height: 64px;
  -o-object-fit: cover;
     object-fit: cover;
  margin-right: 36px;
  border-radius: 50%;
}

.speech__author i {
  display: block;
  font-weight: 600;
}

/* MAIN -> guide */

.guide__pic {
  flex-shrink: 0;
  width: 520px;
  max-width: 100%;
  margin-right: 104px;
}

.guide__pic img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.guide__list {
  counter-reset: li;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  grid-column-gap: 24px;
  grid-column-gap: var(--basic-gap);
  -moz-column-gap: 24px;
       column-gap: 24px;
  -moz-column-gap: var(--basic-gap);
       column-gap: var(--basic-gap);
  grid-row-gap: 24px;
  grid-row-gap: var(--basic-gap);
  row-gap: 24px;
  row-gap: var(--basic-gap);
}

.guide__item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 28px 36px 30px;
  border: 2px solid rgba(51, 51, 51, 0.1);
}

.guide__item::before {
  content: counter(li) ".";
  counter-increment: li;
  display: block;
  margin-bottom: 22px;
  font-family: "Mont", "Helvetica", sans-serif;
  font-weight: 600;
  font-size: 34px;
  line-height: 1em;
}

.guide__button {
  width: 288px;
  margin-top: 104px;
}

/* MAIN -> feedback */

.feedback {
  border-top: 1px solid rgba(51, 51, 51, 0.1);
}

.feedback__container {
  position: relative;
}

.feedback__headline {
  margin-bottom: 90px;
}

.feeback__controls {
  position: absolute;
  top: 0;
  right: 0;
}

.feedback__list {
  display: flex;
  align-items: flex-start;
}

.feedback__item {
  width: 808px;
  max-width: 100%;
  padding: 36px 36px 32px;
  background-color: #ffffff;
  box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.03);
}

.feedback__footer.slider-footer {
  position: static;
  min-height: 0;
  min-height: initial;
  padding: 0;
}

.feedback__counter {
  display: none;
}

.feedback__header {
  position: relative;
  min-height: 64px;
  margin-bottom: 30px;
  padding-left: 100px;
}

.feedback__pic {
  position: absolute;
  top: 0;
  left: 0;
  width: 64px;
  height: 64px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
}

.feedback__name {
  color: rgba(51, 51, 51, 0.6);
}

.feedback__name i {
  display: block;
}

.feedback__text {
  margin-bottom: 20px;
}

.feedback__link {
  padding-right: 20px;
  font: inherit;
  font-weight: 600;
  color: #f06724;
  color: var(--feature-color);
  background-image: url("../../../img/icon-angle-arrow-right.svg");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 16px 16px;
}

.orange {
  color: #f06724;
  color: var(--feature-color);
}

.widget {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-end;
  gap: 12px;
  z-index: 1000;
}

.widget > a {
    display: none;
  }

.widget__item {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #f06724;
  background: var(--feature-color);
  cursor: pointer;
}

.widget__item:hover {
    background: #FF945F;
    background: var(--feature-color-2);
  }

.widget__telegram {
  padding: 18px 12px;
}

.widget__phone {
  fill: white !important;
  padding: 18px;
}

.widget__up {
  padding: 22px 19px;
}

.widget__tour {
  width: 367px;
  background: white;
  outline: 1px solid #FEE8BD;
  border-radius: 6px;
}

.widget__tour .popup__checkmark-label::before {
    border: 1px solid #FEE8BD !important;
  }

.widget__tour--wrapper {
  background: rgba(254, 232, 189, 0.1);
  padding: 32px;
  position: relative;
}

.widget__tour--title {
  padding: 0 15px;
  text-align: center;
  margin-bottom: 20px;
}

.widget__tour--title > div.title {
    font-family: "Mont", "Helvetica", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 25px;
  }

.widget__tour--title > div.description {
    font-family: "Verdana", "Helvetica", sans-serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
    padding-top: 0;
  }

.tap-icon {
  display: none;
}

section.resident-pass {
  margin-top: 100px;
  text-align: center;
}

section.resident-pass > .heading {
    font-size: 36px;
    line-height: 50px;
    width: 50%;
    margin: 0 auto;
    font-family: "Mont", "Helvetica", sans-serif;
  }

section.resident-pass.ekt > .heading {
  width: 55%;
}

div.resident-pass {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  height: 450px;
  margin-top: 60px;
}

div.resident-pass > .resident-pass__left,div.resident-pass > .resident-pass__right {
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    height: 110%;
  }

div.resident-pass > .resident-pass__left {
    margin-right: -15px;
  }

div.resident-pass > .resident-pass__right {
    margin-left: -15px;
  }

div.resident-pass > .resident-pass__left .location {
    align-items: end;
  }

div.resident-pass > .resident-pass__right .location {
    align-items: start;
  }

div.resident-pass .location {
    display: flex;
    flex-flow: column;
  }

div.resident-pass .location__wire-lb {
    transform: rotateX(180deg);
  }

div.resident-pass .location__wire-rt {
    transform: rotateY(180deg);
  }

div.resident-pass .location__wire-rb {
    transform: rotate(180deg);
  }

div.resident-pass .location__title {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    width: 211px;
    height: 49px;
    background-color: white;
    border-radius: 8px;
    filter: drop-shadow(0px 4px 10px rgba(204, 204, 204, 0.4));
    filter: var(--dark-shadow);
  }

div.resident-pass .location__title svg {
    width: 24px;
    height: 24px;
    margin-right: 12px;
  }

div.resident-pass .location__title.greyscale {
    color: #989E9C;
  }

div.resident-pass > .resident-pass__mid {
    z-index: 1;
  }

/* responsive */

@media (max-width: 1024px) {
    section.resident-pass > .heading {
      width: 65%;
    }
}

@media (max-width: 768px) {
  section.resident-pass {
    width: calc(100vw - 80px);
  }

    section.resident-pass > .heading {
      font-size: 24px;
      line-height: 33px;
    }

  div.resident-pass {
    height: 400px;
  }
}

@media (max-width: 576px) {
  div.resident-pass {
    flex-flow: column nowrap;
  }

    div.resident-pass > .resident-pass__left,div.resident-pass > .resident-pass__right {
      flex-flow: row nowrap;
      width: 100%;
      justify-content: space-between;
      height: -moz-max-content;
      height: max-content;
    }

    div.resident-pass > .resident-pass__left .location,div.resident-pass > .resident-pass__right .location {
      align-items: center;
    }

    div.resident-pass .location__title {
      width: -moz-max-content;
      width: max-content;
      height: 30px;
      padding: 0 20px;
    }

    div.resident-pass .location__title svg {
      width: 16px;
      height: 16px;
    }

    div.resident-pass .location.reverse {
      flex-flow: column-reverse nowrap;
    }

    div.resident-pass .location__wire-lt svg {
      height: 90px;
      width: 10px;
      margin-bottom: -20px;
    }

    div.resident-pass .location__wire-lb {
      transform: none;
    }

    div.resident-pass .location__wire-rt {
      transform: rotateX(180deg);
    }

    div.resident-pass .location__wire-lb svg {
      height: 70px;
      width: 10px;
    }

    div.resident-pass .location__wire-rt svg {
      height: 70px;
      width: 10px;
    }

    div.resident-pass .location__wire-rb {
      margin-top: -20px;
    }

    div.resident-pass .location__wire-rb svg {
      height: 90px;
      width: 10px;
    }
}

@media (min-width: 769px) {
  .tour__body--text.kazan,
  .tour__body--text.samara {
    grid-column: 4 / span 4;
  }

  .tour__body--text.kazan {
    margin-top: -60px;
  }

  .tour__body--text.samara {
    width: 300px;
    margin-left: 100px;
    margin-top: -55px;
  }

  .tour__body--text.izhevsk {
    width: 300px;
    margin-left: 220px;
  }

  .tour__body--form.izhevsk {
    width: 350px;
    margin-top: 80px;
  }
}

@media (max-width: 1279px) {
  .rooms__slider {
    margin-top: 42px;
  }

  .slider-footer__bullet--tablet {
    display: block;
  }

  .organize__slider {
    margin-right: 64px;
  }

  .organize__control {
    width: 44px;
    height: 44px;
  }

  .speech__wrapper {
    padding-right: 24px;
    padding-right: var(--basic-gap);
  }

  .speech__pic {
    width: 40%;
    margin-right: 64px;
  }

  .guide__pic {
    width: 40%;
    margin-right: 24px;
  }

  .guide__button {
    margin-top: 52px;
  }

  .feedback__headline {
    margin-bottom: 44px;
  }

  .prices__list {
    grid-template-columns: repeat(2, 1fr);
    justify-items: center;
  }
}

@media (max-width: 959px) {
  .inner .page-main {
    padding: 64px 0;
  }

  .amenities__categories-list {
    display: none;
  }

  .amenities__list {
    grid-template-columns: 1fr;
  }

  .amenities__pic {
    margin-right: 20px;
  }

  .amenities__text {
    margin-top: -4px;
  }

  .events__slides-list {
    margin-top: 52px;
  }

  .events__slide {
    height: 320px;
  }

  .events__content {
    display: none;
  }

  .organize {
    margin-left: calc(-1 * 24px);
    margin-left: calc(-1 * var(--basic-gap));
    margin-right: calc(-1 * 24px);
    margin-right: calc(-1 * var(--basic-gap));
    padding-left: 24px;
    padding-left: var(--basic-gap);
    padding-right: 24px;
    padding-right: var(--basic-gap);
    background-color: #f0f2f5;
  }

  .organize__slider {
    width: 420px;
    max-width: 50%;
  }

  .organize__list {
    margin-top: 30px;
  }

  .organize__item {
    margin-bottom: 16px;
  }

  .prices__list {
    margin-top: 44px;
  }

  .prices__item {
    padding: 35px 24px 24px;
  }

  .prices__name {
    margin-bottom: 11px;
  }

  .prices__toggler {
    margin-top: 36px;
  }

  .prices__button {
    padding: 16px 12px;
  }

  .speech__wrapper {
    left: 0;
    width: 100%;
    transform: none;
  }

  .speech__blockquote {
    margin-bottom: 36px;
  }

  .speech__pic {
    width: 46%;
    margin-right: 44px;
  }

  .guide__wrapper {
    flex-direction: column;
  }

  .guide__pic {
    width: 520px;
    margin: 0 auto 24px;
    margin: 0 auto var(--basic-gap);
  }

  .guide__button {
    margin-top: 24px;
    margin-top: var(--basic-gap);
  }

  .feedback__track {
    overflow: hidden;
  }
}

@media (max-width: 768px) {
  .tap-icon {
    position: relative;
    display: flex;
    height: 25px;
    width: 100%;
  }

    .tap-icon::after {
      display: block;
      position: absolute;
      right: 0;
      content: '';
      width: 21px;
      height: 25px;
      animation: tap-icon 800ms infinite;
      background-size: contain;
      background-position: bottom;
      transform: rotate(225deg);
    }
    .tour > img#mobile {
      display: none;
    }

  .slider-footer {
    margin-right: 0;
  }

  .slider-footer__controls {
    display: none;
  }

  .slider-footer__bullet--mobile {
    display: block;
  }

  .events__content {
    display: none;
  }

  .organize {
    padding-top: 244px;
  }

  .organize__info {
    position: static;
  }

  .organize__headline {
    position: absolute;
    top: 40px;
    left: 24px;
    left: var(--basic-gap);
    max-width: 640px;
  }

  .organize__slider {
    margin-right: 44px;
  }

  .prices__wrapper {
    grid-template-columns: 1fr;
    row-gap: 24px;
  }

  .prices__list {
    grid-template-columns: 1fr;
    row-gap: 24px;
    max-width: 400px;
    margin: 36px auto 0;
  }

  .prices__item {
    min-height: 0;
    min-height: initial;
  }

  .speech__wrapper {
    position: static;
    flex-direction: column;
  }

  .speech__pic {
    width: 520px;
    margin: 0 auto 30px;
  }

  .speech__headline {
    max-width: none;
    max-width: initial;
  }

  .features__card {
    width: 240px;
    height: 240px;
    transform: none !important;
    position: sticky;
    top: 70px;
  }

    .features__card:hover > .features__card--top > img,.features__card:active > .features__card--top > img {
      width: calc(100% - 2px);
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0;
      margin-top: 1px;
      height: calc(100% * 0.6);
    }
    .features__card.izhevsk:nth-child(2):hover > .features__card--top > img,.features__card.izhevsk:nth-child(2):active > .features__card--top > img {
      height: calc(100% * 0.7);
    }
    .features__card.kazan:nth-child(2):hover > .features__card--top > img {
      height: calc(100% * 0.6);
    }
    .features__card.kazan:nth-child(7):hover > .features__card--top > img {
      height: calc(100% * 0.6);
    }
    .features__card.samara:nth-child(3):hover > .features__card--top > img {
      height: calc(100% * 0.6);
    }
    .features__card.kazan:nth-child(2):active > .features__card--top > img {
      height: calc(100% * 0.6);
    }
    .features__card.kazan:nth-child(7):active > .features__card--top > img {
      height: calc(100% * 0.6);
    }
    .features__card.samara:nth-child(3):active > .features__card--top > img {
      height: calc(100% * 0.6);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(5):hover > .features__card--top > img {
      height: calc(100% * 0.55);
    }
    .features__card.izhevsk:nth-child(5):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.55);
    }
    .features__card.samara:nth-child(5):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.55);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(5):active > .features__card--top > img {
      height: calc(100% * 0.55);
    }
    .features__card.izhevsk:nth-child(5):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.55);
    }
    .features__card.samara:nth-child(5):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.55);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(2):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(6):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(7):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.kazan:nth-child(5):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(3):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(4):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(6):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(7):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(2):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(6):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card:not(.kazan):not(.izhevsk):not(.samara):nth-child(7):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.kazan:not(.does-not-exist):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.samara:not(.does-not-exist):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.kazan:nth-child(5):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(3):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(4):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(6):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.izhevsk:nth-child(7):not(.does-not-exist):not(.does-not-exist):active > .features__card--top > img {
      height: calc(100% * 0.65);
    }
    .features__card.kazan:not(.does-not-exist):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img,.features__card.samara:not(.does-not-exist):not(.does-not-exist):not(.does-not-exist):hover > .features__card--top > img {
      height: calc(100% * 0.65);
    }

  .features__card--text {
    width: 100%;
    height: 100%;
    padding: 16px;
    margin: 0;
    text-align: left;
    display: flex;
    align-items: flex-end;
    font-size: 14px;
    line-height: 20px;
  }

  .features__card--top {
    display: flex;
    justify-content: center;
  }

  .features__card--top > img {
    transition: height 200ms linear;
  }

  .features__card--bottom {
    display: flex;
    align-items: end;
    transform: none !important;
    border: 1px solid #f06724;
    border: 1px solid var(--feature-color);
    padding: 16px;
  }

    .features__card--bottom > p {
      font-size: 14px;
      line-height: 17px;
    }

  .differences {
    margin-bottom: 60px;
  }

  .differences__container {
    width: 580px;
    width: var(--container-width-768);
  }

  .differences__container--overlay {
    width: 580px;
    width: var(--container-width-768);
    grid-template-columns: 208px 153px 208px;
    margin-top: 0;
  }

  .differences__row {
    grid-template-columns: 208px 153px 208px;
  }

  .differences__row {
    grid-template-columns: 208px 153px 208px;
    font-size: 16px;
    line-height: 25px;
  }

    .differences__row  > .differences__header {
      font-size: 16px;
      line-height: 25px;
    }

    .differences__row  > .middle {
      justify-content: center;
    }

    .differences__row  > .middle > div.text {
      font-size: 16px;
      line-height: 22px;
    }

  .tour {
    position: relative;
    height: 702px;
  }

    .tour > img#desktop {
      display: none;
    }

    .tour > img {
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
      -o-object-fit: none;
         object-fit: none;
      -o-object-position: top;
         object-position: top;
      height: 691px;
    }

  .widget__telegram {
    display: none;
  }

  .widget__phone {
    display: none;
  }
    .amenities .section__headline {
      margin-bottom: 40px;
    }

  .amenities__items {
    grid-template-rows: repeat(3, 238px);
    grid-template-columns: repeat(3, 176px);
  }
    .amenities__items.kazan .amenities__item--circle,.amenities__items.izhevsk .amenities__item--circle {
      width: 74px !important;
      height: 74px !important;
    }

      .amenities__items.kazan .amenities__item--circle > svg,.amenities__items.izhevsk .amenities__item--circle > svg {
        width: 32px;
      }

  .amenities__item {
    display: flex;
    flex-flow: column;
    align-items: center;
    font-size: 14px;
    line-height: 20px;
  }

  .tour {
    position: relative;
    height: 640px;
  }

    .tour > div#mobile {
      background: url("../../../img/tour-mobile.svg");
      background-position-x: 1px;
      width: 100vw;
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
      -o-object-fit: none;
         object-fit: none;
      height: 683px;
    }

    .tour > div#mobile.kazan {
      background: url("../../../img/town/tour-tablet.svg");
    }

    .tour > div#mobile.izhevsk {
      background: url("../../../img/town/izhevsk-tour-tablet.svg");
    }

    .tour > div#mobile.samara {
      background: url("../../../img/town/samara-tour-tablet.svg");
    }

    .tour > div#mobile.franchise {
      background: url("../../../img/franchise/tour-tablet.svg");
    }

  .tour__wrapper {
    width: 580px;
    width: var(--container-width-768);
  }

  .tour__headline {
    font-size: 20px;
    line-height: 28px;
  }

    .tour__headline > .tour__headline-scroll {
      width: 250px;
      height: 28px;
    }

  .tour__body {
    display: flex;
    height: 400px;
    flex-flow: column;
    align-items: flex-end;
    margin-top: 140px;
    row-gap: 8px;
  }

  .tour__body--text {
    font-size: 12px;
    line-height: 17px;
    padding-left: 0;
    width: 300px;
  }

    .tour__body--text > h4 {
      font-size: 14px;
      line-height: 20px;
    }

  .tour__body--form {
    width: 300px;
    position: static;
    position: initial;
  }

  .book {
    margin-top: 40px;
  }

  .book__wrapper {
    width: 580px;
    width: var(--container-width-768);
  }

  .book__headline {
    width: 580px;
    width: var(--container-width-768);
    margin-left: 0;
  }

  .book__images {
    flex-flow: row wrap;
    height: -moz-max-content;
    height: max-content;
    gap: 12px;
  }

    .book__images > img {
      width: 300px;
      height: 166px;
      border-radius: 8px;
    }

    .book__images > img:nth-child(1) {
      width: 278px;
      height: 166px;
    }

    .book__images > img:nth-child(2) {
      widtH: 150px;
      order: 3;
    }

    .book__images img[src="img/book-3.svg"] {
      display: none;
    }

    .book__images img[src="img/book-3-tablet.svg"] {
      width: 290px;
      margin-top: -25px;
      display: block;
    }

    .book__images > img:nth-child(5) {
      display: none;
    }

    .book__images > img:nth-child(6) {
      width: 270px;
      height: 166px;
      order: 2;
    }

    .book__images > img:nth-child(7) {
      width: 136px;
      height: 166px;
      order: 1;
    }

  .book__conference-rooms {
    display: flex;
    flex-flow: column;
    margin-top: 40px;
    height: 406px;
    gap: 12px;
    background-color: #f06724;
    background-color: var(--feature-color);
    align-items: center;
    padding: 34px;
    border-radius: 16px;
  }

  .book__conference-rooms_heading {
    margin-top: 0;
    filter: none;
  }

    .book__conference-rooms_heading > h2 {
      font-size: 18px;
      line-height: 25px;
      width: 140px;
      text-align: center;
    }

  .book_conference-rooms_buttons {
    margin: 0;
  }

    .book_conference-rooms_buttons > form {
      display: flex;
      flex-flow: column;
      gap: 12px;
    }

    .book_conference-rooms_buttons > form > * {
      width: 220px;
    }

  .book__button {
    padding: 16px 24px;
  }

  .residents__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
  }

    .residents__wrapper h1.headline {
      width: calc(100vw - 40px);
      width: var(--container-width-576);
    }

    .residents__wrapper > .residents__overlay {
      width: 577px;
      height: 577px;
      background-size: cover;
      margin-top: 0;
      left: calc(-1 * (577px - calc(100vw - 40px)) / 2);
      left: calc(-1 * (577px - var(--container-width-576)) / 2);
    }

    .residents__wrapper > .residents__overlay > img {
      width: 122px;
      height: 122px;
      top: calc((577px - 122px) / 2);
      left: calc((577px - 122px) / 2);
    }

  .residents__overview {
    -moz-column-gap: 180px;
         column-gap: 180px;
    row-gap: 50px;
    margin-top: 75px;
  }

  .residents__overview > div.image {
    /*position: relative;*/
    width: 50px;
    height: 50px;
    background: none !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
  }

    .residents__overview > div.image:after {
      /*position: absolute;*/
      /*top: 0;*/
      display: block;
      content: '';
      width: 50px;
      height: 50px;
    }

    .residents__overview > div.image:hover > div.text,.residents__overview > div.image:focus > div.text {
      opacity: 1;
    }

    .residents__overview > div.image:nth-child(1):after {
      background: url("../../../img/vinyl/residents-1-mobile.png");
      background-size: contain;
    }

    .residents__overview > div.image:nth-child(2):after {
      background: url("../../../img/vinyl/residents-2-mobile.png");
      background-size: contain;
    }

    .residents__overview > div.image:nth-child(3):after {
      background: url("../../../img/vinyl/residents-3-mobile.png");
      background-size: contain;
    }

    .residents__overview > div.image:nth-child(4):after {
      background: url("../../../img/vinyl/residents-4-mobile.png");
      background-size: contain;
    }

    .residents__overview > div.image:nth-child(5):after {
      background: url("../../../img/vinyl/residents-5-mobile.png");
      background-size: contain;
    }

    .residents__overview > div.image:nth-child(6):after {
      background: url("../../../img/vinyl/residents-6-mobile.png");
      background-size: contain;
    }

    .residents__overview > div.image:nth-child(2n + 1) > div.text {
      background-color: #FBAE19;
      background-color: var(--yellow-color);
      margin-left: 53px;
    }

    .residents__overview > div.image:nth-child(2n + 1) > div.text:before {
      content: '';
      display: block;
      width: 15px;
      height: 19px;
      position: absolute;
      bottom: -3px;
      left: -5px;
      background: url("../../../img/vinyl/residents-mobile-left.svg");
    }

    .residents__overview > div.image:nth-child(2n + 2) > div.text {
      background-color: #FF945F;
      background-color: var(--feature-color-2);
      margin-left: -204px;
    }

    .residents__overview > div.image:nth-child(2n + 2) > div.text:after {
      content: '';
      display: block;
      width: 15px;
      height: 19px;
      position: absolute;
      bottom: -3px;
      right: -5px;
      background: url("../../../img/vinyl/residents-mobile-right.svg");
    }

  .residents__overview > div.image > div.text {
    display: block;
    margin-top: -19px;
    width: 200px;
    height: 69px;
    padding: 8px 16px;
    font-family: "Verdana", "Helvetica", sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 17px;
    color: white;
    margin-bottom: -45px;
    border-radius: 20px;
    position: relative;
    opacity: 0;
    transition: opacity 200ms ease-in;
  }
    .residents__pictures > img {
      width: 88px;
      height: 100px;
    }

    .residents__pictures > img:nth-child(1) {
      margin-top: 48px;
      display: none;
    }

    .residents__pictures > img:nth-child(2) {
      margin-top: 0;
    }

    .residents__pictures > img:nth-child(3) {
      margin-top: 55px;
      display: none;
    }

    .residents__pictures > img:nth-child(4) {
      margin-top: 20px;
    }

    .residents__pictures > img:nth-child(5) {
      margin-top: 0;
    }
    .companies__wrapper > .headline:nth-child(1) {
      width: -moz-max-content;
      width: max-content;
    }

    .companies__wrapper > .headline:nth-child(2) {
      width: -moz-max-content;
      width: max-content;
    }

    .companies__wrapper > .headline > svg {
      width: 20px;
      margin-right: 7px;
      margin-top: 5px;
    }

  .become-resident__wrapper {
    width: 580px;
    width: var(--container-width-768);
  }

  .become-resident__flex {
    flex-flow: column;
    align-items: center;
  }

    .become-resident__flex > img {
      width: 180px;
    }
    .become-resident__flex-button > div.flex-button__text {
      width: 580px;
      width: var(--container-width-768);
      margin-left: 0;
      margin-top: -60px;
      padding: 32px 39px;
      font-family: "Mont", "Helvetica", sans-serif;
    }

    .become-resident__flex-button .heading {
      width: 100%;
      font-size: 20px;
      line-height: 28px;
      margin-top: 20px;
    }

    .become-resident__flex-button > div.flex-button__btn {
      margin-top: -20px;
    }

    .become-resident__flex-button button {
      width: 300px;
    }

  .widget__tour {
    width: 252px;
  }

    .widget__tour .popup__checkmark-label {
      line-height: 12px;
    }

  .widget__tour--wrapper {
    padding: 20px;
  }

  .widget__tour--title {
    padding: 0;
  }

    .widget__tour--title > div.title {
      font-size: 16px;
      line-height: 22px;
    }

  .contacts__wrapper {
    width: 580px;
    width: var(--container-width-768);
    margin-top: 100px;
  }

    .contacts__wrapper > #yandex-map {
      width: 580px;
      width: var(--container-width-768);
      height: 400px;
    }

    .contacts__wrapper a.button.icon {
      font-size: 18px;
      line-height: 26px;
      padding: 12px 18px;
    }

    .contacts__wrapper a.button.ekb {
      padding: 12px;
    }

  .contacts__towns {
    flex-flow: row wrap;
    justify-content: center;
    gap: 32px;
  }

  .follow__wrapper {
    flex-flow: row wrap;
    width: 580px;
    width: var(--container-width-768);
  }

    .follow__wrapper > .follow__card {
      width: calc(100vw - 40px) !important;
      width: var(--container-width-576) !important;
      height: -moz-fit-content;
      height: fit-content;
    }

    .follow__wrapper > .follow__card:nth-child(1) {
      background: white;
      color: #333333;
      color: var(--copy-color);
    }

    .follow__wrapper > .follow__card:nth-child(2) {
      background: #333333;
      background: var(--copy-color);
      color: white;
    }

  .speech__text {
    font-size: 16px;
    line-height: 28px;
  }

  .guide__list {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, 1fr);
  }

  .feedback__header {
    padding-top: 100px;
    padding-left: 0;
  }
}

@media (max-width: 768px) and (min-width: 577px) {
    .amenities__items.kazan .amenities__item:nth-child(9) {
      grid-column: 2 / 3;
    }
}

@media (min-width: 1024px) {
    .differences__row  > .middle {
      width: 209px;
    }
}

@media (max-width: 666px) {
  .inner .page-main {
    padding: 64px 0 0;
  }

  .intro__column {
    max-width: 100%;
  }

  .intro__column--border {
    margin-top: 30px;
  }

  .slider-footer__counter {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100px;
    height: 32px;
    margin: auto;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .events__slides-list {
    margin-top: 36px;
  }

  .amenities__headline {
    max-width: 384px;
    margin: 0 0 18px;
  }

  .amenities__list {
    margin-top: 45px;
  }

  .organize {
    flex-direction: column;
    background-image: linear-gradient(to bottom, #f9f9f9 0%, #f9f9f9 40%, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0) 100%)
  }

  .organize__slider {
    width: 400px;
    max-width: 100%;
    margin: 0 auto 64px;
  }

  .organize__footer.slider-footer {
    position: relative;
    bottom: 0;
    right: 0;
    padding: 12px 0;
  }

  .organize__control {
    background-color: rgba(255, 255, 255, 0);
    border: 0;
  }

  .organize__counter {
    display: block;
  }

  .organize__headline {
    max-width: 440px;
  }

  .feedback {
    padding-bottom: 0;
  }

  .feedback__footer.slider-footer {
    position: relative;
    padding: 10px 0;
  }

  .feedback__counter {
    display: block;
  }

  .feeback__controls {
    position: static;
  }

  .location .prices {
    padding-bottom: 24px;
    padding-bottom: var(--basic-gap);
  }

  .prices__headline--single {
    display: none;
  }

  .meetups__illustration {
    height: 288px;
  }

  .meetups__wrapper {
    padding: 48px 0;
  }
}

@media (min-width: 576px) {
    .differences__row  > .middle {
      grid-area: middle;
      display: flex;
      flex-flow: column nowrap;
      padding: 5px !important;
      align-self: center;
      justify-self: center;
      place-self: center;
    }
}

@media (max-width: 576px) {
  .intro__headline {
    margin-bottom: 0;
  }

  .tour__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
  }

  .slider-footer__counter {
    font-size: 12px;
  }

  .intro__text {
    margin-bottom: 24px;
  }

    .intro__text > h2:not(.mobile) {
      display: none;
    }

    .intro__text > h2.mobile {
      text-align: center;
      display: block;
    }
    .amenities .headline:not(.mobile) {
      display: none;
    }

    .amenities .headline.mobile {
      display: block;
    }

  .amenities__items {
    max-width: 300px;
    margin: 0 auto;
    grid-template-rows: repeat(4, 1fr) !important;
    grid-template-columns: repeat(2, 1fr) !important;
    row-gap: 20px;
  }

  .amenities__item--circle {
    width: 75px;
    height: 75px;
    margin-bottom: 10px;
  }

    .amenities__item--circle > svg {
      width: 34px;
    }

  .amenities__item:nth-child(9) {
    grid-column: auto;
  }

  .intro__features {
    justify-content: center;
    row-gap: 0;
  }

    .intro__features .tap-icon {
      margin-bottom: 5px;
    }

    .intro__features .features__card:not(:last-child) {
      margin-bottom: 40px;
    }

  .features__card {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    height: calc(100vw - 40px);
    height: var(--container-width-576);
  }

  .features__card--text {
    z-index: 2;
  }

  .differences__container {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    grid-template-rows: 81px repeat(6, 193px);
    grid-row-gap: 0;
    justify-content: center;
  }

  .differences__row {
    grid-template-rows: 81px 112px;
    grid-template-columns: 135px 135px;
    grid-column-gap: 30px;
    grid-template-areas:
    "middle middle"
    "left right";
    font-size: 14px;
    line-height: 20px;
    position: sticky;
    top: 70px;
  }

    .differences__row:nth-child(1) {
      grid-template-areas: "left right";
    }

    .differences__row > .difference.middle {
      gap: 12px;
      border-radius: 16px;
      background: url("../../../img/differences/title-background.png");
      background-size: cover;
      z-index: 1;
    }

    .differences__row > .difference.middle > * {
      display: block;
    }

    .differences__row > .difference.middle > div.text {
      font-family: "Mont", "Helvetica", sans-serif;
      font-weight: 700;
      font-size: 14px;
      line-height: 20px;
      color: white;
    }

    .differences__row > .difference.left,.differences__row > .difference.right {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
      border-bottom-left-radius: 16px;
      border-bottom-right-radius: 16px;
      margin-top: -16px;
      font-size: 12px;
      line-height: 17px;
      filter: none;
    }

    .differences__row > div.left,.differences__row > div.right {
      height: calc(100% + 16px);
    }

    .differences__row > div.left {
      background-color: #DDDDDD;
    }

    .differences__row > div.right {
      background-color: #FDD17C;
    }

  .differences__header {
    display: flex;
    align-items: center;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }

  .differences__container--overlay {
    display: none;
  }
    .tour > div#mobile {
      background-position-x: -80px;
      height: 600px;
    }

    .tour > div#mobile.kazan {
      background: url("../../../img/town/tour-mobile.svg");
      background-size: cover;
    }

    .tour > div#mobile.izhevsk {
      background: url("../../../img/town/izhevsk-tour-mobile.svg");
      background-size: cover;
    }

    .tour > div#mobile.samara {
      background: url("../../../img/town/samara-tour-mobile.svg");
      background-size: cover;
    }

    .tour > div#mobile.franchise {
      background: url("../../../img/franchise/tour-mobile.svg");
      background-size: cover;
      height: 700px;
      background-position-y: 20px;
    }

  .tour__body {
    display: flex;
    height: 400px;
    margin-top: calc((100vw - 40px) * 0.44);
    margin-top: calc(calc(100vw - 40px) * 0.44);
    margin-top: calc(var(--container-width-576) * 0.44);
    align-items: center;
  }

  .tour__body.index {
    margin-top: 185px;
  }

  .tour__body.kazan,
  .tour__body.izhevsk,
  .tour__body.samara {
    margin-top: 232px;
  }

  .tour__body--text {
    padding-left: 98px;
  }

  .residents {
    margin-top: 100px;
  }

  .book__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
  }

  .book__headline {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    margin-left: 0;
  }
    .book__images > img {
      width: 100%;
      height: auto;
      border-radius: 8px;
    }

    .book__images  > img:nth-child(1) {
      order: 1;
      width: 100%;
      height: auto;
    }

    .book__images  > a {
      order: 2;
    }

    .book__images img[src="img/book-3.svg"] {
      display: block;
      height: calc((100vw - 40px)* 0.68);
      height: calc(calc(100vw - 40px)* 0.68);
      height: calc(var(--container-width-576)* 0.68);
      margin-top: -20px;
    }

    .book__images img[src="img/book-3-tablet.svg"] {
      display: none;
    }

    .book__images > img:nth-child(2) {
      display: none;
    }

    .book__images > img:nth-child(3) {
      display: block;
      order: 5;
    }

    .book__images > img:nth-child(6),.book__images > img:nth-child(7) {
      width: calc((100vw - 40px) / 2 - 6px);
      width: calc(calc(100vw - 40px) / 2 - 6px);
      width: calc(var(--container-width-576) / 2 - 6px);
      height: calc((calc(100vw - 40px) / 2 - 6px) * 1.21);
      height: calc((var(--container-width-576) / 2 - 6px) * 1.21);
      -o-object-fit: cover;
         object-fit: cover;
    }

    .book__images  > img:nth-child(6) {
      order: 4;
      -o-object-position: right;
         object-position: right;
    }

    .book__images  > img:nth-child(7) {
      display: block;
      order: 3;
    }

    .book__images > img:nth-child(5) {
      display: none;
    }
    .residents__wrapper .headline {
      width: calc(100vw - 40px);
      width: var(--container-width-576);
    }

    .residents__wrapper .tap-icon {
      margin-top: 55px;
    }

    .residents__wrapper .tap-icon:after {
      right: 10px;
    }

    .residents__wrapper .residents__overview {
      width: 280px;
      margin: 0 auto;
      row-gap: 40px;
    }

  .residents__pictures {
    max-width: 300px;
    margin: 100px auto 0;
  }
    .companies__wrapper > .headline > svg {
      margin-top: 2px;
    }

  .become-resident {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    margin: 0 auto;
  }

  .become-resident__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
  }

  .contacts {
    margin-top: 0;
  }

  .contacts__towns.one {
    margin-top: 40px;
  }

  .contacts__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
  }

    .contacts__wrapper > #yandex-map {
      width: calc(100vw - 40px);
      width: var(--container-width-576);
      height: calc(100vw - 40px);
      height: var(--container-width-576);
    }

  .follow__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    gap: 20px;
  }
    .become-resident__flex-button > div.flex-button__text {
      width: calc(100vw - 40px);
      width: var(--container-width-576);
      height: -moz-max-content;
      height: max-content;
      padding: 50px 39px 23px;
    }

    .become-resident__flex-button > div.flex-button__text.index {
      padding: 50px 39px 40px;
    }

    .become-resident__flex-button .heading {
      width: 100%;
      font-size: 14px;
      line-height: 20px;
      margin-top: 20px;
    }

    .become-resident__flex-button button {
      width: 201px;
    }
}

@media (max-width: 374px) {
    .features__card:hover > .features__card--top > img,.features__card:active > .features__card--top > img {
      height: calc(100% * 0.5);
    }
}
/* FOOTER */

.footer {
  margin-top: 100px;
  height: 534px;
  color: #ffffff;
  position: relative;
}

.footer > div.image {
  width: 100vw;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: none;
     object-fit: none;
  -o-object-position: top;
     object-position: top;
  height: 534px;
  background: url("../../../img/footer.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

.footer__wrapper {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  width: 1110px;
  width: var(--container-width);
  height: 100%;
  margin: 0 auto;
  padding-top: 282px;
  padding-bottom: 50px;
}

.footer__logo {
  margin-right: 340px;
}

.footer__logo.ekt {
  margin-right: 150px;
}

.footer__logo > svg {
  fill: white;
}

.footer__map {
  position: relative;
  display: flex;
  align-items: center;
  height: 512px;
  background-image: url("../../../img/mock-map.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.footer__map--kazan {
  background-image: url("../../../img/mock-map-kazan.jpg");
}

.footer__map--samara {
  background-image: url("../../../img/mock-map-samara.jpg");
}

.footer__map-widget {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
}

.footer__container--top {
  position: relative;
  height: 0;
  overflow: visible;
}

.footer__contacts {
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
}

.footer__card {
  width: 392px;
  max-width: 100%;
  padding: 30px 36px 36px;
  color: #333333;
  color: var(--copy-color);
  text-align: left;
  background-color: #ffffff;
  box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.03);
  transform: translateY(-50%);
}

.footer__name {
  margin-bottom: 14px;
  font-family: "Mont", "Helvetica", sans-serif;
}

.footer__contact-info {
  margin-bottom: 4px;
  padding-left: 32px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 16px auto;
}

.footer__contact-info--address {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.377 11.294C-.168 7.305 2.663 1 8 1s8.168 6.305 4.623 10.294L8 16.494l-4.623-5.2z' stroke='%23F06724' stroke-width='2'/%3E%3Ccircle cx='8' cy='7' r='2' stroke='%23F06724' stroke-width='2'/%3E%3C/svg%3E");
}

.footer__contact-info--tel {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h8v12H4V2zM2 0h12v16H2V0zm6 10a1 1 0 100 2 1 1 0 000-2z' fill='%23F06724'/%3E%3C/svg%3E");
}

.footer__contact-info--email {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 2v12h16V2H0zm2 2.943V12h12V4.943L8 9.23 2 4.943zM11.88 4H4.12L8 6.771 11.88 4z' fill='%23F06724'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Cpath fill='%23fff' d='M0 0h16v16H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.footer__contact-info--hours {
  background-image: url("data:image/svg+xml,%0A%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35.5 35.5'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%23df6f38;stroke-miterlimit:10;stroke-width:3.6px;%7D%3C/style%3E%3C/defs%3E%3Ccircle class='cls-1' cx='17.75' cy='17.75' r='15.95'/%3E%3Cpolyline class='cls-1' points='26.2 22.21 17.75 19.63 17.75 5.9'/%3E%3C/svg%3E");
}

.footer__contact-info a:hover,
.footer__contact-info a:focus {
  color: #f06724;
  color: var(--feature-color);
}

.footer__container--bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 88px;
  padding: 24px 0;
}

.footer__nav-links {
  display: flex;
  flex-flow: column nowrap;
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.6);
}

.footer__nav-links > *.bold {
    font-weight: 700;
  }

.footer__nav-links:nth-child(2) {
  margin-right: 164px;
}

.footer__nav-links.ekt:nth-child(3) {
  margin-right: 164px;
}

.footer__links {
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.6);
}

.footer__link {
  outline: 0;
  transition: color 0.35s ease-out;
}

.footer__nav {
  display: flex;
}

.contacts__description {
  flex-shrink: 0;
  width: 284px;
  color: inherit;
}

.footer .contacts__list {
  margin-left: 132px;
}

.footer .contacts__item {
  margin-right: 55px;
}

.footer .contacts__social {
  margin-left: auto;
}

.footer__links {
  display: flex;
  align-items: flex-end;
}

.footer__links > * {
    margin-right: 40px;
  }

.footer__copyright {
  width: 284px;
}

.footer__list {
  display: flex;
  justify-content: space-between;
  margin: 0 36px;
}

.footer__item {
  margin-right: 51px;
}

.footer__link:hover,
.footer__link:focus {
  color: rgba(255, 255, 255, 0.8);
}

.footer__link:active {
  color: rgba(255, 255, 255, 0.3);
}

.footer__social {
  position: relative;
}

.footer__up {
  margin-left: auto;
  border: 0;
  opacity: 0.5;
  transition: opacity 0.1s ease-in;
}

.footer__up:hover,
.footer__up:focus {
  opacity: 1;
}

.footer__up svg {
  stroke: #ffffff;
  display: inline-block;
}

/* MAP */

.map__buttons {
  display: flex;
  flex-direction: column;
}

.map__button {
  margin-bottom: 21px;
  font-size: 24px;
  text-align: center !important;
  background-color: #ffffff;
}

/* responsive */

@media (max-width: 1279px) {
  .footer__container--bottom {
    flex-wrap: wrap;
  }

  .contacts__description {
    display: none;
  }

  .footer .contacts__list {
    margin-left: 0;
  }

  .footer__list {
    order: 2;
    justify-content: flex-start;
    width: 100%;
    margin: 0;
  }

  .footer__up {
    width: 44px;
    height: 44px;
  }

  .map__button {
    width: 56px;
    height: 56px;
  }
}

@media (max-width: 768px) {
  .footer__wrapper {
    width: 580px;
    width: var(--container-width-768);
    padding-top: 200px;
    padding-bottom: 20px;
  }

  .footer__logo {
    margin-right: 0;
  }

  .footer__nav {
    flex-flow: row wrap;
    gap: 20px;
  }

    .footer__nav > *:nth-child(2) {
      margin-bottom: 20px;
    }

  .footer__links {
    flex-flow: row;
    gap: 40px;
  }

    .footer__links > * {
      margin-right: 0;
    }

    .footer__links > span {
      align-self: center;
    }

    .footer__links > a {
      align-self: end;
    }
}

@media (max-width: 576px) {
  .footer__wrapper {
    width: calc(100vw - 40px);
    width: var(--container-width-576);
    padding-top: 100px;
  }

  .footer__nav {
    flex-flow: column wrap;
    gap: 30px;
  }

    .footer__nav > *:nth-child(2) {
      margin-bottom: 0;
    }

  .footer__links {
    flex-flow: column-reverse wrap;
    gap: 0;
    margin-top: 30px;
  }

    .footer__links > a {
      align-self: start;
    }

    .footer__links > :first-child {
      text-align: center;
      margin-top: 30px;
    }

  .footer__nav-links:nth-child(2) {
    margin-right: 0;
  }
}
.top {
  padding: 50px 0 64px;
}

.top__headline {
  text-align: center;
  margin-bottom: 60px;
}

.top__text {
  max-width: 1100px;
  margin-bottom: 12px;
  font-weight: 600;
  font-family: "Mont", "Helvetica", sans-serif;
  text-align: center;


}

.top__hint--container {
  height: 48px;
  margin: 0 auto 40px;
  overflow: hidden;
}

.top__hint--container  > * {
    animation: top-hint-scroll 6.6s cubic-bezier(0.7,-1, 0.5, 2) infinite;
  }

.top__hint {
  width: -moz-max-content;
  width: max-content;
  height: 48px;
  margin: 0 auto 30px;
  padding: 10px 20px;
  background-color: #FBAE19;
  background-color: var(--yellow-color);
  border-radius: 39px;
  color: white;
  font-family: "Verdana", "Helvetica", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
}

.top__list {
  display: flex;
  justify-content: space-between;
}

.top__item {
  width: calc(50% - 15px);
  padding: 28px 30px;
  border-radius: 16px;
}

.top__item:nth-child(1) {
    background-color: #FFDBC9;
  }

.top__item:nth-child(2) {
    background-color: #FEE8BD;
  }

.top__item--title {
  margin: 0;
}

.top__item--text {
  font-family: "Verdana", "Helvetica", sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.top__filters {
  display: flex;
  flex-wrap: wrap;
  margin-top: 56px;
}

.top__group {
  width: 392px;
  max-width: calc((100% - 24px) / 2);
  max-width: calc((100% - var(--basic-gap)) / 2);
  margin-right: 24px;
  margin-right: var(--basic-gap);
}

.top__group:last-of-type {
  margin: 0;
}

.top__group:hover svg {
  opacity: 1;
}

/* responsive */

@media (max-width: 959px) {
  .top__text {
    max-width: 644px;
    margin-bottom: 24px;
    font-size: 16px;
    line-height: 28px;
  }

  .top__list {
    flex-direction: column;
  }

  .top__item {
    width: 100%;
    margin-bottom: 12px;
  }

  .top__item:last-of-type {
    margin-bottom: 0;
  }
}

@media (max-width: 666px) {
  .top {
    padding: 32px 0;
  }

  .top__filters {
    margin-top: 32px;
  }

  .top__group {
    max-width: 100%;
    margin: 0 0 16px;
  }
}

@media (max-width: 576px) {
  .top__hint--container {
    height: 31px;
  }

  .top__hint {
    height: 31px;
    font-size: 13px;
    line-height: 17px;
    padding: 7px 13px;
  }

  .top__item--text {
    font-size: 12px;
    line-height: 17px;
  }
}
.space {
  margin-bottom: 24px;
  margin-bottom: var(--basic-gap);
  border: 1px solid #F8BEA1;
  border-radius: 4px;
}

.space:last-of-type {
  margin-bottom: 0;
}

.space__info {
  display: flex;
  justify-content: space-between;
  padding: 34px 30px 0;
}

.space__slider {
  position: relative;
  width: 501px;
}

.space__footer {
  width: 501px;
  height: 370px;
  min-height: 0;
  min-height: initial;
  margin-top: 0;
  padding: 0 8px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.space__track {
  overflow: hidden;
}

.space__slides-track {
  display: flex;
}

.space__pic {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.space__counter {
  display: none;
}

.space__controls {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 24px;
  grid-gap: var(--basic-gap);
  margin-left: 0;
}

.space__control {
  width: 24px;
  height: 24px;
  background-color: #ffffff;
  opacity: 1;
}

.space__control:nth-child(2) {
    margin-left: auto;
  }

.space__control svg {
  width: 11px;
  opacity: 0.5;
  transition: opacity 0.2s ease-out;
}

.space__control:hover svg,
.space__control:focus svg {
  opacity: 1;
}

.space__description {
  width: 480px;
}

.space__headline {
  margin-top: 0;
  margin-bottom: 20px;
  font-family: "Mont", "Helvetica", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.4em;
}

.space__headline span {
  display: none;
  margin-bottom: 24px;
  font-weight: 500;
  font-size: 11px;
  line-height: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.8;
}

.space__amenities-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  grid-gap: 16px;
  gap: 16px;
  font-size: 14px;
  line-height: 16px;
}

.space__amenity {
  width: 100%;
  max-width: 100%;
  padding-left: 32px;
  background-image: url("../../../img/booking-icons/icon-internet.svg");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 16px auto;
}

.space__amenity--seats {
  background-image: url("../../../img/booking-icons/icon-seats.svg");
}

.space__amenity--tv {
  background-image: url("../../../img/booking-icons/icon-tv.svg");
}

.space__amenity--speaker {
  background-image: url("../../../img/booking-icons/icon-speaker.svg");
}

.space__amenity--whiteboard {
  background-image: url("../../../img/booking-icons/icon-whiteboard.svg");
}

.space__amenity--internet {
  background-image: url("../../../img/booking-icons/icon-internet.svg");
}

.space__amenity--water {
  background-image: url("../../../img/booking-icons/icon-water.svg");
}

.space__amenity--yummies {
  background-image: url("../../../img/booking-icons/icon-yummies.svg");
}

.space__amenity--floor {
  background-image: url("../../../img/booking-icons/icon-floor.svg");
}

.space__amenity--reception {
  background-image: url("../../../img/booking-icons/icon-reception.svg");
}

.space__amenity:last-of-type {
  margin-bottom: 0;
}

.space__text {
  display: none;
  margin-bottom: 40px;
  opacity: 0.8;
}

.space__accordion--content {
  display: flex;
}

.space__accordion--content  > svg {
    min-width: 24px;
    cursor: pointer;
  }

.space__accordion--content  > svg:nth-child(2) {
    margin-left: 30px;
  }

.space__accordion--content-days {
  display: flex;
  flex-flow: column nowrap;
  width: 84px;
  row-gap: 12px;
  transition: transform 200ms linear;
}

.space__accordion--content-days > .space__accordion--content-line_item:not(.heading) {
  background-color: white;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
}

.space__accordion--content-line {
  display: flex;
  -moz-column-gap: 12px;
       column-gap: 12px;
}

.space__accordion--content-line_item {
  width: 84px;
  min-width: 84px;
  height: 40px;
  min-height: 40px;
  font-family: "Verdana", "Helvetica", sans-serif;
  font-size: 14px;
  line-height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.space__accordion--content-line_item.heading {
  height: 24px;
  min-height: 24px;
  justify-content: space-between;
}

.space__accordion--content-line_item.heading:not(.icon)  > svg:nth-child(1),.space__accordion--content-line_item.heading:not(.icon)  > svg:nth-child(3) {
    cursor: pointer;
  }

.space__accordion--content-line_item.heading.icon {
  justify-content: center;
  background-color: #f06724;
  background-color: var(--feature-color);
  border-radius: 4px;
}

.space__accordion--content-line_item.heading.icon  > svg {
    fill: white;
  }

.space__accordion--content-hours {
  display: flex;
  flex-flow: column nowrap;
  overflow: scroll;
  row-gap: 12px;
}

.space__accordion--time {
  background-color: #FFF9F6;
  padding: 33px 48px 20px;
  margin-top: 18px;
  position: relative;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.space__accordion--price {
  margin-top: 16px;
  padding: 12px 19px;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
}

.space__resident-discount {
  margin: 10px 0 0;
  font-family: "Mont", "Helvetica", sans-serif;
  color: #333333;
  color: var(--copy-color);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: 0.01em;
  opacity: 0.8;
}

.space__top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 32px;
}

.space__button {
  margin-bottom: 32px;
  font-weight: 600;
  font-size: 16px;
  line-height: 1em;
  text-align: left;
  outline: 0;
  cursor: default;
  pointer-events: none;
}

.space__button--booking {
  width: calc(100% - 250px);
  margin-bottom: 0;
}

.space__indicators-list {
  margin-left: auto;
  display: flex;
}

.space__indicator {
  position: relative;
  margin-left: 32px;
  padding-left: 32px;
  font-size: 12px;
  line-height: 16px;
}

.space__indicator::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  border: 1px solid #C6C6C6;
  border-radius: 2px;
}

.space__indicator--occupied::before {
  background-color: rgba(51, 51, 51, 0.1);
  background-image: repeating-linear-gradient(-45deg, rgba(51, 51, 51, 0.15), rgba(51, 51, 51, 0.15) 1px, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0) 6px);
}

.space__indicator--my::before {
  background-color: rgba(82, 196, 26, 0.1);
  border-color: #52c41a;
  background-image: repeating-linear-gradient(-45deg, rgba(51, 51, 51, 0.15), rgba(51, 51, 51, 0.15) 1px, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0) 6px);
}

.space__indicator--my {
  white-space: nowrap;
}

.space__table {
  width: 100%;
  max-width: 100%;
}

.space__price-group + .space__price-group {
  margin-top: 12px;
}

.space__price-group-title {
  margin: 0 0 2px;
  font-family: "Mont", "Helvetica", sans-serif;
  color: #333333;
  color: var(--copy-color);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: 0.01em;
  opacity: 0.8;
}

.space__price-rows {
  display: grid;
  grid-row-gap: 2px;
  row-gap: 2px;
}

.space__price-row {
  min-height: 25px;
  display: grid;
  grid-template-columns: minmax(128px, 1fr) 48px minmax(112px, auto);
  align-items: center;
  grid-column-gap: 8px;
  -moz-column-gap: 8px;
       column-gap: 8px;
  font-family: "Mont", "Helvetica", sans-serif;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.space__price-time {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #333333;
  color: var(--copy-color);
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.01em;
  white-space: nowrap;
  opacity: 0.8;
}

.space__price-time svg {
  flex: 0 0 16px;
}

.space__price-value {
  color: #333333;
  color: var(--copy-color);
  font-size: 18px;
  line-height: 25px;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

.space__cell {
  font-family: "Mont", "Helvetica", sans-serif;
  width: 60px;
  color: #333333;
  color: var(--copy-color);
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.01em;
  opacity: 0.8;
  white-space: nowrap;
}

/* Скидка стоит перед ценой и набрана размером подписи дня: цифра со скидкой не
   должна спорить с самой ценой. Селектор с ячейкой — не для красоты: правило
   `.space__cell span` иначе перебивает и цвет, и display, и скидка уезжает на
   свою строку чёрным. */
.space__cell--price .space__discount,
.space__price-row .space__discount {
  display: inline;
  color: #F06724;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  text-align: right;
  white-space: nowrap;
}

.space__discount-note {
  margin: 6px 0 0;
  font-family: "Mont", "Helvetica", sans-serif;
  color: #F06724;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: 0.01em;
}

.space__cell span {
  display: block;
  color: #333333;
  color: var(--copy-color);
}

.space__cell span svg {
  float: left;
  margin-right: 10px;
}

.space__cell--price {
  font-size: 18px;
  line-height: 25px;
  font-weight: 700;
  color: #333333;
  color: var(--copy-color);
  position: relative;
  padding-right: 36px;
  opacity: 1;
  text-align: right;
}

.space__row:last-of-type .space__cell {
  padding-bottom: 0;
}

.space__tooltip {
  position: absolute;
  top: 3px;
  right: 0;
  display: inline-block;
  cursor: pointer;
}

.space__tooltip svg {
  width: 100%;
  opacity: 0.5;
  transition: opacity 0.2s ease-in;
}

.space__tooltip:hover svg {
  opacity: 1;
}

.space__tooltip-value {
  position: absolute;
  top: calc(100% + 4px);
  right: calc(100% + 4px);
  display: none;
  max-width: 280px;
  padding: 6px 12px;
  font-size: 12px;
  line-height: 1em;
  color: #ffffff;
  background-color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  z-index: 2;
}

.space__tooltip:hover .space__tooltip-value {
  display: block;
}

.space__book-button {
  width: 350px;
  margin-top: 36px;
}

.space__time-option {
  width: 100%;
  background-color: white;
  padding: 6px 8px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: 0.01em;
  text-align: center;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  outline: 0;
  transition: all 0.2s ease-out;
}

.space__time-option.my,
.space__time-option:not(:disabled):hover,
.space__time-option:not(:disabled):focus {
  background-color: rgba(82, 196, 26, 0.1);
  border-color: #52c41a;
}

.space__time-option:not(:disabled):active {
  opacity: 0.6;
}

.space__time-option:disabled:not(.my) {
  background-color: rgba(51, 51, 51, 0.1);
}

.space__time-option:disabled {
  cursor: not-allowed;
  background-image: repeating-linear-gradient(-45deg, rgba(51, 51, 51, 0.15), rgba(51, 51, 51, 0.15) 1px, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0) 10px);
}

/* responsive */

@media (max-width: 1024px) {
  .space__slider {
    width: 437px;
  }

  .space__footer {
    width: 437px;
    height: 260px;
  }

  .space__description {
    padding-left: 80px;
    height: -moz-max-content;
    height: max-content;
  }

  .space__amenities-list {
    min-height: 256px;
  }

  .space__accordion--price {
    margin-left: -518px;
    margin-top: -25px;
    width: 370px;
  }
}

@media (max-width: 768px) {
  .space__info {
    flex-direction: column;
  }

  .space__amenities-list {
    min-height: 0;
  }

  .space__slider,
  .space__description {
    width: 100%;
    max-width: none;
    max-width: initial;
    flex-grow: 0;
    padding-left: 0;
  }

  .space__slider {
    width: -moz-max-content;
    width: max-content;
    margin: 0 auto 40px;
  }

  .space__accordion--price {
    margin: 20px auto 0;
  }

  .space__time-option {
    font-size: 14px;
  }
}

@media (max-width: 576px) {
  .space {
    width: 100%;
    margin: 0 auto 40px;
    border: 1px solid #F8BEA1;
    border-radius: 4px;
  }

  .space__info {
    margin-top: 0;
    padding: 12px;
  }

  .space__slider {
    width: calc((100vw - 40px) - 60px);
    width: calc(calc(100vw - 40px) - 60px);
    width: calc(var(--container-width-576) - 60px);
    margin-bottom: 10px;
  }

  .space__footer {
    width: calc((100vw - 40px) - 60px);
    width: calc(calc(100vw - 40px) - 60px);
    width: calc(var(--container-width-576) - 60px);
    height: -moz-max-content;
    height: max-content;
    position: relative;
    bottom: 0;
    left: 0;
    padding: 10px 24px;
    padding: 10px var(--basic-gap);
  }

  .space__counter {
    position: static;
    display: block;
    width: auto;
    margin: 0 0 0 -8px;
  }

  .space__controls {
    width: auto;
    margin: 0 -14px 0 0;
  }

  .space__control {
    width: 44px;
    height: 44px;
    background-color: rgba(255, 255, 255, 0);
  }

  .space__description {
    padding: 0;
  }

  .space__headline {
    font-size: 18px;
  }

  .space__headline span {
    margin-bottom: 20px;
    font-size: 10px;
  }

  .space__text {
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 28px;
  }

  .space__accordion {
    padding: 15px;
  }

  .space__accordion--price {
    width: calc(100% - 12px);
    margin: 15px 6px 0;
  }

  .space__top {
    flex-direction: column;
  }

  .space__button {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 24px 0;
    padding: var(--basic-gap) 0;
    pointer-events: all;
  }

  .space__button::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 8px;
    height: 2px;
    margin: auto 0;
    border: 0;
    border-bottom: 2px solid rgba(51, 51, 51, 0.3);
    border-right: 2px solid rgba(51, 51, 51, 0.3);
    box-sizing: border-box;
    transform: rotate(0);
    transform-origin: center;
  }

  .space__indicators-list {
    align-self: flex-end;
  }

  .space__indicators-list:has(> :last-child:nth-child(3)) {
    align-self: flex-start;
    margin-left: 0;
    justify-content: space-between;
    width: 100%;
  }

    .space__indicators-list:has( > :last-child:nth-child(3)) .space__indicator {
      margin-left: 0;
      padding-left: 24px;
    }

  .space__accordion--closed .space__button::after {
    right: 1px;
    width: 6px;
    height: 6px;
    transform: rotate(45deg);
  }

  .space__accordion--closed .space__accordion-content {
    display: none;
  }

  .space__cell {
    font-size: 10px;
    line-height: 14px;
  }

  .space__cell--price {
    font-size: 14px;
    line-height: 20px;
    padding-right: 0;
  }

  .space__price-group-title,
  .space__price-time,
  .space__price-row .space__discount,
  .space__discount-note {
    font-size: 10px;
    line-height: 14px;
  }

  .space__price-row {
    grid-template-columns: minmax(105px, 1fr) 34px minmax(88px, auto);
    -moz-column-gap: 4px;
         column-gap: 4px;
  }

  .space__price-time {
    gap: 6px;
  }

  .space__price-value {
    font-size: 14px;
    line-height: 20px;
  }

  .space__resident-discount {
    font-size: 10px;
    line-height: 14px;
  }

  .space__time-option {
    font-size: 12px;
    line-height: 12px;
  }
    .space__accordion--content  > svg:nth-child(2) {
      margin-left: 5px;
    }

  .space__accordion--content-days > .space__accordion--content-line_item {
    width: 70px;
    min-width: 70px;
  }

  .space__accordion--content-line_item {
    width: 50px;
    min-width: 50px;
    height: 26px;
    min-height: 26px;
    font-size: 12px;
    line-height: 12px;
  }

  .space__amenities-list {
    font-size: 10px;
    line-height: 16px;
    gap: 10px 8px;
    min-height: 0;
  }

  .space__amenity {
    width: 100%;
    max-width: 100%;
    padding-left: 24px;
  }
}

/* BrainhubCarousel customizing */

.space__track,
.BrainhubCarousel__container,
.BrainhubCarousel,
.BrainhubCarousel .BrainhubCarousel__trackContainer,
.BrainhubCarousel .BrainhubCarousel__trackContainer .BrainhubCarousel__track,
.BrainhubCarouselItem {
  width: 501px;
  height: 370px;
  border-radius: 16px;
}

@media (max-width: 1024px) {
  .space__track,
  .BrainhubCarousel__container,
  .BrainhubCarousel,
  .BrainhubCarousel .BrainhubCarousel__trackContainer,
  .BrainhubCarousel .BrainhubCarousel__trackContainer .BrainhubCarousel__track,
  .BrainhubCarouselItem {
    width: 437px;
    height: 260px;
  }
}

@media (max-width: 576px) {
  .space__track,
  .BrainhubCarousel__container,
  .BrainhubCarousel,
  .BrainhubCarousel .BrainhubCarousel__trackContainer,
  .BrainhubCarousel .BrainhubCarousel__trackContainer .BrainhubCarousel__track,
  .BrainhubCarouselItem {
    width: calc((100vw - 40px) - 60px);
    width: calc(calc(100vw - 40px) - 60px);
    width: calc(var(--container-width-576) - 60px);
    height: calc((calc(100vw - 40px) - 60px) * 0.584);
    height: calc((var(--container-width-576) - 60px) * 0.584);
  }
}
/* POPUP FORM */

.popup {
  position: fixed;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(100% + 48px);
  text-align: left;
  z-index: 31;
  transform: translateY(-100vh);
  transition: transform 0.3s cubic-bezier(0.34, 0, 0, 1.22);
}

.popup__overlay {
  position: fixed;
  inset: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;

  background: rgba(51, 51, 51, 0.45) !important;
  backdrop-filter: blur(4px);
  transform: translateY(-100vh);
  transition: transform 0.3s cubic-bezier(0.34, 0, 0, 1.22);
}

.popup__content-wrapper {
  position: absolute;
  top: 40px;
  right: 40px;
  bottom: 40px;
  left: 40px;
  overflow: auto;
  border-radius: 4px;
  outline: currentcolor none medium;
  padding: 20px;
}

.popup__code-wrapper {
  margin-bottom: 17px;
}

.popup--shown {
  transform: translateY(0);
}

.popup__backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #333333;
}

.popup__form {
  font-family: "Verdana", "Helvetica", sans-serif;
  position: relative;
  width: 550px;
  max-width: 100%;
  max-height: 100vh;
  margin-top: 48px;
  background-color: white;
  border-radius: 4px;
  border: 1px solid #FEE8BD;
}

.popup__form--successfully-booked {
  width: 570px;
}

.popup__top {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 64px;
  padding: 30px 51px 12px;
  background-color: rgba(254, 232, 189, .1);
  z-index: 2;
}

.popup__logo {
  display: none;
}

.popup__close {
  position: absolute;
  top: 0;
  right: 12px;
  display: flex;
  width: 44px;
  height: 44px;
  margin-left: auto;
  margin-right: -14px;
  outline: 0;
}

.popup__close svg {
  stroke: #333333;
  display: inline-block;
  margin: auto;
  transition: stroke 0.2s ease-out;
}

.popup__close:hover svg,
.popup__close:focus svg {
  stroke: #f06724;
  stroke: var(--feature-color);
}

.popup__info {
  padding: 20px 51px 30px;
  background-color: rgba(254, 232, 189, .1);
}

.popup__summary {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 0.01em;
}

.popup__summary--right {
  display: flex;
  justify-content: space-between;
  flex-grow: 1;
  align-items: center;
  height: 69px;
  padding: 0 15px;
  background-color: white;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
}

.popup__pic {
  width: 97px;
  height: 69px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 4px;
}

.popup__pic,
.popup__description {
  margin-right: 20px;
}

.popup__accent {
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}

.popup__accent--larger {
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 18px;
  line-height: 25px;
  font-weight: 700;
}

.popup__text {
  opacity: 0.8;
  font-size: 10px;
  line-height: 14px;
}

.popup__text--success {
  margin-bottom: 17px;
}

.popup__text--error {
  margin-bottom: 17px;

  color: rgba(241, 78, 27, 1);
}

.popup__price {
  margin-left: auto;
  text-align: right;
}

.popup__package-coverage {
  margin-top: 1px;
}

.popup__selects {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 16px;
  margin-top: 24px;
  margin-top: var(--basic-gap);
}

.popup__selects .popup__group {
  width: 100%;
  margin: 0;
}

.popup__content {
  padding: 0 51px 24px;
  background-color: rgba(254, 232, 189, .1);
}

.popup__content.successfully-booked {
  justify-content: center;
  text-align: left;
  padding-bottom: 40px;
  padding-left: 40px;
  padding-right: 40px;
}

.popup__content.successfully-booked .successfully-booked-info {
  position: relative;
  padding: 0 0 40px 180px;
  font-size: 14px;
  font-family: "Verdana", "Helvetica", sans-serif;
  line-height: 20px;
}

.popup__content.successfully-booked .successfully-booked-info img {
  position: absolute;
  top: -45px;
  left: -75px;
  z-index: 10;
  border-radius: 8px;
}

.popup__content.successfully-booked .successfully-booked-info__info {
  width: 280px;
  display: flex;
  flex-flow: column;
  margin-bottom: 20px;
}

.popup__content.successfully-booked .successfully-booked-info__info span.bold {
    font-weight: 700;
  }

.popup__content.successfully-booked .successfully-booked-info__info .successfully-booked-info__asset-name {
    margin-bottom: 12px;
  }

.popup__content.successfully-booked .successfully-booked-info__info .successfully-booked-info__date {
    margin-bottom: 0;
  }

.popup__content.successfully-booked .successfully-booked-info__info .successfully-booked-info__admin-note {
    margin-top: 12px;
  }

.popup__content.successfully-booked .successfully-booked-info__detailed {
  font-size: 10px;
  line-height: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-column-gap: 20px;
  -moz-column-gap: 20px;
       column-gap: 20px;
  grid-row-gap: 8px;
  row-gap: 8px;
  padding: 10px 20px;
  background-color: white;
  border-radius: 4px;
  border: 1px solid #C6C6C6;
  align-items: start;
  width: 315px;
}

.popup__content.successfully-booked .successfully-booked-info__person {
  display: flex;
  flex-flow: column;
}

.popup__content.successfully-booked .successfully-booked-info__person:first-child {
  padding-right: 10px;
}

.popup__content.successfully-booked .successfully-booked-info__person--payment {
  align-items: flex-end;
  justify-self: end;
  text-align: right;
}

.popup__content.successfully-booked .successfully-booked-info__payment-note {
  grid-column: 1 / -1;
  padding-top: 8px;
  border-top: 1px solid rgba(198, 198, 198, 0.65);
}

.button--secondary,
.popup__content.successfully-booked .successfully-booked-close {
  margin-right: 0;
  background-color: #6F6F6F;
  color: white;
}

.popup__content.successfully-booked .successfully-booked-close:hover,
.popup__content.successfully-booked .successfully-booked-close:focus {
  opacity: 0.8;
}

.login-form__headline {
  margin-top: 20px;
  font-size: 12px;
  font-family: "Verdana", "Helvetica", sans-serif;
  line-height: 17px;
  font-weight: 700;
}

.nowrap {
  white-space: nowrap;
}

.popup__headline {
  font-family: "Mont", "Helvetica", sans-serif;
  font-weight: 700;
  margin: 0 auto;
}

.popup__subtitle {
  display: none;
  margin-bottom: 12px;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
}

.popup__wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  -moz-column-gap: 12px;
       column-gap: 12px;
}

.inner .popup__wrapper {
  /*margin-top: 20px;*/
}

.popup__toggler {
  width: 100%;
  margin-bottom: 16px;
}

.popup__group {
  width: 45%;
  flex-grow: 1;
  margin-bottom: 16px;

}

.popup__group fieldset {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-top: 10px;
    border: none;
    margin-left: 0;
    margin-right: 0;
    padding: 0;
  }

.popup__group fieldset > legend {
      padding-left: 0;
      padding-right: 0;
      font-size: 12px;
      line-height: 18px;
      font-weight: bolder;
      margin-bottom: 5px;
    }

.popup__group fieldset > input[type="radio"]:first-of-type {
      margin-right: -12px;
    }

.popup__group fieldset  > label {
      display: inline-block;
      cursor: pointer;
      width: -moz-max-content;
      width: max-content;
      height: 22px;
      font-size: 10px;
      line-height: 10px;
      color: #C6C6C6;
      border: 1px solid #C6C6C6;
      border-radius: 4px;
      padding: 5px 10px;
      margin-right: 15px;
      transition: border-color 0.2s ease-in, color 0.2s ease-in;
    }

.popup__group fieldset  > input[type="radio"]:checked + label {
      color: #333333;
      color: var(--copy-color);
      border-color: #333333;
      border-color: var(--copy-color);
    }

.popup__group:nth-of-type(odd) {
  margin-right: 0;
}

.popup__group--name {
  width: 100%;
}

.popup__group--message {
  width: 100%;
  margin-bottom: 24px;
  margin-right: 0;
}

.inner .popup__group--message {
  margin-bottom: 0;
}

.popup__group:hover svg {
  opacity: 1;
}

.popup__juk {
  position: absolute;
  bottom: 0;
  width: 40px;
  height: 40px;
  font-size: 16px;
  color: #333333;
  outline: 0;
  opacity: 0.4;
  transition: opacity 0.2s ease-in;
}

.popup__juk:hover,
.popup__juk:focus {
  opacity: 1;
}

.popup__juk:active {
  opacity: 0.2;
}

.popup__juk--minus {
  left: 8px;
}

.popup__juk--plus {
  right: 8px;
}

.popup__actions {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-top: 15px;
}

.popup__button {
  width: 45%;
  flex-grow: 1;
}

.popup__button--submit-code {
  width: 100%;
  margin-right: 0;
}

.popup__footer {
  width: 100%;
  margin-bottom: 24px;
}

.popup__footer.apply-accept-terms {
  margin-top: 24px;
}

.form__footer.apply-accept-terms > .popup__checkmark-label.orange {
  color: #333333;
  color: var(--copy-color);
}

.form__footer.apply-accept-terms > .popup__checkmark-label.orange::before {
  border-color: #333333;
  border-color: var(--copy-color);
}

.popup__checkmark-label {
  position: relative;
  display: block;
  padding-left: 35px;
}

.popup__checkmark-label::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  width: 16px;
  height: 16px;
  border: 1px solid rgba(51, 51, 51, 0.15);
  transition: border-color 0.2s ease-in;
}

.popup__checkmark-label:hover::before,
.popup__checkmark:focus ~ .popup__checkmark-label::before {
  border-color: rgba(51, 51, 51, 0.55);
}

.popup__checkmark:checked ~ .popup__checkmark-label::before {
  background-image: url("../../../img/icon-checkmark.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px auto;
}

.popup__checkmark-label a {
  font: inherit;
  color: #f06724;
  color: var(--feature-color);
}

.popup__errors {
  padding: 5px 10px;
  border-radius: 8px;
  font: inherit;
  color: #ffffff;
  background: #fcbf37;
  background: var(--secondary-feature-color);
  font-size: 12px;
  line-height: 17px;
  margin-bottom: -16px;
  margin-top: 15px;
}

/* POPUP SLIDER */

.popup-slider {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100vh + 48px);
  display: none;
  padding-bottom: 48px;
  color: #ffffff;
  background-color: #333333;
  z-index: 31;
  transform: translateY(100vh);
  transition: transform 0.3s cubic-bezier(0.34, 0, 0, 1.22);
}

.popup-slider--shown {
  transform: translateY(0);
}

.popup-slider__container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.popup-slider__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 62px 0 42px;
}

.popup-slider__close {
  outline: 0;
  opacity: 0.4;
  transition: opacity 0.2s ease-out;
}

.popup-slider__close:hover,
.popup-slider__close:focus {
  opacity: 1;
}

.popup-slider__close svg {
  stroke: #ffffff;
}

.popup-slider__headline {
  font-weight: 800;
  font-size: 22px;
  line-height: 32px;
}

.popup-slider__wrapper {
  display: flex;
  flex-direction: column;
}

.popup-slider__list {
  display: flex;
}

.popup-slider__pic {
  width: 1120px;
  height: 640px;
  max-height: calc(100vh - 260px);
  -o-object-fit: cover;
     object-fit: cover;
  background-color: #639;
}

video.popup-slider__pic {
  background-image: url("../../../img/func-hall.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.popup-slider .slider-footer__counter {
  color: rgba(255, 255, 255, 0.4);
}

.popup-slider .slider-footer__index {
  color: #ffffff;
}

.popup-slider svg {
  fill: #ffffff;
}

/* react modal modification */

.login-form__overlay {
  position: fixed;
  inset: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;

  width: 1224px;
  max-width: calc(100% - 48px);
  margin: 0 auto;

  opacity: 0;
  transform: translateX(400px);
  transition: all 500ms ease-in-out;
}

.login-form__overlay.ReactModal__Overlay--after-open {
  opacity: 1;
  transform: translateX(0);
}

.login-form__overlay.ReactModal__Overlay--before-close {
  opacity: 0;
  transform: translateX(100vw);
}

.popup__overlay.ReactModal__Overlay--after-open {
  transform: translateY(0);
}

.popup__overlay.ReactModal__Overlay--before-close {
  transform: translateY(-100vh);
}

.login-form__wrapper {
  position: absolute;
  top: 112px;
  right: 0;

  width: 336px;

  background-color: #ffffff;
  box-shadow: 0px 25px 40px rgba(51, 51, 51, 0.1);
}

.login-form__arrow {
  position: absolute;
  top: -5px;
  right: 18px;
}

.login-form__top {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 24px;
  margin-bottom: 36px;

  border-bottom: 1px solid rgba(36, 36, 36, 0.06);
}

.login-form__top-title {
  font-weight: 500;
  line-height: 16px;
  color: #242424;
}

.login-form__cross-wrapper {
  position: absolute;
  top: 0;
  right: 0;

  display: none;
  width: 64px;
  height: 64px;

  border-left: 1px solid rgba(36, 36, 36, 0.06);
  cursor: pointer;
}

.login-form__close-cross {
  width: 11px;
}

.login-form__top-button {
  margin-right: 17px;

  fill: rgba(36, 36, 36, 0.1);
  cursor: pointer;
}

.login-form__main {
  padding: 0 24px 24px 24px;
  height: 100%;
}

.login-form__main--code {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.login-form__text-top {
  padding: 0 20px;
  margin-bottom: 36px;

  line-height: 24px;
  text-align: center;
}

.login-form__text-top--phone {
  padding: 0;
}

.login-form__text-top--accent {
  font-weight: 500;
}

.login-form__button {
  width: 100%;
  height: 56px;
  padding: 0px 24px;
  margin-bottom: 28px;

  font-size: 16px;
  line-height: 24px;
  text-align: left;
}

.login-form__input {
  height: 56px;
  padding: 20px 16px;
  margin-bottom: 22px;

  color: rgba(36, 36, 36, 1);
}

.code-input {
  display: flex !important;
  justify-content: center;
  padding: 0;
}

.login-form__code-wrapper {
  margin-bottom: 17px;
}

.code-input > input {
  width: 48.84px;
  height: 56px;
  border: 1px solid rgba(36, 36, 36, 0.1);
  border-right-color: transparent;
  text-align: center;

  margin-left: -1px;
}

.code-input > input:last-child {
  border-right-color: rgba(36, 36, 36, 0.1);
}

.code-input > input:focus-visible {
  outline: 0;
}

.code-input > input:focus {
  position: relative;
  border-color: rgba(36, 36, 36, 0.4) !important;
}

.code-input > input[data-valid="false"] {
  border-color: rgba(241, 78, 27, 0.4);
}

.code-input > input[data-valid="false"]:first-child {
  border-left-color: rgba(241, 78, 27, 0.4);
}

.code-input > input[data-valid="false"]:last-child {
  border-right-color: rgba(241, 78, 27, 0.4);
}

.login-form__captcha {
  margin-bottom: 18px;
}

.login-form__captcha > div {
  position: relative;
  transform: scale(0.95);
  transform-origin: top left;
}

.login-form__button span {
  position: relative;
  left: 50%;
  display: inline-block;
  transition: all 0.2s ease-out;
  transform: translateX(-50%);
}

.login-form__button:hover span,
.login-form__button:focus span {
  left: 0;
  transform: translateX(0);
}

.login-form__button svg {
  display: block;
}

.login-form__text-bottom-wrapper--google {
  margin-bottom: 10px;
}

.login-form__text-bottom {
  font-size: 12px;
  line-height: 20px;
  text-align: center;
}

.login-form__text-bottom--error {
  margin-bottom: 24px;

  color: rgba(241, 78, 27, 1);
}

.login-form__text-bottom--accent {
  font-weight: 500;
}



.login-form__text-bottom--link {
  padding-bottom: 4px;

  font-weight: 500;

  background: linear-gradient(
      to right,
      rgba(36, 36, 36, 0.1),
      rgba(36, 36, 36, 0.1)
    )
    no-repeat;
  background-position: right bottom;
  background-size: 100% 1px;
}

.login-form__group {
  width: 100%;
  margin-bottom: 16px;
}

.login-form__name-input {
  width: 100%;

  color: rgba(36, 36, 36, 1);
}

.login-form__name-label {
  color: rgba(36, 36, 36, 0.7);
}

.login-form__button--name {
  margin-top: 8px;
  margin-bottom: 0;
}

.login-form__button--telegram {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-bottom: 20px;
}

.login-form__button--telegram > div {
  display: inline-flex;
  overflow: hidden;
  border-radius: 999px;
  --csstools-color-scheme--light: initial;
  color-scheme: light;
}

.login-form__button--telegram iframe {
  display: block;
  border-radius: 999px;
  --csstools-color-scheme--light: initial;
  color-scheme: light;
}

.successfully-booked .login-form__button--telegram {
  margin-bottom: 7px;
  margin-top: 20px;
}

/* responsive */

@media (max-width: 959px) {
  .popup-slider__top {
    margin: 28px 0 18px;
  }

  .popup-slider__headline {
    font-size: 16px;
    line-height: 26px;
  }

  .popup-slider__wrapper {
    flex-grow: 1;
  }

  .popup-slider__track {
    overflow: hidden;
  }

  .popup-slider__pic {
    height: 500px;
    max-height: calc(100vh - 140px);
  }

  .ReactModal__Overlay {
    width: 100%;
    max-width: 100%;
    min-height: 100vh;
  }

  .ReactModal__Content {
    top: 0;
    width: 100%;
    min-height: 100vh;
    overflow-y: scroll;
  }

  .login-form {
    position: relative;
    height: 100vh;
  }

  .login-form__cross-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .login-form__close-cross {
    display: block;
  }

  .login-form__captcha > div{
    left: 50%;
    transform: scale(0.95) translate(-50%, 0);
  }

  .login-form__text-bottom-wrapper {
    position: absolute;
    bottom: 28px;
    left: 50%;

    width: 290px;

    transform: translate(-50%, 0);
  }

  .login-form__text-bottom-wrapper--google  {
    bottom: 80px;
  }
}

@media (max-width: 812px) and (min-width: 568px) {
  .popup-slider__wrapper {
    flex-grow: 0;
    position: relative;
  }

  .popup-slider__footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.4);
  }
}

@media (max-width: 768px) {
  .popup-slider__track {
    max-height: 100%;
  }

  .popup-slider__list {
    height: 100%;
  }

  .popup-slider__pic {
    height: 320px;
    max-height: calc(100vh - 96px);
  }

  video.popup-slider__pic source {
    display: none;
  }
}

@media (max-width: 576px) {
  .popup {
    align-items: flex-start;
  }

  .popup__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    grid-column-gap: 8px;
    -moz-column-gap: 8px;
         column-gap: 8px;
    height: 72px;
    padding: 14px 16px;
  }

  .popup__headline {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    width: 100%;
  }

  .popup__close {
    position: static;
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    justify-self: end;
    width: 44px;
    height: 44px;
    margin: 0;
    border-radius: 50%;
    background-color: #f06724;
    background-color: var(--feature-color);
  }

  .popup__close svg,
  .popup__close:hover svg,
  .popup__close:focus svg {
    width: 18px;
    height: 18px;
    stroke: #ffffff;
    stroke-width: 2;
  }

  .popup__logo {
    fill: #000000;
    display: block;
  }

  .popup__content {
    padding-bottom: 124px;
  }

  .popup__group {
    margin-right: 0;
  }

  .popup__actions {
    flex-direction: column;
  }

  .popup__button {
    width: 100%;
    margin: 0 0 16px;
  }

  .popup__button:last-of-type {
    margin-bottom: 0;
  }

  .popup__headline {
    font-size: 16px;
    text-align: center;
  }

  .popup__info,
  .popup__content {
    padding: 16px;
  }

  .popup__accent {
    font-size: 12px;
    line-height: 17px;
  }

  .popup__description {
    margin-right: 0;
  }

  .popup__form {
    margin-top: 100px;
    max-width: calc(100vw - 40px);
    max-width: var(--container-width-576);
    max-height: 70vh;
    overflow-y: scroll;
    overflow-x: hidden;
  }

  .popup__summary {
    position: relative;
    flex-direction: column;
  }

  .popup__summary img {
    display: none;
  }

  .popup__summary--right {
    width: 100%;
  }

  .popup__selects {
    grid-template-columns: 1fr 1fr;
    justify-items: center;
  }

  .popup__selects .popup__group {
    max-width: 400px;
  }

  .popup__selects .popup__group:nth-child(1) {
    grid-column: 1 / 3;
  }

  .popup__pic {
    position: absolute;
    top: 20px;
    left: 20px;
  }

  .login-form__code-wrapper > input {
    width: 16.9%;
  }

  .popup__code-wrapper > input {
    width: 16.9%
  }

  .popup__content.successfully-booked .successfully-booked-info img {
    display: none;
  }

  .popup__content.successfully-booked .successfully-booked-info {
    width: 100%;
    padding: 0;
  }

  .popup__content.successfully-booked .successfully-booked-info__detailed {
    width: 100%;
  }
}

@media (max-width: 371px) {
    .form__footer:not(.franchise) > label {
      line-height: 12px;
    }
}

@media (max-width: 335px) {
  .login-form__captcha > div {
    transform: scale(0.898) translate(-50%, 0);
  }
}
.new-popup {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    width: 100vw;
    height: 100vh;
    /* На мобильных 100vh — это высота вместе с адресной строкой и нижней
       панелью браузера, поэтому отцентрованное окно уезжает под них и кнопка
       «забронировать» оказывается за краем экрана. dvh считает только видимую
       часть; строка выше остаётся запасным вариантом для старых браузеров. */
    height: 100dvh;
    display: none;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 300ms ease-in;
}

.new-popup__backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    background: rgba(51, 51, 51, 0.45);
    backdrop-filter: blur(4px);
}

.new-popup__background {
    width: 550px;
    height: 380px;
    z-index: 1002;
    background: white;
    outline: 1px solid #FEE8BD;
    border-radius: 6px;
}

.new-popup__wrapper {
    width: 100%;
    height: 100%;
    background: rgba(254, 232, 189, 0.1);
    display: flex;
    justify-content: space-between;
    position: relative;
}

.new-popup__image {
    z-index: 1;
    margin-top: 32px;
    margin-left: -48px;
    filter: drop-shadow(0px 4px 13px rgba(204, 204, 204, 0.2));
    border-radius: 8px;
}

.new-popup__image  > img,.new-popup__image  > picture {
        border-radius: 8px;
    }

.new-popup__image  > img#promo-image {
        width: 230px;
        height: 297px;
    }

.new-popup__content--wrapper {
    width: 365px;
    height: 100%;
    display: flex;
    flex-flow: column nowrap;
}

.new-popup__control {
    height: 32px;
    top: 4px;
    right: 24px;
    position: absolute;
    display: flex;
    justify-content: flex-end;
}

.new-popup__control > svg {
        cursor: pointer;
    }

.new-popup__headline {
    font-family: "Mont", "Helvetica", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 25px;
}

.new-popup__headline--description {
    font-family: "Verdana", "Helvetica", sans-serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
}

.new-popup__content#city-content {
    display: flex;
    flex-flow: column;
    width: 255px;
    gap: 10px;
    align-self: center;
    align-items: center;
    padding-top: 55px;
}

#city-content.new-popup__content > div:first-child {
        margin-bottom: 10px;
    }

#city-content.new-popup__content > a {
        width: 255px;
    }

.new-popup__content#tour-content,
.new-popup__content#promo-content {
    padding: 27px 20px;
    display: flex;
    flex-flow: column;
    gap: 10px;
    align-self: center;
}

#tour-content.new-popup__content .popup__checkmark-label::before {
        border-color: #f06724;
        border-color: var(--feature-color);
    }

#promo-content.new-popup__content .popup__checkmark-label::before {
        border-color: #f06724;
        border-color: var(--feature-color);
    }

.new-popup__content#thank-you-content {
    display: flex;
    flex-flow: column;
    justify-content: center;
    row-gap: 40px;
    height: 380px;
    align-items: center;
    text-align: center;
}

#thank-you-content.new-popup__content button {
        width: 300px;
    }

@media (max-width:576px) {
    .new-popup__background {
        width: 252px;
        /* min-height был жёстким и на невысоких экранах перебивал max-height:
           окно вырастало выше видимой области, а кнопка отправки пряталась под
           панелью браузера. Теперь пол уступает, когда места действительно нет. */
        min-height: min(382px, 100dvh - 32px);
        max-height: calc(100dvh - 32px);
        /* auto вместо scroll: полоса появляется, только когда есть что крутить. */
        overflow-y: auto;
        height: -moz-max-content;
        height: max-content;
        /* Чтобы кнопка не упиралась в индикатор home на iPhone. */
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    .new-popup__wrapper {
        flex-flow: column nowrap;
        justify-content: flex-start;
    }

    .new-popup__content--wrapper {
        width: 100%;
    }

    .new-popup__headline {
        font-size: 16px;
        line-height: 22px;
    }

    .new-popup__headline--description {
        text-align: center;
    }

    .new-popup__image {
        width: 185px;
        height: 167px;
        margin-top: -24px;
        margin-left: 0;
        align-self: center;
    }

        .new-popup__image > img#promo-image,.new-popup__image > img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

    .new-popup__content {
        align-items: center;
    }

    .new-popup__control {
        height: 16px;
        padding: 0;
        top: 10px;
        right: 10px;
        display: flex;
        justify-content: flex-end;
        z-index: 1;
    }

        .new-popup__control > svg {
            cursor: pointer;
        }

    .new-popup__content#city-content {
        width: 200px;
        padding-top: 24px;
        padding-bottom: 24px;
    }

    .new-popup__content#thank-you-content {
        height: 250px;
        padding: 40px 20px 20px;
        justify-content: flex-start;
    }

        #thank-you-content.new-popup__content button {
            width: 100%;
        }

    .new-popup__content#tour-content {
        padding: 27px 15px;
    }
}
/* PAGECLIP */

.pageclip-form__success {
  background-color: #ffffff;
}

/* PICKMEUP */

.pickmeup {
  margin-top: 16px;
  font-family: inherit;
  color: inherit;
  background-color: #ffffff;
  border: 1px solid rgba(51, 51, 51, 0.06);
  border-radius: 0;
  box-shadow: 0 25px 40px 0 rgba(15, 15, 21, 0.1);
  z-index: 32;
}

.pickmeup .pmu-instance {
  width: 288px;
  max-width: 100%;
  height: auto;
  padding: 0;
}

.pickmeup .pmu-instance nav {
  justify-content: space-between;
  padding: 16px 16px;
  line-height: 1em;
}

.pickmeup .pmu-instance nav,
.pickmeup .pmu-instance .pmu-button {
  color: inherit;
}

.pickmeup .pmu-days .pmu-button,
.pickmeup .pmu-months .pmu-button {
  border-radius: 50%;
  transition: all 0.2s ease-in;
}

.pickmeup .pmu-instance .pmu-not-in-month {
  opacity: 0.4;
}

.pickmeup .pmu-days .date-in-past {
  opacity: 0.2;
  pointer-events: none;
}

.pickmeup .pmu-instance .pmu-today {
  color: #f06724;
  color: var(--feature-color);
  background-color: rgba(255, 255, 255, 0);
}

.pickmeup .pmu-days .pmu-button:hover,
.pickmeup .pmu-months .pmu-button:hover,
.pickmeup .pmu-instance .pmu-selected {
  color: #ffffff;
  background: #f06724;
  background: var(--feature-color);
  opacity: 1;
}

.pickmeup .pmu-instance nav:not(.pmu-day-of-week) {
  border-bottom: 1px solid rgba(51, 51, 51, 0.06);
}

.pickmeup .pmu-instance nav .pmu-month {
  width: auto;
  margin: 0 12px;
  opacity: 0.4;
  transition: opacity 0.2s ease-in;
}

.pickmeup .pmu-instance nav .pmu-month:hover {
  color: inherit;
  opacity: 1;
}

.pickmeup .pmu-instance nav .pmu-prev,
.pickmeup .pmu-instance nav .pmu-next {
  display: block;
  width: 16px;
  height: 16px;
  font-size: 0;
  background-repeat: no-repeat;
  background-size: 16px auto;
  opacity: 0.2;
  transition: opacity 0.2s ease-in;
}

.pickmeup .pmu-instance nav .pmu-prev:hover,
.pickmeup .pmu-instance nav .pmu-next:hover {
  opacity: 1;
}

.pickmeup .pmu-instance nav .pmu-prev,
.pickmeup .pmu-instance nav .pmu-prev:hover {
  background-image: url("../../../img/icon-angle-arrow-right--gray.svg");
  background-position: center;
  transform: rotate(180deg);
}

.pickmeup .pmu-instance nav .pmu-next,
.pickmeup .pmu-instance nav .pmu-next:hover {
  background-image: url("../../../img/icon-angle-arrow-right--gray.svg");
  background-position: center;
}

.pickmeup .pmu-day-of-week,
.pickmeup .pmu-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-column-gap: 16px;
}

.pickmeup .pmu-instance .pmu-day-of-week {
  padding: 11px 12px 0;
  font-weight: 500;
  font-size: 11px;
  line-height: 13px;
  letter-spacing: 0.06em;
  color: inherit;
  text-transform: uppercase;
}

.pickmeup .pmu-instance .pmu-days {
  margin-bottom: -4px;
  padding: 0 12px;
}

.pickmeup .pmu-instance .pmu-day-of-week *,
.pickmeup .pmu-instance .pmu-days * {
  width: 24px;
  margin-bottom: 16px;
  padding: 0 2px;
}

.pickmeup .pmu-instance .pmu-days * {
  font-size: 12px;
  line-height: 24px;
}

.pickmeup .pmu-months,
.pickmeup .pmu-years {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 12px 12px 0;
}

.pickmeup .pmu-months .pmu-button,
.pickmeup .pmu-years .pmu-button {
  justify-self: center;
  height: auto;
  margin-bottom: 12px;
  font-size: 11px;
  line-height: 14px;
  text-transform: uppercase;
  border-radius: 50%;
}

.pickmeup .pmu-months .pmu-button {
  width: 44px;
  padding: 15px 0;
}

.pickmeup .pmu-years .pmu-button {
  width: 54px;
  padding: 20px 0;
}

/* google recaptcha */

.grecaptcha-badge {
  visibility: hidden; 
}
form.tour__form {
    font-family: "Verdana", "Helvetica", sans-serif;
}
form.tour__form button[type="submit"] {
        width: 100%;
    }

.form__group {
    height: 40px;
}

.form__group input,.form__group select {
        padding: 10px 20px;
        background: white;
        border-radius: 4px;
    }

.form__group svg {
        right: 10px;
    }

.form__input {
    font-family: "Verdana", "Helvetica", sans-serif;
    border: 1px solid #c6c6c6;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    height: 40px;
    width: 100%;
    padding: 10px 20px;
    font-size: 14px;
    color: #333333;
    color: var(--copy-color);
    line-height: 20px;
    transition: border-color 0.2s ease-in;
}

.form__input:focus,.form__input:active {
        outline: none;
        border: 1px solid #333333;
        border: 1px solid var(--copy-color);
    }

.form__input::placeholder,.form__input::-webkit-input-placeholder,.form__input.form__input::-moz-placeholder,.form__input:-ms-input-placeholder,.form__input::-ms-input-placeholder {
        font-size: 14px;
        color: #c6c6c6;
        color: var(--border-color);
        line-height: 20px;
    }

.form__input.input--message {
    height: 74px;
}

form p:nth-of-type(2) {
    margin-top: 12px;
}

form p.form__actions {
    margin-top: 15px;
}

form.tour__form fieldset {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-top: 10px;
    border: none;
    margin-left: 0;
    margin-right: 0;
    padding: 0;
}

form.tour__form fieldset > legend {
        padding-left: 0;
        padding-right: 0;
        font-size: 12px;
        line-height: 18px;
        font-weight: bolder;
        margin-bottom: 5px;
    }

form.tour__form fieldset > input[type="radio"]:first-of-type {
        margin-right: -12px;
    }

form.tour__form fieldset > label {
    display: inline-block;
    cursor: pointer;
    width: -moz-max-content;
    width: max-content;
    height: 22px;
    font-size: 10px;
    line-height: 10px;
    color: #6F6F6F;
    border: 1px solid #6F6F6F;
    border-radius: 4px;
    padding: 5px 10px;
    transition: border-color 0.2s ease-in, color 0.2s ease-in;
}

form.tour__form fieldset>input[type="radio"]:checked+label {
    color: #333333;
    color: var(--copy-color);
    border-color: #333333;
    border-color: var(--copy-color);
}

.widget form.tour__form fieldset > label,
.new-popup form.tour__form fieldset > label {
    border: 1px solid #C6C6C6;
}

.form__footer {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 15px;
}

.form__footer > label {
        cursor: pointer;
        font-size: 10px;
        color: rgba(51, 51, 51, 0.5);
        padding-left: 25px;
    }

.form__footer .popup__checkmark-label::before {
        border: 1px solid white;
        border-radius: 2px;
    }

.form__footer .popup__checkmark-label.orange::before {
        border: 1px solid #C6C6C6;
    }

.form__footer .popup__checkmark-label:hover::before,.form__footer .popup__checkmark:focus ~ .popup__checkmark-label::before {
        border-color: white;
    }

.form__footer .popup__checkmark-label.orange:hover::before,.form__footer .popup__checkmark:focus ~ .popup__checkmark-label.orange::before {
        border-color: #f06724;
        border-color: var(--feature-color);
    }

@media (max-width: 768px) {
        .form__footer .popup__checkmark-label::before {
            border: 1px solid #f06724;
            border: 1px solid var(--feature-color);
            border-radius: 2px;
        }

        .form__footer .popup__checkmark-label:hover::before,.form__footer .popup__checkmark:focus ~ .popup__checkmark-label::before {
            border-color: #f06724;
            border-color: var(--feature-color);
        }

    form.tour__form fieldset {
        margin-top: 6px;
    }
}

@media (max-width: 576px) {
        .form__footer > label {
            cursor: pointer;
            font-size: 10px;
            color: rgba(51, 51, 51, 0.5);
            padding-left: 25px;
        }
}
.react-datepicker-popper {
  z-index: 4;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle, .react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  margin-left: -8px;
  position: absolute;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle, .react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
  box-sizing: content-box;
  position: absolute;
  border: 8px solid transparent;
  height: 0;
  width: 1px;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
  content: "";
  z-index: -1;
  border-width: 8px;
  left: -8px;
  border-bottom-color: #aeaeae;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle {
  top: 0;
  margin-top: -8px;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle, .react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::before {
  border-top: none;
  border-bottom-color: #f0f0f0;
}

.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle::before {
  top: -1px;
  border-bottom-color: #aeaeae;
}

.react-datepicker-popper .react-datepicker__triangle {
  display: none;
}

.react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  bottom: 0;
  margin-bottom: -8px;
}

.react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
  border-bottom: none;
  border-top-color: #fff;
}

.react-datepicker-popper[data-placement^="top"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before {
  bottom: -1px;
  border-top-color: #aeaeae;
}

.react-datepicker-wrapper {
  display: inline-block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
}


.payment-form .start .react-datepicker-wrapper {
  width: 210px;
}

.payment-form .start .react-datepicker-wrapper input{
  height: 38px;
}

.react-datepicker {
  width: 288px;
  font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.8rem;
  background-color: #ffffff;
  color: #333333;
  border: 1px solid rgba(51, 51, 51, 0.06);
  display: inline-block;
  position: relative;
  box-shadow: 0 25px 40px 0 rgba(15, 15, 21, 0.1);
}

.react-datepicker--time-only .react-datepicker__triangle {
  left: 35px;
}

.react-datepicker--time-only .react-datepicker__time-container {
  border-left: 0;
}

.react-datepicker--time-only .react-datepicker__time {
  border-radius: 0.3rem;
}

.react-datepicker--time-only .react-datepicker__time-box {
  border-radius: 0.3rem;
}

.react-datepicker__triangle {
  position: absolute;
  left: 50px;
}

.react-datepicker-popper[data-placement^="bottom"] {
  margin-top: 10px;
}

.react-datepicker-popper[data-placement="bottom-end"] .react-datepicker__triangle, .react-datepicker-popper[data-placement="top-end"] .react-datepicker__triangle {
  left: auto;
  right: 50px;
}

.react-datepicker-popper[data-placement^="top"] {
  margin-bottom: 10px;
}

.react-datepicker-popper[data-placement^="right"] {
  margin-left: 8px;
}

.react-datepicker-popper[data-placement^="right"] .react-datepicker__triangle {
  left: auto;
  right: 42px;
}

.react-datepicker-popper[data-placement^="left"] {
  margin-right: 8px;
}

.react-datepicker-popper[data-placement^="left"] .react-datepicker__triangle {
  left: 42px;
  right: auto;
}

.react-datepicker__header {
  position: relative;
}

.react-datepicker__header--time {
  padding-bottom: 8px;
  padding-left: 5px;
  padding-right: 5px;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select,
.react-datepicker__month-year-dropdown-container--select,
.react-datepicker__year-dropdown-container--scroll,
.react-datepicker__month-dropdown-container--scroll,
.react-datepicker__month-year-dropdown-container--scroll {
  display: inline-block;
  margin: 0 2px;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
  margin-top: 0;
  color: #000;
  font-weight: bold;
  font-size: 0.944rem;
}

.react-datepicker__current-month::first-letter {
   text-transform: uppercase;
}
.react-datepicker__current-month {
  padding: 16px 16px;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  color: inherit;
  text-align: center;
  border-bottom: 1px solid rgba(51, 51, 51, 0.06);
}

.react-datepicker-time__header {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.react-datepicker__navigation {
  background: none;
  line-height: 1.7rem;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: 8px;
  width: 32px;
  height: 32px;
  padding: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px auto;
  border: 0;
  outline: 0;
  z-index: 1;
  text-indent: -999em;
  overflow: hidden;
  opacity: 0.2;
}

.react-datepicker__navigation--previous {
  left: 10px;
  background-image: url("../../../img/icon-angle-arrow-left--gray.svg");
}

.react-datepicker__navigation:hover {
  opacity: 1;
}

.react-datepicker__navigation--previous--disabled, .react-datepicker__navigation--previous--disabled:hover {
  opacity: 0.1;
  cursor: default;
}

.react-datepicker__navigation--next {
  right: 10px;
  background-image: url("../../../img/icon-angle-arrow-right--gray.svg");
}

.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
  right: 80px;
}

.react-datepicker__navigation--next--disabled, .react-datepicker__navigation--next--disabled:hover {
  opacity: 0.1;
  cursor: default;
}

.react-datepicker__navigation--years {
  position: relative;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.react-datepicker__navigation--years-previous {
  top: 4px;
  border-top-color: #ccc;
}

.react-datepicker__navigation--years-previous:hover {
  border-top-color: #b3b3b3;
}

.react-datepicker__navigation--years-upcoming {
  top: -4px;
  border-bottom-color: #ccc;
}

.react-datepicker__navigation--years-upcoming:hover {
  border-bottom-color: #b3b3b3;
}

.react-datepicker__year {
  margin: 0.4rem;
  text-align: center;
}

.react-datepicker__year-wrapper {
  display: flex;
  flex-wrap: wrap;
  max-width: 180px;
}

.react-datepicker__year .react-datepicker__year-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__month {
  padding: 0 12px 12px;
  text-align: center;
}

.react-datepicker__month .react-datepicker__month-text,
.react-datepicker__month .react-datepicker__quarter-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__input-time-container {
  clear: both;
  width: 100%;
  float: left;
  margin: 5px 0 10px 15px;
  text-align: left;
}

.react-datepicker__input-time-container .react-datepicker-time__caption {
  display: inline-block;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container {
  display: inline-block;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
  display: inline-block;
  margin-left: 10px;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
  width: 85px;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type="time"]::-webkit-inner-spin-button,
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type="time"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type="time"] {
  -moz-appearance: textfield;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
  margin-left: 5px;
  display: inline-block;
}

.react-datepicker__time-container {
  float: right;
  border-left: 1px solid #aeaeae;
  width: 85px;
}

.react-datepicker__time-container--with-today-button {
  display: inline;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  position: absolute;
  right: -72px;
  top: 0;
}

.react-datepicker__time-container .react-datepicker__time {
  position: relative;
  background: white;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
  width: 85px;
  overflow-x: hidden;
  margin: 0 auto;
  text-align: center;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
  list-style: none;
  margin: 0;
  height: calc(195px + (1.7rem / 2));
  overflow-y: scroll;
  padding-right: 0px;
  padding-left: 0px;
  width: 100%;
  box-sizing: content-box;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
  height: 30px;
  padding: 5px 10px;
  white-space: nowrap;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
  cursor: pointer;
  background-color: #f0f0f0;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
  background-color: #216ba5;
  color: white;
  font-weight: bold;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
  background-color: #216ba5;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
  color: #ccc;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__week-number {
  color: #ccc;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}

.react-datepicker__week-number.react-datepicker__week-number--clickable {
  cursor: pointer;
}

.react-datepicker__week-number.react-datepicker__week-number--clickable:hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}

.react-datepicker__day-names,
.react-datepicker__week {
  display: flex;
  justify-content: space-between;
  white-space: nowrap;
}

.react-datepicker__week {
  margin-top: 16px;
}

.react-datepicker__day-names {
  padding: 11px 12px 0;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
  width: 1.7rem;
  font-size: 11px;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
  text-transform: uppercase;
}

.react-datepicker__day-name,
.react-datepicker__day {
  width: 24px;
  margin: 0;
}

.react-datepicker__day-name {
  line-height: 16px;
}

.react-datepicker__day {
  line-height: 24px;
}

.react-datepicker__month--selected, .react-datepicker__month--in-selecting-range, .react-datepicker__month--in-range,
.react-datepicker__quarter--selected,
.react-datepicker__quarter--in-selecting-range,
.react-datepicker__quarter--in-range {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}

.react-datepicker__month--selected:hover, .react-datepicker__month--in-selecting-range:hover, .react-datepicker__month--in-range:hover,
.react-datepicker__quarter--selected:hover,
.react-datepicker__quarter--in-selecting-range:hover,
.react-datepicker__quarter--in-range:hover {
  background-color: #1d5d90;
}

.react-datepicker__month--disabled,
.react-datepicker__quarter--disabled {
  color: #ccc;
  pointer-events: none;
}

.react-datepicker__month--disabled:hover,
.react-datepicker__quarter--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__day,
.react-datepicker__month-text,
.react-datepicker__quarter-text,
.react-datepicker__year-text {
  cursor: pointer;
}

.react-datepicker__day:hover,
.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover,
.react-datepicker__year-text:hover {
  border-radius: 50%;
  background-color: #f0f0f0;
}

.react-datepicker__day--today,
.react-datepicker__month-text--today,
.react-datepicker__quarter-text--today,
.react-datepicker__year-text--today {
  color: #f06724;
}

.react-datepicker__day--highlighted,
.react-datepicker__month-text--highlighted,
.react-datepicker__quarter-text--highlighted,
.react-datepicker__year-text--highlighted {
  border-radius: 0.3rem;
  background-color: #3dcc4a;
  color: #fff;
}

.react-datepicker__day--highlighted {
  border-radius: 50%;
}

.react-datepicker__day--highlighted:hover,
.react-datepicker__month-text--highlighted:hover,
.react-datepicker__quarter-text--highlighted:hover,
.react-datepicker__year-text--highlighted:hover {
  background-color: #32be3f;
}

.react-datepicker__day--highlighted-custom-1,
.react-datepicker__month-text--highlighted-custom-1,
.react-datepicker__quarter-text--highlighted-custom-1,
.react-datepicker__year-text--highlighted-custom-1 {
  color: magenta;
}

.react-datepicker__day--highlighted-custom-2,
.react-datepicker__month-text--highlighted-custom-2,
.react-datepicker__quarter-text--highlighted-custom-2,
.react-datepicker__year-text--highlighted-custom-2 {
  color: green;
}

.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--selected,
.react-datepicker__year-text--in-selecting-range,
.react-datepicker__year-text--in-range {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}

.react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--in-range:hover,
.react-datepicker__quarter-text--selected:hover,
.react-datepicker__quarter-text--in-selecting-range:hover,
.react-datepicker__quarter-text--in-range:hover,
.react-datepicker__year-text--selected:hover,
.react-datepicker__year-text--in-selecting-range:hover,
.react-datepicker__year-text--in-range:hover {
  background-color: #1d5d90;
}

.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
  border-radius: 0.3rem;
  background-color: #2a87d0;
  color: #fff;
}

.react-datepicker__day--keyboard-selected:hover,
.react-datepicker__month-text--keyboard-selected:hover,
.react-datepicker__quarter-text--keyboard-selected:hover,
.react-datepicker__year-text--keyboard-selected:hover {
  background-color: #1d5d90;
}

.react-datepicker__day--selected,
.react-datepicker__day--selected:hover,
.react-datepicker__day--keyboard-selected,
.react-datepicker__day--keyboard-selected:hover {
  color: #ffffff;
  background-color: #f06724;
  border-radius: 50%;
}

.react-datepicker__day--in-selecting-range ,
.react-datepicker__month-text--in-selecting-range ,
.react-datepicker__quarter-text--in-selecting-range ,
.react-datepicker__year-text--in-selecting-range {
  background-color: rgba(33, 107, 165, 0.5);
}

.react-datepicker__month--selecting-range .react-datepicker__day--in-range , .react-datepicker__month--selecting-range
.react-datepicker__month-text--in-range , .react-datepicker__month--selecting-range
.react-datepicker__quarter-text--in-range , .react-datepicker__month--selecting-range
.react-datepicker__year-text--in-range {
  background-color: #f0f0f0;
  color: #000;
}

.react-datepicker__day--disabled,
.react-datepicker__month-text--disabled,
.react-datepicker__quarter-text--disabled,
.react-datepicker__year-text--disabled {
  cursor: default;
  color: #ccc;
}

.react-datepicker__day--disabled:hover,
.react-datepicker__month-text--disabled:hover,
.react-datepicker__quarter-text--disabled:hover,
.react-datepicker__year-text--disabled:hover {
  background-color: transparent;
}

.react-datepicker__day--outside-month {
  opacity: 0.4;
}

.react-datepicker__month-text.react-datepicker__month--selected:hover, .react-datepicker__month-text.react-datepicker__month--in-range:hover, .react-datepicker__month-text.react-datepicker__quarter--selected:hover, .react-datepicker__month-text.react-datepicker__quarter--in-range:hover,
.react-datepicker__quarter-text.react-datepicker__month--selected:hover,
.react-datepicker__quarter-text.react-datepicker__month--in-range:hover,
.react-datepicker__quarter-text.react-datepicker__quarter--selected:hover,
.react-datepicker__quarter-text.react-datepicker__quarter--in-range:hover {
  background-color: #216ba5;
}

.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover {
  background-color: #f0f0f0;
}

.react-datepicker__input-container {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}

.react-datepicker__year-read-view,
.react-datepicker__month-read-view,
.react-datepicker__month-year-read-view {
  border: 1px solid transparent;
  border-radius: 0.3rem;
}

.react-datepicker__year-read-view:hover,
.react-datepicker__month-read-view:hover,
.react-datepicker__month-year-read-view:hover {
  cursor: pointer;
}

.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
  border-top-color: #b3b3b3;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  border-top-color: #ccc;
  float: right;
  margin-left: 20px;
  top: 8px;
  position: relative;
  border-width: 0.45rem;
}

.react-datepicker__year-dropdown,
.react-datepicker__month-dropdown,
.react-datepicker__month-year-dropdown {
  background-color: #f0f0f0;
  position: absolute;
  width: 50%;
  left: 25%;
  top: 30px;
  z-index: 1;
  text-align: center;
  border-radius: 0.3rem;
  border: 1px solid #aeaeae;
}

.react-datepicker__year-dropdown:hover,
.react-datepicker__month-dropdown:hover,
.react-datepicker__month-year-dropdown:hover {
  cursor: pointer;
}

.react-datepicker__year-dropdown--scrollable,
.react-datepicker__month-dropdown--scrollable,
.react-datepicker__month-year-dropdown--scrollable {
  height: 150px;
  overflow-y: scroll;
}

.react-datepicker__year-option,
.react-datepicker__month-option,
.react-datepicker__month-year-option {
  line-height: 20px;
  width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.react-datepicker__year-option:first-of-type,
.react-datepicker__month-option:first-of-type,
.react-datepicker__month-year-option:first-of-type {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}

.react-datepicker__year-option:last-of-type,
.react-datepicker__month-option:last-of-type,
.react-datepicker__month-year-option:last-of-type {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker__year-option:hover,
.react-datepicker__month-option:hover,
.react-datepicker__month-year-option:hover {
  background-color: #ccc;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
  border-bottom-color: #b3b3b3;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
  border-top-color: #b3b3b3;
}

.react-datepicker__year-option--selected,
.react-datepicker__month-option--selected,
.react-datepicker__month-year-option--selected {
  position: absolute;
  left: 15px;
}

.react-datepicker__close-icon {
  cursor: pointer;
  background-color: transparent;
  border: 0;
  outline: 0;
  padding: 0px 6px 0px 0px;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}

.react-datepicker__close-icon::after {
  cursor: pointer;
  background-color: #216ba5;
  color: #fff;
  border-radius: 50%;
  height: 16px;
  width: 16px;
  padding: 2px;
  font-size: 12px;
  line-height: 1;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  content: "\00d7";
}

.react-datepicker__today-button {
  background: #f0f0f0;
  border-top: 1px solid #aeaeae;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  padding: 5px 0;
  clear: left;
}

.react-datepicker__portal {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  left: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  display: flex;
  z-index: 2147483647;
}

.react-datepicker__portal .react-datepicker__day-name,
.react-datepicker__portal .react-datepicker__day,
.react-datepicker__portal .react-datepicker__time-name {
  width: 3rem;
  line-height: 3rem;
}

@media (max-width: 400px), (max-height: 550px) {
  .react-datepicker__portal .react-datepicker__day-name,
  .react-datepicker__portal .react-datepicker__day,
  .react-datepicker__portal .react-datepicker__time-name {
    width: 2rem;
    line-height: 2rem;
  }
}

.react-datepicker__portal .react-datepicker__current-month,
.react-datepicker__portal .react-datepicker-time__header {
  font-size: 1.44rem;
}

.react-datepicker__portal .react-datepicker__navigation {
  border: 0.81rem solid transparent;
}

.react-datepicker__portal .react-datepicker__navigation--previous {
  border-right-color: #ccc;
}

.react-datepicker__portal .react-datepicker__navigation--previous:hover {
  border-right-color: #b3b3b3;
}

.react-datepicker__portal .react-datepicker__navigation--previous--disabled, .react-datepicker__portal .react-datepicker__navigation--previous--disabled:hover {
  border-right-color: #e6e6e6;
  cursor: default;
}

.react-datepicker__portal .react-datepicker__navigation--next {
  border-left-color: #ccc;
}

.react-datepicker__portal .react-datepicker__navigation--next:hover {
  border-left-color: #b3b3b3;
}

.react-datepicker__portal .react-datepicker__navigation--next--disabled, .react-datepicker__portal .react-datepicker__navigation--next--disabled:hover {
  border-left-color: #e6e6e6;
  cursor: default;
}

/* Месячный календарь (фильтры «С:/По:» в отчётах) выглядит так же, как дневной.
   Плагин рисует его другой разметкой, и без этих правил он остаётся в дефолтном
   виде: голая подпись года вместо шапки, синяя подсветка вместо фирменной и
   ячейки другого размера. Классы месяца в дневном календаре не участвуют,
   поэтому бронирование эти правила не задевают. */
.react-datepicker-year-header {
  padding: 16px;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  color: inherit;
  text-align: center;
  border-bottom: 1px solid rgba(51, 51, 51, 0.06);
}

.react-datepicker__month-wrapper {
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
}

.react-datepicker__month .react-datepicker__month-text {
  width: 80px;
  margin: 0;
  padding: 4px 0;
  font-size: 11px;
  line-height: 16px;
  text-transform: uppercase;
}

.react-datepicker__month-text:hover {
  border-radius: 12px;
}

.react-datepicker__month-text--selected,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__month-text--keyboard-selected:hover {
  color: #ffffff;
  background-color: #f06724;
  border-radius: 12px;
}
.BrainhubCarouselItem{display:flex;justify-content:center;align-items:center;position:relative}.BrainhubCarouselItem.BrainhubCarouselItem--clickable{cursor:pointer}.BrainhubCarouselItem .debug-number{position:absolute;top:0;bottom:0;left:0;right:0;display:flex;justify-content:center;font-size:2em;text-shadow:0px 0px 9px white}
.BrainhubCarousel__dots{display:flex;justify-content:center;list-style:none;margin:0;padding:0;font-size:0;line-height:0}.BrainhubCarousel__dots.BrainhubCarousel__dots--isRTL{direction:rtl}.BrainhubCarousel__dots .BrainhubCarousel__dot{outline:0;padding:10px;border:none;opacity:0.5;font-size:0;cursor:pointer;-webkit-appearance:none}.BrainhubCarousel__dots .BrainhubCarousel__dot.BrainhubCarousel__dot--selected{opacity:1 !important}.BrainhubCarousel__dots .BrainhubCarousel__dot:hover{opacity:1}.BrainhubCarousel__dots .BrainhubCarousel__dot:before{content:'';display:block;width:5px;height:5px;border-radius:50%;padding:0;border:none;background:#000}.BrainhubCarousel__dots .BrainhubCarousel__thumbnail{outline:0;padding:10px;border:none;opacity:0.5;font-size:0;cursor:pointer}.BrainhubCarousel__dots .BrainhubCarousel__thumbnail.BrainhubCarousel__thumbnail--selected{opacity:1 !important}.BrainhubCarousel__dots .BrainhubCarousel__thumbnail:hover{opacity:1}.BrainhubCarousel__thumbnail[type=button]{-webkit-appearance:none}.BrainhubCarousel--isRTL+.BrainhubCarousel__dots{direction:rtl}
.BrainhubCarousel__container{width:100%;overflow:hidden}.BrainhubCarousel{overflow:hidden;display:flex;align-items:center}.BrainhubCarousel.BrainhubCarousel--isRTL{direction:rtl}.BrainhubCarousel.BrainhubCarousel--isRTL .BrainhubCarousel__trackContainer .BrainhubCarousel__track{direction:rtl}.BrainhubCarousel .BrainhubCarousel__trackContainer{overflow:hidden}.BrainhubCarousel .BrainhubCarousel__trackContainer .BrainhubCarousel__track{display:flex;overflow:hidden;list-style:none;margin:0;padding:0}.BrainhubCarousel .BrainhubCarousel__trackContainer .BrainhubCarousel__track.BrainhubCarousel__track--transition{transition:transform}.BrainhubCarousel__arrows{cursor:pointer}.BrainhubCarousel__loader{width:50px;height:50px;border-radius:100%;border:4px solid #7b59ff;border-left-color:transparent;animation:loader 1s infinite linear}@keyframes loader{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.BrainhubCarousel__arrows{position:relative;padding:21px;border:none;overflow:hidden;outline:0;font-size:0;line-height:0;background-color:#7b59ff}.BrainhubCarousel__arrows span{display:block;position:absolute;top:50%;left:50%;border-style:solid;border-color:#fff;border-width:3px 3px 0 0;padding:5px;transition:0.3s;font-size:0}.BrainhubCarousel__arrows:hover{background-color:#8768ff}.BrainhubCarousel__arrows:hover span{display:block;position:absolute;top:50%;left:50%;border-style:solid;border-color:#fff;border-width:3px 3px 0 0;padding:5px;transition:0.3s;font-size:0}.BrainhubCarousel__arrows:hover:enabled{background-color:#8768ff}.BrainhubCarousel__arrows:hover:enabled span{border-color:#fff;margin:0}.BrainhubCarousel__arrows:disabled{background-color:#ccc}.BrainhubCarousel__arrowLeft span{transform:translate(-50%, -50%) rotate(-135deg);margin-left:2.45px}.BrainhubCarousel__arrowRight span{transform:translate(-50%, -50%) rotate(45deg);margin-left:-2.45px}.BrainhubCarousel--isRTL .BrainhubCarousel__arrowLeft span{transform:translate(-50%, -50%) rotate(45deg);margin-left:-2.45px}.BrainhubCarousel--isRTL .BrainhubCarousel__custom-arrowLeft span{transform:rotate(180deg)}.BrainhubCarousel--isRTL .BrainhubCarousel__arrowRight span{transform:translate(-50%, -50%) rotate(-135deg);margin-left:2.45px}.BrainhubCarousel--isRTL .BrainhubCarousel__custom-arrowRight span{transform:rotate(-180deg)}.BrainhubCarousel--isRTL .BrainhubCarousel__arrows:hover span{margin:0}.BrainhubCarousel__arrow--disable{pointer-events:none}
/* FAQ на странице аренды переговорок.
 *
 * Повторяет вид блока «частые вопросы» с solo-страниц, но живёт отдельным
 * файлом: страница брони не подключает ekb-workflow.css, а тянуть его целиком
 * ради одного блока значит переопределить ей половину вёрстки. */

.booking-faq {
  padding: 80px 0 40px;
}

.booking-faq__heading {
  margin-bottom: 52px;
}

.booking-faq__eyebrow {
  color: #f06724;
  color: var(--feature-color);
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.03em;
  margin: 0 0 14px;
  text-transform: lowercase;
}

/* Размеры и переносы — как у .solo-section__title на solo-страницах, чтобы
   заголовок FAQ выглядел одинаково во всех разделах сайта. */
.booking-faq__title {
  color: #333333;
  color: var(--copy-color);
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: normal;
  line-height: 50px;
  margin: 0;
}

/*
 * Без этого оранжевое слово осталось бы 42px против 64px у чёрного: fonts.css
 * задаёт декоративным словам внутри h2 свой размер. Множитель тот же, что и на
 * остальных страницах (см. ekb-workflow.css) — Zinovia рисует буквы ниже Mont
 * при одинаковом размере, и 1.085 выравнивает их по высоте. В em, чтобы
 * работало на всех разрешениях без отдельных значений.
 */
.booking-faq__title .decorative {
  font-family: "Zinovia", "Helvetica", sans-serif;
  font-size: 1.085em;
  font-weight: 400;
  line-height: inherit;
}

.booking-faq__list {
  display: grid;
  grid-gap: 0 60px;
  gap: 0 60px;
  grid-template-columns: 1fr 1fr;
}

.booking-faq__list details {
  border-top: 1px solid #c6c6c6;
  border-top: 1px solid var(--border-color);
  padding: 20px 0;
}

.booking-faq__list summary {
  cursor: pointer;
  font-family: "Mont", "Helvetica", sans-serif;
  font-size: 18px;
  font-weight: 600;
}

.booking-faq__list details p {
  color: rgba(36, 36, 36, 0.8);
  color: var(--secondary-copy-color);
  line-height: 1.5;
  margin: 16px 0 0;
}

@media (max-width: 900px) {
  .booking-faq {
    padding: 48px 0 24px;
  }

  .booking-faq__list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .booking-faq__title {
    font-size: 24px;
    line-height: 34px;
  }
}

@media (max-width: 576px) {
  .booking-faq__title {
    font-size: 20px;
    line-height: 28px;
  }
}

.booking-loading {
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: #666;
  font-family: "Mont", "Verdana", sans-serif;
  font-size: 18px;
}

.booking-loading__spinner {
  width: 30px;
  height: 30px;
  border: 3px solid rgba(240, 103, 36, 0.2);
  border-top-color: #f06724;
  border-radius: 50%;
  animation: booking-loading-spin 0.8s linear infinite;
}

.booking-loading--error {
  color: #b3261e;
}

@keyframes booking-loading-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .booking-loading__spinner {
    animation: none;
  }
}