/*
 * Стили новой главной (шаблон yp-home.php, RU и EN).
 * Первая часть — правила из main.css, которые нужны этой странице (без кода Webflow).
 * В конце файла — то, что раньше делали скрипты Webflow: шапка, меню, окна команды, видео.
 */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  display: inline-block;
}

button {
  font: inherit;
  color: inherit;
  text-align: inherit;
  text-transform: none;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

p, dl, dd {
  margin: 0;
}

* {
  box-sizing: border-box;
}

@font-face {
  font-family: Iowan Old Style;
  src: url("../fonts/691b35e72b15df7051b3d561_iowan-old-style_italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Iowan Old Style;
  src: url("../fonts/691b35e7671a120a218e57d5_iowan-old-style_regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --light: #f5f3eb;
  --black: #333132;
  --white: white;
  --red: #b42b35;
  --brown: #5f4d47;
  --green: #464d15;
  --dark-green: #30330e;
}

body {
  background-color: var(--light);
  color: var(--black);
  font-family: Iowan Old Style, Arial, sans-serif;
  font-size: 1vw;
  line-height: 1.4;
}

h1 {
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Viaoda Libre, sans-serif;
  font-size: 4.25em;
  font-weight: 400;
  line-height: 1.2;
}

h2 {
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Viaoda Libre, sans-serif;
  font-size: 3.44em;
  font-weight: 400;
  line-height: 1.2;
}

p {
  margin-bottom: 0;
  font-size: 1em;
}

ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 1.88em;
}

.p-16 {
  font-size: 1em;
  line-height: 1.4;
}

.u-desktop-hide {
  display: none;
}

.p-20 {
  font-size: 1.25em;
}

.container {
  z-index: 1;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2.5em;
  padding-right: 2.5em;
  position: relative;
}

.u-white {
  color: #fff;
}

.s {
  background-color: var(--light);
  position: relative;
}

.s.hero {
  background-color: var(--white);
  min-height: 100vh;
  position: sticky;
  top: 0;
}

.s.padding-top-160 {
  padding-top: 10em;
}

.s.footer {
  padding-top: 10em;
  padding-bottom: 1.88em;
}

.hero-content {
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  max-width: 43.75em;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 5em;
  display: flex;
}

.hero-header {
  justify-content: space-between;
  padding-top: 1.88em;
  display: flex;
}

.hero-footer {
  justify-content: space-between;
  padding-bottom: 1.88em;
  display: flex;
}

.hero-wrap {
  flex-flow: column;
  justify-content: space-between;
  height: 100vh;
  display: flex;
}

.hero-logo-img {
  height: 2.63em;
}

.max-260 {
  max-width: 15em;
}

.hero-menu-link {
  color: var(--white);
  text-transform: uppercase;
  font-family: Viaoda Libre, sans-serif;
  font-size: 1.25em;
  line-height: 1.4;
  text-decoration: none;
  transition: all .55s;
}

.hero-menu-link.lang {
  font-size: 1.5em;
}

.hero-menu-link-wrap {
  grid-column-gap: .31em;
  grid-row-gap: .31em;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-end;
  display: flex;
}

.hero-text-link {
  color: var(--white);
  line-height: 1.4;
  text-decoration: none;
}

.hero-text-link.phone {
  font-size: 1.25em;
}

.hero-text-link-wrap {
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-end;
  display: flex;
}

.col-wrap {
  flex-flow: row;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.col {
  width: 50%;
}

.col-content-right {
  padding-left: 5.63em;
  padding-right: 2.5em;
}

.line {
  background-color: #0000001a;
  height: .06em;
}

.line-content {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  display: flex;
}

.u-italic {
  font-style: italic;
}

.logo-grey-img {
  height: 8em;
}

.max-550 {
  max-width: 35em;
}

.col-content-left {
  flex-flow: column;
  justify-content: space-between;
  height: 100%;
  padding-top: 3.75em;
  padding-left: 2.5em;
  padding-right: 2.5em;
  display: flex;
}

.s-3-img {
  width: 22.5em;
}

.m-view-img-wrap {
  grid-column-gap: 1.88em;
  grid-row-gap: 1.88em;
  display: flex;
}

.line-wrap {
  grid-column-gap: 1.88em;
  grid-row-gap: 1.88em;
  display: flex;
  overflow: hidden;
}

.line-box {
  grid-column-gap: 1.88em;
  grid-row-gap: 1.88em;
  flex: none;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.food-img-box {
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  display: inline-block;
}

.case-img {
  width: 30em;
}

.case-img._2 {
  width: 24.75em;
}

.max-480 {
  max-width: 30em;
}

.splide__arrows {
  z-index: 100;
  grid-column-gap: 1.25em;
  grid-row-gap: 1.25em;
  justify-content: flex-end;
  align-items: stretch;
  display: flex;
  position: absolute;
  inset: -10em 2.5em auto auto;
}

.splide__list {
  display: flex;
}

.splide__arrow {
  cursor: pointer;
  background-color: #8c8c8c40;
  border: 1px solid #8c8c8c40;
  border-radius: 100vw;
  width: 5em;
  height: 5em;
  box-shadow: inset 3px 3px .75px -3.5px #fff, 0 2px 2px #0000001a;
}

.splide__arrow.splide__arrow--next {
  background-image: url("../images/691de5626ef27c40af38b330_right-arrow.svg");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 35px;
}

.splide__arrow.splide__arrow--next:active {
  transform: scale(.95);
}

.splide__arrow.splide__arrow--prev {
  background-image: url("../images/691de5622d4e89ab3760c5b2_left-arrow.svg");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 35px;
}

.splide__arrow.splide__arrow--prev:active {
  transform: scale(.95);
}

.splide {
  padding-left: 2.5em;
  position: relative;
}

.slide-img {
  object-fit: cover;
  width: 25em;
  height: 37.5em;
}

.bg_video {
  width: 100%;
  height: 56.25em;
}

.popup-overlay {
  z-index: 9999;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: auto 1.88em 1.88em auto;
}

.alert {
  grid-column-gap: 1.25em;
  grid-row-gap: 1.25em;
  background-color: var(--white);
  border-radius: 0;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  padding: 1.88em;
  display: flex;
  box-shadow: 0 10px 40px #0000000d;
}

.cookie-text {
  max-width: 22em;
  font-size: .88em;
}

.text-link {
  color: #1a1a1a;
  text-underline-offset: 1px;
  text-underline-position: under;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

.html-embed {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.map-box {
  background-color: var(--white);
  width: 100%;
  height: 46.88em;
}

.office-img {
  object-fit: cover;
  width: 100%;
  height: 14.12em;
}

.contact-text-wrap {
  grid-column-gap: 1.25em;
  grid-row-gap: 1.25em;
  flex-flow: column;
  display: flex;
}

.map-wrap {
  grid-column-gap: 3.75em;
  grid-row-gap: 3.75em;
  flex-flow: column;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.contact-box {
  background-color: var(--white);
  width: 27.5em;
  padding: 2.5em;
  position: absolute;
  inset: 50% 10em auto auto;
  transform: translate(0, -50%);
  box-shadow: 0 10px 40px #0000000d;
}

.footer-wrap {
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
  position: relative;
}

.footer-text-box {
  width: 30em;
}

.p-16-link {
  color: #1a1a1a;
  text-underline-offset: 1px;
  text-underline-position: under;
  cursor: pointer;
  font-size: 1em;
  line-height: 1.4;
  text-decoration: underline;
  transition: all .2s;
}

.p-16-link:hover {
  color: #de0000;
}

.dev-link {
  color: var(--black);
  text-decoration: none;
}

.dev-logo {
  height: 2.5em;
}

.p-28 {
  text-transform: uppercase;
  font-family: Viaoda Libre, sans-serif;
  font-size: 1.75em;
}

.friends-img {
  width: 5em;
}

.friends-img._2 {
  width: 4.38em;
}

.friends-link {
  grid-column-gap: .94em;
  grid-row-gap: .94em;
  max-width: 20.63em;
  color: var(--black);
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
  text-decoration: none;
  display: flex;
}

.friends-wrap {
  grid-column-gap: 2.5em;
  grid-row-gap: 2.5em;
  display: flex;
}

.popup {
  width: 100%;
  max-width: 32em;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.popup.team {
  width: 100%;
  max-width: 66em;
}

.close-link {
  position: absolute;
  inset: 0% -4.38em auto auto;
}

.close {
  width: 3.75em;
  height: 3.75em;
}

.team-wrap {
  background-color: var(--white);
  width: 65.75em;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.team-img-remodal {
  width: 100%;
  max-width: 30em;
}

.team-text-cont {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 35.75em;
  padding: 5em 3.75em;
  display: flex;
}

.p-24-team {
  font-size: 1.5em;
}

.team-text-box {
  grid-column-gap: 1.25em;
  grid-row-gap: 1.25em;
  text-align: left;
  flex-flow: column;
  align-items: flex-start;
  display: flex;
}

.team-header-box {
  text-align: left;
}

.glassbtn {
  width: 2.5em;
  height: 2.5em;
  box-shadow: inset 3px 3px .5px -3.5px var(--white), 0 2px 2px 0 #0000001a;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  color: var(--black);
  text-align: center;
  letter-spacing: .03em;
  text-transform: uppercase;
  background-color: #8c8c8c40;
  border: 1px solid #8c8c8c40;
  border-radius: 12.5em;
  justify-content: center;
  align-items: center;
  font-family: Viaoda Libre, sans-serif;
  font-size: 1.25em;
  line-height: 1;
  text-decoration: none;
  transition: all .35s;
  display: flex;
}

.glassbtn.cookie-btn {
  width: 8.75em;
  height: auto;
  padding-top: 1.25em;
  padding-bottom: 1.25em;
  font-size: .88em;
}

.glassbtn.fix-btn {
  justify-content: center;
  align-items: center;
  width: 13.75em;
  height: 3.5em;
  margin-right: 0;
  font-size: 1em;
  display: flex;
}

.glassbtn.menu {
  display: flex;
}

.glassbtn.tg {
  width: 2.5em;
  height: 2.5em;
  padding-right: .31em;
  display: flex;
}

.glassbtn.tg.small {
  width: 2.5em;
  height: 2.5em;
}

.glassbtn.menu {
  width: 17.81em;
  height: auto;
  padding-top: 1.7em;
  padding-bottom: 1.7em;
}

.glassbtn.hero {
  width: 100%;
  max-width: 20em;
  height: 4.38em;
  color: var(--white);
  background-color: #ffffff40;
}

.glassbtn.hero.open__primary__widget {
  box-shadow: inset 3px 3px .5px -3.5px var(--white);
}

.spacer {
  height: 100vh;
}

.home-hero_wrapper {
  margin-bottom: -100vh;
}

.link-block {
  color: var(--black);
  text-decoration: none;
}

.line-link {
  background-color: var(--black);
  height: .06em;
}

.menu-link-fix {
  color: var(--black);
  text-transform: uppercase;
  flex: none;
  font-family: Viaoda Libre, sans-serif;
  font-size: 1em;
  text-decoration: none;
  transition: all .25s;
}

.menu-link-box {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.nav-right {
  grid-column-gap: 2.5em;
  grid-row-gap: 2.5em;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.menu-icon__line {
  background-color: var(--black);
  width: 2.188vw;
  height: 1px;
}

.menu-icon__line._02 {
  margin-top: .5vw;
  margin-bottom: .5vw;
}

.nav {
  z-index: 999;
  background-color: var(--white);
  justify-content: flex-start;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2.5em;
  padding-right: 2.5em;
  display: none;
  position: fixed;
  inset: 0% 0% auto;
  box-shadow: 0 10px 40px #0000000d;
}

.logo-alt-fix {
  width: 6.5em;
}

.small-text {
  color: var(--black);
  text-align: left;
  font-size: 1.06em;
}

.small-menu-link {
  color: var(--black);
  text-transform: uppercase;
  text-underline-offset: 2px;
  font-family: Viaoda Libre, sans-serif;
  font-size: 1.25em;
  font-weight: 400;
  text-decoration: none;
  transition: all .35s;
}

.nav-menu {
  z-index: 400;
  background-color: var(--light);
  justify-content: flex-start;
  width: 100%;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.phone-link-fix {
  color: var(--black);
  font-family: Viaoda Libre, sans-serif;
  font-size: 1.5em;
  font-weight: 400;
  text-decoration: none;
  display: block;
}

.big-menu-link {
  color: var(--black);
  text-transform: uppercase;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  font-family: Viaoda Libre, sans-serif;
  font-size: 1.75em;
  font-weight: 400;
  line-height: 1.1;
  text-decoration: none;
  display: block;
}

.menu-social-box {
  grid-column-gap: .5em;
  grid-row-gap: .5em;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.menu-links {
  grid-column-gap: .5em;
  grid-row-gap: .5em;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.menu-icon {
  z-index: 2;
  cursor: pointer;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-left: 0;
  padding: .63em;
  display: flex;
  position: relative;
}

.menu-img {
  object-fit: cover;
  width: 50%;
  height: 100vh;
}

.logo-wrp {
  grid-column-gap: 1.25em;
  grid-row-gap: 1.25em;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.nav-cont-box {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: .63em;
  padding-bottom: .63em;
  display: flex;
}

.menu-content {
  grid-column-gap: 1.88em;
  grid-row-gap: 1.88em;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  padding-top: 1.25em;
  padding-bottom: 1.25em;
  padding-right: 3.75em;
  display: flex;
}

.menu-wrap-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.menu-social-wrap {
  grid-column-gap: 3.75em;
  grid-row-gap: 3.75em;
  flex-flow: row;
  display: flex;
}

.nav-contacts-link {
  color: var(--black);
  font-size: 1.06em;
  line-height: 1.4;
  text-decoration: none;
}

.nav-contacts-link.phone {
  font-size: 1.25em;
}

.lang-div {
  grid-column-gap: .94em;
  grid-row-gap: .94em;
  margin-bottom: .63em;
  display: flex;
}

.lang-div-fix {
  grid-column-gap: .94em;
  grid-row-gap: .94em;
  display: flex;
}

.mess-wrap {
  grid-column-gap: .63em;
  grid-row-gap: .63em;
  display: flex;
}

.mess-wrap.small {
  grid-column-gap: .63em;
  grid-row-gap: .63em;
}

.mess-icon, .mess-icon.small {
  width: 1.5em;
}

.mess-icon.max {
  width: 1.35em;
}

@media screen and (max-width: 991px) {

  .splide__arrow.splide__arrow--next, .splide__arrow.splide__arrow--prev {
    background-size: 20px;
  }

}

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

  .splide__arrow.splide__arrow--next, .splide__arrow.splide__arrow--prev {
    background-size: 15px;
  }

  .logo-wrp {
    flex: none;
    margin-right: 0;
  }

  .nav-cont-box {
    padding-left: 1em;
    padding-right: 1em;
  }

}

@media screen and (max-width: 479px) {

  h1 {
    font-size: 10vw;
  }

  h2 {
    font-size: 7.9vw;
  }

  p {
    font-size: 3.33vw;
  }

  .p-16 {
    font-size: 3.33vw;
  }

  .u-desktop-hide {
    display: block;
  }

  .p-20 {
    letter-spacing: -.03em;
    font-size: 4.17vw;
    line-height: 1.3;
  }

  .container {
    padding-left: 2.7778vw;
    padding-right: 2.7778vw;
  }

  .u-mob-hide {
    display: none;
  }

  .s.hero {
    min-height: 100vh;
  }

  .s.padding-top-160 {
    padding-top: 22.24vw;
  }

  .s.footer {
    padding-top: 22.24vw;
    padding-bottom: 5.56vw;
  }

  .s.mob-padding-top-80 {
    padding-top: 22.22vw;
  }

  .hero-content {
    max-width: 100%;
    margin-top: 25vw;
    padding-bottom: 0;
  }

  .hero-header {
    padding-top: 8.34vw;
  }

  .hero-footer {
    padding-bottom: 0;
  }

  .hero-wrap {
    height: auto;
  }

  .hero-logo-img {
    height: 7.228vw;
  }

  .hero-text-link {
    font-size: 3.89vw;
  }

  .hero-text-link.phone {
    letter-spacing: .03em;
    font-family: Viaoda Libre, sans-serif;
    font-size: 5.004vw;
  }

  .col-wrap {
    flex-flow: column;
  }

  .col-wrap.mob-gap-20 {
    grid-column-gap: 5.56vw;
    grid-row-gap: 5.56vw;
  }

  .col {
    width: 100%;
  }

  .col-content-right {
    padding-left: 2.78vw;
    padding-right: 2.78vw;
  }

  .col-content-right.mob-padding-0 {
    padding-left: 0;
    padding-right: 0;
  }

  .line {
    height: .28vw;
  }

  .logo-grey-img {
    height: 20vw;
  }

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

  .col-content-left {
    padding-top: 0;
  }

  .s-3-img {
    object-fit: cover;
    width: 90vw;
  }

  .m-view-img-wrap {
    grid-column-gap: 2.78vw;
    grid-row-gap: 2.78vw;
    margin-top: 8.34vw;
    padding-bottom: 5.56vw;
    overflow: auto;
  }

  .line-wrap, .line-box {
    grid-column-gap: 5.55vw;
    grid-row-gap: 5.55vw;
  }

  .case-img {
    width: 88.89vw;
  }

  .case-img._2 {
    width: 78.89vw;
  }

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

  .splide__slide {
    width: 100%;
  }

  .slide-img-wrap {
    max-width: 100%;
  }

  .splide__arrows {
    grid-column-gap: 4.17vw;
    grid-row-gap: 4.17vw;
    justify-content: flex-start;
    align-items: stretch;
    margin-top: 5.56vw;
    padding-top: 0;
    padding-bottom: 2.78vw;
    position: static;
  }

  .splide__arrow {
    width: 13.89vw;
    height: 13.89vw;
  }

  .splide__arrow.splide__arrow--next, .splide__arrow.splide__arrow--prev {
    background-size: 25px;
  }

  .splide {
    padding-left: 2.78vw;
    padding-right: 2.78vw;
  }

  .slide-img {
    object-position: 50% 0%;
    width: 100%;
    height: 130vw;
  }

  .bg_video {
    aspect-ratio: 1;
    object-fit: cover;
    height: auto;
  }

  .popup-overlay {
    width: 100%;
    bottom: 0;
    right: auto;
  }

  .alert {
    border-radius: 0;
    justify-content: space-between;
    width: 100%;
    padding: 4vw;
  }

  .cookie-text {
    font-size: 3.1vw;
    line-height: 1.4em;
  }

  .map-box, .office-img {
    height: 94.4444vw;
  }

  .contact-text-wrap {
    grid-column-gap: 4.1667vw;
    grid-row-gap: 4.1667vw;
    padding-right: 16.68vw;
  }

  .map-wrap {
    grid-column-gap: 5.56vw;
    grid-row-gap: 5.56vw;
    max-width: 100%;
  }

  .contact-box {
    width: 100%;
    box-shadow: none;
    background-color: #fff0;
    padding: 0;
    position: static;
    transform: none;
  }

  .footer-wrap {
    grid-column-gap: 5.56vw;
    grid-row-gap: 5.56vw;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }

  .footer-text-box {
    text-align: left;
    width: 100%;
  }

  .p-16-link {
    font-size: 3.33vw;
    text-decoration: underline;
  }

  .dev-logo {
    height: 8.3333vw;
  }

  .p-28 {
    font-size: 5.56vw;
    line-height: 1.2;
  }

  .friends-img {
    width: 22.22vw;
  }

  .friends-img._2 {
    width: 20vw;
  }

  .friends-link {
    grid-column-gap: 2.78vw;
    grid-row-gap: 2.78vw;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 100%;
  }

  .friends-wrap {
    grid-column-gap: 5.56vw;
    grid-row-gap: 5.56vw;
    flex-flow: column;
    padding-right: 50vw;
  }

  .popup {
    flex-flow: column;
    max-width: 94.4444vw;
    display: flex;
  }

  .popup.team {
    max-width: 100%;
  }

  .close-link {
    inset: -15.2778vw 0% auto auto;
  }

  .close {
    width: 10vw;
    height: 10vw;
  }

  .team-wrap {
    flex-flow: column;
    width: 100%;
  }

  .team-img-remodal {
    max-width: 100%;
    display: none;
  }

  .team-text-cont {
    grid-column-gap: 5.56vw;
    grid-row-gap: 5.56vw;
    width: 100%;
    padding: 8.34vw;
  }

  .p-24-team {
    letter-spacing: -.03em;
    font-size: 4.448vw;
    line-height: 1.3;
  }

  .team-text-box {
    grid-column-gap: 4.17vw;
    grid-row-gap: 4.17vw;
  }

  .team-header-box {
    grid-column-gap: 2.78px;
    grid-row-gap: 2.78px;
    flex-flow: column;
    display: flex;
  }

  .glassbtn {
    background-color: #98989840;
    width: 13vw;
    height: 13vw;
    font-size: 3.892em;
  }

  .glassbtn.cookie-btn {
    width: 10em;
    height: auto;
    font-size: 2.7778vw;
  }

  .glassbtn.fix-btn {
    display: none;
  }

  .glassbtn.tg {
    width: 13vw;
    height: 13vw;
  }

  .glassbtn.tg.small {
    width: 12vw;
    height: 12vw;
  }

  /* «Посмотреть меню» — по эталону кнопки «Забронировать» на первом экране: высота 18,07vw, шрифт 3,892vw */
  .glassbtn.menu {
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 18.07vw;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 3.892vw;
  }

  .glassbtn.hero {
    max-width: 20em;
    height: 18.07vw;
    box-shadow: inset 3px 3px .5px -3.5px var(--white);
    font-size: 3.892vw;
  }

  .logo-cont {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    display: flex;
  }

  .mob-hero-contacts {
    text-align: center;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    max-width: 55.56vw;
    display: flex;
  }

  .line-link {
    height: .28vw;
  }

  .text-block-2 {
    font-size: 3.89vw;
  }

  .menu-link-box {
    text-align: left;
  }

  .nav-right {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .menu-icon__line {
    width: 8.3333vw;
    height: .2778vw;
  }

  .menu-icon__line._02 {
    margin-top: 1.389vw;
    margin-bottom: 1.389vw;
  }

  .nav {
    padding: 1.3889vw 2.7778vw;
  }

  .logo-alt-fix {
    width: 20vw;
  }

  .small-text {
    font-size: 3.8889vw;
  }

  .small-menu-link {
    font-size: 4.25vw;
  }

  .phone-link-fix {
    display: none;
  }

  .big-menu-link {
    font-size: 6.5vw;
    line-height: 1.1;
  }

  .menu-social-box {
    grid-column-gap: 2.78vw;
    grid-row-gap: 2.78vw;
  }

  .menu-links {
    grid-column-gap: 2.2222vw;
    grid-row-gap: 2.2222vw;
  }

  .menu-img {
    display: none;
  }

  .logo-wrp {
    grid-column-gap: 0em;
    grid-row-gap: 0em;
    width: 100%;
  }

  .nav-cont-box {
    padding-left: 0;
    padding-right: 0;
  }

  .menu-content {
    grid-column-gap: 8.8888vw;
    grid-row-gap: 8.8888vw;
    justify-content: center;
    align-items: flex-start;
    padding-left: 5.56vw;
    padding-right: 5.56vw;
    overflow: auto;
  }

  .menu-wrap-top {
    display: none;
  }

  .menu-social-wrap {
    grid-column-gap: 8.34vw;
    grid-row-gap: 8.34vw;
  }

  .nav-contacts-link {
    font-size: 3.89vw;
  }

  .nav-contacts-link.phone {
    letter-spacing: .03em;
    font-family: Viaoda Libre, sans-serif;
    font-size: 5.004vw;
  }

  .lang-div-fix {
    display: none;
  }

  .mess-wrap, .mess-wrap.small {
    grid-column-gap: 2.78vw;
    grid-row-gap: 2.78vw;
  }

  .mess-icon {
    width: 2em;
  }

  .mess-icon.small {
    width: 6.5vw;
  }

  .mess-icon.max {
    width: 1.75em;
  }

}

/* ===== Своё для новой главной ===== */

/* Масштаб: вся вёрстка в em от размера шрифта body (как было в Webflow) */
body {
  font-size: .8333333vw;
}

.container {
  max-width: 1920px;
}

@media screen and (min-width: 1920px) {
  body {
    font-size: 16px;
  }
}

@media screen and (max-width: 360px) {
  body {
    font-size: 3px;
  }
}

:focus-visible {
  outline: 2px solid var(--brown);
  outline-offset: 2px;
}

html.is-locked {
  overflow: hidden;
}

/* Первый экран: фото — обычная картинка (грузится раньше фоновой) */
.s.hero {
  overflow: hidden;
}

.hero-bg {
  object-fit: cover;
  object-position: 50% 30%;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.s.hero::before {
  content: "";
  z-index: 1;
  background-color: #00000026;
  position: absolute;
  inset: 0;
}

.hero-content {
  gap: 1.88em;
}

.hero-content.en {
  max-width: 55em;
}

.hero-menu-link.is-current,
.menu-link-fix.is-current {
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* Подписи разделов и отступы (вместо пустых блоков-разделителей) */
.line-content {
  margin-top: 1.25em;
}

.section-title {
  margin-top: 3.75em;
}

.text-stack {
  flex-flow: column;
  gap: 1.88em;
  display: flex;
}

.history-content {
  padding-top: 3.75em;
}

.history-content .logo-grey-img {
  margin-top: 6.25em;
  margin-bottom: 2.5em;
}

.history-content .text-stack {
  margin-top: 1.88em;
}

.col-content-right .glassbtn.menu {
  margin-top: 1.5em;
}

#menu-section > .container,
#team > .container {
  padding-bottom: 5em;
}

.bg_video {
  margin-top: 5em;
  position: relative;
  overflow: hidden;
}

.bg_video video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

/* Бегущая лента блюд */
@keyframes yp-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(-100% - 1.88em));
  }
}

.line-box {
  animation: yp-scroll 70s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .line-box {
    animation: none;
  }
}

/* Лентой управляет скрипт (js/home.js): её можно тянуть мышкой и пальцем.
   pan-y — вертикальная прокрутка страницы пальцем по ленте продолжает работать */
.line-wrap.is-js {
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}

.line-wrap.is-js .line-box {
  animation: none;
  will-change: transform;
}

.line-wrap.is-dragging {
  cursor: grabbing;
}

.line-wrap.is-js img {
  -webkit-user-drag: none;
  pointer-events: none;
}

/* Абзацы текста (класс ставит PHP-функция yh_paragraphs) */
.p-18 {
  font-size: 1.13em;
  line-height: 1.4;
}

/* Лента блюд: разная ширина картинок, как в макете */
.case-img._3 {
  width: 19.44em;
}

.case-img._4 {
  width: 23.25em;
}

.max-550-title {
  max-width: 10.2em;
}

/* Команда */
.splide__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.slide-img-wrap .p-20 {
  margin-top: .63em;
}

.link-block {
  margin-top: .63em;
  display: inline-block;
}

.text-block-2,
.line-link {
  display: block;
}

/* Контакты и подвал */
.footer .map-wrap {
  margin-top: 5em;
}

.contact-text-wrap {
  margin-top: 1.25em;
}

.contact-text-wrap dd {
  margin-top: .31em;
}

.projects,
.footer-wrap {
  margin-top: 5em;
}

.friends-wrap {
  margin-top: 1.25em;
}

.friends-link .p-16 {
  padding-top: .94em;
}

.dev-link {
  justify-content: flex-end;
  align-items: flex-end;
  gap: 5px;
  width: 22em;
  display: flex;
}

/* Плашка cookie: показывает и прячет скрипт из «Общего кода» (классы show / hide) */
.popup-overlay.show {
  display: block;
}

.popup-overlay.hide {
  transform: translateX(200%);
}

.glassbtn.cookie-btn {
  flex: none;
}

/* Шапка: появляется, когда первый экран прокручен */
.nav {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-150px);
  transition: transform .25s, opacity .25s, visibility 0s .25s;
  display: flex;
}

.nav.is-visible {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: transform 1s cubic-bezier(.25, .1, .25, 1), opacity .25s;
}

.menu-wrap-top {
  gap: 1.88em;
}

.nav-right {
  flex: none;
}

.menu-icon {
  z-index: 500;
}

.menu-icon__line {
  transition: transform .5s, background-color .5s;
}

.nav.is-open .menu-icon__line {
  background-color: #6a5c52;
}

.nav.is-open .menu-icon__line._01 {
  transform: translateY(1px) rotate(45deg);
}

.nav.is-open .menu-icon__line._02 {
  display: none;
}

.nav.is-open .menu-icon__line._03 {
  transform: rotate(-45deg);
}

/* Меню на весь экран */
.nav-menu {
  gap: 5.63em;
  /* Шторка сверху вниз: панель выезжает сверху, а содержимое на столько же сдвинуто обратно и стоит на месте.
     Раньше это делала обрезка (clip-path) — на iPhone меню появлялось и исчезало без анимации.
     Закрытое меню убрано со страницы совсем (класс is-shown), поэтому над экраном оно не висит.
     Высота — видимая часть экрана (dvh): в Safari на iPhone 100vh выше неё, и низ меню уходил под панель браузера */
  height: 100vh;
  height: 100dvh;
  visibility: hidden;
  overflow: hidden;
  overflow: clip;
  translate: 0 -100%;
  transition: translate .45s cubic-bezier(.65,0,.35,1), visibility 0s .45s;
}

.nav-menu > * {
  translate: 0 100%;
  transition: translate .45s cubic-bezier(.65,0,.35,1);
}

/* Фото — ровно половина экрана, текст меню не должен его сжимать */
.menu-img {
  flex: none;
}

.nav.is-open .nav-menu {
  visibility: visible;
  translate: none;
  transition: translate .45s cubic-bezier(.65,0,.35,1);
}

.nav.is-open .nav-menu > * {
  translate: none;
}

.menu-content {
  gap: 2.5em;
  overflow: auto;
}

.menu-link-box {
  gap: 1.25em;
}

.menu-social-box .mess-wrap {
  margin-top: .25em;
}

/* Окно «Подробнее» о человеке из команды */
.team-dialog {
  color: inherit;
  background: none;
  border: 0;
  max-width: none;
  max-height: none;
  padding: 0;
  overflow: visible;
}

.team-dialog::backdrop {
  background: #000000d9;
}

.team-dialog[open] {
  animation: yp-fade .3s ease;
}

.team-dialog .close-link {
  display: block;
}

@keyframes yp-fade {
  from {
    opacity: 0;
    transform: scale(.97);
  }
}

@media screen and (max-width: 479px) {
  .p-18 {
    font-size: 3.33vw;
  }

  .case-img._3 {
    width: 62.22vw;
  }

  .case-img._4 {
    width: 73.89vw;
  }

  .max-550-title {
    max-width: 100%;
  }

  .m-view-img-wrap .s-3-img {
    flex: none;
  }

  .hero-content {
    gap: 5.56vw;
  }

  .mob-hero-contacts {
    gap: 2.78vw;
    margin-top: 5.56vw;
  }

  .line-content {
    margin-top: 2.78vw;
  }

  .section-title {
    margin-top: 8.34vw;
  }

  .text-stack {
    gap: 5.56vw;
  }

  .history-content {
    padding-top: 8.34vw;
  }

  .history-content h2 {
    margin-top: 10.4vw;
  }

  .history-content .text-stack {
    margin-top: 5.56vw;
  }

  .col-content-right .glassbtn.menu {
    margin-top: 5.56vw;
  }

  #menu-section > .container,
  #team > .container {
    padding-bottom: 11.12vw;
  }

  .bg_video {
    margin-top: 11.12vw;
  }

  @keyframes yp-scroll {
    to {
      transform: translateX(calc(-100% - 5.55vw));
    }
  }

  .slide-img-wrap .p-20,
  .link-block {
    margin-top: 2.78vw;
  }

  .footer .map-wrap {
    margin-top: 8.34vw;
  }

  .contact-text-wrap {
    margin-top: 4.17vw;
  }

  .contact-text-wrap dd {
    margin-top: 1.39vw;
  }

  .projects,
  .footer-wrap {
    margin-top: 11.12vw;
  }

  .friends-wrap {
    margin-top: 5.56vw;
  }

  .friends-link .p-16 {
    padding-top: 0;
  }

  .dev-link {
    width: 100%;
  }

  .menu-content {
    gap: 5.56vw;
  }

  /* Логотип не должен выталкивать бургер за край экрана */
  .logo-wrp {
    flex: 1 1 auto;
    width: auto;
  }

  .menu-link-box {
    gap: 4.17vw;
  }

  .team-dialog {
    width: calc(100% - 5.56vw);
    max-height: calc(100% - 5.56vw);
    overflow: auto;
  }

  .team-dialog form {
    justify-content: flex-end;
    margin-bottom: 2.78vw;
    display: flex;
  }

  .team-dialog .close-link {
    position: static;
  }
}

/* Плавная прокрутка к разделам по ссылкам меню */
html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

/* Типографика: строки заголовков выравниваются по длине, в абзацах браузер
   не оставляет одно слово на последней строке (Chrome, Safari 26+, остальные — как раньше) */
h1, h2, h3, .card-heading, .popup-heading {
  text-wrap: balance;
}

p, li, .rich-page, .p-28, .card-text-cont div {
  text-wrap: pretty;
}

/* Плашка cookie на телефоне: текст ровно в 3 строки, у кнопки свои поля слева и справа */
@media screen and (max-width: 479px) {
  .alert {
    gap: 2.5vw;
  }

  .cookie-text {
    max-width: none;
    font-size: 2.9vw;
    line-height: 1.35em;
  }

  .glassbtn.cookie-btn {
    width: auto;
    padding-left: 7vw;
    padding-right: 7vw;
  }
}

/* Заставка при загрузке главной: линия → рамка раскрывается → фото сменяются → последнее
   (фото первого экрана) растёт на весь экран. Шаги — классы на <html> (in-0 … in-3), их ставит home.js */
.intro {
  display: none;
}

.intro-wait {
  overflow: hidden;
}

.intro-wait .intro,
.in-go .intro {
  --fw: min(300px, 60vw);
  --fh: calc(var(--fw) * 4 / 3);
  --open: cubic-bezier(.76, 0, .24, 1);
  --soft: cubic-bezier(.22, 1, .36, 1);
  z-index: 1000;
  height: var(--hh, 100vh);
  pointer-events: none;
  display: block;
  position: fixed;
  inset: 0 0 auto;
}

.intro__box {
  background-color: var(--light);
  position: absolute;
  inset: 0;
}

/* Рамка с подписью — по центру видимой части экрана (--vh, на iPhone меньше 100vh),
   вся группа поднята на --lift, чтобы по центру была рамка вместе с подписью */
.intro__stage {
  height: var(--vh, 100vh);
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0 0 auto;
}

.intro__frame {
  width: var(--fw);
  height: var(--fh);
  clip-path: inset(50% 0 50% 0);
  position: relative;
  overflow: hidden;
  transform: translateY(calc(-1 * var(--lift, 44px)));
  transition: clip-path .95s var(--open);
}

/* Смена фото — «шторкой» снизу вверх. Раньше это делала обрезка (clip-path): её браузер перерисовывает
   каждый кадр, и в Яндекс Браузере на Android фото наезжали рывками. Теперь обёртка .intro__shot выезжает снизу,
   а фото внутри неё на столько же сдвинуто обратно и стоит на месте. Это чистый сдвиг слоёв — его видеокарта
   ведёт плавно, даже когда страница ещё догружается */
.intro__frame > * {
  position: absolute;
  inset: 0;
  overflow: hidden;
  translate: 0 100%;
  will-change: transform;
  transition: translate .85s cubic-bezier(.65, 0, .35, 1);
}

.intro__frame > * > img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
  translate: 0 -100%;
  transform: scale(1.05);
  will-change: transform;
  transition: translate .85s cubic-bezier(.65, 0, .35, 1), transform 1.8s var(--soft);
}

.intro__frame > :first-child,
.intro__frame > .on,
.intro__frame > :first-child > img,
.intro__frame > .on > img {
  translate: none;
}

.intro__frame > .on > img,
.intro__last.on .intro__hero {
  transform: none;
}

.intro__hero {
  transform: scale(1.05);
}

/* Последнее фото — сразу во весь экран, как первый экран под ним. В рамку его «сжимают» масштаб (--k)
   и окно .intro__win (--ix, --iy, --ch считает home.js): так рост на весь экран не двигает вёрстку.
   В рамку оно въезжает так же, как остальные фото (окно снизу, картинка внутри — обратно).
   Рост на весь экран: окно перестаёт обрезать, а края вокруг рамки закрывают четыре «шторки» цвета фона
   (.intro__curtain), они разъезжаются вместе с ростом фото. Всё — сдвиг и масштаб, без перерисовки */
.intro__last {
  visibility: hidden;
  position: absolute;
  inset: 0;
  transform: translate(var(--dx), var(--dy)) scale(var(--k));
  will-change: transform;
  transition: transform 1.5s var(--open);
}

.in-go .intro__last {
  visibility: visible;
}

.intro__win {
  position: absolute;
  left: var(--ix);
  right: var(--ix);
  top: var(--iy);
  height: var(--ch);
  overflow: hidden;
  translate: 0 var(--ch);
  will-change: transform;
  transition: translate .85s cubic-bezier(.65, 0, .35, 1);
}

.intro__pic {
  position: absolute;
  left: calc(-1 * var(--ix));
  top: calc(-1 * var(--iy));
  width: var(--iw, 100vw);
  height: var(--hh, 100vh);
  translate: 0 calc(-1 * var(--ch));
  will-change: transform;
  transition: translate .85s cubic-bezier(.65, 0, .35, 1);
}

.intro__last.on .intro__win,
.intro__last.on .intro__pic {
  translate: none;
}

.in-2 .intro__last {
  transform: none;
}

/* на весь экран окно больше не обрезает — края вокруг рамки в этот миг закрыты шторками */
.in-2 .intro__win {
  overflow: visible;
}

.intro__hero {
  object-fit: cover;
  object-position: 50% 30%;
  width: 100%;
  height: 100%;
  display: block;
  transition: transform 1.8s var(--soft);
}

/* то же затемнение, что у первого экрана, — подмена на настоящий первый экран незаметна */
.intro__pic::after {
  content: "";
  background-color: #00000026;
  position: absolute;
  inset: 0;
}

/* Шторки вокруг рамки: все четыре — от края рамки до края экрана, сверху и снизу во всю ширину,
   слева и справа во всю высоту; открытым остаётся прямоугольник рамки, и он растёт вместе с фото.
   --ft — верх рамки на экране. До роста шторки сливаются с фоном и не видны */
.intro__box {
  overflow: hidden;
  --ft: calc(var(--vh, 100vh) / 2 - var(--lift, 44px) - var(--fh) / 2);
}

.intro__curtain {
  background-color: var(--light);
  position: absolute;
  will-change: transform;
  transition: transform 1.5s var(--open);
}

.intro__curtain._t {
  left: 0;
  right: 0;
  top: 0;
  height: var(--ft);
}

.intro__curtain._b {
  left: 0;
  right: 0;
  top: calc(var(--ft) + var(--fh));
  bottom: 0;
}

.intro__curtain._l,
.intro__curtain._r {
  top: 0;
  bottom: 0;
  width: calc(50% - var(--fw) / 2);
}

.intro__curtain._l {
  left: 0;
}

.intro__curtain._r {
  right: 0;
}

.in-2 .intro__curtain._t {
  transform: translateY(-100%);
}

.in-2 .intro__curtain._b {
  transform: translateY(100%);
}

.in-2 .intro__curtain._l {
  transform: translateX(-100%);
}

.in-2 .intro__curtain._r {
  transform: translateX(100%);
}

.in-3 .intro__curtain {
  visibility: hidden;
}

/* подпись под рамкой гаснет поверх шторки, а не исчезает под ней */
.intro__cap {
  z-index: 2;
}

.intro__lines {
  width: var(--fw);
  height: var(--fh);
  position: absolute;
  top: calc(50% - var(--lift, 44px));
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity .5s;
}

.intro__lines i {
  background-color: var(--black);
  width: 50%;
  height: 1px;
  position: absolute;
  top: 50%;
  transform: scaleX(0);
  transition: transform .8s cubic-bezier(.65, 0, .35, 1), opacity .6s;
}

.intro__lines i:first-child {
  left: 50%;
  transform-origin: 0 50%;
}

.intro__lines i:last-child {
  right: 50%;
  transform-origin: 100% 50%;
}

.intro__cap {
  text-align: center;
  justify-items: center;
  gap: 10px;
  display: grid;
  position: absolute;
  top: calc(50% - var(--lift, 44px) + var(--fh) / 2 + 22px);
  left: 0;
  right: 0;
  transition: opacity .4s;
}

.intro__lw {
  padding: 4px 0;
  display: block;
  overflow: hidden;
}

.intro__logo {
  background-color: var(--black);
  width: min(230px, 52vw);
  aspect-ratio: 327 / 43;
  display: block;
  transform: translateY(110%);
  transition: transform 1.1s var(--soft);
  -webkit-mask: var(--logo) center / contain no-repeat;
  mask: var(--logo) center / contain no-repeat;
}

.intro__sub {
  color: #6f6a64;
  white-space: nowrap;
  opacity: 0;
  font-size: 1em;
  line-height: 1.4;
  transform: translateY(8px);
  transition: opacity 1s, transform 1s;
}

.in-0 .intro__logo,
.in-0b .intro__sub {
  opacity: 1;
  transform: none;
}

.in-l1 .intro__lines i {
  transform: scaleX(1);
}

.in-l2 .intro__lines i {
  opacity: 0;
}

.in-l2 .intro__frame {
  clip-path: inset(0);
}

.in-2 .intro__cap,
.in-2 .intro__lines,
.in-2 .intro__frame {
  opacity: 0;
}

/* рамку прячем сразу: в этот момент её целиком закрывает последнее фото */
.in-2 .intro__frame {
  transition: none;
}

/* фон убираем мгновенно, пока его целиком закрывает фото: если он тает вместе с фото,
   сквозь полупрозрачное фото просвечивает светлый фон — получается вспышка */
.in-3 .intro__box {
  background-color: transparent;
}

.in-3 .intro__last {
  opacity: 0;
  transition: opacity .6s;
}

/* Первый экран под заставкой: текст и кнопки проявляются из лёгкого размытия, когда она уходит */
.intro-wait .hero-header,
.intro-wait .hero-content > *,
.intro-wait .hero-footer {
  opacity: .01; /* не 0: так заголовок под заставкой сразу засчитывается Chrome как главный элемент (LCP) — см. блок «Заставка и LCP» */
  filter: blur(8px);
  transform: translateY(.3em);
}

.in-go .hero-header,
.in-go .hero-content > *,
.in-go .hero-footer {
  transition: opacity 1s, filter 1.1s, transform 1.2s var(--soft, ease);
}

.in-go .hero-content > :first-child {
  transition-delay: .2s;
}

.in-go .hero-content > :last-child {
  transition-delay: .45s;
}

.in-go .hero-footer {
  transition-delay: .6s;
}

.intro-wait .popup-overlay {
  visibility: hidden;
}

/* Слайдер команды: обрезку ленты берём из splide-core сразу, не дожидаясь его CSS с CDN —
   иначе на телефоне первые секунды карточки распирают страницу шире экрана */
.splide__track {
  z-index: 0;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 479px) {
  .intro__sub {
    font-size: 3.6vw;
  }
}

/* Первый экран больше не «прилипает» и следующая секция на него не наезжает — обычная прокрутка */
.s.hero {
  position: relative;
}

.home-hero_wrapper {
  margin-bottom: 0;
}

.spacer {
  display: none;
}

/* Крестик и бургер: сама кнопка всего ~34×6 px — по ней трудно попасть пальцем.
   Невидимая зона нажатия 48×48 вокруг, внешний вид не меняется */
.menu-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 48px;
  height: 48px;
  transform: translate(-50%, -50%);
}

/* Меню (бургер): крупный список с номерами и линиями, другой язык — таким же пунктом,
   «Забронировать» — стеклянная кнопка как у остального сайта, ниже компактно контакты, мессенджеры, соцсети.
   Размеры для компьютера — в em, для телефона — ниже, в vw */
.nav-menu .menu-content {
  justify-content: center;
  overscroll-behavior: contain;
  gap: 0;
  height: 100%;
  padding: 4em 5em 4em 5em;
  overflow: auto;
  counter-reset: m;
}

.nav-menu .menu-content > * {
  flex: none;
  width: 100%;
  max-width: 30em;
}

.nav-menu .logo-grey-img {
  display: none;
}

/* пункты меню и ссылка на другой язык — в одном списке */
.nav-menu .menu-links {
  display: contents;
}

.nav-menu .menu-links .small-menu-link,
.nav-menu .menu-content > .small-menu-link[hreflang] {
  order: 1;
  counter-increment: m;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  width: 100%;
  max-width: 18.75em; /* те же 30em, что у остальных блоков, при шрифте 1.6em */
  padding: .45em 0;
  border-bottom: 1px solid #2b2a2826;
  font-size: 1.6em;
  line-height: 1;
  text-align: left;
}

.nav-menu .menu-links .small-menu-link::after,
.nav-menu .menu-content > .small-menu-link[hreflang]::after {
  content: "0" counter(m);
  color: #8b857d;
  font-size: .5em;
  font-style: italic;
  text-transform: none;
}

.nav-menu .menu-links .small-menu-link:hover {
  color: #6a5c52;
}

.nav-menu .menu-content > .small-menu-link[hreflang] {
  order: 2;
}

.nav-menu .menu-links .open__primary__widget {
  order: 3;
  counter-increment: none;
  justify-content: center;
  width: 100%;
  max-width: 30em;
  margin-top: 1.5em;
  padding: 1.1em 0;
  border: 1px solid #8c8c8c40;
  border-radius: 12.5em;
  background-color: #8c8c8c40;
  box-shadow: inset 3px 3px .5px -3.5px var(--white), 0 2px 2px 0 #0000001a;
  color: var(--black);
  font-size: 1em;
  letter-spacing: .03em;
  cursor: pointer;
}

.nav-menu .menu-links .open__primary__widget::after {
  content: none;
}

.nav-menu .menu-link-box {
  order: 4;
  gap: .4em;
  margin-top: 2em;
}

.nav-menu .big-menu-link {
  font-size: 1.5em;
}

.nav-menu .nav-contacts-link {
  font-size: 1em;
}

.nav-menu .menu-link-box .small-text {
  order: 3;
  color: #6f6a64;
  font-size: .95em;
}

/* мессенджеры и соцсети — две строки: подпись слева, кнопки или ссылки справа */
.nav-menu .menu-social-wrap {
  order: 5;
  flex-direction: column;
  align-items: flex-start;
  gap: .8em;
  margin-top: 1.6em;
}

.nav-menu .menu-social-box {
  flex-direction: row;
  align-items: center;
  gap: 1em;
}

.nav-menu .menu-social-box .small-text {
  width: 7em;
  font-size: .95em;
}

.nav-menu .menu-social-box .small-menu-link {
  font-size: 1em;
}

.nav-menu .menu-social-box .mess-wrap {
  margin-top: 0;
}

.nav-menu .mess-wrap .glassbtn {
  width: 2.5em;
  height: 2.5em;
}

@media screen and (max-width: 479px) {
  .nav-menu .menu-content {
    justify-content: flex-start;
    padding: 19vw 6.5vw 8vw;
  }

  .nav-menu .menu-content > *,
  .nav-menu .menu-links .small-menu-link,
  .nav-menu .menu-content > .small-menu-link[hreflang] {
    max-width: none;
  }

  .nav-menu .menu-links .small-menu-link,
  .nav-menu .menu-content > .small-menu-link[hreflang] {
    padding: 2.7vw 0;
    font-size: 4.5vw; /* было 5,2vw: на iPhone 16 Pro Max мессенджеры внизу не помещались */
  }

  .nav-menu .menu-links .small-menu-link::after,
  .nav-menu .menu-content > .small-menu-link[hreflang]::after {
    font-size: 2.8vw;
  }

  /* высота и шрифт — как у «Забронировать» на первом экране (эталон кнопок на телефоне) */
  .nav-menu .menu-links .open__primary__widget {
    align-items: center;
    justify-content: center;
    height: 18.07vw;
    margin-top: 6vw;
    padding: 0;
    font-size: 3.892vw;
  }

  /* Низ меню: слева телефон, почта и под ними адрес, справа напротив — крупные кнопки Telegram и MAX
     (без подписи «Мессенджеры»), ниже через тонкую линию — строка соцсетей.
     Для этого содержимое меню на телефоне — сетка в две колонки, пункты меню и «Забронировать» во всю ширину.
     Обёртки мессенджеров и соцсетей «растворены» (display: contents), их части встают в сетку сами */
  .nav-menu .menu-content {
    display: grid;
    grid-template-columns: 1fr auto;
    align-content: start;
    column-gap: 4vw;
  }

  .nav-menu .menu-links .small-menu-link,
  .nav-menu .menu-content > .small-menu-link[hreflang],
  .nav-menu .menu-links .open__primary__widget {
    grid-column: 1 / -1;
  }

  .nav-menu .menu-link-box {
    grid-column: 1;
    align-self: center;
    gap: 1.6vw;
    margin-top: 9vw;
  }

  .nav-menu .big-menu-link {
    font-size: 5.4vw;
  }

  .nav-menu .nav-contacts-link {
    font-size: 3.6vw;
  }

  .nav-menu .menu-link-box .small-text {
    margin-top: 1vw;
    font-size: 3.2vw;
    line-height: 1.35;
  }

  .nav-menu .menu-social-wrap,
  .nav-menu .menu-social-box:first-child {
    display: contents;
  }

  .nav-menu .menu-social-box:first-child > .small-text {
    display: none;
  }

  .nav-menu .menu-social-box:first-child .mess-wrap {
    order: 5;
    grid-column: 2;
    align-self: center;
    gap: 3vw;
    margin-top: 9vw;
  }

  /* кружки крупнее — по ним удобно попадать пальцем (13vw ≈ 50 px), иконки внутри прежнего размера */
  .nav-menu .mess-wrap .glassbtn {
    width: 13vw;
    height: 13vw;
  }

  .nav-menu .menu-social-box:last-child {
    order: 6;
    grid-column: 1 / -1;
    align-items: baseline;
    gap: 5vw;
    margin-top: 7vw;
    padding-top: 5vw;
    border-top: 1px solid #2b2a2826;
  }

  .nav-menu .menu-social-box:last-child .small-text {
    width: auto;
    margin-right: auto;
    color: #6f6a64;
    font-size: 3.4vw;
  }

  .nav-menu .menu-social-box .small-menu-link {
    font-size: 3.6vw;
  }
}

/* Телефон: вместо белой шапки с логотипом — круглая кнопка-бургер из матового стекла в правом верхнем углу,
   появляется при прокрутке хотя бы на 1 px (как на внутренних страницах, .im-burger в inner.css) */
@media screen and (max-width: 479px) {
  .nav,
  .nav.is-visible {
    opacity: 1;
    visibility: visible;
    transform: none;
    background-color: transparent;
    box-shadow: none;
    pointer-events: none;
  }

  .nav .logo-wrp {
    visibility: hidden;
  }

  .nav .menu-icon,
  .nav .nav-menu {
    pointer-events: auto;
  }

  .nav .menu-icon {
    position: fixed;
    top: 4vw;
    right: 4vw;
    gap: 1.6vw;
    width: 12vw;
    height: 12vw;
    padding: 0;
    border: 1px solid #8c8c8c40;
    border-radius: 50%;
    /* стекло как у кнопки «Забронировать» на первом экране главной (.glassbtn.hero) */
    background-color: #ffffff40;
    box-shadow: inset 3px 3px .5px -3.5px var(--white), 0 2px 2px 0 #0000001a;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    opacity: 0;
    visibility: hidden;
    transform: scale(.8);
    transition: opacity .3s, transform .3s, visibility 0s .3s;
  }

  /* в самом верху страницы кнопки нет — появляется при первой же прокрутке */
  .nav.is-visible .menu-icon {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity .3s, transform .3s;
  }

  .nav .menu-icon__line {
    width: 5.6vw;
    height: 1.5px; /* как у крестика: повёрнутая линия в 1px выглядит толще прямой — без скачка толщины */
    margin: 0;
    background-color: var(--black);
    transition: transform .4s, background-color .3s;
  }

  .nav .menu-icon__line._02 {
    display: none;
  }

  .nav.is-open .menu-icon__line {
    background-color: var(--black);
  }

  .nav.is-open .menu-icon__line._01 {
    transform: translateY(calc(.8vw + .75px)) rotate(45deg);
  }

  .nav.is-open .menu-icon__line._03 {
    transform: translateY(calc(-.8vw - .75px)) rotate(-45deg);
  }
}

/* ---------- Появление при прокрутке (js/reveal.js) — по референсу kozhemyako.pro/happy-store ---------- */
/* заголовки: слова проявляются из лёгкого размытия */
.rv-words .w {
  display: inline-block;
  opacity: 0;
  filter: blur(8px);
  transform: translateY(.28em);
  transition: opacity .9s cubic-bezier(.22,.61,.24,1), filter 1s cubic-bezier(.22,.61,.24,1), transform 1.1s cubic-bezier(.22,1,.36,1);
}

.rv-words.in .w {
  opacity: 1;
  filter: blur(0);
  transform: none;
  transition-delay: calc(var(--d, 0) * 90ms + var(--i) * 60ms);
}

/* подписи, текст, кнопки, лента блюд, команда: спокойный подъём */
.rv-up,
.rv-tile {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 1s cubic-bezier(.22,.61,.24,1), transform 1.2s cubic-bezier(.22,1,.36,1);
}

.rv-tile {
  transform: translateY(46px);
}

.rv-up.in,
.rv-tile.in {
  opacity: 1;
  transform: none;
  transition-delay: calc(var(--d, 0) * 90ms);
}

/* линия над разделом прочерчивается слева направо */
.rv-line {
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 1.4s cubic-bezier(.65,0,.35,1);
}

.rv-line.in {
  transform: none;
}

/* большие фото: проявляются и «оседают» из увеличения */
.rv-img {
  overflow: hidden;
  opacity: 0;
  transition: opacity 1.1s cubic-bezier(.22,.61,.24,1);
}

.rv-img > img {
  transform: scale(1.16);
  transition: transform 2s cubic-bezier(.22,1,.36,1);
}

.rv-img.in {
  opacity: 1;
}

.rv-img.in > img {
  transform: none;
}

/* видео и карта: только плавное появление из прозрачности */
.rv-fade {
  opacity: 0;
  transition: opacity 1.2s cubic-bezier(.22,.61,.24,1);
}

.rv-fade.in {
  opacity: 1;
}

/* ---------- Переход от первого экрана ко второй секции (выбран вариант «шторка») ----------
   --hp — насколько прокручен первый экран (0…1), ставит js/reveal.js. Фото первого экрана едет медленнее
   страницы и темнеет, надпись тает. Фото «Истории» без анимации — стоит на месте сразу */
.hero-bg {
  transform: translateY(calc(var(--hp, 0) * 35%));
}

.s.hero::before {
  background-color: rgb(0 0 0 / calc(.15 + .3 * var(--hp, 0)));
}

/* Надписи и кнопка тают каждая сама по себе, а не весь блок целиком: прозрачность у общего родителя
   отключает размытие «стекла» у кнопки «Забронировать», и в Safari оно не возвращалось после
   прокрутки обратно. Класс hero-out ставит js/reveal.js, только пока первый экран сдвинут, —
   наверху на кнопку не действует ничего, и заставка анимирует её как раньше */
.hero-out .s.hero .hero-header,
.hero-out .s.hero .hero-content > *,
.hero-out .s.hero .hero-footer {
  opacity: calc(1 - var(--hp, 0) * 1.4);
  translate: 0 calc(var(--hp, 0) * 12vh);
}

/* Там, где браузер умеет анимацию по прокрутке (Chrome, Яндекс Браузер, Safari 26+), тот же переход ведёт сам браузер,
   привязав его к прокрутке: фото сдвигается без скрипта и без отставания на кадр. Раньше в Safari оно ехало рывками.
   Затемнение — прозрачностью чёрного слоя (не перекрашиванием), надписи — прозрачностью и сдвигом.
   --hero-h — высота первого экрана, ставит js/reveal.js. В остальных браузерах работает вариант выше (--hp) */
@supports (animation-timeline: scroll()) {
  .hero-bg,
  .s.hero::before,
  .hero-out .s.hero .hero-header,
  .hero-out .s.hero .hero-content > *,
  .hero-out .s.hero .hero-footer {
    animation-duration: auto;
    animation-timing-function: linear;
    animation-fill-mode: both;
    animation-timeline: scroll(root block);
    animation-range: 0 var(--hero-h, 100vh);
  }

  .hero-bg {
    transform: none;
    will-change: transform;
    animation-name: yp-hero-bg;
  }

  .s.hero::before {
    background-color: #000;
    opacity: .15;
    animation-name: yp-hero-shade;
  }

  .hero-out .s.hero .hero-header,
  .hero-out .s.hero .hero-content > *,
  .hero-out .s.hero .hero-footer {
    opacity: 1;
    translate: none;
    animation-name: yp-hero-text;
  }
}

@keyframes yp-hero-bg {
  to { transform: translateY(35%); }
}

@keyframes yp-hero-shade {
  to { opacity: .45; }
}

@keyframes yp-hero-text {
  0% { opacity: 1; translate: 0 0; }
  71.43% { opacity: 0; }
  100% { opacity: 0; translate: 0 12vh; }
}

/* Палочки бургера на телефоне: белые над фото и первым экраном (как надпись на кнопке «Забронировать»),
   чёрные над светлыми секциями. Класс is-dark ставит js/home.js по тому, что под кнопкой */
@media screen and (max-width: 479px) {
  .nav.is-dark:not(.is-open) .menu-icon__line {
    background-color: var(--white);
  }
}

/* ---------- Блок «Лучший вид на горы» (выбрана карусель) ---------- */
/* На ПК — как было раньше: три фото ровным рядом, без лесенки и без сдвига при прокрутке */
.mv-count {
  display: none;
}

/* Телефон: карусель. Первым — фото с фиолетовыми горами (третье в разметке), фото крупнее:
   ряд доходит до правого края экрана, от следующего фото видно ~10%. Фото «примагничиваются»,
   под ними счётчик 01 / 03 и полоска (добавляет js/reveal.js) */
@media screen and (max-width: 479px) {
  .m-view-img-wrap {
    margin-right: -2.083vw;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 0;
  }

  .m-view-img-wrap::-webkit-scrollbar {
    display: none;
  }

  .m-view-img-wrap {
    gap: 2vw;
  }

  .m-view-img-wrap .s-3-img {
    width: 87vw;
    aspect-ratio: 4 / 5;
    height: auto;
    scroll-snap-align: start;
  }

  .m-view-img-wrap .s-3-img:last-child {
    order: -1;
  }

  .mv-count {
    display: flex;
    align-items: center;
    gap: 1.5vw;
    margin-top: 4vw;
    font-size: 3.4vw;
    font-style: italic;
  }

  .mv-count span {
    font-style: normal;
  }

  .mv-count i {
    flex: 1;
    height: 1px;
    margin-left: 4vw;
    background-color: #2b2a2826;
    position: relative;
  }

  .mv-count b {
    width: 33.4%;
    background-color: var(--black);
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(var(--k, 0) * 66.6%);
  }
}

/* Кнопка «Забронировать» в меню не сжимается; на низких телефонах (≤ 740 px) пункты меню чуть плотнее */
@media screen and (max-width: 479px) {
  .nav-menu .menu-links .open__primary__widget {
    flex-shrink: 0;
  }
}

@media screen and (max-width: 479px) and (max-height: 740px) {
  .nav-menu .menu-links .small-menu-link:not(.open__primary__widget),
  .nav-menu .menu-content > .small-menu-link[hreflang] {
    padding-top: 2.3vw;
    padding-bottom: 2.3vw;
  }
}

/* iPhone 16 Pro Max и похожие: в Safari видно ~740 px по высоте — меню с мессенджерами и соцсетями
   помещается целиком, если чуть сжать промежутки между блоками */
@media screen and (max-width: 479px) and (max-height: 780px) {
  .nav-menu .menu-content {
    padding-top: 18vw;
  }

  .nav-menu .menu-links .open__primary__widget {
    margin-top: 5.5vw;
  }

  .nav-menu .menu-link-box,
  .nav-menu .menu-social-box:first-child .mess-wrap {
    margin-top: 8vw;
  }

  .nav-menu .menu-social-box:last-child {
    margin-top: 6vw;
    padding-top: 4.5vw;
  }
}

/* Подвал на телефоне: «Другие наши проекты» — в две колонки (логотип, под ним подпись),
   логотипы одной высоты; политика конфиденциальности и ссылка на разработчика — обе по левому краю */
@media screen and (max-width: 479px) {
  .friends-wrap {
    flex-flow: row;
    padding-right: 0;
  }

  .friends-link {
    flex: 1 1 0;
    min-width: 0;
  }

  .friends-img,
  .friends-img._2 {
    width: auto;
    max-width: 100%;
    height: 12vw;
    object-fit: contain;
    object-position: 0 50%;
  }

  .dev-link {
    justify-content: flex-start;
  }
}

/* Карта на телефоне: прозрачный слой поверх (parts/contacts-footer.php), чтобы свайп листал страницу,
   а не карту. Подсказка вверху; нажатие убирает слой */
.map-guard {
  display: none;
}

@media screen and (max-width: 479px) {
  .map-box {
    position: relative;
  }

  .map-guard {
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 4vw 0 0; /* сверху: внизу у карты кнопка «Открыть Яндекс Карты» и логотип */
    border: 0;
    background: none;
    cursor: pointer;
    position: absolute;
    inset: 0;
  }

  .map-guard[hidden] {
    display: none;
  }

  .map-guard span {
    padding: 2.2vw 4vw;
    border: 1px solid #8c8c8c40;
    border-radius: 999px;
    background-color: #ffffffcc;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    color: var(--black);
    font-size: 3.3vw;
    line-height: 1.2;
  }
}

/* «Другие наши проекты»: у «Митрош Бани» только знак (без надписи — она теперь в подписи),
   оба логотипа одной высоты */
.friends-img,
.friends-img._2 {
  width: auto;
  height: 4.38em;
}

@media screen and (max-width: 479px) {
  .friends-img,
  .friends-img._2 {
    height: 12vw;
  }
}

/* EN, первый экран на телефоне: заголовок в 4 строки — THE HOUSE / OF HEDONISM / IN KRASNAYA / POLYANA.
   Ограничение 55em с компьютера сжимало блок до ~190 px, и заголовок рассыпался на 6 строк.
   Шрифт заголовка задан в vw, поэтому ширина 68vw даёт те же 4 строки на любом телефоне
   («OF HEDONISM» — 66,7vw, «THE HOUSE OF» — 69,2vw, уже не помещается) */
@media screen and (max-width: 479px) {
  .hero-content.en {
    max-width: none;
  }

  .hero-content.en h1 {
    max-width: 68vw;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Ссылка на разработчика: адрес подчёркнут, как «Политика конфиденциальности» */
.dev-link {
  color: inherit;
  text-decoration: none;
}

.dev-url {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-position: under;
  text-underline-offset: 1px;
}

/* Закрытое меню-бургер убрано со страницы совсем: невидимый слой на весь экран со своей прокруткой
   на iPhone перехватывал жест, и страница не доходила до самого верха. Класс is-shown ставит js/home.js
   на время, пока меню открыто или закрывается */
.nav:not(.is-shown) .nav-menu {
  display: none;
}

/* Кнопка «Забронировать» первого экрана тает и сдвигается вместе с надписями, без своей задержки:
   у .glassbtn transition: all .35s, и при прокрутке обратно кнопка догоняла текст рывком */
.s.hero .glassbtn.hero {
  transition-property: background-color, border-color, box-shadow, color;
}

/* Меню-бургер на ПК: больше воздуха. Панель — сетка в две колонки: сверху крупные пункты во всю ширину
   и «Забронировать», внизу по углам — телефон, почта и адрес слева, мессенджеры и соцсети справа.
   Пустые строки 10–18 нулевой высоты, строка 19 забирает свободное место и прижимает контакты к низу */
@media screen and (min-width: 480px) {
  .nav-menu .menu-content {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: repeat(18, auto) minmax(2.5em, 1fr) auto;
    column-gap: 3em;
    align-content: stretch;
    padding: 6.5em 5.5em 4.5em 0; /* слева отступ уже даёт промежуток между фото и меню */
  }

  .nav-menu .menu-content > *,
  .nav-menu .menu-links .small-menu-link,
  .nav-menu .menu-content > .small-menu-link[hreflang] {
    max-width: none;
  }

  .nav-menu .menu-links .small-menu-link,
  .nav-menu .menu-content > .small-menu-link[hreflang],
  .nav-menu .menu-links .open__primary__widget {
    grid-column: 1 / -1;
  }

  .nav-menu .menu-links .small-menu-link,
  .nav-menu .menu-content > .small-menu-link[hreflang] {
    padding: .5em 0 .42em;
    font-size: 2.1em;
  }

  .nav-menu .menu-links .small-menu-link::after,
  .nav-menu .menu-content > .small-menu-link[hreflang]::after {
    font-size: .42em;
  }

  .nav-menu .menu-links .open__primary__widget {
    margin-top: 2.2em;
    padding: 1.35em 0;
    font-size: 1em; /* у кнопки тоже класс small-menu-link — без этого она брала шрифт пунктов */
  }

  .nav-menu .menu-link-box,
  .nav-menu .menu-social-wrap {
    grid-row: 20;
    align-self: end;
    margin-top: 0;
  }

  /* контакты: телефон, почта и адрес не слипаются — между строками ровный шаг, адрес чуть отделён */
  .nav-menu .menu-link-box {
    grid-column: 1;
    gap: .9em;
  }

  .nav-menu .menu-link-box .small-text {
    margin-top: .5em;
    line-height: 1.5;
  }

  /* мессенджеры и соцсети: строки дальше друг от друга, подпись дальше от кнопок */
  .nav-menu .menu-social-wrap {
    grid-column: 2;
    gap: 1.6em;
  }

  .nav-menu .menu-social-box {
    gap: 1.4em;
  }

  .nav-menu .big-menu-link {
    font-size: 1.9em;
  }

  .nav-menu .menu-social-box .small-text {
    width: 6.5em;
  }
}

/* «Другие наши проекты» на ПК: подпись стоит вплотную к логотипу и по его центру, а не ниже */
@media screen and (min-width: 480px) {
  .friends-link {
    align-items: center;
  }

  .friends-link .p-16 {
    padding-top: 0;
  }
}

/* ---------- Плавная прокрутка (Lenis, js/smooth.js) ---------- */
/* Lenis сам ведёт прокрутку к разделам — встроенная плавность браузера ему мешает */
html.lenis,
html.lenis body {
  height: auto;
}

html.lenis {
  scroll-behavior: auto !important;
}

.lenis:not(.lenis-autoToggle).lenis-stopped {
  overflow: clip;
}

/* карта не перехватывает колесо только во время самой прокрутки, а не всё время */
.lenis.lenis-scrolling iframe {
  pointer-events: none;
}


/* ---------- Заставка и LCP («главный элемент» в замерах скорости) ----------
   Chrome засчитывает элемент главным в момент, когда тот впервые нарисован. Без этого блока это были кадры заставки
   и её последнее фото — в конце анимации, через 8–10 с (Lighthouse на телефоне: 66–68 вместо 96).
   Элемент, впервые нарисованный почти прозрачным (1%), Chrome дальше не учитывает. Поэтому до начала анимации
   кадры и последнее фото рисуются полоской в 1 px при прозрачности 1% — глазу не видно, а главным остаётся
   заголовок первого экрана под заставкой (он тоже 1%, а не 0, см. выше). На саму заставку это не влияет */
html.intro-wait:not(.in-0) .intro__frame {
  clip-path: inset(calc(50% - .5px) 0);
}

html.intro-wait:not(.in-0) .intro__frame > *,
html.intro-wait:not(.in-0) .intro__frame > * > img {
  translate: none;
}

html.intro-wait:not(.in-l2) .intro__frame > * {
  opacity: .01;
}

/* последнее фото до въезда в рамку видно полоской в 1 px внизу окна */
html.intro-wait .intro__last:not(.on) {
  visibility: visible;
}

html.intro-wait .intro__last:not(.on) .intro__win {
  translate: 0 calc(var(--ch) - 1px);
}

html.intro-wait .intro__last:not(.on) .intro__pic {
  translate: 0 calc(1px - var(--ch));
}

.intro__last:not(.on) .intro__hero {
  opacity: .01;
}

.intro__last:not(.on) .intro__pic::after {
  opacity: 0;
}

/* Ссылки на первом экране ПК (разделы, EN/RU, телефон, почта): зона нажатия не меньше 24 px, как требует PageSpeed.
   Поля добавлены и тут же «съедены» отрицательным отступом — на вид всё стоит как раньше */
@media screen and (min-width: 480px) {
  .hero-menu-link,
  .hero-text-link {
    padding: 2px 4px;
    margin: -2px -4px;
  }

  .hero-text-link.phone {
    padding-block: 3px;
    margin-block: -3px;
  }

  .hero-text-link:not(.phone) {
    padding-block: 5px;
    margin-block: -5px;
  }

  /* строки чуть разведены, чтобы зоны нажатия соседних ссылок не налезали друг на друга */
  .hero-menu-link-wrap {
    row-gap: calc(.31em + 3px);
  }

  .hero-text-link-wrap {
    row-gap: 8px;
  }
}

/* Подпись заставки «Красная Поляна, с 2018 года» темнее. Текст выводится через ::before (data-text):
   заставка декоративная (aria-hidden), а проверка контраста PageSpeed иначе ловит подпись в середине
   плавного появления, когда она ещё бледная, и снимает баллы */
.intro__sub {
  color: #5f5a54;
}

.intro__sub::before {
  content: attr(data-text);
}

/* Слайдер команды на ПК можно тянуть мышкой — курсор-«рука», как у ленты блюд, чтобы это было понятно.
   Кнопки «Подробнее» и стрелки остаются со своим курсором-указателем */
@media (hover: hover) and (pointer: fine) {
  #cards-slider .splide__track {
    cursor: grab;
  }

  #cards-slider .splide__track:active {
    cursor: grabbing;
  }
}