/* =========================================================
   1. NORMALIZE (минимально необходимое)
   ========================================================= */
html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: sans-serif; height: 100%; }
body { margin: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
audio, canvas, progress, video { vertical-align: baseline; display: inline-block; }
audio:not([controls]) { height: 0; display: none; }
[hidden], template { display: none; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
b, strong { font-weight: bold; }
dfn { font-style: italic; }
mark { color: #000; background: #ff0; }
small { font-size: 80%; }
sub, sup { vertical-align: baseline; font-size: 75%; line-height: 0; position: relative; }
sup { top: -.5em; }
sub { bottom: -.25em; }
img { border: 0; max-width: 100%; vertical-align: middle; display: inline-block; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0 0 10px; }
hr { box-sizing: content-box; height: 0; }
pre { overflow: auto; }
code, kbd, pre, samp { font-family: monospace; font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: none; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
fieldset { border: 1px solid silver; margin: 0 2px; padding: .35em .625em .75em; }
legend { border: 0; padding: 0; }
textarea { overflow: auto; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }
* { box-sizing: border-box; }

/* =========================================================
   2. WEBFLOW ESSENTIALS (нужны для работы scripts.js)
   ========================================================= */
.w-block { display: block; }
.w-inline-block { max-width: 100%; display: inline-block; }
.w-hidden { display: none; }
.w-button {
  color: #fff; line-height: inherit; cursor: pointer;
  background-color: #3898ec; border: 0; border-radius: 0;
  padding: 9px 15px; text-decoration: none; display: inline-block;
}
input.w-button { -webkit-appearance: button; }
.w-layout-grid {
  grid-row-gap: 16px; grid-column-gap: 16px;
  grid-template-rows: auto auto; grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr; display: grid;
}

/* Background video (для hero) */
.w-background-video { height: 500px; color: #fff; position: relative; overflow: hidden; }
.w-background-video > video {
  width: 100%; height: 100%; object-fit: cover; z-index: -100;
  background-position: 50%; background-size: cover; margin: auto;
  position: absolute; top: -100%; bottom: -100%; left: -100%; right: -100%;
}
.w-background-video > video::-webkit-media-controls-start-playback-button { -webkit-appearance: none; display: none !important; }
.w-background-video--control { background-color: transparent; padding: 0; position: absolute; bottom: 1em; right: 1em; }
.w-background-video--control > [hidden] { display: none !important; }

/* Nav */
.w-nav { z-index: 1000; background: #ddd; position: relative; }
.w-nav:before, .w-nav:after { content: " "; grid-area: 1 / 1 / 2 / 2; display: table; }
.w-nav:after { clear: both; }
.w-nav-brand { float: left; color: #333; text-decoration: none; position: relative; }
.w-nav-link {
  vertical-align: top; color: #222; text-align: left;
  margin-left: auto; margin-right: auto; padding: 20px;
  text-decoration: none; display: inline-block; position: relative;
}
.w-nav-link.w--current { color: #0082f3; }
.w-nav-menu { float: right; position: relative; }
[data-nav-menu-open] { text-align: center; min-width: 200px; background: #c8c8c8; position: absolute; top: 100%; left: 0; right: 0; overflow: visible; display: block !important; }
.w--nav-link-open { display: block; position: relative; }
.w-nav-overlay { width: 100%; display: none; position: absolute; top: 100%; left: 0; right: 0; overflow: hidden; }
.w-nav-overlay [data-nav-menu-open] { top: 0; }
.w-nav[data-animation="over-left"] .w-nav-overlay { width: auto; }
.w-nav[data-animation="over-left"] .w-nav-overlay,
.w-nav[data-animation="over-left"] [data-nav-menu-open] { z-index: 1; top: 0; right: auto; }
.w-nav[data-animation="over-right"] .w-nav-overlay { width: auto; }
.w-nav[data-animation="over-right"] .w-nav-overlay,
.w-nav[data-animation="over-right"] [data-nav-menu-open] { z-index: 1; top: 0; left: auto; }
.w-nav-button {
  float: right; cursor: pointer; -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none; -ms-user-select: none; user-select: none;
  padding: 18px; font-size: 24px; display: none; position: relative;
}
.w-nav-button:focus { outline: 0; }
.w-nav-button.w--open { color: #fff; background-color: #c8c8c8; }
.w-nav[data-collapse="all"] .w-nav-menu { display: none; }
.w-nav[data-collapse="all"] .w-nav-button,
.w--nav-dropdown-open, .w--nav-dropdown-toggle-open { display: block; }
.w--nav-dropdown-list-open { position: static; }
@media screen and (max-width: 1140px) {
  .w-nav[data-collapse="medium"] .w-nav-menu { display: none; }
  .w-nav[data-collapse="medium"] .w-nav-button { display: block; }
}
@media screen and (max-width: 767px) {
  .w-nav[data-collapse="small"] .w-nav-menu { display: none; }
  .w-nav[data-collapse="small"] .w-nav-button { display: block; }
  .w-nav-brand { padding-left: 10px; }
}
@media screen and (max-width: 479px) {
  .w-nav[data-collapse="tiny"] .w-nav-menu { display: none; }
  .w-nav[data-collapse="tiny"] .w-nav-button { display: block; }
}

/* Dropdown */
.w-dropdown {
  text-align: left; z-index: 900;
  margin-left: auto; margin-right: auto; display: inline-block; position: relative;
}
.w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link {
  vertical-align: top; color: #222; text-align: left; white-space: nowrap;
  margin-left: auto; margin-right: auto; padding: 20px;
  text-decoration: none; position: relative;
}
.w-dropdown-toggle { -webkit-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; padding-right: 40px; display: inline-block; }
.w-dropdown-toggle:focus { outline: 0; }
.w-icon-dropdown-toggle { width: 1em; height: 1em; margin: auto 20px auto auto; position: absolute; top: 0; bottom: 0; right: 0; }
.w-dropdown-list { min-width: 100%; background: #ddd; display: none; position: absolute; }
.w-dropdown-list.w--open { display: block; }
.w-dropdown-link { color: #222; padding: 10px 20px; display: block; }
.w-dropdown-link.w--current { color: #0082f3; }
.w-dropdown-link:focus { outline: 0; }

/* Lightbox (используется w-lightbox в scripts.js) */
.w-lightbox-backdrop {
  cursor: auto; letter-spacing: normal; text-indent: 0; text-shadow: none;
  text-transform: none; visibility: visible; white-space: normal; word-break: normal;
  word-spacing: normal; word-wrap: normal; color: #fff; text-align: center;
  z-index: 2000; opacity: 0; -webkit-user-select: none; -moz-user-select: none;
  -webkit-tap-highlight-color: transparent; background: rgba(0,0,0,.9); outline: 0;
  font-family: Montserrat, sans-serif;
  font-size: 17px; font-style: normal; font-weight: 300; line-height: 1.2;
  list-style: disc; position: fixed; top: 0; bottom: 0; left: 0; right: 0;
  -webkit-transform: translate(0);
}
.w-lightbox-backdrop, .w-lightbox-container { height: 100%; -webkit-overflow-scrolling: touch; overflow: auto; }
.w-lightbox-content { height: 100vh; position: relative; overflow: hidden; }
.w-lightbox-view { width: 100vw; height: 100vh; opacity: 0; position: absolute; }
.w-lightbox-view:before { content: ""; height: 100vh; }
.w-lightbox-group, .w-lightbox-group .w-lightbox-view, .w-lightbox-group .w-lightbox-view:before { height: 86vh; }
.w-lightbox-frame, .w-lightbox-view:before { vertical-align: middle; display: inline-block; }
.w-lightbox-figure { margin: 0; position: relative; }
.w-lightbox-group .w-lightbox-figure { cursor: pointer; }
.w-lightbox-img { width: auto; height: auto; max-width: none; }
.w-lightbox-image { float: none; max-width: 100vw; max-height: 100vh; display: block; }
.w-lightbox-group .w-lightbox-image { max-height: 86vh; }
.w-lightbox-caption {
  text-align: left; text-overflow: ellipsis; white-space: nowrap;
  background: rgba(0,0,0,.4); padding: .5em 1em;
  position: absolute; bottom: 0; left: 0; right: 0; overflow: hidden;
}
.w-lightbox-embed { width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
.w-lightbox-control {
  width: 4em; cursor: pointer; background-position: center;
  background-repeat: no-repeat; background-size: 24px;
  transition: all .3s; position: absolute; top: 0;
}
.w-lightbox-left {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0yMCAwIDI0IDQwIiB3aWR0aD0iMjQiIGhlaWdodD0iNDAiPjxnIHRyYW5zZm9ybT0icm90YXRlKDQ1KSI+PHBhdGggZD0ibTAgMGg1djIzaDIzdjVoLTI4eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDN2MjNoMjN2M2gtMjZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==");
  display: none; bottom: 0; left: 0;
}
.w-lightbox-right {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMjQgNDAiIHdpZHRoPSIyNCIgaGVpZ2h0PSI0MCI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMC0waDI4djI4aC01di0yM2gtMjN6IiBvcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Im0xIDFoMjZ2MjZoLTN2LTIzaC0yM3oiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+");
  display: none; bottom: 0; right: 0;
}
.w-lightbox-close {
  height: 2.6em;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMTggMTciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxNyI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMCAwaDd2LTdoNXY3aDd2NWgtN3Y3aC01di03aC03eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDd2LTdoM3Y3aDd2M2gtN3Y3aC0zdi03aC03eiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4=");
  background-size: 18px; right: 0;
}
.w-lightbox-strip { white-space: nowrap; padding: 0 1vh; line-height: 0; position: absolute; bottom: 0; left: 0; right: 0; overflow-x: auto; overflow-y: hidden; }
.w-lightbox-item { width: 10vh; box-sizing: content-box; cursor: pointer; padding: 2vh 1vh; display: inline-block; -webkit-transform: translate3d(0,0,0); }
.w-lightbox-active { opacity: .3; }
.w-lightbox-thumbnail { height: 10vh; background: #222; position: relative; overflow: hidden; }
.w-lightbox-thumbnail-image { position: absolute; top: 0; left: 0; }
.w-lightbox-thumbnail .w-lightbox-tall { width: 100%; top: 50%; transform: translate(0,-50%); }
.w-lightbox-thumbnail .w-lightbox-wide { height: 100%; left: 50%; transform: translate(-50%); }
.w-lightbox-spinner {
  box-sizing: border-box; width: 40px; height: 40px;
  border: 5px solid rgba(0,0,0,.4); border-radius: 50%;
  margin-top: -20px; margin-left: -20px;
  animation: .8s linear infinite spin; position: absolute; top: 50%; left: 50%;
}
.w-lightbox-spinner:after {
  content: ""; border: 3px solid transparent; border-bottom-color: #fff;
  border-radius: 50%; position: absolute; top: -4px; bottom: -4px; left: -4px; right: -4px;
}
.w-lightbox-hide { display: none; }
.w-lightbox-noscroll { overflow: hidden; }
@media (min-width: 768px) {
  .w-lightbox-content { height: 96vh; margin-top: 2vh; }
  .w-lightbox-view, .w-lightbox-view:before { height: 96vh; }
  .w-lightbox-group, .w-lightbox-group .w-lightbox-view, .w-lightbox-group .w-lightbox-view:before { height: 84vh; }
  .w-lightbox-image { max-width: 96vw; max-height: 96vh; }
  .w-lightbox-group .w-lightbox-image { max-width: 82.3vw; max-height: 84vh; }
  .w-lightbox-left, .w-lightbox-right { opacity: .5; display: block; }
  .w-lightbox-close { opacity: .8; }
  .w-lightbox-control:hover { opacity: 1; }
}
.w-lightbox-inactive, .w-lightbox-inactive:hover { opacity: 0; }
@keyframes spin { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }

/* Focus-outline fix (Webflow добавляет .wf-force-outline-none к таргету) */
.wf-force-outline-none[tabindex="-1"]:focus { outline: none; }

/* =========================================================
   3. ПЕРЕМЕННЫЕ И БАЗА
   ========================================================= */
:root {
  --black: #333;
  --white: white;
  --bg: #1b232b;
  --or: #ff4d00;
  --f: rgba(69, 49, 51, .82);
}

body.body {
  height: 100%;
  min-height: 100%;
  color: var(--white);
  background-color: #fff;
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  line-height: 22px;
  margin: 0;
}

h1 { color: var(--black); margin: 20px 0 10px; font-size: 38px; font-weight: 700; line-height: 44px; }
h2 { margin: 20px 0 10px; font-size: 32px; font-weight: 700; line-height: 36px; }
h3 { margin: 20px 0 10px; font-size: 24px; font-weight: 700; line-height: 30px; }
h4 { margin: 10px 0; font-size: 18px; font-weight: 700; line-height: 24px; }
h5 { margin: 10px 0; font-size: 14px; font-weight: 700; line-height: 20px; }
h6 { margin: 10px 0; font-size: 12px; font-weight: 700; line-height: 18px; }
p { color: #000; margin: 0 0 5px; }
a { display: block; }
img { max-width: 100%; display: inline-block; }

/* =========================================================
   4. ХЕДЕР / ЛОГО / НАВИГАЦИЯ
   ========================================================= */
.header {
  z-index: 10;
  background-color: rgba(27, 35, 43, .8);
  padding: 10px 0;
  position: fixed; top: 0; bottom: auto; left: 0; right: 0;
}
.container {
  max-width: 1140px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: auto; margin-right: auto;
  position: relative;
}
.container.flex {
  grid-column-gap: 30px; grid-row-gap: 30px;
  flex-direction: row; justify-content: space-between; align-items: center;
  display: flex;
}
.container.footer {
  grid-column-gap: 60px; grid-row-gap: 60px;
  flex-direction: row; justify-content: space-between; align-items: center;
  display: flex;
}
.logo { color: #333; align-items: center; text-decoration: none; display: flex; }
.logo_header { position: static; }
.nav-menu { align-items: center; display: flex; }
.nav-link {
  color: var(--white);
  margin-left: 40px; padding: 0;
  transition: all .555s;
}
.nav-link:hover { box-shadow: 0 1px 0 0 var(--white); padding: 7px 0; }
.nav-link.w--current { color: var(--white); }
.logo_menu { display: none; }
.div-header_phone {
  grid-column-gap: 40px; grid-row-gap: 40px;
  align-items: center; display: flex;
}
.phone {
  color: var(--white);
  font-size: 24px; font-weight: 400;
  text-decoration: none;
  transition: all .555s;
}
.phone:hover { box-shadow: 0 1px 0 0 var(--white); padding: 7px 0; }
.phone._2 { display: none; }
.phone._3 { padding: 5px 0; font-size: 20px; font-weight: 500; display: inline-block; }
.button1st {
  border: 1px solid var(--white);
  background-color: transparent;
  padding: 14px 29px;
  transition: all .555s;
}
.button1st:hover { box-shadow: inset 0 -52px 0 0 var(--white); color: var(--black); }
.button1st._2 { padding: 16px 24px; }
.button1st._2:hover { box-shadow: inset 0 -55px 0 0 var(--white); }
.button1st._3 { padding: 16px 30px; }
.button1st._3:hover { box-shadow: inset 0 -55px 0 0 var(--white); }
.button_menu {
  box-shadow: 0 0 0 2px var(--white);
  color: var(--white);
  background-color: transparent;
  margin-top: 30px;
  padding: 17px 65px 19px;
  font-size: 19px;
  transition: all .555s;
  display: none;
}
.button_menu:hover { background-color: var(--white); box-shadow: 0 0 0 1px var(--white); color: var(--black); }

/* Бургер */
.menu_burger { display: none; }
.burger-line-top, .burger-line-middle, .burger-line-bottom {
  width: 30px; height: 3px; background-color: #fff;
  margin-top: 5px; margin-bottom: 5px;
}
.burger-line-bottom { margin-left: auto; }

/* =========================================================
   5. HERO (section + background-video)
   ========================================================= */
.section { height: 100vh; position: relative; overflow: hidden; }
.section._2 {
  height: auto;
  background-color: var(--bg);
  padding-top: 40px; padding-bottom: 100px;
  position: static; overflow: visible;
}
.background-video { height: 100vh; padding-top: 324px; }
.blackbg {
  z-index: 1; height: 100%;
  background-color: rgba(69, 49, 51, .37);
  display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0;
}
.grid_main { z-index: 2; grid-column-gap: 0; grid-row-gap: 0; grid-template-rows: auto; position: relative; }
.h1 {
  z-index: 1;
  color: var(--white);
  font-family: Montserrat, sans-serif;
  font-size: 55px; font-weight: 500; line-height: 140%;
}
.text-span-2 { display: block; }
.logo_main {
  position: absolute; top: -124px; bottom: auto; left: auto; right: 0;
  opacity: 1;
}
.button_main {
  box-shadow: 0 0 0 2px var(--white);
  color: var(--white);
  background-color: rgba(51, 51, 51, .3);
  margin-top: 30px;
  padding: 17px 65px 19px;
  font-size: 19px;
  transition: all .555s;
}
.button_main:hover {
  background-color: var(--white);
  box-shadow: 0 0 0 1px var(--white);
  color: var(--black);
}

/* =========================================================
   6. ABOUT (sectionbg)
   ========================================================= */
.sectionbg {
  background-color: var(--black);
  padding-top: 110px; padding-bottom: 110px;
  overflow: hidden;
}
.container._0px { padding: 0; }
.grid_about { z-index: 2; grid-column-gap: 40px; grid-row-gap: 40px; grid-template-rows: auto; position: relative; }
.div_about { padding-right: 60px; }
.text-about { padding-right: 10px; font-size: 28px; font-weight: 500; line-height: 150%; }
.text-span { font-weight: 600; }
.text-45-margin { color: var(--white); margin-top: 45px; font-size: 20px; line-height: 150%; }
.text-45-margin-2 { color: rgba(51, 51, 51, .8); margin-top: 25px; line-height: 150%; }
.text-45-margin-2._20px { color: var(--white); margin-top: 40px; font-size: 20px; }

.lightbox-video { transition: all .555s; position: relative; }
.lightbox-video:hover { filter: saturate(150%); }
.video_cover { border-radius: 8px; }
.bgvid {
  background-color: rgba(0, 0, 0, .4); border-radius: 8px;
  display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0;
}
.play {
  opacity: .6; margin-left: auto; margin-right: auto;
  position: absolute; top: 45%; left: 0; right: 0;
  will-change: transform;
}
.vidobzor {
  z-index: 2;
  color: var(--white);
  border-bottom: 1px solid transparent;
  padding: 5px 0;
  font-size: 22px;
  position: absolute; bottom: 40px; left: 40px;
}

/* Декоративные «плюсики» */
.list { width: 110px; position: absolute; top: 0; bottom: auto; left: auto; right: 0; }
.list._2 { top: auto; bottom: 0; left: -13%; right: auto; }
.list._3 { width: 90px; top: 0; bottom: auto; left: auto; right: -12%; }
.list._4 { top: -3%; bottom: auto; left: -14%; right: auto; }
.list._5 { top: auto; bottom: -13%; left: auto; right: -13%; }

/* =========================================================
   7. KOMPLEKS (grid-2 + imgwrap)
   ========================================================= */
.heading-section {
  color: var(--white);
  margin-top: 0; margin-bottom: 20px;
  font-size: 28px; line-height: 140%;
}
.heading-section._2 { color: var(--white); padding-left: 5px; font-size: 28px; }
.heading-section._3 { margin-bottom: 30px; }
.heading-section.foto { margin-top: 40px; }

.grid-2 {
  grid-column-gap: 30px; grid-row-gap: 30px;
  grid-template-rows: auto auto auto;
  grid-template-columns: 1fr 1fr 1fr;
  margin-top: 20px;
}
.imgwrap {
  color: var(--white);
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: visible;
}
.villaphoto { width: 100%; border-radius: 8px; transition: all .555s; }
.villaphoto:hover { opacity: .8; }
.div-for-villas { padding: 15px 20px 20px 0; }
.season {
  border-bottom: 1px solid transparent;
  padding: 5px 0;
  font-size: 24px; font-weight: 600; line-height: 130%;
  text-decoration: none;
  display: inline-block;
}
.text-descriprition {
  color: rgba(255, 255, 255, .8);
  margin-top: 5px;
  font-size: 17px; line-height: 160%;
}

/* =========================================================
   8. FEATURES (grid-prem + premblock)
   ========================================================= */
.section-black {
  background-color: var(--black);
  padding-top: 78px; padding-bottom: 130px;
  position: relative; overflow: hidden;
}
.section-black.footer { background-color: var(--bg); padding-top: 20px; padding-bottom: 20px; }
.section-black._2 { padding-bottom: 90px; }
.section-black._3 { z-index: 2; padding-top: 90px; padding-bottom: 90px; }

.grid-prem {
  grid-column-gap: 30px; grid-row-gap: 30px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
/* h2 в предыдущей версии HTML вынесен из grid-prem, поэтому правила grid-column: span 2 не нужны */

.divprem { flex-direction: column; display: flex; position: relative; }
.line { width: 2px; height: 791px; background-color: rgba(255,255,255,.3); position: absolute; top: -253px; bottom: 0; left: 0; right: auto; }
.line._4 { height: 791px; left: 141px; }
.whiteline { width: 2px; height: 44px; background-color: var(--white); position: absolute; top: 124px; }
.whiteline._2 { width: 2px; background-color: var(--white); top: auto; bottom: 47px; left: 0; right: auto; }

.premblock {
  background-color: var(--bg);
  border-radius: 8px;
  padding-top: 30px; padding-bottom: 30px; padding-right: 30px;
}
.premblock._100px { z-index: 1; background-color: var(--bg); margin-top: 100px; position: relative; }
.premblock._80px { z-index: 1; background-color: var(--bg); margin-top: 80px; position: relative; }
.premhead {
  grid-column-gap: 30px; grid-row-gap: 30px;
  justify-content: space-between; align-items: center;
  padding-left: 30px; display: flex;
}
.premimg._2 { width: 60px; }
.premnumb { color: var(--black); font-size: 60px; font-weight: 400; }
.nameprem {
  border-left: 2px solid var(--white);
  color: var(--white);
  margin-top: 30px; padding-left: 30px;
  font-weight: 700;
}
.premtext { color: rgba(255,255,255,.8); margin-top: 15px; padding-left: 30px; }
.greentext { color: var(--white); display: block; }

/* =========================================================
   9. PHOTO GRIDS
   ========================================================= */
.section-2 { background-color: var(--bg); padding-top: 70px; padding-bottom: 100px; }
.section-2._20 { padding-top: 20px; }

.grid-for-foto {
  grid-column-gap: 10px; grid-row-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.grid-for-foto.no60px { grid-template-rows: auto; grid-template-columns: 1fr 1fr 1fr; margin-bottom: 0; }
.div-for-foto-zima { position: relative; }
.div-for-foto-vnutri { position: relative; }
.lightbox-foto { height: 100%; cursor: pointer; text-decoration: none; position: relative; display: block; }
.photo { height: 100%; object-fit: cover; border-radius: 8px; transition: all .555s; width: 100%; }
.photo:hover { opacity: .7; }
.photo.fit { object-position: 0% 50%; }
.plus {
  width: 35px; color: #fff;
  justify-content: center;
  margin-left: auto; margin-right: auto;
  font-size: 100px; line-height: 140%;
  display: flex;
  position: absolute; top: 42%; left: 0; right: 0;
  opacity: 0;
  transition: opacity .3s;
}

/* =========================================================
   10. REVIEWS
   ========================================================= */
.grid-2-sides { grid-column-gap: 30px; grid-row-gap: 30px; grid-template-rows: auto; }
.column1-reviews, .column2-reviews {
  grid-row-gap: 30px;
  flex-direction: column;
  display: flex;
  position: relative;
}
.column2-reviews { margin-top: 60px; }
.divreview {
  z-index: 1;
  background-color: var(--bg);
  border-radius: 8px;
  padding-top: 42px; padding-bottom: 45px; padding-right: 40px;
  position: relative;
}
.h3-review {
  border-left: 2px solid var(--white);
  color: var(--white);
  margin-top: 0; margin-bottom: 0;
  padding-left: 38px;
  font-size: 19px; font-weight: 600; line-height: 141%;
}
.review-and-name-div { margin-top: 30px; padding-left: 40px; }
.review-text { color: rgba(255,255,255,.8); font-size: 16px; line-height: 150%; }
.name-and-stars { justify-content: space-between; align-items: center; margin-top: 40px; text-decoration: none; display: flex; }
.name-otz { color: var(--white); padding-bottom: 2px; font-size: 16px; font-weight: 700; transition: all .555s; }
.name-otz:hover { box-shadow: 0 1px 0 0 var(--white); }
.starsdiv { grid-column-gap: 5px; grid-row-gap: 5px; display: flex; }

.orangetext-2 { color: #ff4d00; }
.orangeline-2 { width: 2px; height: 44px; background-color: var(--white); position: absolute; top: 124px; }
.orangeline-2._3 { top: auto; bottom: 130px; left: 0; right: auto; }
.line-2 { width: 2px; height: 791px; background-color: rgba(139,175,248,.19); position: absolute; top: -253px; bottom: 0; left: 0; right: auto; }
.line-2._3 { height: 1370px; background-color: rgba(255,255,255,.3); left: 329px; }
.line-2._2 { height: 2000px; background-color: rgba(255,255,255,.3); }
.div-for-button-review { text-align: center; margin-top: 60px; }

/* =========================================================
   11. FAQ
   ========================================================= */
.container-2 { max-width: 1140px; flex-direction: column; justify-content: flex-start; align-items: flex-start; margin-left: auto; margin-right: auto; }
.qleft { grid-column-gap: 10px; grid-row-gap: 10px; flex-direction: column; justify-content: flex-start; display: flex; }
.dropdown { z-index: 2; width: 100%; display: block; }
.dropdown-toggle {
  white-space: pre-wrap;
  border-bottom: 1px solid rgba(255,255,255,.3);
  align-content: flex-end;
  justify-content: space-between;
  align-items: center;
  padding: 13px;
  transition: all .7s;
  display: flex;
}
.dropdown-toggle:hover { color: #fff; padding-left: 20px; }
.question { color: var(--white); font-weight: 700; line-height: 160%; cursor: pointer; }
.bgplus {
  width: 40px; height: 40px;
  border-radius: 50%;
  margin-left: 30px;
  position: relative; right: 20px;
  box-shadow: 0 0 rgba(0,0,0,.2);
}
.line1 {
  width: 22px; height: 3px; background-color: var(--white);
  position: absolute; top: auto; bottom: 18px; left: auto; right: 9px;
}
.line2 {
  width: 22px; height: 3px; background-color: var(--white);
  position: absolute; top: auto; bottom: 18px; left: auto; right: 9px;
  transform: rotate(90deg);
  transform-style: preserve-3d;
}
details[open] .line2 {
  transform: rotate(0deg);
  opacity: 0;
}
.dropdown-list {
  background-color: var(--bg);
  display: block;
  position: static;
  overflow: hidden;
  height: 0;
}
.qatext {
  color: rgba(255,255,255,.8);
  margin-bottom: 0;
  padding-top: 18px; padding-bottom: 13px; padding-right: 20px;
  line-height: 150%;
}
.qatext p {
  color: rgba(255,255,255,.8);
}
.qatext._1 { padding-top: 5px; padding-bottom: 5px; }
.bold-text { color: var(--white); font-weight: 600; }
.link {
  border: 1px solid var(--white);
  color: var(--white);
  margin: 10px 5px;
  padding-left: 21px; padding-right: 21px;
  text-decoration: none;
  transition: all .555s;
  display: inline-block;
}
.link:hover { box-shadow: inset 0 -30px 0 0 var(--white); color: var(--black); }

/* =========================================================
   12. CONTACTS
   ========================================================= */
.grid { grid-column-gap: 30px; grid-row-gap: 30px; grid-template-rows: auto; grid-template-columns: 1fr 1.25fr; }
.leftmap { background-color: var(--bg); border-radius: 8px; padding: 40px 40px 28px; }
.rightmap { border-radius: 8px; position: relative; overflow: hidden; }
.logomap { width: 70px; }
.podzagolovok { color: var(--white); margin-top: 30px; margin-bottom: 10px; font-size: 18px; font-weight: 500; }
.podzagolovok._2 { margin-top: 30px; }
.podzagolovok._20px { margin-bottom: 20px; }
.adres { color: rgba(255,255,255,.8); font-weight: 400; line-height: 130%; }
.link-video {
  color: var(--white);
  background-image: url("../img/d1.svg");
  background-position: 140px;
  background-repeat: no-repeat;
  background-size: 16px;
  margin-top: 15px;
  text-decoration: none;
  display: block;
}
.hower-for-link { padding: 5px 0; transition: all .555s; display: inline-block; }
.hower-for-link:hover { box-shadow: 0 1px 0 0 var(--white); }

/* =========================================================
   13. FOOTER
   ========================================================= */
.allrights { color: rgba(255,255,255,.4); font-weight: 300; }
.politica { color: rgba(255,255,255,.4); text-decoration: none; transition: all .555s; }
.politica:hover { color: var(--white); }
.my-copyright { color: rgba(255,255,255,.4); font-weight: 300; text-decoration: none; transition: all .555s; }
.colorcopyright { transition: all .555s; }
.colorcopyright:hover { color: #fff; }

/* =========================================================
   14. ПОПАП-ОКНА (booking)
   ========================================================= */
.lb2 {
  z-index: 60; height: 100vh;
  -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
  cursor: pointer;
  background-color: rgba(69, 49, 51, .15);
  display: none;
  position: fixed; top: 0; bottom: 0; left: 0; right: 0;
}
.box2 {
  z-index: 61; max-width: 1140px; text-align: center;
  margin-left: auto; margin-right: auto;
  display: none;
  position: fixed; top: 5%; bottom: auto; left: 0; right: 0;
}
.closex {
  z-index: 33;
  width: 10px;
  color: var(--black);
  margin-left: auto; margin-right: auto;
  font-size: 35px;
  display: none;
  position: absolute; top: 34px; left: 70%; right: 0;
}

/* =========================================================
   15. GRID-AREA (замена #w-node-… на nth-child)
   ========================================================= */

/* Летние фото: 7 элементов в 6-колоночной сетке */
.grid-for-foto._summer > :nth-child(1) { grid-area: span 2 / span 2 / span 2 / span 2; }
.grid-for-foto._summer > :nth-child(4),
.grid-for-foto._summer > :nth-child(7) { grid-area: span 1 / span 2 / span 1 / span 2; }

/* Зимние фото: 7 элементов */
.grid-for-foto._winter > :nth-child(1) { grid-area: span 2 / span 2 / span 2 / span 2; }
.grid-for-foto._winter > :nth-child(2) { grid-area: span 2 / span 1 / span 2 / span 1; }
.grid-for-foto._winter > :nth-child(7) { grid-area: span 1 / span 2 / span 1 / span 2; }

/* Все остальные #w-node правила в оригинале были 1x1 (дефолт) — не нужны */

/* =========================================================
   16. MEDIA QUERIES
   ========================================================= */

@media screen and (max-width: 1140px) {
  /* Header / nav */
  .header { background-color: transparent; border-bottom: none; display: none; padding: 0; }
  .logo { display: none; }
  .container { padding-left: 20px; padding-right: 20px; }
  .container.footer { grid-column-gap: 20px; grid-row-gap: 20px; flex-direction: column; }
  .nav-menu {
    z-index: 1; width: 80%; height: 100%;
    background-color: #333;
    padding-top: 28vh;
    display: block;
    position: fixed; top: 0; bottom: 0; left: auto; right: 0;
    overflow: scroll;
  }
  .nav-link {
    color: var(--white);
    text-align: right; justify-content: flex-end;
    margin-left: 0;
    padding: 15px 20px;
    font-size: 20px; line-height: 130%;
  }
  .nav-link:hover { box-shadow: none; padding: 15px 20px; }
  .menu_burger {
    z-index: 10;
    background-color: #242424;
    border-radius: 50%;
    display: block;
    position: fixed; top: 20px; left: auto; right: 20px;
  }
  .menu_burger.w--open { z-index: 20; background-color: var(--black); }
  .logo_menu {
    width: 120px;
    display: block;
    position: absolute; top: 20px; left: 20px;
  }
  .div-button-phone {
    width: 100%;
    grid-column-gap: 40px; grid-row-gap: 40px;
    background-color: var(--bg);
    flex-direction: column; align-items: center;
    margin-top: 15px; padding-top: 40px; padding-bottom: 40px;
    display: flex;
  }
  .phone { display: none; }
  .phone._2 { display: block; }
  .phone._2:hover { box-shadow: none; padding: 0; }
  .button1st { display: none; }
  .button1st._2, .button1st._3 { display: inline-block; }
  .button_menu {
    width: 190px;
    box-shadow: 0 0 0 1px var(--white);
    margin-top: 0; padding-left: 0; padding-right: 0;
    display: block;
  }

  /* Hero */
  .section { height: 100%; margin-bottom: -4px; position: relative; overflow: visible; }
  .section._2 { margin-bottom: 0; padding-top: 20px; padding-bottom: 50px; }
  .grid_main { flex-direction: column-reverse; display: flex; }
  .leftside { margin-left: auto; margin-right: auto; }
  .h1 { font-size: 30px; line-height: 150%; }
  .logo_main { width: 270px; margin-left: auto; margin-right: auto; display: block; position: static; }
  .button_main { width: 100%; text-align: center; margin-left: auto; margin-right: auto; padding-left: 25px; padding-right: 25px; display: block; }
  .background-video { padding-top: 78px; }

  /* About */
  .sectionbg { padding-top: 70px; }
  .grid_about { grid-column-gap: 50px; grid-row-gap: 50px; flex-direction: column; display: flex; }
  .div_about { padding-right: 0; }
  .text-45-margin, .text-45-margin-2._20px { margin-top: 25px; font-size: 18px; }

  /* Kompleks */
  .grid-2 { grid-template-columns: 1fr 1fr; }
  .villaphoto { max-height: none; min-width: auto; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
  .imgwrap { text-decoration: none; overflow: hidden; }

  /* Features */
  .grid-prem { grid-column-gap: 20px; grid-row-gap: 20px; grid-template-columns: 1fr; }
  .premblock._100px, .premblock._80px { margin-top: 0; }
  .premhead { padding-left: 20px; }
  .premtext { padding-left: 20px; }
  .nameprem { padding-left: 18px; }
  .line, .line._4 { display: none; }

  /* Photos */
  .grid-for-foto {
    grid-column-gap: 1px; grid-row-gap: 1px;
    grid-template-rows: auto auto auto;
    grid-template-columns: 1fr 1fr;
    margin-top: 0;
  }
  .grid-for-foto.no60px { grid-column-gap: 1px; grid-row-gap: 1px; }
  .plus { display: none; }
  .photo { width: 100%; }

  /* Reviews */
  .grid-2-sides { grid-column-gap: 30px; grid-row-gap: 30px; flex-direction: column; display: flex; }
  .column2-reviews { grid-row-gap: 30px; margin-top: 0; }
  .column1-reviews { grid-row-gap: 30px; }
  .h3-review { padding-left: 20px; }
  .review-and-name-div { padding-left: 20px; }
  .div-for-button-review { margin-top: 40px; }
  .name-otz { padding-top: 2px; }
  .line-2 { display: none; }

  /* FAQ */
  .section-2 { padding-top: 58px; padding-bottom: 90px; }
  .container-2 { padding-left: 20px; padding-right: 20px; }
  .qleft { grid-column-gap: 20px; grid-row-gap: 20px; }
  .qatext { color: rgba(255,255,255,.8); padding-bottom: 11px; }
  .dropdown-toggle:hover { box-shadow: none; padding-left: 20px; }
  .link { margin-top: 10px; display: inline-block; }

  /* Contacts */
  .section-black { padding-top: 60px; padding-bottom: 70px; }
  .section-black.footer { padding-top: 40px; }
  .section-black._2 { padding-top: 50px; padding-bottom: 70px; }
  .section-black._3 { padding-top: 60px; padding-bottom: 40px; }
  .grid { grid-column-gap: 20px; grid-row-gap: 20px; flex-direction: column; display: flex; }
  .leftmap { padding-top: 28px; padding-bottom: 20px; padding-left: 20px; }
  .rightmap { height: 350px; }

  /* Decorative */
  .list, .list._2, .list._3, .list._4, .list._5 { display: none; }
  .all { overflow: hidden; }
  .box2 { margin: 0; max-width: none; display: none; position: fixed; }
  .heading-section { margin-bottom: 20px; }
  .heading-section._2 { padding-left: 0; }
  .heading-section._3 { margin-bottom: 20px; }
  .season { text-decoration: none; }

  /* Grid-area для летних фото (tablet) */
  .grid-for-foto._summer > :nth-child(1) { grid-area: span 2 / span 1 / span 2 / span 1; }
  .grid-for-foto._summer > :nth-child(4),
  .grid-for-foto._summer > :nth-child(7) { grid-area: span 1 / span 1 / span 1 / span 1; }

  /* Grid-area для зимних фото (tablet) */
  .grid-for-foto._winter > :nth-child(1),
  .grid-for-foto._winter > :nth-child(4) { grid-area: span 2 / span 1 / span 2 / span 1; }
  .grid-for-foto._winter > :nth-child(7) { grid-area: span 1 / span 1 / span 1 / span 1; }
}

@media screen and (max-width: 767px) {
  h1 { font-size: 20px; padding-left: 10px; }
  .header { padding-top: 0; padding-bottom: 0; }
  .logo { margin-left: auto; margin-right: auto; }
  .container { padding-left: 20px; padding-right: 20px; }
  .container.flex { flex-direction: column; }
  .nav-menu { z-index: 3; }
  .phone { font-size: 22px; }

  .section { height: 100%; position: relative; }
  .grid_main { flex-direction: column-reverse; display: flex; }
  .blackbg { height: 100%; }
  .logo_main { width: 230px; position: static; }
  .background-video { height: 100%; padding-top: 72px; padding-bottom: 70px; overflow: scroll; }

  .sectionbg { padding-top: 50px; padding-bottom: 70px; position: relative; }
  .grid_about { grid-column-gap: 60px; grid-row-gap: 60px; }
  .section-2 { padding-top: 38px; }
  .adres { flex-direction: column; }
  .box2 { display: none; overflow: scroll; height: 95%; }

  .section-black { padding-top: 38px; padding-bottom: 50px; }
  .section-black._2 { padding-bottom: 50px; }
  .section-black._3 { padding-top: 40px; }
  .grid-prem { grid-column-gap: 20px; grid-row-gap: 20px; }
  .heading-section { margin-bottom: 20px; font-size: 5.5vw; }
  .heading-section._2 { margin-bottom: 20px; font-size: 4vw; }
  .grid-for-foto { grid-template-columns: 1fr 1fr; }
  .grid-for-foto.no60px { grid-template-columns: 1fr; }
  .plus { font-size: 50px; top: 25%; }
  .qleft { grid-column-gap: 10px; grid-row-gap: 10px; }
  .container-2 { padding-left: 20px; padding-right: 20px; }
  .grid-2 { flex-direction: column; display: flex; }

  /* Летние фото при 767px */
  .grid-for-foto._summer > :nth-child(1) { grid-area: span 2 / span 1 / span 2 / span 1; }
}

@media screen and (max-width: 479px) {
  h1 { font-size: 13px; line-height: 20px; }
  a { width: auto; float: none; padding-left: 1px; padding-right: 1px; display: inline-block; position: static; }
  .logo_header { max-width: 110%; }

  .nav-menu { z-index: 3; }
  .section { z-index: 2; position: relative; }
  .section._2 { padding-bottom: 40px; }
  .leftside { width: 280px; }
  .h1 { font-size: 26px; }
  .blackbg { height: 100%; background-color: rgba(69, 49, 51, .41); }

  .sectionbg { z-index: 2; padding-top: 40px; padding-bottom: 78px; position: relative; }
  .grid_about { grid-column-gap: 40px; grid-row-gap: 40px; }
  .text-about { padding-right: 0; font-size: 6vw; line-height: 160%; }
  .div-button-phone { grid-column-gap: 30px; grid-row-gap: 30px; }

  .section-2 { background-image: none; padding-bottom: 60px; }
  .section-2._20 { padding-top: 48px; }
  .adres { width: auto; font-size: 17px; line-height: 150%; }

  .box2 { width: 100%; padding: 20px; background-color: #fff; display: none; top: 0; }
  .closex { display: inline-block; }
  .prava { display: block; }
  .allrights { text-align: center; }
  .section-black { padding-top: 47px; }
  .section-black.footer { padding-top: 30px; }
  .background-video { height: 100vh; padding-bottom: 0; overflow: hidden; }

  .premhead { padding-left: 20px; }
  .heading-section, .heading-section._2 { font-size: 5.5vw; }
  .heading-section.foto { margin-top: 40px; }
  .premtext { padding-left: 20px; }
  .nameprem { margin-left: 2px; padding-left: 17px; }
  .season { font-size: 18px; }

  .grid-for-foto { grid-template-rows: auto; grid-template-columns: 1fr 1fr; grid-auto-columns: 1fr; display: grid; }
  .review-and-name-div { padding-left: 20px; }
  .div-for-button-review { margin-top: 30px; padding-left: 20px; padding-right: 20px; }
  .column2-reviews { grid-row-gap: 20px; }
  .h3-review { margin-top: 20px; margin-left: 0; padding: 0 0 0 18px; font-size: 18px; font-weight: 700; }
  .column1-reviews { grid-row-gap: 20px; }
  .name-and-stars { margin-top: 30px; }
  .divreview { padding: 10px 20px 30px 2px; }
  .grid-2-sides { grid-column-gap: 20px; grid-row-gap: 20px; }

  .qleft { grid-column-gap: 10px; grid-row-gap: 10px; }
  .question { padding-right: 25px; }
  .qatext._1 { margin-top: 10px; }
  .link { margin-top: 5px; margin-bottom: 5px; }
  .leftmap { padding-bottom: 22px; padding-right: 20px; }
  .grid-2 { flex-direction: column; display: flex; }
  .text-descriprition { font-size: 16px; }
  .star { width: 4vw; }
  .bold-text { color: var(--white); }
  .play { width: 60px; }
  .vidobzor { font-size: 18px; bottom: 20px; left: 20px; }

  /* Grid-area летних фото (mobile) */
  .grid-for-foto._summer > :nth-child(1) { grid-area: span 1 / span 2 / span 1 / span 2; }
  .grid-for-foto._summer > :nth-child(4),
  .grid-for-foto._summer > :nth-child(7) { grid-area: span 1 / span 1 / span 1 / span 1; }

  /* Grid-area зимних фото (mobile) */
  .grid-for-foto._winter > :nth-child(1),
  .grid-for-foto._winter > :nth-child(2) { grid-area: span 1 / span 1 / span 1 / span 1; }
  .grid-for-foto._winter > :nth-child(3) { grid-area: span 2 / span 1 / span 2 / span 1; }
  .grid-for-foto._winter > :nth-child(5) { grid-area: span 1 / span 2 / span 1 / span 2; }
  .grid-for-foto._winter > :nth-child(7) { grid-area: span 1 / span 1 / span 1 / span 1; }
}

/* =========================================================
   17. BUKZA WIDGET (было инлайн в <head>)
   ========================================================= */
#BukzaContainer28235 iframe {
  width: 320px; min-width: 100%; height: 0; opacity: 0;
  border: none; min-height: 320px;
}
#BukzaContainer28235 iframe.bukza-iframe-BukzaContainer28235_loaded {
  opacity: 1;
  -webkit-transition: opacity .5s ease-in-out, height .1s ease-out;
  transition: opacity .5s ease-in-out, height .1s ease-out;
}
.bukza-popup-BukzaContainer28235 {
  position: fixed; z-index: 1000000;
  top: 0; bottom: 0; left: 0; right: 0;
  max-height: 100vh; max-height: var(--bukza100vh, 100vh);
  overflow: auto;
  background: rgba(0,0,0,.3);
  transition: opacity .3s ease-in-out;
  opacity: 0; visibility: hidden;
}
.bukza-popup-BukzaContainer28235_loaded {
  transition: visibility 0s linear .3s, opacity .3s ease-in-out;
}
#BukzaContainer28235.bukza-popup-BukzaContainer28235 iframe { display: block; }
.bukza-popup-BukzaContainer28235_shown {
  transition: visibility 0s linear 0s, opacity .3s ease-in-out;
  opacity: 1; visibility: visible;
}
#bukzaActivityIndicatorforBukzaContainer28235 {
  width: 100%; min-height: 320px;
  display: flex; justify-content: center; align-items: center;
}
#bukzaSpinnerforBukzaContainer28235 {
  border-radius: 50%; padding: 4px; width: 48px; height: 48px;
  color: rgba(0,0,0,.3); background-color: transparent; overflow: hidden;
  -webkit-mask-image: linear-gradient(transparent 50%, black 50%), linear-gradient(to right, transparent 50%, black 50%);
  mask-image: linear-gradient(transparent 50%, black 50%), linear-gradient(to right, transparent 50%, black 50%);
  animation: loader-spin 6s infinite cubic-bezier(.3,.6,1,1);
}
#bukzaSpinnerforBukzaContainer28235::before {
  content: ""; display: block; box-sizing: border-box;
  margin-bottom: 4px;
  border: solid 4px transparent; border-top-color: currentColor;
  border-radius: 50%;
  width: 100% !important; height: 100%;
  background-color: transparent;
  animation: loader-spin-pseudo .75s infinite linear alternate;
}
@keyframes loader-spin {
  0% { transform: rotate(0deg); }
  12.5% { transform: rotate(180deg); animation-timing-function: linear; }
  25% { transform: rotate(630deg); }
  37.5% { transform: rotate(810deg); animation-timing-function: linear; }
  50% { transform: rotate(1260deg); }
  62.5% { transform: rotate(1440deg); animation-timing-function: linear; }
  75% { transform: rotate(1890deg); }
  87.5% { transform: rotate(2070deg); animation-timing-function: linear; }
  100% { transform: rotate(2520deg); }
}
@keyframes loader-spin-pseudo {
  0% { transform: rotate(-30deg); }
  29.4% { border-left-color: transparent; }
  29.41% { border-left-color: currentColor; }
  64.7% { border-bottom-color: transparent; }
  64.71% { border-bottom-color: currentColor; }
  100% { border-left-color: currentColor; border-bottom-color: currentColor; transform: rotate(225deg); }
}

/* =========================================================
   18. SCROLLBAR (было инлайн в <body>)
   ========================================================= */
::-webkit-scrollbar { width: 7px; padding: 2.5px; }
::-webkit-scrollbar-track { background: #000; }
::-webkit-scrollbar-thumb { background: #1b232b; border-radius: 6px; }