/* ============================== Мегаменю ==================================
   Разметку отдаёт inc/mm-nav.php, шапка вызывает его напрямую.
   Раньше эти правила лежали в mm-h2.css и были привязаны к body.mm-h2-page,
   то есть работали только на главной; сам блок подставлялся в шапку скриптом.
   Привязку сняли, файл вынесли — меню одинаковое на всех страницах. */
.mm-h2-navsrc { display: none; }
.mm-h2-nav { position: static; }
.mm-h2-nav .mm-h2-nav-i { position: static; display: inline-flex; }
.mm-h2-nav-t {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--mm-muted);
    font-family: var(--mm-sans);
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    transition: color .16s ease;
    cursor: pointer;
}
.mm-h2-nav-t:hover { color: var(--mm-ink); }
.mm-h2-nav-chev { opacity: .5; transition: transform .2s ease; }
.mm-h2-nav-i.is-open .mm-h2-nav-chev { transform: rotate(180deg); }
.mm-h2-nav-i.is-open .mm-h2-nav-t { color: var(--mm-ink); }
.mm-h2-nav-panel {
    position: absolute;
    z-index: 5;
    top: 100%;
    right: 0;
    left: 0;
    padding: 28px calc(clamp(18px, 4vw, 64px) + max(0px, (100% - 1500px) / 2));
    border-top: 1px solid var(--mm-line);
    border-bottom: 1px solid var(--mm-line);
    background: var(--mm-surface);
    box-shadow: var(--mm-shadow);
    text-align: left;
}
.mm-h2-nav-panel[hidden] { display: none; }
.mm-h2-nav-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 48px; }
.mm-h2-nav-col { display: grid; align-content: start; gap: 2px; }
.mm-h2-nav-cap {
    margin: 0 0 8px;
    color: var(--mm-gold);
    font-family: var(--mm-sans);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.mm-h2-nav-note { margin: 0 0 8px; color: var(--mm-muted); font-size: 12.5px; line-height: 1.55; }
.mm-h2-nav-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 40px;
    padding: 6px 0;
    border-bottom: 1px solid var(--mm-line);
    color: var(--mm-ink);
    font-size: 14.5px;
}
.mm-h2-nav-row:hover { color: var(--mm-gold); }
.mm-h2-nav-row em {
    flex: 0 0 auto;
    color: var(--mm-muted);
    font-size: 12.5px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}
.mm-h2-nav-areas { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 30px 48px; }
.mm-h2-nav-acol { min-width: 0; }
.mm-h2-nav-agrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 34px; }
/* «≈ 96 400 ฿/м²» длиннее прежней цены объекта — держим значение одной строкой. */
.mm-h2-nav-arow em { font-size: 12px; white-space: nowrap; }
.mm-h2-nav-arow { padding-left: 12px; border-left: 3px solid var(--mm-c, var(--mm-olive)); }
.mm-h2-nav-aside { display: grid; align-content: start; gap: 2px; }
.mm-h2-nav-panel-s {
    left: auto;
    width: min(420px, 92vw);
    padding: 22px 26px;
    margin-right: max(0px, (100% - 1500px) / 2);
}
@media (prefers-reduced-motion: reduce) {
    .mm-h2-cx-card,
    .mm-h2-cx-photo img,
    .mm-h2-office-ph img,
    .mm-h2-place-ph img,
    .mm-h2-place-cap,
    .mm-h2-blog .mm-post-card-image img,
    .mm-h2-yt-frame img,
    .mm-h2-yt-play,
    .mm-h2-nav-chev,
    .mm-h2-mbar { transition: none; }
}

/* ================= Правки при переносе меню на все страницы =================
   Раньше эти правила были привязаны к body.mm-h2-page — меню жило только
   на главной. Привязку сняли, ниже только то, что добавилось. */

/* Панель «Медиа» раскрывалась у правого края шапки, а не под своей кнопкой.
   Причина: у панели position:absolute с right:0, а у пункта меню — static,
   поэтому отсчёт шёл от шапки целиком. Замер: кнопка на 754 px, панель
   начиналась на 1020. Делаем пункт точкой отсчёта. */
.mm-h2-nav .mm-h2-nav-i-r { position: relative; }
.mm-h2-nav-i-r .mm-h2-nav-panel-s {
    left: auto;
    right: 0;
    width: min(420px, calc(100vw - 32px));
    padding: 20px 22px;
    border-radius: 0 0 12px 12px;
}

/* Колонки в панели «Места»: тринадцать типов в одну колонку — простыня. */
.mm-h2-nav-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.mm-h2-nav-all {
    display: inline-block;
    margin-top: 14px;
    color: var(--mm-gold-ink, #765f37);
    font: 600 14px/1.4 var(--mm-sans, Inter, sans-serif);
    border-bottom: 1px solid currentColor;
    text-decoration: none;
}

/* Места в мобильной шторке: на телефоне мегаменю не показывается вообще. */
.mm-drawer-places { margin: 18px 0 0; padding: 16px 0 0; border-top: 1px solid var(--mm-line, #e6e0d3); }

.mm-drawer-places-cap {
    margin: 0 0 10px;
    color: var(--mm-gold-ink, #765f37);
    font: 800 12px/1.3 var(--mm-sans, Inter, sans-serif);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.mm-drawer-places-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }

.mm-drawer-place {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    padding: 9px 11px;
    border-radius: 9px;
    background: rgba(173, 139, 81, .09);
    color: var(--mm-ink, #1d1d1b);
    font: 500 13px/1.3 var(--mm-sans, Inter, sans-serif);
    text-decoration: none;
}

.mm-drawer-place em { font-style: normal; font-size: 12px; color: var(--mm-muted, #6d7169); margin-left: auto; }

/* «Достопримечательность» в две колонки не влезает и обрезалась —
   разрешаем перенос внутри плитки. */
.mm-drawer-place { flex-wrap: wrap; overflow-wrap: anywhere; }
.mm-drawer-places-all { margin-top: 12px; }

/* На узком экране мегаменю прячем — там работает шторка. */
@media (max-width: 1024px) {
    .mm-h2-nav { display: none; }
}

/* ===== Строка типов мест и разбивка по районам =====
   Тринадцать типов в столбик отодвинули бы карту на экран вниз,
   поэтому строка одна и прокручивается вбок. */
.mm-places-typenav-strip {
    display: flex;
    /* Общий .mm-places-typenav переносит строки — здесь нужен один ряд. */
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    padding: 2px 0 10px;
    margin: 4px 0 0;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}
.mm-places-typenav-strip::-webkit-scrollbar { height: 4px; }
.mm-places-typenav-strip::-webkit-scrollbar-thumb { background: rgba(255,255,255,.28); border-radius: 4px; }

.mm-ptn-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: none;
    padding: 9px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.86);
    font: 600 13px/1.2 var(--mm-sans, Inter, sans-serif);
    text-decoration: none;
    white-space: nowrap;
}
.mm-ptn-item:hover { background: rgba(255,255,255,.13); color: #fff; }
.mm-ptn-item.is-current { background: var(--mm-gold, #ad8b51); border-color: var(--mm-gold, #ad8b51); color: #fff; }
.mm-ptn-item em { font-style: normal; font-size: 12px; opacity: .72; }
.mm-ptn-item .mm-poi-ic { width: 16px; height: 16px; display: inline-flex; }
.mm-ptn-item .mm-poi-ic svg { width: 100%; height: 100%; }

/* ===== Вкладки районов над сеткой карточек =====
   Заголовки-секции вытягивали страницу и ломали общий порядок
   (сверху самые известные места), поэтому фильтр, а не разбивка.
   Строка живёт на светлом фоне тела страницы — отсюда своя палитра,
   не такая, как у строки типов на тёмной шапке. */
/* Секция — элемент грида с min-width:auto, поэтому её минимальная ширина
   равна максимальной ширине содержимого. Без этого строка вкладок (2040 px)
   растягивала всю секцию, и карточки уезжали за правый край экрана. */
.mm-places-type-section { min-width: 0; }

.mm-places-areatabs {
    max-width: 100%;
    min-width: 0;
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    margin: 0 0 18px;
    padding: 2px 0 10px;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
    mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
}
.mm-places-areatabs::-webkit-scrollbar { height: 4px; }
.mm-places-areatabs::-webkit-scrollbar-thumb { background: rgba(0,0,0,.16); border-radius: 4px; }

.mm-pat {
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
    flex: none;
    /* 40 px по высоте — палец попадает без промаха. */
    padding: 10px 15px;
    border-radius: 999px;
    border: 1px solid var(--mm-line, #e6e0d3);
    background: #fff;
    color: var(--mm-ink, #1d1d1b);
    font: 600 13px/1.2 var(--mm-sans, Inter, sans-serif);
    white-space: nowrap;
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
}
.mm-pat:hover { border-color: var(--mm-gold, #ad8b51); }
.mm-pat:focus-visible { outline: 2px solid var(--mm-gold, #ad8b51); outline-offset: 2px; }
.mm-pat em { font-style: normal; font-size: 12px; font-weight: 500; color: var(--mm-muted, #6d7169); }
.mm-pat.is-on { background: var(--mm-gold, #ad8b51); border-color: var(--mm-gold, #ad8b51); color: #fff; }
.mm-pat.is-on em { color: rgba(255,255,255,.8); }

/* Карточка — flex, поэтому одного атрибута hidden мало: нужен вес выше,
   чем у правила самой карточки, иначе display её вернёт. */
.mm-places-grid .mm-places-card[hidden] { display: none; }

@media (max-width: 760px) {
    .mm-places-typenav-strip { margin-inline: -16px; padding-inline: 16px; }
    .mm-places-areatabs { margin-inline: -16px; padding-inline: 16px; }
}

/* Затухание у правого края: без него не видно, что строка продолжается.
   mask работает поверх прокрутки и не мешает нажатиям. */
.mm-places-typenav-strip {
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
    mask-image: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
}