/* Кейсы Geniled — /keysy. Raleway наследуется от темы Aspro Max.
   Правило Geniled: НИКАКИХ hover-lift на плашках (transform/shadow/bg/opacity).
   Разрешена только смена border-color. */
.keysy-wrap {
  width: 100%; max-width: none; margin: 0; padding: 24px 0 64px;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" on, "lnum" on, "kern" on;
}
.keysy-wrap, .keysy-wrap * { box-sizing: border-box; }
.keysy-head h1 { font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; margin: 0 0 8px; letter-spacing: -.01em; }
.keysy-sub { color: #6b6b72; font-size: 16px; margin: 0 0 20px; }

.keysy-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
/* поиск — как .gnld-city-modal__search (раскрытие города): h48, 1px line, brand focus-ring, лупа слева */
.keysy-search-wrap {
  flex: 1 1 280px; min-width: 240px; position: relative; display: flex; align-items: center; height: 48px;
  background: transparent; border: 1px solid #3B3E42; border-radius: 10px;
  transition: border-color 150ms cubic-bezier(0.4,0,0.2,1), box-shadow 150ms cubic-bezier(0.4,0,0.2,1);
}
.keysy-search-wrap:focus-within { border-color: #92289A; }   /* один бордер в фокусе — без двойного focus-ring */
.keysy-search-icon { position: absolute; left: 14px; width: 20px; height: 20px; color: #A4A4A4;
  pointer-events: none; transition: color 150ms cubic-bezier(0.4,0,0.2,1); }
.keysy-search-wrap:focus-within .keysy-search-icon { color: #92289A; }
#keysySearch {
  flex: 1; height: 100%; padding: 0 14px 0 42px; font: inherit; font-size: 15px;
  background: transparent; color: #fff; border: none; outline: none;
}
#keysySearch::placeholder { color: #A4A4A4; opacity: 1; }
.keysy-filters { display: flex; flex-wrap: wrap; gap: 8px; }
/* .kf — как плашка a.pull-right с главной: прозрачный фон, 1px серый бордер, серый текст.
   Hover/active (вкл. первую «Все») — заливка #AC2DC3 + белый, как .lf-chip:hover на gde-kupit. */
.kf {
  padding: 9px 16px; font: inherit; font-weight: 600; font-size: 14px; cursor: pointer;
  background: transparent; color: #999; border: 1px solid transparent; border-radius: 10px;
  transition: background .15s, border-color .15s, color .15s;
}
/* бордер — только при наведении (рамка появляется на hover); активная «Все» — заливка */
.kf:hover { background: transparent; color: #fff; border-color: #898989; }
.kf.active { background: #92289A; color: #fff; border-color: transparent; }
.keysy-count { color: #8a8a90; font-size: 14px; margin: 14px 2px 0; }

/* ряд чипов-серий светильников (фасет из карточек, авто-подсказка + фильтр) */
.keysy-series { display: flex; flex-wrap: wrap; gap: 14px 8px; align-items: center; margin-top: 24px; }
.keysy-series-lbl { color: #8a8a90; font-size: 13px; font-weight: 600; margin-right: 4px; }
.kchip-f {
  padding: 7px 13px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  background: transparent; color: #c4c4cc; border: 1.5px solid rgba(255,255,255,.18); border-radius: 999px;
  transition: border-color .15s, color .15s, background .15s;
}
.kchip-f:hover { background: #92289A; color: #fff; border-color: transparent; }
.kchip-f.active { background: #92289A; color: #fff; border-color: transparent; }
.kchip-f i { font-style: normal; opacity: .6; font-size: 12px; margin-left: 3px; }
.kchip-f.active i { opacity: .85; }
/* кнопки-разделы с логотипами брендов (Geniled / Art / Park) — только лого, без текста */
.kf-logo { padding: 8px 16px; display: inline-flex; align-items: center; }
.kf-logo svg, .kf-logo img { height: 17px; width: auto; display: block; }

/* значок «ссылка» — на линии заголовка #pagetitle, справа, только иконка (без слова) */
.topic__heading { display: flex !important; align-items: center; gap: 18px; }
.topic__heading #pagetitle { margin-right: auto; }
.kshare { margin-left: auto; background: transparent !important; border: 0 !important; cursor: pointer;
  padding: 4px 6px !important; font-size: 22px; line-height: 1; color: #c4c4cc !important; border-radius: 8px; }
.kshare:hover { background: transparent !important; color: #92289A !important; }
.kshare svg { display: block; stroke: currentColor; }
.kshare.kshare--ok { color: #5fae7e !important; }

/* ---- Раскладка: левый сайдбар-фильтр + грид справа ---- */
.keysy-layout { display: grid; grid-template-columns: 280px 1fr; gap: 28px; align-items: start; margin-top: 8px; }
.keysy-side {
  align-self: start;
  display: flex; flex-direction: column; gap: 12px;
  padding-right: 4px;
}
/* секции-аккордеоны не сжимать — иначе flex-shrink режет содержимое под overflow:hidden (Разделы теряли ряд) */
.keysy-side .kacc { flex: none; }
.keysy-main { min-width: 0; }   /* min-width:0 — иначе грид распирает контейнер шире колонки */
/* поиск — на всю ширину контентной области (над гридом карточек) */
.keysy-main .keysy-search-wrap { width: 100%; flex: none; margin: 0 0 18px; }
/* поиск в сайдбаре — на всю ширину колонки (а не flex:1 из шапки) */
.keysy-side .keysy-search-wrap { flex: none; width: 100%; min-width: 0; }
/* share-кнопку JS переносит на линию заголовка; в сайдбаре до переноса не мешает */
.keysy-side #keysyShare { align-self: flex-end; }
/* чип-контейнеры в узкой колонке — обычный wrap, без верхнего отступа секции */
.keysy-side .keysy-filters, .keysy-side .keysy-series, .keysy-side .keysy-dirs { margin-top: 0; gap: 8px; }

/* фильтры направлений/серий — текстовый список (не плашки): метка слева, счётчик справа */
.keysy-side .keysy-dirs, .keysy-side .keysy-series { flex-direction: column; gap: 0; align-items: stretch; }
.keysy-side .keysy-dirs .kchip-f, .keysy-side .keysy-series .kchip-f {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  width: 100%; padding: 5px 2px; border: 0; border-radius: 0; background: transparent;
  font-size: 14px; font-weight: 500; color: #b8b8c0; text-align: left;
  transition: color .15s;
}
.keysy-side .keysy-dirs .kchip-f:hover, .keysy-side .keysy-series .kchip-f:hover {
  background: transparent; color: #fff; border-color: transparent;
}
.keysy-side .keysy-dirs .kchip-f.active, .keysy-side .keysy-series .kchip-f.active {
  background: transparent; color: #92289A; font-weight: 700; border-color: transparent;
}
.keysy-side .keysy-dirs .kchip-f i, .keysy-side .keysy-series .kchip-f i { opacity: .5; font-size: 12px; margin-left: 8px; }
.keysy-side .keysy-dirs .kchip-f.active i, .keysy-side .keysy-series .kchip-f.active i { opacity: .85; }

/* «Разделы» — 2 в ряд, плашки по своему содержимому (без растяжки на всю ширину) */
.keysy-side .keysy-filters { display: grid; grid-template-columns: repeat(2, max-content); justify-content: start; gap: 8px; }
.keysy-side .keysy-filters .kf { width: auto; }
.keysy-side .keysy-filters .kf-logo { justify-content: center; }
/* «Все» (первая плашка) — без заливки; active/hover показываем бордером */
#keysyFilters .kf:first-child:hover,
#keysyFilters .kf:first-child.active { background: transparent; color: #fff; border-color: #898989; }

/* списки направлений/серий — показываем все целиком, без скроллов (ни верт., ни гориз.) */
.keysy-side .keysy-dirs, .keysy-side .keysy-series { overflow: visible; max-height: none; }

/* аккордеон-секция: заголовок-кнопка + схлопываемое тело */
.kacc { border: 1px solid rgba(255,255,255,.10); border-radius: 12px; overflow: hidden; }
.kacc-h {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 12px 14px; font: inherit; font-weight: 700; font-size: 14px; color: #e6e6e6;
  background: transparent; border: 0; text-align: left; cursor: pointer;
}
.kacc-h:hover { color: #fff; }
.kacc-arr { width: 16px; height: 16px; flex: none; color: #8a8a90; transition: transform .2s; }
.kacc--open .kacc-arr { transform: rotate(180deg); }
.kacc-body { display: none; padding: 0 14px 14px; }
.kacc--open > .kacc-body { display: block; }
/* секция «Разделы» — всегда раскрыта, не сворачивается (ни клик, ни поиск/Aspro JS) */
.kacc--static > .kacc-body { display: block !important; padding-top: 14px; }
.kacc--static .kacc-h { cursor: default; }

/* адаптив: узкие экраны — сайдбар сверху, грид меньше колонок */
@media (max-width: 1100px) {
  .keysy-layout { grid-template-columns: 1fr; }
  .keysy-side { position: static; max-height: none; overflow: visible; }
}
.keysy-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);   /* 3 в ряд — место слева под сайдбар-фильтры */
  gap: 18px; margin-top: 0;
}
/* медиа-запросы ПОСЛЕ базового .keysy-grid — иначе равная специфичность + позже в источнике перебьёт их */
@media (max-width: 760px) { .keysy-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .keysy-grid { grid-template-columns: 1fr; } }
.kcard {
  display: flex; flex-direction: column; text-decoration: none; color: #e6e6e6;
  border: 1.5px solid rgba(255,255,255,.16); border-radius: 14px; overflow: hidden; background: transparent;
  transition: border-color .15s;   /* только border — без lift */
}
.kcard:hover { border-color: #722e85; }
.kcard-thumb {
  position: relative; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #722e85 0%, #9e4dab 100%);
}
.kcard[data-sec="03."] .kcard-thumb { background: linear-gradient(135deg, #9e4dab, #c46fd0); }
.kcard[data-sec="04."] .kcard-thumb { background: linear-gradient(135deg, #3b7a57, #5fae7e); }
.kcard-thumb::before {
  content: attr(data-letter); color: rgba(255,255,255,.92); font-size: 54px; font-weight: 800;
}
.kbadge {
  position: absolute; bottom: 8px; left: 8px;
  display: inline-flex; align-items: center; gap: 5px;
  background: transparent; color: #fff;           /* без заливки, без рамки — чистый значок поверх фото */
  font-size: 13px; font-weight: 700; padding: 0;
  text-shadow: 0 1px 3px rgba(0,0,0,.7);          /* читаемость поверх фото */
  font-variant-numeric: tabular-nums lining-nums; font-feature-settings: "tnum" on, "lnum" on;
  transition: color .15s;
}
.kbadge svg { display: block; width: 15px; height: 15px; stroke: currentColor; stroke-width: 1.7; fill: none;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.6)); }
.kbadge-v { left: auto; right: 8px; }
.kcard:hover .kbadge { color: #92289A; }          /* при наведении сами иконки+цифра → фирменный фиолетовый */
.kcard-body { padding: 13px 15px 16px; display: flex; flex-direction: column; gap: 6px; }
.kcard-title {
  font-weight: 700; font-size: 16px; line-height: 1.25;
  /* резерв под 3 строки названия → город всегда на одной линии во всём ряду; длиннее — обрезка */
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  min-height: calc(1.25em * 3);
}
.kcard-loc { color: #7a7a80; font-size: 13.5px; }
.kcard-fix { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.kchip {
  border: 1.5px solid #9b30ae; color: #722e85; background: #fff;
  border-radius: 999px; padding: 4px 11px; font-size: 12.5px; font-weight: 600;
}
.keysy-empty { text-align: center; color: #8a8a90; padding: 48px 0; }

/* ---- Карточка ---- */
.kcase .kback { display: inline-block; color: #722e85; text-decoration: none; font-weight: 600; margin-bottom: 14px; }
.keysy-eyebrow { font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #722e85; }
.kcase h1 { font-size: clamp(24px, 3.4vw, 38px); font-weight: 800; margin: 8px 0 10px; }
.kcase-loc { color: #6b6b72; font-size: 16px; font-weight: 500; margin-bottom: 8px; }
.kblock { margin-top: 36px; }
.kblock h2 { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #8a8a90; margin: 0 0 14px; }
/* видео: НЕСКОЛЬКО → узкие плитки в ряд (16:9); ОДНО (hero) → на всю ширину (override ниже).
   Постер размыт в покое → сразу понятно «это видео, не фото»; при play — резкий. */
.kvideos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 280px)); gap: 14px; justify-content: start; }
.kvid {
  width: 100%; max-width: 100% !important; aspect-ratio: 16 / 9; object-fit: cover;
  border-radius: 12px; background: #000; display: block;   /* !important перебивает Aspro video{max-width:98% !important} */
  filter: blur(3px) brightness(.72); transition: filter .3s;   /* размытие-индикатор «это видео» */
}
/* overlay-hero: заголовок #pagetitle поверх видео (сверху — низ свободен под controls). Одиночное — во всю ширину, родной аспект */
.kvideos--hero { position: relative; grid-template-columns: 1fr; }
.kvideos--hero .kvid { border-radius: 14px; aspect-ratio: 16 / 9; }   /* окно всегда горизонтальное (и для вертикальных видео) */
.kvhero-title {
  position: absolute; top: 0; left: 0; right: 0; z-index: 3;
  padding: 26px 30px 56px; pointer-events: none;   /* клики проходят к видео (play по центру) */
  border-radius: 14px 14px 0 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.82) 0%, rgba(0,0,0,.5) 45%, transparent 100%);
}
.kvhero-title #pagetitle {
  margin: 0; color: #fff !important; font-weight: 800; line-height: 1.18;
  font-size: clamp(20px, 2.6vw, 32px); text-shadow: 0 2px 10px rgba(0,0,0,.55);
}
/* город/локация — отдельной строкой: меньше, легче, ниже заголовка */
.kcase-loc { font-size: 15px; font-weight: 400; color: #8a8a90; margin: 8px 0 0; }
.kvhero-title .kcase-loc { color: rgba(255,255,255,.82); font-weight: 400; text-shadow: 0 2px 8px rgba(0,0,0,.5); margin-top: 8px; }
/* видео-плашка: клик по всей области играет + кастомная play-кнопка по центру */
.kvid-wrap { position: relative; cursor: pointer; border-radius: 14px; overflow: hidden; }
/* play-кнопка ПО ЦЕНТРУ: монохром, «вдавленная» — стеклянный тёмный круг с inner-shadow (эффект нажатой) */
.kvid-play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 64px; height: 64px; border: 1px solid rgba(255,255,255,.28); border-radius: 50%;
  padding: 0; cursor: pointer; z-index: 4;
  display: flex; align-items: center; justify-content: center;
  background: rgba(18,18,20,.42);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  box-shadow: inset 0 3px 7px rgba(0,0,0,.55), inset 0 -1px 2px rgba(255,255,255,.18), 0 6px 16px rgba(0,0,0,.4);
  color: #fff; transition: transform .12s, background .15s, box-shadow .12s;
}
.kvid-play:hover { transform: translate(-50%,-50%) scale(1.07); background: rgba(28,28,32,.55); }
.kvid-play:active { transform: translate(-50%,-50%) scale(.95); box-shadow: inset 0 4px 9px rgba(0,0,0,.65), 0 3px 8px rgba(0,0,0,.4); }  /* сильнее вдавливается при нажатии */
.kvid-play svg { width: 26px; height: 26px; display: block; margin-left: 2px; filter: drop-shadow(0 1px 2px rgba(0,0,0,.5)); }  /* +2px оптическая центровка треугольника */
.kvid-wrap.is-playing .kvid { filter: none; object-fit: contain; }   /* проигрывание: резко + видео вписано в окно 16:9 (вертикальное — с чёрными полями) */
.kvid-wrap.is-playing .kvid-play { opacity: 0; pointer-events: none; }
.kvid-wrap.is-playing .kvhero-title { opacity: 0; pointer-events: none; transition: opacity .25s; }
@media (prefers-reduced-motion: reduce) {
  .kvid-play, .kvid-play::before { animation: none; }
}
/* подтянуть контент наверх когда hero (видео + overlay-заголовок) */
.keysy-hero .keysy-wrap { padding-top: 0 !important; margin-top: -44px; }
.kgallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
.kph-stub {
  aspect-ratio: 4 / 3; border-radius: 10px; display: flex; align-items: center; justify-content: center;
  background: repeating-linear-gradient(45deg, #f1edf4, #f1edf4 10px, #eae4ef 10px, #eae4ef 20px);
  color: #b39bc4; font-weight: 700; border: 1px solid #ece7f0;
}
.kmeta { color: #9a9aa0; font-size: 13px; margin-top: 10px; }
/* CTA «на Яндекс.Диске» — в стиле плашек-серий .kchip-f: outline-пилюля → залив #92289A при hover */
.kcta {
  display: inline-flex; align-items: center; gap: 9px;
  background: transparent; color: #c4c4cc;
  text-decoration: none; padding: 13px 22px; border-radius: 999px;
  font-weight: 700; font-size: 15px;
  border: 1.5px solid rgba(255,255,255,.18);
  transition: border-color .15s, color .15s, background .15s;
}
.kcta:hover { background: #92289A; color: #fff; border-color: transparent; }

/* /keysy: убрать штатный левый сайдбар Aspro. keysy.css грузится ТОЛЬКО на /keysy. */
.left_block.sticky-sidebar,
.sticky-sidebar__inner { display: none !important; }

/* /keysy: хлебные крошки не нужны (schema-разметка остаётся в DOM для SEO, визуально скрыта) */
.breadcrumbs { display: none !important; }

/* /keysy: контент влево на всю ширину контентной области.
   Отступ давал margin-left у .right_block (Aspro резервирует место под сайдбар) +
   центрирующий .container внутри. Распрямляем. .maxwidth-theme НЕ трогаем — он = край меню. */
.right_block { margin-left: 0 !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
.right_block .middle { width: 100% !important; }
.right_block .container { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
.container_inner.clearfix { float: none !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }

/* /keysy: тёмная тема сайта — на тёмном фоне страницы текст СВЕТЛЫЙ.
   Внутри белых плашек текст остаётся тёмным (там фон светлый). */
.keysy-head h1, .kcase h1 { color: #fff !important; }
.keysy-sub { color: #c4c4cc !important; }
.keysy-count { color: #b0b0b8 !important; }
.kblock h2 { color: #b0b0b8 !important; }
.kback { color: #fff !important; }
.kcase-loc { color: #c4c4cc !important; }
.kmeta { color: #9a9aa0 !important; }
/* плашки прозрачные (тёмная тема) — текст СВЕТЛЫЙ */
.kcard-body { background: transparent; }
.kcard-title { color: #f0f0f2 !important; }
.kcard-loc { color: #aeb0b8 !important; }
.kchip { background: transparent !important; color: #d6bfe6 !important; border-color: #9b30ae !important; }

/* /keysy: регион — подзаголовок под H1, меньше шрифт, светлый (тёмная тема) */
.kcase-region { color: #c4c4cc !important; font-size: 16px; font-weight: 500; margin: 6px 0 0; }

/* /keysy: снимаем боковые 30px → #pagetitle по левому краю меню (hr30 сидит на краю .wrapper_inner).
   Вертикальные отступы вынесены в правило ниже (бьёт header-overrides-ru.css). */
.page-top.maxwidth-theme { padding-left: 0 !important; padding-right: 0 !important; }
/* источник смещения контента на +30px — боковой padding .wrapper_inner (меню его не имеет) */
.wrapper_inner { padding-left: 0 !important; padding-right: 0 !important; }

/* keysy: добивка — гасим ЛЮБОЙ левый отступ контентной обёртки (Aspro with_left_block).
   Scoped под .container_inner, грузится только на /keysy. */
.container_inner, .container_inner .right_block, .container_inner .right_block.wide_,
.container_inner .middle, .container_inner .container {
  margin-left: 0 !important; padding-left: 0 !important;
  width: 100% !important; max-width: 100% !important; float: none !important;
}

/* /keysy: #navigation — пустой бар (крошки скрыты), не нужен. Скрываем. */
#navigation { display: none !important; }

/* /keysy: фон ВСЕЙ страницы #101213 (как .wrapper_inner) — на всю ширину, до футера.
   .wrapper1 у Aspro красится темой с высокой специфичностью → бьём 3 классами.
   .footer_wrap/footer снаружи — свой фон сохраняют. */
body, .wrapper_inner, .page-top.maxwidth-theme { background: #101213 !important; }
.wrapper1.header_bgcolored.with_left_block { background: #101213 !important; }

/* /keysy: #pagetitle (родной h1 темы) — заподлицо с меню по левому краю */
.page-top .topic, .page-top .topic__inner, .page-top .topic__heading, #pagetitle {
  margin-left: 0 !important; padding-left: 0 !important;
}

/* /keysy: вертикальные отступы блока заголовка — 80px от меню сверху, 45px до .keysy-wrap снизу.
   Сайт-wide header-overrides-ru.css задаёт `body:has(.left_menu) .page-top.maxwidth-theme`
   (pt:0/pb:80/mt:0) → бьём БОЛЬШЕЙ специфичностью + scoped к списку через :has(.keysy-layout),
   чтобы не задеть карточку (.keysy-hero, margin-top:-44) и прочие страницы с левым меню.
   Фон #101213 совпадает → padding бесшовен. */
body:has(.left_menu):has(.keysy-layout) .page-top.maxwidth-theme {
  padding-top: 80px !important; padding-bottom: 45px !important; margin-top: 0 !important;
}
/* убрать внутренние паддинги .topic темы (15/40) — иначе суммарно 95/85 вместо 80/45 */
body:has(.left_menu):has(.keysy-layout) .page-top .topic { padding-top: 0 !important; padding-bottom: 0 !important; }
body:has(.left_menu):has(.keysy-layout) #pagetitle { margin-top: 0 !important; margin-bottom: 0 !important; }

/* /keysy КАРТОЧКА (.kcase, не-hero): #pagetitle 80px от меню, 45px до .kback.
   Hero (1 видео) исключён — там #pagetitle уезжает в overlay видео (.keysy-hero). */
body:has(.left_menu):has(.kcase):not(.keysy-hero) .page-top.maxwidth-theme { padding-top: 80px !important; padding-bottom: 0 !important; margin-top: 0 !important; }
body:has(.kcase):not(.keysy-hero) .page-top .topic { padding-top: 0 !important; padding-bottom: 0 !important; }
body:has(.kcase):not(.keysy-hero) #pagetitle { margin-top: 0 !important; margin-bottom: 0 !important; }
body:has(.kcase):not(.keysy-hero) .keysy-wrap.kcase { padding-top: 45px !important; }
body:has(.kcase):not(.keysy-hero) .kback { margin-top: 0 !important; }

/* грид-обложка: первое фото кейса (webp), заполняет превью; буква-плейсхолдер скрыта */
.kcard-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.kcard-thumb.has-img::before { display: none; }
.kcard-thumb.has-img { background: #0d0d0f; }

/* галерея карточки: реальные webp вместо заглушек */
.kgallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.kph { display: block; aspect-ratio: 4/3; border-radius: 10px; overflow: hidden;
  border: 1px solid rgba(255,255,255,.08); background: #0d0d0f; cursor: zoom-in; }
.kph img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.kph:hover img { transform: scale(1.04); }

/* выбор обложки админом (.kgallery--admin) — просто иконка-звезда, без плашки/текста */
.kph { position: relative; }
.kph-setcover {
  position: absolute; top: 8px; right: 8px; z-index: 2;
  width: 28px; height: 28px; padding: 0; cursor: pointer;
  background: none; border: none; color: #fff;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,.75));
  opacity: 0; transition: opacity .15s, color .15s, transform .1s;
}
.kph-setcover svg { display: block; width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.7; fill: none; }
.kgallery--admin .kph:hover .kph-setcover { opacity: 1; }       /* контурная звезда на hover фото */
.kph-setcover:hover { color: #92289A; transform: scale(1.12); }
.kph-setcover:disabled { opacity: .5; cursor: default; }
/* текущая обложка — залитая фиолетовая звезда, видна всегда + лёгкая рамка */
.kph--cover { box-shadow: 0 0 0 2px #92289A inset; }
.kph--cover .kph-setcover { opacity: 1; color: #92289A; }
.kph--cover .kph-setcover svg { fill: currentColor; }

/* лайтбокс */
.klight { position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.93);
  display: flex; align-items: center; justify-content: center; }
.klight[hidden] { display: none; }
.klight-img { max-width: 92vw; max-height: 88vh; object-fit: contain; border-radius: 6px; animation: klightFade .45s ease; }
/* вертикальные фото — меньше по высоте (не впритык к экрану); горизонтальные не трогаем */
.klight-img.klight-img--portrait { max-height: 78vh; }
/* fade-зум на смене фото (перезапуск анимации из JS) */
@keyframes klightFade { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: scale(1); } }
/* кнопка слайд-шоу — слева от счётчика внизу */
.klight-play {
  position: absolute; bottom: 14px; left: 50%; transform: translateX(calc(-50% - 54px));
  width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.28); color: #fff; cursor: pointer;
  transition: background .15s, border-color .15s; z-index: 2; padding: 0;
}
.klight-play:hover, .klight-play.is-playing { background: #92289A; border-color: transparent; }
.klight-play svg { width: 18px; height: 18px; display: block; }
.klight-x { position: absolute; top: 14px; right: 22px; font-size: 40px; line-height: 1;
  color: #fff; background: none; border: 0; cursor: pointer; }
.klight-nav { position: absolute; top: 50%; transform: translateY(-50%); font-size: 54px;
  color: #fff; background: none; border: 0; cursor: pointer; padding: 0 18px; opacity: .82; }
.klight-nav:hover { opacity: 1; }
.klight-prev { left: 8px; } .klight-next { right: 8px; }
.klight-count { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
  color: #cfcfd4; font-size: 14px; }

/* /keysy детальная карточка: таблица «Информация по объекту» 1:1 как в docx —
   метка (левая колонка) | значение или перечень (правая). Тёмная тема, текст светлый. */
.kinfo { width: 100%; border-collapse: collapse; font-size: 15px; }
.kinfo th, .kinfo td {
  text-align: left; vertical-align: top; padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.kinfo tr:last-child th, .kinfo tr:last-child td { border-bottom: 0; }
.kinfo th {
  width: 30%; min-width: 180px; font-weight: 700; color: #fff;   /* метка — белая */
  white-space: nowrap;
}
.kinfo td { color: #e3e3e8; line-height: 1.5; }
.kinfo td ul { margin: 0; padding: 0; list-style: none; }
.kinfo td li { padding: 3px 0; }
.kinfo td li + li { border-top: 1px dashed rgba(255,255,255,.07); padding-top: 7px; margin-top: 4px; }

/* «Светильники из проекта» — плашки раздела каталога (как карточки разделов в /catalog/).
   Тёмная карточка: имя сверху, фото товара ниже. Hover — только бордер (правило Geniled: без lift/scale/shadow). */
.ksec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 280px)); gap: 14px; justify-content: start; }
.ksec-card {
  display: flex; flex-direction: column; gap: 12px; padding: 18px;
  background: #1c1d20; border: 1px solid rgba(255,255,255,.08); border-radius: 12px;
  text-decoration: none; color: #fff; transition: border-color .15s;
}
.ksec-card:hover { border-color: #9B30AE; }
.ksec-card__name { font-size: 14px; font-weight: 600; color: #c4c4cc; line-height: 1.3; }
/* фон вместо <img> — обход Aspro lazy-load (он подменяет src <img> на data:gif) */
.ksec-card__img { width: 100%; aspect-ratio: 1 / 1; background-size: contain; background-position: center; background-repeat: no-repeat; }
@media (max-width: 640px) {
  .kinfo, .kinfo tbody, .kinfo tr, .kinfo th, .kinfo td { display: block; width: 100%; }
  .kinfo th { white-space: normal; padding-bottom: 2px; border-bottom: 0; }
  .kinfo td { padding-top: 2px; }
}

/* лид-форма «Хочу такой же проект» — по эталону .fg-subscribe (карточка #212224, декор-картинка,
   радиусы 8/24, CTA #AC2DC3). !important — Aspro каскад перебивает h2/input. Шрифт Raleway (политика). */
.klead { margin: 48px 0 8px; }
.klead__inner {
  position: relative; overflow: hidden;
  border-radius: 24px; background: #212224;
  min-height: 440px; padding: 56px 56px 56px 480px;   /* слева место под декор 408px */
}
.klead__decor {
  position: absolute; left: 32px; top: 28px; width: 408px; height: 408px;
  background: url('/upload/proektirovshchikam-subscribe-decor.png') no-repeat center / contain;
  pointer-events: none;
}
/* заголовок формы — как #fg-modal-title на /proektirovshchikam/ (28px/700/lh1.2), шрифт Raleway как у .lp-btn */
.klead__title {
  margin: 0 0 12px !important; color: #fff !important;
  font-family: 'Raleway', Arial, sans-serif !important;
  font-size: 28px !important; line-height: 1.2 !important; font-weight: 700 !important;
  text-transform: none !important; letter-spacing: 0 !important;
}
/* === Единая форма как fg-modal на /proektirovshchikam/ (ФИО/Город/Контакты/Комментарий) === */
.klead__sub { color: rgba(255,255,255,.6); font-size: 15px; line-height: 1.5; margin: 0 0 28px; }
.klead__form { display: flex; flex-direction: column; gap: 18px; max-width: 760px; }
.klead__group { display: flex; flex-direction: column; gap: 8px; }
.klead__label { font-size: 14px; font-weight: 600; color: #fff; }
.klead__input {
  width: 100%; box-sizing: border-box;
  padding: 14px 18px !important;
  font-family: 'Raleway', Arial, sans-serif !important; font-size: 15px !important; font-weight: 400 !important;
  background: #2A2C30 !important; color: #fff !important; border: 1px solid rgba(255,255,255,.08) !important; border-radius: 10px !important;
  transition: border-color .15s, background .15s !important;
}
.klead__textarea { min-height: 90px; resize: vertical; line-height: 1.5; }
.klead__input::placeholder { color: rgba(255,255,255,.35) !important; opacity: 1; }
.klead__input:focus { outline: none !important; border-color: #9B30AE !important; background: #2F3137 !important; }
/* кнопка = .fg-modal__submit; отступ 48px от поля комментария (просьба Димы) */
.klead__submit {
  align-self: flex-start; padding: 16px 24px; font-family: 'Raleway', Arial, sans-serif; font-size: 16px; font-weight: 600; cursor: pointer;
  background: #9B30AE; color: #fff; border: 0; border-radius: 10px;
  margin-top: 30px;   /* +flex gap 18px = 48px от .klead__textarea */
  transition: background .15s, transform .1s;
}
.klead__submit:hover:not(:disabled) { background: #b03ec5; }
.klead__submit:active:not(:disabled) { transform: scale(.98); }
.klead__submit:disabled { opacity: .6; cursor: progress; }
/* политика = .fg-modal__consent */
.klead__consent { margin: 0; font-size: 12px; line-height: 1.45; color: rgba(255,255,255,.4); }
.klead__consent a { color: rgba(255,255,255,.6); }
.klead__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.klead__status { margin: 4px 0 0; font-size: 14px; font-weight: 600; padding: 10px 14px; border-radius: 6px; }
.klead__status[data-state="success"] { background: rgba(34,197,94,.12); border: 1px solid rgba(34,197,94,.35); color: #5af07a; }
.klead__status[data-state="error"]   { background: rgba(239,68,68,.12);  border: 1px solid rgba(239,68,68,.35);  color: #ff7a7a; }
/* узкие экраны: декор уходит фоном-вотермарком, контент на всю ширину */
@media (max-width: 900px) {
  .klead__inner { min-height: 0; padding: 36px 28px; }
  .klead__decor { opacity: .12; left: auto; right: -60px; top: 50%; transform: translateY(-50%); }
}
@media (max-width: 560px) {
  .klead__row { grid-template-columns: 1fr; }
  .klead__decor { display: none; }
}

/* ============ keysy card: правки 2026-06-18 ============ */
/* 1) убрать дефис-буллет перед светильниками в таблице (глобальный Aspro ul li::before) */
.kinfo td ul { list-style: none !important; }
.kinfo td li { list-style: none !important; padding-left: 0 !important; }
.kinfo td li::before, .kinfo td li::marker { content: none !important; display: none !important; }

/* 2) .kback — голая стрелка (без кружка), сразу перед #pagetitle на строке заголовка.
   Селектор body:has(.kcase) — JS переносит .kback в .topic__heading перед #pagetitle. */
body:has(.kcase) .kback {
  display: inline-flex; align-items: center; justify-content: center;
  width: auto; height: auto; border: 0; background: none; border-radius: 0;
  color: #fff !important; text-decoration: none; font-size: 0; line-height: 0;
  margin: 0; transition: color .15s ease;
}
body:has(.kcase) .kback svg { width: 30px; height: 30px; display: block; }
body:has(.kcase) .kback:hover { color: #9e4dab !important; }

/* 3) город — отдельной строкой ПОД #pagetitle. #kcaseLoc лежит внутри flex .topic__heading,
   форсим перенос на свою строку во всю ширину слева (иначе flex прижимает вправо). */
body:has(.kcase) .topic__heading { flex-wrap: wrap; }
body:has(.kcase) #kcaseLoc {
  flex: 0 0 100%; width: 100%; text-align: left; order: 99;
  /* отступ слева = ширина стрелки (30px) + gap heading (18px) → выровнено под букву «Р» заголовка */
  margin: 8px 0 0 48px; color: #c4c4cc !important;
}

/* 4) метки «Информация по объекту» (.kinfo th) — не жирные */
.kinfo th { font-weight: 500 !important; }

/* 5) каждый светильник в строке — с заглавной буквы (только первая бугва строки) */
.kinfo td li::first-letter { text-transform: uppercase; }

/* ============ keysy index 2026-06-18: фильтры ============ */
/* «По направлениям» — высота ~7 пунктов, остальное под скролл; обе плашки всегда открыты */
/* display:block — иначе flex-column сжимает чипы (Серии = .keysy-series display:flex), скролл не работает */
#keysyDirs, #keysySeries { display: block; max-height: 252px; overflow-y: auto; overscroll-behavior: contain; }
#keysyDirs::-webkit-scrollbar, #keysySeries::-webkit-scrollbar { width: 6px; }
#keysyDirs::-webkit-scrollbar-thumb, #keysySeries::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); border-radius: 6px; }
#keysyDirs::-webkit-scrollbar-track, #keysySeries::-webkit-scrollbar-track { background: transparent; }
/* статичные плашки (Направления/Серии) — без стрелки аккордеона */
.kacc--static .kacc-arr { display: none; }

/* hover любого пункта фильтра (направления/серии) — залив #92289A, как у .kcta */
.keysy-side .keysy-dirs .kchip-f, .keysy-side .keysy-series .kchip-f {
  border-radius: 8px; padding: 7px 12px; transition: color .15s, background .15s;
}
.keysy-side .keysy-dirs .kchip-f:hover, .keysy-side .keysy-series .kchip-f:hover {
  background: #92289A; color: #fff;
}
.keysy-side .keysy-dirs .kchip-f:hover i, .keysy-side .keysy-series .kchip-f:hover i { opacity: .9; }