/* AP-R · раздел «Коммерция» (вариант v4-2) · копия inline-стилей страницы города (city/index_v2.php, снимок 06.10) · собрано build\devexport.py 07.10.2026 — не править руками */

          /* AP-R: фон-картинка Яндекс-карты для кнопки «Выбрать ЖК на карте» (B1) */
          .hfb-map-btn{position:relative; overflow:hidden; background:#0f3148; border-color:rgba(23,183,191,.30)}
          .hfb-map-btn:hover{border-color:rgba(23,183,191,.55)}
          .hfb-map-bg{position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden}
          .hfb-map-bg .l-img{position:absolute; inset:0; background:url('/upload/v2/map-btn-bg.webp') center/cover no-repeat; filter:saturate(1.12) contrast(1.04) brightness(1.05)}
          .hfb-map-bg .l-bright{position:absolute; inset:0; mix-blend-mode:soft-light; background:linear-gradient(90deg, transparent 48%, rgba(255,255,255,.10) 100%)}
          .hfb-map-bg .l-ov{position:absolute; inset:0; background:linear-gradient(90deg, rgba(13,40,60,.92) 0%, rgba(13,40,60,.72) 26%, rgba(13,40,60,.40) 52%, rgba(13,40,60,.16) 80%, rgba(13,40,60,.04) 100%)}
          .hfb-map-btn>.map-ic,.hfb-map-btn>.copy,.hfb-map-btn>.arrow{position:relative; z-index:3}
          .hfb-map-btn .copy .t{text-shadow:0 1px 4px rgba(0,0,0,.5)}
          .hfb-map-btn .copy .s{color:rgba(255,255,255,.9); text-shadow:0 1px 4px rgba(0,0,0,.5)}
          .hfb-map-btn .shine{position:absolute; inset:0; z-index:5; pointer-events:none; overflow:hidden; border-radius:inherit}
          .hfb-map-btn .shine::before{content:''; position:absolute; top:-60%; bottom:-60%; left:-40%; width:36%; background:linear-gradient(100deg, transparent 0%, rgba(255,255,255,.7) 50%, transparent 100%); transform:skewX(-18deg); filter:blur(1px); opacity:0; animation:aprMapSweep 4s ease-in-out infinite}
          @keyframes aprMapSweep{0%{left:-40%; opacity:0} 5%{opacity:1} 30%{left:130%; opacity:1} 34%{opacity:0} 100%{left:130%; opacity:0}}
          @media (prefers-reduced-motion: reduce){.hfb-map-btn .shine::before{animation:none; opacity:0}}
          
@media(min-width:769px){.apr-exp-onlymob{display:none!important}}@media(max-width:768px){.apr-exp-onlydesk{display:none!important}}

.apr-hcb-sec{padding:34px 0}
.apr-hcb{display:flex;gap:26px;align-items:center;flex-wrap:wrap;background:linear-gradient(110deg,#13374f 0%,#17545f 100%);border-radius:18px;padding:24px 28px;box-shadow:0 16px 38px rgba(19,55,79,.20)}
.apr-hcb-copy{flex:1 1 320px;min-width:260px;color:#fff}
.apr-hcb-eyebrow{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#a3d977;margin-bottom:6px}
.apr-hcb-title{font-size:23px;font-weight:800;line-height:1.2;margin-bottom:5px;text-wrap:balance}
.apr-hcb-sub{font-size:14px;color:#c4d6e0}
.apr-hcb-form{flex:1 1 430px;min-width:300px;display:flex;gap:10px;flex-wrap:wrap;align-items:stretch}
.apr-hcb-inp{display:flex;align-items:center;gap:8px;background:#fff;border-radius:12px;padding:0 14px}
.apr-hcb-inp:first-of-type{flex:1 1 130px}
.apr-hcb-inp:nth-of-type(2){flex:1 1 170px}
.apr-hcb-inp svg{flex:0 0 auto}
.apr-hcb-inp input{border:0;outline:0;padding:15px 0;font-size:15px;width:100%;background:transparent;color:#1f2c38}
.apr-hcb-inp.is-error{box-shadow:0 0 0 2px #e74c3c}
.apr-hcb-hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
.apr-hcb-btn{flex:1 1 100%;background:#a3d977;color:#163d10;border:0;border-radius:12px;font-weight:800;font-size:16px;padding:16px 20px;cursor:pointer;box-shadow:0 8px 22px rgba(163,217,120,.45);transition:filter .15s,transform .05s}
.apr-hcb-btn:hover{filter:brightness(1.03)}
.apr-hcb-btn:active{transform:translateY(1px)}
.apr-hcb-btn:disabled{opacity:.6;cursor:default}
.apr-hcb-btn:focus-visible{outline:3px solid #cdeafd;outline-offset:2px}
.apr-hcb-note{flex:1 1 100%;font-size:12px;color:#9fb6c4;text-align:center}
.apr-hcb-note a{color:#c4d6e0;text-decoration:underline}
.apr-hcb-note.is-ok{color:#a3d977;font-weight:700}
.apr-hcb-note.is-err{color:#ffb4ad;font-weight:700}
@media (max-width:760px){
  .apr-hcb{padding:20px}
  .apr-hcb-title{font-size:20px}
  .apr-hcb-inp:first-of-type,.apr-hcb-inp:nth-of-type(2){flex:1 1 100%}
}


    /* AJAX-пагинация и сортировка каталога: мягкое затухание во время загрузки */
    #catalog .list-pane,
    #catalog .paging,
    #catalog .sort { transition: opacity .18s ease; }
    #catalog.is-loading .list-pane,
    #catalog.is-loading .paging,
    #catalog.is-loading .sort { opacity: .45; pointer-events: none; }
    /* Автоскролл к началу списка при смене страницы: отступ под sticky-шапку
       (160px — как scroll-margin-top у карточек; на мобиле ниже sticky .cat-toggle) */
    #catalog .list-pane { scroll-margin-top: 160px; }
    @media (max-width: 1023px) { #catalog .list-pane { scroll-margin-top: 118px; } }
    #catalog .list-pane:focus { outline: none; }
    /* Пока грузится страница каталога — спиннер рядом с пагинацией (юзер стоит именно там;
       одного затухания списка на мобиле не видно, тап кажется «не сработал») */
    #catalog.is-loading .paging::after {
        content: ''; display: inline-block; width: 15px; height: 15px; flex: none;
        border: 2px solid #c8d4dc; border-top-color: #13374f; border-radius: 50%;
        margin-left: 8px; animation: aprPgSpin .7s linear infinite;
    }
    @keyframes aprPgSpin { to { transform: rotate(360deg); } }
    /* Чипы сортировки: акцентный стиль для активного + второстепенный для «Все фильтры» */
    #catalog .sort .chip-filter { background: transparent; color: #13374f; border: 1px dashed #c8d4dc; }
    #catalog .sort .chip-filter:hover { border-color: #13374f; background: #f3f6f8; }


        .city-team-card svg { width: 16px; height: 16px }
        .city-team-card:hover { border-color: var(--teal); transform: translateY(-2px); box-shadow: var(--shadow) }
        

.guide-modal{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:20px}
.guide-modal[hidden]{display:none}
.guide-modal-overlay{position:absolute;inset:0;background:rgba(11,28,42,.55);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);animation:gmFade .2s ease}
.guide-modal-card{position:relative;width:100%;max-width:460px;background:#fff;border-radius:18px;box-shadow:0 24px 60px rgba(19,55,79,.28);padding:28px 26px 24px;animation:gmPop .25s cubic-bezier(.22,1.4,.36,1)}
.guide-modal-close{position:absolute;top:10px;right:12px;width:34px;height:34px;border:0;background:transparent;color:#6b7d8c;font-size:24px;line-height:1;cursor:pointer;border-radius:50%}
.guide-modal-close:hover{background:#f0f3f6;color:#13374f}
.guide-modal-eb{font-size:11px;font-weight:800;color:#13374f;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;opacity:.7}
.guide-modal-card h3{font-family:Manrope,system-ui;font-size:22px;line-height:1.2;color:#13374f;margin:0 0 8px;font-weight:800}
.guide-modal-lead{font-size:14px;line-height:1.45;color:#4a5b6a;margin:0 0 20px}
.guide-modal-field{display:block;margin-bottom:12px}
.guide-modal-field span{display:block;font-size:11px;font-weight:700;color:#6b7d8c;text-transform:uppercase;letter-spacing:.04em;margin-bottom:5px}
.guide-modal-field input{width:100%;box-sizing:border-box;padding:12px 14px;border:1.5px solid #d9e0e6;border-radius:10px;font:inherit;font-size:15px;color:#13374f;background:#fff;transition:border-color .15s}
.guide-modal-field input:focus{outline:none;border-color:#17b7bf}
.guide-modal-submit{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px 18px;background:#a3d977;color:#163d10;border:0;border-radius:12px;font:inherit;font-size:15px;font-weight:800;cursor:pointer;transition:transform .1s, box-shadow .15s, opacity .15s;box-shadow:0 6px 20px rgba(19,55,79,.08)}
.guide-modal-submit:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(19,55,79,.14)}
.guide-modal-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.guide-modal-error{margin-top:10px;padding:10px 12px;background:#fff0f0;color:#a01b1b;border-radius:8px;font-size:13px;line-height:1.35}
.guide-modal-error[hidden]{display:none}
.guide-modal-legal{margin-top:12px;font-size:11px;line-height:1.4;color:#8395a3;text-align:center}
.guide-modal-success-state{text-align:center;padding:8px 0}
.guide-modal-success-state[hidden]{display:none}
.guide-modal-success-ico{width:60px;height:60px;margin:6px auto 16px;border-radius:50%;background:#e7f5d6;color:#3a7e1f;display:flex;align-items:center;justify-content:center}
.guide-modal-success-ico svg{width:32px;height:32px}
.guide-modal-shake{animation:gmShake .35s ease}
@keyframes gmFade{from{opacity:0}to{opacity:1}}
@keyframes gmPop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes gmShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
@media (max-width:480px){.guide-modal-card{padding:24px 20px 20px}.guide-modal-card h3{font-size:19px}}


    /* полоса-подложка #EEF7F1 — цвет карточки статистики .seo-mini-stats (просьба Сергея 09.08) */
    .apr-rl-sec{padding:0;background:#eef7f1}
    .apr-rl-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:22px 0}
    .apr-rl-title{font-weight:800;color:var(--navy);font-size:16px;margin-right:4px}
    .apr-rl-chip{display:inline-flex;align-items:center;background:#fff;color:#42607a;border-radius:20px;
      padding:9px 18px;font-size:14px;font-weight:600;text-decoration:none;transition:.15s;
      box-shadow:0 1px 3px rgba(19,55,79,.06)}
    .apr-rl-chip:hover{background:var(--teal);color:#fff}
    @media (max-width:640px){.apr-rl-title{width:100%;margin:0}}
    

        .zk-all-links{padding:40px 0 48px}
        .zk-all-links h2{margin:0 0 18px}
        .zk-all-links-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px 24px}
        .zk-all-links-grid a{color:#3d5468;text-decoration:none;font-size:14px;line-height:1.5}
        .zk-all-links-grid a:hover{color:var(--navy,#13374f);text-decoration:underline}
        @media(max-width:1023px){.zk-all-links-grid{grid-template-columns:repeat(2,1fr)}}
        @media(max-width:519px){.zk-all-links-grid{grid-template-columns:1fr}}
    

@keyframes apr-spin { from{transform:rotate(0)} to{transform:rotate(360deg)} }
/* hero-фон: при загрузке размывать аккуратно */
.hero-city{background-position:right center;background-size:cover}
/* Контейнер карты: убираем декорации мокапа, оставляем чистый Я.Карты */
.map-pane{position:sticky; top:160px; min-height:560px; height:calc(100vh - 200px); max-height:760px; border-radius:18px; overflow:hidden; box-shadow:0 4px 24px rgba(19,55,79,.10)}
.map-pane .ymaps-2-1-79-map{border-radius:18px}
/* Карточка в списке: подсветка активной */
.list-pane .zk-list-card{transition:box-shadow .18s, transform .18s, border-color .18s; scroll-margin-top:160px}
.list-pane .zk-list-card.highlighted{box-shadow:0 0 0 2px #a3d977,0 4px 24px rgba(19,55,79,.10); transform:translateY(-1px)}
/* ===== Mobile/Tablet: toggle Список ↔ Карта ===== */
.cat-toggle{display:none}
.map-back{display:none}
@media (max-width:1023px){
  .map-pane{position:relative; top:0; height:380px; min-height:0; max-height:none}
  /* Toggle pill */
  .cat-toggle{
    display:flex; gap:4px;
    margin:6px 16px 14px;
    background:#eef2f6; border-radius:999px; padding:4px;
    position:sticky; top:62px; z-index:40;
    box-shadow:0 1px 2px rgba(19,55,79,.06);
  }
  body.scrolled .cat-toggle{top:62px}
  .cat-toggle .ct-btn{
    flex:1; padding:8px 12px; border:0;
    background:transparent; border-radius:999px;
    cursor:pointer; font-family:inherit;
    font-weight:700; font-size:13.5px; color:#5b6b7a;
    display:flex; align-items:center; justify-content:center; gap:6px;
    transition:background .15s, color .15s;
  }
  .cat-toggle .ct-btn.active{
    background:#fff; color:#13374f;
    box-shadow:0 1px 4px rgba(19,55,79,.12);
  }
  .cat-toggle .ct-svg{width:15px; height:15px}
  .cat-toggle .ct-cnt{
    font-weight:500; font-size:12px; color:#7a8a9c;
    margin-left:1px;
  }
  .cat-toggle .ct-btn.active .ct-cnt{color:#13374f; opacity:.6}
  /* По умолчанию — режим Список: карту скрываем */
  .map-pane{display:none}
  /* Режим Карта: full-screen overlay */
  body.cat-mode-map{overflow:hidden}
  body.cat-mode-map .map-pane{
    display:block !important;
    position:fixed; inset:0;
    height:100dvh; max-height:none; min-height:0;
    width:100vw;
    z-index:90; border-radius:0;
    box-shadow:none;
  }
  body.cat-mode-map .list-pane{display:none}
  body.cat-mode-map .cat-toggle{display:none}
  body.cat-mode-map .header,
  body.cat-mode-map .filter-bar,
  body.cat-mode-map .m-stickybar{display:none !important}
  /* Кнопка «К списку» поверх карты */
  body.cat-mode-map .map-back{
    display:inline-flex; align-items:center; gap:6px;
    position:fixed; top:14px; left:14px; z-index:95;
    padding:9px 14px; border-radius:999px;
    background:#fff; box-shadow:0 4px 16px rgba(19,55,79,.20);
    border:0; cursor:pointer; font-family:inherit;
    font-size:14px; font-weight:700; color:#13374f;
  }
  body.cat-mode-map .map-back svg{width:14px; height:14px}
  /* ===== Округ-чипы: плашка снизу, чипы в 2 ряда (grid + h-scroll если много) ===== */
  body.cat-mode-map .map-okrug-legend{
    position:fixed; left:0; right:0; bottom:0; top:auto;
    width:100%; max-width:none;
    z-index:94;
    background:#fff;
    border:0;
    border-radius:18px 18px 0 0;
    box-shadow:0 -6px 24px rgba(19,55,79,.18);
    backdrop-filter:none;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    display:flex; align-items:stretch; gap:8px;
    overflow:hidden;
  }
  body.cat-mode-map .map-okrug-legend[hidden]{ display:none !important }
  body.cat-mode-map .map-okrug-legend .mol-label{ display:none }
  /* Fade-маски слева/справа — подсказка что есть ещё чипы за краем */
  body.cat-mode-map .map-okrug-legend::before,
  body.cat-mode-map .map-okrug-legend::after{
    content:''; position:absolute; top:10px; bottom:10px;
    width:28px; z-index:3; pointer-events:none;
    opacity:0; transition:opacity .18s ease-out;
  }
  body.cat-mode-map .map-okrug-legend::before{
    left:0;
    background:linear-gradient(90deg, #fff 30%, rgba(255,255,255,0));
  }
  body.cat-mode-map .map-okrug-legend::after{
    right:0;
    background:linear-gradient(-90deg, #fff 30%, rgba(255,255,255,0));
  }
  body.cat-mode-map .map-okrug-legend.has-overflow-left::before{ opacity:1 }
  body.cat-mode-map .map-okrug-legend.has-overflow-right::after{ opacity:1 }
  /* Grid 2 ряда × auto-flow column: при 8 чипах = 2×4, скролл вправо */
  body.cat-mode-map .map-okrug-legend .mol-chips{
    display:grid;
    grid-template-rows:repeat(2, minmax(0, 1fr));
    grid-auto-flow:column;
    grid-auto-columns:calc(50% - 3px);
    gap:6px;
    flex:1 1 auto; min-width:0;
    overflow-x:auto; overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    scroll-snap-type:x proximity;
    scroll-padding-left:0;
  }
  body.cat-mode-map .map-okrug-legend .mol-chips::-webkit-scrollbar{ display:none }
  body.cat-mode-map .mo-chip{
    width:100%; min-width:0;
    justify-content:center;
    scroll-snap-align:start;
  }
  body.cat-mode-map .mo-chip .mo-name{
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    min-width:0;
  }
  body.cat-mode-map .map-okrug-legend .mol-reset{
    flex:0 0 auto; padding:4px 8px;
    align-self:center;
  }
  /* ===== /Плашка-чипы 2 ряда + h-scroll fade ===== */
}
/* ===== /Toggle Список ↔ Карта ===== */