@font-face{font-family:Museo;src:url(ш/museosanscyrl_300-webfont.woff2) format('woff2');
  font-weight:300;font-display:swap}
@font-face{font-family:Museo;src:url(ш/museosanscyrl_500-webfont.woff2) format('woff2');
  font-weight:500;font-display:swap}
@font-face{font-family:Museo;src:url(ш/museosanscyrl_700-webfont.woff2) format('woff2');
  font-weight:700;font-display:swap}
@font-face{font-family:Cormorant;src:url(ш/cormorantgaramond-var-cyrillic.woff2) format('woff2');
  font-weight:300 700;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Cormorant;src:url(ш/cormorantgaramond-var-latin.woff2) format('woff2');
  font-weight:300 700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Cormorant;src:url(ш/cormorantgaramond-var-italic-cyrillic.woff2) format('woff2');
  font-weight:300 700;font-style:italic;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Cormorant;src:url(ш/cormorantgaramond-var-italic-latin.woff2) format('woff2');
  font-weight:300 700;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

*{margin:0;padding:0;box-sizing:border-box}
/* Поля и кнопки шрифт страницы не наследуют — браузер ставит им системный.
   Из-за этого выпадающие списки фильтра и кнопки-<button> выглядели чужими
   рядом с точно такими же ссылками-кнопками. Сброс общий, на весь сайт. */
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{background:none;border:none;border-radius:0;cursor:pointer;
  -webkit-appearance:none;appearance:none}
:root{--медь:#B0755A;--медь-свет:#C28B71;--графит:#16161A;--крем:#F4F1EC;
  --бумага:#FAF8F5;--серый:#6E6A64;--линия:#E2DCD3}
html{scroll-behavior:smooth}
body{font:300 16px/1.6 Museo,-apple-system,'Segoe UI',sans-serif;color:var(--графит);background:#fff}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.обёртка{max-width:1360px;margin:0 auto;padding:0 40px}
/* поле слева и справа: одно и то же число для всех блоков, включая полноширинные */
:root{--поле:max(40px,calc((100vw - 1360px)/2 + 40px))}
.раздел{padding:88px 0}
.заголовок{font-size:36px;font-weight:300;letter-spacing:.02em;text-transform:uppercase}
.заголовок b{font-weight:500}
.над{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--медь);margin-bottom:14px}
/* Служебные классы новой редакции — те же, что на главной: антиква для чисел
   и крупных цитат, «надпись» для мелких прописных подписей над блоками. */
.антиква{font-family:Cormorant,Georgia,serif;font-weight:300;letter-spacing:.005em}
.надпись{font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
/* Шрифт и фон заданы явно: кнопка-<button> не наследует шрифт страницы, и
   на макбуке браузер рисовал её системным шрифтом на сером градиенте — рядом
   с ссылкой-кнопкой того же класса это читалось как два разных элемента. */
.кн{display:inline-flex;align-items:center;justify-content:center;height:58px;padding:0 38px;
  font:500 14px/1 Museo,sans-serif;letter-spacing:.12em;text-transform:uppercase;
  background:transparent;border:1px solid transparent;border-radius:0;
  -webkit-appearance:none;appearance:none;
  transition:.2s;cursor:pointer;white-space:nowrap}
.кн--медь{background:var(--медь);color:#fff}
.кн--медь:hover{background:#9C6449}
.кн--обвод{border-color:rgba(255,255,255,.75);color:#fff}
.кн--обвод:hover{background:rgba(255,255,255,.14)}
.кн--тёмобвод{border-color:var(--графит);color:var(--графит)}
.кн--тёмобвод:hover{background:var(--графит);color:#fff}
.ещё{display:flex;justify-content:center;margin-top:40px}

/* ── команда
   Лента лиц стоит на двух страницах — на главной и в разделе «О команде», —
   поэтому её оформление живёт здесь, в общем файле. До 23 августа 2026 оно
   было внутри главной, и раздел «О команде» рисовал ленту без стиля:
   портреты шли столбиком, страница растягивалась на 11 553 точки. */
.команда{background:var(--графит);color:#fff}
.команда .над{color:#E9CDB7}
.команда__шапка{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;
  margin-bottom:38px;flex-wrap:wrap}
.команда__лид{font:300 27px/1.35 Cormorant,Georgia,serif;color:#E4E0DA;max-width:430px}
/* Вкладки городов над лентой. Разводят команды по городам: без них шесть
   петербуржцев и трое дубайцев шли одной строкой и читались как один офис. */
.город-вкл__ряд{display:flex;gap:10px;margin-bottom:26px;flex-wrap:wrap}
.город-вкл{display:inline-flex;align-items:center;gap:9px;font:300 15px/1 Museo,sans-serif;
  color:#B6B1AA;background:none;border:1px solid #34343B;border-radius:2px;padding:11px 18px;
  cursor:pointer;transition:.22s}
.город-вкл:hover{color:#fff;border-color:#57565F}
.город-вкл.вкл{color:var(--графит);background:#fff;border-color:#fff;font-weight:500}
.город-вкл__счёт{font-size:12px;color:#8B867E}
.город-вкл.вкл .город-вкл__счёт{color:var(--медь)}

/* Лента листается вбок. Обрезанная у правого края карточка выглядит поломкой,
   поэтому у кромки стоит растворение, а под лентой — подсказка словом. */
.лента__рамка[hidden]{display:none}
.лента__рамка{position:relative}
.лента__рамка::after{content:'';position:absolute;top:0;right:0;bottom:14px;width:110px;
  pointer-events:none;background:linear-gradient(90deg,rgba(22,22,26,0),var(--графит))}
/* Имя «лента» носят две разные вещи: полоса лиц, которая листается вбок, и
   липкая полоса якорей поверху карточки дома. Пока якорная полоса пряталась
   под шапкой, столкновения не было видно; с 2 сентября 2026 она стоит на
   виду, и правила разведены по тегу: лица живут в div, якоря — в nav. */
div.лента{display:flex;gap:22px;overflow-x:auto;padding-bottom:14px;scrollbar-width:thin;
  scroll-snap-type:x proximity}
.лицо{flex:0 0 232px;scroll-snap-align:start}
.лента__подсказка{margin-top:16px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:#88837C}
/* Лента с тремя лицами влезает на широкий экран целиком. Растворение у кромки
   и надпись «листайте вбок» в этом случае обещают то, чего нет, — прячем оба. */
.лента__рамка.влезла::after{display:none}
.лента__рамка.влезла .лента__подсказка{display:none}
.лицо img{width:232px;height:290px;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:.35s}
.лицо:hover img{filter:grayscale(0)}
.лицо__имя{margin-top:16px;font-size:17px;font-weight:500}
.лицо__кто{font-size:13px;color:#9A968F;margin-top:5px;line-height:1.4}


/* ── шапка
   Одна полоса вместо двух этажей. 31 августа 2026 сайт перешёл на оболочку
   новой редакции — ту же, что у главной: светлая бумага, лёгкое меню, медный
   ход «Заказать звонок». Прежняя шапка занимала 148 точек экрана из-за
   второго этажа с оранжевой кнопкой «Вся недвижимость» и строкой поиска.
   Поиск был нарисован, но не работал: обработчика у него не было ни дня —
   человек вводил название дома и не получал ничего. Пустое поле хуже его
   отсутствия, поэтому оно снято до того дня, когда поиск заработает.
   Вход в каталог не потерян: «Новостройки» — первый пункт меню. */
.шапка{--тон:#3A3733;--тон-ярче:var(--графит);--тон-тихий:var(--серый);
  --тон-лого:var(--медь-свет);--фон-шапки:rgba(250,248,245,.96);--кромка:var(--линия);
  --размыв:blur(6px);
  --рамка-города:#DDD6CB;--фон-города:rgba(255,255,255,.62);--тень-города:rgba(20,16,12,.05);
  position:sticky;top:0;z-index:60;height:62px;display:flex;align-items:center;
  background:var(--фон-шапки);border-bottom:1px solid var(--кромка);
  backdrop-filter:var(--размыв);transition:background .3s,border-color .3s}
/* Продолжение шапки вверх. Встроенный браузер Telegram (и Safari на новых
   iPhone) рисует страницу и под своей плашкой с адресом, а шапку ставит ниже
   плашки. В полосе между ними был виден прокрученный текст, шапка будто
   уезжала (снимок Константина 24 сентября 2026). Фон шапки тянется вверх на
   высоту экрана, поэтому над ней всегда её же цвет. Пока шапка прозрачная
   поверх кадра, продолжение тоже прозрачное. */
.шапка::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:100vh;
  background:inherit;pointer-events:none}
/* Продолжение сплошное: у светлой шапки фон чуть прозрачный, и сквозь
   продолжение просвечивала полоса разделов страницы. */
.шапка:not(.шапка--поверх)::before,.шапка--поверх.бела::before{background:#FAF8F5}
.шапка__нутро{display:flex;align-items:center;gap:28px;width:100%}
.шапка__лого{width:150px;flex:none;--лого:var(--тон-лого)}
.шапка__лого svg{width:100%;height:auto;display:block}
.шапка__меню{display:flex;align-items:center;gap:24px;margin-left:auto;font-size:13px;
  color:var(--тон);white-space:nowrap}
.шапка__меню>a:hover{color:var(--медь)}
.шапка__связь{display:flex;align-items:center;gap:18px;font-size:13px;color:var(--тон-ярче);
  flex:none}
.шапка__тел{white-space:nowrap}
.шапка__тг{display:flex;align-items:center;color:inherit;transition:color .2s}
.шапка__тг:hover{color:var(--медь)}
.панель__тг,.подвал__тг{display:inline-flex;align-items:center;gap:8px;font-size:14px}
.панель__тг:hover,.подвал__тг:hover{color:var(--медь)}
.подвал__тг{margin-top:12px}
.шапка__ход{color:var(--медь);border-bottom:1px solid rgba(176,117,90,.45);padding-bottom:2px;
  white-space:nowrap}
.шапка__ход:hover{border-bottom-color:var(--медь)}

/* Шапка поверх кадра. Страницы с полноэкранным героем — карточка дома,
   раздел Эмиратов, главная — начинаются кадром во всю ширину, и светлая
   полоса сверху резала его пополам. Здесь шапка лежит поверх кадра без фона,
   светлыми буквами, а как только человек тронул страницу, наливается бумагой:
   дальше внизу текст на светлом, и белые буквы на нём пропали бы.
   Переключается сменой тона, а не вторым набором правил: один и тот же
   каскад, разные переменные — иначе правку приходится вносить дважды. */
.шапка--поверх{position:fixed;left:0;right:0}
.шапка--поверх:not(.бела){--тон:rgba(255,255,255,.86);--тон-ярче:rgba(255,255,255,.94);
  --тон-тихий:rgba(255,255,255,.58);--тон-лого:var(--медь-свет);
  --фон-шапки:transparent;--кромка:transparent;--размыв:none;
  --рамка-города:rgba(255,255,255,.38);--фон-города:rgba(255,255,255,.12);
  --тень-города:transparent}
.шапка--поверх:not(.бела) .шапка__ход{color:var(--медь-свет);
  border-bottom-color:rgba(194,139,113,.55)}
.шапка--поверх:not(.бела) .гамбургер i{background:#fff}
/* Прозрачная шапка лежит на кадре дома, а кадр бывает светлым: на белом
   фасаде логотип и меню пропадали (отзыв Константина 23 сентября 2026).
   Тень под буквами держит их читаемыми на любом кадре и не видна на тёмном.
   На белой шапке (после прокрутки) тени нет — там буквы тёмные по светлому. */
.шапка--поверх:not(.бела){text-shadow:0 1px 14px rgba(13,12,11,.75),0 1px 3px rgba(13,12,11,.45)}
.шапка--поверх:not(.бела) .шапка__лого svg{filter:drop-shadow(0 1px 10px rgba(13,12,11,.7))}

/* Переключатель городов. До 2 сентября 2026 это был выпадающий список: одна
   надпись со стрелкой, а три города прятались под ней. Слово Константина
   2 сентября 2026: «неиспадающее меню по городам избыточное... лучше
   переключение по городам сделать просто кнопками, сразу будет видно, по
   каким городам мы работаем, и проще нажимать и переключаться. Но нужно
   как-то сделать очевидно, что они кликабельные».

   Отсюда три вещи: города стоят рядом и видны все сразу; общая рамка с
   заливкой читается как переключатель, а не как подпись; выбранный город
   залит медью. Нажимаемость показывает не стрелка, а форма — у списка её
   держала стрелка, у голых надписей не держало ничего. */
.город{flex:none;display:flex;align-items:center;gap:2px;padding:3px;
  border:1px solid var(--рамка-города);border-radius:999px;background:var(--фон-города);
  box-shadow:0 1px 2px var(--тень-города)}
.город__кн{font:500 11px/1 Museo,sans-serif;letter-spacing:.1em;text-transform:uppercase;
  color:var(--тон-тихий);padding:7px 14px;border-radius:999px;white-space:nowrap;
  transition:color .2s,background .2s}
.город__кн:hover{color:var(--тон-ярче);background:rgba(176,117,90,.11)}
.город__кн--выбран,.город__кн--выбран:hover{color:#fff;background:var(--медь);cursor:default}
/* Город без раздела не ссылка: вести туда, чего нет, — обещание, которое сайт
   не выполняет. Пометку «скоро» здесь ставить негде, поэтому такой город
   просто приглушён и не нажимается. */
.город__кн--нет,.город__кн--нет:hover{color:var(--тон-тихий);opacity:.45;
  background:none;cursor:default}


/* Пункт со списком раскрывается наведением и клавишей табуляции:
   без focus-within он недоступен с клавиатуры вовсе. */
.меню__гнездо{position:relative}
.меню__верх{display:flex;align-items:center;gap:6px;cursor:default}
.меню__верх:hover{color:var(--медь)}
.меню__верх i{font-style:normal;font-size:9px;color:var(--тон-тихий);transition:transform .2s}
.меню__гнездо:hover .меню__верх i{transform:rotate(180deg)}
.меню__низ{position:absolute;top:100%;left:-18px;padding-top:16px;
  opacity:0;visibility:hidden;transition:opacity .18s}
.меню__гнездо:hover .меню__низ,.меню__гнездо:focus-within .меню__низ{
  opacity:1;visibility:visible}
.меню__низ span{display:block;min-width:196px;background:#fff;
  border:1px solid var(--линия);box-shadow:0 14px 34px rgba(20,16,12,.13);padding:6px 0}
.меню__низ a{display:block;padding:10px 18px;font-size:14px;color:var(--графит)}
.меню__низ a:hover{background:var(--крем);color:var(--медь)}

/* ── меню на узком экране
   Ниже 1180 точек строка разделов не помещается рядом с телефоном и прячется.
   До 13 августа 2026 взамен не появлялось ничего: с телефона по сайту нельзя
   было уйти с главной. Здесь — кнопка и выезжающая панель со всеми разделами. */
.гамбургер{display:none;width:44px;height:44px;margin-right:-10px;align-items:center;
  justify-content:center;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer}
.гамбургер i{display:block;width:22px;height:1.5px;background:var(--тон-ярче);transition:.25s}
.гамбургер.открыт i:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.гамбургер.открыт i:nth-child(2){opacity:0}
.гамбургер.открыт i:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
/* Панель лежит внутри шапки, поэтому полоса шапки поднята над ней: иначе
   панель накрывает собственную кнопку, и закрыть её нечем — открыл разделы
   и остался в них навсегда, кнопка «назад» из этого не выводит. */
.шапка__нутро{position:relative;z-index:70}
.панель{display:none;position:fixed;left:0;right:0;top:0;bottom:0;z-index:65;
  background:var(--бумага);padding:92px var(--поле) 40px;overflow-y:auto}
.панель.открыта{display:block}
/* Экран стал широким (повернули планшет) — панель уходит сама: строка разделов
   на этой ширине уже видна, а открытая панель накрыла бы весь сайт. */
@media(min-width:1180px){.панель{display:none!important}}
.панель__всё{display:flex;align-items:center;gap:12px;height:54px;
  color:var(--медь);font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;border-bottom:1px solid var(--линия);margin-bottom:8px}
.панель__список a{display:block;font-size:19px;padding:15px 2px;border-bottom:1px solid #E3DCD2}
/* Города стоят первой строкой панели: на телефоне это главный переключатель
   сайта, и искать его под всеми разделами человек не станет. */
.панель__города{margin-bottom:26px}
.панель__города-над{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8F8A83;
  margin-bottom:6px}
.панель__город{display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-size:17px;padding:12px 2px;border-bottom:1px solid #E3DCD2;color:var(--графит)}
.панель__город--выбран{font-weight:500;color:var(--медь)}
.панель__город--нет{color:#9A968F}
.панель__город i{font-style:normal;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:#B3ADA5}
.панель__низ{margin-top:30px;display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.панель__тел{font-size:26px;font-weight:500}

/* ── хлебные крошки и заголовок страницы */
/* Перенос обязателен: на телефоне цепочка «Главная · Петербург · Новостройки ·
   Дом Передвижники» в одну строку не влезает и последнее звено, то есть имя
   самого дома, обрезается краем экрана. */
.крошки{font-size:13px;color:#8A8A90;padding:26px 0 0;display:flex;gap:9px;align-items:center;
  flex-wrap:wrap;row-gap:4px}
.крошки a:hover{color:var(--медь)}
.крошки span{color:#B9B4AD}

/* ── формы */
.поле label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:#7A7A80;margin-bottom:8px}
/* Выпадающий список рисуется своими руками. Нативный вид браузера тащил за
   собой системный шрифт и серый градиент: на кремовой полосе фильтра три
   таких списка выбивались из всей страницы. Стрелка своя, картинкой в стиле. */
.поле input,.поле select{width:100%;height:56px;padding:0 16px;border:1px solid #DDD3C8;background:#fff;
  font:300 15px/1 Museo,sans-serif;outline:0;color:var(--графит);border-radius:0;
  -webkit-appearance:none;appearance:none}
.поле select{padding-right:38px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' fill='none' stroke='%23967F6B' stroke-width='1.4'%3E%3Cpath d='M1 1l4.5 4.5L10 1'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center}
.поле input:focus,.поле select:focus{border-color:var(--медь)}
.комнаты{display:flex;gap:0}
.комнаты span{flex:1;height:56px;display:flex;align-items:center;justify-content:center;
  border:1px solid #DDD3C8;margin-left:-1px;background:#fff;cursor:pointer;font-size:14px;user-select:none}
.комнаты span:first-child{margin-left:0}
.комнаты span.вкл{background:var(--медь);border-color:var(--медь);color:#fff}
/* Галочка согласия. Раньше строка была флексом, и «Соглашаюсь с» со ссылкой
   на политику становились двумя отдельными столбцами: на телефоне получалась
   лесенка из трёх кусков вместо одной фразы. Теперь это обычная строка текста,
   а галочка обтекается слева. */
.согласие{margin-top:16px;font-size:12px;line-height:1.5;color:#84848A;display:block;
  padding-left:26px;position:relative}
.согласие input{position:absolute;left:0;top:2px;margin:0}
/* Согласие кнопкой: строка без галочки, отступ под неё не нужен. */
.согласие--кнопка{padding-left:0}
/* Вторая галочка — реклама и рассылки. По закону о рекламе это отдельное
   согласие, требовать его как условие ответа нельзя, поэтому она
   необязательная и стоит отдельной строкой. */
.согласие--реклама{margin-top:8px}
/* Полоса о куках. Появляется одна на всё посещение и уходит навсегда, как
   только человек её закрыл: пометка живёт в браузере, а не у нас. Слева внизу,
   узкой карточкой — на телефоне она не должна закрывать кнопку звонка. */
.куки{position:fixed;left:16px;bottom:16px;z-index:70;max-width:380px;
  background:#FFFFFF;border:1px solid rgba(22,22,26,.1);box-shadow:0 10px 40px rgba(22,22,26,.12);
  padding:16px 18px;font-size:12px;line-height:1.5;color:#3A383A}
.куки p{margin:0 0 12px}
.куки a{color:#B0755A;text-decoration:underline}
.куки button{font:inherit;font-size:12px;letter-spacing:.04em;text-transform:uppercase;
  padding:9px 18px;border:0;background:#16161A;color:#F4F1EC;cursor:pointer}
.куки button:hover{background:#B0755A}
.куки__кнопки{display:flex;gap:8px;flex-wrap:wrap}
.куки button.куки__нет{background:transparent;color:#16161A;border:1px solid rgba(22,22,26,.25)}
.куки button.куки__нет:hover{background:transparent;color:#B0755A;border-color:#B0755A}
/* На телефоне полоса поднята над нижней полоской страницы дома: там кнопка
   «Позвонить», и закрывать её нельзя. Полоска ростом 62 пикселя, так что
   над ней хватает 74 — прежние 96 оставляли между ними пустую щель.
   Заодно на телефоне окно сжато: отступы меньше, кнопки ниже и в один ряд
   пополам. Вместе с полоской окно забирало треть экрана. */
@media(max-width:900px){
  .куки{left:12px;right:12px;bottom:74px;max-width:none;padding:12px 14px;
    font-size:11.5px;line-height:1.45}
  .куки p{margin:0 0 10px}
  .куки__кнопки{flex-wrap:nowrap}
  .куки button{flex:1;padding:8px 10px}
}
/* Ловушка от роботов: человек её не видит и не может выделить клавишей Tab,
   робот заполняет всё подряд. Прятать через display:none нельзя — часть
   роботов такие поля пропускает именно поэтому. */
.ловушка{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;
  pointer-events:none}
/* Ответ формы: и «спасибо», и объяснение, почему не ушло. Место под него
   держится всегда — иначе строка выталкивает кнопку из-под пальца в тот
   момент, когда человек по ней целится. */
.форма__ответ{grid-column:1/-1;margin-top:12px;font-size:14px;line-height:1.5;
  min-height:21px}
.форма__ответ.плохо{color:#B4342A}
.форма__ответ.хорошо{color:#2F7A4B}
input.неверно, select.неверно{border-color:#B4342A}

/* ── подвал. Светлый и низкий: до 17 сентября 2026 он занимал пол-экрана
   графитом и нёс три столбца ссылок. Осталось нужное — связь, разделы строкой,
   офис города страницы и правовая приписка. */
.подвал{background:var(--крем);color:var(--серый);border-top:1px solid var(--линия);
  padding:40px 0 26px;font-size:13.5px}
.подвал__верх{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:40px;
  align-items:start;padding-bottom:26px;border-bottom:1px solid var(--линия)}
.подвал__лого{display:block;width:132px;--лого:var(--медь-свет)}
.подвал__лого svg{width:100%;height:auto}
.подвал__тел{font-family:Cormorant,Georgia,serif;font-size:26px;color:var(--графит);
  font-weight:300;margin:12px 0 14px;display:block;letter-spacing:.01em}
.подвал__связь .кн{height:40px;padding:0 20px;font-size:11px}
/* Кнопка и Телеграм одной строкой с зазором и по одной средней линии. До
   19 сентября 2026 ссылка липла к кнопке вплотную и сидела ниже неё. */
.подвал__кнопки{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px}
.подвал__кнопки .подвал__тг{margin-top:0}
/* Разделы идут сеткой, а не строкой: при переносе последний пункт не висит
   одиноким хвостом под длинным первым рядом (19 сентября 2026). */
.подвал__разделы{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,max-content));
  gap:10px 26px;padding-top:6px}
.подвал__разделы a{color:var(--графит)}
/* Средняя колонка подвала: строка разделов и под ней строка подборок. До
   18 сентября 2026 разделы стояли в сетке сами по себе, и добавленная рядом
   строка подборок ломала три колонки на четыре. */
.подвал__середина{min-width:0}
.подвал__подборки{margin-top:16px;padding-top:14px;border-top:1px solid var(--линия)}
.подвал__подборки b{display:block;color:var(--графит);font-weight:500;
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
.подвал__подборки-список{display:flex;flex-wrap:wrap;gap:8px 22px}
.подвал__подборки-список a{color:var(--серый)}
.подвал__офис{text-align:right;line-height:1.6;max-width:380px;justify-self:end}
/* Адрес офиса тем же кеглем, что соседние строки, и переносы поровну:
   длинный адрес Дубая рвался на «4-F1-» и одинокое «455». */
.подвал__офис b{display:block;color:var(--графит);font-weight:500;font-size:13.5px;
  text-wrap:balance}
.подвал__офис span{display:block;margin-top:6px;font-size:12.5px;text-wrap:balance}
.подвал__офис .без-переноса{display:inline;margin:0;font-size:inherit;white-space:nowrap}
.подвал__офис a{display:inline-block;margin-top:8px;text-decoration:underline}
.подвал a:hover{color:var(--медь)}
.соцсети{display:flex;gap:10px;margin-top:14px;justify-content:flex-end}
.соцсети a{width:34px;height:34px;border:1px solid var(--линия);display:flex;
  align-items:center;justify-content:center;font-size:11px}
.соцсети a:hover{border-color:var(--медь);color:var(--медь)}
.подвал__низ{padding-top:18px;font-size:11.5px;line-height:1.6;color:#8A8680}
.подвал__низ a{text-decoration:underline}
.подвал__низ p{margin-bottom:7px;max-width:110ch}

/* Средние экраны. Города встали в шапку тремя кнопками и заняли 281 точку
   вместо 96 у прежней надписи со стрелкой — на ноутбуке 1280 строка разделов
   от этого наезжала на «Заказать звонок». Здесь и города, и разделы поджаты:
   те же слова, теснее шаг. */
@media(max-width:1319px){
  .шапка__нутро{gap:20px}
  .шапка__меню{gap:17px}
  .город__кн{padding:7px 10px;letter-spacing:.05em}
}
/* Порог — 1239: ниже него строка разделов не помещается рядом с телефоном
   и распирает страницу вбок. Взамен появляется кнопка меню. */
@media(max-width:1239px){
  .шапка__меню{display:none}
  .гамбургер{display:flex}
  .шапка__связь{margin-left:auto}
  .подвал__верх{grid-template-columns:1fr;gap:24px}
  .подвал__офис{text-align:left;justify-self:start}
  .соцсети{justify-content:flex-start}
}
@media(max-width:900px){
  .обёртка{padding:0 22px}
  :root{--поле:22px}
  .шапка{height:58px}
  .шапка__нутро{gap:16px}
  .шапка__лого{width:124px}
  /* Город и медный ход на телефоне уходят: и то и другое есть в панели. */
  .город,.шапка__ход{display:none}
  .панель{padding-top:80px}
  .раздел{padding:58px 0}
  .заголовок{font-size:27px}
  .подвал__верх{grid-template-columns:1fr;gap:22px}
}
/* Совсем узкие экраны: логотип, номер и кнопка меню в одну строку помещаются
   только так. Номер не убираем — на телефоне это самое короткое действие. */
@media(max-width:460px){
  .шапка__нутро{gap:12px}
  .шапка__лого{width:106px}
  .шапка__тел{font-size:12px}
}