/* ============================================================
   «Ключ под ключ» · Краснодар · прототип главной в КП-стиле
   Все цвета — только здесь, в :root. Компоненты используют var().
   Источник палитры: брендбук, стр. 9 (тёмный и голубой).
   ============================================================ */

:root {
  /* палитра брендбука */
  --brand-dark: #1E2425;            /* брендбук стр. 9 */
  --brand-accent: #00A7DC;          /* брендбук стр. 9 */
  --white: #FFFFFF;

  /* производные от палитры (в брендбуке нет) */
  --brand-accent-hover: #0095C5;    /* акцент + 12 % тёмного — только для hover */
  --brand-gray: #EDEEEE;            /* тёмный 8 % на белом */
  --text2: #787C7C;                 /* тёмный 60 % на белом */
  --text2-dark: #BCBDBE;            /* белый 70 % на тёмном */
  --line: #E4E5E5;                  /* тёмный 12 % на белом */
  --line-dark: rgba(255, 255, 255, 0.14);
  --accent-15: rgba(0, 167, 220, 0.15);
  --dark-hover: rgba(255, 255, 255, 0.08);

  /* статусные — только для состояний формы */
  --ok: #1F9D55;
  --err: #D64545;

  /* радиусы */
  --r-hero: 24px;
  --r-card: 16px;
  --r-img: 12px;
  --r-ctrl: 10px;
  --r-plate: 6px;

  /* сетка и отступы: 8 / 12 / 16 / 24 / 40 / 64 */
  --container: 1240px;
  --pad: 32px;
  --s8: 8px;
  --s12: 12px;
  --s16: 16px;
  --s24: 24px;
  --s40: 40px;
  --s64: 64px;

  --font: "Circe", "Nunito", "Segoe UI", Arial, sans-serif;
}

/* ---------- шрифт Circe (файлы темы сайта, display: swap) ---------- */
@font-face {
  font-family: "Circe";
  src: url("/wp-content/themes/templat258/fonts/Circe-Regular.woff") format("woff"),
       url("/wp-content/themes/templat258/fonts/Circe-Regular.ttf") format("truetype");
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Circe";
  src: url("/wp-content/themes/templat258/fonts/Circe-Bold.woff") format("woff"),
       url("/wp-content/themes/templat258/fonts/Circe-Bold.ttf") format("truetype");
  font-weight: 600 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Circe";
  src: url("/wp-content/themes/templat258/fonts/Circe-ExtraBold.woff") format("woff"),
       url("/wp-content/themes/templat258/fonts/Circe-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* ---------- база ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.5;
  font-weight: 500;
  color: var(--brand-dark);
  background: var(--white);
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; }
h1 { font-size: 52px; }
h2 { font-size: 32px; }
h3 { font-size: 20px; line-height: 1.25; }
.num { white-space: nowrap; }
/* Табличные цифры Circe рисуют ноль в конце номера почти белым.
   Телефон в карточке должен быть тем же чёрным, что и адрес, целиком. */
a.num {
  font-variant-numeric: normal;
  font-feature-settings: normal;
  color: var(--brand-dark);
  font-weight: 800;
}
.sprite { display: none; }
.icon { width: 24px; height: 24px; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; fill: none; flex: none; }

.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 var(--pad); }

/* ---------- фирменная плашка-метка ---------- */
.plate {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: var(--r-plate);
  background: var(--brand-accent);
  color: var(--white);
}
.plate span { font-size: 12px; font-weight: 800; line-height: 1; white-space: nowrap; }
.plate_dark { background: var(--brand-dark); }

/* ---------- кнопки: одна база, отличаются цветом ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s8);
  height: 44px;
  padding: 0 var(--s24);
  border: 1px solid transparent;
  border-radius: var(--r-ctrl);
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
.btn .icon { width: 20px; height: 20px; }
.btn_primary { background: var(--brand-accent); color: var(--white); }
.btn_primary:hover { background: var(--brand-accent-hover); }
.btn_secondary { background: transparent; color: var(--brand-dark); border-color: var(--line); }
.btn_secondary:hover { border-color: var(--brand-dark); }
.btn_onDark { background: transparent; color: var(--white); border-color: var(--line-dark); }
.btn_onDark:hover { background: var(--dark-hover); }
.btn_white { background: var(--white); color: var(--brand-dark); border-color: var(--white); }
.btn_white:hover { background: var(--brand-gray); border-color: var(--brand-gray); }
.btn_fw { width: 100%; }

/* ---------- поля ввода ---------- */
.input {
  width: 100%;
  height: 44px;
  padding: 0 var(--s16);
  border: 1px solid var(--line);
  border-radius: var(--r-ctrl);
  background: var(--white);
  font: inherit;
  font-size: 15px;
  color: var(--brand-dark);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.input::placeholder { color: var(--text2); }
.input:focus { border-color: var(--brand-accent); box-shadow: 0 0 0 4px var(--accent-15); }

/* ---------- тёмная зона: верхняя полоса, шапка, герой ---------- */
.dark { background: var(--brand-dark); color: var(--white); }

.topbar { border-bottom: 1px solid var(--line-dark); }
.topbar__in { display: flex; align-items: center; justify-content: center; gap: var(--s12); height: 40px; font-size: 13px; color: var(--text2-dark); }
.topbar__in a { color: var(--white); font-weight: 700; white-space: nowrap; }
.topbar__in a:hover { color: var(--brand-accent); }

.header__in { display: flex; align-items: center; gap: var(--s24); height: 84px; }
.logo { display: flex; align-items: center; flex: none; }
.logo img { width: 160px; height: 52px; }
.city { display: inline-flex; align-items: center; gap: 6px; padding-left: var(--s16); margin-left: -8px; border-left: 1px solid var(--line-dark); font-size: 13px; color: var(--text2-dark); white-space: nowrap; }
.city b { color: var(--white); font-weight: 700; }
.city .icon { width: 16px; height: 16px; }

.nav { display: flex; gap: 4px; margin-left: auto; }
.nav a { display: inline-flex; align-items: center; height: 40px; padding: 0 14px; border-radius: var(--r-ctrl); font-size: 15px; font-weight: 600; color: var(--white); white-space: nowrap; }
.nav a:hover { background: var(--dark-hover); }
.nav a.is-active { background: var(--brand-accent); }

.header__phone { display: inline-flex; align-items: center; gap: var(--s8); height: 44px; padding: 0 var(--s16); border: 1px solid var(--line-dark); border-radius: var(--r-ctrl); font-weight: 700; white-space: nowrap; flex: none; }
.header__phone:hover { background: var(--dark-hover); }
.header__phone .icon { width: 20px; height: 20px; }

.burger { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; border: 1px solid var(--line-dark); border-radius: var(--r-ctrl); background: transparent; color: var(--white); cursor: pointer; margin-left: auto; }
.burger_inline { display: inline-flex; margin: 0; }

/* мобильная панель меню */
.drawer { position: fixed; inset: 0; z-index: 50; display: none; }
.drawer.is-open { display: block; }
.drawer__bg { position: absolute; inset: 0; background: var(--brand-dark); opacity: .6; }
.drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(320px, 86vw); padding: var(--s24); background: var(--brand-dark); color: var(--white); display: flex; flex-direction: column; gap: var(--s24); overflow-y: auto; }
.drawer__head { display: flex; align-items: center; justify-content: space-between; }
.drawer__nav { display: flex; flex-direction: column; gap: 4px; }
.drawer__nav a { display: flex; align-items: center; height: 44px; padding: 0 var(--s16); border-radius: var(--r-ctrl); font-size: 16px; font-weight: 600; }
.drawer__nav a.is-active { background: var(--brand-accent); }
.drawer__foot { margin-top: auto; display: flex; flex-direction: column; gap: var(--s12); }
.drawer__foot .btn { width: 100%; }

/* герой */
.hero { position: relative; overflow: hidden; border-radius: 0 0 var(--r-hero) var(--r-hero); }
.hero__in { position: relative; padding: var(--s40) 0 var(--s64); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s40); align-items: center; }
.hero__text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s24); }
.hero__lead { font-size: 18px; color: var(--text2-dark); max-width: 560px; }
.hero__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s12); }
.hero__actions .btn { min-width: 180px; }
.hero__photo { position: relative; z-index: 1; aspect-ratio: 4 / 3; border-radius: var(--r-card); overflow: hidden; background: var(--dark-hover); }
.hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.hero__decor { position: absolute; z-index: 0; right: -140px; top: -120px; width: 560px; height: 640px; color: var(--brand-accent); opacity: .15; pointer-events: none; }
.hero__decor svg { width: 100%; height: 100%; display: block; }

.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s24); margin-top: var(--s64); padding-top: var(--s24); border-top: 1px solid var(--line-dark); position: relative; z-index: 1; }
.kpi__val { font-size: 32px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; white-space: nowrap; }
.kpi_main .kpi__val { font-size: 44px; color: var(--brand-accent); }
.kpi__lbl { margin-top: 6px; font-size: 13px; font-weight: 600; color: var(--text2-dark); }

/* ---------- светлое тело ---------- */
.section { padding: var(--s64) 0 0; }
.section_last { padding-bottom: var(--s64); }
.section__head { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s12); margin-bottom: var(--s24); }
.section__head_row { flex-direction: row; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
.section__head_inner { margin-bottom: 0; }
.section__head p { color: var(--text2); max-width: 640px; }

/* плитки (серые, без рамок и теней) */
.tile { display: flex; flex-direction: column; gap: var(--s8); min-height: 124px; padding: var(--s24); border-radius: var(--r-card); background: var(--brand-gray); }
.tile__lbl { font-size: 13px; font-weight: 600; color: var(--text2); }
.tile__val { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
.tile__val.num { font-size: 32px; }
.tile_accent { background: var(--brand-accent); color: var(--white); }
.tile_accent .tile__lbl { color: var(--white); opacity: .8; }
.tile_outline { background: var(--white); border: 1px solid var(--line); }
.tile .icon { width: 28px; height: 28px; color: var(--brand-accent); }
.tile_accent .icon { color: var(--white); }
.tile_cta { justify-content: space-between; }

/* карточки (белые, тонкая рамка) */
.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s24); }
.card h3 { margin-bottom: var(--s12); }
.cards { display: grid; gap: var(--s16); }
.cards_5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cards_3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cards_2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cards_4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* услуги */
.service { display: flex; flex-direction: column; padding: var(--s12) var(--s12) var(--s24); }
.service__img { aspect-ratio: 4 / 3; border-radius: var(--r-img); overflow: hidden; background: var(--brand-gray); }
.service__img img { width: 100%; height: 100%; object-fit: cover; }
.service__body { padding: var(--s16) var(--s12) 0; display: flex; flex-direction: column; gap: var(--s8); }
.service h3 { font-size: 18px; margin: 0; min-height: 44px; }
.service__links { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.service__links a { color: var(--text2); display: inline-flex; gap: 6px; align-items: flex-start; }
.service__links a::before { content: ""; width: 6px; height: 6px; margin-top: 7px; border-radius: 50%; background: var(--brand-accent); flex: none; }
.service__links a:hover { color: var(--brand-accent); }

/* прайс */
.prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; gap: var(--s16); }
.price_tall { grid-row: span 2; }
.price__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s16); }
.price__head h3 { margin: 0; }
.price__from { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; color: var(--brand-accent); white-space: nowrap; line-height: 1.1; }
.tbl { width: 100%; border-collapse: collapse; margin-top: var(--s16); font-size: 15px; }
.tbl th { text-align: left; padding: 0 0 var(--s8); font-size: 13px; font-weight: 600; color: var(--text2); border-bottom: 2px solid var(--brand-dark); }
.tbl th:last-child, .tbl td:last-child { text-align: right; white-space: nowrap; }
.tbl td { padding: 10px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl tr:last-child td { border-bottom: 0; padding-bottom: 0; }
.tbl td:last-child { font-weight: 700; }
.prices__note { display: flex; align-items: center; justify-content: space-between; gap: var(--s16); flex-wrap: wrap; margin-top: var(--s16); color: var(--text2); font-size: 14px; }

/* мастер */
.master { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s40); align-items: start; }
.master__photo { border-radius: var(--r-card); overflow: hidden; aspect-ratio: 4 / 3; background: var(--brand-gray); }
.master__photo img { width: 100%; height: 100%; object-fit: cover; }
.master__body { display: flex; flex-direction: column; gap: var(--s16); }
.master__name { font-size: 20px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.25; }
.master__name span { font-weight: 600; color: var(--text2); font-size: 16px; letter-spacing: 0; }
.master__meta { display: flex; gap: var(--s8); flex-wrap: wrap; }
.master__text { color: var(--text2); }
.team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s12); }
.team__item { padding: var(--s16); border-radius: var(--r-img); background: var(--brand-gray); }
.team__item b { display: block; font-weight: 800; }
.team__item span { font-size: 13px; color: var(--text2); font-weight: 600; }
.feature { display: flex; gap: var(--s12); padding: var(--s16); border-radius: var(--r-img); border: 1px solid var(--line); }
.feature .icon { color: var(--brand-accent); }
.feature b { font-weight: 800; }

/* галерея */
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s16); }
.gallery figure { margin: 0; padding: var(--s12); background: var(--white); border: 1px solid var(--line); border-radius: var(--r-card); }
.gallery .ph { aspect-ratio: 4 / 3; border-radius: var(--r-img); overflow: hidden; background: var(--brand-gray); }
.gallery img { width: 100%; height: 100%; object-fit: cover; }
.gallery figcaption { padding: var(--s12) 4px 0; font-size: 13px; font-weight: 600; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* почему мы */
.why { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s16); }
.why .tile { min-height: 164px; }
.why .tile__val { font-size: 18px; }

/* кейсы */
.case__title { font-size: 18px; margin-bottom: var(--s12); }
.case p { color: var(--text2); font-size: 15px; }
.case .plate { margin-bottom: var(--s16); }

/* отзывы */
.reviews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s16); }
.review { display: flex; flex-direction: column; gap: var(--s12); }
.stars { display: flex; gap: 2px; color: var(--brand-accent); }
.stars .icon { width: 18px; height: 18px; }
.review p { font-size: 15px; flex: 1; }
.review__who { font-size: 13px; font-weight: 600; color: var(--text2); }
.review_cta p { color: var(--white); }
.review_cta .review__who { color: var(--white); opacity: .8; }

/* FAQ */
.faq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s16); }
.faq_span { grid-column: 1 / -1; }
.faq__q { font-size: 18px; margin-bottom: var(--s8); }
.faq__a { color: var(--text2); font-size: 15px; }
.faq__a a { color: var(--brand-accent); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.faq__a a:hover { color: var(--brand-accent-hover); }

/* контакты */
.contacts { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s16); align-items: stretch; }
.pairs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s24); }
.pair { display: flex; flex-direction: column; gap: 4px; padding: var(--s12) 0; border-bottom: 1px solid var(--line); }
.pair:nth-last-child(-n+2) { border-bottom: 0; }
.pair__lbl { font-size: 13px; font-weight: 600; color: var(--text2); }
.pair__val { font-weight: 700; }
.pair__val a:hover { color: var(--brand-accent); }
.contact-cta { display: flex; flex-direction: column; gap: 10px; justify-content: flex-start; padding: 16px 18px; }
.kpk-lead { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: 16px; row-gap: 12px; align-items: start; margin-top: 28px; }
.kpk-lead > .section__head { grid-column: 1; grid-row: 1; margin: 0; }
.kpk-lead > .card { grid-column: 1; grid-row: 2; }
.kpk-lead > .contact-cta { grid-column: 2; grid-row: 1 / span 2; align-self: stretch; height: 100%; box-sizing: border-box; }
.kpk-lead .cta-form { margin-top: 4px; }
.kpk-lead .cta-form .form__row { grid-template-columns: 1fr 1fr; }
.kpk-lead .cta-form .form__row .btn { grid-column: 1 / -1; height: 40px; background: var(--brand-dark); color: var(--white); }
.kpk-lead .cta-form .form__row .btn:hover { background: #000; }
.kpk-lead .cta-form .input { height: 40px; background: var(--white); color: var(--brand-dark); }
.kpk-lead .form__legal { display: block; margin-top: 8px; color: var(--white); font-size: 12px; font-weight: 500; line-height: 1.35; }
.kpk-lead .form__legal a { color: var(--white); text-decoration: underline; text-underline-offset: 2px; }
.contact-cta__phone { font-size: 32px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; white-space: normal; }
.contact-cta__hours { margin-top: var(--s8); font-size: 13px; font-weight: 600; opacity: .8; }
.contact-cta__text { font-size: 15px; }
.contact-cta__actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s8); }
.contact-cta__actions .btn { padding: 0 var(--s12); }

/* форма консультации (компактная) */
.contacts .consult { margin-top: var(--s16); }
.consult { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--s24) var(--s40); align-items: center; }
.consult__title { font-size: 24px; }
.consult__sub { margin-top: var(--s8); color: var(--text2); font-size: 15px; }
.form__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: var(--s12); }
.form__legal { display: flex; gap: var(--s8); align-items: flex-start; margin-top: var(--s12); font-size: 13px; color: var(--text2); }
.form__legal a { color: var(--brand-dark); text-decoration: underline; text-underline-offset: 2px; }
.form__legal a:hover { color: var(--brand-accent); }
.check { position: relative; flex: none; width: 18px; height: 18px; margin: 1px 0 0; appearance: none; border: 1px solid var(--line); border-radius: 4px; background: var(--white); cursor: pointer; }
.check:checked { background: var(--brand-accent); border-color: var(--brand-accent); }
.check:checked::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid var(--white); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.check:focus-visible { box-shadow: 0 0 0 4px var(--accent-15); outline: none; }
.form__status { margin-top: var(--s12); font-size: 14px; font-weight: 600; min-height: 20px; }
.form__status.is-ok { color: var(--ok); }
.form__status.is-err { color: var(--err); }

/* ---------- подвал ---------- */
.footer { border-radius: var(--r-hero) var(--r-hero) 0 0; }
.footer__in { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 2fr) minmax(0, 4fr); gap: var(--s40); padding: var(--s64) 0 var(--s40); }
.footer__brand { display: flex; flex-direction: column; gap: var(--s16); align-items: flex-start; }
.footer__name { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; }
.footer__desc { color: var(--text2-dark); font-size: 14px; }
.footer__col h3 { font-size: 13px; font-weight: 600; color: var(--text2-dark); margin-bottom: var(--s12); }
.footer__col ul { display: flex; flex-direction: column; gap: var(--s8); font-size: 15px; }
.footer__col a:hover { color: var(--brand-accent); }
.footer__contacts { display: flex; flex-direction: column; gap: var(--s8); font-size: 15px; }
.footer__contacts .big { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; white-space: nowrap; }
.footer__contacts a:hover { color: var(--brand-accent); }
.footer__contacts .muted { color: var(--text2-dark); font-size: 13px; line-height: 1.5; }
.footer__links { display: flex; gap: var(--s16); flex-wrap: wrap; }
.footer__bottom { display: flex; justify-content: space-between; gap: var(--s16); flex-wrap: wrap; padding: var(--s24) 0; border-top: 1px solid var(--line-dark); font-size: 13px; color: var(--text2-dark); }
.footer__bottom a:hover { color: var(--white); }

/* плотное меню: на боевой главной пунктов больше, чем в прототипе */
.nav_dense { gap: 0; }
.nav_dense a { padding: 0 8px; font-size: 14px; }
.intent-lead { max-width: 760px; margin: 8px 0 0; color: var(--text2); font-size: 15px; line-height: 1.45; }
.intents { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s16); }
.intent h3, .intent-where h3 { margin: 0 0 8px; font-size: 20px; }
.intent p { margin: 0 0 8px; color: var(--text2); font-size: 14px; line-height: 1.4; }
.intent a { display: block; padding: 10px 0; border-top: 1px solid var(--line); font-weight: 700; }
.intent a:hover { color: var(--brand-accent); }
.intent-where { margin-top: var(--s16); }
.intent-where ul { margin: 0; padding: 0; list-style: none; }
.intent-where li { padding: 10px 0; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.4; }
.intent-where b { font-weight: 800; }
.points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s16); }
.point__name { font-size: 18px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.25; }
.point .pairs { grid-template-columns: minmax(0, 1fr); }
.point .pair:nth-last-child(-n+2) { border-bottom: 1px solid var(--line); }
.point .pair:last-child { border-bottom: 0; }
.contacts + .points, .points + .contacts, .points + .consult, .contacts + .consult { margin-top: var(--s16); }
select.input { cursor: pointer; }
.form__point { width: 100%; margin-bottom: var(--s12); }
.contact-cta__actions_2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.contact-cta__actions_1 { grid-template-columns: minmax(0, 1fr); }

/* ---------- адаптив ---------- */
@media (max-width: 1100px) {
  .nav a { padding: 0 10px; font-size: 14px; }
  .cards_5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer__in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  :root { --pad: 24px; }
  h1 { font-size: 40px; }
  h2 { font-size: 28px; }
  .nav, .city { display: none; }
  .burger { display: inline-flex; margin-left: 8px; }
  .header .cityslot { margin-left: auto; }
  .header .citybtn b,
  .header .citybtn .icon { display: none; }
  .header .citybtn {
    margin-left: 0;
    height: 40px;
    padding: 0 var(--s12);
    border: 1px solid var(--line-dark);
    border-radius: var(--r-ctrl);
  }
  .citypanel { top: 84px; left: 16px; }
  .header__in { height: 72px; }
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__decor { right: -200px; top: -160px; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .why, .reviews, .gallery, .cards_3, .cards_4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards_5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .prices { grid-template-columns: minmax(0, 1fr); }
  .price_tall { grid-row: auto; }
  .master, .contacts, .consult, .points, .kpk-lead, .intents { grid-template-columns: minmax(0, 1fr); }
  .kpk-lead > .section__head,
  .kpk-lead > .card,
  .kpk-lead > .contact-cta { grid-column: 1; grid-row: auto; height: auto; }
}

@media (max-width: 600px) {
  :root { --s64: 48px; }
  h1 { font-size: 30px; }
  h2 { font-size: 26px; }
  .hero__lead { font-size: 16px; }
  .hero__in { padding-top: var(--s24); }
  .hero__actions { width: 100%; }
  .hero__actions .btn { min-width: 0; }
  .kpi__val { font-size: 26px; }
  .kpi_main .kpi__val { font-size: 32px; }
  .why, .reviews, .gallery, .cards_2, .cards_3, .cards_4, .cards_5, .faq, .team, .pairs { grid-template-columns: minmax(0, 1fr); }
  .tile { min-height: 0; }
  .why .tile { min-height: 0; }
  .pair:nth-last-child(-n+2) { border-bottom: 1px solid var(--line); }
  .pair:last-child { border-bottom: 0; }
  .form__row { grid-template-columns: minmax(0, 1fr); }
  .contact-cta__actions { grid-template-columns: minmax(0, 1fr); }
  .contact-cta__phone { font-size: 28px; }
  .footer__in { grid-template-columns: minmax(0, 1fr); gap: var(--s24); }
  .topbar__in { height: auto; padding: var(--s8) 0; flex-wrap: wrap; text-align: center; }
}
@media (max-width: 1100px) {
  .nav_dense a { padding: 0 6px; font-size: 13px; }
}

/* смена города — список из попапа темы, вид кнопок v3 */
.cityslot { position: relative; display: flex; align-items: center; flex: none; }
.citybtn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  margin-left: -8px;
  padding: 0 10px 0 var(--s16);
  border: 0;
  border-left: 1px solid var(--line-dark);
  border-radius: 0;
  background: transparent;
  color: var(--text2-dark);
  font: inherit;
  font-size: 13px;
  white-space: nowrap;
  cursor: pointer;
}
.citybtn b { color: var(--white); font-weight: 700; }
.citybtn .icon { width: 16px; height: 16px; }
.citybtn__change { color: var(--brand-accent); font-weight: 700; }
.citybtn:hover .citybtn__change { color: var(--white); }
.citybtn_drawer {
  margin: 0;
  height: 44px;
  padding: 0 var(--s12);
  border: 1px solid var(--line-dark);
  border-radius: var(--r-ctrl);
}
.citypanel {
  display: none;
  position: fixed;
  z-index: 80;
  top: 132px;
  left: max(16px, calc((100% - var(--container)) / 2));
  width: min(440px, calc(100% - 32px));
  max-height: min(70vh, 520px);
  overflow: auto;
  padding: var(--s8);
  background: var(--white);
  color: var(--brand-dark);
  border: 1px solid var(--line);
  border-radius: var(--r-card);
}
.citypanel.is-open { display: block; }
.citypanel__title { padding: var(--s8) var(--s12); font-size: 13px; font-weight: 700; color: var(--text2); }
.citypanel ul { list-style: none; margin: 0; padding: 0; }
.citypanel a {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 var(--s12);
  border-radius: var(--r-ctrl);
  color: var(--brand-dark);
  font-weight: 600;
  white-space: nowrap;
}
.citypanel a:hover { background: var(--brand-gray); }
.citypanel a.is-current { background: var(--accent-15); color: var(--brand-accent); }

.spb-map { margin-bottom: 28px; }
.spb-map__head { margin-bottom: 16px; }
.spb-map__head h2 { margin: 8px 0; }
.spb-map__head p { max-width: 760px; margin: 0; color: var(--text2); font-size: 15px; line-height: 1.45; }
.spb-map__body {
  display: grid;
  grid-template-columns: 380px minmax(0, 1fr);
  gap: 16px;
  height: 640px;
}
.spb-map__list {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  background: var(--white);
}
.spb-map__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: var(--brand-dark);
}
.spb-map__item:last-child { border-bottom: 0; }
.spb-map__item.is-on { background: #E7F6FB; box-shadow: inset 3px 0 0 var(--brand-accent); }
.spb-map__item b { font-size: 16px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.25; }
.spb-map__addr { font-size: 13px; line-height: 1.35; color: var(--text2); }
.spb-map__tel {
  display: block;
  color: var(--brand-dark);
  font-size: 15px;
  font-weight: 800;
  font-variant-numeric: normal;
  font-feature-settings: normal;
  white-space: nowrap;
}
.spb-map__tel span { margin-right: 6px; color: var(--text2); font-weight: 600; }
.spb-map__ext { font-size: 12px; font-weight: 700; color: var(--brand-accent); }
.spb-map__canvas {
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  background: var(--brand-gray);
}
@media (max-width: 900px) {
  .spb-map__body { grid-template-columns: minmax(0, 1fr); height: auto; }
  .spb-map__canvas { height: 320px; }
  .spb-map__list { max-height: 520px; }
}
@media (max-width: 900px) {
  .citypanel { top: 84px; left: 16px; }
}

/* Телефон в шапке не должен уезжать за край: body обрезает overflow-x,
   а nowrap-строка меню + город + pill шире окна между 900 и 1240.
   Меню уходит в бургер раньше, pill остаётся целиком. Ниже 700 pill
   не влезает рядом с логотипом — номер остаётся в меню. */
@media (max-width: 1240px) {
  .nav { display: none; }
  .burger { display: inline-flex; margin-left: 8px; }
  .header__phone { display: inline-flex; flex: none; margin-left: auto; }
}
@media (max-width: 700px) {
  .header__phone { display: none; }
}