/* Изолированное меню: ПК — три группы услуг и 12 городов; телефон — общий список. */
.header__main > .container { position: relative; overflow: visible; }
.vp-nav-group { position: static; }
.vp-nav-group > summary { display: flex; align-items: center; gap: 7px; cursor: pointer; list-style: none; }
.vp-nav-group > summary > .vp-nav-link { color: inherit; font: inherit; text-decoration: none; }
.vp-nav-group > summary::-webkit-details-marker,
.vp-mobile-section > summary::-webkit-details-marker { display: none; }
.vp-chevron { display: inline-block; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); flex: 0 0 auto; margin: -3px 3px 0 0; }
.vp-nav-group[open] > summary { background: var(--color-accent-light); color: #a96300; }
.vp-nav-group[open] > summary .vp-chevron,
.vp-mobile-section[open] > summary .vp-chevron { transform: rotate(225deg); margin-top: 4px; }
.vp-dropdown { position: absolute; top: calc(100% - 1px); right: 16px; width: min(950px, calc(100vw - 32px)); max-height: calc(100dvh - 150px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid #dcdfe5; border-radius: 16px; background: #fff; color: #20273b; box-shadow: 0 16px 40px rgba(20,29,48,.15); z-index: 100; }
.vp-services-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 24px 12px; }
.vp-service-column { min-width: 0; padding: 0 16px; }
.vp-service-column + .vp-service-column { border-left: 1px solid #e3e5eb; }
.vp-menu-title { color: var(--color-primary, #1b2a3d); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; line-height: 1.4; margin: 0 8px 14px; }
.vp-dropdown a { display: flex; align-items: center; min-height: 44px; padding: 10px 8px; border-radius: 8px; font-size: 16px; line-height: 1.4; color: #20273b; text-decoration: none; }
.vp-dropdown a:hover, .vp-dropdown a:focus-visible,
.vp-mobile-sub a:hover, .vp-mobile-sub a:focus-visible { background: #fbf1df; color: #8c5100; }
.vp-cities-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px 12px; padding: 22px 24px; }
.vp-menu-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid #e3e5eb; padding: 12px 24px; }
.vp-menu-footer a:last-child { color: #a65f00; }
.vp-nav :focus-visible, .vp-mobile-menu :focus-visible, #vpMobileOpen:focus-visible { outline: 2px solid #a65f00; outline-offset: 3px; }
.vp-mobile-menu[hidden] { display: none !important; }
.vp-mobile-menu { position: fixed; inset: 0; z-index: 10020; overflow-y: auto; overscroll-behavior: contain; background: #fff; color: #20273b; padding: max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
.vp-mobile-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; border-bottom: 1px solid #dfe3ea; padding-bottom: 10px; }
.vp-mobile-head img { display: block; width: 170px; height: auto; }
#vpMobileClose { display: grid; place-items: center; width: 44px; height: 44px; font: inherit; font-size: 28px; color: #20273b; }
.vp-mobile-link, .vp-mobile-section > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px; padding: 10px 4px; border-bottom: 1px solid #dfe3ea; color: #20273b; font-size: 18px; font-weight: 600; line-height: 1.35; text-decoration: none; list-style: none; cursor: pointer; }
.vp-mobile-link .nav__badge { margin-left: auto; font-size: 12px; }
.vp-mobile-link[aria-current="page"] { color: #a65f00; cursor: default; }
.vp-mobile-section[open] > summary { color: #a65f00; border-bottom: 0; }
.vp-mobile-section > summary .vp-chevron { width: 10px; height: 10px; margin-right: 8px; }
.vp-mobile-sub { border-radius: 12px; background: #f3f5f8; padding: 12px; margin: 0 0 8px; }
.vp-mobile-sub .vp-menu-title { margin: 0 2px 8px; font-size: 12px; }
.vp-mobile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.vp-mobile-grid + .vp-menu-title { margin-top: 14px; }
.vp-mobile-sub a { display: flex; align-items: center; min-height: 44px; padding: 8px; background: #fff; border-radius: 8px; color: #20273b; font-size: 14px; line-height: 1.35; text-decoration: none; overflow-wrap: anywhere; }
.vp-mobile-sub-footer { display: flex; gap: 8px; border-top: 1px solid #dfe3ea; margin-top: 12px; padding-top: 6px; }
.vp-mobile-sub-footer a { background: none; flex: 1; padding: 8px 2px; }
.vp-mobile-actions { padding-top: 16px; display: grid; gap: 8px; }
.vp-mobile-cta { display: flex; align-items: center; justify-content: center; min-height: 48px; border-radius: 10px; padding: 12px; background: var(--color-accent, #e8a838); color: #171717; font-size: 17px; font-weight: 700; text-decoration: none; }
.vp-mobile-phone { display: flex; align-items: center; justify-content: center; min-height: 44px; color: #20273b; font-size: 20px; font-weight: 700; text-decoration: none; }
.vp-mobile-mail { display: flex; align-items: center; justify-content: center; min-height: 40px; color: #566076; font-size: 15px; text-decoration: none; overflow-wrap: anywhere; }
#resheniya-dlya-pola { scroll-margin-top: 150px; }
@media (min-width: 1025px) { .vp-mobile-menu { display: none !important; } }
@media (max-width: 360px) { .vp-mobile-sub { padding: 8px; } .vp-mobile-sub a { font-size: 13px; padding: 8px 5px; } }
