/* ============================================================================
   Главная, группа «что делаем и сколько стоит»:
   направления (.dkMap--home) · цены (.dkP--home) · акции (.dkAk--home).

   Файл НЕ самодостаточен и не должен им быть. Все три блока переиспользуют
   разметку и классы существующих страниц, поэтому здесь лежат только отличия
   главной. Копировать сюда правила .dkMap__tile, .dkP__row и .dkAk__card
   значило бы завести вторую версию вёрстки, которая разойдётся с первой
   на ближайшей правке витрины.

   Подключать вместе с ним (порядок обязателен, этот файл — последний):
     assets/uslugi.css        → .dkMap__*   (карта направлений)
     assets/service.css       → .dkP__*     (аккордеон цен, база t123)
     assets/service-page.css  → .dkP__*     (<details>, акцентные кнопки, контраст)
     assets/archives.css      → .dkAk__*    (карточка акции)

   Значения — из tokens.css. Единственный литерал цвета — `#fff` в правиле
   фона --bgWhite: белого токена в системе нет, и во всех файлах темы он
   записан так же (см. assets/front-lyudi.css).
   Специфичность модификаторов поднята до двух классов (.dkP.dkP--home)
   намеренно: так правило не зависит от того, каким по счёту подключён файл.
   Интерактива нет: аккордеон цен — нативный <details>, на карте и в акциях
   сворачивать нечего.
   ========================================================================== */

/* ==========================================================================
   1. Направления — компактная карта
   ========================================================================== */

/* Плитки ниже, чем на витрине: там карта и есть страница, здесь она один блок
   из десяти, и 200px минимальной высоты на семь плиток — это лишний экран
   прокрутки до цен. Ужимается высота, а не содержимое: подсказка, число врачей
   и цена остаются на месте. */
.dkMap.dkMap--home .dkMap__tile { min-height: 168px; }

/* Заголовок направления на главной — h3, и кегль соответствует уровню:
   20px из --fz-h3 рядом с h2 секции читался как второй заголовок секции,
   а не как название плитки. */
.dkMap.dkMap--home .dkMap__name { font-size: 18px; }

/* Сноска и кнопки на витрине разделены списком услуг, здесь идут подряд —
   без этого отступа сноска приклеивается к кнопке. */
.dkMap.dkMap--home .dkMap__cta { margin-top: var(--sp-8); }
.dkMap.dkMap--home .dkMap__note { margin-top: var(--sp-4); }

@media (max-width: 639px) {
  /* На телефоне высоту держит содержимое: у плитки в 166px шириной
     фиксированный минимум оставлял бы пустой низ. Две колонки при этом
     сохраняются — правило из uslugi.css не трогаем. */
  .dkMap.dkMap--home .dkMap__tile { min-height: 0; }
  .dkMap.dkMap--home .dkMap__name { font-size: 16px; }
}

/* ==========================================================================
   2. Цены — блок по клинике целиком
   ========================================================================== */

/* Чередование фонов секций (§5.1): направления белые → цены --air.
   Если порядок блоков на главной изменится, менять надо здесь, а не в шаблоне. */
.dkP.dkP--home { background: var(--air); }

/* Боковые поля. .dkP из service.css объявляет padding: 72px 20px, но
   service-page.css перебивает его на `var(--section-y) 0`, а у .dkP__wrap
   собственный отступ появляется только ниже 640px. В итоге на экранах
   641–1240px блок цен упирается в края окна. На странице услуги это тот же
   дефект; здесь он закрыт для главной, там его надо закрыть отдельно. */
.dkP.dkP--home .dkP__wrap { padding: 0 var(--gutter); }

/* Три плашки .dkP__anchors на главной не выводятся (нечем наполнить: «три
   главные цены клиники» в базе не заведены), поэтому аккордеон идёт сразу
   за подзаголовком и 44px сверху из service.css здесь превращаются в дыру. */
.dkP.dkP--home .dkP__acc { margin-top: var(--sp-8); }

/* Подзаголовок блока — счётчик позиций, а не фраза: тот же --navy, что
   у .dkP__sub на странице услуги (в service.css он --blue, а это 2.03:1
   на белом). Правило продублировано, потому что фон секции здесь другой
   и контраст надо держать явно. */
.dkP.dkP--home .dkP__sub {
  color: var(--navy);
  font-size: var(--fz-sub);
}

/* Две ghost-кнопки в подвале блока (файл прейскуранта и страница цен)
   на телефоне встают в колонку: правило service.css `.dkP__btn{flex:1 1 100%}`
   уже это делает, здесь только цель нажатия. */
@media (max-width: 639px) {
  .dkP.dkP--home .dkP__btn { min-height: 48px; }
}

/* ==========================================================================
   3. Акции
   ========================================================================== */

/* Секция после --air снова белая — чередование продолжается. Наследуется
   из archives.css, здесь ничего переопределять не нужно.

   Заголовок секции. В archives.css есть .dkAk__h1 (страница акций) и нет
   .dkAk__h2: на главной акции — блок, а не страница, и заголовок обязан быть
   h2 с кеглем h2. Значения те же, что у .dkUs__h2 и .dkMap__h2. */
.dkAk__h2 {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: var(--fz-h2);
  line-height: var(--lh-h2);
  letter-spacing: var(--tracking-h1);
  color: var(--ink);
  margin: 0;
}

/* Карточки на главной идут по две в ряд, а на /akcii/ — в колонку во всю
   ширину. Причина та же, по которой на архиве они широкие: там условия акции
   надо читать, здесь — увидеть, что предложения есть.

   Порог колонки — 500px, а не 320. Ряд из карточек по 320px заставлял класть
   картинку сверху во всю ширину карточки, а картинка во всю ширину — это
   её же ширина, делённая на 16/9: при ряде в 566px одна только картинка
   давала 318px высоты, и секция из двух акций вырастала до 1243px (замер
   в headless Chrome, 1280px). Карточка в 500px и шире несёт картинку сбоку,
   и высоту секции задаёт текст, а не фотография.
   min(500px,100%) вместо голого 500px обязателен: без min() ряд не сжимается
   и на 375px страница уезжает вбок. */
.dkAk.dkAk--home .dkAk__list {
  grid-template-columns: repeat(auto-fit, minmax(min(500px, 100%), 1fr));
  margin-top: var(--sp-8);
}

/* Раскладка карточки — фото сверху, текст снизу, и на десктопе, и на телефоне
   (решение владельца 04.08.2026, было бок о бок: узкая высокая колонка
   с фото при горизонтальных исходниках (768×511) обрезала object-fit: cover
   почти половину ширины кадра — с человеком по краю. Полноширинная лента
   наверху обрезает только по высоте, кадр остаётся почти целиком). Одна
   колонка на всех брейкпоинтах — мобильное правило ниже по файлу теперь
   не нужно, десктоп его больше не переопределяет. */
.dkAk.dkAk--home .dkAk__card { grid-template-columns: minmax(0, 1fr); }

.dkAk.dkAk--home .dkAk__img {
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
}

/* Поля — как на телефоне (--sp-5): карточка на главной вдвое уже архивной,
   и 24px по кругу забирают у текста ещё 8px ширины. */
.dkAk.dkAk--home .dkAk__body { padding: var(--sp-5); }

/* Заголовок карточки на главной — h3, и кегль соответствует уровню: 24px
   рядом с h2 секции читались как второй заголовок секции. Тот же приём,
   что у .dkMap__name выше. */
.dkAk.dkAk--home .dkAk__title {
  font-size: var(--fz-h3);
  line-height: var(--lh-h3);
}

/* Список условий плотнее на 2px в строке: на превью он идёт сразу за
   заголовком, и архивные 8px между пунктами разрывают его на три абзаца. */
.dkAk.dkAk--home .dkAk__condItem { margin-bottom: 6px; }

/* Кнопки карточки прибиты к низу (в archives.css у .dkAk__actions
   `margin: auto 0 0`), поэтому в ряду из двух карточек разной высоты они
   остаются на одной линии. У строки ссылок самой секции такого поведения
   быть не должно — иначе она прилипает к карточкам. */
.dkAk.dkAk--home > .dkAk__wrap > .dkAk__actions { margin: var(--sp-6) 0 0; }

/* Правовая сноска блока — тот же вид, что на /akcii/. Отступ больше:
   после сетки карточек 24px читаются как часть последней карточки. */
.dkAk.dkAk--home .dkAk__legal { margin-top: var(--sp-8); }

/* --- Цвет текста кнопок против стилей Elementor ---------------------------
   Kit конструктора красит ссылки правилом вида `.elementor-kit-N a` — класс
   плюс тег, (0,1,1), и одиночный класс он перебивает. Проверено по всем
   ссылкам и кнопкам, которые рисуют три блока этой группы: каждая уже покрыта
   двухклассовым правилом в исходном файле —
     .dkMap .dkMap__btn, .dkMap .dkMap__ghost, .dkMap .dkMap__link,
     .dkMap .dkMap__go                                   → assets/uslugi.css
     .dkP .dkP__btn--main, .dkP .dkP__btn--ghost         → assets/service-page.css
     .dkAk .dkAk__btn, .dkAk .dkAk__link,
     .dkAk .dkAk__titleLink                              → assets/archives.css
   Добавлять здесь нечего, и продублированное правило было бы третьей копией
   того же значения. Заголовок .dkAk__h2 ниже — не ссылка, kit его не трогает,
   цвет задан один раз в разделе 3.

   Одно исключение остаётся снаружи этой группы: .dkMap__tile--go — сама
   плитка-ссылка. Собственного color у неё нет, но каждый текстовый потомок
   (.dkMap__name, .dkMap__hint, .dkMap__facts, .dkMap__price, .dkMap__cap,
   .dkMap__soft) свой цвет объявляет, так что наследовать голубой из палитры
   конструктора нечему. */

/* ==========================================================================
   4. Фон секции — задаёт front-page.php, а не блок
   ==========================================================================
   Чередование #fff → --air → #fff → --tint (§5.1) складывается из всей
   страницы: блок не знает, кто стоит перед ним, и жёстко заданный фон
   ломается при первой же перестановке. Партиал принимает bg: 'white' | 'air'
   | 'tint'; без аргумента остаётся фон по умолчанию — направления и акции
   белые, цены на --air.

   Правила стоят последними в файле и записаны двумя классами: у .dkP--home
   выше уже объявлен фон, и при равной специфичности решает порядок.
   Имена модификаторов те же, что в assets/front-lyudi.css, чтобы на главной
   не было двух словарей для одного и того же. */
.dkMap.dkMap--bgWhite,
.dkP.dkP--bgWhite,
.dkAk.dkAk--bgWhite { background: #fff; }

.dkMap.dkMap--bgAir,
.dkP.dkP--bgAir,
.dkAk.dkAk--bgAir { background: var(--air); }

.dkMap.dkMap--bgTint,
.dkP.dkP--bgTint,
.dkAk.dkAk--bgTint { background: var(--tint); }