/*
Theme Name: Domus Moderna Child
Theme URI: https://domusmoderna.ae
Description: Дочерняя тема Domus Moderna — фирменный хедер, hero и подвал. Дизайнерский ремонт, мебель и бассейны в Дубае.
Author: Domus Moderna
Version: 1.1.93
*/

/* =========================================================
   DOMUS MODERNA — единый слой дизайн-токенов (v1.1.0)
   ---------------------------------------------------------
   ВСЯ палитра сайта управляется ОТСЮДА. Чтобы изменить
   акцент/фон/линии — правь только эти переменные.

   Премиум-редизайн (июнь 2026):
   • Оранжевый (#F49800) — ТОЛЬКО в логотипе/wordmark, в CSS не используется.
   • Фон — тёплый off-white, не чистый белый.
   • Основной акцент (кнопки, ссылки) — графит.
   • Вторичный акцент (eyebrow, тонкие линии, обводки) — приглушённая латунь.
   Шрифты: GetVoIP Grotesque (только wordmark) · Inter (заголовки Heavy 800 + текст).
========================================================= */

:root {
  /* --- Фоны --- */
  --bg: #FAF8F5;          /* основной тёплый off-white фон */
  --bg-2: #F3EFE9;        /* вторичный песочный фон для чередования секций */
  --surface: #FFFFFF;     /* карточки/блоки */
  
  /* --- Текст и акценты --- */
  --ink: #1C1B19;         /* основной цвет текста / заголовков (графит) */
  --tx: #3C3A36;          /* вспомогательный текст */
  --mut: #6E6A5F;         /* приглушённый текст / подписи */
  --graphite: #2B2926;    /* графитовый фон тёмных страниц (.dm-infopage) и полосы статистики — менять ТОЛЬКО здесь */
  --on-dark: #A8A8A5;      /* текст и ссылки на тёмных поверхностях (подвал) — менять ТОЛЬКО здесь */
  --on-dark-2: #969693;    /* приглушённый текст на тёмном (копирайт, дисклеймер) */
  --on-dark-strong: #F4F1EA;      /* тёплый почти-белый: текст/иконки на тёмном — менять ТОЛЬКО здесь */
  --on-dark-strong-rgb: 244, 241, 234;  /* тот же цвет для rgba() (границы/подложки на тёмном) */
  /* === ЕДИНЫЙ ЛАТУННЫЙ АКЦЕНТ — менять ТОЛЬКО здесь, тянется по всему сайту через var(--brass) === */
  --brass: #B0894F;        /* основной латунный акцент UI (декор: линии, иконки, кольца) */
  --brass-text: #8A6A3B;   /* латунь для ТЕКСТА — контраст AA на светлом фоне */
  --brass-hover: #B89A63;  /* латунь при наведении (hover) */

  /* === ЗЕЛЁНЫЙ WHATSAPP — единый для всех CTA, менять ТОЛЬКО здесь === */
  --wa: #25D366;           /* зелёный WhatsApp */
  --wa-hover: #1EA952;     /* зелёный WhatsApp при наведении */

  /* === КНОПКИ — единый размер для ВСЕХ CTA (менять ТОЛЬКО здесь) === */
  --btn-py: 14px;          /* вертикальный паддинг */
  --btn-px: 28px;          /* горизонтальный паддинг */
  --btn-fs: 15px;          /* кегль текста кнопки */
  --btn-fw: 600;           /* вес текста кнопки */
  --btn-gap: 9px;          /* отступ иконка ↔ текст */
  --btn-min-w: 250px;      /* единая минимальная ширина CTA-кнопок (равняет подвал и сегменты) */
  --btn2-bg: var(--graphite);      /* вторая (графитовая) кнопка — НЕ чёрная */
  --btn2-bg-hover: var(--ink);     /* её hover: чуть темнее графита */
  
  /* --- Линии и границы --- */
  --line: rgba(0, 0, 0, 0.10);
  
  /* --- Размеры --- */
  --hdr: 80px;            /* высота хедера */

  /* --- Токены, ранее жившие в локальном :root header.php --- */
  --accent-hover: #000000;  /* ховер акцента */
  --tx-mut: #8A8579;       /* приглушённый текст */
  --brass-soft: #C2A57A;   /* мягкая латунь на тёмном (eyebrow, звёзды) */
  --on-brass:   #1A1305;    /* тёмный текст на латунных поверхностях */
  /* --- Радиусы — единая шкала (свод в CLAUDE.md §Радиусы). Менять ТОЛЬКО здесь. --- */
  --radius-sm: 4px;    /* кнопки, поля, чипсы */
  --radius-md: 8px;    /* карточки, списки */
  --radius-lg: 12px;   /* панели, CTA-секции */
  --radius-full: 50%;  /* круглые: иконки, аватары */
  --display: 'Inter', sans-serif;  /* заголовки */
  --body: 'Inter', sans-serif;     /* текст */
  /* === ТИПОГРАФИКА — единый стандарт (свод в CLAUDE.md §5). Размеры менять ЗДЕСЬ. === */
  --fs-h1: clamp(30px, 5vw, 48px);    /* H1 страницы / герой */
  --fs-h2: clamp(24px, 3.2vw, 32px);  /* заголовок секции */
  --fs-h3: clamp(20px, 2.4vw, 24px);  /* подзаголовок */
  --fs-lead: 15px;                    /* лид секции */
  --fs-body: 15px;                    /* основной текст */
  --fs-kicker: 12px;                  /* кикер КАПС */
  --fs-cap: 13px;                     /* подпись/мелкая метка (было 12.5-13px вразнобой) */
  --fw-head: 800;                     /* заголовки */
  --fw-sub: 700;                      /* подзаголовки и кикеры */
  --ls-head: -0.02em;                 /* трекинг заголовков */
  --ls-kicker: 0.14em;                /* разрядка кикеров */
}

/* === КАНОНИЧЕСКИЕ ТИПОГРАФИЧЕСКИЕ КЛАССЫ (для новых блоков/страниц) === */
.dm-h1{font-family:var(--display);font-size:var(--fs-h1);font-weight:var(--fw-head);line-height:1.1;letter-spacing:var(--ls-head);color:var(--ink);margin:0 0 16px}
.dm-h2{font-family:var(--display);font-size:var(--fs-h2);font-weight:var(--fw-head);line-height:1.12;letter-spacing:var(--ls-head);color:var(--ink);margin:0 0 20px}
.dm-h3{font-family:var(--display);font-size:var(--fs-h3);font-weight:var(--fw-sub);line-height:1.2;letter-spacing:-.01em;color:var(--ink);margin:0 0 12px}
.dm-eyebrow{font-family:var(--body);font-size:var(--fs-kicker);font-weight:var(--fw-sub);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--brass-text);margin:0 0 10px}
/* Латунная ссылка внутри текста — единый класс вместо inline style="color:var(--brass)".
   Использует --brass-text (контраст AA на светлом фоне). Менять цвет — в :root. */
.dm-a{color:var(--brass-text);text-decoration:none}
.dm-a:hover{color:var(--brass-hover);text-decoration:underline}
/* Фото в шаблонах услуг — вместо inline. Менять радиус — в :root (--radius-lg) */
.dm-svc-img{width:100%;height:auto;display:block;border-radius:var(--radius-lg)}
/* Подпись под фото (figcaption) — вместо inline */
.dm-figcap{margin-top:10px;font-size:13px;color:var(--mut)}
.dm-lead{font-family:var(--body);font-size:var(--fs-lead);font-weight:400;line-height:1.6;color:var(--mut);margin:0 0 24px}
.dm-text{font-family:var(--body);font-size:var(--fs-body);font-weight:400;line-height:1.55;color:var(--tx)}

/* === БАЗОВЫЙ РЕСЕТ ТИПОГРАФИКИ (единый источник — :root выше) ===============
   Голые h1–h4, p, li автоматически берут размер/массу/шрифт/трекинг из токенов.
   ЦВЕТ здесь НЕ задаём: тёмные секции (герой, О нас, CTA) ставят свой светлый
   цвет собственными правилами — не перекрываем их.
   Специфичность минимальна (селектор-элемент) — ЛЮБОЕ правило с классом сильнее
   и перекрывает ресет. Поэтому существующие страницы не меняются, а новый текст
   без класса выходит уже в стандарте. Значения менять НЕ здесь, а в :root. ==== */
h1{font-family:var(--display);font-size:var(--fs-h1);font-weight:var(--fw-head);line-height:1.1;letter-spacing:var(--ls-head)}
h2{font-family:var(--display);font-size:var(--fs-h2);font-weight:var(--fw-head);line-height:1.12;letter-spacing:var(--ls-head)}
h3{font-family:var(--display);font-size:var(--fs-h3);font-weight:var(--fw-sub);line-height:1.2;letter-spacing:-.01em}
h4{font-family:var(--display);font-size:var(--fs-body);font-weight:var(--fw-sub);line-height:1.3;letter-spacing:-.01em}
p{font-family:var(--body);font-size:var(--fs-body);line-height:1.55}
li{font-family:var(--body);font-size:var(--fs-body);line-height:1.55}

/* =========================================================
   ФИРМЕННЫЙ ХЕДЕР И БАЗОВЫЕ ЭЛЕМЕНТЫ
========================================================= */
.dm-nav-logo img { height: 32px; width: auto; display: block; }
.dm-burger span { width: 24px; }
.dm-burger:hover span { background: var(--brass); }
.dm-nav .dm-burger,
.dm-nav .dm-burger:hover,
.dm-nav .dm-burger:focus,
.dm-nav .dm-burger:active,
.dm-nav .dm-burger.dm-open { background: transparent !important; border: none !important; box-shadow: none !important; }
.dm-nav-right { gap: 16px; }
.dm-phone { font-weight: 700; color: var(--ink); text-decoration: none; display: flex; align-items: center; gap: 8px; font-size: 15px; }
.dm-phone i { font-size: 20px; color: var(--brass); }
.dm-btn-cta { background: var(--btn2-bg); color: var(--on-dark-strong); padding: var(--btn-py) var(--btn-px); border-radius:var(--radius-sm); text-decoration: none; font-weight: var(--btn-fw); font-size: var(--btn-fs); transition: background .25s ease; }
.dm-btn-cta:hover { background: var(--btn2-bg-hover); }

/* Выпадающее меню */
.dm-nav-menu { list-style: none; display: flex; gap: 24px; margin: 0; padding: 0; }
.dm-nav-menu a { text-decoration: none; color: var(--tx); font-weight: 500; font-size: 15px; display: flex; align-items: center; gap: 6px; padding: 8px 0; transition: color .25s ease; }
.dm-nav-menu a:hover { color: var(--ink); }
.dm-nav-menu a i { font-size: 18px; color: var(--brass); }

/* Мобильный бургер */
.dm-menu-mob { display: none; position: absolute; top: var(--hdr); left: 0; right: 0; background: var(--surface); border-bottom: 1px solid var(--line); padding: 24px; flex-direction: column; gap: 16px; box-shadow: 0 4px 12px rgba(0,0,0,.05); }
.dm-nav.dm-open-menu .dm-menu-mob { display: flex; }

/* =========================================================
   ФИРМЕННЫЙ ПРЕД-CTA И ФУТЕР
========================================================= */
.dm-precta-wrap { background: var(--bg-2); padding: 72px 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.dm-precta { max-width: 1140px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 40px; }
.dm-precta-text { display: flex; flex-direction: column; gap: 8px; }
.dm-precta-text strong { font-size: 24px; font-weight: 800; color: var(--ink); font-family: 'Inter', sans-serif; letter-spacing: -.02em; line-height: 1.2; }
.dm-precta-text span { font-size: 15px; color: var(--tx); max-width: 680px; }
.dm-precta-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; flex-shrink: 0; } /* две кнопки строго одной ширины */
.dm-precta-btn, .dm-precta-btn2 { display: inline-flex; min-width: var(--btn-min-w); align-items: center; justify-content: center; gap: var(--btn-gap); padding: var(--btn-py) var(--btn-px); border-radius:var(--radius-sm); font-weight: var(--btn-fw); font-size: var(--btn-fs); text-decoration: none; white-space: nowrap; cursor: pointer; transition: background .15s ease; }
.dm-precta-btn { background: var(--wa); color: var(--surface); }
.dm-precta-btn:hover { background: var(--wa-hover); }
.dm-precta-btn2 { background: var(--btn2-bg); color: var(--on-dark-strong); }
.dm-precta-btn2:hover { background: var(--btn2-bg-hover); }

.dm-footer { background: var(--graphite); color: var(--on-dark); padding: 56px 32px 28px; font-family: 'Inter', sans-serif; }
/* лого-колонка 1.6fr (не трогаем) + 4 равные текстовые колонки; gap — расстояние между колонками, можно менять */
.dm-footer-main { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 32px; margin-bottom: 40px; align-items: start; }
/* В SVG-лого ~14.8px пустоты сверху (при height 60px), заголовки — 5.3px. -9px поднимает лого ровно на линию текста.
   Если поменяешь height лого — пересчитай этот сдвиг (или скажи мне). */
.dm-footer-logo img { height: 60px; width: auto; display: block; margin-top: -9px; margin-bottom: 14px; }
.dm-footer-about { font-size: 13px; line-height: 1.6; color: var(--on-dark); margin-bottom: 18px; }
.dm-footer-social { display: flex; gap: 12px; }
.dm-footer-social a { display: inline-flex; justify-content: center; align-items: center; width: 36px; height: 36px; border-radius:var(--radius-full); background: var(--ink); border: 1px solid var(--brass); color: var(--on-dark-strong); text-decoration: none; transition: background .25s ease; }
.dm-footer-social a:hover { background: var(--graphite); }
.dm-footer-col h4 { font-size: 14px; font-weight: 700; color: var(--on-dark-strong); margin-bottom: 16px; text-transform: uppercase; letter-spacing: .05em; }
.dm-footer-col { display: flex; flex-direction: column; gap: 12px; }
.dm-footer-link, .dm-footer-contact { text-decoration: none; color: var(--on-dark); font-size: 14px; transition: color .25s ease; display: inline-flex; align-items: center; gap: 8px; }
.dm-footer-link:hover, .dm-footer-contact:hover { color: var(--brass); }
.dm-footer-contact i { font-size: 16px; color: var(--brass); }
.dm-footer-bottom { border-top: 1px solid rgba(244,241,234,.09); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: var(--on-dark-2); }
.dm-footer-bottom-links { display: flex; gap: 24px; }
.dm-footer-bottom-links a { text-decoration: none; color: var(--on-dark-2); }
.dm-footer-bottom-links a:hover { color: var(--on-dark-strong); }
/* Дисклеймер — мелкая строка под нижней панелью */
.dm-footer-disclaimer { flex:1 1 auto; margin:0; padding:0; border:none; font-size:11px; line-height:1.4; color:var(--on-dark-2); text-align:center; max-width:900px; }

@media (max-width: 1024px) {
  .dm-footer-main { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  .dm-phone span { display: none; }
  .dm-precta-wrap, .dm-footer { padding-left: 20px; padding-right: 20px; }
  .dm-precta { flex-direction: column; gap: 20px; align-items: stretch; }
  .dm-precta-btns { grid-template-columns: 1fr; gap: 12px; }
  .dm-precta-btn, .dm-precta-btn2 { display: flex !important; width: 100% !important; justify-content: center !important; }
  .dm-footer-main { grid-template-columns: 1fr; gap: 36px; margin-bottom: 40px; }
  .dm-footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
  .dm-footer-bottom-links { justify-content: center; }
}
@media (max-width: 480px) {
  .dm-nav { padding: 0 16px; }
  .dm-precta-wrap { padding: 48px 16px; }
  .dm-precta-text strong { font-size: 20px; }
  .dm-footer { padding: 48px 16px 24px; }
}

/* --- Мобильная версия (Фиксы вылетов и кнопок) --- */
@media (max-width: 768px) {
  .dm-precta-wrap, 
  .dm-footer { 
    padding-left: 20px; 
    padding-right: 20px; 
  }
  
  .dm-precta { 
    padding: 24px; 
    gap: 20px;
  }
  .dm-precta-text strong {
    font-size: 18px;
  }
  .dm-precta-btns { 
    grid-template-columns: 1fr; 
    gap: 12px; 
  }
  .dm-precta-btn, 
  .dm-precta-btn2 { 
    display: flex !important; 
    width: 100% !important; 
    max-width: 100% !important; 
    justify-content: center !important; 
    box-sizing: border-box !important; 
    padding: 14px 16px;
    white-space: nowrap;
  }

  .dm-footer-col { 
    align-items: flex-start; 
  }
}

/* ============================================================
   КНОПКИ — единый стиль и фикс «радуги» на ховере.
   Глобальные link-цвета (a:link / :visited / :hover из Astra) больше
   не протекают в текст кнопок. Латунь убрана из заливок (бренд: латунь
   только тонкие линии). WhatsApp-зелёный ховер выровнен везде.
   ============================================================ */

/* Заливные кнопки с белым текстом — цвет жёстко во всех состояниях */
.dm-precta-btn,  .dm-precta-btn:link,  .dm-precta-btn:visited,  .dm-precta-btn:hover,  .dm-precta-btn:active,  .dm-precta-btn:focus,
.dm-precta-btn2, .dm-precta-btn2:link, .dm-precta-btn2:visited, .dm-precta-btn2:hover, .dm-precta-btn2:active, .dm-precta-btn2:focus,
.dm-btn-cta,     .dm-btn-cta:link,     .dm-btn-cta:visited,     .dm-btn-cta:hover,     .dm-btn-cta:active,     .dm-btn-cta:focus,
.dm-wabtn,       .dm-wabtn:link,       .dm-wabtn:visited,       .dm-wabtn:hover,       .dm-wabtn:active,       .dm-wabtn:focus { color: var(--surface); }

/* Графитовые CTA: ховер — темнее графита, НЕ латунь */
.dm-btn-cta:hover, .dm-precta-btn2:hover { background: var(--btn2-bg-hover); }

/* WhatsApp-кнопки: единый зелёный ховер */
.dm-precta-btn:hover, .dm-wabtn:hover { background: var(--wa-hover); }

/* Контурная кнопка на тёмном hero («Задать вопрос») — текст всегда белый */
.dm-hbp,         .dm-hbp:link,         .dm-hbp:visited,         .dm-hbp:hover,         .dm-hbp:active,         .dm-hbp:focus { color: var(--on-dark-strong); }
/* Светлая основная кнопка на hero — текст всегда тёмный */
.dm-hbp.dm-pri,  .dm-hbp.dm-pri:link,  .dm-hbp.dm-pri:visited,  .dm-hbp.dm-pri:hover,  .dm-hbp.dm-pri:active,  .dm-hbp.dm-pri:focus { color: var(--tx); }

/* ============================================================
   КНОПКИ И МЕНЮ — единый canon на всех страницах + фикс «радуги».
   Цвет текста зафиксирован для :link/:visited/:hover/:active, поэтому
   глобальные link-цвета Astra больше не протекают нигде.
   ============================================================ */

/* Верхнее меню */
.dm-nav-menu a, .dm-nav-menu a:link, .dm-nav-menu a:visited { color: var(--tx); }
.dm-nav-menu a:hover, .dm-nav-menu a:active { color: var(--ink); }

/* Боковое меню (drawer) — пункты во всех вкладках */
.dm-drawer a.dm-da, .dm-drawer a.dm-da:link, .dm-drawer a.dm-da:visited { color: var(--tx); }
.dm-drawer a.dm-da:hover, .dm-drawer a.dm-da:active { color: var(--ink); }

/* Контактные ссылки */
a.dm-dl, a.dm-dl:link, a.dm-dl:visited, a.dm-dl:hover, a.dm-dl:active { color: var(--tx); }
a.dm-phone, a.dm-phone:link, a.dm-phone:visited { color: var(--ink); }
a.dm-phone:hover, a.dm-phone:active { color: var(--ink); }

/* Футер-ссылки */
.dm-footer-link, .dm-footer-link:link, .dm-footer-link:visited,
.dm-footer-contact, .dm-footer-contact:link, .dm-footer-contact:visited { color: var(--on-dark); }
.dm-footer-link:hover, .dm-footer-link:active,
.dm-footer-contact:hover, .dm-footer-contact:active { color: var(--brass); }

/* Карточки статистики (на тёмной полосе) */
a.dm-sk-link, a.dm-sk-link:link, a.dm-sk-link:visited, a.dm-sk-link:hover, a.dm-sk-link:active { color: inherit; }

/* Кнопки .dm-b (сервисные/лендинговые страницы):
   заливные -> белый текст (был тёмный #111 на графите = баг контраста), ховер темнее;
   контурная .dm-b.s -> остаётся тёмной (вторичная на светлом фоне). */
a.dm-b, a.dm-b:link, a.dm-b:visited, a.dm-b:hover, a.dm-b:active, a.dm-b:focus { color: var(--on-dark-strong); }
a.dm-b:not(.s):hover { background: var(--accent-hover); }
a.dm-b.s, a.dm-b.s:link, a.dm-b.s:visited, a.dm-b.s:hover, a.dm-b.s:active, a.dm-b.s:focus { color: var(--tx); }

/* Карточки услуг .dm-srv — текст детей задан явно, обёртку фиксируем */
a.dm-srv, a.dm-srv:link, a.dm-srv:visited, a.dm-srv:hover, a.dm-srv:active { color: inherit; }

/* ============================================================
   Страницы услуг (.dm-svc) — единый стиль для всех /uslugi/...
   Бренд: off-white фон, графит-заголовки (Inter 800), латунь
   тонкими линиями. Оранжевого нет (только в лого).
   ============================================================ */
.dm-svc{font-family:var(--body);color:var(--tx);max-width:1140px;margin:0 auto;padding:56px 20px 72px;line-height:1.55}
.dm-svc *{box-sizing:border-box}
.dm-svc h1,.dm-svc h2{font-family:var(--display);font-weight:var(--fw-head);line-height:1.1;margin:0;color:var(--ink);letter-spacing:var(--ls-head)}
.dm-svc .eye{font-size:var(--fs-kicker);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--brass-text);font-weight:var(--fw-sub);margin-bottom:14px}
.dm-svc h1{font-size:var(--fs-h1)}
.dm-svc .lead{font-size:clamp(16px,2.2vw,20px);color:var(--mut);max-width:760px;margin-top:18px}
.dm-svc h2{font-size:var(--fs-h2)}
.dm-svc .sub{color:var(--mut);max-width:720px;margin:8px 0 28px}
.dm-svc .blk{margin-top:60px}

/* Журнальный разворот раздела (класс .dm-spread на <section>): H2 уходит в узкую левую колонку,
   текст и таблицы идут справа — ширина страницы работает целиком.
   Блоки с фото (галереи, развороты, схемы) остаются на всю ширину. */
.dm-svc.dm-spread .blk{display:grid;grid-template-columns:280px minmax(0,1fr);column-gap:56px;align-items:start}
.dm-svc.dm-spread .blk>*{grid-column:2;min-width:0}
.dm-svc.dm-spread .blk>h2{grid-column:1;grid-row:1;position:sticky;top:24px}
.dm-svc.dm-spread .blk:not(:has(>h2)),
.dm-svc.dm-spread .blk:has(.dm-gal),.dm-svc.dm-spread .blk:has(.dm-feat),.dm-svc.dm-spread .blk:has(.dm-diagram){display:block}
@media(max-width:980px){
  .dm-svc.dm-spread .blk{display:block}
  .dm-svc.dm-spread .blk>h2{position:static}
}
/* Тонкий контур кадра — фирменный графит вместо светло-серой линии */
.dm-svc.dm-spread .dm-gal figure,.dm-svc.dm-spread .dm-feat .ph,.dm-svc.dm-spread .dm-diagram img{border-color:var(--ink)}

/* Что входит — воздушный список, малые латунные точки, без коробок */
.dm-svc .inc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 48px;margin-top:8px}
@media(max-width:820px){.dm-svc .inc{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.dm-svc .inc{grid-template-columns:1fr}}
.dm-svc .inc>div{padding-left:24px;font-size:var(--fs-body);color:var(--tx);position:relative}
.dm-svc .inc>div::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--brass)}

/* Как мы работаем — авто-номера 01–04 (CSS-счётчик), без латунных линий */
.dm-svc .steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:36px;counter-reset:dmstep}
.dm-svc .step{counter-increment:dmstep}
.dm-svc .step::before{content:counter(dmstep,decimal-leading-zero);display:block;font-size:13px;letter-spacing:.12em;font-weight:700;color:var(--brass-text);margin-bottom:8px}
.dm-svc .step b{display:block;font-size:16px;color:var(--ink);margin-bottom:8px}
.dm-svc .step span{font-size:var(--fs-cap);color:var(--mut)}

/* Доверие — воздух, тонкая волосяная линия сверху, без коробок */

/* FAQ */
.dm-svc .faq{border-top:1px solid var(--line)}
.dm-svc .faq details{border-bottom:1px solid var(--line)}
.dm-svc .faq summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:700;color:var(--ink);font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.dm-svc .faq summary::-webkit-details-marker{display:none}
.dm-svc .faq summary::after{content:"+";color:var(--brass);font-weight:400;font-size:22px;line-height:1;flex:none}
.dm-svc .faq details[open] summary::after{content:"–"}
.dm-svc .faq p{margin:0 0 18px;color:var(--tx);font-size:var(--fs-body);max-width:760px}

/* CTA */
.dm-svc .cta{margin-top:60px;background:var(--graphite);border-radius:var(--radius-lg);padding:clamp(28px,5vw,48px);text-align:center}
.dm-svc .cta h2{color:var(--on-dark-strong);margin-bottom:10px}
.dm-svc .cta p{color:rgba(255,255,255,.72);margin:0 auto 26px;max-width:560px;font-size:15px}
.dm-svc .cta .b{display:inline-flex;align-items:center;gap:8px;border-radius:var(--radius-md);padding:14px 30px;font-weight:700;font-size:15px;text-decoration:none;background:var(--bg);color:var(--ink);transition:background .15s}
.dm-svc .cta .b:hover{background:var(--surface)}

@media(max-width:600px){.dm-svc{padding:36px 16px 52px}}
/* ============================================================
   FOOTER BOTTOM + СВОЯ КНОПКА «НАВЕРХ»
   Добавить в КОНЕЦ style.css.
   После вставки поднять Version в шапке style.css (cache-busting).
   ============================================================ */

/* — Нижняя строка: ужать по высоте, тонкая линия сверху — */
.dm-footer .dm-footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;      /* copy слева · дисклеймер центр · ссылки справа */
  gap:20px;
  padding-top:9px;
  padding-bottom:9px;
  border-top:1px solid rgba(244,241,234,.10); /* тонкий hairline */
  font-size:11px;                     /* мельче кегль — чтобы дисклеймер уместился в строку */
  line-height:1.4;
}

/* — Копирайт и лицензия: приглушённый текст — */
.dm-footer .dm-footer-copy{
  color:rgba(244,241,234,.55);
  margin:0;
  flex:0 0 auto;
  white-space:nowrap;
}

/* — Ссылки политик: спокойный деловой стиль, без оранжевого — */
.dm-footer .dm-footer-bottom-links{
  display:flex;
  gap:22px;
  flex:0 0 auto;
  white-space:nowrap;
}
.dm-footer .dm-footer-bottom-links .dm-footer-link{
  color:rgba(244,241,234,.70);        /* нейтральный серый */
  font-size:11px;
  text-decoration:none;
  transition:color .2s ease;
}
.dm-footer .dm-footer-bottom-links .dm-footer-link:hover{
  color:var(--on-dark-strong);                      /* чуть светлее на hover */
  text-decoration:underline;
  text-underline-offset:3px;
}

/* — Своя кнопка «наверх» (#dm-to-top), графит, без оранжевого — */
#dm-to-top{
  position:fixed !important;
  right:22px !important;              /* отступ от правого края — можно менять */
  bottom:22px !important;            /* высота над низом — можно менять */
  z-index:990 !important;
  width:46px !important;             /* размер круга — можно менять */
  height:46px !important;
  min-width:46px !important;
  max-width:46px !important;
  flex:0 0 46px !important;
  padding:0 !important;
  aspect-ratio:1/1 !important;
  border-radius:var(--radius-full) !important;
  border:1px solid var(--brass) !important;            /* обводка — латунь */
  background:var(--ink);                 /* графитовый фон */
  color:var(--on-dark-strong);                      /* светлая иконка */
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  cursor:pointer;
  opacity:0;                          /* скрыта, пока не прокрутили */
  visibility:hidden;
  transform:translateY(8px);
  transition:opacity .25s ease, transform .25s ease, background .2s ease;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
#dm-to-top.is-visible{                /* класс ставит JS при прокрутке */
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
#dm-to-top:hover{ background:var(--graphite); }

/* — Мобильная версия — */
@media (max-width:600px){
  .dm-footer .dm-footer-bottom{
    flex-direction:column;            /* строка в 3 ряда по центру */
    text-align:center;
    gap:10px;
    padding-top:14px;
    padding-bottom:14px;
  }
  .dm-footer .dm-footer-bottom-links{
    justify-content:center;
    gap:18px;
  }
  #dm-to-top{
    right:14px !important;
    bottom:14px !important;
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    flex:0 0 42px !important;
    font-size:18px;
  }
}

/* ============================================================
   ИНФО-СТРАНИЦЫ (Карьера, Сотрудничество) — класс .dm-infopage
   Тёмный графит, текст светлый, акцент латунь. Без оранжевого.
   ============================================================ */
.dm-infopage{
  background:var(--graphite);
  color:var(--on-dark-strong);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
.dm-infopage .dm-ip-inner{
  max-width:920px;                    /* ширина контента — можно менять */
  margin:0 auto;
  padding:72px 24px 88px;
}

/* — Hero — */
.dm-infopage .dm-ip-hero{ margin-bottom:56px; }
.dm-infopage .dm-ip-kicker{
  color:var(--brass-text);
  font-size:var(--fs-kicker);
  font-weight:var(--fw-sub);
  letter-spacing:var(--ls-kicker);
  text-transform:uppercase;
  margin-bottom:16px;
}
.dm-infopage h1{
  color:var(--on-dark-strong);            /* светлый заголовок на тёмном фоне */
  font-family:var(--display);
  font-size:var(--fs-h1);
  font-weight:var(--fw-head);
  line-height:1.15;
  letter-spacing:var(--ls-head);
  margin:0 0 18px;
}
.dm-infopage .dm-ip-lead{
  color:rgba(244,241,234,.78);
  font-size:18px;
  line-height:1.6;
  max-width:680px;
}

/* — Смысловые блоки — */
.dm-infopage h2{
  color:var(--on-dark-strong);            /* светлый заголовок на тёмном фоне */
  font-family:var(--display);
  font-size:var(--fs-h2);
  font-weight:var(--fw-head);
  margin:48px 0 20px;
  letter-spacing:var(--ls-head);
}
.dm-infopage p{
  color:rgba(244,241,234,.80);
  font-size:16px;
  line-height:1.7;
  margin:0 0 16px;
}

/* — Карточки/строки списка — */
.dm-infopage .dm-ip-list{
  display:grid;
  gap:14px;
  margin:8px 0 8px;
}
.dm-infopage .dm-ip-item{
  border:1px solid rgba(244,241,234,.10);
  border-radius:var(--radius-md);
  padding:18px 20px;
  background:rgba(244,241,234,.02);
}
/* Переход по ссылке из текста услуги (/slovar/#skimmer-pool):
   подсвечиваем нужный термин, чтобы человек сразу увидел, куда попал.
   scroll-margin-top — чтобы карточка не прилипала к верхней кромке экрана */
.dm-infopage .dm-ip-item{scroll-margin-top:24px;transition:border-color .3s,background-color .3s}
.dm-infopage .dm-ip-item:target{
  border-color:var(--brass);
  background:rgba(176,137,79,.10);
}
.dm-infopage .dm-ip-item strong{
  display:block;
  font-size:16px;
  font-weight:600;
  margin-bottom:6px;
}
.dm-infopage .dm-ip-item span{
  color:rgba(244,241,234,.70);
  font-size:15px;
  line-height:1.6;
}

/* — CTA — */
.dm-infopage .dm-ip-cta{
  margin-top:56px;
  padding:32px;
  border:1px solid rgba(169,138,82,.35); /* латунная рамка */
  border-radius:var(--radius-lg);
  background:rgba(169,138,82,.06);
}
.dm-infopage .dm-ip-cta h2{ margin:0 0 12px; }
.dm-infopage .dm-ip-btns{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}
.dm-infopage .dm-ip-btn{
  display:inline-flex;
  align-items:center;
  gap:var(--btn-gap);
  padding:var(--btn-py) var(--btn-px);
  border-radius:var(--radius-sm);
  font-size:var(--btn-fs);
  font-weight:var(--btn-fw);
  text-decoration:none;
  transition:.2s ease;
}
.dm-infopage .dm-ip-btn-mail{
  border:1px solid rgba(244,241,234,.25);
  color:var(--on-dark-strong);
}
.dm-infopage .dm-ip-btn-mail:hover{ background:rgba(244,241,234,.08); }

/* === WhatsApp-CTA: единый класс .dm-wa (зелёная сплошная кнопка) — один эталон на весь сайт === */
.dm-wa{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--btn-gap);
  padding:var(--btn-py) var(--btn-px); border-radius:var(--radius-sm); border:none;
  font-family:var(--body); font-size:var(--btn-fs); font-weight:var(--btn-fw); line-height:1;
  background:var(--wa); color:var(--surface); text-decoration:none;
  transition:background .15s ease; cursor:pointer;
}
.dm-wa:hover{ background:var(--wa-hover); color:var(--surface); }
.dm-wa i{ font-size:18px; }

/* — Мобильная версия — */
@media (max-width:600px){
  .dm-infopage .dm-ip-inner{ padding:48px 18px 64px; }
  .dm-infopage .dm-ip-lead{ font-size:16px; }
  .dm-infopage .dm-ip-cta{ padding:24px; }
}
/* CTA-иконки существующих компонентов — единый размер.
   (.dm-wa i задаётся в каноне .dm-wa выше.)
   !important-нормализатор снят: все WhatsApp-кнопки теперь на едином классе .dm-wa. */
.dm-precta-btn i,.dm-footer-contact i{font-size:18px}
/* ── Универсальная страница (page.php) — отвязка от Astra ───────────── */
.dm-page{max-width:820px;margin:0 auto;padding:56px 20px 72px;font-family:var(--body);color:var(--tx);line-height:1.7}
.dm-prose h1,.dm-prose h2,.dm-prose h3,.dm-prose h4{font-family:var(--display);font-weight:var(--fw-head);letter-spacing:var(--ls-head);line-height:1.2;color:var(--ink);margin:1.6em 0 .5em}
.dm-prose h1{font-size:var(--fs-h1);margin-top:0}
.dm-prose h2{font-size:var(--fs-h2)}
.dm-prose h3{font-size:var(--fs-h3)}
.dm-prose p{margin:0 0 1.1em}
/* Ссылки в тексте инфостраниц — латунь + подчёркивание, вместо браузерного фиолетового.
   :not([class]) бьёт только по «голым» текстовым ссылкам; кнопки (с классами) не трогаются. */
.dm-infopage a:not([class]){color:var(--brass-text);text-decoration:underline;text-underline-offset:2px;transition:color .15s ease}
/* Тот же паттерн для страниц услуг (.dm-svc): голые ссылки в тексте и FAQ — латунь, кнопки с классами не трогаются */
.dm-svc a:not([class]){color:var(--brass-text);text-decoration:underline;text-underline-offset:2px;transition:color .15s ease}
.dm-svc a:not([class]):hover{color:var(--brass-hover)}
.dm-prose a{color:var(--brass-text);text-decoration:underline;text-underline-offset:2px;transition:color .15s ease}
.dm-prose a:hover{color:var(--brass-hover)}
.dm-prose ul,.dm-prose ol{margin:0 0 1.1em 1.25em;padding:0}
.dm-prose li{margin:.35em 0}
.dm-prose img{max-width:100%;height:auto;border-radius:var(--radius-md)}
.dm-prose blockquote{margin:1.4em 0;padding:.7em 1.1em;border-left:3px solid var(--brass);background:var(--bg-2);color:var(--mut)}
.dm-prose table{width:100%;border-collapse:collapse;margin:1.2em 0}
.dm-prose th,.dm-prose td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.dm-prose hr{border:0;border-top:1px solid var(--line);margin:2em 0}
@media(max-width:600px){.dm-page{padding:36px 16px 52px}}
/* ── Список записей и пагинация (index.php фолбэк) ──────────────────── */
.dm-list-item{padding:0 0 1.6em;margin:0 0 1.6em;border-bottom:1px solid var(--line)}
.dm-list-item h2{margin:0 0 .3em}
.dm-list-item h2 a{color:var(--ink);text-decoration:none}
.dm-list-item h2 a:hover{color:var(--brass-text)}
.dm-prose .navigation.pagination{margin-top:2em}
.dm-prose .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.dm-prose .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 10px;border:1px solid var(--line);border-radius:var(--radius-md);color:var(--tx);text-decoration:none}
.dm-prose .page-numbers.current{background:var(--ink);color:var(--on-dark-strong);border-color:var(--ink)}
.dm-prose .page-numbers:hover{border-color:var(--brass);color:var(--brass-text)}
/* ── 404 ───────────────────────────────────────────────────────────── */
.dm-404{text-align:center}
.dm-404-inner{max-width:600px;margin:0 auto;padding:40px 0}
.dm-404-code{font-family:var(--display);font-weight:var(--fw-head);font-size:clamp(72px,18vw,140px);line-height:1;color:var(--brass);letter-spacing:var(--ls-head)}
.dm-404 h1{font-family:var(--display);font-weight:var(--fw-head);font-size:var(--fs-h2);color:var(--ink);margin:8px 0 14px;letter-spacing:var(--ls-head)}
.dm-404 p{color:var(--mut);font-size:16px;line-height:1.6;margin:0 auto 28px;max-width:460px}
.dm-404-btns{justify-content:center}

/* =========================================================
   ШАПКА САЙТА — перенесено из инлайна header.php
   (header.php теперь чистая разметка; hero-фон — абсолютный путь)
   ========================================================= */
/* Палитра наследуется из style.css (:root с дизайн-токенами).
   Локальный :root убран намеренно — единый источник цвета. */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--body,'Inter',sans-serif)}

.dm-nav{background:var(--bg);border-bottom:1px solid var(--line);padding:0 32px;display:flex;align-items:center;gap:20px;height:var(--hdr);position:sticky;top:0;z-index:1100}
.dm-nav-left{display:flex;align-items:center;gap:12px;flex-shrink:0}
.dm-burger{background:none;border:none;cursor:pointer;padding:6px;display:flex;flex-direction:column;justify-content:center;gap:5px;width:34px;height:34px;border-radius:var(--radius-sm);flex-shrink:0}
.dm-burger span{display:block;height:2px;background:var(--tx);border-radius:1px;transition:transform .25s ease,opacity .2s ease}
.dm-burger span:nth-child(1){width:20px}
.dm-burger span:nth-child(2){width:14px}
.dm-burger span:nth-child(3){width:20px}
.dm-burger.dm-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.dm-burger.dm-open span:nth-child(2){opacity:0}
.dm-burger.dm-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);width:20px}
.dm-logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.dm-logo img{height:56px;width:auto;display:block}
.dm-nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0;margin-left:auto}
.dm-contact-group{display:flex;align-items:center;gap:6px}
.dm-phone{display:flex;align-items:center;gap:5px;font-size:var(--fs-cap);font-weight:700;color:var(--tx);text-decoration:none}
.dm-phone:hover{color:var(--ink)}
.dm-phone i{font-size:14px;color:var(--brass)}
.dm-wa-ic{width:32px;height:32px;border-radius:var(--radius-full);background:var(--wa);display:flex;align-items:center;justify-content:center;text-decoration:none;flex-shrink:0}
.dm-wa-ic i{font-size:17px;color:var(--surface)}
.dm-lang{display:flex;align-items:center;border:0.5px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;height:32px}
.dm-lang a{font-family:'Inter',sans-serif;font-size:11.5px;font-weight:700;padding:0 10px;height:32px;line-height:32px;color:var(--mut);text-decoration:none;display:block}
.dm-lang a.dm-on{background:var(--ink);color:var(--on-dark-strong)}
.dm-lang a:not(.dm-on):hover{background:rgba(0,0,0,0.04);color:var(--tx)}
.dm-dsearch{display:flex;align-items:center;margin:10px 16px 10px;background:var(--bg-2);border:0.5px solid var(--line);border-radius:var(--radius-sm);height:38px}
.dm-dsearch input{flex:1;border:none;outline:none;background:transparent;font-size:13px;padding:0 10px;min-width:0;font-family:'Inter',sans-serif;color:var(--tx)}
.dm-dsearch input::placeholder{color:var(--tx-mut)}
.dm-dsearch button{background:none;border:none;cursor:pointer;padding:0 11px;color:var(--mut);display:flex;align-items:center}

.dm-drawer{position:fixed;top:var(--hdr);left:0;width:270px;background:var(--surface);border-right:0.5px solid rgba(0,0,0,0.08);border-top:1px solid rgba(0,0,0,0.08);z-index:1001;transform:translateX(-100%);transition:transform .28s cubic-bezier(.4,0,.2,1);padding:8px 0;height:calc(100vh - var(--hdr));overflow-y:auto}
.dm-drawer.dm-open{transform:translateX(0)}
.dm-drawer a.dm-da{display:flex;align-items:center;gap:11px;padding:12px 22px;font-size:var(--fs-cap);color:var(--tx);text-decoration:none;transition:background .15s,color .15s}
.dm-drawer a.dm-da:hover{background:var(--bg-2);color:var(--ink)}
.dm-drawer a.dm-da i{font-size:17px;color:var(--tx-mut)}
.dm-drawer a.dm-da:hover i{color:var(--brass)}
.dm-dsep{height:0.5px;background:rgba(0,0,0,0.07);margin:6px 0}
.dm-dct{padding:14px 22px}
.dm-dlbl{font-size:10px;color:var(--tx-mut);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.dm-dl{display:flex;align-items:center;gap:7px;font-size:var(--fs-cap);font-weight:700;color:var(--tx);text-decoration:none;margin-bottom:7px}
.dm-dl i{font-size:14px;color:var(--brass)}
.dm-dl.wa i{color:var(--wa)}
.dm-overlay{position:fixed;inset:0;top:var(--hdr);background:rgba(0,0,0,0.06);z-index:1000;opacity:0;pointer-events:none;transition:opacity .28s}
.dm-overlay.dm-open{opacity:1;pointer-events:all}

/* Поправка на верхнюю панель WordPress (видна только когда вы залогинены;
   у посетителей сайта её нет). Сдвигает меню и затемнение ниже админ-бара. */
.admin-bar .dm-drawer,.admin-bar .dm-overlay{top:calc(var(--hdr) + 32px)}
.admin-bar .dm-drawer{height:calc(100vh - var(--hdr) - 32px)}
@media(max-width:782px){
  .admin-bar .dm-drawer,.admin-bar .dm-overlay{top:calc(var(--hdr) + 46px)}
  .admin-bar .dm-drawer{height:calc(100vh - var(--hdr) - 46px)}
}

/* HERO — фото объекта на всю ширину, текст поверх.
   Градиентное затемнение слева→направо решает неравномерный свет кадра
   и держит текст читаемым. */
.dm-hero{position:relative;min-height:560px;display:flex;flex-direction:column;justify-content:center;
  padding:72px 44px 0;overflow:hidden;
  background-size:cover;background-position:center 38%;
  background-image:url('/wp-content/themes/domus-moderna-child/images/dm-hero.jpg'); /* fallback для старых браузеров */
  background-image:image-set(
    url('/wp-content/themes/domus-moderna-child/images/dm-hero.webp') type('image/webp'),
    url('/wp-content/themes/domus-moderna-child/images/dm-hero.jpg') type('image/jpeg')
  )}
/* Оверлей: плотный слева (под текст), прозрачнее справа (видно интерьер) */
.dm-hero::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(20,19,17,.82) 0%,rgba(20,19,17,.62) 38%,rgba(20,19,17,.28) 70%,rgba(20,19,17,.12) 100%)}
.dm-hero>*{position:relative;z-index:2}
.dm-vl{display:none}
.dm-hero-inner{max-width:600px;padding-bottom:48px}
.dm-hero .dm-eyebrow{font-size:var(--fs-kicker);letter-spacing:var(--ls-kicker);text-transform:uppercase;color:var(--brass-soft);font-weight:var(--fw-sub);margin-bottom:16px} /* тёмный герой: латунь светлее для читаемости на фото */
.dm-hq{font-family:var(--display);font-weight:800;font-size:clamp(32px,4.4vw,52px);color:var(--on-dark-strong);line-height:1.06;margin-bottom:18px;letter-spacing:-.02em}
.dm-hq em{font-style:normal;color:var(--on-dark-strong)}
.dm-hsub{font-size:clamp(15px,1.4vw,17px);color:rgba(255,255,255,.82);line-height:1.6;max-width:480px;margin-bottom:30px}
.dm-hbs{display:flex;gap:12px;flex-wrap:wrap}
/* Primary на фото — светлая кнопка (графит на фото сольётся) */
.dm-hbp{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(255,255,255,.5);color:var(--on-dark-strong);border-radius:var(--radius-sm);padding:13px 24px;font-family:var(--body);font-size:var(--fs-cap);font-weight:700;cursor:pointer;text-decoration:none;background:transparent;transition:border-color .15s,color .15s,background .15s}
.dm-hbp:hover{border-color:var(--surface);background:rgba(255,255,255,.1);color:var(--on-dark-strong)}
.dm-hbp i{font-size:15px}
.dm-hbp.dm-pri{background:var(--surface);border-color:var(--surface);color:var(--tx)}
.dm-hbp.dm-pri:hover{background:var(--bg-2);border-color:var(--bg-2);color:var(--tx)}
/* Статистика — тонкой полосой внизу героя, поверх затемнения */
.dm-sc{display:flex;align-self:stretch;margin-top:auto;
  background:rgba(20,19,17,.42);backdrop-filter:blur(3px);border-top:1px solid rgba(255,255,255,.14)}
.dm-sk{padding:10px 28px;border-right:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;justify-content:center;flex:0 0 auto}
.dm-sk:last-child{border-right:none}
.dm-sk.dm-sa .dm-sn{color:var(--brass-soft)}
.dm-sn{font-family:var(--display);font-size:23px;font-weight:800;color:var(--on-dark-strong);line-height:1;margin-bottom:4px}
.dm-sl{font-size:11px;color:rgba(255,255,255,.6);line-height:1.4}
/* Плашка отзывов Google — значок G + звёзды в одну строку (регламент Google) */
.dm-rev-top{display:flex;align-items:center;justify-content:center;gap:7px;margin-bottom:7px}
.dm-g-ic{width:18px;height:18px;display:block;flex:none}
/* Плашка карты проектов — значок карты + цифра в строку (симметрично плашке отзывов) */
.dm-map-top{display:flex;align-items:center;gap:7px;margin-bottom:4px}
.dm-map-ic{width:20px;height:20px;display:block;flex:none}
.dm-map-top .dm-sn{margin-bottom:0}
.dm-stars{display:inline-block;font-size:13px;line-height:1;margin-bottom:7px;background:linear-gradient(90deg,var(--brass-soft) 0 94%,rgba(255,255,255,.25) 94% 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.dm-sn-sub{font-size:13px;font-weight:700;color:rgba(255,255,255,.5);margin-left:1px}

.dm-modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:2000;align-items:center;justify-content:center}
.dm-modal-bg.dm-show{display:flex}
.dm-modal{background:var(--surface);border-radius:var(--radius-sm);width:100%;max-width:520px;max-height:90vh;overflow-y:auto;padding:28px 32px;position:relative;font-family:'Inter',sans-serif}
.dm-mc{position:absolute;top:12px;right:14px;background:none;border:none;cursor:pointer;font-size:20px;color:var(--mut);line-height:1}
.dm-mc:hover{color:var(--tx)}
.dm-mtitle{font-size:18px;font-weight:900;color:var(--tx);margin-bottom:4px}
.dm-msub{font-size:13px;color:var(--mut);margin-bottom:20px}
.dm-mprog{height:2px;background:var(--line);border-radius:var(--radius-sm);margin-bottom:22px}
.dm-mprogf{height:100%;background:var(--ink);border-radius:var(--radius-sm);transition:width .3s}
.dm-slabel{font-size:10.5px;font-weight:700;color:var(--tx-mut);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.dm-mq{font-size:14px;font-weight:700;color:var(--tx);margin-bottom:14px}
.dm-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px}
.dm-opts.dm-c3{grid-template-columns:repeat(3,1fr)}
.dm-opt{background:var(--bg);border:0.5px solid var(--line);border-radius:var(--radius-sm);padding:13px 14px;cursor:pointer;transition:all .15s;text-align:left}
.dm-opt:hover{border-color:var(--ink)} /* hover опции — нейтральный графит (без латуни) */
.dm-opt.dm-sel{border:1.5px solid var(--ink);background:rgba(43,41,38,.04)}
.dm-opt-t{font-size:13px;font-weight:700;color:var(--tx)}
.dm-opt-s{font-size:11px;color:var(--tx-mut);margin-top:3px}
.dm-srow{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.dm-srow label{font-size:13px;color:var(--mut);min-width:56px}
.dm-srow input[type=range]{flex:1}
.dm-sval{font-size:14px;font-weight:700;color:var(--tx);min-width:80px;text-align:right}
.dm-rcard{background:var(--bg);border-radius:var(--radius-sm);padding:18px 20px;margin-bottom:16px}
.dm-rgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.dm-ritem{background:var(--surface);border-radius:var(--radius-sm);padding:12px 14px;border:0.5px solid var(--line)}
.dm-rlbl{font-size:11px;color:var(--mut);margin-bottom:3px}
.dm-rnum{font-size:22px;font-weight:900;color:var(--tx)}
.dm-runit{font-size:11px;color:var(--tx-mut);margin-top:2px}
.dm-rnote{font-size:12px;color:var(--mut);line-height:1.55;border-top:0.5px solid var(--line);padding-top:10px;margin-top:4px}
.dm-nav-btns{display:flex;justify-content:space-between;align-items:center;margin-top:6px}
.dm-mback{background:none;border:0.5px solid var(--line);border-radius:var(--radius-sm);padding:9px 16px;font-family:'Inter',sans-serif;font-size:13px;cursor:pointer;color:var(--mut)}
.dm-mnext{background:var(--ink);border:none;border-radius:var(--radius-sm);padding:10px 22px;font-family:'Inter',sans-serif;font-size:13px;font-weight:700;cursor:pointer;color:var(--on-dark-strong)}
.dm-mnext:hover{background:var(--accent-hover)}
.dm-mnext:disabled{opacity:.35;cursor:not-allowed}
.dm-wabtn{display:flex;align-items:center;justify-content:center;gap:var(--btn-gap);background:var(--wa);color:var(--surface);border:none;border-radius:var(--radius-sm);padding:var(--btn-py) var(--btn-px);font-family:'Inter',sans-serif;font-size:var(--btn-fs);font-weight:var(--btn-fw);cursor:pointer;width:100%;text-decoration:none}
.dm-wabtn:hover{background:var(--wa-hover);color:var(--surface)}
.dm-disc{font-size:11px;color:var(--tx-mut);text-align:center;margin-top:10px}

@media(max-width:900px){
  .dm-nav{padding:0 16px;gap:10px}
  .dm-hero{min-height:480px;padding:64px 20px 0;background-position:center 42%}
  .dm-hero::before{background:linear-gradient(165deg,rgba(20,19,17,.78) 0%,rgba(20,19,17,.55) 55%,rgba(20,19,17,.45) 100%)}
  .dm-hero-inner{padding-bottom:28px}
  .dm-sc{flex-wrap:wrap}
  .dm-sk{flex:1 1 33%;padding:14px 16px}
  /* Кнопки hero — равная ширина, в столбец */
  .dm-hbs{flex-direction:column}
  .dm-hbp{width:100%;justify-content:center}
  /* Телефон — круглая кнопка в стиле «наверх»/фавикона: графит + латунное кольцо */
  .dm-phone{width:38px;height:38px;border-radius:var(--radius-full);background:var(--ink);border:1px solid var(--brass);justify-content:center;gap:0;box-shadow:0 3px 10px rgba(0,0,0,.15)}
  .dm-phone span{display:none}
  .dm-phone i{font-size:19px;color:var(--on-dark-strong)}
  /* WhatsApp-кнопка в шапке — крупнее, для удобного тапа */
  .dm-wa-ic{width:38px;height:38px}
  .dm-wa-ic i{font-size:20px}
}

/* ── Полоса статистики, вынесенная из фото отдельным блоком — п.2 ── */
.dm-statband{background:var(--graphite)}         /* тёмный фон полосы — графит из --graphite */
.dm-statband .dm-sc{margin-top:0;background:transparent;backdrop-filter:none;border-top:none;
  max-width:none;margin-left:0;margin-right:0;justify-content:space-between;padding:0 clamp(20px,4vw,64px)}
.dm-statband .dm-sk{flex:1 1 0;align-items:center;text-align:center}
@media(max-width:900px){
  .dm-statband .dm-sc{flex-wrap:wrap;justify-content:flex-start}
  .dm-statband .dm-sk{flex:1 1 50%}
}

/* — Интерактивная stats-bar: блоки кликабельны — */
html{scroll-behavior:smooth}
#dm-map-wrap{scroll-margin-top:96px}
.dm-sk-link{text-decoration:none;color:inherit;cursor:pointer;
  transition:transform .18s ease, background .18s ease, box-shadow .18s ease}
.dm-sk-link:hover{transform:translateY(-2px);background:rgba(255,255,255,.04);
  box-shadow:inset 0 -2px 0 var(--brass)}
.dm-sk-link:hover .dm-sn{color:var(--brass)}
.dm-sk-link:focus-visible{outline:2px solid var(--brass);outline-offset:-2px}
.dm-pin{color:var(--brass);font-size:15px;line-height:1;margin-bottom:7px;display:flex}
.dm-pin i{display:block}
@media(hover:none){.dm-sk-link:hover{transform:none;background:transparent;box-shadow:none}}
/* ---- Поиск по словарю (/slovar/) — тёмная тема, в единой системе с карточками ---- */
.dm-infopage .dm-ip-search{margin:0 0 24px}
.dm-infopage .dm-ip-search-input{
  width:100%;box-sizing:border-box;padding:14px 18px;font-size:16px;font-family:inherit;
  color:var(--on-dark-strong);background:rgba(244,241,234,.04);
  border:1px solid rgba(244,241,234,.14);border-radius:var(--radius-md);outline:none;
  transition:border-color .15s ease,background .15s ease}
.dm-infopage .dm-ip-search-input::placeholder{color:rgba(244,241,234,.45)}
.dm-infopage .dm-ip-search-input:focus{border-color:rgba(169,138,82,.55);background:rgba(244,241,234,.06)}
.dm-infopage .dm-ip-noresult{
  margin-top:16px;padding:18px 20px;border:1px solid rgba(244,241,234,.10);
  border-radius:var(--radius-md);background:rgba(244,241,234,.02)}
.dm-infopage .dm-ip-noresult p{margin:0 0 12px;color:rgba(244,241,234,.70)}
/* ---- Оглавление словаря (якорные чипсы) ---- */
.dm-infopage .dm-ip-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.dm-infopage .dm-ip-toc a{
  display:inline-block;padding:7px 14px;font-size:13px;line-height:1.2;
  color:rgba(244,241,234,.75);text-decoration:none;
  border:1px solid rgba(244,241,234,.14);border-radius:var(--radius-sm);
  background:rgba(244,241,234,.03);
  transition:border-color .15s ease,color .15s ease,background .15s ease}
.dm-infopage .dm-ip-toc a:hover{
  color:var(--on-dark-strong);border-color:rgba(169,138,82,.55);background:rgba(169,138,82,.08)}
.dm-infopage h2[id]{scroll-margin-top:88px} /* чтобы якорь не уходил под липкую шапку */
/* hidden должен побеждать display у .dm-ip-toc(flex)/.dm-ip-list(grid) — иначе JS-поиск не прячет */
.dm-infopage [hidden]{display:none !important}