/* Вайпърстрой — фирменный слой поверх viperstroy-ui.css.
   Подключается после него (inc/setup.php). Раньше эти правила
   печатались инлайном из плагина viperstroy-brand. */

/* ---------- 1. Цвета из логотипа ----------
   Красный #E00B0B — медиана красных пикселей знака, серый #A1A4A6 — серебристой части.
   Белый на #E00B0B даёт контраст 4.97 (WCAG AA), наведение #B00707 — 7.4.
   Золото #C9961C вместо янтаря: янтарь рядом с красным читается как знак «внимание». */
:root{
  --brand:#E00B0B;
  --brand-d:#B00707;
  --brand-l:#FFF1F0;
  --accent:#C9961C;
  --steel:#A1A4A6;
  --ink:#141A1F;
  --ink-2:#3A444D;
  --muted:#6C7883;
  --line:#E4E7EA;
  --bg-soft:#F5F7F8;
  --shadow:0 4px 24px rgba(20,26,31,.08);
}

/* ---------- 2. Логотип — картинкой, а не фоном ---------- */
.logo .logo-img{display:block;width:auto;height:40px}
@media (max-width:640px){
  .logo .logo-img{height:34px}
}

/* ---------- 3. Меню «Градове» в шапке ----------
   У темы стоит `nav.main ul{display:flex}`, и правило ловит любой список
   в меню — отсюда длинный селектор. */
.vpb-has-dd{position:relative}
header.site nav.main ul.vpb-dd{display:block;gap:0}
header.site nav.main ul.vpb-dd li{display:block;white-space:nowrap}
.vpb-dd{
  position:absolute;left:0;top:calc(100% + 12px);z-index:70;
  min-width:212px;margin:0;padding:6px;list-style:none;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 12px 32px rgba(20,26,31,.14);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .14s ease,transform .14s ease,visibility .14s;
}
/* Мостик над зазором: без него меню закрывается, пока ведёшь к нему мышь. */
.vpb-has-dd::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px}
.vpb-has-dd[data-open="1"] .vpb-dd{opacity:1;visibility:visible;transform:none}
.vpb-dd li{margin:0}
.vpb-dd a{display:block;padding:9px 12px;border-radius:8px;color:var(--ink-2);text-decoration:none;font-size:15px;line-height:1.3}
.vpb-dd a:hover,.vpb-dd a:focus-visible{background:var(--brand-l);color:var(--brand-d)}
.vpb-dd .vpb-all{margin-top:4px;padding-top:4px;border-top:1px solid var(--line)}
.vpb-dd .vpb-all a{color:var(--brand);font-weight:600;font-size:14px}
.vpb-caret{
  display:inline-block;width:7px;height:7px;margin-left:6px;vertical-align:2px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-1px);transition:transform .14s ease;
}
.vpb-has-dd[data-open="1"] .vpb-caret{transform:rotate(-135deg) translateY(-2px)}
@media (max-width:900px){
  .vpb-dd{
    position:static;opacity:1;visibility:visible;transform:none;
    border:0;box-shadow:none;padding:2px 0 2px 12px;min-width:0;
    border-left:2px solid var(--line);border-radius:0;margin:6px 0 2px;
  }
  header.site nav.main ul.vpb-dd{display:none}
  header.site nav.main .vpb-has-dd[data-open="1"] ul.vpb-dd{display:block}
  .vpb-has-dd::after{display:none}
}
@media (prefers-reduced-motion:reduce){
  .vpb-dd,.vpb-caret{transition:none}
}

/* ---------- 4. «Градове» в мобильном меню ---------- */
.menu-nav .vpb-mrow{display:flex;align-items:stretch;border-bottom:1px solid var(--line)}
.menu-nav .vpb-mrow>a{flex:1;border-bottom:0}
.menu-nav .vpb-mtog{
  flex:none;width:56px;display:grid;place-items:center;cursor:pointer;
  background:none;border:0;border-left:1px solid var(--line);color:var(--ink);
}
.menu-nav .vpb-mtog .vpb-caret{margin:0;vertical-align:0}
.menu-nav .vpb-mtog[aria-expanded="true"] .vpb-caret{transform:rotate(-135deg) translateY(-2px)}
.menu-nav .vpb-msub{background:var(--bg-soft);border-bottom:1px solid var(--line);padding:4px 0}
.menu-nav .vpb-msub[hidden]{display:none}
.menu-nav .vpb-msub a{min-height:46px;border-bottom:0;padding-left:calc(var(--pad-x) + 16px);font-weight:500;font-size:15.5px;color:var(--ink-2)}
.menu-nav .vpb-msub a.vpb-all{color:var(--brand);font-weight:600;font-size:15px}

/* ---------- 5. Правки по мобильной проверке 24.09 ---------- */
/* Крошки: `.breadcrumbs{padding:10px 0}` ниже `.wrap` обнулял боковой отступ. */
.wrap.breadcrumbs{padding-inline:var(--pad-x)}
/* Пустые «до/после» и пустая строка данных у карточки проекта не выводятся. */
.case .ba:not(:has(img,picture,video)){display:none}
.case .case-meta:not(:has(*)){display:none}
/* Цель для пальца — не меньше 44px. */
.vg-strip-all{display:inline-flex;align-items:center;min-height:var(--tap,44px)}

/* ---------- 6. Обложки проектов ---------- */
.case .ba.vpb-ba-cover{display:block;overflow:hidden}
.case .ba.vpb-ba-cover>img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.card>.vpb-card-cover{display:block;margin:0 0 12px;border-radius:10px;overflow:hidden;background:var(--bg-soft)}
.card>.vpb-card-cover img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}

/* ---------- 7. Видео по услуге (inc/video.php) ---------- */
.vp-video{margin:0;max-width:960px}
.vp-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:14px;background:var(--bg-soft)}
.vp-video figcaption{margin-top:10px;color:var(--muted);font-size:14px}

/* ---------- аудит 11.11.2026 ----------
   Текущая страница в меню и подвале — span вместо ссылки: тот же вид, но
   цвет акцента, как у активного пункта. */
nav.main .menu-current{display:inline-flex;align-items:center;min-height:var(--tap);color:var(--brand);font-weight:600;font-size:15px}
.menu-nav .menu-current{display:flex;align-items:center;min-height:52px;padding:0 var(--pad-x);
  color:var(--brand);font-weight:600;font-size:16.5px;border-bottom:1px solid var(--line)}
footer.site li > span[aria-current]{display:inline-flex;align-items:center;min-height:var(--tap);color:#fff}

/* Карта: ссылки атрибуции — зона нажатия не меньше 24 px (Target Size). */
.maplibregl-ctrl-attrib-inner a{display:inline-block;padding:5px 2px;min-height:24px;line-height:14px}

/* Контраст не ниже 4,5:1 (Lighthouse, 11.11.2026) */
.final-cta .lead,.final-cta .lead strong{color:#fff}
.vp-credit{opacity:1;color:#5f6a73}
.vp-credit a{color:#5f6a73}
.vpc-card .d,.vpc-check .d{color:#5a6570}
