/* ==========================================================================
   Иллидиум — главная страница
   Токены и размеры взяты из Figma (файл NRffA4e977SQx78DwtAmWO, узел 54:773)
   ========================================================================== */

/* --- Шрифт --------------------------------------------------------------- */
@font-face {
  font-family: 'Wix Madefor Text';
  font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/wm-400-cyr.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Wix Madefor Text';
  font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/wm-400-lat.woff2') format('woff2');
}
@font-face {
  font-family: 'Wix Madefor Text';
  font-style: normal; font-weight: 500; font-display: swap;
  src: url('../fonts/wm-500-cyr.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Wix Madefor Text';
  font-style: normal; font-weight: 500; font-display: swap;
  src: url('../fonts/wm-500-lat.woff2') format('woff2');
}
@font-face {
  font-family: 'Wix Madefor Text';
  font-style: normal; font-weight: 600; font-display: swap;
  src: url('../fonts/wm-600-cyr.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Wix Madefor Text';
  font-style: normal; font-weight: 600; font-display: swap;
  src: url('../fonts/wm-600-lat.woff2') format('woff2');
}

/* --- Токены -------------------------------------------------------------- */
:root {
  --black-900: #2e383f;
  --black-700: rgba(46, 56, 63, .7);
  --black-500: rgba(46, 56, 63, .5);
  --white-900: #ffffff;
  --white-800: rgba(255, 255, 255, .8);
  --white-500: rgba(255, 255, 255, .5);
  --white-200: rgba(255, 255, 255, .2);
  --blue-900: #007ca4;
  --blue-100: rgba(0, 124, 164, .1);
  --blue-80:  rgba(0, 124, 164, .08);
  --gray-900: #6d7479;
  --gray-700: #999ea2;
  --gray-500: #b6babc;
  --bg:       #f2f4f6;
  --border:   #dde1e8;
  --bg-btn-hover: #eaebee;
  --tg: #009cea;  --tg-light: rgba(0, 156, 234, .1);
  --vk: #0077ff;  --vk-light: rgba(0, 119, 255, .1);

  --r-none: 0;  --r-tertiary: 6px; --r-secondary: 10px;
  --r-primary: 16px; --r-section: 30px; --r-full: 48px;

  --sp-2: 4px; --sp-3: 8px; --sp-4: 12px; --sp-5: 16px; --sp-6: 20px; --sp-11: 40px;

  --container: 1320px;
  --gutter: 60px;
}

/* --- База ---------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--black-900);
  font-family: 'Wix Madefor Text', -apple-system, 'Segoe UI', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: -.5px;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; }
ul { margin: 0; padding: 0; list-style: none; }

.container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }

/* --- Типографика --------------------------------------------------------- */
.h2 { font-size: 40px; font-weight: 600; line-height: 1.12; letter-spacing: -1.5px; margin: 0; }
.h5 { font-size: 24px; font-weight: 600; line-height: 1.25; letter-spacing: -1px; margin: 0; }
.h6 { font-size: 20px; font-weight: 600; line-height: 1.3;  letter-spacing: -.7px; margin: 0; }
.accent { color: var(--blue-900); }
.t-14 { font-size: 14px; line-height: 1.4; letter-spacing: -.4px; }
.t-13 { font-size: 13px; line-height: 1.35; letter-spacing: -.4px; }
.muted { color: var(--gray-900); }

/* --- Кнопки -------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-3);
  border-radius: var(--r-secondary); font-weight: 600; line-height: 1.25;
  transition: background-color .15s ease, color .15s ease;
}
.btn--primary { background: var(--blue-900); color: #fff; padding: 15px 24px; font-size: 16px; letter-spacing: -.5px; }
.btn--primary:hover { background: #006688; }
.btn--sm { padding: 11px 20px; font-size: 14px; letter-spacing: -.3px; }
.btn--ghost { background: var(--blue-100); color: var(--blue-900); padding: 11px 16px; font-size: 14px; letter-spacing: -.3px; gap: var(--sp-2); }
.btn--ghost:hover { background: rgba(0, 124, 164, .16); }

.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border-radius: var(--r-full); padding: 10px;
  box-shadow: 0 2px 8px rgba(46, 56, 63, .08);
  transition: transform .15s ease, background-color .15s ease;
}
.icon-btn:hover { background: var(--bg-btn-hover); }
.icon-btn--lg { padding: 12px; }
/* Круг 40/48 px, внутри — шеврон в натуральную величину (SVG 9.83×4.83 и 11.5×5.5),
   как в макете: бокс иконки 20/24 px, сам вектор заметно меньше. */
.icon-btn { width: 40px; height: 40px; }
.icon-btn--lg { width: 48px; height: 48px; }
.icon-btn img { width: 9.83px; height: 4.83px; }
.icon-btn--lg img { width: 11.5px; height: 5.5px; }

/* Экспортированные из Figma стрелки смотрят вниз — направление задаётся поворотом,
   как в макете (обёртки rotate-90 / -rotate-90). */
.btn--ghost img, .buy__arrow img,
.slider__nav--next img, .promo-white__arrow img,
.page-hero__nav .icon-btn:last-child img { transform: rotate(-90deg); }
.slider__nav--prev img,
.page-hero__nav .icon-btn:first-child img { transform: rotate(90deg); }
.btn--ghost img { width: 9px; height: 4.5px; }

.social {
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--r-secondary); transition: background-color .15s ease;
}
.social--tg { background: var(--tg-light); }
.social--vk { background: var(--vk-light); }
.social--solid.social--tg { background: var(--tg); }
.social--solid.social--vk { background: var(--vk); }

/* --- Бейджи -------------------------------------------------------------- */
.badge {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 5px 10px; border-radius: var(--r-tertiary);
  font-size: 13px; font-weight: 500; line-height: 1.35; letter-spacing: -.4px; white-space: nowrap;
}
.badge--blue  { background: var(--blue-900); color: #fff; }
.badge--glass { background: var(--black-500); color: #fff; backdrop-filter: blur(10px); }
.badge--white { background: #fff; color: var(--black-900); }
.badge--light { background: #fff; color: var(--gray-900); backdrop-filter: blur(10px); }

/* ==========================================================================
   Шапка
   ========================================================================== */
.header { position: sticky; top: 0; z-index: 50; padding-top: 20px; }
.header__inner {
  display: flex; align-items: center; justify-content: space-between;
  background: #fff; border-radius: var(--r-primary); padding: 8px;
  box-shadow: 0 4px 20px rgba(46, 56, 63, .06);
}
.header__logo { width: 164px; height: 30px; }
.nav { display: flex; align-items: center; }
.nav__item {
  display: flex; align-items: center; gap: 2px;
  padding: 10px 12px; border-radius: 8px;
  font-size: 14px; font-weight: 500; line-height: 1.4; letter-spacing: -.4px; white-space: nowrap;
  transition: background-color .15s ease;
}
.nav__item:hover { background: var(--bg); }
.nav__item img { width: 16px; height: 16px; }
.header__contacts { display: flex; align-items: center; gap: var(--sp-5); }
.header__phone { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: center; white-space: nowrap; }
.header__phone b { font-size: 15px; font-weight: 600; line-height: 1.35; letter-spacing: -.5px; }
.header__phone span { font-size: 13px; line-height: 1.35; letter-spacing: -.4px; color: var(--gray-900); }
.header__social { display: flex; align-items: center; gap: var(--sp-3); }
.header__social .social { width: 40px; height: 40px; }
.header__social .social img { width: 14px; height: auto; }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero { padding: 36px 0 90px; }
.hero__grid { display: grid; grid-template-columns: 873fr 427fr; gap: var(--sp-6); align-items: start; }
.hero__aside { display: flex; flex-direction: column; gap: var(--sp-6); }

.slider { position: relative; height: 600px; border-radius: var(--r-primary); overflow: hidden; background: #fff; }
.slider__track { display: flex; height: 100%; transition: transform .45s cubic-bezier(.4, 0, .2, 1); }
.slider__slide { flex: 0 0 100%; height: 100%; }
.slider__slide img { width: 100%; height: 100%; object-fit: cover; }
.slider__nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; }
.slider__nav--prev { left: 20px; }
.slider__nav--next { right: 20px; }

.promo {
  position: relative; height: 380px; border-radius: var(--r-primary);
  overflow: hidden; background: #6aaad6; color: #fff;
}
.promo__img { position: absolute; inset: -18px -35px auto; width: 516px; height: 416px; object-fit: cover; }
.promo__title { position: absolute; left: 24px; top: 24px; width: 205px; font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: -1px; }
.promo__tags { position: absolute; left: 24px; top: 328px; display: flex; gap: 6px; }

.promo-white {
  position: relative; height: 200px; background: #fff;
  border-radius: var(--r-primary); overflow: hidden;
}
.promo-white__title { position: absolute; left: 24px; top: 24px; width: 155px; font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: -1px; }
.promo-white__text { position: absolute; left: 24px; top: 116px; width: 159px; font-size: 14px; line-height: 1.4; letter-spacing: -.4px; color: var(--gray-900); }
.promo-white__img { position: absolute; left: 244px; top: 24px; width: 149px; height: 212px; object-fit: contain; object-position: bottom; }
.promo-white__arrow { position: absolute; left: 363px; bottom: 24px; background: var(--bg); box-shadow: none; }

/* ==========================================================================
   Белое полотно контента
   ========================================================================== */
.content {
  position: relative; z-index: 1;
  background: #fff;
  border-radius: var(--r-section) var(--r-section) 0 0;
  margin-top: -30px;
  padding: 60px 0 70px;
}
.section + .section { margin-top: 100px; }
.section__head { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: var(--sp-11); }
.section__title { margin-bottom: var(--sp-11); }

/* ==========================================================================
   Новостройки
   ========================================================================== */
.jk-grid { display: flex; flex-wrap: wrap; gap: 40px 30px; }
.jk { display: flex; flex-direction: column; gap: var(--sp-4); }
.jk--wide { width: 100%; }
.jk--half { width: calc((100% - 30px) / 2); }

.jk__media { position: relative; z-index: 2; height: 420px; border-radius: var(--r-primary); overflow: hidden; background: #fff; }
.jk--wide .jk__media { height: 600px; }
.jk__media img { width: 100%; height: 100%; object-fit: cover; }
.jk__badges { position: absolute; left: 12px; right: 12px; top: 12px; display: flex; align-items: center; justify-content: space-between; }
.jk__badges-left { display: flex; align-items: center; gap: 8px; }
.jk__dots { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); display: flex; align-items: center; gap: 4px; }
.jk__dots span { width: 20px; height: 2px; border-radius: var(--r-full); background: rgba(255, 255, 255, .2); backdrop-filter: blur(10px); }
.jk__dots span.is-active { background: #fff; }

.jk__meta {
  position: relative; z-index: 1; margin-top: -20px;
  display: flex; align-items: center; gap: var(--sp-5);
  background: var(--bg); border-radius: 0 0 var(--r-primary) var(--r-primary);
  padding: 36px 20px 16px;
}
.jk__meta-item { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.jk__meta-item img { width: 18px; height: 18px; }
.jk__foot { display: flex; align-items: baseline; justify-content: space-between; }
.jk__price { font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -.5px; text-align: right; }

/* ==========================================================================
   Блок с менеджером и формой
   ========================================================================== */
.lead { display: grid; grid-template-columns: 762fr 538fr; gap: var(--sp-6); align-items: stretch; }
.lead__promo {
  position: relative; border-radius: var(--r-primary);
  background: linear-gradient(132.57deg, #e6f2f6 35.16%, #cce5ed 100%);
  padding: 30px; min-height: 350px;
}
.lead__title { width: 367px; font-size: 26px; font-weight: 600; line-height: 1.2; letter-spacing: -1px; margin-bottom: 10px; }
.lead__text { width: 273px; font-size: 16px; line-height: 1.4; letter-spacing: -.5px; color: var(--gray-900); }
/* Как в макете: кадр 362×380, фото выступает над карточкой на 30 px и ею не обрезается.
   object-fit: fill — так задано в макете (исходник 572×1024 подгоняется под кадр). */
.lead__img { position: absolute; right: 24px; top: -30px; width: 362px; height: 380px; object-fit: fill; }
.lead__social { position: absolute; left: 30px; bottom: 30px; display: flex; align-items: center; gap: var(--sp-4); width: 240px; }
.lead__social .social { width: 48px; height: 48px; }
.lead__social .social img { width: 16px; height: auto; }
.lead__social p { font-size: 14px; line-height: 1.35; letter-spacing: -.4px; color: var(--gray-900); }

.form {
  display: flex; flex-direction: column; justify-content: center; gap: 24px;
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-primary); padding: 30px;
}
.form__fields { display: flex; flex-direction: column; gap: var(--sp-4); }
.input {
  width: 100%; background: #fff; border: 1px solid var(--border); border-radius: var(--r-secondary);
  padding: 12px var(--sp-5); font-size: 14px; line-height: 1.4; letter-spacing: -.4px;
  color: var(--black-900); font-family: inherit;
}
.input::placeholder { color: var(--black-500); }
.input:focus { outline: none; border-color: var(--blue-900); }
.select-wrap { position: relative; }
.select-wrap img { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; pointer-events: none; }
select.input { appearance: none; color: var(--black-500); }
.checks { display: flex; flex-direction: column; gap: var(--sp-3); }
.check { display: flex; align-items: center; gap: 10px; font-size: 13px; line-height: 1.45; letter-spacing: -.065px; color: var(--black-700); }
.check input { appearance: none; flex: 0 0 auto; width: 20px; height: 20px; margin: 0; background: #fff; border: 1px solid var(--border); border-radius: var(--r-tertiary); cursor: pointer; }
.check input:checked { background: var(--blue-900) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7'/%3E%3C/svg%3E") center/16px no-repeat; border-color: var(--blue-900); }
.check a { color: var(--blue-900); text-decoration: underline; }

/* ==========================================================================
   Специальные цены
   ========================================================================== */
.tabs { display: flex; align-items: center; gap: 10px; }
.tab {
  padding: 9px var(--sp-5); border-radius: var(--r-secondary); background: var(--bg);
  font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.5px; color: var(--gray-900);
  transition: background-color .15s ease, color .15s ease;
}
.tab:hover { background: var(--bg-btn-hover); }
.tab.is-active { background: var(--blue-900); color: #fff; }

.flats { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); }
.flat { display: flex; flex-direction: column; }
.flat__card {
  position: relative; z-index: 2;
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-primary); overflow: hidden;
}
.flat__head { display: flex; align-items: baseline; gap: var(--sp-6); padding: var(--sp-5) 20px; }
.flat__head b { flex: 1; font-size: 16px; font-weight: 500; letter-spacing: -.5px; }
.flat__head span { flex: 1; text-align: right; font-size: 14px; letter-spacing: -.4px; color: var(--gray-900); }
.flat__plan { display: flex; align-items: center; justify-content: center; padding: 0 67px; }
.flat__plan img { width: 200px; height: 200px; object-fit: contain; }
.flat__body { display: flex; flex-direction: column; gap: var(--sp-5); padding: 20px; }
.flat__params { display: flex; align-items: center; gap: var(--sp-3); font-size: 14px; font-weight: 500; letter-spacing: -.4px; }
.flat__params i { width: 3px; height: 3px; border-radius: 50%; background: var(--gray-500); }
.flat__params sup { font-size: 9px; }
.flat__price { display: flex; align-items: baseline; gap: 8px; }
.flat__price b { font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.7px; }
.flat__price s { font-size: 14px; line-height: 1.25; letter-spacing: -.4px; color: var(--gray-700); }
.flat__opts { font-size: 14px; line-height: 1.4; letter-spacing: -.4px; color: var(--gray-900); margin-top: 4px; }
.flat__foot {
  position: relative; z-index: 1; margin-top: -20px;
  display: flex; align-items: center; justify-content: space-between;
  background: var(--bg); border-radius: 0 0 var(--r-primary) var(--r-primary);
  padding: 34px 20px 16px;
}
.flat__sale { display: flex; align-items: center; gap: var(--sp-2); font-size: 14px; font-weight: 600; letter-spacing: -.3px; color: var(--blue-900); }
.flat__sale img { width: 20px; height: 20px; }
.flat__until { font-size: 14px; letter-spacing: -.4px; color: var(--black-500); }

/* ==========================================================================
   Больше, чем квадратные метры
   ========================================================================== */
.more { display: grid; grid-template-columns: 1fr 538px; gap: var(--sp-6); align-items: stretch; }
.more__media { position: relative; border-radius: var(--r-primary); overflow: hidden; min-height: 520px; }
.more__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.more__media::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .1); }
.more__lead { width: 430px; font-size: 18px; line-height: 1.45; letter-spacing: -.5px; color: var(--gray-900); }

.acc { display: flex; flex-direction: column; gap: 12px; }
.acc__item { background: var(--bg); border-radius: var(--r-primary); overflow: hidden; transition: background-color .2s ease; }
.acc__item.is-open { background: var(--blue-900); }
.acc__btn { display: flex; align-items: center; gap: var(--sp-5); width: 100%; padding: 24px; text-align: left; }
.acc__icon { flex: 0 0 26px; width: 26px; height: 26px; }
.acc__label { flex: 1; }
.acc__item.is-open .acc__label { color: #fff; }
.acc__toggle { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: var(--r-secondary); padding: 8px; }
.acc__item.is-open .acc__toggle { background: var(--white-200); }
.acc__toggle img { width: 20px; height: 20px; transition: transform .2s ease; }
.acc__item.is-open .acc__toggle img { transform: rotate(90deg); }
.acc__panel { display: none; padding: 0 24px 24px; color: #fff; font-size: 16px; line-height: 1.5; letter-spacing: -.5px; }
.acc__item.is-open .acc__panel { display: block; }

/* ==========================================================================
   Способы покупки
   ========================================================================== */
.buy { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }
.buy__card { position: relative; height: 300px; background: var(--bg); border-radius: var(--r-primary); overflow: hidden; }
.buy__text { position: absolute; left: 24px; top: 24px; display: flex; flex-direction: column; gap: var(--sp-3); max-width: 200px; }
.buy__text p { font-size: 16px; line-height: 1.35; letter-spacing: -.5px; color: var(--gray-900); }
.buy__card--wide .buy__text { max-width: 379px; }
.buy__img { position: absolute; right: 0; bottom: 0; height: 253px; object-fit: contain; object-position: bottom right; }
.buy__card--2 .buy__img { right: 30px; height: 247px; }
.buy__card--3 .buy__img { height: 247px; }
.buy__pin { position: absolute; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; }
/* Подложка пина — SVG 100×100: круг 50 px плюс запас под тень (в макете inset -34% -50% -66% -50%) */
.buy__pin img.buy__pin-bg { position: absolute; left: -25px; top: -17px; width: 100px; height: 100px; max-width: none; }
.buy__pin img.buy__pin-ic { position: relative; width: 24px; height: 24px; }
.buy__arrow { position: absolute; left: 24px; bottom: 24px; }

/* ==========================================================================
   О компании (4000+ семей)
   ========================================================================== */
.about__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: var(--sp-11); }
.about__head .h2 { width: 762px; line-height: 1.2; }
.about__head p { width: 427px; font-size: 16px; line-height: 1.4; letter-spacing: -.5px; color: var(--gray-900); }
.about__grid { display: flex; flex-wrap: wrap; gap: var(--sp-6); }
.about__cell { height: 360px; border-radius: var(--r-primary); overflow: hidden; }
.about__cell--wide { width: 650px; position: relative; background: linear-gradient(241deg, #34b0d8 0%, #007ca4 100%); }
.about__cell--sm { width: 315px; }
.about__cell--photo img { width: 100%; height: 100%; object-fit: cover; }
.about__slogan { position: absolute; left: 24px; top: 24px; width: 337px; font-size: 22px; font-weight: 600; line-height: 1.25; letter-spacing: -1px; color: #fff; }
.about__logo { position: absolute; left: 24px; top: 302px; width: 186px; height: 34px; }
.about__cell--wide > img.about__photo { position: absolute; left: 385px; top: 0; width: 265px; height: 360px; object-fit: contain; object-position: bottom; }

.about__card {
  display: flex; flex-direction: column; justify-content: space-between;
  background: #fff; border: 1px solid var(--border); padding: 24px;
}
.about__card--teal { background: #70b8bf; border-color: #70b8bf; }
.about__card h3 { margin: 0 0 12px; font-size: 22px; font-weight: 600; line-height: 1.25; letter-spacing: -1px; }
.about__card p { font-size: 16px; line-height: 1.5; letter-spacing: -.5px; color: var(--gray-900); }
.about__card--teal h3 { color: #fff; }
.about__card--teal p { color: var(--white-800); }
.about__ic { align-self: flex-start; display: flex; align-items: center; background: var(--blue-80); border-radius: var(--r-secondary); padding: 15px; }
.about__card--teal .about__ic { background: var(--white-200); }
.about__ic img { width: 24px; height: 24px; }

/* ==========================================================================
   Новости
   ========================================================================== */
.news { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }
.news__card { display: flex; flex-direction: column; gap: var(--sp-4); }
.news__top {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: space-between;
  background: var(--bg); border-radius: var(--r-primary) var(--r-primary) 0 0;
  padding: 12px 20px 32px; margin-bottom: -20px;
  font-size: 13px; font-weight: 500; line-height: 1.35; letter-spacing: -.5px;
}
.news__date { color: var(--gray-700); }
.news__read { color: var(--blue-900); }
.news__media { position: relative; z-index: 2; height: 240px; border-radius: var(--r-primary); overflow: hidden; background: var(--bg-btn-hover); }
.news__media img { width: 100%; height: 100%; object-fit: cover; }
.news__title { max-width: 345px; font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -.5px; }

/* ==========================================================================
   Внутренние страницы: крошки, заголовок, переключатель
   ========================================================================== */
.content--inner { padding-top: 40px; margin-top: 0; border-radius: 0; }
.crumbs { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 1.4; letter-spacing: -.4px; color: var(--gray-900); margin-bottom: 16px; }
.crumbs a:hover { color: var(--blue-900); }
.crumbs__current { color: var(--black-900); }

.page-head { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: var(--sp-11); }
.crumbs--center { justify-content: center; }
.page-title { text-align: center; margin-bottom: 24px; }

.btn--outline { background: #fff; border: 1px solid var(--border); color: var(--black-900); padding: 15px 40px; font-size: 16px; letter-spacing: -.5px; }
.btn--outline:hover { background: var(--bg); }
.load-more { display: flex; justify-content: center; margin-top: var(--sp-11); }

.news--grid { grid-template-columns: repeat(3, 1fr); gap: 40px var(--sp-6); }
.news--grid .news__title { max-width: none; }

/* ==========================================================================
   Обложка внутренней страницы (фото на всю ширину)
   ========================================================================== */
.page-hero { position: relative; min-height: 500px; display: flex; align-items: flex-end; padding-bottom: 80px; overflow: hidden; }
.page-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.page-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(46,56,63,.45) 0%, rgba(46,56,63,.15) 45%, rgba(46,56,63,.55) 100%); }
.page-hero__inner { position: relative; z-index: 2; color: #fff; }
.page-hero__title { color: #fff; margin-bottom: 12px; }
.page-hero__lead { font-size: 16px; line-height: 1.45; letter-spacing: -.5px; color: rgba(255,255,255,.9); }
.crumbs--light { color: rgba(255,255,255,.8); margin-bottom: 100px; }
.crumbs--light .crumbs__current { color: #fff; }
.crumbs--light a:hover { color: #fff; }

/* ==========================================================================
   Способы покупки
   ========================================================================== */
.buy-pane { display: none; }
.buy-pane.is-active { display: block; }

/* Вкладки способов покупки: активная — белая на светлой подложке (как в макете) */
.tabs[data-buytabs] { background: var(--bg); border-radius: var(--r-secondary); padding: 4px; gap: 0; }
.tabs[data-buytabs] .tab { background: transparent; padding: 9px 24px; }
.tabs[data-buytabs] .tab:hover { background: rgba(255, 255, 255, .5); }
.tabs[data-buytabs] .tab.is-active { background: #fff; color: var(--black-900); box-shadow: 0 2px 6px rgba(46, 56, 63, .06); }

.offer { display: grid; grid-template-columns: 430px 1fr; gap: var(--sp-6); align-items: stretch; }
.offer__text { display: flex; flex-direction: column; background: var(--bg); border-radius: var(--r-primary); padding: 24px; min-height: 480px; }
.offer__title { margin: 0 0 12px; font-size: 32px; font-weight: 600; line-height: 1.2; letter-spacing: -1px; }
.offer__text p { font-size: 15px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }
.offer__cta { margin-top: auto; width: 100%; }
.offer__media { border-radius: var(--r-primary); overflow: hidden; }
.offer__media img { width: 100%; height: 100%; object-fit: cover; }

.feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); margin-top: var(--sp-6); }
.feat { background: var(--bg); border-radius: var(--r-primary); padding: 24px; }
.feat__title { margin: 0 0 8px; font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: -.5px; }
.feat__text { font-size: 14px; line-height: 1.45; letter-spacing: -.4px; color: var(--gray-900); }
.feat__ic { width: 26px; height: 26px; margin-top: 28px; }

/* ==========================================================================
   Страница жилого комплекса
   ========================================================================== */
.page-hero--jk { min-height: 700px; }
.anchors { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 20px; }
.anchor { padding: 9px 16px; border-radius: var(--r-secondary); background: var(--bg); font-size: 14px; font-weight: 500; letter-spacing: -.4px; color: var(--gray-900); transition: background-color .15s ease, color .15s ease; }
.anchor:hover { background: var(--bg-btn-hover); }
.anchor.is-active { background: var(--blue-100); color: var(--blue-900); }

.jk-about { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-11); align-items: start; margin-bottom: 40px; }
.jk-about__addr { display: flex; align-items: center; gap: 8px; font-size: 14px; letter-spacing: -.4px; color: var(--gray-900); margin-bottom: 12px; }
.jk-about__addr img { width: 18px; height: 18px; }
.jk-about__title { max-width: 520px; }
.jk-about__text { font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }

.specs { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--sp-6); padding: 24px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin-bottom: 40px; }
.spec__label { font-size: 13px; letter-spacing: -.4px; color: var(--gray-900); }
.spec__value { margin-top: 6px; font-size: 16px; font-weight: 500; letter-spacing: -.5px; }
.spec__value sup { font-size: 10px; }

.jk-photos { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); margin-bottom: var(--sp-6); }
.jk-photos img { width: 100%; height: 420px; object-fit: cover; border-radius: var(--r-primary); }

.jk-tiles { display: flex; flex-wrap: wrap; gap: var(--sp-6); }
.jk-tile { border-radius: var(--r-primary); overflow: hidden; height: 480px; }
.jk-tile img { width: 100%; height: 100%; object-fit: cover; }
.jk-tile:nth-child(1) { width: calc(66.15% - 10px); }
.jk-tile:nth-child(2) { width: calc(33.85% - 10px); }
.jk-tile:nth-child(3), .jk-tile:nth-child(4) { width: calc(50% - 10px); }

/* Описание проекта */
.op-media { border-radius: var(--r-primary); overflow: hidden; margin-bottom: var(--sp-4); }
.op-media img { width: 100%; height: 520px; object-fit: cover; }
.op-media--pair { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.op-feats { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--sp-4); }
.op-feat { background: var(--bg); border-radius: var(--r-primary); padding: 16px 20px; }
.op-feat img { width: 24px; height: 24px; margin-bottom: 12px; }
.op-feat p { font-size: 13px; line-height: 1.4; letter-spacing: -.4px; }
@media (max-width: 1100px) { .op-feats { grid-template-columns: repeat(2, 1fr); } .op-media img { height: 320px; } }
@media (max-width: 700px) { .op-feats, .op-media--pair { grid-template-columns: 1fr; } }

.genplan { border-radius: var(--r-primary); overflow: hidden; }
.genplan img { width: 100%; height: auto; }

.gallery { display: grid; grid-template-columns: 1fr 430px; gap: var(--sp-6); align-items: stretch; }
.gallery__img { width: 100%; height: 480px; object-fit: cover; border-radius: var(--r-primary); }
.gallery__note { background: var(--bg); border-radius: var(--r-primary); padding: 32px; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.gallery__count { font-size: 13px; letter-spacing: -.4px; color: var(--gray-900); margin-bottom: 12px; }
.gallery__title { margin: 0 0 12px; font-size: 22px; font-weight: 600; letter-spacing: -.8px; }
.gallery__text { font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }

.places { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); margin-bottom: var(--sp-6); }
.place { display: flex; align-items: center; gap: var(--sp-4); background: var(--bg); border-radius: var(--r-primary); padding: 12px; }
.place img, .place__ph { width: 64px; height: 52px; border-radius: 8px; object-fit: cover; background: var(--bg-btn-hover); flex: 0 0 64px; }
.place__name { font-size: 14px; font-weight: 500; letter-spacing: -.4px; }
.place__time { margin-top: 2px; font-size: 13px; letter-spacing: -.4px; color: var(--gray-900); }

.infra-map { position: relative; border-radius: var(--r-primary); overflow: hidden; }
.infra-map img { width: 100%; height: 620px; object-fit: cover; }
.infra-map__filters { position: absolute; left: 50%; transform: translateX(-50%); bottom: 20px; display: flex; flex-wrap: wrap; gap: 8px; }

.tour { display: grid; grid-template-columns: 430px 1fr; gap: var(--sp-6); }
.tour__card { background: var(--blue-900); color: #fff; border-radius: var(--r-primary); padding: 24px; display: flex; flex-direction: column; }
.tour__ic { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: var(--white-200); border-radius: var(--r-secondary); margin-bottom: 20px; }
.tour__ic img { width: 24px; height: 24px; filter: brightness(0) invert(1); }
.tour__title { margin: 0 0 8px; font-size: 20px; font-weight: 600; letter-spacing: -.7px; }
.tour__text { font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: rgba(255,255,255,.85); }
.tour__card .btn--soft { margin-top: auto; background: rgba(255,255,255,.15); color: #fff; }
.tour__card .btn--soft:hover { background: rgba(255,255,255,.25); }
.tour__media { border-radius: var(--r-primary); overflow: hidden; }
.tour__media img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1100px) {
  .jk-about, .jk-photos, .jk-tiles, .gallery, .tour { grid-template-columns: 1fr; grid-template-areas: none; }
  .specs { grid-template-columns: repeat(2, 1fr); }
  .places { grid-template-columns: repeat(2, 1fr); }
  .jk-photos img { height: 260px; }
  .page-hero--jk { min-height: 460px; }
}
@media (max-width: 700px) { .specs, .places { grid-template-columns: 1fr; } }

/* ==========================================================================
   О компании
   ========================================================================== */
.about-hero__title { max-width: 900px; line-height: 1.2; margin-bottom: 20px; }
.about-hero__lead { max-width: 700px; font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); margin-bottom: 40px; }
.about-hero__media { border-radius: var(--r-primary); overflow: hidden; }
.about-hero__media img { width: 100%; height: 620px; object-fit: cover; }

.dirs { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); }
.dir { position: relative; height: 340px; border-radius: var(--r-primary); overflow: hidden; }
.dir__img { width: 100%; height: 100%; object-fit: cover; }
.dir::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(46,56,63,0) 45%, rgba(46,56,63,.65) 100%); }
.dir__title { position: absolute; z-index: 2; left: 20px; right: 60px; bottom: 20px; color: #fff; font-size: 15px; font-weight: 500; line-height: 1.35; letter-spacing: -.4px; }
.dir__plus { position: absolute; z-index: 2; right: 16px; bottom: 16px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--white-200); backdrop-filter: blur(10px); color: #fff; font-size: 20px; line-height: 1; }

.nums { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 240px; gap: var(--sp-6); }
.num { position: relative; border-radius: var(--r-primary); overflow: hidden; padding: 24px; display: flex; flex-direction: column; }
.num--soft { background: var(--bg); }
.num--blue { background: linear-gradient(160deg, #00a3d4 0%, #007ca4 100%); }
.num--photo { color: #fff; }
.num__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.num--photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(46,56,63,.5) 0%, rgba(46,56,63,.25) 100%); z-index: 1; }
.num--photo > *:not(.num__bg) { position: relative; z-index: 2; }
.num__title { font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.7px; max-width: 300px; }
.num__title--light { color: #fff; }
.num__title sup { font-size: 11px; }
.num__text { margin-top: auto; font-size: 14px; line-height: 1.45; letter-spacing: -.4px; color: var(--gray-900); max-width: 230px; }
.num__text--light { color: rgba(255,255,255,.85); }
.num__ill { position: absolute; right: 16px; bottom: 0; width: 150px; height: auto; z-index: 1; }
.num__ill--keys { width: 130px; right: 24px; bottom: 20px; }
.num__ill--building { width: 120px; right: 20px; bottom: 10px; }
.num--tall { grid-row: span 2; }
.num--wide { grid-row: span 2; }
.num--last { grid-column: 1; }

.socials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); }
.soc-card img { width: 100%; height: 280px; object-fit: cover; border-radius: var(--r-primary); }
.soc-card__title { margin: 16px 0 8px; font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.5px; }
.soc-card__text { font-size: 13px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }

.awards { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); }
.award { background: var(--bg); border-radius: var(--r-primary); padding: 24px; text-align: center; }
.award img { width: 110px; height: auto; margin: 0 auto 20px; }
.award__text { font-size: 13px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }

.projects { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
.project { position: relative; height: 460px; border-radius: var(--r-primary); overflow: hidden; display: block; }
.project__img { width: 100%; height: 100%; object-fit: cover; }
.project::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(46,56,63,0) 50%, rgba(46,56,63,.75) 100%); }
.project__foot { position: absolute; z-index: 2; left: 24px; right: 24px; bottom: 24px; display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-5); }
.project__name { color: #fff; font-size: 22px; font-weight: 600; letter-spacing: -.8px; }
.project__note { margin-top: 6px; color: rgba(255,255,255,.85); font-size: 13px; line-height: 1.4; letter-spacing: -.4px; max-width: 320px; }
.project__badges { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }

@media (max-width: 1100px) {
  .dirs, .nums, .socials-grid, .awards, .projects { grid-template-columns: repeat(2, 1fr); }
  .nums { grid-auto-rows: auto; }
  .num { min-height: 220px; }
  .num--tall, .num--wide { grid-row: auto; }
  .num--last { grid-column: auto; }
  .about-hero__media img { height: 360px; }
}
@media (max-width: 700px) { .dirs, .nums, .socials-grid, .awards, .projects { grid-template-columns: 1fr; } }

/* ==========================================================================
   Коммерция
   ========================================================================== */
.page-hero--slider .page-hero__nav { position: absolute; right: 0; bottom: 10px; display: flex; gap: 10px; }
.page-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }

.km-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
.km-card { position: relative; border-radius: var(--r-primary); overflow: hidden; padding: 24px; min-height: 300px; display: flex; flex-direction: column; }
.km-card--soft { background: var(--bg); }
.km-card--photo { color: #fff; }
.km-card__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.km-card--photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(46,56,63,.35) 0%, rgba(46,56,63,.7) 100%); z-index: 1; }
.km-card--photo > *:not(.km-card__bg) { position: relative; z-index: 2; }
.km-card__title { margin: 0 0 12px; font-size: 22px; font-weight: 600; line-height: 1.25; letter-spacing: -.8px; max-width: 320px; }
.km-card__text { font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); max-width: 330px; }
.km-card__text--light { color: rgba(255,255,255,.9); margin-top: auto; margin-left: auto; text-align: right; }
.km-card__text--bottom { margin-top: auto; }
.km-card__ill { position: absolute; right: 24px; top: 24px; width: 120px; height: auto; z-index: 1; }
.km-card__ill--veranda { top: auto; bottom: 0; right: 40%; width: 210px; }
.km-card--row { flex-direction: row; gap: var(--sp-5); align-items: flex-start; }
.km-card--row .km-card__title { max-width: 180px; }
.km-card--tall { min-height: 300px; }

.otdelka { position: relative; border-radius: var(--r-primary); overflow: hidden; }
.otdelka img { width: 100%; height: auto; }
.otdelka__price { position: absolute; left: 20px; bottom: 20px; background: #fff; border-radius: var(--r-secondary); padding: 10px 16px; font-size: 14px; font-weight: 500; letter-spacing: -.4px; }
.otdelka__price sup { font-size: 9px; }

.consult--teal { background: linear-gradient(132deg, #dff0f0 0%, #bfe3e4 100%); }
.consult__img--building { width: 240px; }

@media (max-width: 1100px) {
  .km-grid { grid-template-columns: 1fr; }
  .km-card--row { flex-direction: column; }
  .km-card__ill--veranda { position: static; width: 180px; margin-left: auto; }
}

/* Клиентам: партнёры и этапы */
.offer__text--split { justify-content: space-between; }
.offer__bottom { display: flex; flex-direction: column; gap: 16px; }
.offer__bottom p { font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }

.tabs--filters { flex-wrap: wrap; margin-bottom: var(--sp-6); }
.tabs--filters .tab { font-size: 14px; padding: 8px 14px; }

.partners { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); }
.partner { background: #fff; border: 1px solid var(--border); border-radius: var(--r-primary); padding: 20px; text-align: center; }
.partner__logo { width: 64px; height: 64px; margin: 0 auto 12px; background: var(--bg); border-radius: var(--r-secondary); }
.partner__name { font-size: 14px; font-weight: 600; letter-spacing: -.3px; }
.partner__cat { margin-top: 2px; font-size: 13px; letter-spacing: -.4px; color: var(--gray-900); }
.partner__offer { margin: 16px 0; font-size: 14px; font-weight: 500; line-height: 1.4; letter-spacing: -.4px; color: var(--blue-900); }
.btn--soft { width: 100%; background: var(--bg); color: var(--black-900); padding: 11px 16px; font-size: 14px; font-weight: 500; letter-spacing: -.4px; }
.btn--soft:hover { background: var(--bg-btn-hover); }

.stage { display: grid; grid-template-columns: 430px 1fr; gap: var(--sp-6); padding: 32px 0; border-top: 1px solid var(--border); }
.stage__num { font-size: 12px; font-weight: 600; letter-spacing: .4px; color: var(--blue-900); text-transform: uppercase; }
.stage__title { margin: 8px 0 0; font-size: 22px; font-weight: 600; line-height: 1.25; letter-spacing: -.8px; }
.stage__steps { display: flex; flex-direction: column; }
.step { display: flex; gap: var(--sp-5); padding: 20px 0; }
.step + .step { border-top: 1px solid var(--border); }
.step__n { flex: 0 0 32px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--blue-100); color: var(--blue-900); font-size: 14px; font-weight: 600; }
.step__title { font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.5px; }
.step__note { margin: 10px 0; font-size: 14px; line-height: 1.5; letter-spacing: -.4px; color: var(--gray-900); }
.step__body .article__list { margin-bottom: 0; }
.step__body .article__list li { font-size: 14px; color: var(--gray-900); }

@media (max-width: 1100px) {
  .partners { grid-template-columns: repeat(2, 1fr); }
  .stage { grid-template-columns: 1fr; }
}
@media (max-width: 700px) { .partners { grid-template-columns: 1fr; } }

.consult {
  position: relative; display: flex; align-items: center; overflow: hidden;
  background: linear-gradient(132deg, #e6f2f6 35%, #cce5ed 100%);
  border-radius: var(--r-primary); padding: 40px; margin-top: 80px; min-height: 200px;
}
.consult__title { margin: 0 0 20px; font-size: 28px; font-weight: 600; line-height: 1.25; letter-spacing: -1px; }
.consult__img { position: absolute; right: 40px; top: 50%; transform: translateY(-50%); width: 300px; height: auto; }

.calc { border-radius: var(--r-primary); overflow: hidden; border: 1px solid var(--border); }
.calc img { width: 100%; height: auto; }

.faq { display: grid; grid-template-columns: 430px 1fr; gap: var(--sp-6); align-items: start; }
.faq__side { display: flex; flex-direction: column; gap: 40px; }
.faq__ask { display: flex; gap: var(--sp-5); background: var(--bg); border-radius: var(--r-primary); padding: 20px; margin-top: auto; }
.faq__ask-photo { width: 80px; height: 80px; border-radius: var(--r-secondary); object-fit: cover; object-position: top center; background: #fff; }
.faq__ask-title { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -.5px; }
.faq__ask-text { margin-top: 6px; font-size: 14px; line-height: 1.4; letter-spacing: -.4px; color: var(--gray-900); }
.faq__ask-row { display: flex; align-items: center; gap: 8px; margin-top: 16px; }
.faq__ask-row .social { width: 40px; height: 40px; }
.faq__ask-row .social img { width: 14px; height: auto; }
.faq__ask-row .round-ic { width: 40px; height: 40px; }
.faq__ask-row .round-ic img { width: 40px; height: 40px; }

.acc--faq .acc__btn { gap: var(--sp-5); }
.acc--faq .acc__label { font-size: 16px; font-weight: 500; letter-spacing: -.5px; }
.acc--faq .acc__item.is-open .acc__label { color: #fff; }

@media (max-width: 1100px) {
  .offer, .faq { grid-template-columns: 1fr; }
  .offer__text { min-height: 0; }
  .feats { grid-template-columns: 1fr; }
  .consult__img { position: static; transform: none; width: 200px; margin-left: auto; }
  .consult { flex-direction: column; align-items: flex-start; }
  .page-hero { min-height: 380px; padding-bottom: 60px; }
  .crumbs--light { margin-bottom: 40px; }
}

/* ==========================================================================
   Статья (детальная новости / акции)
   ========================================================================== */
.article__h1 { margin-bottom: var(--sp-11); }
.article { display: grid; grid-template-columns: 800px 1fr; gap: var(--sp-11); align-items: start; }

.article__meta { display: flex; align-items: center; gap: var(--sp-6); margin-bottom: var(--sp-6); font-size: 14px; letter-spacing: -.4px; color: var(--gray-900); }
.article__meta-item, .article__share { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; letter-spacing: -.4px; color: var(--gray-900); }
.article__meta img, .article__share img { width: 18px; height: 18px; }
.article__share { margin-left: auto; }
.article__share:hover { color: var(--blue-900); }

.article__cover { border-radius: var(--r-primary); overflow: hidden; margin-bottom: 32px; }
.article__cover img { width: 100%; height: 450px; object-fit: cover; }

.article__body p { font-size: 16px; line-height: 1.5; letter-spacing: -.5px; margin-bottom: 20px; }
.article__body p a { color: var(--blue-900); }
.article__body p a:hover { text-decoration: underline; }
.article__body h2 { font-size: 32px; font-weight: 600; line-height: 1.2; letter-spacing: -1px; margin: 40px 0 20px; }
.article__body h3 { font-size: 26px; font-weight: 600; line-height: 1.25; letter-spacing: -.8px; margin: 36px 0 16px; }
.article__body h4 { font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.7px; margin: 32px 0 16px; }
.article__body ol { counter-reset: n; display: flex; flex-direction: column; gap: 12px; margin: 0 0 24px; padding: 0; list-style: none; }
.article__body ol li { counter-increment: n; position: relative; padding-left: 32px; font-size: 16px; line-height: 1.5; letter-spacing: -.5px; }
.article__body ol li::before { content: counter(n) "."; position: absolute; left: 0; color: var(--blue-900); font-weight: 500; }
.article__list { display: flex; flex-direction: column; gap: 10px; margin: 0 0 24px; }
.article__list li { position: relative; padding-left: 24px; font-size: 16px; line-height: 1.5; letter-spacing: -.5px; }
.article__list li::before { content: ''; position: absolute; left: 6px; top: 10px; width: 6px; height: 6px; border: 1.5px solid var(--blue-900); border-radius: 50%; }
.article__pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); margin: 28px 0; }
.article__ph { height: 320px; background: var(--bg); border-radius: var(--r-primary); }

.article__aside { display: flex; flex-direction: column; gap: var(--sp-6); position: sticky; top: 100px; }
.side-card { position: relative; border-radius: var(--r-primary); padding: 24px; overflow: hidden; }
.side-card--blue { background: linear-gradient(132deg, #e6f2f6 35%, #cce5ed 100%); }
.side-card--gray { background: var(--bg); }
.side-card--list { background: #fff; border: 1px solid var(--border); padding: 20px; }
.side-card__title { margin: 0 0 10px; font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.7px; }
.side-card__text { font-size: 14px; line-height: 1.45; letter-spacing: -.4px; color: var(--gray-900); margin-bottom: 20px; max-width: 260px; }
/* В макете снимок обрезан краями карточки, видна верхняя часть фигуры */
.side-card__manager { position: absolute; right: 0; top: 0; height: 100%; width: 175px; object-fit: cover; object-position: top center; }
.side-card__tg { position: absolute; right: 8px; bottom: 8px; width: 128px; height: 120px; object-fit: contain; }
.side-card--blue, .side-card--gray { min-height: 200px; }
.side-card--blue .side-card__text, .side-card--gray .side-card__text { max-width: 240px; }

.jk-row { display: flex; align-items: center; gap: var(--sp-4); padding: 10px; border-radius: var(--r-secondary); transition: background-color .15s ease; }
.jk-row:hover { background: var(--bg); }
.jk-row > img { width: 92px; height: 60px; object-fit: cover; border-radius: 8px; }
.jk-row__body { flex: 1; min-width: 0; }
.jk-row__name { font-size: 16px; font-weight: 500; letter-spacing: -.5px; }
.jk-row__meta { font-size: 13px; letter-spacing: -.4px; color: var(--gray-900); margin-top: 2px; }
.jk-row__arrow { flex: 0 0 auto; }
.jk-row__arrow img { width: 9.83px; height: 4.83px; transform: rotate(-90deg); }

.section--other { margin-top: 80px; }

@media (max-width: 1200px) {
  .article { grid-template-columns: 1fr; }
  .article__aside { position: static; flex-direction: row; flex-wrap: wrap; }
  .article__aside .side-card { flex: 1 1 300px; }
}
@media (max-width: 700px) { .article__pair { grid-template-columns: 1fr; } .article__ph { height: 200px; } }

/* Плитка акций: фото на всю карточку, затемнение и подпись снизу */
.promo-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); }
.promo-tile { position: relative; height: 402px; border-radius: var(--r-primary); overflow: hidden; display: block; }
.promo-tile__img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.promo-tile:hover .promo-tile__img { transform: scale(1.03); }
.promo-tile::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 55%;
  background: linear-gradient(180deg, rgba(46, 56, 63, 0) 0%, rgba(46, 56, 63, .75) 100%);
}
.promo-tile__foot {
  position: absolute; z-index: 2; left: 20px; right: 20px; bottom: 20px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-4);
}
.promo-tile__title { color: #fff; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -.5px; }
.promo-tile__arrow { flex: 0 0 auto; background: var(--white-200); backdrop-filter: blur(10px); box-shadow: none; }
.promo-tile__arrow img { transform: rotate(-90deg); filter: brightness(0) invert(1); }

@media (max-width: 1100px) { .promo-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px)  { .promo-grid { grid-template-columns: 1fr; } .news--grid { grid-template-columns: 1fr; } }

.switch { display: inline-flex; background: var(--bg); border-radius: var(--r-secondary); padding: 4px; }
.switch__btn {
  padding: 11px 40px; border-radius: 8px; font-size: 16px; font-weight: 500;
  line-height: 1.4; letter-spacing: -.5px; color: var(--gray-900);
  transition: background-color .15s ease, color .15s ease;
}
.switch__btn.is-active { background: #fff; color: var(--black-900); box-shadow: 0 2px 6px rgba(46, 56, 63, .06); }
.switch--center { display: flex; width: max-content; margin: 0 auto var(--sp-11); }

/* ==========================================================================
   Контакты
   ========================================================================== */
.contacts { display: grid; grid-template-columns: 400px 1fr; gap: var(--sp-6); align-items: stretch; }

.office { background: var(--bg); border-radius: var(--r-primary); padding: 20px; }
.office__title { margin: 10px 10px 20px; font-size: 28px; font-weight: 600; line-height: 1.2; letter-spacing: -1px; }
.office__card { background: #fff; border-radius: var(--r-primary); padding: 24px; }

.office__phone { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-5); margin-bottom: 24px; }
.office__label { font-size: 14px; line-height: 1.4; letter-spacing: -.4px; color: var(--gray-900); }
.office__number { font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.7px; margin-top: 4px; }
.office__messengers { display: flex; gap: 8px; }
.round-ic { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--r-full); overflow: hidden; }
.round-ic img { width: 44px; height: 44px; }

.office__list { display: flex; flex-direction: column; gap: 20px; }
.office__item { display: flex; align-items: flex-start; gap: var(--sp-4); }
.office__ic { flex: 0 0 44px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--border); border-radius: var(--r-secondary); }
.office__ic img { width: 24px; height: 24px; }
.office__value { font-size: 16px; line-height: 1.5; letter-spacing: -.5px; margin-top: 2px; }
.office__value a:hover { color: var(--blue-900); }
.office__cta { width: 100%; margin-top: 24px; }

.contacts__map { border-radius: var(--r-primary); overflow: hidden; background: var(--bg); min-height: 538px; }
.contacts__map img { width: 100%; height: 100%; object-fit: cover; }

.mailboxes { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); margin-top: var(--sp-6); }
.mailbox { background: var(--bg); border-radius: var(--r-primary); padding: 24px; transition: background-color .15s ease; }
.mailbox:hover { background: var(--bg-btn-hover); }
.mailbox__ic { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: #fff; border-radius: var(--r-secondary); margin-bottom: 20px; }
.mailbox__ic img { width: 24px; height: 24px; }
.mailbox__mail { font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.7px; }
.mailbox__note { margin-top: 8px; font-size: 16px; line-height: 1.4; letter-spacing: -.5px; color: var(--gray-900); }

@media (max-width: 1100px) {
  .contacts { grid-template-columns: 1fr; }
  .contacts__map { min-height: 360px; }
  .mailboxes { grid-template-columns: 1fr; }
  .page-head { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* ==========================================================================
   Подвал
   ========================================================================== */
.footer { background: var(--bg); padding: 110px 0 40px; }
.footer__inner { display: grid; grid-template-columns: 315px 1fr; gap: 80px; align-items: start; position: relative; }
.footer__inner::before { content: ''; position: absolute; left: 355px; top: -110px; bottom: -40px; width: 1px; background: var(--border); }
.footer__left { display: flex; flex-direction: column; gap: var(--sp-11); }
.footer__logo { width: 219px; height: 40px; }
.footer__box {
  position: relative; display: flex; flex-direction: column; justify-content: space-between;
  height: 170px; background: #fff; border-radius: var(--r-primary); padding: 20px; overflow: hidden;
}
.footer__box + .footer__box { margin-top: 10px; }
.footer__box b { display: block; font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.5px; }
.footer__box p { font-size: 16px; line-height: 1.4; letter-spacing: -.5px; color: var(--gray-900); }
.footer__box--phone > div:first-child { width: 160px; display: flex; flex-direction: column; gap: 8px; }
.footer__box .btn { align-self: flex-start; }
.footer__box-img { position: absolute; right: 0; top: 16px; width: 135px; height: 154px; object-fit: contain; }
.footer__box--social > div:first-child { display: flex; flex-direction: column; gap: 4px; }
.footer__socials { display: flex; align-items: center; gap: 8px; }
.footer__socials .social { flex: 1; height: 44px; }
.footer__socials .social img { width: 16px; height: auto; }

.footer__right { display: flex; flex-direction: column; justify-content: space-between; gap: 60px; min-height: 430px; }
.footer__cols { display: flex; gap: 30px; }
.footer__col { flex: 1; display: flex; flex-direction: column; gap: var(--sp-5); }
.footer__col b { font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.5px; }
.footer__col ul { display: flex; flex-direction: column; gap: 12px; color: var(--gray-900); }
.footer__col li { font-size: 16px; line-height: 1.4; letter-spacing: -.5px; }
.footer__col a:hover { color: var(--blue-900); }
.footer__col--plain { gap: var(--sp-5); }
.footer__col--plain a { font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -.5px; }
.footer__bottom { display: flex; align-items: flex-end; gap: 20px; }
.footer__legal { width: 288px; display: flex; flex-direction: column; gap: 8px; color: var(--gray-900); font-size: 16px; line-height: 1.5; letter-spacing: -.5px; }
.footer__info { flex: 1; display: flex; flex-direction: column; gap: var(--sp-5); }
.footer__info b { font-size: 16px; font-weight: 500; letter-spacing: -.5px; color: var(--black-900); }
.footer__info p { font-size: 16px; line-height: 1.5; letter-spacing: -.5px; color: var(--gray-900); }

/* ==========================================================================
   Адаптив (макет только под десктоп 1440 — ниже пропорциональная деградация)
   ========================================================================== */
@media (max-width: 1439px) {
  :root { --gutter: 32px; }
  .about__cell--wide { width: calc(50% - 10px); }
  .about__cell--sm { width: calc(25% - 15px); }
  .about__cell--wide > img.about__photo { left: auto; right: 0; }
  .footer__inner::before { display: none; }
}

@media (max-width: 1100px) {
  .hero__grid { grid-template-columns: 1fr; }
  .hero__aside { flex-direction: row; }
  .hero__aside > * { flex: 1; }
  .lead, .more { grid-template-columns: 1fr; }
  .lead__img { position: static; margin: 20px auto 0; }
  .lead__social { position: static; margin-top: 20px; }
  .flats { grid-template-columns: repeat(2, 1fr); }
  .news { grid-template-columns: repeat(2, 1fr); }
  .buy { grid-template-columns: 1fr; }
  .about__cell--wide, .about__cell--sm { width: calc(50% - 10px); }
  .footer__inner { grid-template-columns: 1fr; gap: 40px; }
  .h2 { font-size: 32px; letter-spacing: -1px; }
  .jk--half { width: 100%; }
  .nav { display: none; }
}

@media (max-width: 700px) {
  :root { --gutter: 16px; }
  .hero__aside { flex-direction: column; }
  .flats, .news { grid-template-columns: 1fr; }
  .about__cell--wide, .about__cell--sm { width: 100%; }
  .section__head, .about__head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .about__head .h2, .about__head p, .more__lead { width: 100%; }
  .footer__cols { flex-wrap: wrap; }
  .footer__col { flex: 1 1 45%; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }
  .footer__legal { width: 100%; }
}