/* ═══════════════════════════════════════════════════
   ДОМ У ЛЕСА — лендинг
   Токены: fluid-шкала (clamp) + easing-набор в духе Haven
   ═══════════════════════════════════════════════════ */

:root{
  /* ── Палитра: тёмный лес / тёплый песок ── */
  --ink:            #12140f;
  --ink-soft:       #1c1f19;
  --ink-card:       #23271f;
  --paper:          #f4f2ed;
  --paper-warm:     #eae6dd;
  --sand:           #c9b99a;
  --sand-deep:      #a8916a;
  --moss:           #6b7a5e;
  --line:           rgba(18,20,15,.12);
  --line-dark:      rgba(244,242,237,.14);

  --text:           #12140f;
  --text-soft:      #55594e;
  --text-mute:      #8b8f83;
  --text-inv:       #f4f2ed;
  --text-inv-soft:  rgba(244,242,237,.62);

  /* ── Easing (снято с референса) ── */
  --ease:           cubic-bezier(.14,.9,.34,.94);
  --ease-out:       cubic-bezier(.19,1,.22,1);
  --ease-in-out-el: cubic-bezier(.65,0,0,1);
  --ease-bounce:    cubic-bezier(.32,1.51,.36,.97);
  --t-quick:        .25s var(--ease);
  --t-base:         .45s var(--ease);
  --t-smooth:       1s var(--ease);

  /* ── Fluid-типографика (320 → 1600) ── */
  --step--1: clamp(.78rem, .76rem + .1vw,  .84rem);
  --step-0:  clamp(.95rem, .91rem + .2vw, 1.06rem);
  --step-1:  clamp(1.1rem, 1.02rem + .38vw, 1.32rem);
  --step-2:  clamp(1.35rem, 1.19rem + .8vw, 1.85rem);
  --step-3:  clamp(1.7rem, 1.36rem + 1.7vw, 2.7rem);
  --step-4:  clamp(2.1rem, 1.44rem + 3.3vw, 4rem);
  --step-5:  clamp(2.8rem, 1.4rem + 7vw, 6.8rem);

  /* ── Fluid-отступы ── */
  --sp-2xs: clamp(.4rem, .38rem + .1vw, .5rem);
  --sp-xs:  clamp(.6rem, .55rem + .25vw, .8rem);
  --sp-s:   clamp(.9rem, .82rem + .4vw, 1.2rem);
  --sp-m:   clamp(1.3rem, 1.1rem + .9vw, 2rem);
  --sp-l:   clamp(2rem, 1.6rem + 2vw, 3.4rem);
  --sp-xl:  clamp(3rem, 2.2rem + 4vw, 6rem);
  --sp-2xl: clamp(4.5rem, 3rem + 7.5vw, 10rem);
  --sp-3xl: clamp(6rem, 3.5rem + 12vw, 15rem);

  --gutter: clamp(1.2rem, .5rem + 3.4vw, 4.5rem);
  --maxw:   1560px;
  --radius: 14px;
  --radius-lg: 20px;

  --font-display: "Cormorant", Georgia, serif;
  --font-text:    "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --header-h: 76px;
}

/* ── Reset ── */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
html.lenis,html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
body{
  font-family:var(--font-text);
  font-size:var(--step-0);
  font-weight:400;
  line-height:1.65;
  color:var(--text);
  background:var(--paper);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,video,iframe{ display:block; max-width:100%; }
[hidden]{ display:none !important; } /* иначе display:grid/flex перебивает атрибут */
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul{ list-style:none; }
::selection{ background:var(--sand); color:var(--ink); }

/* ── Иконка через маску (tabler / собственные svg) ── */
.ico{
  display:inline-block;
  width:1.35em; height:1.35em;
  flex:0 0 auto;
  background:currentColor;
  -webkit-mask:var(--m) center/contain no-repeat;
          mask:var(--m) center/contain no-repeat;
}

/* ═══ Прелоадер ═══ */
.preloader{
  position:fixed; inset:0; z-index:9999;
  display:grid; place-items:center;
  background:var(--ink);
  transition:opacity .7s var(--ease), visibility .7s;
}
.preloader.is-done{ opacity:0; visibility:hidden; }
.preloader__inner{ display:grid; gap:var(--sp-m); justify-items:center; }
.preloader__logo{ width:min(190px,45vw); opacity:.95; }
.preloader__bar{ width:min(190px,45vw); height:2px; background:rgba(244,242,237,.16); overflow:hidden; }
.preloader__bar span{ display:block; height:100%; width:0; background:var(--sand); transition:width .3s linear; }

/* ═══ Хедер ═══ */
.header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  /* backdrop-filter намеренно НЕ в списке переходов: пока фильтр не снят
     полностью, хедер остаётся содержащим блоком для position:fixed и зажимает
     раскрытое меню в свою рамку. Анимация фильтра давала два рывка при
     открытии. Переключаем его мгновенно. */
  transition:transform .55s var(--ease), background .45s var(--ease);
}
.header.is-hidden{ transform:translateY(-102%); }
.header.is-solid{
  background:rgba(18,20,15,.82);
  backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid var(--line-dark);
}
.header__inner{
  max-width:var(--maxw); margin:0 auto;
  padding:var(--sp-s) var(--gutter);
  display:flex; align-items:center; gap:var(--sp-m);
  min-height:var(--header-h);
}
.header__logo{ flex:0 0 auto; }
.header__logo img{ width:clamp(96px,9vw,140px); transition:opacity var(--t-base); }
.header__logo:hover img{ opacity:.75; }

.nav{ display:flex; gap:clamp(.9rem,1.6vw,2rem); margin-left:auto; }
.nav a{
  position:relative;
  font-size:var(--step--1); font-weight:500;
  letter-spacing:.04em; text-transform:uppercase;
  color:var(--text-inv-soft);
  transition:color var(--t-base);
  padding-block:.4rem;
}
.nav a::after{
  content:''; position:absolute; left:0; bottom:0;
  width:100%; height:1px; background:var(--sand);
  transform:scaleX(0); transform-origin:right;
  transition:transform .5s var(--ease-out);
}
.nav a:hover{ color:var(--text-inv); }
.nav a:hover::after{ transform:scaleX(1); transform-origin:left; }

/* Контакты внутри мобильного меню — на десктопе не нужны */
.nav__foot{ display:none; }

.header__actions{ display:flex; align-items:center; gap:var(--sp-s); margin-left:var(--sp-s); }
.header__phone{
  font-size:var(--step--1); font-weight:600; letter-spacing:.02em;
  color:var(--text-inv); white-space:nowrap;
  transition:color var(--t-base);
}
.header__phone:hover{ color:var(--sand); }

.burger{ display:none; width:34px; height:34px; position:relative; }
.burger span{
  position:absolute; left:6px; width:22px; height:1.5px; background:var(--text-inv);
  transition:transform .45s var(--ease-out), opacity .3s;
}
.burger span:nth-child(1){ top:14px; }
.burger span:nth-child(2){ top:20px; }
body.nav-open .burger span:nth-child(1){ transform:translateY(3px) rotate(45deg); }
body.nav-open .burger span:nth-child(2){ transform:translateY(-3px) rotate(-45deg); }

/* ═══ Кнопки ═══ */
.btn{
  --btn-bg:var(--sand); --btn-fg:var(--ink); --btn-fill:var(--ink); --btn-fg-hover:var(--paper);
  position:relative; overflow:hidden;
  isolation:isolate;           /* свой контекст наложения */
  z-index:0;
  display:inline-flex; align-items:center; justify-content:center;
  padding:.95em 1.9em;
  background:var(--btn-bg); color:var(--btn-fg);
  border-radius:100px;
  font-size:var(--step--1); font-weight:600;
  letter-spacing:.045em; text-transform:uppercase;
  white-space:nowrap;
  transition:transform .5s var(--ease-out), box-shadow .5s var(--ease), color .35s var(--ease);
  transform:translateZ(0);
}
/* Заливка уезжает ЗА текст (z-index:-1), поэтому текст остаётся читаемым */
.btn::before{
  content:''; position:absolute; inset:0;
  background:var(--btn-fill);
  transform:translateY(101%);
  transition:transform .55s var(--ease-out);
  z-index:-1;
}
.btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(18,20,15,.22);
  color:var(--btn-fg-hover);
}
.btn:hover::before{ transform:translateY(0); }
.btn:active{ transform:translateY(0); }
.btn--sm{ padding:.75em 1.45em; font-size:clamp(.7rem,.68rem+.1vw,.78rem); }
.btn--lg{ padding:1.15em 2.6em; font-size:var(--step-0); }
.btn--full{ width:100%; }
/* Прозрачная кнопка на тёмном: заливается светлым, текст темнеет */
.btn--ghost{
  --btn-bg:transparent; --btn-fg:var(--text-inv);
  --btn-fill:var(--paper); --btn-fg-hover:var(--ink);
  border:1px solid rgba(244,242,237,.36);
  transition:transform .5s var(--ease-out), box-shadow .5s var(--ease),
             color .35s var(--ease), border-color .35s var(--ease);
}
.btn--ghost:hover{ border-color:var(--paper); }
/* Прозрачная кнопка на светлом фоне: заливается тёмным, текст светлеет */
.btn--dark{
  --btn-fg:var(--ink); --btn-fill:var(--ink); --btn-fg-hover:var(--paper);
  border-color:var(--line);
}
.btn--dark:hover{ border-color:var(--ink); }

/* ═══ Секции ═══ */
.section{
  max-width:var(--maxw); margin:0 auto;
  padding:var(--sp-2xl) var(--gutter);
}
.section__head{ margin-bottom:var(--sp-xl); }
.section__label{
  font-size:var(--step--1); font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-mute);
  margin-bottom:var(--sp-s);
}
.section__title{
  font-family:var(--font-display);
  font-size:var(--step-4); font-weight:400; line-height:1.06;
  letter-spacing:-.015em;
  max-width:20ch;
}

/* ═══ HERO ═══ */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:calc(var(--header-h) + var(--sp-l)) var(--gutter) var(--sp-l);
  color:var(--text-inv);
  overflow:hidden;
}
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.12); transform-origin:center 55%;
  will-change:transform;
}
.hero__scrim{
  position:absolute; inset:0;
  background:
    /* мягкое затемнение слева — под текстовый блок */
    linear-gradient(100deg, rgba(10,12,8,.78) 0%, rgba(10,12,8,.5) 34%, rgba(10,12,8,0) 62%),
    linear-gradient(to top, rgba(10,12,8,.94) 0%, rgba(10,12,8,.5) 42%, rgba(10,12,8,.24) 68%, rgba(10,12,8,.55) 100%);
}
.hero__content{
  position:relative; z-index:2;
  max-width:var(--maxw); width:100%; margin:0 auto;
  padding-bottom:var(--sp-m);
}
.hero__eyebrow{
  font-size:var(--step--1); font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--sand);
  margin-bottom:var(--sp-m);
}
.hero__title{
  font-family:var(--font-display);
  font-size:var(--step-5); font-weight:400; line-height:.92;
  letter-spacing:-.025em;
  margin-bottom:var(--sp-m);
}
.reveal-line{ display:block; overflow:hidden; }
.reveal-line > span{ display:block; }
.hero__lead{
  max-width:46ch;
  font-size:var(--step-1); font-weight:300; line-height:1.55;
  color:rgba(244,242,237,.86);
  margin-bottom:var(--sp-l);
}
/* Цена в hero */
.hero__price{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:.5rem .9rem;
  margin-bottom:var(--sp-m);
}
.hero__price b{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:500; line-height:1;
  letter-spacing:-.01em;
  color:var(--sand);
}
.hero__price span{
  font-size:var(--step--1); letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-inv-soft);
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:var(--sp-s); }

.hero__facts{
  position:relative; z-index:2;
  max-width:var(--maxw); width:100%; margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:var(--sp-s);
  padding-top:var(--sp-m);
  border-top:1px solid var(--line-dark);
}
.hero__fact b{
  display:block;
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:500; line-height:1;
  letter-spacing:-.01em;
}
.hero__fact span{
  display:block; margin-top:.35em;
  font-size:var(--step--1); color:var(--text-inv-soft);
  letter-spacing:.03em;
}
/* Указатель прокрутки — вертикально у правого края, вне потока фактов */
.hero__scroll{
  position:absolute; right:calc(var(--gutter) * .45); top:50%; z-index:3;
  transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl;
  display:flex; align-items:center; gap:.8rem;
  font-size:var(--step--1); letter-spacing:.22em; text-transform:uppercase;
  color:var(--text-inv-soft);
  transition:color var(--t-base);
}
.hero__scroll:hover{ color:var(--text-inv); }
.hero__scroll span{
  width:1px; height:52px; background:linear-gradient(transparent,var(--sand));
  animation:scrollLine 2.2s var(--ease-in-out-el) infinite;
}
@keyframes scrollLine{ 0%,100%{ transform:scaleY(.4); opacity:.5 } 50%{ transform:scaleY(1); opacity:1 } }

/* Низкие экраны: ужимаем hero, чтобы всё помещалось */
@media (max-height:820px) and (min-width:900px){
  .hero{ padding-bottom:var(--sp-m); }
  .hero__eyebrow{ margin-bottom:var(--sp-s); }
  .hero__lead{ margin-bottom:var(--sp-m); font-size:var(--step-0); }
  .hero__title{ margin-bottom:var(--sp-s); }
  .hero__facts{ padding-top:var(--sp-s); }
  .hero__fact b{ font-size:var(--step-2); }
}
@media (max-height:680px) and (min-width:900px){
  .hero__lead{ display:none; }
}

/* ═══ Бегущая строка ═══ */
.marquee{
  background:var(--ink); color:var(--text-inv);
  padding:var(--sp-s) 0;
  overflow:hidden;
  border-block:1px solid var(--line-dark);
}
.marquee__track{
  display:flex; align-items:center;
  width:max-content;
  will-change:transform;
}
/* Один набор фраз; клоны добавляет JS до бесшовной длины */
.marquee__set{
  display:flex; align-items:center; gap:1.6rem;
  padding-right:1.6rem;
  flex:0 0 auto;
}
.marquee__set span{
  font-family:var(--font-display);
  font-size:var(--step-2); font-weight:400;
  white-space:nowrap;
}
.marquee__set i{ color:var(--sand); font-style:normal; }

/* Без JS лента просто стоит — пустот не будет */
html:not(.js) .marquee__track{ animation:none; }

/* ═══ Интро / манифест ═══ */
.intro__grid{ margin-bottom:var(--sp-2xl); }
.intro__label{
  font-size:var(--step--1); font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-mute); margin-bottom:var(--sp-m);
}
.intro__text{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:400; line-height:1.24;
  letter-spacing:-.01em;
  max-width:28ch;
}
.reveal-word{ display:inline-block; }
.intro__text .muted{ color:var(--text-mute); }

/* Ключевые параметры */
.keyspecs{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
}
.keyspec{
  background:var(--paper);
  padding:var(--sp-m);
  display:grid; gap:.35rem;
  transition:background var(--t-base);
}
.keyspec:hover{ background:var(--paper-warm); }
.keyspec .ico{ width:2.1rem; height:2.1rem; color:var(--moss); margin-bottom:.5rem; }
.keyspec b{
  font-family:var(--font-display);
  font-size:var(--step-2); font-weight:500; line-height:1;
}
.keyspec span{ font-size:var(--step--1); color:var(--text-mute); letter-spacing:.03em; }

/* ═══ Showcase (большое фото) ═══ */
.showcase{ padding-inline:var(--gutter); }
.showcase__figure{
  position:relative;
  max-width:var(--maxw); margin:0 auto;
  border-radius:var(--radius-lg);
  overflow:hidden;
  clip-path:inset(6% round var(--radius-lg));
  transition:clip-path 1.4s var(--ease-in-out-el);
}
.showcase__figure.is-in{ clip-path:inset(0 round var(--radius-lg)); }
.showcase__figure img{
  width:100%; height:clamp(360px,72vh,860px); object-fit:cover;
  transform:scale(1.14); will-change:transform;
}
.showcase__cap{
  position:absolute; left:var(--sp-m); bottom:var(--sp-m);
  color:var(--text-inv);
  font-size:var(--step--1); letter-spacing:.05em;
  background:rgba(18,20,15,.5);
  backdrop-filter:blur(8px);
  padding:.7em 1.3em; border-radius:100px;
}

/* ═══ Галерея ═══ */
/* Сетка с фиксированной высотой ряда: 9 карточек = 12 ячеек = ровно 3 ряда */
.gallery__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:clamp(150px,15.5vw,250px);
  gap:var(--sp-s);
}
.gcard{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  cursor:zoom-in;
  clip-path:inset(0 round var(--radius));
  background:var(--paper-warm);
}
.gcard--tall{ grid-row:span 2; }
.gcard--wide{ grid-column:span 2; }
.gcard img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.2s var(--ease-out), filter .6s var(--ease);
}
.gcard:hover img{ transform:scale(1.07); }
.gcard figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:var(--sp-m) var(--sp-s) var(--sp-s);
  color:var(--text-inv);
  font-size:var(--step--1); letter-spacing:.05em;
  background:linear-gradient(transparent,rgba(10,12,8,.8));
  opacity:0; transform:translateY(12px);
  transition:opacity .5s var(--ease), transform .5s var(--ease-out);
}
.gcard:hover figcaption{ opacity:1; transform:translateY(0); }

/* ═══ Видео ═══ */
.videosec{ padding:var(--sp-xl) var(--gutter); background:var(--ink); }
.videosec__inner{
  position:relative;
  max-width:var(--maxw); margin:0 auto;
  border-radius:var(--radius-lg); overflow:hidden;
  background:#000;
}
.videosec__video{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.videosec__play{
  position:absolute; inset:0; margin:auto;
  width:clamp(74px,9vw,116px); height:clamp(74px,9vw,116px);
  display:grid; place-items:center;
  border-radius:50%;
  background:rgba(244,242,237,.14);
  backdrop-filter:blur(10px);
  border:1px solid rgba(244,242,237,.4);
  transition:transform .6s var(--ease-bounce), background var(--t-base), opacity .4s;
}
.videosec__play span{
  width:0; height:0;
  border-left:16px solid var(--paper);
  border-block:10px solid transparent;
  margin-left:5px;
  transition:opacity .3s;
}
.videosec__play:hover{ transform:scale(1.1); background:rgba(244,242,237,.26); }
.videosec__play.is-playing{ opacity:0; pointer-events:none; }
.videosec__label{
  position:absolute; left:var(--sp-m); bottom:var(--sp-m);
  color:var(--text-inv); font-size:var(--step--1);
  letter-spacing:.08em; text-transform:uppercase;
  pointer-events:none;
}

/* ═══ Особенности ═══ */
.features{ }
.frow{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--sp-xl);
  align-items:center;
  margin-bottom:var(--sp-2xl);
}
.frow:last-child{ margin-bottom:0; }
.frow--rev .frow__media{ order:2; }
.frow__media{
  border-radius:var(--radius-lg); overflow:hidden;
  clip-path:inset(8% round var(--radius-lg));
  transition:clip-path 1.3s var(--ease-in-out-el);
}
.frow__media.is-in{ clip-path:inset(0 round var(--radius-lg)); }
.frow__media img{
  width:100%; height:clamp(300px,52vh,620px); object-fit:cover;
  transform:scale(1.1); will-change:transform;
}
.frow__num{
  display:block;
  font-family:var(--font-display);
  font-size:var(--step-2); color:var(--sand-deep);
  margin-bottom:var(--sp-xs);
}
.frow__text h3{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:400; line-height:1.1;
  letter-spacing:-.015em;
  margin-bottom:var(--sp-s);
  max-width:16ch;
}
.frow__text > p{
  font-size:var(--step-1); font-weight:300; line-height:1.6;
  color:var(--text-soft);
  max-width:44ch;
  margin-bottom:var(--sp-m);
}
.flist{ display:grid; gap:var(--sp-s); }
.flist li{
  display:flex; gap:var(--sp-s); align-items:flex-start;
  padding-top:var(--sp-s);
  border-top:1px solid var(--line);
  font-size:var(--step-0); line-height:1.55;
  color:var(--text-soft);
}
.flist li > span{ min-width:0; } /* чтобы длинный текст корректно переносился */
.flist li b{ color:var(--text); font-weight:600; white-space:nowrap; }
.flist .ico{ color:var(--moss); margin-top:.15em; width:1.5rem; height:1.5rem; }
.flist--grid{ }

/* ═══ Цифры ═══ */
.stats{
  background:var(--ink); color:var(--text-inv);
  padding:var(--sp-2xl) var(--gutter);
}
.stats__grid{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:var(--sp-l);
}
.stat b{
  display:block;
  font-family:var(--font-display);
  font-size:var(--step-4); font-weight:400; line-height:1;
  letter-spacing:-.02em;
  color:var(--sand);
  margin-bottom:var(--sp-xs);
}
.stat span{
  display:block;
  font-size:var(--step--1); color:var(--text-inv-soft);
  letter-spacing:.04em;
  padding-top:var(--sp-xs);
  border-top:1px solid var(--line-dark);
}

/* ═══ Характеристики ═══ */
.specs__cols{
  display:grid; grid-template-columns:1fr 1fr;
  gap:var(--sp-xl);
}
.spectable h3{
  font-family:var(--font-display);
  font-size:var(--step-2); font-weight:500;
  margin-bottom:var(--sp-s);
}
.spectable dl{ display:grid; }
.spectable dl > div{
  display:flex; justify-content:space-between; align-items:baseline; gap:var(--sp-s);
  padding:var(--sp-s) 0;
  border-bottom:1px solid var(--line);
  transition:padding-left var(--t-base), background var(--t-base);
}
.spectable dl > div:hover{ padding-left:.6rem; }
.spectable dt{ color:var(--text-mute); font-size:var(--step-0); }
.spectable dd{ font-weight:600; text-align:right; }

/* ═══ Расположение ═══ */
.location__grid{
  display:grid; grid-template-columns:.85fr 1.15fr;
  gap:var(--sp-xl); align-items:start;
}
.location__text p{
  font-size:var(--step-1); font-weight:300; line-height:1.6;
  color:var(--text-soft); margin-bottom:var(--sp-m);
}
.location__text ul{ display:grid; gap:var(--sp-s); margin-bottom:var(--sp-l); }
.location__text li{
  display:flex; gap:var(--sp-s); align-items:flex-start;
  padding-top:var(--sp-s); border-top:1px solid var(--line);
  color:var(--text-soft);
}
.location__text .ico{ color:var(--moss); margin-top:.15em; }
.location__map{
  border-radius:var(--radius-lg); overflow:hidden;
  height:clamp(380px,62vh,720px);
  background:var(--paper-warm);
  clip-path:inset(6% round var(--radius-lg));
  transition:clip-path 1.2s var(--ease-in-out-el);
}
.location__map.is-in{ clip-path:inset(0 round var(--radius-lg)); }
.location__map iframe{ width:100%; height:100%; border:0; }

/* ═══ Бонус ═══ */
.bonus{
  background:var(--paper-warm);
  padding:var(--sp-2xl) var(--gutter);
}
.bonus__inner{
  max-width:760px; margin:0 auto; text-align:center;
}
.bonus__ico{ width:3rem; height:3rem; color:var(--sand-deep); margin-bottom:var(--sp-m); }
.bonus h2{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:400; line-height:1.12;
  margin-bottom:var(--sp-s);
}
.bonus p{ font-size:var(--step-1); font-weight:300; color:var(--text-soft); }

/* ═══ Финальный CTA ═══ */
.cta{
  position:relative;
  min-height:clamp(460px,78vh,760px);
  display:grid; place-items:center;
  padding:var(--sp-2xl) var(--gutter);
  overflow:hidden;
  color:var(--text-inv); text-align:center;
}
.cta__bg{ position:absolute; inset:0; z-index:0; }
.cta__bg::after{ content:''; position:absolute; inset:0; background:rgba(10,12,8,.62); }
.cta__bg img{ width:100%; height:100%; object-fit:cover; transform:scale(1.14); will-change:transform; }
.cta__inner{ position:relative; z-index:1; max-width:34ch; }
.cta__title{
  font-family:var(--font-display);
  font-size:var(--step-4); font-weight:400; line-height:1.05;
  margin-bottom:var(--sp-s);
}
.cta__price{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:500; line-height:1;
  color:var(--sand);
  margin-bottom:var(--sp-s);
}
.cta__lead{
  font-size:var(--step-1); font-weight:300;
  color:rgba(244,242,237,.84);
  margin-bottom:var(--sp-l);
}

/* ═══ Футер ═══ */
.footer{
  background:var(--ink); color:var(--text-inv);
  padding:var(--sp-2xl) var(--gutter) var(--sp-m);
}
.footer__grid{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr;
  gap:var(--sp-xl);
  padding-bottom:var(--sp-xl);
  border-bottom:1px solid var(--line-dark);
}
.footer__logo{ width:clamp(140px,14vw,200px); margin-bottom:var(--sp-m); }
.footer__price{
  font-family:var(--font-display);
  font-size:var(--step-2); font-weight:500; line-height:1;
  color:var(--sand) !important;
  margin-bottom:var(--sp-xs);
}
.footer__brand p{ max-width:38ch; color:var(--text-inv-soft); font-weight:300; }
.footer__contacts{ display:grid; justify-items:start; align-content:start; gap:var(--sp-s); }
.footer__label{
  font-size:var(--step--1); letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-mute);
}
.footer__big{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:500; line-height:1;
  transition:color var(--t-base);
}
.footer__big:hover{ color:var(--sand); }
.footer__mail{ color:var(--text-inv-soft); transition:color var(--t-base); }
.footer__mail:hover{ color:var(--sand); }
.footer__socials{ display:flex; gap:var(--sp-m); }
.footer__socials a{
  font-size:var(--step--1); letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-inv-soft);
  border-bottom:1px solid var(--line-dark);
  padding-bottom:.2em;
  transition:color var(--t-base), border-color var(--t-base);
}
.footer__socials a:hover{ color:var(--sand); border-color:var(--sand); }
.footer__bottom{
  max-width:var(--maxw); margin:0 auto;
  padding-top:var(--sp-m);
  display:flex; justify-content:space-between; align-items:baseline;
  flex-wrap:wrap; gap:var(--sp-xs) var(--sp-m);
  font-size:var(--step--1); color:var(--text-mute);
}
/* Юридические реквизиты — сдержанно, по центру нижней строки */
.footer__legal{
  flex:1 1 auto; text-align:center;
  color:rgba(244,242,237,.42);
  letter-spacing:.01em;
}

/* ═══ Мобильная CTA-панель ═══ */
.mobcta{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  display:none; gap:.6rem;
  padding:.7rem .8rem calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(18,20,15,.92);
  backdrop-filter:blur(14px);
  border-top:1px solid var(--line-dark);
  transform:translateY(110%);
  transition:transform .5s var(--ease-out);
}
.mobcta.is-in{ transform:translateY(0); }
.mobcta__call{
  display:flex; align-items:center; justify-content:center; gap:.45rem;
  flex:0 0 42%;
  border:1px solid rgba(244,242,237,.34); border-radius:100px;
  color:var(--text-inv);
  font-size:.8rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
}
.mobcta__btn{
  flex:1;
  background:var(--sand); color:var(--ink);
  border-radius:100px; padding:.9em 1em;
  font-size:.8rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
}

/* ═══ Модалка ═══ */
.modal{
  position:fixed; inset:0; z-index:200;
  display:grid; place-items:center;
  padding:var(--sp-m);
  visibility:hidden; opacity:0;
  transition:opacity .45s var(--ease), visibility .45s;
}
.modal.is-open{ visibility:visible; opacity:1; }
.modal__overlay{ position:absolute; inset:0; background:rgba(10,12,8,.72); backdrop-filter:blur(6px); }
.modal__box{
  position:relative;
  width:min(520px,100%);
  max-height:92svh; overflow-y:auto;
  background:var(--paper);
  border-radius:var(--radius-lg);
  padding:clamp(1.6rem,4vw,2.8rem);
  transform:translateY(28px) scale(.97);
  transition:transform .55s var(--ease-out);
}
.modal.is-open .modal__box{ transform:translateY(0) scale(1); }
.modal__close{
  position:absolute; top:.7rem; right:1rem;
  font-size:1.9rem; line-height:1; color:var(--text-mute);
  transition:color var(--t-quick), transform var(--t-quick);
}
.modal__close:hover{ color:var(--text); transform:rotate(90deg); }
.modal__eyebrow{
  font-size:var(--step--1); letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-mute); margin-bottom:var(--sp-xs);
}
.modal__box h3{
  font-family:var(--font-display);
  font-size:var(--step-3); font-weight:400; line-height:1.1;
  margin-bottom:var(--sp-2xs);
}
.modal__sub{ color:var(--text-soft); margin-bottom:var(--sp-m); font-weight:300; }

.form{ display:grid; gap:var(--sp-s); }
.field{ display:grid; gap:.35rem; }
.field > span{
  font-size:var(--step--1); font-weight:600;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-mute);
}
.field em{ font-style:normal; text-transform:none; letter-spacing:0; font-weight:400; }
.field input,.field textarea{
  width:100%;
  font:inherit; font-size:var(--step-0);
  color:var(--text);
  background:var(--paper-warm);
  border:1px solid transparent;
  border-radius:10px;
  padding:.9em 1.1em;
  transition:border-color var(--t-base), background var(--t-base);
  resize:vertical;
}
.field input:focus,.field textarea:focus{
  outline:none; border-color:var(--sand-deep); background:#fff;
}
.field.is-error input,.field.is-error textarea{ border-color:#c0492b; background:#fdf1ee; }
.hpot{ position:absolute !important; left:-9999px; opacity:0; height:0; width:0; }
.form__note{ font-size:var(--step--1); color:var(--text-mute); line-height:1.45; }
.form__error{
  font-size:var(--step--1); color:#c0492b;
  padding:.7em 1em; background:#fdf1ee; border-radius:8px;
}
#leadSubmit.is-loading{ pointer-events:none; opacity:.65; }

/* ═══ Модалка с документом (политика) ═══ */
.modal--doc .modal__box{
  width:min(760px,100%);
  max-height:min(88svh,860px);
  overflow:hidden;               /* обрезает по скруглению; скроллится внутренняя область */
  display:flex; flex-direction:column;
  padding:0;
}
.doc__head{
  padding:clamp(1.6rem,4vw,2.6rem) clamp(1.4rem,4vw,2.8rem) var(--sp-s);
  border-bottom:1px solid var(--line);
  flex:0 0 auto;
}
.doc__date{ font-size:var(--step--1); color:var(--text-mute); margin-top:.4rem; }

/* Прокручиваемая область.
   Полоса прокрутки перерисовывается под сайт: ::-webkit-scrollbar работает
   в Chrome, Edge, Safari и Android, scrollbar-color — в Firefox. Системный
   вид Windows и iOS при этом полностью заменяется. */
.doc__scroll{
  flex:1 1 auto;
  overflow-y:auto;
  overscroll-behavior:contain;   /* прокрутка не «пробивает» на страницу под модалкой */
  -webkit-overflow-scrolling:touch;
  padding:var(--sp-m) clamp(1.4rem,4vw,2.8rem) clamp(1.6rem,4vw,2.6rem);
  scrollbar-width:thin;
  scrollbar-color:var(--sand-deep) rgba(18,20,15,.08);
}
/* Chrome автоматически делает прокручиваемые области фокусируемыми, поэтому
   фокус приходит сразу при открытии. Полная рамка вокруг текста читалась бы
   как ошибка вёрстки — показываем деликатный акцент по левому краю. */
.doc__scroll:focus{ outline:none; }
.doc__scroll:focus-visible{
  outline:none;
  box-shadow:inset 2px 0 0 var(--sand-deep);
}

.doc__scroll::-webkit-scrollbar{ width:10px; }
.doc__scroll::-webkit-scrollbar-track{
  background:rgba(18,20,15,.06);
  border-radius:100px;
  margin-block:6px;
}
.doc__scroll::-webkit-scrollbar-thumb{
  background:var(--sand-deep);
  border-radius:100px;
  border:3px solid var(--paper);  /* «воздух» вокруг ползунка */
  background-clip:padding-box;
  min-height:44px;
}
.doc__scroll::-webkit-scrollbar-thumb:hover{ background:var(--moss); }

/* Текст документа */
.doc__body{ max-width:64ch; }
.doc__body h4{
  font-family:var(--font-display);
  font-size:var(--step-1); font-weight:600; line-height:1.25;
  margin:var(--sp-m) 0 var(--sp-2xs);
}
.doc__body h4:first-child{ margin-top:0; }
.doc__body p{
  font-size:var(--step-0); line-height:1.65;
  color:var(--text-soft);
  margin-bottom:var(--sp-xs);
}
.doc__body b{ color:var(--text); font-weight:600; }
.doc__body ul{
  display:grid; gap:.4rem;
  margin:0 0 var(--sp-xs) 0;
  padding-left:1.1rem;
  list-style:disc;
}
.doc__body li{
  font-size:var(--step-0); line-height:1.6;
  color:var(--text-soft);
  padding-left:.2rem;
}
.doc__body a{
  color:var(--text);
  border-bottom:1px solid var(--sand-deep);
  transition:color var(--t-base), border-color var(--t-base);
}
.doc__body a:hover{ color:var(--sand-deep); border-color:transparent; }

.footer__privacy{
  color:var(--text-mute);
  border-bottom:1px solid rgba(244,242,237,.22);
  padding-bottom:.15em;
  transition:color var(--t-base), border-color var(--t-base);
}
.footer__privacy:hover{ color:var(--sand); border-color:var(--sand); }

.modal__success{ text-align:center; display:grid; gap:var(--sp-s); justify-items:center; }
.modal__check{
  width:64px; height:64px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--moss); color:var(--paper);
  font-size:1.9rem;
  animation:popIn .6s var(--ease-bounce) both;
}
@keyframes popIn{ from{ transform:scale(0) } to{ transform:scale(1) } }
.modal__success p{ color:var(--text-soft); }

/* ═══ Reveal-состояния ═══
   Прячем ТОЛЬКО когда JS активен и анимации доступны.
   Без JS (или если GSAP не загрузился — снимается класс .js)
   контент виден всегда. */
html.js .reveal,
html.js .reveal-word,
html.js .reveal-line > span{ opacity:0; }

/* ═══ Лайтбокс ═══ */
.lightbox{
  position:fixed; inset:0; z-index:300;
  display:grid; place-items:center;
  background:rgba(10,12,8,.94);
  padding:var(--sp-m);
  visibility:hidden; opacity:0;
  transition:opacity .45s var(--ease), visibility .45s;
}
.lightbox.is-open{ visibility:visible; opacity:1; }
.lightbox img{
  max-width:100%; max-height:88svh;
  object-fit:contain; border-radius:var(--radius);
  transform:scale(.96);
  transition:transform .55s var(--ease-out);
}
.lightbox.is-open img{ transform:scale(1); }
.lightbox__close,.lightbox__nav{
  position:absolute; z-index:2;
  width:52px; height:52px; border-radius:50%;
  display:grid; place-items:center;
  color:var(--paper); font-size:1.6rem;
  background:rgba(244,242,237,.1);
  border:1px solid rgba(244,242,237,.24);
  transition:background var(--t-base), transform var(--t-base);
}
.lightbox__close{ top:var(--sp-m); right:var(--sp-m); }
.lightbox__nav{ top:50%; transform:translateY(-50%); }
.lightbox__nav--prev{ left:var(--sp-m); }
.lightbox__nav--next{ right:var(--sp-m); }
.lightbox__close:hover,.lightbox__nav:hover{ background:rgba(244,242,237,.24); }
.lightbox__counter{
  position:absolute; bottom:var(--sp-m); left:50%; transform:translateX(-50%);
  color:var(--text-inv-soft); font-size:var(--step--1); letter-spacing:.1em;
}

/* ═══════════════════════════════════════
   Адаптив
   ═══════════════════════════════════════ */
@media (max-width:1180px){
  .nav{ gap:1rem; }
  .nav a{ font-size:.72rem; }
  .header__phone{ display:none; }
}

@media (max-width:900px){
  :root{ --header-h:64px; }
  /* Меню в оверлей */
  .burger{ display:block; }
  .nav{
    position:fixed; inset:0; z-index:1;
    flex-direction:column; justify-content:center; align-items:center;
    gap:var(--sp-m);
    background:var(--ink);
    margin:0;
    padding:var(--header-h) var(--gutter) var(--sp-xl);
    overflow-y:auto;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .45s var(--ease), visibility .45s;
  }
  body.nav-open .nav{ opacity:1; visibility:visible; pointer-events:auto; }
  .nav a{ font-size:1.15rem; letter-spacing:.08em; color:var(--text-inv); }
  .header__actions .btn--sm{ display:none; }

  /* Контакты в нижней части мобильного меню */
  .nav__foot{
    display:grid; justify-items:center; gap:var(--sp-s);
    margin-top:var(--sp-l);
    padding-top:var(--sp-l);
    border-top:1px solid var(--line-dark);
    width:min(320px,100%);
  }
  .nav__price{
    font-family:var(--font-display);
    font-size:var(--step-2); font-weight:500; line-height:1;
    color:var(--sand);
  }
  .nav__phone{
    font-size:1.05rem !important; font-weight:600;
    letter-spacing:.02em !important; text-transform:none !important;
    color:var(--text-inv);
  }
  .nav__foot .btn{ width:100%; }
  .header.is-solid{ background:rgba(18,20,15,.9); }

  /* Кнопка-крестик должна быть НАД оверлеем меню.
     margin-left:auto прижимает её к правому краю: на мобильном .nav
     уходит из потока в оверлей и перестаёт растягивать строку. */
  .header__actions{ position:relative; z-index:3; margin-left:auto; }
  .header__logo{ position:relative; z-index:3; }
  .burger{ margin-right:calc(var(--sp-2xs) * -1); }

  /* backdrop-filter делает хедер содержащим блоком для position:fixed —
     из-за этого открытое меню обрезалось по высоте хедера. */
  body.nav-open .header{
    background:transparent;
    border-color:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  /* и хедер не должен уезжать вверх, пока меню открыто */
  body.nav-open .header.is-hidden{ transform:none; }

  .hero{ min-height:92svh; }
  .hero__facts{ grid-template-columns:repeat(2,1fr); gap:var(--sp-m); }
  .hero__scroll{ display:none; }

  .frow{ grid-template-columns:1fr; gap:var(--sp-m); margin-bottom:var(--sp-xl); }
  .frow--rev .frow__media{ order:0; }
  .frow__media img{ height:clamp(240px,42vh,420px); }

  .gallery__grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:clamp(140px,26vw,210px); }
  .gcard--tall{ grid-row:span 2; }
  .gcard--wide{ grid-column:span 2; }

  .stats__grid{ grid-template-columns:repeat(2,1fr); gap:var(--sp-m); }
  .specs__cols{ grid-template-columns:1fr; gap:var(--sp-l); }
  .location__grid{ grid-template-columns:1fr; gap:var(--sp-m); }
  .location__map{ height:clamp(320px,50vh,460px); }
  .footer__grid{ grid-template-columns:1fr; gap:var(--sp-l); }

  .mobcta{ display:flex; }
  /* плавающая панель перекрывает низ подвала — освобождаем под неё место */
  .footer{ padding-bottom:calc(var(--sp-m) + 78px + env(safe-area-inset-bottom)); }
  .footer__legal{ text-align:left; }
}

@media (max-width:560px){
  .hero__title{ line-height:.96; }
  .hero__cta{ flex-direction:column; align-items:stretch; }
  .hero__cta .btn{ width:100%; }
  .hero__facts{ padding-top:var(--sp-s); }
  .hero__fact span{ font-size:.72rem; }

  .keyspecs{ grid-template-columns:repeat(2,1fr); }
  .gallery__grid{ grid-template-columns:1fr; grid-auto-rows:auto; gap:var(--sp-xs); }
  .gcard,.gcard--tall,.gcard--wide{ grid-column:span 1; grid-row:span 1; aspect-ratio:4/3; }
  .gcard figcaption{ opacity:1; transform:none; }

  .stats__grid{ grid-template-columns:1fr; }
  .spectable dd{ font-size:var(--step-0); }
  .footer__bottom{ flex-direction:column; gap:.4rem; }
  .lightbox__nav{ width:44px; height:44px; }
  .lightbox__nav--prev{ left:.4rem; }
  .lightbox__nav--next{ right:.4rem; }
}

/* Уважение к prefers-reduced-motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .reveal,.reveal-word,.reveal-line > span{ opacity:1 !important; transform:none !important; }
  .showcase__figure,.frow__media,.location__map{ clip-path:none !important; }
  .marquee__track{ animation:none; }
}