/* Общие стили сайта Грани: главная и внутренние страницы. */
/* ГРАНИ — природа больших событий.
   Типографика и цвета — из презентации площадки: один гротеск Manrope,
   заголовки обычного начертания крупно и плотно, вторая строка выделена
   цветом (медь на светлом, золото на тёмном), подписи — капсом с разрядкой.
   Светлые секции — мягкие градиенты крем → мята → сливочный, тёмные —
   лесной зелёный с бирюзовым свечением. Мотив — фронтон и косая грань. */
:root {
  --бумага: #EFE8DA; --бумага2: #E6DDCB; --бумага3: #DCD1BC;
  --тушь: #1B2520; --тушь2: #46524B; --тушь3: #7C847D;
  --лес: #111A15; --лес2: #18231D;
  --крем: #F4ECDD; --крем2: #CFC6B4;
  --медь: #9A5A22; --медь2: #E3B46A;   /* акцент: медь на светлом, золото на тёмном */
  --бирюза: #6FBFB8;
  --антиква: 'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --гротеск: 'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --поле: clamp(20px, 4.4vw, 76px);
  --плавно: cubic-bezier(.16, 1, .3, 1);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }   /* иначе display у .кнопка перебивает атрибут hidden */
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body { margin: 0; background: var(--бумага); color: var(--тушь); font: 400 16px/1.65 var(--гротеск);
  -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.грузится { overflow: hidden; }
img, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
::selection { background: var(--тушь); color: var(--бумага); }
h1, h2, h3, h4 { font-family: var(--гротеск); font-weight: 400; margin: 0; line-height: 1; letter-spacing: -.035em; }
em { font-style: normal; }   /* в презентации акцент — цветом, без курсива */
.полотно { padding: 0 var(--поле); max-width: 1680px; margin: 0 auto; }
.мелко { font-size: 11.5px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; }
.медь { color: var(--медь); }

/* зерно плёнки поверх всего */
.зерно { position: fixed; inset: -50%; z-index: 90; pointer-events: none; opacity: .07; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: зерно 1s steps(6) infinite; }
@keyframes зерно { 0%{transform:translate(0,0)} 20%{transform:translate(-4%,3%)} 40%{transform:translate(3%,-2%)}
  60%{transform:translate(-2%,-4%)} 80%{transform:translate(4%,2%)} 100%{transform:translate(0,0)} }

/* слова в заголовках выезжают из-под маски */
.с { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.с > span { display: inline-block; will-change: transform; }

/* ---------- заставка ----------
   Тонкая линия фронтона рисуется, логотип проступает из-под маски,
   внизу — подпись и процент. Уходит вверх косым срезом, как скат кровли. */
.загрузка { position: fixed; inset: 0; z-index: 100; color: var(--крем); display: grid; place-items: center;
  background: radial-gradient(60% 70% at 85% 0%, rgba(47,120,104,.35), transparent 70%),
              radial-gradient(50% 60% at 10% 100%, rgba(150,140,60,.18), transparent 70%), var(--лес); }
.загрузка-центр { position: relative; width: min(520px, 72vw); }
.загрузка-фронтон { position: absolute; left: 50%; bottom: calc(100% + clamp(22px, 4vh, 40px)); width: 15%; transform: translateX(-50%); overflow: visible; }
.загрузка-фронтон path { fill: none; stroke: var(--медь2); stroke-width: 1; vector-effect: non-scaling-stroke;
  stroke-dasharray: 1; stroke-dashoffset: 1; }
.загрузка-лого { clip-path: inset(0 0 100% 0); }
.загрузка-лого img { width: 100%; height: auto; display: block; }
.загрузка-низ { position: absolute; left: var(--поле); right: var(--поле); bottom: clamp(24px, 5vh, 48px);
  display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; font-size: 11px; letter-spacing: .32em;
  text-transform: uppercase; color: var(--крем2); }
.загрузка-низ .счёт { font-size: 13px; letter-spacing: .12em; color: var(--крем); font-variant-numeric: tabular-nums; }
.загрузка-шкала { position: absolute; left: var(--поле); right: var(--поле); bottom: calc(clamp(24px, 5vh, 48px) + 30px); height: 1px;
  background: rgba(244,236,221,.14); }
.загрузка-шкала i { position: absolute; inset: 0; background: var(--медь2); transform-origin: left; transform: scaleX(0); }

/* ---------- курсор ---------- */
.курсор, .кольцо { position: fixed; left: 0; top: 0; z-index: 95; pointer-events: none; border-radius: 50%; }
.курсор { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: var(--тушь); }
.кольцо { width: 44px; height: 44px; margin: -22px 0 0 -22px; border: 1px solid rgba(27,37,32,.35);
  display: grid; place-items: center; transition: width .5s var(--плавно), height .5s var(--плавно), margin .5s var(--плавно),
  background .4s, border-color .4s; }
.кольцо span { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--бумага); opacity: 0; transition: opacity .3s; white-space: nowrap; }
.кольцо.большое { width: 104px; height: 104px; margin: -52px 0 0 -52px; background: var(--тушь); border-color: var(--тушь); }
.кольцо.большое span { opacity: 1; }
body.на-тёмном .курсор { background: var(--крем); }
body.на-тёмном .кольцо { border-color: rgba(244,236,221,.4); }
body.на-тёмном .кольцо.большое { background: var(--крем); border-color: var(--крем); }
body.на-тёмном .кольцо.большое span { color: var(--лес); }
@media (hover: none), (pointer: coarse) { .курсор, .кольцо { display: none; } }
@media (hover: hover) and (pointer: fine) { body.свой-курсор, body.свой-курсор a, body.свой-курсор button { cursor: none; } }

/* ---------- шапка ---------- */
.шапка { position: fixed; top: 0; left: 0; right: 0; z-index: 60; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 22px var(--поле); transition: transform .6s var(--плавно); }
.шапка.спрятана { transform: translateY(-110%); }
.шапка .лого img { height: 38px; width: auto; }
.шапка nav { display: flex; gap: 6px; padding: 6px; border-radius: 100px; background: rgba(239,232,218,.72);
  backdrop-filter: blur(14px) saturate(1.4); -webkit-backdrop-filter: blur(14px) saturate(1.4); border: 1px solid rgba(27,37,32,.08); }
.шапка nav a { font-size: 13px; padding: 9px 16px; border-radius: 100px; transition: background .35s, color .35s; }
.шапка nav a:hover { background: var(--тушь); color: var(--бумага); }
.шапка .справа { justify-self: end; display: flex; align-items: center; gap: 18px; }
.шапка .тел { font-size: 13.5px; padding: 8px 14px; border-radius: 100px; background: rgba(239,232,218,.72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.кнопка { position: relative; display: inline-flex; align-items: center; gap: 12px; padding: 15px 26px; border-radius: 100px;
  background: var(--тушь); color: var(--бумага); font-size: 13px; font-weight: 500; letter-spacing: .04em; overflow: hidden; isolation: isolate; }
.кнопка::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--медь); border-radius: inherit;
  transform: translateY(101%); transition: transform .6s var(--плавно); }
.кнопка:hover::before { transform: none; }
.кнопка .стрелка { display: inline-block; transition: transform .5s var(--плавно); }
.кнопка:hover .стрелка { transform: translateX(4px) rotate(-45deg); }
.кнопка.светлая { background: var(--крем); color: var(--лес); }
.кнопка.светлая:hover { color: var(--крем); }
@media (max-width: 1060px) { .шапка nav, .шапка .тел { display: none; } .шапка { grid-template-columns: 1fr auto; } }

/* ---------- первый экран ---------- */
.герой { position: relative; min-height: 100svh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); }
.герой-текст { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end;
  padding: 130px var(--поле) clamp(34px, 6vh, 70px); }
.герой .дисплей { font-size: clamp(56px, 7.2vw, 140px); line-height: .94; letter-spacing: -.05em; margin-right: -14vw; font-weight: 400;
  position: relative; z-index: 3; pointer-events: none; }
.герой .дисплей em { color: var(--медь); padding-right: .06em; }
.герой .дисплей .отступ { padding-left: 1.1em; }
.герой-низ { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-top: clamp(30px, 5vh, 60px); }
.герой-низ p { margin: 0; max-width: 36ch; flex: 1 1 auto; color: var(--тушь2); font-size: 15px; }
.герой-цифры { flex: none; }
.герой-цифры b { white-space: nowrap; }
.герой-цифры { display: flex; gap: clamp(20px, 2.6vw, 44px); }
.герой-цифры b { display: block; font: 300 clamp(32px, 2.8vw, 46px)/1 var(--антиква); }
.герой-цифры span { font-size: 11.5px; color: var(--тушь3); letter-spacing: .04em; white-space: nowrap; }
@media (max-width: 1240px) { .герой-цифры { display: none; } }

.сцена { position: relative; overflow: hidden; background: #cfd8dc; touch-action: pan-y;   /* по горизонтали палец рисует оттепель */
  clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); }
.сцена canvas, .сцена .запас { position: absolute; inset: 0; width: 100%; height: 100%; }
.сцена .запас { object-fit: cover; }
.сцена-подписи { position: absolute; left: 16%; right: 0; bottom: 0; z-index: 3; display: flex; justify-content: space-between; align-items: flex-end;
  padding: 0 clamp(18px, 2.4vw, 36px) clamp(18px, 3.4vh, 34px); pointer-events: none; color: #fff; }
.подсказка { display: flex; align-items: center; gap: 12px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  text-shadow: 0 1px 14px rgba(0,0,0,.35); }
.подсказка svg { width: 34px; height: 34px; }
.сезон-кнопки { pointer-events: auto; display: flex; padding: 4px; border-radius: 100px; background: rgba(255,255,255,.18);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.3); }
.сезон-кнопки button { border: 0; background: none; color: #fff; padding: 9px 16px; border-radius: 100px; cursor: pointer;
  font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; transition: background .35s, color .35s; }
.сезон-кнопки button.да { background: #fff; color: var(--тушь); }
.сцена-метка { position: absolute; top: clamp(96px, 13vh, 130px); right: clamp(18px, 2.4vw, 36px); z-index: 3; color: #fff;
  text-align: right; font: 400 clamp(16px, 1.3vw, 21px)/1.3 var(--гротеск); letter-spacing: -.01em; text-shadow: 0 1px 18px rgba(0,0,0,.4); pointer-events: none; }
.сцена-метка .мелко { display: block; font-family: var(--гротеск); font-style: normal; margin-bottom: 8px; opacity: .85; }

@media (max-width: 900px) {
  .герой-низ { flex-wrap: nowrap !important; }
  .быстрая { flex: none; width: 100%; max-width: 560px; }
  .герой { grid-template-columns: 1fr; grid-template-rows: auto auto; }
  .сцена { order: -1; height: 72svh; clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%); }
  .сцена-подписи { left: 0; bottom: 9%; }
  .герой-текст { padding-top: 22px; }
  .герой .дисплей { margin-right: 0; font-size: clamp(52px, 15.5vw, 96px); }
  .герой-низ { flex-direction: column; align-items: flex-start; }
  .подсказка span { display: none; }
}

/* ---------- бегущая строка ---------- */
.строка { overflow: hidden; padding: clamp(40px, 6vw, 90px) 0; border-bottom: 1px solid rgba(27,37,32,.12); }
.строка-лента { display: flex; width: max-content; will-change: transform; }
.строка-лента span { font: 300 clamp(48px, 7vw, 120px)/1 var(--гротеск); letter-spacing: -.04em; white-space: nowrap; padding-right: .4em;
  display: inline-flex; align-items: center; gap: .4em; }
.строка-лента span::after { content: ''; width: .34em; height: .3em; background: var(--медь); clip-path: polygon(50% 0, 100% 100%, 0 100%); }

/* ---------- манифест ---------- */
.секция { padding: clamp(100px, 13vw, 210px) 0; }
.манифест { display: grid; grid-template-columns: 1fr 3fr; gap: clamp(30px, 5vw, 90px); }
.манифест-лево .мелко { display: block; padding-top: 1.1em; }
.манифест-фото { margin-top: clamp(30px, 4vw, 60px); aspect-ratio: 3 / 4; clip-path: polygon(50% 0, 100% 16%, 100% 100%, 0 100%, 0 16%); }
@media (max-width: 860px) { .манифест-фото { max-width: 360px; } }
.манифест p { margin: 0; font: 400 clamp(28px, 3.3vw, 58px)/1.15 var(--гротеск); letter-spacing: -.03em; text-indent: 2.2em; }
.манифест p .сл { opacity: .14; }
.цифры { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(80px, 10vw, 160px);
  border-top: 1px solid rgba(27,37,32,.16); }
.цифры > div { padding: 26px 22px 0 0; }
.цифры > div + div { padding-left: 22px; border-left: 1px solid rgba(27,37,32,.16); }
.цифры b { display: block; white-space: nowrap; font: 300 clamp(52px, 6vw, 120px)/.95 var(--гротеск); letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.цифры sup { font-size: .3em; font-weight: 400; letter-spacing: 0; vertical-align: top; position: relative; top: .5em; margin-left: .2em; color: var(--медь); }
.цифры > div > span { display: block; margin-top: 16px; color: var(--тушь2); font-size: 14px; max-width: 22ch; }
@media (max-width: 860px) {
  .манифест { grid-template-columns: 1fr; }
  .цифры { grid-template-columns: 1fr 1fr; }
  .цифры > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .цифры > div { padding-bottom: 34px; }
}

/* ---------- горизонтальная прокрутка пространств ---------- */
.пространства, .сезоны, .контакты { background:
    radial-gradient(55% 60% at 100% 0%, rgba(47,120,104,.32), transparent 70%),
    radial-gradient(45% 55% at 0% 100%, rgba(150,140,60,.16), transparent 70%), var(--лес) !important; }
.пространства { color: var(--крем); overflow: hidden; }
.пространства-верх { padding: clamp(70px, 8vw, 120px) var(--поле) 0; display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; }
.пространства h2 { font-size: clamp(46px, min(6.4vw, 11vh), 118px); }
.пространства h2 em { color: var(--медь2); }
.пространства-верх p { max-width: 36ch; color: var(--крем2); margin: 0; }
.дорожка { display: grid; gap: clamp(80px, 10vw, 160px); padding: clamp(60px, 8vw, 120px) var(--поле) clamp(90px, 11vw, 170px); max-width: 1680px; margin: 0 auto; }
.панель { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(30px, 6vw, 110px); align-items: center; }
.панель:nth-child(even) .панель-фото { order: 2; }
.панель-фото { position: relative; aspect-ratio: 4 / 3.3; overflow: hidden; clip-path: polygon(50% 0, 100% 14%, 100% 100%, 0 100%, 0 14%); }
.панель-фото img { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; object-fit: cover; }
.панель .н { font: 300 22px var(--антиква); color: var(--медь2); }
.панель h3 { font-size: clamp(38px, 4vw, 72px); margin: 14px 0 22px; }
.панель p { color: var(--крем2); margin: 0 0 26px; font-size: 15px; }
.панель dl { margin: 0; display: grid; border-top: 1px solid rgba(244,236,221,.16); }
.панель dl div { display: flex; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid rgba(244,236,221,.16); font-size: 14px; }
.панель dt { color: var(--крем2); }
.панель dd { margin: 0; font: 400 20px var(--антиква); }
@media (max-width: 900px) {
  .пространства-верх { flex-direction: column; align-items: flex-start; }
  .панель { grid-template-columns: 1fr; gap: 26px; }
  .панель:nth-child(even) .панель-фото { order: 0; }
}

/* ---------- Триумф: галерея ---------- */
.триумф-верх { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(30px, 5vw, 90px); align-items: end; }
.триумф-верх h2 { font-size: clamp(42px, 5.6vw, 104px); }
.триумф-верх h2 em { color: var(--медь); }
.триумф-верх p { margin: 0; color: var(--тушь2); max-width: 44ch; font-size: clamp(15px, 1.2vw, 17px); }
.мозаика { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 24px); margin-top: clamp(60px, 8vw, 120px); }
.кадр { position: relative; overflow: hidden; margin: 0; }
.кадр img { width: 100%; height: 100%; object-fit: cover; transform-origin: center; }
.кадр figcaption { position: absolute; left: 16px; bottom: 14px; color: #fff; font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
  text-shadow: 0 1px 12px rgba(0,0,0,.5); }
.к1 { grid-column: 1 / span 7; aspect-ratio: 16 / 11; }
.к2 { grid-column: 9 / span 4; aspect-ratio: 4 / 5; margin-top: 18vh; }
.к3 { grid-column: 2 / span 4; aspect-ratio: 4 / 5; margin-top: -6vh; }
.к4 { grid-column: 7 / span 6; aspect-ratio: 16 / 10; margin-top: 8vh; }
.к5 { grid-column: 1 / span 5; aspect-ratio: 16 / 11; margin-top: 6vh; }
.к6 { grid-column: 7 / span 5; aspect-ratio: 16 / 11; margin-top: 16vh; }
.спеки { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(20px, 4vw, 70px); margin-top: clamp(80px, 10vw, 150px); }
.спеки div { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding: 20px 0; border-bottom: 1px solid rgba(27,37,32,.14); }
.спеки span { color: var(--тушь3); font-size: 14px; }
.спеки b { font: 400 clamp(22px, 2vw, 30px)/1 var(--антиква); text-align: right; }
@media (max-width: 860px) {
  .триумф-верх { grid-template-columns: 1fr; }
  .мозаика { grid-template-columns: 1fr 1fr; }
  .к1, .к4 { grid-column: 1 / -1; margin: 0; }
  .к2, .к3, .к5, .к6 { grid-column: span 1; margin: 0; aspect-ratio: 3 / 4; }
  .спеки { grid-template-columns: 1fr; }
}

/* ---------- панорама на всю ширину ---------- */
.панорама { position: relative; height: 92vh; min-height: 520px; overflow: hidden; color: var(--крем); display: flex; align-items: flex-start; }
.панорама-фото { position: absolute; inset: -12% 0; }
.панорама-фото img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.панорама::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(10,8,8,.72) 0%, rgba(10,8,8,.3) 50%, rgba(10,8,8,.05) 80%), linear-gradient(0deg, rgba(17,26,21,.6), transparent 30%); }
.панорама-текст { position: relative; z-index: 2; padding-top: clamp(70px, 14vh, 160px); width: 100%; }
.панорама-текст .мелко { color: #F6DDA9; }
.панорама-текст p { margin: 20px 0 0; font: 400 clamp(36px, 5vw, 92px)/1 var(--гротеск); letter-spacing: -.045em; max-width: 15ch; }
.панорама-текст p em { color: #F6DDA9; }

/* ---------- сезоны ---------- */
.сезоны { position: relative; background: var(--лес); color: var(--крем); padding: clamp(90px, 11vw, 170px) 0; overflow: hidden; }
.сезоны-сетка { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 2vw, 30px); margin-top: clamp(80px, 9vw, 140px); }
.сезон { position: relative; }
.сезон:nth-child(2) { margin-top: clamp(60px, 14vw, 240px); }
.сезон .кадр { aspect-ratio: 4 / 5; }
.сезон h3 { position: absolute; z-index: 2; top: -0.56em; font-size: clamp(76px, 10vw, 180px); letter-spacing: -.06em; color: var(--крем); pointer-events: none; }
.сезон:nth-child(1) h3 { left: -0.06em; }
.сезон:nth-child(2) h3 { right: -0.02em; }
.сезон p { color: var(--крем2); max-width: 40ch; margin: 18px 0 0; }
.сезон .мелко { display: block; margin-top: 30px; color: var(--медь2); }
.сезоны h2 { font-size: clamp(42px, 5vw, 92px); max-width: 14ch; }
.сезоны h2 em { color: var(--медь2); }
@media (max-width: 760px) { .сезоны-сетка { grid-template-columns: 1fr; gap: 90px; } .сезон:nth-child(2) { margin-top: 0; } }

/* ---------- территория: схема с точками ---------- */
.территория-верх { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; flex-wrap: wrap; }
.территория-верх h2 { font-size: clamp(42px, 5.6vw, 104px); }
.территория-верх h2 em { color: var(--медь); }
.территория-верх p { max-width: 38ch; color: var(--тушь2); margin: 0; }
.схема { position: relative; margin-top: clamp(50px, 6vw, 90px); }
.схема .кадр { aspect-ratio: 1228 / 693; }
.точка { position: absolute; z-index: 2; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
  background: var(--бумага); box-shadow: 0 0 0 0 rgba(239,232,218,.7); animation: пульс 2.4s infinite; }
.точка::after { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: var(--медь); }
@keyframes пульс { 70% { box-shadow: 0 0 0 16px rgba(239,232,218,0); } 100% { box-shadow: 0 0 0 0 rgba(239,232,218,0); } }
.точка .подсказка-т { position: absolute; left: 50%; bottom: calc(100% + 14px); transform: translate(-50%, 8px); width: max-content; max-width: 240px;
  padding: 14px 16px; border-radius: 4px; background: var(--бумага); color: var(--тушь); text-align: left; font-size: 13px; line-height: 1.45;
  box-shadow: 0 20px 50px -20px rgba(0,0,0,.45); opacity: 0; pointer-events: none; transition: opacity .35s, transform .5s var(--плавно); }
.точка .подсказка-т b { display: block; font: 400 21px/1.1 var(--антиква); margin-bottom: 4px; }
.точка:hover .подсказка-т, .точка:focus-visible .подсказка-т, .точка.открыта .подсказка-т { opacity: 1; transform: translate(-50%, 0); }
.пункты { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 3vw, 50px); margin: clamp(40px, 5vw, 70px) 0 0; padding: 0; list-style: none; counter-reset: п; }
.пункты li { counter-increment: п; border-top: 1px solid rgba(27,37,32,.16); padding-top: 18px; color: var(--тушь2); font-size: 14.5px; }
.пункты li::before { content: counter(п, decimal-leading-zero); display: block; font: 300 22px var(--антиква); color: var(--медь); margin-bottom: 10px; }
.пункты b { display: block; color: var(--тушь); font-weight: 500; margin-bottom: 6px; }
@media (max-width: 860px) { .пункты { grid-template-columns: 1fr 1fr; } }

/* ---------- аренда ---------- */
.аренда, .градиент { background:
    radial-gradient(60% 70% at 100% 0%, rgba(150,206,190,.55), transparent 70%),
    radial-gradient(50% 60% at 85% 100%, rgba(233,226,160,.55), transparent 70%),
    var(--бумага); }
.аренда-сетка { display: grid; grid-template-columns: 1fr 1fr; margin-top: clamp(50px, 6vw, 90px); border-top: 1px solid rgba(27,37,32,.18); }
.тариф { padding: clamp(28px, 3.4vw, 54px) clamp(0px, 3vw, 54px) clamp(28px, 3.4vw, 54px) 0; }
.тариф + .тариф { border-left: 1px solid rgba(27,37,32,.18); padding-left: clamp(20px, 3vw, 54px); }
.тариф .мелко { color: var(--медь); }
.тариф b { display: block; font: 300 clamp(40px, 4.6vw, 84px)/1 var(--гротеск); letter-spacing: -.05em; margin: 22px 0 14px; }
.тариф b small { font-size: .3em; font-weight: 400; letter-spacing: 0; color: var(--тушь3); }
.тариф p { margin: 0; color: var(--тушь2); font-size: 14.5px; }
.аренда h2 { font-size: clamp(42px, 5.6vw, 104px); max-width: 16ch; }
.аренда h2 em { color: var(--медь); }
.включено { columns: 3 240px; column-gap: clamp(20px, 4vw, 70px); margin: clamp(50px, 6vw, 90px) 0 0; padding: 0; list-style: none; }
.включено li { break-inside: avoid; padding: 14px 0 14px 26px; border-bottom: 1px solid rgba(27,37,32,.12); position: relative; font-size: 15px; }
.включено li::before { content: ''; position: absolute; left: 0; top: 22px; width: 9px; height: 8px; background: var(--медь); clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.аренда-фото { aspect-ratio: 21 / 9; margin-top: clamp(50px, 6vw, 90px); }
.сноска { color: var(--тушь3); font-size: 13.5px; max-width: 78ch; margin: 26px 0 0; }
@media (max-width: 760px) { .аренда-сетка { grid-template-columns: 1fr; } .тариф + .тариф { border-left: 0; padding-left: 0; border-top: 1px solid rgba(27,37,32,.18); } }

/* ---------- кухня ---------- */
.кухня { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 6vw, 110px); align-items: center; }
.кухня .кадр { aspect-ratio: 4 / 5; }
.кухня h2 { font-size: clamp(44px, 5.6vw, 100px); }
.кухня h2 em { color: var(--медь); }
.кухня p { color: var(--тушь2); max-width: 42ch; font-size: clamp(15px, 1.25vw, 18px); margin: 28px 0 0; }
.ярлыки { list-style: none; padding: 0; margin: 34px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ярлыки li { font-size: 13px; padding: 9px 16px; border: 1px solid rgba(27,37,32,.22); border-radius: 100px; }
@media (max-width: 860px) { .кухня { grid-template-columns: 1fr; } }

/* ---------- контакты ---------- */
.контакты { background: var(--лес); color: var(--крем); padding: clamp(100px, 12vw, 190px) 0 0; overflow: hidden; }
.контакты h2 { font-size: clamp(52px, 8.6vw, 168px); line-height: .92; letter-spacing: -.05em; }
.контакты h2 em { color: var(--медь2); }
.контакты-сетка { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(40px, 7vw, 130px); margin-top: clamp(60px, 8vw, 120px); }
.люди { margin: 0; }
.люди dt { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--крем2); opacity: .7; margin-top: 34px; }
.люди dt:first-child { margin-top: 0; }
.люди dd { margin: 10px 0 0; font: 300 clamp(22px, 2vw, 32px)/1.3 var(--гротеск); letter-spacing: -.02em; }
.люди dd a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .6s var(--плавно); }
.люди dd a:hover { background-size: 100% 1px; }
.заявка { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; }
.поле { position: relative; }
.поле.широко { grid-column: 1 / -1; }
.поле input, .поле select, .поле textarea { width: 100%; background: none; border: 0; border-bottom: 1px solid rgba(244,236,221,.24); border-radius: 0;
  color: var(--крем); font: 300 18px var(--гротеск); padding: 30px 0 12px; outline: none; }
.поле select { appearance: none; -webkit-appearance: none; cursor: pointer; }
.поле select option { background: var(--лес2); }
.поле textarea { resize: vertical; min-height: 64px; }
.поле label { position: absolute; left: 0; top: 30px; color: var(--крем2); font-size: 16px; pointer-events: none; transform-origin: left;
  transition: transform .45s var(--плавно), color .3s; }
.поле::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--медь2); transform: scaleX(0);
  transform-origin: left; transition: transform .7s var(--плавно); }
.поле:focus-within::after { transform: none; }
.поле:focus-within label, .поле.заполнено label { transform: translateY(-24px) scale(.72); color: var(--медь2); }
.поле input[type=date]::-webkit-calendar-picker-indicator { filter: invert(.85); }
.поле:not(.заполнено):not(:focus-within) input[type=date] { color: transparent; }
.согласие { grid-column: 1 / -1; display: flex; gap: 12px; margin-top: 26px; font-size: 13px; color: var(--крем2); cursor: pointer; }
.согласие input { accent-color: var(--медь2); width: 16px; height: 16px; margin-top: 2px; flex: none; }
.согласие a { text-decoration: underline; text-underline-offset: 3px; }
.заявка .кнопка { grid-column: 1 / -1; justify-self: start; margin-top: 36px; border: 0; cursor: pointer; padding: 20px 34px; font-size: 14px; }
.итог { grid-column: 1 / -1; color: var(--бирюза); margin-top: 18px; }
@media (max-width: 860px) { .контакты-сетка, .заявка { grid-template-columns: 1fr; } }

.подвал { padding: clamp(100px, 12vw, 180px) var(--поле) 30px; }
.подвал-лого { width: 100%; height: auto; opacity: .95; }
.подвал-низ { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-top: 40px; padding-top: 24px;
  border-top: 1px solid rgba(244,236,221,.16); font-size: 13px; color: var(--крем2); }


/* ---------- формы заявки: общие детали ---------- */
.контакт-ряд { display: flex; gap: 10px; flex-wrap: wrap; }
.контакт-ряд input { flex: 1 1 200px; min-width: 0; height: 56px; border-radius: 100px; border: 1px solid rgba(27,37,32,.18);
  background: rgba(255,255,255,.72); padding: 0 22px; font: 400 15px var(--гротеск); color: var(--тушь); outline: none;
  transition: border-color .3s, background .3s; }
.контакт-ряд input:focus { border-color: var(--тушь); background: #fff; }
.быстрая-согласие { display: flex; gap: 8px; align-items: center; margin-top: 12px; font-size: 11.5px; color: var(--тушь3); cursor: pointer; }
.быстрая-согласие input { accent-color: var(--медь); width: 14px; height: 14px; margin: 0; }
.быстрая-согласие a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.итог-формы { margin: 14px 0 0; color: #2F7868; font-weight: 500; }
.итог-формы a { color: var(--медь); text-decoration: underline; text-underline-offset: 3px; }
form.отправлено .контакт-ряд, form.отправлено .быстрая-ряд { opacity: .45; pointer-events: none; }

/* первый экран: «свободна ли дата» */
.герой-низ { flex-wrap: wrap; }
.быстрая { flex: 1 1 380px; max-width: 470px; padding: 16px 16px 12px; border-radius: 22px; background: rgba(255,255,255,.5);
  border: 1px solid rgba(27,37,32,.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.быстрая-подпись { display: block; font-size: 13px; font-weight: 500; margin: 0 0 10px 6px; }
.быстрая-ряд { display: flex; gap: 6px; }
.быстрая-ряд input { flex: 1 1 0; min-width: 0; height: 48px; border-radius: 100px; border: 1px solid rgba(27,37,32,.14); background: #fff;
  padding: 0 16px; font: 400 14px var(--гротеск); color: var(--тушь); outline: none; }
.быстрая-ряд input:focus { border-color: var(--тушь); }
.быстрая-ряд button { flex: none; border: 0; border-radius: 100px; background: var(--тушь); color: var(--бумага); padding: 0 20px;
  font: 500 13px var(--гротеск); cursor: pointer; transition: background .3s; }
.быстрая-ряд button:hover { background: var(--медь); }
@media (max-width: 520px) { .быстрая-ряд { flex-wrap: wrap; } .быстрая-ряд input { flex-basis: 45%; } .быстрая-ряд button { flex: 1 1 100%; height: 48px; } }

/* лид-магнит: презентация */
.магнит-обёртка { padding: 0 0 clamp(90px, 11vw, 170px); }
.магнит { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(30px, 5vw, 80px); align-items: center;
  padding: clamp(28px, 4vw, 64px); border-radius: 32px;
  background: radial-gradient(70% 90% at 0% 100%, rgba(150,206,190,.6), transparent 70%),
              radial-gradient(60% 80% at 100% 0%, rgba(233,226,160,.6), transparent 70%), #EAE2D2; }
.магнит-обложка { position: relative; aspect-ratio: 16 / 10; border-radius: 14px; overflow: hidden; transform: rotate(-3deg);
  box-shadow: 0 40px 70px -40px rgba(27,37,32,.55), 0 0 0 10px rgba(255,255,255,.55); transition: transform .8s var(--плавно); }
.магнит:hover .магнит-обложка { transform: rotate(0) scale(1.02); }
.магнит-обложка img { width: 100%; height: 100%; object-fit: cover; }
.магнит-обложка span { position: absolute; left: 22px; bottom: 18px; color: #fff; font: 400 clamp(22px, 2.2vw, 34px)/1 var(--гротеск);
  letter-spacing: -.04em; text-shadow: 0 2px 20px rgba(0,0,0,.4); }
.магнит h3 { font-size: clamp(28px, 3vw, 50px); line-height: 1.05; letter-spacing: -.045em; margin: 14px 0 16px; }
.магнит-текст > p { color: var(--тушь2); margin: 0 0 26px; max-width: 46ch; }
@media (max-width: 860px) { .магнит { grid-template-columns: 1fr; } }

/* калькулятор-квиз */
.расчёт { display: grid; grid-template-columns: 1.45fr 1fr; gap: clamp(16px, 2vw, 30px); margin-top: clamp(50px, 6vw, 90px); align-items: start; }
.квиз { display: flex; flex-direction: column; min-height: 520px; padding: clamp(24px, 3.4vw, 54px); border-radius: 32px;
  background: rgba(255,255,255,.6); border: 1px solid rgba(27,37,32,.08); }
.квиз-шаги { display: flex; gap: 6px; margin-bottom: clamp(26px, 3vw, 40px); }
.квиз-шаги i { flex: 1; height: 3px; border-radius: 3px; background: rgba(27,37,32,.12); transition: background .5s; }
.квиз-шаги i.да { background: var(--медь); }
.шаг { border: 0; padding: 0; margin: 0; min-width: 0; display: none; }
.шаг.активен { display: block; animation: шаг .7s var(--плавно); }
@keyframes шаг { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: none; } }
.шаг legend { padding: 0; margin-bottom: 26px; font: 400 clamp(26px, 2.6vw, 42px)/1.05 var(--гротеск); letter-spacing: -.045em; }
.варианты { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.варианты input, .фишки input { position: absolute; opacity: 0; pointer-events: none; }
.варианты span { display: block; height: 100%; padding: 18px 18px 16px; border-radius: 18px; border: 1px solid rgba(27,37,32,.12);
  background: rgba(255,255,255,.7); cursor: pointer; transition: background .35s, color .35s, border-color .35s, transform .35s; }
.варианты span:hover { border-color: rgba(27,37,32,.4); transform: translateY(-2px); }
.варианты b { display: block; font-weight: 500; font-size: 17px; letter-spacing: -.02em; }
.варианты small { display: block; margin-top: 4px; font-size: 12.5px; color: var(--тушь3); transition: color .35s; }
.варианты input:checked + span { background: var(--тушь); color: var(--бумага); border-color: var(--тушь); }
.варианты input:checked + span small { color: var(--крем2); }
.варианты input:focus-visible + span, .фишки input:focus-visible + span { outline: 2px solid var(--медь); outline-offset: 2px; }
.гости { display: flex; align-items: baseline; gap: 14px; }
.гости output { font: 200 clamp(72px, 8vw, 132px)/1 var(--гротеск); letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.гости span { color: var(--тушь3); }
.квиз input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 2px; margin: 28px 0 12px; background:
  linear-gradient(var(--тушь), var(--тушь)) 0 / var(--заполнено, 13%) 100% no-repeat, rgba(27,37,32,.15); outline: none; }
.квиз input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; border-radius: 50%; background: var(--тушь);
  border: 6px solid var(--бумага); box-shadow: 0 0 0 1px var(--тушь); cursor: grab; }
.квиз input[type=range]::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--тушь); border: 6px solid var(--бумага); cursor: grab; }
.шкала-подписи { display: flex; justify-content: space-between; font-size: 12px; color: var(--тушь3); }
.фишки { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 20px; }
.фишки label { position: relative; }
.фишки span { display: inline-flex; flex-direction: column; align-items: center; padding: 10px 16px; border-radius: 100px; border: 1px solid rgba(27,37,32,.16);
  background: rgba(255,255,255,.7); font-size: 14px; cursor: pointer; transition: background .3s, color .3s, border-color .3s; line-height: 1.25; }
.фишки span small { font-size: 11px; color: var(--тушь3); }
.фишки span:hover { border-color: var(--тушь); }
.фишки input:checked + span { background: var(--тушь); color: var(--бумага); border-color: var(--тушь); }
.фишки input:checked + span small { color: var(--крем2); }
.точная-дата { display: inline-flex; align-items: center; gap: 12px; font-size: 14px; color: var(--тушь3); }
.точная-дата input { height: 44px; border-radius: 100px; border: 1px solid rgba(27,37,32,.16); background: #fff; padding: 0 14px;
  font: 400 14px var(--гротеск); color: var(--тушь); }
.квиз-кнопки { margin-top: auto; padding-top: 34px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.квиз-кнопки .кнопка { margin-left: auto; border: 0; cursor: pointer; }
.назад { border: 0; background: none; color: var(--тушь3); cursor: pointer; font-size: 14px; padding: 10px 0; }
.назад:hover { color: var(--тушь); }
.оценка { position: sticky; top: 100px; padding: clamp(26px, 3vw, 46px); border-radius: 32px; color: var(--крем);
  background: radial-gradient(70% 70% at 100% 0%, rgba(47,120,104,.45), transparent 70%), var(--лес); }
.оценка .мелко { color: var(--медь2); }
.оценка-итог { display: block; margin: 16px 0 26px; font: 200 clamp(40px, 4.2vw, 72px)/1 var(--гротеск); letter-spacing: -.055em; }
.оценка dl { margin: 0; border-top: 1px solid rgba(244,236,221,.16); }
.оценка dl div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(244,236,221,.16); font-size: 14.5px; }
.оценка dt { color: var(--крем2); }
.оценка dd { margin: 0; text-align: right; }
.оценка p { margin: 20px 0 0; font-size: 12.5px; color: var(--крем2); line-height: 1.55; }
.оценка-итог.мигает { animation: мигает .5s; }
@keyframes мигает { 0% { opacity: .3; transform: translateY(6px); } 100% { opacity: 1; transform: none; } }
@media (max-width: 960px) { .расчёт { grid-template-columns: 1fr; } .оценка { position: static; } .варианты { grid-template-columns: 1fr 1fr; } }

/* просмотр */
.просмотр { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(30px, 6vw, 110px); align-items: center; }
.просмотр-фото { aspect-ratio: 4 / 5; clip-path: polygon(50% 0, 100% 14%, 100% 100%, 0 100%, 0 14%); }
.просмотр h2 { font-size: clamp(42px, 5.6vw, 104px); }
.просмотр h2 em, .вопросы-сетка h2 em, .расчёт-секция h2 em { color: var(--медь); }
.расчёт-секция h2 { font-size: clamp(42px, 5.6vw, 104px); }
.просмотр-текст { color: var(--тушь2); max-width: 44ch; margin: 26px 0 30px; }
.просмотр-форма .мелко { display: block; color: var(--тушь3); }
@media (max-width: 860px) { .просмотр { grid-template-columns: 1fr; } .просмотр-фото { max-height: 60vh; } }

/* вопросы */
.вопросы-секция { background: var(--бумага2); }
.вопросы-сетка { display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(30px, 6vw, 110px); }
.вопросы-сетка h2 { font-size: clamp(42px, 5vw, 92px); }
.вопросы { border-top: 1px solid rgba(27,37,32,.16); }
.вопросы details { border-bottom: 1px solid rgba(27,37,32,.16); }
.вопросы summary { list-style: none; cursor: pointer; position: relative; padding: 24px 56px 24px 0;
  font: 400 clamp(19px, 1.7vw, 26px)/1.25 var(--гротеск); letter-spacing: -.025em; transition: color .3s; }
.вопросы summary::-webkit-details-marker { display: none; }
.вопросы summary::after { content: ''; position: absolute; right: 8px; top: 50%; width: 14px; height: 14px; margin-top: -7px;
  background: linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat, linear-gradient(currentColor, currentColor) center / 1px 100% no-repeat;
  transition: transform .5s var(--плавно); }
.вопросы details[open] summary::after { transform: rotate(135deg); }
.вопросы summary:hover { color: var(--медь); }
.вопросы p { margin: -6px 0 24px; color: var(--тушь2); max-width: 62ch; }
@media (max-width: 860px) { .вопросы-сетка { grid-template-columns: 1fr; } }

/* мобильная панель связи */
.док { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 70; display: none; grid-template-columns: 1fr 1fr 1.2fr; gap: 4px;
  padding: 5px; border-radius: 100px; background: rgba(17,26,21,.88); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transform: translateY(140%); transition: transform .6s var(--плавно); }
.док.видна { transform: none; }
.док a { display: grid; place-items: center; height: 46px; border-radius: 100px; color: var(--крем); font-size: 13px; font-weight: 500; }
.док a.главная { background: var(--крем); color: var(--лес); }
@media (max-width: 760px) { .док { display: grid; } .подвал { padding-bottom: 90px; } }


/* ---------- крупнее: важные тексты не должны быть мелкими ---------- */
body { font-size: 17px; }
.мелко { font-size: 12.5px; letter-spacing: .26em; }
.герой-метка { display: inline-block; margin-bottom: 22px; font-size: 13px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: var(--медь); }
.герой-h1 { margin: clamp(22px, 3vh, 34px) 0 0; font-size: clamp(22px, 1.9vw, 32px); font-weight: 400; line-height: 1.2; letter-spacing: -.025em; max-width: 22ch; }
.герой-низ p { font-size: clamp(16px, 1.15vw, 18.5px); max-width: 40ch; }
.быстрая-подпись { font-size: 15.5px; }
.быстрая-ряд input { font-size: 16px; }
.быстрая-ряд button { font-size: 14.5px; }
.быстрая-согласие { font-size: 12.5px; }
.кнопка { font-size: 15px; padding: 17px 30px; }
.шапка nav a { font-size: 14.5px; }
.шапка .тел { font-size: 15px; white-space: nowrap; }
@media (max-width: 1320px) { .шапка .тел { display: none; } }
/* первый экран должен целиком помещаться в окно */
.герой-текст { padding-top: clamp(96px, 13vh, 130px); padding-bottom: clamp(26px, 4vh, 50px); }
.герой .дисплей { font-size: clamp(52px, min(6.4vw, 11.5vh), 124px); }
.герой-метка { margin-bottom: clamp(12px, 2vh, 22px); }
.герой-h1 { margin-top: clamp(16px, 2.4vh, 30px); }
.герой-низ { margin-top: clamp(18px, 3vh, 36px); gap: clamp(16px, 2vh, 26px); }
.строка-лента span { font-size: clamp(52px, 7.6vw, 132px); }
.манифест p { font-size: clamp(30px, 3.5vw, 62px); }
.цифры > div > span { font-size: 16.5px; max-width: 24ch; }
.пространства-верх p { font-size: clamp(17px, 1.3vw, 20px); max-width: 40ch; }
.панель .н { font-size: 14px; letter-spacing: .14em; text-transform: uppercase; }
.панель p { font-size: 17px; }
.панель dl div { font-size: 16.5px; padding: 15px 0; }
.панель dd { font-size: 24px; }
.триумф-верх p { font-size: clamp(17px, 1.35vw, 20px); }
.кадр figcaption { font-size: 12.5px; letter-spacing: .18em; }
.спеки span { font-size: 16.5px; }
.спеки b { font-size: clamp(24px, 2.2vw, 34px); }
.пункты li { font-size: 16.5px; }
.пункты b { font-size: 18.5px; }
.территория-верх p { font-size: clamp(17px, 1.3vw, 19px); max-width: 44ch; }
.точка .подсказка-т { font-size: 15px; max-width: 280px; }
.точка .подсказка-т b { font-size: 22px; }
.подзаголовок { margin: 22px 0 0; max-width: 60ch; font-size: clamp(17px, 1.35vw, 20px); color: var(--тушь2); }
.тариф p { font-size: 16.5px; }
.включено li { font-size: 17px; }
.сноска { font-size: 15px; }
.кухня p { font-size: clamp(17px, 1.35vw, 20px); }
.ярлыки li { font-size: 15px; padding: 10px 18px; }
.магнит-текст > p { font-size: 17.5px; }
.варианты b { font-size: 19px; }
.варианты small { font-size: 14px; }
.фишки span { font-size: 15.5px; }
.точная-дата { font-size: 15.5px; }
.оценка dl div { font-size: 16px; }
.оценка p { font-size: 14px; }
.просмотр-текст { font-size: clamp(17px, 1.35vw, 20px); }
.вопросы p { font-size: 17.5px; }
.люди dt { font-size: 12.5px; }
.поле input, .поле select, .поле textarea { font-size: 19px; }
.поле label { font-size: 17px; }
.согласие { font-size: 14px; }
.подвал-низ { font-size: 14.5px; }

/* ---------- четыре сезона ---------- */
.сезоны { padding: clamp(100px, 12vw, 190px) 0; }
.сезоны-верх { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(30px, 5vw, 90px); align-items: end; }
.сезоны-верх h2 { font-size: clamp(44px, 5.6vw, 104px); max-width: 13ch; }
.сезоны-верх h2 em { color: var(--медь2); }
.сезоны-верх p { margin: 0; color: var(--крем2); font-size: clamp(17px, 1.3vw, 20px); max-width: 44ch; }
.четыре { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 26px); margin-top: clamp(60px, 7vw, 110px); }
.сезон-карта:nth-child(even) { margin-top: clamp(40px, 6vw, 110px); }
.сезон-карта .кадр { aspect-ratio: 3 / 4; border-radius: 4px; }
.сезон-карта .кадр img { transition: transform 1.4s var(--плавно); }
.сезон-карта:hover .кадр img { transform: scale(1.06); }
.сезон-карта .кадр::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,16,13,.55), transparent 45%); }
.сезон-карта h3 { position: absolute; z-index: 2; left: 20px; bottom: 14px; color: #fff; font-size: clamp(40px, 3.6vw, 64px); letter-spacing: -.05em; }
.месяцы-подпись { display: block; margin-top: 20px; font-size: 12.5px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: var(--медь2); }
.сезон-карта p { margin: 10px 0 0; color: var(--крем2); font-size: 16.5px; line-height: 1.55; }
.сезон-карта p b { display: block; color: var(--крем); font-weight: 500; font-size: 19px; margin-bottom: 6px; letter-spacing: -.01em; }
@media (max-width: 1100px) { .четыре { grid-template-columns: repeat(2, minmax(0, 1fr)); } .сезон-карта:nth-child(even) { margin-top: 50px; } }

/* ---------- SEO-текст ---------- */
.сео-текст { max-width: 980px; margin: 0 0 clamp(70px, 9vw, 130px); padding-top: 40px; border-top: 1px solid rgba(244,236,221,.16); }
.сео-текст h2 { font-size: clamp(24px, 2.2vw, 34px); letter-spacing: -.03em; margin-bottom: 18px; }
.сео-текст p { margin: 0; color: var(--крем2); font-size: 16px; line-height: 1.7; }

/* ================= мобильная версия ================= */
@media (max-width: 760px) {
  :root { --поле: 18px; }
  body { font-size: 16.5px; }
  .зерно { animation: none; opacity: .05; }
  .секция { padding: 84px 0; }
  h2 { letter-spacing: -.04em; }
  /* шапка: логотип и одна кнопка */
  .шапка { padding: 10px var(--поле); }
  .шапка .лого img { height: 30px; }
  .шапка .кнопка { padding: 12px 18px; font-size: 14px; }
  /* первый экран: сцена, затем текст и форма */
  .сцена { height: 62svh; }
  .сцена-метка { top: 72px; font-size: 15px; }
  .сцена-подписи { bottom: 12%; padding: 0 16px; }
  .сезон-кнопки button { padding: 10px 16px; font-size: 12px; }
  .герой-текст { padding: 20px var(--поле) 44px; }
  .герой-метка { font-size: 12px; margin-bottom: 14px; }
  .герой .дисплей { font-size: clamp(50px, 15vw, 84px); }
  .герой-h1 { font-size: 22px; }
  .герой-низ { gap: 22px; margin-top: 22px; }
  .герой-низ p { font-size: 16.5px; }
  .герой-низ { flex-wrap: nowrap; align-items: stretch; }   /* колонка + перенос уводили форму вправо за экран */
  .быстрая { max-width: none; flex: none; width: 100%; padding: 14px; }
  .быстрая-ряд { flex-wrap: wrap; }
  .быстрая-ряд input { flex: 1 1 100%; height: 52px; font-size: 16px; }
  .быстрая-ряд button { flex: 1 1 100%; height: 52px; font-size: 15.5px; }
  /* поля ввода не меньше 16 px — иначе iPhone приближает страницу */
  input, select, textarea { font-size: 16px !important; }
  .контакт-ряд input { flex-basis: 100%; height: 54px; }
  .контакт-ряд .кнопка, .заявка .кнопка, .квиз-кнопки .кнопка { width: 100%; justify-content: center; }
  .строка { padding: 34px 0; }
  .строка-лента span { font-size: 46px; }
  .манифест p { font-size: 27px; text-indent: 0; }
  .манифест-фото { max-width: none; aspect-ratio: 4 / 3; clip-path: polygon(50% 0, 100% 14%, 100% 100%, 0 100%, 0 14%); }
  .цифры { margin-top: 56px; }
  .цифры b { font-size: 52px; }
  .цифры > div > span { font-size: 14.5px; }
  /* сезоны: листаются свайпом, по карточке на экран */
  .сезоны-верх { grid-template-columns: 1fr; }
  .сезоны-верх h2 { font-size: 40px; }
  .четыре { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 44px calc(-1 * var(--поле)) 0;
    padding: 0 var(--поле) 6px; scroll-padding-inline: var(--поле); scrollbar-width: none; }
  .четыре::-webkit-scrollbar { display: none; }
  .сезон-карта { flex: 0 0 80%; scroll-snap-align: start; margin-top: 0 !important; }
  /* павильоны */
  .пространства-верх { padding-top: 84px; }
  .пространства h2 { font-size: 40px; }
  .дорожка { padding: 44px var(--поле) 80px; gap: 64px; }
  .панель-фото { aspect-ratio: 4 / 3.4; }
  .панель h3 { font-size: 36px; }
  /* Триумф */
  .триумф-верх h2, .территория-верх h2, .аренда h2, .расчёт-секция h2, .просмотр h2, .вопросы-сетка h2, .кухня h2 { font-size: 38px; }
  .мозаика { gap: 10px; margin-top: 44px; }
  .кадр figcaption { left: 12px; bottom: 10px; font-size: 11px; }
  .спеки { margin-top: 50px; }
  .спеки div { padding: 16px 0; }
  .спеки b { font-size: 24px; }
  .магнит { padding: 22px; border-radius: 24px; gap: 26px; }
  .магнит h3 { font-size: 27px; }
  .панорама { height: 74svh; min-height: 440px; }
  .панорама-текст p { font-size: 34px; }
  /* территория: подсказка точки — нижней шторкой, чтобы не вылезала за край */
  .точка { width: 24px; height: 24px; margin: -12px 0 0 -12px; }
  .точка::after { inset: 7px; }
  .точка .подсказка-т { position: fixed; left: 14px; right: 14px; bottom: 82px; top: auto; width: auto; max-width: none;
    transform: translateY(16px); z-index: 80; box-shadow: 0 24px 60px -20px rgba(0,0,0,.5); }
  .точка.открыта .подсказка-т { transform: none; }
  .точка:hover:not(.открыта) .подсказка-т { opacity: 0; }
  .пункты { grid-template-columns: 1fr; gap: 0; }
  .пункты li { padding: 16px 0; }
  /* аренда */
  .тариф b { font-size: 46px; }
  .включено { columns: 1; }
  /* калькулятор: оценка сверху, видно как меняется */
  .расчёт { display: flex; flex-direction: column-reverse; align-items: stretch; gap: 12px; margin-top: 36px; }
  .оценка { padding: 22px 22px 18px; border-radius: 22px; }
  .оценка-итог { font-size: 40px; margin: 8px 0 14px; }
  .оценка p { display: none; }
  .оценка dl div { padding: 10px 0; font-size: 14.5px; }
  .квиз { min-height: 0; padding: 22px 18px; border-radius: 22px; }
  .шаг legend { font-size: 26px; margin-bottom: 20px; }
  .варианты { grid-template-columns: 1fr 1fr; gap: 8px; }
  .варианты span { padding: 14px; }
  .варианты b { font-size: 17px; }
  .варианты small { font-size: 12.5px; }
  .гости output { font-size: 72px; }
  .квиз-кнопки { flex-wrap: wrap; padding-top: 24px; }
  .квиз-кнопки .назад { order: 2; width: 100%; text-align: center; }
  .фишки span { padding: 10px 14px; }
  .точная-дата { flex-wrap: wrap; }
  /* просмотр и вопросы */
  .просмотр-фото { aspect-ratio: 4 / 3; max-height: none; }
  .вопросы summary { font-size: 19px; padding: 20px 44px 20px 0; }
  .вопросы p { font-size: 16.5px; }
  /* контакты */
  .контакты { padding-top: 84px; }
  .контакты h2 { font-size: 48px; }
  .люди dd { font-size: 24px; }
  .заявка { gap: 0; }
  .сео-текст p { font-size: 15px; }
  .подвал { padding-top: 70px; }
}


/* ---------- кухня и сервис: интерактивное меню ---------- */
.кухня-секция { padding: clamp(100px, 12vw, 190px) 0; color: var(--крем); overflow: hidden;
  background: radial-gradient(55% 60% at 100% 0%, rgba(47,120,104,.38), transparent 70%),
              radial-gradient(45% 55% at 0% 100%, rgba(150,140,60,.18), transparent 70%), var(--лес); }
.кухня-верх { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(30px, 5vw, 90px); align-items: end; }
.кухня-верх h2 { font-size: clamp(44px, 5.6vw, 104px); max-width: 12ch; }
.кухня-верх h2 em { color: var(--медь2); }
.кухня-лид p { margin: 0; color: var(--крем2); font-size: clamp(17px, 1.3vw, 20px); max-width: 46ch; }
.значки { list-style: none; padding: 0; margin: 26px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.значки li { padding: 9px 16px; border-radius: 100px; border: 1px solid rgba(227,180,106,.45); color: var(--медь2); font-size: 14px; }

.меню-блок { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(30px, 5vw, 90px); margin-top: clamp(60px, 7vw, 110px); align-items: start; }
.меню-список { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(244,236,221,.16); }
.меню-список li { position: relative; display: grid; grid-template-columns: 56px 1fr auto; gap: 18px; align-items: center;
  padding: clamp(22px, 2.6vw, 36px) 0; border-bottom: 1px solid rgba(244,236,221,.16); cursor: default; transition: padding .6s var(--плавно); }
.меню-список li::before { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--медь2);
  transform: scaleX(0); transform-origin: left; transition: transform .8s var(--плавно); }
.меню-список li.активна::before { transform: none; }
.меню-список .н { font-size: 14px; letter-spacing: .14em; color: var(--крем2); transition: color .4s; }
.меню-список h3 { font-size: clamp(26px, 2.6vw, 44px); letter-spacing: -.04em; line-height: 1.05; color: rgba(244,236,221,.55);
  transition: color .5s, transform .7s var(--плавно); }
.меню-список p { margin: 8px 0 0; color: var(--крем2); font-size: 16px; max-width: 40ch; max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height .7s var(--плавно), opacity .5s; }
.меню-список b { text-align: right; font-weight: 300; font-size: clamp(22px, 2vw, 32px); letter-spacing: -.04em; white-space: nowrap;
  color: rgba(244,236,221,.55); transition: color .5s; }
.меню-список b small { display: block; font-size: 13px; letter-spacing: .04em; color: var(--крем2); }
.меню-список li.активна h3 { color: var(--крем); transform: translateX(10px); }
.меню-список li.активна .н, .меню-список li.активна b { color: var(--медь2); }
.меню-список li.активна p { max-height: 120px; opacity: 1; }
.меню-фото-моб { display: none; }

.меню-рамка { position: sticky; top: 110px; margin: 0; aspect-ratio: 4 / 4.6; overflow: hidden; border-radius: 6px;
  clip-path: polygon(50% 0, 100% 12%, 100% 100%, 0 100%, 0 12%); box-shadow: 0 50px 90px -50px rgba(0,0,0,.8); }
.меню-рамка .слой { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.12);
  transition: opacity .9s var(--плавно), transform 1.6s var(--плавно); }
.меню-рамка .слой.видно { opacity: 1; transform: scale(1); }
.меню-рамка::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,14,12,.6), transparent 40%); pointer-events: none; }
.меню-рамка figcaption { position: absolute; z-index: 2; left: 24px; bottom: 20px; right: 24px; font-size: 15px; color: #fff; }

.доводы { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(60px, 7vw, 110px); border-top: 1px solid rgba(244,236,221,.16); }
.доводы div { padding: 28px 24px 0 0; }
.доводы div + div { padding-left: 24px; border-left: 1px solid rgba(244,236,221,.16); }
.доводы b { display: block; font-weight: 200; font-size: clamp(44px, 4.6vw, 84px); letter-spacing: -.055em; line-height: 1; color: var(--крем); }
.доводы span { display: block; margin-top: 12px; color: var(--крем2); font-size: 16.5px; max-width: 26ch; }
.кухня-действия { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: clamp(50px, 6vw, 80px); }
.кухня-тел { color: var(--крем2); font-size: 16px; border-bottom: 1px solid rgba(244,236,221,.3); padding-bottom: 2px; transition: color .3s; }
.кухня-тел:hover { color: var(--крем); }

@media (max-width: 900px) {
  .кухня-верх, .меню-блок { grid-template-columns: 1fr; }
  .меню-рамка { display: none; }
  /* на телефоне у каждой строки своё фото и всё раскрыто */
  .меню-список li { grid-template-columns: 40px 1fr; padding: 24px 0; align-items: start; }
  .меню-список .н { padding-top: 10px; }
  .меню-список li b { grid-column: 2; text-align: left; }
  .меню-список h3 { color: var(--крем); transform: none !important; }
  .меню-список p { max-height: none; opacity: 1; }
  .меню-список b { color: var(--медь2); }
  .меню-фото-моб { display: block; grid-column: 1 / -1; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 14px; margin-top: 6px; }
  .доводы { grid-template-columns: 1fr; }
  .доводы div, .доводы div + div { padding: 22px 0; border-left: 0; border-bottom: 1px solid rgba(244,236,221,.16); }
  .кухня-действия .кнопка { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) { .зерно, .точка { animation: none; } .шаг.активен { animation: none; } }

/* ссылка из карточки сезона на отдельную страницу */
.сезон-ссылка { display: inline-block; margin-top: 14px; color: var(--медь2); font-size: 15.5px; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.сезон-ссылка:hover { color: var(--крем); }

/* кнопка в шапке не переносится, даже когда пунктов меню много */
.шапка .кнопка { white-space: nowrap; }
@media (max-width: 1400px) { .шапка nav a { padding-left: 12px; padding-right: 12px; } }

/* территория летом — ровная сетка 3×2 */
.лето-галерея { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: clamp(30px, 4vw, 60px); }
.лето-галерея .кадр { aspect-ratio: 4 / 3; }
@media (max-width: 760px) { .лето-галерея { grid-template-columns: 1fr 1fr; } }

/* ---------- как добраться ---------- */
.дорога-секция { background: var(--бумага2); }
.дорога { display: grid; grid-template-columns: .8fr 1.4fr; gap: clamp(30px, 5vw, 90px); margin-top: clamp(40px, 5vw, 70px); align-items: start; }
.дорога-время b { display: flex; align-items: baseline; gap: 10px; font-weight: 200; font-size: clamp(110px, 13vw, 220px); line-height: .85; letter-spacing: -.07em; color: var(--медь); }
.дорога-время small { font-size: .22em; letter-spacing: 0; font-weight: 400; }
.дорога-время span { display: block; margin-top: 20px; max-width: 30ch; color: var(--тушь2); font-size: 17px; }
.дорога-шаги { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(27,37,32,.2); }
.дорога-шаги li { padding: 18px 0; border-bottom: 1px solid rgba(27,37,32,.12); color: var(--тушь2); font-size: 16.5px; line-height: 1.55; }
.дорога-шаги b { display: block; color: var(--тушь); font-weight: 500; font-size: 19px; margin-bottom: 4px; }
.дорога-кнопки { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 12px; }
.кнопка-контур { display: inline-flex; align-items: center; padding: 15px 26px; border-radius: 100px; border: 1px solid var(--тушь); font-size: 15px; font-weight: 500; transition: background .3s, color .3s; }
.кнопка-контур:hover { background: var(--тушь); color: var(--бумага); }
/* метка дороги в первом экране */
.метка-дороги { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px; padding: 8px 16px 8px 10px; border-radius: 100px;
  background: var(--медь); color: #fff; font-size: 16px; font-weight: 500; }
.метка-дороги i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.22); font-style: normal; font-size: 13px; }
@media (max-width: 860px) {
  .дорога { grid-template-columns: minmax(0, 1fr); }
  .дорога-кнопки a { width: 100%; justify-content: center; }
}
.метка-дороги { align-self: flex-start; width: auto; }

/* ---------- бенто: технические возможности ---------- */
.бенто { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(170px, auto); gap: 12px; margin-top: clamp(40px, 5vw, 70px); }
.бенто-карта { position: relative; padding: 24px; border-radius: 20px; background: #fff; border: 1px solid rgba(27,37,32,.08); display: flex; flex-direction: column; justify-content: space-between; gap: 10px; overflow: hidden; }
.бенто-карта b { font-weight: 300; font-size: clamp(32px, 2.8vw, 48px); letter-spacing: -.05em; line-height: 1; }
.бенто-карта p { margin: 0; color: var(--тушь2); font-size: 15px; line-height: 1.45; }
.бенто-метка { font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--медь); }
.бенто-карта.большая { grid-column: span 2; grid-row: span 2; }
.бенто-карта.тёмная { background: radial-gradient(70% 80% at 100% 0%, rgba(47,120,104,.45), transparent 70%), var(--лес); color: var(--крем); border: 0; }
.бенто-карта.тёмная p { color: var(--крем2); }
.бенто-карта.тёмная .бенто-метка { color: var(--медь2); }
.бенто-ряд { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.бенто-ряд b { display: block; font-size: clamp(44px, 4.6vw, 84px); }
.бенто-ряд span { color: var(--крем2); font-size: 14px; }
.бенто-карта.акцент { background: var(--медь); color: #fff; border: 0; }
.бенто-карта.акцент p, .бенто-карта.акцент .бенто-метка { color: rgba(255,255,255,.88); }
.бенто-карта.фото { grid-column: span 2; padding: 0; justify-content: flex-end; color: #fff; }
.бенто-карта.фото img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.бенто-карта.фото::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,14,12,.75), transparent 60%); }
.бенто-карта.фото div { position: relative; z-index: 1; padding: 22px 24px; }
.бенто-карта.фото p { color: #fff; font-size: 17px; }
.бенто-карта.фото .бенто-метка { color: #F6DDA9; }
@media (max-width: 1000px) { .бенто { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .бенто { grid-template-columns: minmax(0, 1fr); } .бенто-карта.большая, .бенто-карта.фото { grid-column: auto; grid-row: auto; } .бенто-карта.фото { min-height: 220px; } }

/* ---------- доверие: бегущая строка клиентов ---------- */
.доверие { padding: clamp(50px, 6vw, 80px) 0; border-top: 1px solid rgba(27,37,32,.1); border-bottom: 1px solid rgba(27,37,32,.1); overflow: hidden; }
.доверие-лента { margin-top: 22px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.доверие-трек { display: flex; width: max-content; animation: доверие 45s linear infinite; }
.доверие-трек span { padding: 0 clamp(26px, 3vw, 48px); font-size: clamp(22px, 2.2vw, 34px); font-weight: 500; letter-spacing: -.03em; color: var(--тушь3); white-space: nowrap; }
.доверие:hover .доверие-трек { animation-play-state: paused; }
@keyframes доверие { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .доверие-трек { animation: none; flex-wrap: wrap; width: auto; } }

/* ---------- процесс ---------- */
.процесс { list-style: none; margin: clamp(40px, 5vw, 70px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.процесс li { padding: 26px 22px; border-radius: 20px; background: var(--бумага2); position: relative; }
.процесс li span { display: block; font-weight: 200; font-size: 44px; letter-spacing: -.05em; color: var(--медь); line-height: 1; }
.процесс li b { display: block; margin: 18px 0 8px; font-weight: 500; font-size: 20px; }
.процесс li p { margin: 0; color: var(--тушь2); font-size: 15px; line-height: 1.5; }
@media (max-width: 1000px) { .процесс { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .процесс { grid-template-columns: minmax(0, 1fr); } }

#возможности h2, #процесс h2, #дорога h2 { font-size: clamp(40px, 5.2vw, 96px); }
#возможности h2 em, #процесс h2 em, #дорога h2 em { color: var(--медь); }
@media (max-width: 760px) { #возможности h2, #процесс h2, #дорога h2 { font-size: 36px; } }

/* ---------- иконки ---------- */
.ик { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- территория: карточки с иконками ---------- */
.пункты { counter-reset: none !important; display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 12px !important; }
.пункты li { position: relative; padding: 26px 22px 24px !important; border: 0 !important; border-radius: 20px; background: #fff; box-shadow: 0 1px 0 rgba(27,37,32,.06);
  transition: transform .5s var(--плавно), box-shadow .5s; }
.пункты li:hover { transform: translateY(-4px); box-shadow: 0 24px 40px -28px rgba(27,37,32,.45); }
.пункты li::before { display: none !important; }
.пункты li .ик-круг { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: rgba(168,100,63,.1); color: var(--медь); margin-bottom: 22px; }
.пункты li b { font-size: 18.5px !important; }
@media (max-width: 1100px) { .пункты { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 560px) { .пункты { grid-template-columns: minmax(0, 1fr) !important; } }

/* ---------- аренда: карточки-тарифы с фото ---------- */
.тарифы2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: clamp(40px, 5vw, 70px); }
.тариф2 { position: relative; display: grid; grid-template-rows: 220px auto; border-radius: 24px; overflow: hidden; background: #fff; }
.тариф2.тёмный { background: var(--лес); color: var(--крем); }
.тариф2 figure { margin: 0; position: relative; overflow: hidden; }
.тариф2 figure img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--плавно); }
.тариф2:hover figure img { transform: scale(1.05); }
.тариф2 .значок { position: absolute; left: 18px; top: 18px; padding: 7px 14px; border-radius: 100px; background: rgba(255,255,255,.9); color: var(--тушь); font-size: 12.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.тариф2-тело { padding: 28px 30px 30px; display: flex; flex-direction: column; gap: 16px; }
.тариф2 h3 { font-size: clamp(24px, 2vw, 32px); letter-spacing: -.03em; }
.тариф2-цена { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.тариф2-цена b { font-weight: 300; font-size: clamp(46px, 4.4vw, 76px); letter-spacing: -.055em; line-height: 1; }
.тариф2-цена span { color: var(--тушь3); font-size: 15px; }
.тариф2.тёмный .тариф2-цена span { color: var(--крем2); }
.тариф2-чипы { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.тариф2-чипы li { padding: 7px 13px; border-radius: 100px; background: var(--бумага2); font-size: 14px; }
.тариф2.тёмный .тариф2-чипы li { background: rgba(244,236,221,.1); }
.тариф2 .кнопка { align-self: flex-start; margin-top: 6px; }
@media (max-width: 860px) { .тарифы2 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- дорога: тёмная карточка, схема, шаги-карточки ---------- */
.дорога2 { display: grid; grid-template-columns: 1fr 1.2fr; grid-template-rows: auto auto; gap: 16px; margin-top: clamp(40px, 5vw, 70px); }
.дорога2-главная { grid-row: span 2; padding: clamp(28px, 3vw, 44px); border-radius: 24px; color: var(--крем); display: flex; flex-direction: column; gap: 22px;
  background: radial-gradient(70% 70% at 100% 0%, rgba(168,100,63,.55), transparent 70%), radial-gradient(60% 60% at 0% 100%, rgba(47,120,104,.45), transparent 70%), var(--лес); }
.дорога2-главная .бенто-метка { color: #F6DDA9; }
.дорога2-время { display: flex; align-items: flex-end; gap: 16px; }
.дорога2-время b { font-weight: 200; font-size: clamp(130px, 14vw, 230px); line-height: .8; letter-spacing: -.08em; }
.дорога2-время span { font-size: clamp(20px, 1.8vw, 28px); line-height: 1.1; padding-bottom: 10px; color: var(--крем2); }
.дорога2-главная p { margin: 0; color: var(--крем2); font-size: 17px; max-width: 34ch; }
.дорога2-кнопки { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; }
.кнопка-контур.светлый { border-color: rgba(244,236,221,.5); color: var(--крем); }
.кнопка-контур.светлый:hover { background: var(--крем); color: var(--лес); }
.дорога2-карта { position: relative; border-radius: 24px; overflow: hidden; min-height: 260px; }
.дорога2-карта img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.дорога2-карта span { position: absolute; left: 16px; bottom: 16px; padding: 9px 16px; border-radius: 100px; background: rgba(255,255,255,.92); font-size: 14.5px; font-weight: 500; }
.дорога2-шаги { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.дорога2-шаг { padding: 22px; border-radius: 20px; background: #fff; }
.дорога2-шаг .ик { color: var(--медь); width: 30px; height: 30px; }
.дорога2-шаг b { display: block; margin: 14px 0 6px; font-weight: 500; font-size: 18px; }
.дорога2-шаг p { margin: 0; color: var(--тушь2); font-size: 15px; line-height: 1.5; }
@media (max-width: 960px) { .дорога2 { grid-template-columns: minmax(0, 1fr); } .дорога2-главная { grid-row: auto; } }
@media (max-width: 560px) { .дорога2-шаги { grid-template-columns: minmax(0, 1fr); } .дорога2-кнопки a { width: 100%; justify-content: center; } }

/* ---------- доверие: тёмная полоса, две ленты навстречу ---------- */
.доверие2 { padding: clamp(80px, 9vw, 140px) 0; color: var(--крем); overflow: hidden;
  background: radial-gradient(55% 70% at 100% 0%, rgba(47,120,104,.35), transparent 70%), var(--лес); }
.доверие2-верх { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(30px, 5vw, 90px); align-items: end; }
.доверие2-заголовок { margin-top: 20px; font-size: clamp(32px, 3.6vw, 60px); letter-spacing: -.04em; max-width: 16ch; }
.доверие2-верх p { margin: 0; color: var(--крем2); font-size: 17px; max-width: 44ch; }
.доверие2-ленты { margin-top: clamp(50px, 6vw, 80px); display: grid; gap: 14px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.доверие2-трек { display: flex; gap: 14px; width: max-content; animation: доверие2 60s linear infinite; }
.доверие2-трек.обратно { animation-direction: reverse; animation-duration: 70s; }
.доверие2-трек span { padding: 18px 32px; border-radius: 100px; border: 1px solid rgba(244,236,221,.18); background: rgba(244,236,221,.04);
  font-size: clamp(17px, 1.4vw, 22px); font-weight: 500; letter-spacing: -.02em; white-space: nowrap; color: var(--крем); }
.доверие2-ленты:hover .доверие2-трек { animation-play-state: paused; }
@keyframes доверие2 { to { transform: translateX(-33.333%); } }
@media (max-width: 860px) { .доверие2-верх { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .доверие2-трек { animation: none; flex-wrap: wrap; width: auto; } }

/* ---------- процесс: таймлайн с линией ---------- */
.процесс2 { list-style: none; margin: clamp(50px, 6vw, 90px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; position: relative; }
.процесс2::before { content: ''; position: absolute; left: 28px; right: 10%; top: 28px; height: 2px;
  background: linear-gradient(90deg, var(--медь) 0%, var(--медь2) 70%, rgba(168,100,63,.15)); }
.процесс2 li { position: relative; padding: 0 22px 0 0; }
.процесс2-н { position: relative; z-index: 1; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%;
  background: var(--бумага); border: 2px solid var(--медь); color: var(--медь); font-size: 22px; font-weight: 500; margin-bottom: 26px; }
.процесс2 b { display: block; font-weight: 500; font-size: clamp(20px, 1.7vw, 26px); letter-spacing: -.025em; margin-bottom: 10px; }
.процесс2 p { margin: 0; color: var(--тушь2); font-size: 15.5px; line-height: 1.55; max-width: 26ch; }
.процесс2 li.финал { margin-top: -22px; padding: 22px 24px 26px; border-radius: 24px; background: var(--лес); color: var(--крем); }
.процесс2 li.финал .процесс2-н { background: var(--медь); color: #fff; border-color: var(--медь); }
.процесс2 li.финал p { color: var(--крем2); }
.процесс2 li.финал .кнопка { margin-top: 20px; padding: 12px 20px !important; font-size: 14px; }
@media (max-width: 1000px) {
  .процесс2 { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .процесс2::before { left: 28px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; background: linear-gradient(180deg, var(--медь), rgba(168,100,63,.15)); }
  .процесс2 li { display: grid; grid-template-columns: 58px 1fr; column-gap: 20px; padding: 0; }
  .процесс2-н { grid-row: span 3; margin: 0; }
  .процесс2 li.финал { margin-top: 0; padding: 20px; }
  .процесс2 li.финал .кнопка { grid-column: 2; justify-self: start; }
}

/* ---------- бенто: ровная сетка 4×4 без пустот, мягче карточки ---------- */
.бенто { grid-auto-rows: minmax(168px, auto) !important; }
.бенто-карта.фото { grid-row: span 2; }
.бенто-карта { border: 0 !important; box-shadow: 0 1px 2px rgba(27,37,32,.05); transition: transform .5s var(--плавно), box-shadow .5s; }
.бенто-карта:not(.большая):not(.фото):hover { transform: translateY(-4px); box-shadow: 0 24px 40px -28px rgba(27,37,32,.45); }
.бенто-карта:not(.большая):not(.акцент):not(.фото)::after { content: ''; position: absolute; right: 20px; top: 22px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--медь); opacity: .35; }
.бенто-карта.большая { justify-content: space-between; }
.бенто-ряд b { font-size: clamp(48px, 5vw, 92px) !important; }
@media (max-width: 1000px) { .бенто-карта.фото { grid-row: span 2; } }
@media (max-width: 560px) { .бенто-карта.фото { grid-row: auto; } }

/* ---------- доверие: ярко, с живым градиентом ---------- */
.доверие2 { position: relative; isolation: isolate;
  background: linear-gradient(120deg, #0E2F2B 0%, #1C6458 38%, #2F8A76 55%, #B4703F 82%, #E3B46A 100%) !important;
  background-size: 140% 140% !important; animation: доверие-фон 18s ease-in-out infinite alternate; }
.доверие2::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(40% 60% at 15% 20%, rgba(111,191,184,.45), transparent 70%),
              radial-gradient(35% 55% at 85% 80%, rgba(246,221,169,.55), transparent 70%),
              radial-gradient(30% 40% at 60% 10%, rgba(255,255,255,.12), transparent 70%); }
@keyframes доверие-фон { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
.доверие2 .мелко { color: #F6DDA9 !important; }
.доверие2-заголовок { color: #fff; }
.доверие2-заголовок em { font-style: normal; background: linear-gradient(90deg, #F6DDA9, #FFF3D6 45%, #E3B46A); -webkit-background-clip: text; background-clip: text; color: transparent; }
.доверие2-верх p { color: rgba(255,255,255,.88) !important; }
.доверие2-трек span { background: rgba(255,255,255,.14) !important; border-color: rgba(255,255,255,.32) !important; color: #fff !important;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 10px 30px -18px rgba(0,0,0,.5); }
.доверие2-трек span:nth-child(3n+1) { background: #FFF6E6 !important; color: #1B2520 !important; border-color: #FFF6E6 !important; }
.доверие2-трек span:nth-child(3n+2)::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background: #F6DDA9; vertical-align: middle; }
@media (prefers-reduced-motion: reduce) { .доверие2 { animation: none; } }

/* шапка: логотип никогда не сжимается, меню ужимается само */
.шапка { grid-template-columns: auto minmax(0, 1fr) auto !important; column-gap: 20px; }
.шапка .лого { flex: none; display: block; }
.шапка .лого img { max-width: none !important; width: auto !important; height: 38px; }
.шапка nav { justify-self: center; max-width: 100%; overflow: hidden; }
.шапка nav a { white-space: nowrap; }
@media (max-width: 1440px) { .шапка nav a { padding-left: 10px !important; padding-right: 10px !important; font-size: 13.5px !important; } .шапка .тел { display: none; } }
@media (max-width: 1060px) { .шапка { grid-template-columns: auto auto !important; justify-content: space-between; } }

/* ---------- пруд: журнальная раскладка ---------- */
.пруд { display: grid; grid-template-columns: .9fr 1.1fr; grid-template-areas: "высокое текст" "высокое широкое" "малое1 малое2"; gap: 16px clamp(20px, 3vw, 40px); }
.пруд-высокое { grid-area: высокое; margin: 0; border-radius: 24px; min-height: 100%; }
.пруд-высокое img { height: 100%; }
.пруд-текст { grid-area: текст; padding-bottom: 20px; }
.пруд-текст h2 { font-size: clamp(40px, 4.8vw, 88px); }
.пруд-текст h2 em { color: var(--медь); }
.пруд-лид { margin: 22px 0 0; color: var(--тушь2); font-size: clamp(17px, 1.3vw, 19px); max-width: 48ch; }
.пруд-факты { list-style: none; padding: 0; margin: 28px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.пруд-факты li { padding: 16px 18px; border-radius: 16px; background: #fff; color: var(--тушь2); font-size: 14.5px; line-height: 1.45; }
.пруд-факты b { display: block; color: var(--тушь); font-weight: 500; font-size: 17px; margin-bottom: 4px; }
.пруд-широкое { grid-area: широкое; margin: 0; aspect-ratio: 16 / 8; border-radius: 24px; }
.пруд-малое { margin: 0; aspect-ratio: 16 / 10; border-radius: 24px; }
.пруд-малое:nth-of-type(3) { grid-area: малое1; } .пруд-малое:nth-of-type(4) { grid-area: малое2; }
.пруд figcaption { position: absolute; left: 16px; bottom: 14px; color: #fff; font-size: 14px; text-shadow: 0 1px 12px rgba(0,0,0,.5); }
@media (max-width: 900px) {
  .пруд { grid-template-columns: minmax(0, 1fr); grid-template-areas: "текст" "высокое" "широкое" "малое1" "малое2"; }
  .пруд-высокое { aspect-ratio: 4 / 5; min-height: 0; }
  .пруд-факты { grid-template-columns: 1fr; }
}

/* ---------- промо зимней страницы ---------- */
.промо-нг { padding: clamp(60px, 7vw, 100px) 0; }
.промо-нг-карта { position: relative; display: grid; min-height: clamp(380px, 46vw, 560px); border-radius: 28px; overflow: hidden; isolation: isolate; color: #fff; }
.промо-нг-карта > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; z-index: -2; transition: transform 1.4s var(--плавно); }
.промо-нг-карта:hover > img { transform: scale(1.04); }
.промо-нг-карта::after { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(10,20,26,.88) 0%, rgba(10,20,26,.55) 45%, rgba(10,20,26,.05) 80%), linear-gradient(0deg, rgba(10,20,26,.5), transparent 40%); }
.промо-снег { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.промо-нг-текст { position: relative; z-index: 1; align-self: center; padding: clamp(28px, 5vw, 70px); max-width: 640px; }
.промо-метка { display: inline-block; padding: 8px 16px; border-radius: 100px; background: rgba(246,221,169,.18); border: 1px solid rgba(246,221,169,.5); color: #F6DDA9;
  font-size: 13px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
.промо-нг h2 { margin: 22px 0 16px; font-size: clamp(36px, 4.4vw, 76px); line-height: 1; letter-spacing: -.045em; color: #fff; }
.промо-нг h2 em { font-style: normal; background: linear-gradient(90deg, #F6DDA9, #FFF3D6 50%, #E3B46A); -webkit-background-clip: text; background-clip: text; color: transparent; }
.промо-нг p { margin: 0 0 28px; color: rgba(255,255,255,.88); font-size: clamp(16px, 1.3vw, 19px); max-width: 44ch; }
@media (max-width: 760px) { .промо-нг-карта::after { background: linear-gradient(0deg, rgba(10,20,26,.92) 30%, rgba(10,20,26,.3)); } .промо-нг-текст { align-self: end; } .промо-нг .кнопка { width: 100%; justify-content: center; } }

/* SEO-подзаголовок к H1 и перелинковка в подвале */
.h1-ключ { margin: 14px 0 0; font-size: clamp(18px, 1.6vw, 24px); font-weight: 500; color: #F6DDA9; letter-spacing: -.01em; }
.подвал-ссылки { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 34px 0 0; }
.подвал-ссылки a { color: var(--крем2); font-size: 15px; border-bottom: 1px solid rgba(244,236,221,.25); padding-bottom: 2px; transition: color .3s; }
.подвал-ссылки a:hover { color: var(--крем); }

/* ---------- компактнее: меньше воздуха между блоками ---------- */
.секция { padding: clamp(44px, 4.5vw, 72px) 0 !important; }
.сезоны, .кухня-секция, .контакты, .доверие2 { padding-top: clamp(52px, 5.5vw, 88px) !important; padding-bottom: clamp(52px, 5.5vw, 88px) !important; }
.контакты { padding-bottom: 0 !important; }
.пространства-верх { padding-top: clamp(64px, 7vw, 110px) !important; }
.дорожка { padding-top: clamp(36px, 4vw, 60px) !important; padding-bottom: clamp(56px, 6vw, 96px) !important; gap: clamp(56px, 6vw, 100px) !important; }
.промо-нг { padding: clamp(40px, 4vw, 64px) 0 !important; }
.подвал { padding-top: clamp(64px, 7vw, 110px) !important; }
.магнит-обёртка { padding-bottom: clamp(56px, 6vw, 96px) !important; }
.цифры { margin-top: clamp(48px, 5vw, 80px) !important; }
.мозаика, .спеки, .четыре, .сезоны-сетка, .бенто, .форматы-пав, .пав-галерея, .пав-цена, .пав-факты, .тарифы2, .дорога2, .процесс2, .зоны, .боли, .нг-залы, .главное, .расчёт { margin-top: clamp(32px, 3.5vw, 56px) !important; }
@media (max-width: 760px) { .секция { padding: 52px 0 !important; } }

/* ещё компактнее: ровный ритм на всех страницах */
.секция { padding: clamp(40px, 3.8vw, 60px) 0 !important; }
.сезоны, .кухня-секция, .контакты, .доверие2, .пространства { padding-top: clamp(44px, 4.2vw, 68px) !important; padding-bottom: clamp(44px, 4.2vw, 68px) !important; }
.контакты { padding-bottom: 0 !important; }
.пространства { padding-top: 0 !important; }
.пространства-верх { padding-top: clamp(44px, 4.2vw, 68px) !important; }
.дорожка { padding-bottom: clamp(44px, 4.2vw, 68px) !important; }
.доверие2-ленты { margin-top: clamp(28px, 3vw, 44px) !important; }
.промо-нг { padding: clamp(32px, 3vw, 48px) 0 !important; }
.магнит-обёртка { padding-bottom: clamp(40px, 3.8vw, 60px) !important; }
.подвал { padding-top: clamp(48px, 5vw, 80px) !important; }
.сео-текст { margin-bottom: clamp(40px, 5vw, 72px) !important; }
@media (max-width: 760px) { .секция { padding: 40px 0 !important; } }

/* сео-текст: подзаголовки и абзацы */
.сео-текст h3 { margin: 26px 0 10px; font-weight: 500; font-size: clamp(18px, 1.4vw, 22px); letter-spacing: -.02em; color: var(--крем); }
.сео-текст p + p { margin-top: 12px; }

.сео-текст h2 { font-size: clamp(24px, 2.2vw, 34px) !important; line-height: 1.15 !important; max-width: none !important; margin: 0 0 18px !important; }
.сео-текст h2 em { color: inherit; }

/* ---------- перелинковка «Смотрите также» ---------- */
.пл-сетка { margin-top: clamp(32px, 3.5vw, 56px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.пл-карта { position: relative; display: flex; flex-direction: column; border-radius: 22px; overflow: hidden; background: #fff; color: var(--тушь); text-decoration: none;
  transition: transform .5s var(--плавно), box-shadow .5s; }
.пл-карта:hover { transform: translateY(-4px); box-shadow: 0 26px 44px -30px rgba(27,37,32,.5); }
.пл-карта figure { margin: 0; aspect-ratio: 16 / 10; overflow: hidden; }
.пл-карта img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--плавно); }
.пл-карта:hover img { transform: scale(1.05); }
.пл-карта > div { position: relative; flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 20px 22px 24px; }
.пл-карта b { font-weight: 500; font-size: clamp(18px, 1.4vw, 21px); letter-spacing: -.02em; line-height: 1.2; padding-right: 34px; }
.пл-карта p { margin: 0; color: var(--тушь2); font-size: 14.5px; line-height: 1.45; }
.пл-стрелка { position: absolute; right: 18px; top: 18px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--медь); color: #fff; font-size: 15px; transition: transform .4s var(--плавно); }
.пл-карта:hover .пл-стрелка { transform: translateX(4px); }
@media (max-width: 1000px) { .пл-сетка { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .пл-сетка { grid-template-columns: minmax(0, 1fr); } .пл-карта { flex-direction: row; } .пл-карта figure { flex: 0 0 38%; aspect-ratio: auto; } .пл-карта > div { padding: 16px; } .пл-карта p { font-size: 13.5px; } .пл-стрелка { display: none; } .пл-карта b { padding-right: 0; } }
.сео-текст a { color: inherit; text-decoration: underline; text-decoration-color: var(--медь2); text-underline-offset: 3px; }
.сео-текст a:hover { color: var(--медь2); }

/* плавная прокрутка без Lenis (страницы без GSAP, режим «меньше движения» — мягкий нативный скролл по якорям) */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ================= формы обратной связи (grani-formy.js) ================= */
html.гф-открыто { overflow: hidden; }
.гф-окно { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; }
.гф-фон { position: absolute; inset: 0; background: rgba(8,13,10,.62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .3s; }
.гф-карта { position: relative; width: min(920px, 100%); max-height: calc(100svh - 32px); overflow: auto; display: grid; grid-template-columns: .85fr 1.15fr; border-radius: 28px; background: var(--лес); color: var(--крем);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); opacity: 0; transform: translateY(24px) scale(.98); transition: opacity .35s, transform .45s cubic-bezier(.2,.8,.2,1); }
.гф-окно.видно .гф-фон { opacity: 1; } .гф-окно.видно .гф-карта { opacity: 1; transform: none; }
.гф-фото { position: relative; min-height: 100%; }
.гф-фото img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.гф-фото::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,13,10,.7), transparent 55%); }
.гф-фото span { position: absolute; z-index: 1; left: 22px; bottom: 20px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #F6DDA9; line-height: 1.6; }
.гф-закрыть { position: absolute; z-index: 2; right: 14px; top: 12px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(244,236,221,.25); background: rgba(8,13,10,.3); color: var(--крем); font-size: 24px; line-height: 1; cursor: pointer; }
.гф-форма { padding: clamp(24px, 3.4vw, 44px); display: flex; flex-direction: column; gap: 14px; }
.гф-цели { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 100px; background: rgba(244,236,221,.08); align-self: flex-start; margin-right: 40px; }
.гф-цели button { padding: 9px 16px; border: 0; border-radius: 100px; background: transparent; color: var(--крем2); font: 500 14px/1 Manrope, sans-serif; cursor: pointer; }
.гф-цели button[aria-selected="true"] { background: var(--крем); color: var(--лес); }
.гф-форма h2 { margin: 8px 0 0; font-weight: 400; font-size: clamp(28px, 3vw, 42px); line-height: 1.05; letter-spacing: -.04em; }
.гф-форма h2 em, .гф-полоса h2 em, .гф-вопрос h3 em { font-style: normal; color: var(--медь2); }
.гф-текст { margin: 0; color: var(--крем2); font-size: 15.5px; line-height: 1.5; }
.гф-поля { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.гф-поля input:not([hidden]):last-of-type:nth-of-type(odd) { grid-column: span 2; }
.гф-поля-3 { grid-template-columns: 1fr .6fr 1.4fr; }
.гф-поля-3 input { grid-column: auto !important; }
.гф-окно input, .гф-полоса input, .гф-вопрос input, .гф-вопрос textarea { width: 100%; min-width: 0; height: 52px; padding: 0 16px; border-radius: 14px; border: 1px solid rgba(244,236,221,.2);
  background: rgba(244,236,221,.06); color: var(--крем); font: 400 16px Manrope, sans-serif; outline: none; transition: border-color .2s, background .2s; }
.гф-окно input:focus, .гф-полоса input:focus { border-color: #F6DDA9; background: rgba(244,236,221,.1); }
.гф-окно input::placeholder, .гф-полоса input::placeholder { color: rgba(244,236,221,.55); }
.гф-окно input[type=date], .гф-полоса input[type=date] { color-scheme: dark; }
.гф-чипы { display: flex; flex-wrap: wrap; gap: 6px; }
.гф-чипы label { cursor: pointer; }
.гф-чипы input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.гф-чипы span { display: inline-block; padding: 8px 14px; border-radius: 100px; border: 1px solid rgba(244,236,221,.22); font-size: 14px; color: var(--крем2); transition: .2s; }
.гф-чипы input:checked + span { background: #F6DDA9; border-color: #F6DDA9; color: var(--лес); }
.гф-чипы input:focus-visible + span { outline: 2px solid #F6DDA9; outline-offset: 2px; }
.гф-согласие { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; line-height: 1.4; color: var(--крем2); }
.гф-согласие input { width: 16px !important; height: 16px !important; margin: 1px 0 0; padding: 0 !important; flex: none; accent-color: #F6DDA9; }
.гф-согласие a { color: inherit; }
.гф-форма .кнопка, .гф-встроенная .кнопка { align-self: flex-start; }
.гф-итог { margin: 0; color: #F6DDA9; font-size: 15px; }

/* плавающая кнопка */
.гф-плав { position: fixed; z-index: 80; right: 20px; bottom: 20px; display: inline-flex; align-items: center; gap: 10px; padding: 8px 20px 8px 8px; border: 0; border-radius: 100px;
  background: var(--лес); color: var(--крем); font: 500 14.5px Manrope, sans-serif; cursor: pointer; box-shadow: 0 18px 40px -16px rgba(0,0,0,.55);
  opacity: 0; transform: translateY(20px); pointer-events: none; transition: opacity .4s, transform .4s cubic-bezier(.2,.8,.2,1); }
.гф-плав.видно { opacity: 1; transform: none; pointer-events: auto; }
.гф-плав i { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #F6DDA9; }
.гф-плав i::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #F6DDA9; animation: гф-пульс 2s ease-out infinite; }
@keyframes гф-пульс { from { transform: scale(1); opacity: .8; } to { transform: scale(1.6); opacity: 0; } }
.гф-плав svg { width: 18px; height: 18px; fill: var(--лес); }
.гф-плав:hover { background: #22302A; }

/* полоса «подборка» */
.гф-полоса { padding: clamp(44px, 4.6vw, 72px) 0; color: var(--крем);
  background: radial-gradient(50% 80% at 100% 0%, rgba(168,100,63,.45), transparent 70%), radial-gradient(40% 70% at 0% 100%, rgba(47,120,104,.45), transparent 70%), var(--лес); }
.гф-полоса-сетка { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 70px); align-items: center; }
.гф-полоса h2 { margin: 14px 0 0; font-weight: 400; font-size: clamp(30px, 3.2vw, 52px); line-height: 1.04; letter-spacing: -.045em; }
.гф-полоса p { margin: 16px 0 0; color: var(--крем2); font-size: 16px; line-height: 1.55; max-width: 44ch; }
.гф-встроенная { display: flex; flex-direction: column; gap: 12px; }
.гф-встроенная .гф-итог { margin: 0; }

/* вопрос менеджеру */
.гф-вопрос { display: grid; grid-template-columns: 260px 1fr; gap: clamp(20px, 3vw, 44px); align-items: center; padding: clamp(22px, 3vw, 36px); border-radius: 26px; background: #fff; }
.гф-вопрос-кто { display: flex; gap: 14px; align-items: center; }
.гф-аватар { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: linear-gradient(140deg, #E9B872, var(--медь)); color: #fff; font-weight: 500; flex: none; position: relative; }
.гф-аватар::after { content: ''; position: absolute; right: 2px; bottom: 2px; width: 12px; height: 12px; border-radius: 50%; background: #3BB273; border: 2px solid #fff; }
.гф-вопрос-кто b { display: block; font-weight: 500; font-size: 17px; }
.гф-вопрос-кто span { display: block; color: var(--тушь2); font-size: 14px; }
.гф-вопрос h3 { margin: 0 0 12px; font-weight: 400; font-size: clamp(22px, 2vw, 30px); letter-spacing: -.035em; }
.гф-вопрос h3 em { color: var(--медь); }
.гф-вопрос textarea, .гф-вопрос input { border-color: rgba(27,37,32,.14); background: var(--бумага); color: var(--тушь); }
.гф-вопрос textarea { height: auto; min-height: 64px; padding: 14px 16px; resize: vertical; line-height: 1.45; }
.гф-вопрос textarea:focus, .гф-вопрос input:focus { border-color: var(--медь); }
.гф-ряд { display: grid; grid-template-columns: .8fr 1.2fr auto; gap: 8px; }
.гф-вопрос .гф-согласие { color: var(--тушь2); }
.гф-вопрос .гф-согласие input { accent-color: var(--медь); }
.гф-вопрос .гф-итог { color: var(--медь); }

@media (max-width: 900px) {
  .гф-карта { grid-template-columns: minmax(0, 1fr); }
  .гф-фото { display: none; }
  .гф-полоса-сетка, .гф-вопрос { grid-template-columns: minmax(0, 1fr); }
  .гф-ряд { grid-template-columns: 1fr 1fr; } .гф-ряд .кнопка { grid-column: span 2; justify-content: center; }
}
@media (max-width: 760px) {
  .гф-плав { right: 12px; bottom: 74px; padding: 6px; } .гф-плав span { display: none; }
  .гф-поля, .гф-поля-3 { grid-template-columns: minmax(0, 1fr); } .гф-поля input { grid-column: auto !important; }
  .гф-ряд { grid-template-columns: minmax(0, 1fr); } .гф-ряд .кнопка { grid-column: auto; }
  .гф-форма .кнопка, .гф-встроенная .кнопка { align-self: stretch; justify-content: center; }
  .гф-окно { padding: 0; align-items: end; } .гф-карта { border-radius: 24px 24px 0 0; max-height: 92svh; }
}
@media (prefers-reduced-motion: reduce) { .гф-плав i::after { animation: none; } .гф-карта, .гф-фон, .гф-плав { transition: none; } }
html.lenis, html.lenis body { scroll-behavior: auto !important; }
@media (max-width: 760px) { .гф-цели { margin-right: 44px; flex-wrap: nowrap; } .гф-цели button { padding: 9px 11px; font-size: 13px; } }
@media (max-width: 760px) { .гф-форма { padding-top: 64px; } .гф-цели { margin-right: 0; align-self: stretch; justify-content: space-between; } .гф-цели button { flex: 1; } }

/* первый экран страниц павильонов: виден сразу, лёгкое всплытие без прозрачности — не задерживает LCP */
@keyframes герой-вход { from { transform: translateY(22px); } to { transform: none; } }
.нг-герой .полотно > *, .нг-герой .полотно > div > * { animation: герой-вход 1s cubic-bezier(.2,.8,.2,1) both; }
.нг-герой .полотно > *:nth-child(2), .нг-герой .полотно > div > *:nth-child(2) { animation-delay: .06s; }
.нг-герой .полотно > *:nth-child(3), .нг-герой .полотно > div > *:nth-child(3) { animation-delay: .12s; }
.нг-герой .полотно > *:nth-child(n+4), .нг-герой .полотно > div > *:nth-child(n+4) { animation-delay: .18s; }
@media (prefers-reduced-motion: reduce) { .нг-герой .полотно > *, .нг-герой .полотно > div > * { animation: none; } }

/* доступность: контраст мелкого текста не ниже 4,5:1 (WCAG AA) */
:root { --тушь3: #5C645D; }
.медь, .герой-метка { color: #8A4C18; }

/* окно заявки поверх «своего» курсора главной: внутри окна — обычный системный курсор */
html.гф-открыто .курсор, html.гф-открыто .кольцо { opacity: 0 !important; }
.гф-окно, .гф-окно * { cursor: auto !important; }
.гф-окно button, .гф-окно label, .гф-окно a, .гф-окно [data-закрыть], .гф-чипы span { cursor: pointer !important; }
.гф-окно input[type=text], .гф-окно input[type=number], .гф-окно textarea { cursor: text !important; }
.гф-цели button:hover:not([aria-selected="true"]) { background: rgba(244,236,221,.12); color: var(--крем); }
.гф-чипы label:hover span { border-color: rgba(246,221,169,.6); color: var(--крем); }

/* реквизиты оператора ПД и ссылки на документы (152-ФЗ) в подвале */
.подвал-юр { margin: 18px 0 0; padding-bottom: 96px; font-size: 12.5px; line-height: 1.6; color: var(--крем2); opacity: .85; }
.подвал-юр a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.подвал-юр.светлый { color: var(--тушь2); padding: 0 0 40px; margin: 0; }
@media (min-width: 761px) { .подвал-юр { padding-bottom: 28px; } }
