/* The Title Olive — лёгкий CSS, системные шрифты, ноль внешних зависимостей */
:root{
  /* ── ШКАЛЫ ФАБРИКИ (этап 2 фейслифта, 23.07.2026). Новые значения берём ТОЛЬКО отсюда.
     --fs-scale: 12 13 14 15 16 18 20 22 24 26 + clamp() для h1/h2
     --sp-scale: 4 8 12 16 20 24 32 48 (кратно 4)
     --r-scale: 8 14 999 ── */

  --olive:#5c6b35;--olive-d:#46521f;--sand:#f6f3ec;--ink:#22261c;--mut:#666e5b;
  --line:#e5e1d5;--acc:#c8a24b;--wa:#15873d;--r:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:var(--olive);text-decoration:none}
a:hover{color:var(--olive-d)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* header */
header{position:sticky;top:0;z-index:50;background:#fffffff2;backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:14px;min-height:60px}
.logo{font-weight:800;font-size:18px;color:var(--ink);letter-spacing:.02em;white-space:nowrap;flex:0 0 auto}
.logo em{color:var(--olive);font-style:normal}
/* меню в одну строку: при нехватке места прокручивается вбок, а не ломает шапку */
.nav nav{display:flex;gap:12px;font-size:14px;margin-left:auto;align-items:center;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;flex:1 1 auto;justify-content:flex-start}
/* когда меню влезает — прижато вправо auto-отступом ПЕРВОГО пункта; когда не влезает —
   auto схлопывается в 0 и лента скроллится от левого края, НЕ заезжая под логотип.
   (Старый justify-content:flex-end прятал начало меню под логотип без шанса доскроллить.) */
.nav nav > a:first-child{margin-left:auto}
/* промежуточные ширины: меню из 10 пунктов + сердечко + CTA не влезает при 14px —
   плавно сжимаем, чтобы до бургер-порога (900px) всё помещалось без обрезки EN */
@media(max-width:1320px){.nav nav{font-size:14px;gap:10px}}
@media(max-width:1160px){
  .nav nav{font-size:13px;gap:8px}
  .nav nav a{padding:12px 1px}
  .nav > .btn{padding:10px 13px;font-size:14px}
  .logo{font-size:17px}
  .nav{gap:10px}
}
.nav nav::-webkit-scrollbar{display:none}
.nav nav a{color:#444;padding:12px 2px;display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
.nav > .btn{flex:0 0 auto;white-space:nowrap}
/* узкие экраны: логотип и CTA компактнее, меню — горизонтальная лента */
@media(max-width:1100px){
  .nav nav{font-size:13px;gap:10px;justify-content:flex-start}
  .nav nav > a:first-child{margin-left:0}
  .nav > .btn{padding:10px 14px;font-size:14px}
  .logo{font-size:16px}
}
.nav nav a[aria-current]{color:var(--olive);font-weight:600}
/* доступность: удобные тач-таргеты (≥44px) в футере и подписях */
footer .cols a{display:inline-block;padding:6px 0;min-height:32px}
footer .fine a{padding:4px 0;display:inline-block}
.skip{position:absolute;left:-9999px;top:0;background:var(--olive);color:#fff;padding:10px 16px;border-radius:0 0 10px 0;z-index:100}
.skip:focus{left:0}
:where(a,button,input,select,summary):focus-visible{outline:3px solid var(--olive);outline-offset:2px;border-radius:4px}
.btn{display:inline-block;background:var(--olive);color:#fff!important;padding:12px 22px;border-radius:12px;font-weight:600;border:0;cursor:pointer;font-size:15px;position:relative;overflow:hidden}
.btn:hover{background:var(--olive-d)}
/* блик: световая полоса пробегает по кнопке раз в ~4 секунды */
.btn::before{content:"";position:absolute;top:0;left:-80%;width:45%;height:100%;
  background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.5) 50%,transparent 100%);
  transform:skewX(-25deg) translateX(0);animation:btnShine 4s ease-in-out infinite;pointer-events:none}
@keyframes btnShine{
  0%{transform:skewX(-25deg) translateX(0)}
  22%{transform:skewX(-25deg) translateX(540%)}
  100%{transform:skewX(-25deg) translateX(540%)}
}
@media (prefers-reduced-motion: reduce){.btn::before{animation:none}}
.btn-wa{background:var(--wa)}
.btn-wa:hover{background:#0f7a3d}
.btn-o{background:transparent;color:var(--olive)!important;border:1.5px solid var(--olive)}
.btn-o:hover{background:var(--sand)}
/* Telegram-синий — как в круглом виджете связи (contact-widget.js). */
.btn-tg{background:#1f7fac}
.btn-tg:hover{background:#2589b8}
/* Пара кнопок-мессенджеров вместо формы заявки: во всю ширину, стопкой. */
.lead-btns{display:grid;gap:10px;margin:14px 0 0}
.lead-btns .btn{text-align:center;padding:14px 18px;font-size:16px}
.nav .btn{padding:8px 16px;font-size:14px}

/* hero */
.hero{background:linear-gradient(160deg,#3d4726 0%,#5c6b35 55%,#7a8a48 100%);color:#fff;padding:56px 0 48px}
.hero h1{font-size:clamp(28px,4.5vw,44px);line-height:1.15;margin-bottom:14px}
.hero .sub{font-size:18px;color:#e9ecdc;max-width:640px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));gap:12px;margin-top:28px}
.fact{background:#ffffff14;border:1px solid #ffffff2b;border-radius:var(--r);padding:14px 16px}
.fact b{display:block;font-size:20px}
.fact span{font-size:13px;color:#dfe4cd}
.hero .cta{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}

/* answer-first */
.answer{background:var(--sand);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;margin:32px 0}
.answer p{font-weight:500}
/* Блок «ответ первым» — гибрид: ярлык «Кратко» + ведущая фраза (её выхватывает сниппет)
   + факты списком (читаемо человеку, цитируемо AI) + мелкая строка с датой/«подробнее».
   Плотность чисел сохраняется, стена текста уходит. Стандарт — см. design-usability-guide. */
/* Ярлык «Кратко» — инлайн-зачин в начале ведущей фразы (не отдельной строкой:
   пилюля + первые слова на одной строке, дальше текст переносится на всю ширину). */
.answer .lbl{display:inline-block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;
  color:var(--olive-d);background:#fff;border:1px solid var(--line);border-radius:999px;padding:2px 10px;
  margin-right:8px;vertical-align:2px}
.answer .lead{font-weight:600;font-size:16px;line-height:1.55;margin:0 0 12px}
.answer ul.facts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.answer ul.facts li{position:relative;padding-left:24px;font-weight:500;font-size:15px;line-height:1.45}
.answer ul.facts li::before{content:"✓";position:absolute;left:2px;top:0;color:var(--olive);font-weight:700}
.answer .upd{font-size:13px;color:var(--mut);margin-top:12px;font-weight:400}

/* sections */
section{padding:34px 0}
h2{font-size:clamp(22px,3vw,30px);margin-bottom:18px;line-height:1.25}
h3{font-size:18px;margin:22px 0 10px}
p+p{margin-top:12px}
.lead{color:#3c4433}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
/* КОРЕНЬ ВСЕХ «СТРАНИЦА ЕЗДИТ ВБОК»: у grid- и flex-элементов min-width по умолчанию
   равен auto, то есть «не уже своего содержимого». Достаточно одной неразрывной
   строки внутри (цена 30px, ячейка с td b{white-space:nowrap}, широкая карусель) —
   и колонка отказывается сжиматься, распирая всю страницу. min-width:0 разрешает
   сжатие; переполнение остаётся внутри блока, а не выносит вьюпорт. */
.grid2 > *,.grid3 > *,.gal > *{min-width:0}
.gal,.car,.car-track,.car-thumbs{max-width:100%}
/* Карточка лота: фото шире, панель с ценой уже. Раньше это жило инлайном
   в 492 файлах и перебивало мобильный collapse — страница ездила вбок,
   а блок с ценой было не видно (22.07). */
.grid2.u-top{grid-template-columns:1.25fr 1fr}
/* Панель цены едет за пальцем вдоль длинной галереи — но только в две колонки. */
.u-side{position:sticky;top:74px}

.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px}
.card h3{margin-top:0}
.tick{list-style:none}
.tick li{padding:8px 0 8px 30px;position:relative}
.tick li::before{content:"✓";position:absolute;left:0;top:7px;width:22px;height:22px;border-radius:50%;background:var(--olive);color:#fff;font-size:13px;display:flex;align-items:center;justify-content:center}

/* tables */
table{width:100%;border-collapse:collapse;font-size:15px;margin:14px 0}
th,td{text-align:left;padding:12px 12px;border-bottom:1px solid var(--line)}
th{background:var(--sand);font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:#55603f}
tr:hover td{background:#fafaf5}
td b{white-space:nowrap}
.tbl-scroll{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#c3c8b4 #f1efe9}
/* Видимая тонкая полоса прокрутки (где браузер её рисует — Android/десктоп).
   На iOS полосу форсировать нельзя, поэтому надёжный сигнал — бейдж ниже. */
.tbl-scroll::-webkit-scrollbar{height:7px}
.tbl-scroll::-webkit-scrollbar-thumb{background:#c3c8b4;border-radius:999px}
.tbl-scroll::-webkit-scrollbar-track{background:#f1efe9;border-radius:999px}
/* Подсказка прокрутки — бейдж «листайте ↔» в углу таблицы (как в Tilda).
   Зачем не полоса: на мобиле браузеры прячут скроллбар, и что таблица едет вбок —
   неочевидно. Бейдж виден всегда, пока таблица шире экрана; гаснет после первого
   движения. Обёртку .tbl-hintwrap создаёт js/tables.js вокруг таблиц, которые
   реально не влезают, — поэтому на влезающих таблицах и на десктопе его нет. */
.tbl-hintwrap{position:relative}
.tbl-hint{position:absolute;top:8px;right:10px;z-index:3;pointer-events:none;
  background:rgba(44,51,29,.85);color:#fff;font-size:12px;font-weight:600;letter-spacing:.02em;
  padding:5px 12px;border-radius:999px;display:inline-flex;gap:5px;align-items:center;
  box-shadow:0 2px 8px rgba(30,35,15,.25);transition:opacity .35s}
.tbl-hintwrap.scrolled .tbl-hint{opacity:0}

/* promo */
.promo-box{display:flex;flex-wrap:wrap;align-items:center;gap:18px;background:linear-gradient(120deg,#46521f,#5c6b35);border-radius:var(--r);padding:26px 28px;color:#fff}
.promo-box .p-txt{flex:1;min-width:min(260px,100%)}
.promo-box .p-tag{display:inline-block;background:var(--acc);color:#2c331d;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:4px 12px;margin-bottom:10px}
.promo-box h2{color:#fff;margin-bottom:6px;font-size:24px}
.promo-box p{color:#e6ead2;font-size:15px}
.promo-box .p-date{font-size:13px;color:#c8cfa9;margin-top:6px}

/* currency switch */
.cur-switch{display:flex;align-items:center;gap:8px;margin:6px 0 4px;font-size:14px;color:var(--mut);flex-wrap:wrap}
.cur-switch button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;font-size:14px;cursor:pointer;color:#444}
.cur-switch button.on{background:var(--olive);border-color:var(--olive);color:#fff;font-weight:600}
.cur-switch button:hover:not(.on){background:var(--sand)}

/* breadcrumbs */
.bc{font-size:13px;color:var(--mut);padding:14px 0 0}
.bc a{color:var(--mut)}
.bc a:hover{color:var(--olive)}

/* faq */
details{border:1px solid var(--line);border-radius:var(--r);padding:16px 20px;margin-bottom:10px;background:#fff}
details[open]{background:var(--sand)}
summary{font-weight:600;cursor:pointer;list-style:none;position:relative;padding-right:28px}
summary::after{content:"+";position:absolute;right:0;top:-2px;font-size:22px;color:var(--olive)}
details[open] summary::after{content:"–"}
details p{margin-top:10px;color:#3c4433}

/* form */
/* margin-inline:auto — блок 560px висел у левого края в контейнере 1040px,
   и правая половина экрана оставалась пустой. Центрируем. */
.lead-box{background:var(--sand);border:1px solid var(--line);border-radius:var(--r);padding:26px;max-width:560px;margin-inline:auto}
.lead-box h2{font-size:22px}
.lead-box .note{font-size:14px;color:var(--mut);margin-bottom:16px}
.lead-box input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:16px;margin-bottom:10px;background:#fff}
.lead-box input:focus{outline:2px solid var(--olive);border-color:var(--olive)}
.agree{font-size:13px;color:var(--mut);margin:6px 0 14px}
/* выбор канала связи: один тап, WhatsApp по умолчанию */
.chan{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 12px}
.chan label{border:1.5px solid var(--line);border-radius:999px;padding:8px 15px;font-size:14px;cursor:pointer;background:#fff;color:#444;user-select:none}
.chan input{display:none}
.chan i{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:8px;vertical-align:1px}
.chan .i-wa{background:#25d366}.chan .i-tg{background:#2AABEE}.chan .i-call{background:var(--acc)}
.chan label:has(input:checked){background:var(--olive);border-color:var(--olive);color:#fff;font-weight:600}
.chan-q{font-size:13px;color:var(--mut);margin-bottom:6px}
.ok-msg{display:none;color:var(--olive-d);font-weight:600;margin-top:10px}

/* gallery placeholders */
.ph{border-radius:var(--r);min-height:240px;aspect-ratio:16/10;background:linear-gradient(135deg,#d7d9c5,#b9c096);display:flex;align-items:center;justify-content:center;color:#5f6a41;font-size:13px;text-align:center;padding:10px;overflow:hidden}
.photo{border-radius:var(--r);display:block;width:100%;min-height:240px;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line);background:#eceadf;overflow:hidden;color:transparent}
.photo.plan{aspect-ratio:1/1;object-fit:contain;background:#fff}
.gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px;align-items:start}
section{position:relative;background:#fff}
main section{clear:both}

/* схема платежей: простая лента 4×25% без перегруза */
.paysteps{display:flex;gap:0;flex-wrap:wrap;margin:18px 0 6px}
.pstep{flex:1;min-width:130px;position:relative;padding:0 14px 0 0;text-align:center}
.pstep .pp{font-size:24px;font-weight:800;color:var(--olive-d)}
.pstep .pp.small{font-size:16px;padding-top:8px}
.pstep .pl{font-size:13px;font-weight:600;margin-top:2px}
.pstep .pt{font-size:12px;color:var(--mut);margin-top:1px}
.pstep::after{content:"→";position:absolute;right:-2px;top:12px;color:var(--acc);font-size:18px}
.pstep:last-child::after{content:""}
/* На мобиле горизонтальная лента платежей разворачивалась в 5 ВЫСОКИХ блоков
   (число+ярлык+срок в столбик каждый) — тяжело воспринимается. Делаем компактными
   строками «таблицей»: число — фиксированная колонка слева, этап и срок — справа
   в две строки. Высота вдвое меньше, читается как список долей. Разметку не трогаем —
   раскладку задаёт grid поверх тех же трёх div (23.07). */
@media(max-width:760px){
  .paysteps{flex-direction:column;gap:0;margin:14px 0 6px}
  .pstep{display:grid;grid-template-columns:72px 1fr;column-gap:14px;text-align:left;
    padding:12px 0;border-bottom:1px solid #f1efe9}
  .pstep::after{content:""}
  .pstep .pp{grid-column:1;grid-row:1/3;align-self:center;font-size:22px}
  .pstep .pp.small{font-size:15px;line-height:1.15}
  .pstep .pl{grid-column:2;grid-row:1;font-size:15px}
  .pstep .pt{grid-column:2;grid-row:2;font-size:13px}
}

/* ряды наличия по типам: подпись · пропорциональный бар · цифры одной строкой */
.trow{display:grid;grid-template-columns:150px 1fr 235px;gap:12px;align-items:center;font-size:14px}
.trow .tnote{display:block;font-weight:400;font-size:12px;color:var(--acc);margin-top:1px}
.trow .tnum{color:var(--mut);white-space:nowrap}
.trow .track{height:10px;background:#eceadf;border-radius:999px;overflow:hidden}
.trow .track span{display:block;height:100%;background:var(--olive);border-radius:999px}
@media(max-width:760px){
  .trow{grid-template-columns:128px 1fr;gap:8px;font-size:13px}
  .trow .tnum{grid-column:1/3;margin-top:1px;white-space:normal}
}

/* ── НИЖНЯЯ ЗОНА ЭКРАНА ───────────────────────────────────────────────
   За неё дрались пять плавающих блоков: липкая кнопка брони, баннер согласия,
   круглая кнопка связи, чип избранного и всплывашка. На телефоне они налезали
   друг на друга и перекрывали контент.
   Решение: одна переменная --cta-h = высота липкой панели, от неё считаются
   отступы всех остальных. Меняется высота панели — сдвигается всё разом.
   У .cb/.cwb/#favchip/#favtoast стили инжектит JS уже после style.css, поэтому
   перебиваем их через `body ...` — специфичность выше, порядок не важен. */
:root{
  /* ── ШКАЛЫ ФАБРИКИ (этап 2 фейслифта, 23.07.2026). Новые значения берём ТОЛЬКО отсюда.
     --fs-scale: 12 13 14 15 16 18 20 22 24 26 + clamp() для h1/h2
     --sp-scale: 4 8 12 16 20 24 32 48 (кратно 4)
     --r-scale: 8 14 999 ── */
--cta-h:0px}

/* sticky mobile cta */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:60;background:#fff;border-top:1px solid var(--line);gap:10px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom))}   /* полоса-индикатор iPhone */
/* без переноса строк: перенос раздувал панель вдвое на узких экранах.
   clamp ужимает шрифт вместо переноса (13px минимум — читаемо). */
.sticky-cta a{flex:1;text-align:center;padding:12px 6px;font-size:clamp(13px,3.9vw,15px);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}

/* footer */
footer{background:#2c331d;color:#c8cdb5;padding:36px 0 26px;margin-top:40px;font-size:14px}
footer a{color:#e4e8d2}
footer .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:22px;margin-bottom:20px}
footer .foot-lang{font-size:14px;color:#c8cdb5;border-top:1px solid #454f2e;padding-top:14px;margin:0}
footer .foot-lang a{color:#e4e8d2}
footer .fine{font-size:13px;color:#a7ae91;padding-top:12px;line-height:1.6}

/* ── ТАБЛИЦЫ-КАРТОЧКИ на узком экране ──
   Широкие таблицы (цены, расчёт рассрочки, лоты) на телефоне превращаются в карточки:
   строка → карточка, каждая ячейка → «ярлык: значение». Ярлык — из data-label
   (проставляет js/tables.js по заголовкам). HTML остаётся <table> (важно для SEO
   и для того, что скрипты валют/сортировки работают с теми же ячейками).
   Порог 600px: на планшете таблица ещё читается, на телефоне — уже нет. */
@media(max-width:600px){
  .t-cards, .t-cards thead, .t-cards tbody, .t-cards tr, .t-cards th, .t-cards td{display:block}
  /* сбрасываем инлайновый min-width (у некоторых таблиц стоит min-width:600px для десктопа):
     иначе карточка остаётся 600px шире экрана и значения уезжают вправо за край (23.07). */
  .t-cards{min-width:0!important;width:100%}
  .t-cards td{overflow-wrap:anywhere}
  .t-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}  /* прячем строку заголовков, но доступно скринридеру */
  .t-cards{font-size:15px;margin:12px 0}
  .t-cards tr{border:1px solid var(--line);border-radius:12px;padding:4px 14px;margin:0 0 10px;background:#fff}
  .t-cards tr:hover td{background:transparent}
  .t-cards td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
    border:0;border-bottom:1px solid #f1efe9;padding:8px 0;text-align:right}
  .t-cards tr td:last-child{border-bottom:0}
  .t-cards td::before{content:attr(data-label);color:var(--mut);font-weight:400;text-align:left;flex:0 0 auto}
  .t-cards td b{white-space:normal}
  /* первая ячейка (тип/юнит) — как заголовок карточки: крупнее, без ярлыка */
  .t-cards td:first-child{border-bottom:1px solid var(--line);padding-top:12px;font-size:16px;font-weight:700}
  .t-cards td:first-child::before{display:none}
  /* в карточном режиме таблица влезает — прокрутка и бейдж-подсказка не нужны */
  .t-cards.tbl-scroll,.tbl-scroll:has(.t-cards){overflow:visible}
  .tbl-hintwrap:has(.t-cards) .tbl-hint{display:none}
}

@media(max-width:760px){
  .grid2,.grid2.u-top{grid-template-columns:1fr}
  /* на телефоне порядок сверху вниз: фото → цена и характеристики.
     sticky в одноколоночной ленте только мешает — отключаем. */
  .u-side{position:static;top:auto}
  /* Цена 30px + «≈ $189 000» рядом не влезали в 390px и распирали карточку.
     Уменьшаем и разрешаем перенос: сумма в баттах и её эквивалент встают в две строки,
     каждая при этом остаётся неразрывной. */
  .u-side > p:first-child{font-size:24px;flex-wrap:wrap}
  .u-side .thb small{white-space:nowrap}
  /* Таблица характеристик: ячейки могут переноситься, длинные значения не распирают. */
  .u-side table{width:100%;table-layout:auto}
  .u-side td{overflow-wrap:anywhere}
  .nav nav{display:none}
  .sticky-cta{display:flex}
  section{padding:26px 0}

  /* ── порядок этажей снизу вверх ── */
  :root{
  /* ── ШКАЛЫ ФАБРИКИ (этап 2 фейслифта, 23.07.2026). Новые значения берём ТОЛЬКО отсюда.
     --fs-scale: 12 13 14 15 16 18 20 22 24 26 + clamp() для h1/h2
     --sp-scale: 4 8 12 16 20 24 32 48 (кратно 4)
     --r-scale: 8 14 999 ── */
--cta-h:64px}
  body{padding-bottom:calc(var(--cta-h) + env(safe-area-inset-bottom))}

  /* Круглая кнопка связи на мобиле убрана совсем: липкая панель внизу делает
     ровно то же (WhatsApp + заявка), а два плавающих элемента с одной функцией
     только съедают экран. На десктопе кнопка остаётся. */
  body .cwb,body .cwp{display:none!important}

  /* Чип избранного и всплывашка — над липкой панелью, а не под ней. */
  body #favchip{bottom:calc(var(--cta-h) + 12px)}
  body #favtoast{bottom:calc(var(--cta-h) + 12px)}

  /* Баннер согласия — тоже над панелью. Пока он открыт, чип избранного прячем:
     три уровня плашек на 390px читаются как свалка. Баннер удаляется из DOM
     после ответа, поэтому :has() отработает корректно. */
  body .cb{bottom:calc(var(--cta-h) + 10px);left:8px;right:8px}
  body:has(.cb) #favchip{display:none!important}

  /* Панель выбранного юнита на странице наличия. */
  body .upanel{bottom:var(--cta-h)}
}

/* ── a11y (Lighthouse 23.07.2026): текстовые ссылки различимы не только цветом ── */
main p a:not(.btn), main li a:not(.btn), p.upd a, .answer a{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}

/* ── таблица лотов: строка кликабельна, номер — явная ссылка (дизайн-аудит 23.07) ── */
#lots-tbl tbody tr{cursor:pointer}
#lots-tbl tbody tr:hover{background:#f0eee4}
#lots-tbl tbody td:first-child a{text-decoration:underline;text-underline-offset:2px}

/* ── таблица лотов на мобиле: компактнее и без переносов цен (фидбек 24.07) ── */
#lots-tbl th{white-space:nowrap}
#lots-tbl td{white-space:nowrap}
.mhint{display:none}
@media(max-width:760px){
  #lots-tbl{font-size:13px}
  #lots-tbl th,#lots-tbl td{padding:8px 6px}
  .mhint{display:block;font-size:13px;color:var(--mut);margin:2px 0 8px}
}

/* бургер включается с 1100px (nav.js): прячем ленту меню и сердечко на тех же ширинах,
   иначе на средних экранах видно и бургер, и обрезанное меню (фидбек 25.07) */
@media(max-width:1100px){.nav nav{display:none}.nav #favcount{display:none!important}}

/* ── Форма заявки (английская версия) ──────────────────────────────
   Отдельный контур: русская версия остаётся на мессенджерах и ничего
   не собирает, форма живёт только там, где мы работаем по GDPR. */
.leadform{max-width:560px;margin:18px auto 0;text-align:left}
.lf-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.lf-row{grid-template-columns:1fr}}
.lf-field{display:block}
.lf-field span{display:block;font-size:14px;font-weight:600;margin-bottom:5px;color:var(--ink)}
.lf-field small{font-weight:400;color:var(--mut)}
.lf-field input{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--line);
  border-radius:var(--r);background:#fff;color:var(--ink);transition:border-color .15s}
.lf-field input:focus{outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(92,107,53,.12)}
.lf-field input:user-invalid{border-color:#c0563f}
/* Галочка НЕ предустановлена и равновесна по весу с остальным текстом:
   предвыбранное согласие не считается согласием. */
.lf-consent{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:14px;line-height:1.5;color:var(--mut)}
.lf-consent input{width:20px;height:20px;margin:1px 0 0;flex:0 0 auto;accent-color:var(--olive)}
.lf-consent a{color:var(--olive-d)}
.lf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.leadform button[type=submit]{margin-top:16px;width:100%;font-size:16px;padding:14px 20px}
.leadform button[disabled]{opacity:.6;cursor:default}
.lf-msg{margin:10px 0 0;font-size:14px;min-height:1.2em}
.lf-msg.ok{color:#1d7a4d;font-weight:600}
.lf-msg.err{color:#b23c22}
.lf-or{margin:22px 0 10px;font-size:13px;color:var(--mut);text-transform:uppercase;letter-spacing:.08em}

/* Мессенджеры под формой — тихой строкой, а не второй парой кнопок.
   Три ярких элемента подряд (форма + WhatsApp + Telegram) заставляли выбирать
   способ вместо того, чтобы писать. Канал остаётся, вес снят. */
.lf-alt{margin:14px 0 0;font-size:14px;color:var(--mut)}
.lf-alt a{color:var(--olive);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(92,107,53,.3);padding-bottom:1px}
.lf-alt a:hover{border-bottom-color:var(--olive)}
.lf-alt i{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:1px}
.lf-alt .i-wa{background:#25d366}.lf-alt .i-tg{background:#2AABEE}
.lf-alt .lf-dot{margin:0 6px;color:var(--line)}

/* Подсказки валидации под полем, а не браузерным пузырём: пузырь исчезает
   через пару секунд, не читается на мобильном и всегда на языке системы. */
.lf-err{margin:5px 0 0;font-size:13px;color:#a32d2d;line-height:1.35}
.lf-field.is-invalid input,.lf-consent.is-invalid input{border-color:#a32d2d}
.lf-field.is-invalid input:focus{box-shadow:0 0 0 3px rgba(163,45,45,.12)}
.lf-consent.is-invalid span{color:#a32d2d}
.lf-msg.err{color:#a32d2d}
.lf-msg.ok{color:var(--olive);font-weight:600}

/* main p a:not(.btn) подчёркивает все ссылки в тексте — из-за него у
   мессенджеров под формой было две линии сразу: своя рамка и подчёркивание.
   Перебиваем адресно. */
/* Селектор должен быть НЕ СЛАБЕЕ, чем `main p a:not(.btn)` (0,1,3), иначе
   подчёркивание не снимается — с первого раза я написал `main .lf-alt a`
   (0,1,2) и правило проиграло. Считать специфичность на глаз — плохая идея. */
main p.lf-alt a:not(.btn){text-decoration:none}

/* Экран после отправки: форма уходит, остаётся подтверждение и следующий шаг.
   Пустая форма после «Спасибо» — мёртвое место: человек уже сделал действие,
   и это лучший момент увести его в подбор квартиры. */
.lf-done{text-align:left}
.lf-done .lf-tick{width:44px;height:44px;border-radius:50%;background:var(--olive);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px}
.lf-done h3{font-size:19px;margin:0 0 6px}
.lf-done p{font-size:14px;color:var(--mut);margin:0 0 16px}
.lf-done .lf-next{display:grid;gap:10px}
.lf-done .lf-next .btn{text-align:center}

/* Строка поиска внутри выпадающего списка стран.
   Настоящая причина наезда была не в моём стиле из consent.js, а в общих
   правилах формы: `.lead-box input` и `.lf-field input` задают padding 12/14px
   и рамку ВСЕМ полям внутри блока — включая поиск, который живёт в разметке
   intl-tel-input внутри того же .lf-field. Библиотека держит слева иконку лупы
   на absolute и рассчитывает на padding-left:30px; наши 14px его перебивали,
   и текст с курсором налезали на иконку.
   Возвращаем геометрию библиотеки селектором заведомо более весомым. */
.lead-box .iti__search-input,
.lf-field .iti__search-input{
  width:100%;margin:0;border:0;border-radius:3px;background:#fff;
  padding:10px 30px 10px 32px;font-size:15px;box-shadow:none
}
.lead-box .iti__search-input:focus,
.lf-field .iti__search-input:focus{outline:none;border:0;box-shadow:none}
/* Пункты списка стран тоже не должны наследовать отступы полей формы. */
.lead-box .iti__country,.lf-field .iti__country{margin:0}

/* Выравнивание пары «имя / телефон».
   Поле телефона обёрнуто разметкой intl-tel-input, и его высота отличалась
   от обычного поля на пару пикселей. Незаметно, пока полей два, — но
   подсказки об ошибке под ними вставали на разной высоте и колонка
   выглядела съехавшей. Фиксируем высоту полей: тогда и поля, и подсказки
   под ними стоят на одной линии независимо от обёрток. */
/* Подбирать высоты вручную бесполезно: у поля телефона своя обёртка от
   библиотеки, и любая правка внутри неё снова сдвинет подсказку. Поэтому
   раскладываем подпись, поле и подсказку по СТРОКАМ ОДНОЙ сетки: тогда они
   выровнены по определению, независимо от того, что у поля внутри.
   display:contents убирает сам label из раскладки, оставляя его детей
   прямыми элементами сетки; связь label с полем от этого не теряется. */
.lf-row{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;align-items:start}
.lf-row .lf-field{display:contents}
.lf-row .lf-field > *{min-width:0}
.lf-row .lf-field:first-child  > *{grid-column:1}
.lf-row .lf-field:nth-child(2) > *{grid-column:2}
.lf-row .lf-field > span{grid-row:1}
.lf-row .lf-field > input,
.lf-row .lf-field > .iti{grid-row:2;align-self:start}
.lf-row .lf-field > .lf-err{grid-row:3;margin:6px 0 0}
.lf-field input,
.lf-field .iti input.iti__tel-input{height:52px;line-height:normal}

/* ══════════════════════════════════════════════════════════════════════
   SAINT TROPEZ NAITHON — палитра проекта и компоненты, которых не было
   в эталоне Оливы. Имена переменных не меняем: их читает весь общий JS.
   Контраст всех пар проверен ≥4.5:1 (WCAG 2.2 AA).
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --olive:#b4552a;      /* терракота — основной цвет бренда */
  --olive-d:#8f3f1c;    /* тёмная терракота: hover и текст ссылок */
  --sand:#f7f2ea;       /* песочный фон секций */
  --ink:#2e261f;        /* основной текст */
  --mut:#7a6a5c;        /* приглушённый текст, 5,19:1 на белом */
  --line:#e8ded0;
  --acc:#6b7345;        /* оливково-зелёный акцент из палитры застройщика */
  --foot:#3a2e24;
  --foot-txt:#d8cbb8;
}

/* шапка: логотип из двух строк + пилюля языка */
.logo{display:flex;flex-direction:column;line-height:1.15}
.logo b{font-size:17px;letter-spacing:.06em;text-transform:uppercase;color:var(--olive)}
.logo span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.lang-pill{flex:0 0 auto;min-width:44px;min-height:36px;display:inline-flex;align-items:center;
  justify-content:center;border:1px solid var(--line);border-radius:999px;font-size:13px;
  font-weight:600;color:var(--mut);padding:0 12px}
.lang-pill:hover{color:var(--olive-d);border-color:var(--olive)}

/* заголовки и служебный текст */
.h1sub{color:var(--mut);font-size:16px;margin:-6px 0 18px}
.dim{color:var(--mut);font-size:14px}
.micro{color:var(--mut);font-size:13px;margin:6px 0 0}
.usd{color:var(--mut);font-size:.72em;font-weight:400;margin-left:8px;white-space:nowrap}
.price{font-size:22px;font-weight:700;color:var(--olive-d);margin:2px 0 4px}

/* полоса доли свободных внутри типа */
.bar{display:inline-block;width:64px;height:8px;border-radius:999px;background:var(--line);
  vertical-align:middle;margin-right:8px;position:relative;overflow:hidden}
.bar::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--p,0%);background:var(--acc)}

/* статусы лотов — текстом, не только цветом */
.st{display:inline-block;padding:2px 9px;border-radius:999px;font-size:13px;white-space:nowrap}
.st-available{background:#e8f1e2;color:#2f5a22}
.st-reserved{background:#fdf0dd;color:#8a5a10}
.st-withheld{background:#eeeae4;color:#5f5750}
.u-status{display:inline-block;margin:0 0 14px;padding:4px 12px;border-radius:999px;font-size:14px;font-weight:600}
.u-status.st-available{background:#e8f1e2;color:#2f5a22}
.u-status.st-reserved{background:#fdf0dd;color:#8a5a10}
.u-status.st-withheld{background:#eeeae4;color:#5f5750}

/* карточка лота: цена и действия */
.u-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));
  gap:20px;align-items:start;background:var(--sand);border:1px solid var(--line);
  border-radius:var(--r);padding:20px;margin:22px 0}
.u-top > *{min-width:0}
.u-price{font-size:30px;font-weight:800;color:var(--ink);line-height:1.2}
.u-price.dim{font-size:22px;font-weight:600;color:var(--mut)}
.u-cta{display:flex;flex-direction:column;gap:8px}
.u-cta .btn{width:100%;text-align:center}

/* честные минусы */
.honest{border-left:4px solid var(--acc);background:#fbfaf6;border-radius:0 var(--r) var(--r) 0;
  padding:16px 18px;margin:20px 0}
.honest h3{font-size:16px;margin:0 0 8px}
.honest ul{margin:0;padding-left:18px}
.honest li{margin:6px 0;color:var(--ink)}

/* мост на полный FAQ */
.bridge{border:1px solid var(--line);border-radius:var(--r);padding:18px;margin-top:18px;background:var(--sand)}
.bridge b{display:block;font-size:17px;margin-bottom:10px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.chips span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 12px;
  font-size:13px;color:var(--mut)}

/* схема оплаты и шаги сделки */
.paysteps{list-style:none;display:grid;gap:10px;margin:18px 0;padding:0}
.paysteps li{display:grid;grid-template-columns:minmax(64px,auto) 1fr minmax(120px,auto);gap:14px;
  align-items:baseline;background:var(--sand);border-radius:var(--r);padding:12px 16px}
.paysteps li > *{min-width:0}
.paysteps b{font-size:18px;color:var(--olive-d)}
.paysteps span{font-size:15px}
.paysteps i{font-style:normal;font-weight:600;text-align:right;white-space:nowrap}
.steps{margin:16px 0 16px 20px}
.steps li{margin:8px 0}

/* многоколоночные списки карты сайта */
.cols3,.cols6{list-style:none;padding:0;display:grid;gap:6px 18px}
.cols3{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.cols6{grid-template-columns:repeat(auto-fit,minmax(min(72px,100%),1fr))}

/* форма: чипсы канала связи и согласие */
.chan{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.chan-q{font-size:14px;color:var(--mut);margin:12px 0 6px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:0;height:0}
.chip span{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;
  border:1px solid var(--line);background:#fff;font-size:14px;cursor:pointer}
.chip input:checked + span{border-color:var(--olive);background:#fdf1ea;color:var(--olive-d);font-weight:600}
.chip input:focus-visible + span{outline:2px solid var(--olive);outline-offset:2px}
.lf-consent{font-size:13px;color:var(--mut);margin:0 0 14px;display:flex;gap:8px}
.lf-consent input{margin-top:3px;flex:0 0 auto;width:18px;height:18px}
.magnet{background:var(--sand);border-radius:var(--r);padding:12px 16px;font-size:15px;margin:0 0 12px}

/* футер: колонки навигации */
.fnav{display:flex;flex-direction:column;gap:6px}

/* таблица лотов */
.units-table td:first-child a{font-weight:600;text-decoration:underline}

/* галерея проекта: табы + нативная карусель со scroll-snap */
.gtabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.gtabs button{min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--line);
  background:#fff;font:inherit;font-size:14px;color:var(--ink);cursor:pointer}
.gtabs button i{font-style:normal;color:var(--mut);font-size:13px;margin-left:6px}
.gtabs button.on{background:var(--olive);border-color:var(--olive);color:#fff}
.gtabs button.on i{color:#ffffffcc}
.gtabs button:focus-visible{outline:2px solid var(--olive);outline-offset:2px}
/* Ленту, стрелки, счётчик, миниатюры и лайтбокс строит gallery.js и он же
   приносит свои стили. Здесь — только то, что относится к нашей разметке:
   сетка-фолбэк до сборки (и для выключенного JS) и чертежи, которые нельзя
   обрезать по кадру. Дублировать правила ленты нельзя: две копии расходятся. */
.gal-pane[hidden]{display:none}
.gal-pane{margin:0 0 4px}
/* чертёж показываем целиком: карусель кроет .car-track img.photo{object-fit:cover},
   поэтому перебиваем более точным селектором, а не !important */
.car-track img.photo.plan,.lb-track img.photo.plan{object-fit:contain;background:#fff;aspect-ratio:auto}
.gal:not([style*="block"]) img.plan{aspect-ratio:auto;object-fit:contain;background:#fff}

/* карточки объектов мастер-плана района */
.district{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:12px;margin:18px 0}
.district > *{min-width:0}
.district div{border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;background:#fff}
.district b{display:block;font-size:15px}
.district span{font-size:13px;color:var(--mut)}

/* тач-цели ≥44px на мобильных (WCAG 2.5.5 / Apple HIG) */
@media (max-width:800px){
  .logo{min-height:44px;justify-content:center}
  .lang-pill{min-height:44px}
  .nav nav a{display:inline-flex;align-items:center;min-height:44px}
  .fnav a{display:inline-flex;align-items:center;min-height:44px}
  .foot-lang a{display:inline-block;padding:10px 0}
  main details summary{min-height:44px;display:flex;align-items:center}
  .units-table td a,.tbl-scroll td a{display:inline-flex;align-items:center;min-height:44px}
  .bc a{display:inline-flex;align-items:center;min-height:44px}
  .lf-consent label{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:6px 0}
  .lf-consent input{width:22px;height:22px;margin-top:2px}
}
/* минимальный кегль подписей — 13px, не 12 (урок lessons-live-launch A7) */
.dim,.micro,.car-cap,.chips span{font-size:13px}
.gtabs button{min-height:44px}
.lang-sw a,.nav .lang-sw a{min-height:44px;display:inline-flex;align-items:center}
.logo span{font-size:12px;letter-spacing:.12em}

/* cookie-баннер: кнопки равного веса — отказ не должен быть тише согласия
   (требование ePrivacy/GDPR и правило комплаенс-гайда) */
#cc button,.cc button,.cookie button{min-height:44px;padding:0 20px;border-radius:999px;
  font:inherit;font-size:15px;font-weight:600;cursor:pointer;
  border:2px solid var(--olive);background:#fff;color:var(--olive-d)}
#cc button:last-of-type,.cc button:last-of-type,.cookie button:last-of-type{
  background:var(--olive);color:#fff}

/* листы планировок из брошюры */
.sheets{display:grid;gap:28px;margin:18px 0}
.sheet{margin:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.sheet figcaption{padding:12px 16px;background:var(--sand);border-bottom:1px solid var(--line);font-size:15px}
.sheet figcaption b{color:var(--olive-d);font-size:17px;letter-spacing:.02em}
.sheet img{width:100%;height:auto;display:block}
.sheet .micro{padding:10px 16px;margin:0;background:#fdf6ef;border-top:1px solid var(--line)}
@media(min-width:1000px){.sheets{grid-template-columns:1fr 1fr}}
.photo.plan{background:#fff;object-fit:contain}

/* Свой лайтбокс был здесь и в gtabs.js — и открывался поверх лайтбокса
   gallery.js: два оверлея, свайп мимо, Esc закрывал только верхний. Убран. */
.typegal{margin:26px 0}
.typegal h2{font-size:20px}

/* ══ модуль выбора квартиры ══════════════════════════════════════════ */
.tfilter{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 4px;align-items:center}
.tfilter button{border:1px solid var(--line);background:#fff;border-radius:999px;
  padding:0 16px;min-height:44px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink)}
.tfilter button.on{background:var(--olive);border-color:var(--olive);color:#fff;font-weight:600}
.tfilter button:focus-visible{outline:2px solid var(--olive);outline-offset:2px}
.tfilter .fsep{font-size:14px;color:var(--mut);margin-left:6px}
.tfilter .fwide{margin-left:auto}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;margin:12px 0;color:var(--mut)}
.legend i{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:-2px;margin-right:5px}

/* фасад */
.fac-legend{position:absolute;left:12px;bottom:12px;background:rgba(46,38,31,.78);color:#fff;
  border-radius:10px;padding:8px 12px;font-size:13px;z-index:4;display:flex;gap:12px;flex-wrap:wrap}
.fac-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
#ftip{position:absolute;display:none;background:#2e261f;color:#fff;font-size:13px;padding:6px 10px;
  border-radius:8px;pointer-events:none;white-space:nowrap;z-index:5}

/* планы этажей */
.mpwrap,.fbbody{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
#mpfloors,#fbfloors{display:flex;flex-direction:column;gap:6px}
#mpfloors button,#fbfloors button{border:1px solid var(--line);background:#fff;border-radius:999px;
  padding:0 14px;min-height:44px;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;color:var(--ink)}
#mpfloors button.on,#fbfloors button.on{background:var(--olive);border-color:var(--olive);color:#fff;font-weight:600}
#mpprev,#mpnext,#fbprev,#fbnext{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;
  border-radius:50%;border:0;background:rgba(46,38,31,.55);color:#fff;font-size:24px;line-height:1;cursor:pointer;z-index:3}
#mpprev,#fbprev{left:8px}#mpnext,#fbnext{right:8px}
#floorbox{border:1px solid var(--line);border-radius:var(--r);padding:18px;margin:14px 0;background:#fff}
.fbhead{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.fbhead h3{margin:0;font-size:18px}
#fbx{border:0;background:none;font-size:22px;cursor:pointer;color:var(--mut);width:44px;height:44px}
#fbzones{position:absolute;inset:0}
.fpz{position:absolute;border-radius:50%;transition:background .15s;text-decoration:none}
.fz-free{background:rgba(74,158,62,.25);border:2px solid rgba(74,158,62,.85);cursor:pointer}
.fz-free:hover{background:rgba(74,158,62,.5)}
.fz-gone{background:rgba(120,110,100,.18);border:2px solid rgba(120,110,100,.5)}
.fbchips{display:none;flex-wrap:wrap;gap:5px;margin-top:10px}

/* шахматка */
.tower h3{font-size:17px;margin:0 0 8px}
.chess{display:grid;gap:4px;overflow-x:auto;padding-bottom:6px}
.frow{display:flex;gap:4px;align-items:center}
.fl{min-width:34px;font-size:13px;color:var(--mut);font-weight:700;text-align:center}
.cell{min-width:60px;height:46px;border-radius:8px;font-size:13px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;cursor:pointer;border:1px solid transparent;line-height:1.15;
  font-weight:600;text-decoration:none;color:inherit}
.cell.free{background:#e8f1e2;color:#2f5a22}
.cell.free:hover{border-color:var(--olive);background:#dbe8d1}
.cell.held{background:#fdf0dd;color:#8a5a10}
.cell.gone{background:#f1efe9;color:#9b9187;cursor:default}
.cell.sel{background:var(--olive);color:#fff}
.cell span{font-weight:400;font-size:12px}

/* панель сделки */
.upanel{position:sticky;bottom:calc(var(--cta-h,0px) + 4px);z-index:20;background:#fff;
  border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-top:18px;
  display:none;box-shadow:0 -4px 20px #0001}
.upanel.show{display:flex;gap:18px;flex-wrap:wrap;align-items:center;position:relative}
.upanel img{width:120px;border-radius:8px;border:1px solid var(--line);background:#fff}
.upanel .ud{flex:1;min-width:200px;position:relative;padding-right:44px}
.upanel .ud b{font-size:20px;color:var(--olive-d)}
.upanel .ud .favbtn{position:absolute;top:0;right:0}
.upanel .ucta{display:grid;gap:6px;min-width:min(260px,100%)}
#upx{position:absolute;top:6px;right:8px;border:0;background:none;font-size:20px;color:var(--mut);
  cursor:pointer;width:44px;height:44px}
.units-table tr.sold td{color:var(--mut)}

@media(max-width:760px){
  #fbzones{display:none}
  .fbchips{display:flex}
  .fl{position:sticky;left:0;z-index:2;background:#fff;min-width:30px}
  .tfilter .fwide{margin-left:0}
}

/* лид-форма: эталон Оливы */
.lead-box{background:var(--sand);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.leadform{max-width:620px}
.lf-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px}
.lf-row > *{min-width:0}
.lf-field label{display:block;font-size:14px;color:var(--mut);margin-bottom:6px}
.lf-field label small{font-size:12px;opacity:.8}
.lf-field input{width:100%;min-height:48px;padding:0 14px;font:inherit;font-size:16px;
  border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.lf-field input:focus-visible{outline:2px solid var(--olive);outline-offset:1px;border-color:var(--olive)}
.lf-field.err input{border-color:#c4453c}
.lf-err{color:#c4453c;font-size:13px;margin-top:4px}
.lf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lf-msg{margin:10px 0 0;font-size:15px}
.lf-msg.ok{color:#1d7a55;font-weight:600}
.lf-msg.err{color:#c4453c}
.lf-fine{font-size:12px;color:var(--mut);margin-top:10px}
.lf-alt{margin-top:14px;font-size:15px}
.lf-alt a{font-weight:600}
.lf-dot{color:var(--mut);margin:0 6px}
.chip span i,.lf-alt i{display:inline-block;width:14px;height:14px;border-radius:3px;margin-right:6px;
  vertical-align:-2px;background:currentColor;opacity:.75}
.i-wa{background:#25D366!important;opacity:1!important;border-radius:50%!important}
.i-tg{background:#2AABEE!important;opacity:1!important;border-radius:50%!important}
.i-call{background:var(--mut)!important;opacity:1!important;border-radius:3px!important}

/* валютный переключатель */
.cur-switch{display:inline-flex;gap:4px;border:1px solid var(--line);border-radius:999px;padding:3px;background:#fff}
.cur-switch button{min-width:44px;min-height:38px;border:0;background:none;border-radius:999px;
  font:inherit;font-size:15px;cursor:pointer;color:var(--mut)}
.cur-switch button.on{background:var(--olive);color:#fff;font-weight:700}
.thb small{color:var(--mut);font-weight:400;font-size:.78em;white-space:nowrap}

/* карточка лота */
.u-side{background:var(--sand);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.u-side .u-price{font-size:30px;font-weight:800;color:var(--olive-d);margin:0;
  display:flex;align-items:center;justify-content:space-between;gap:10px}
.u-side table{width:100%;font-size:14px;margin:12px 0 0;border-collapse:collapse}
.u-side td{border:0;padding:5px 0;vertical-align:top}
.u-side td:first-child{color:var(--mut);width:44%}
.u-cta{display:grid;gap:6px;margin-top:16px}
.u-cta .btn{text-align:center}
.u-cta .micro{text-align:center;margin:0}
.u-gal{position:relative}
/* до сборки карусели два кадра лежат сеткой — без прыжка вёрстки */
.u-gal .gal{gap:10px}
.u-gal > .favbtn{position:absolute;top:12px;right:12px;z-index:6}
.simcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:14px}
.simcards > *{min-width:0}
.simcard{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;position:relative;background:#fff}
.simcard > .favbtn{position:absolute;top:8px;right:8px;z-index:3}
.simcard a{display:block;text-decoration:none;color:inherit}
.simcard img{width:100%;aspect-ratio:16/10;object-fit:contain;background:#fff;border-bottom:1px solid var(--line)}
.simcard .sc-b{padding:12px 16px 14px}
.simcard .sc-p{color:var(--olive-d);font-weight:700}

/* футер: тёмно-коричневый бренда вместо оливкового эталона + строка языков */
footer{background:var(--foot);color:var(--foot-txt)}
footer a{color:var(--foot-txt)}
footer a:hover{color:#fff}
.foot-lang{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  flex-wrap:wrap;border-top:1px solid #ffffff1f;margin-top:20px;padding-top:14px;font-size:14px}
.fine{font-size:12.5px;line-height:1.6;color:#c4b7a4;margin-top:14px}
.fine a{color:var(--foot-txt);text-decoration:underline}
footer .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:24px}
footer .cols > *{min-width:0}
footer .cols b{letter-spacing:.04em}

/* ══ сезонность: столбики без картинок и без JS ═══════════════════════
   Данные дублируются текстом в подписи каждого столбика — скринридер и
   поисковый робот читают цифры, а не «диаграмма». */
.sbars{display:grid;grid-template-columns:repeat(12,1fr);gap:5px;margin:18px 0 6px}
.sb{display:flex;flex-direction:column;justify-content:flex-end;height:190px;min-width:0;text-align:center}
.sb i{display:block;height:var(--h);background:var(--olive);border-radius:6px 6px 0 0;
  margin-top:6px;transition:background .15s}
.sb.mid i{background:#a3ab7e}
.sb.low i{background:#cbc7b6}
.sb b{font-size:11px;font-weight:600;color:var(--ink);letter-spacing:-.02em}
.sb span{font-size:11px;color:var(--mut);margin-top:5px;overflow:hidden;text-overflow:ellipsis}
.slegend{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--mut);margin:2px 0 4px}
.slegend s{text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.slegend s::before{content:"";width:12px;height:12px;border-radius:3px;background:var(--olive)}
.slegend s.mid::before{background:#a3ab7e}
.slegend s.low::before{background:#cbc7b6}
@media(max-width:640px){
  .sbars{gap:3px}
  .sb{height:150px}
  .sb b{font-size:10px}
  .sb span{font-size:10px}
}
/* два подхода к сдаче — карточки рядом */
.strat{display:grid;grid-template-columns:1fr;gap:14px;margin:16px 0}
@media(min-width:820px){.strat{grid-template-columns:1fr 1fr}}
.strat .card h3{margin:0 0 10px;font-size:18px}
.strat .card dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:15px}
.strat .card dt{color:var(--mut)}
.strat .card dd{margin:0;font-weight:600}

/* статус объекта мастер-плана: «построено» и «заявлено» — разные вещи */
.district > div{position:relative}
.dm-st{position:absolute;top:10px;right:10px;font-style:normal;font-size:11px;
  letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:999px;
  background:#eceadf;color:var(--mut)}
.district > .dm-built .dm-st,.district > .dm-works .dm-st{background:#e6ecd6;color:#4a5a26}
/* заголовок карточки не заезжает под плашку статуса */
.district > div b{display:block;padding-right:84px}
