/* Geo-движок (з.1): кнопка города в шапке + модалка выбора. Локально, префиксы okna-city / okna-geo.
   Токены v4: ink #123d87, синий #1c5bd6, линии #e8ecf2/#dbe4f0, радиусы 10/16/22. */

/* ===== Кнопка города в топбаре (была заглушка → активная) ===== */
/* !important — перебить базовую кнопку TT1 (тёмный фон) и старое .okna-city{cursor:default} из glavnaya.css */
.okna-city{ display:inline-flex; align-items:center; gap:6px; background:transparent !important; border:0 !important; cursor:pointer !important;
  font:inherit; color:#5b6574 !important; padding:2px 0 !important; line-height:1.2; box-shadow:none !important; }
.okna-city-ic{ display:inline-flex; color:var(--blue,#1c5bd6); }
.okna-city-ic svg{ width:15px; height:15px; display:block; }
.okna-city strong{ color:var(--ink,#123d87); font-weight:800; }
.okna-city .okna-caret{ font-size:10px; opacity:.7; transition:transform .15s ease; }
.okna-city:hover strong{ color:var(--blue,#1c5bd6); }
.okna-city:hover .okna-caret{ transform:translateY(1px); }
.okna-city:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:3px; border-radius:6px; }

/* ===== Модалка выбора города ===== */
.okna-city-modal[hidden]{ display:none; }
.okna-city-modal{ position:fixed; inset:0; z-index:10000; display:flex; align-items:flex-start; justify-content:center; }
.okna-city-modal__overlay{ position:absolute; inset:0; background:rgba(12,28,60,.55); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }
.okna-city-modal__card{ position:relative; z-index:1; width:min(560px,calc(100vw - 32px)); margin-top:8vh; max-height:84vh;
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px; /* Волна 2 §5.2.3: радиус окна попапа 22→16 (норма окна попапа; город был вне box-списка ok-modal) */
  box-shadow:0 30px 80px rgba(12,28,60,.32); overflow:hidden; }
.okna-city-modal__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:22px 24px 14px; }
.okna-city-modal__head h2{ margin:0; font-size:21px; font-weight:800; color:var(--ink,#123d87); }
/* !important — перебить базовые кнопки/инпуты Twenty Twenty-One (button:not(:hover)… спец.0,3,1, грузится позже) */
/* вид крестика — единый из design.css (.okna-city-modal__close); здесь только позиция в шапке гео-модалки */
.okna-city-modal__close{ flex:0 0 auto; }
/* блочный инпут с auto-шириной и !important-полями (margin/display перебивают базовые input-стили ТТ1):
   margin:0 24px → левый/правый зазор поля до краёв карточки РАВНЫ (без width-calc, симметрия гарантирована) */
.okna-city-modal__search{ display:block !important; width:auto !important; margin:0 24px !important; box-sizing:border-box;
  padding:12px 16px; font-size:16px; border:1.5px solid #dbe4f0 !important; border-radius:var(--ok-radius-search,10px) !important; /* Волна 1-бис: поиск города 12px→роль поиска 10 */
  outline:none !important; color:var(--ink,#123d87) !important; background:#fff !important; }
.okna-city-modal__search:focus{ border-color:var(--blue,#1c5bd6) !important; box-shadow:0 0 0 3px rgba(28,91,214,.12) !important; }
.okna-city-modal__top{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:14px 24px 6px; }
.okna-city-modal__top-label{ font-size:13px; color:#6b7686; font-weight:700; margin-right:2px; }
.okna-city-modal__top-btn{ cursor:pointer; font:inherit; font-size:13.5px; font-weight:600; padding:7px 13px; border-radius:999px !important;
  background:#f3f7ff !important; color:var(--ink,#123d87) !important; border:1px solid #dbe4f0 !important; transition:.15s; }
.okna-city-modal__top-btn:hover{ background:var(--blue,#1c5bd6) !important; color:#fff !important; border-color:var(--blue,#1c5bd6) !important; }
/* список: левый край 24 (как поле/заголовок); правый паддинг 9 + зарезервированный gutter скроллбара ≈24 →
   содержимое симметрично, скроллбар не сдвигает контент (scrollbar-gutter:stable резервирует место всегда) */
.okna-city-modal__results{ list-style:none; margin:8px 0 0; padding:6px 9px 14px 24px; overflow-y:auto; min-height:120px; scrollbar-gutter:stable; }
.okna-city-modal__opt{ display:flex; align-items:baseline; gap:10px; width:100%; text-align:left; cursor:pointer; font:inherit;
  padding:11px 14px; border-radius:10px !important; background:transparent !important; border:0 !important; transition:background-color .12s ease; }
.okna-city-modal__opt:hover,.okna-city-modal__opt:focus-visible{ background:#f3f7ff !important; outline:none; }
.okna-city-modal__opt-city{ font-size:15.5px; font-weight:700; color:var(--ink,#123d87); }
.okna-city-modal__opt-reg{ font-size:13px; color:#8a97ab; }
.okna-city-modal__empty{ padding:18px 14px; color:#6b7686; font-size:14px; }
/* каскад: строка «← Назад к регионам» + имя региона (Шаг 2) */
.okna-city-modal__nav{ display:flex; align-items:center; gap:12px; padding:12px 24px 2px; }
.okna-city-modal__nav[hidden]{ display:none; }
.okna-city-modal__back{ display:inline-flex; align-items:center; gap:5px; cursor:pointer; font:inherit; font-size:14px; font-weight:700;
  color:var(--blue,#1c5bd6) !important; background:transparent !important; border:0 !important; padding:6px 8px 6px 0 !important; border-radius:8px !important; }
.okna-city-modal__back:hover{ color:#1448aa !important; }
.okna-city-modal__back svg{ width:17px; height:17px; }
.okna-city-modal__region-name{ font-size:14px; font-weight:800; color:var(--ink,#123d87); }
/* заголовки секций «Регионы» / «Города» (в режиме регионов) */
.okna-city-modal__group{ list-style:none; padding:12px 14px 4px; font-size:11.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#9aa4b6; }
.okna-city-modal__group:first-child{ padding-top:4px; }

/* ===== Гео-посадки (B1 каркас): хаб/регион/город — минимальная вёрстка (B3 доработает) ===== */
.okna-geo-page__wrap{ max-width:calc(var(--okna-cw) + 48px); margin:0 auto; padding:24px 24px 8px; box-sizing:border-box; }
/* ЭТАП 11.2: единый вид крошек (14px, разделитель «/» в разметке, синяя ссылка / серый «/» / тёмный ink текущий) — как .okna-crumbs/.okna-blog-crumbs/услуги */
.okna-geo-bc{ font-size:14px; color:#526173; margin:8px 0 16px; line-height:1.6; }
.okna-geo-bc a{ color:var(--blue,#1c5bd6); text-decoration:none; }
.okna-geo-bc a:hover{ text-decoration:underline; }
.okna-geo-bc span{ color:#aeb8c6; margin:0 4px; }                      /* разделитель «/» */
.okna-geo-bc span:last-child{ color:var(--ink,#123d87); margin:0; }   /* текущий пункт (последний span) — тёмно-синий ink */
.okna-geo-page__h1{ font-size:30px; font-weight:800; line-height:1.2; color:var(--ink,#123d87); margin:0 0 12px; letter-spacing:-.01em; }
.okna-geo-page__h2{ font-size:20px; font-weight:800; color:var(--ink,#123d87); margin:24px 0 12px; }
.okna-geo-page__lead{ font-size:16px; line-height:1.6; color:var(--muted,#6b7686); max-width:780px; margin:0 0 16px; }
.okna-geo-page__back{ margin:0 0 16px; }
.okna-geo-page__back a{ color:var(--blue,#1c5bd6); text-decoration:none; font-weight:700; font-size:14px; }
.okna-geo-page__back a:hover{ text-decoration:underline; }
.okna-geo-page__pop{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 16px; }
.okna-geo-page__pop-label{ font-size:13px; font-weight:700; color:#6b7686; }
.okna-geo-page__pop-link{ font-size:13.5px; font-weight:600; padding:7px 13px; border-radius:999px; text-decoration:none;
  background:#fff; border:1px solid #dbe4f0; color:var(--ink,#123d87); }
.okna-geo-page__pop-link:hover{ background:var(--blue,#1c5bd6); color:#fff; border-color:var(--blue,#1c5bd6); }
.okna-geo-page__list{ list-style:none; margin:0 0 28px; padding:0; columns:4; column-gap:24px; }
.okna-geo-page__list li{ break-inside:avoid; margin:0 0 8px; }
.okna-geo-page__list a{ color:var(--ink,#123d87); text-decoration:none; font-size:15px; font-weight:600; }
.okna-geo-page__list a:hover{ color:var(--blue,#1c5bd6); text-decoration:underline; }
@media (max-width:1024px){ .okna-geo-page__list{ columns:3; } }
@media (max-width:768px){ .okna-geo-page__wrap{ padding:16px; } .okna-geo-page__h1{ font-size:24px; } .okna-geo-page__list{ columns:2; } }
@media (max-width:480px){ .okna-geo-page__list{ columns:1; } }

/* ===== MOB-01: тач-цели ГЕО до нормы 44×44 =====
   Гейт по ТИПУ УКАЗАТЕЛЯ (hover:none), не по ширине: на десктопе (мышь) вид и высоты
   прежние. Кегль/цвет/начертание текста не меняются — зона добирается невидимым отступом
   (§2 «отступом»). Ссылки списка h≈20, pop-link h≈37, крошка хаба h≈19 → доводим до 44.
   Без нового !important. */
@media (hover:none){
  .okna-geo-page__list li{ margin:0; }                 /* питч = высота ссылки, без наложения зон */
  .okna-geo-page__list a{ display:block; padding-block:13px; }   /* ~20 + 26 = ~46 ≥ 44 */
  .okna-geo-page__pop-link{ padding-block:11px; }      /* 37 → ~45 */
  .okna-geo-bc a{ display:inline-block; padding-block:13px; }    /* 19 → ~45 */
}

/* ===== Мобайл — по центру экрана (решение владельца 2026-08-05: все попапы центром) ===== */
@media (max-width:600px){
  .okna-city-modal{ align-items:center; }
  .okna-city-modal__card{ width:min(560px,calc(100vw - 32px)); margin-top:0; max-height:88vh; border-radius:16px; } /* Волна 2 §17: мобильный дубль радиуса города — тоже 22→16 */
  .okna-city-modal__head h2{ font-size:19px; }
  .okna-city-modal__search{ font-size:16px; }
  /* мобайл: overlay-скроллбар (0px) — gutter не нужен, делаем список симметричным (24/24, как поле) */
  .okna-city-modal__results{ padding:6px 24px 14px; }
  .okna-city-modal__opt{ padding:13px 14px; }
}
