/* Дополнения к buro.css (он скопирован из pages/assets без правок).
   Только то, чего в макете не было: заглушка фото, листание страниц, кнопка
   «Показать» у формы фильтров для работы без скрипта, кнопки вместо ссылок на фасеты. */
.card__ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:var(--cream);color:#8a8578;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.gallery__stage .card__ph{font-size:13px}
.pager{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:28px}
.pager__at{color:var(--muted);font-size:13px}
.filters__submit{margin-top:16px}
.js .filters__submit{display:none}   /* со скриптом форма уходит сама при изменении */
/* query-фасеты в характеристиках — кнопки GET-форм, а не ссылки (СХЕМА_АДРЕСОВ §7); выглядят как ссылки */
.spec__form{display:inline}
.spec__btn{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* каталог на HTMX: пока ждём ответ — выдача приглушена; ответ не пришёл — сообщение */
#results.htmx-request{opacity:.55;transition:opacity .15s .1s}
.catalog__error{margin:4px 0 12px;padding:10px 14px;border-left:2px solid var(--navy);font-size:13px;line-height:20px}

/* оформление: квартира и индекс в одну строку */
.addr__row{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}

/* мега-меню и аккордеоны выезжающего меню — из bottega/index.html; фото колонок сняты, плоские списки — по Ире (07.11.2026) */
.mega{display:none}
.nav__link.is-active{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
/* девять пунктов шапки (+ «Прикладные материалы») на 1200 упираются в логотип и значки — зазор меньше */
@media (min-width:1200px) and (max-width:1359px){.nav ul{gap:14px}}
@media (min-width:1200px){
  .mega{display:block;position:absolute;left:0;right:0;top:100%;z-index:60}
  .mega__panel{background:#fff;border-bottom:1px solid var(--line);padding:40px 36px;max-height:calc(100vh - 62px);overflow-y:auto;overscroll-behavior:contain}   /* длинный список не уходит за экран */
  .mega__panel[hidden]{display:none}
  .mega__cols{display:flex;justify-content:center;gap:15px}
  .mega__col{flex:none;width:181px;text-align:center}
  .mega__title{display:block;margin-top:16px;font-size:14px;line-height:22px;font-weight:600;color:#000;text-decoration:none}
  .mega__title:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
  .mega__links{display:flex;flex-direction:column;gap:12px;margin-top:24px}
  .mega__links a{font-size:14px;line-height:22px;color:#000;text-decoration:none}
  .mega__links a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
  .mega__panel--list .mega__cols{justify-content:flex-start;gap:0;padding-left:40px}
  .mega__panel--list .mega__col{width:180px;text-align:left}
  .mega__panel--list .mega__title{margin-top:0}
  .mega__group{margin-top:40px}
  .mega__group .mega__title{margin-top:0}
  /* плоский список (74 типа) — колонками, число колонок считает menu.Panel.columns */
  .mega__flat{columns:var(--cols);column-gap:24px;max-width:calc(var(--cols) * 240px + 40px);padding-left:40px}
  .mega__flat li{break-inside:avoid}
  .mega__flat a,.mega__flat button{display:block;width:100%;padding:3px 0;font-size:14px;line-height:22px;color:#000;text-decoration:none;text-align:left}
  .mega__flat a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
}
/* drawer: аккордеоны разделов */
.drawer__btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 20px 0 24px;font:inherit;font-size:16px;line-height:48px;color:#000;background:none;border:0;text-align:left;cursor:pointer}
.drawer__btn .icon{width:18px;height:18px;transition:transform .2s}
.drawer__btn[aria-expanded="true"] .icon{transform:rotate(180deg)}
.drawer__sub{padding:4px 0 12px;background:#fafafa;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.drawer__sub[hidden]{display:none}
.drawer__groups,.drawer__flat{padding:8px 0 0}
.drawer__gt{margin:0;padding:10px 24px 2px;font-size:12px;line-height:18px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#000}
.drawer__list .drawer__sub ul a{padding:0 24px 0 40px;font-size:14px;line-height:38px}
.drawer__list .drawer__all{display:block;margin-top:8px;padding:0 24px;font-size:13px;line-height:38px;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.drawer__list .drawer__gt a,.drawer__gt button{display:inline;padding:0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;text-decoration:none}
.drawer__groups ul{margin-bottom:6px}
/* пункты меню с query — кнопки GET-форм (СХЕМА_АДРЕСОВ §7), выглядят как ссылки */
.menu-form{display:contents}
:where(.menu-form) button{color:inherit;text-align:inherit;cursor:pointer}   /* :where — не перебивать .mega__title */
/* пункт шапки с query («Распродажа») — кнопка формы, выглядит как соседние ссылки (buro.css, .nav a) */
.nav .menu-form button{display:block;padding:2px 0;color:#000;white-space:nowrap;font-size:14px;line-height:22px}
@media (hover:hover){.nav .menu-form button:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}}
.mega__title.mega__title{width:100%}
.mega__links button{font-size:14px;line-height:22px;color:#000}
.drawer__list>li>.menu-form button{display:block;width:100%;padding:0 24px;font-size:16px;line-height:48px;text-align:left;color:#000}
.drawer__list .drawer__sub ul button{display:block;width:100%;padding:0 24px 0 40px;font-size:14px;line-height:38px;text-align:left;color:#000}
@media (hover:hover){.mega__links button:hover,.mega__flat button:hover,.drawer__sub button:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}}

/* Видео в галерее карточки (21.10.2026): кадр целиком, без обрезки — у товара кадр не режем.
   Ролик поверх постера, кнопки «Увеличить» и «Смотреть крупно» — сверху, чтобы не спорить с панелью плеера */
.gallery__stage video{position:absolute;inset:0;z-index:1;background:#f3f3f3}
.gallery__stage.is-video img,.gallery__stage video{object-fit:contain}
/* по центру кадра; left и right вместо left:50% — иначе браузер даёт кнопкам половину ширины и подпись переносится */
.gallery__plays{position:absolute;left:16px;right:16px;top:50%;z-index:2;transform:translateY(-50%);width:fit-content;
  margin:0 auto;display:flex;flex-direction:column;gap:8px}
.gallery__plays[hidden]{display:none}
/* как кнопки первого экрана главной (home.css, .media .btn); подпись ролика задаёт магазин — переносится */
.gallery__play{min-width:194px;height:auto;min-height:38px;border:0;white-space:normal;text-align:center}
.gallery__acts{position:absolute;top:10px;right:10px;z-index:4;display:flex;gap:6px}
.gallery__acts .gallery__zoom{position:static}
.gallery__acts [hidden]{display:none}
.gallery__thumb--video{position:relative}
.gallery__thumb--video::after{content:"\25B6";position:absolute;left:50%;top:40px;transform:translate(-50%,-50%);color:#fff;font-size:15px;text-shadow:0 0 4px rgba(0,0,0,.7)}
.prose p{max-width:68ch;margin:0 0 12px}

/* Свайп (07.11.2026): горизонталь — листание кадров, вертикаль и щипок остаются браузеру.
   Страницу увеличили щипком — свайп выключен, палец двигает увеличенную страницу (html.is-zoomed ставит site.js).
   Плитка — только в сетке: ряд .rail под карточкой сам прокручивается вбок */
.js .gallery__stage,.js .grid .card__media[data-frames]{touch-action:pan-y pinch-zoom}
.js .gallery__stage img{cursor:zoom-in}
.js .gallery__stage.is-video img{cursor:auto}
.is-zoomed .gallery__stage,.is-zoomed .grid .card__media[data-frames],.is-zoomed .viewer{touch-action:auto}
/* сосед, который едет за пальцем рядом с текущим кадром (site.js, peeker) */
.peek{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;pointer-events:none}
.is-dragging{transition:none!important}
.is-settling{transition:transform .2s ease-out!important}

/* Просмотрщик фото: поверх страницы, в том же окне. Кадр целиком, без обрезки */
.viewer{position:fixed;inset:0;z-index:150;background:#101010;color:#fff;overflow:hidden;
  overscroll-behavior:contain;touch-action:pinch-zoom;-webkit-user-select:none;user-select:none}
.viewer[hidden]{display:none}
.viewer__track{display:flex;height:100%;transition:transform .25s ease-out;will-change:transform}
.viewer__slide{flex:0 0 100%;height:100%;background:center/contain no-repeat}
.viewer__slide img{display:block;width:100%;height:100%;object-fit:contain}
.viewer__count{position:absolute;left:16px;top:calc(14px + env(safe-area-inset-top,0px));margin:0;font-size:13px;line-height:20px;
  text-shadow:0 0 4px rgba(0,0,0,.6)}
.viewer__btn{position:absolute;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;
  border:0;border-radius:50%;background:rgba(16,16,16,.55);color:#fff;cursor:pointer}
.viewer__btn .icon{width:22px;height:22px;stroke:currentColor;stroke-width:1.5;fill:none}
.viewer__btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.viewer__btn[aria-disabled="true"]{opacity:.25;cursor:default}
.viewer__close{right:8px;top:calc(6px + env(safe-area-inset-top,0px))}
.viewer__nav{top:50%;margin-top:-22px}
.viewer__nav--prev{left:8px}
.viewer__nav--next{right:8px}
.guide video{display:block;width:100%;height:100%;object-fit:contain}
.viewer__nav--next .icon{transform:rotate(180deg)}

/* Простые страницы (30.10.2026): о магазине, помощь, документы — текст из админки, разметка textpages/markup.py.
   Длинные реквизиты и адреса переносятся, страница не шире экрана */
.text-page__body{max-width:680px;padding-bottom:56px;font-size:13px;line-height:22px;overflow-wrap:anywhere}
.text-page__body h2{margin:28px 0 8px;font-size:13px;line-height:22px;font-weight:600}
.text-page__body h2:first-child{margin-top:0}
.text-page__body p,.text-page__body ul{margin:0 0 12px}
.text-page__body ul{padding-left:18px;list-style:disc}
.text-page__body a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}