/* LOST redesign — базовые стили контента внутренних страниц.
   Подключается ТОЛЬКО на не-главной (см. local/includes/header.php: ветка else).
   Тёмная тема уже активна глобально (body — base.css + legacy template_styles.css: #0E0911/#fff).
   Здесь — только читаемость типографики, ссылки и заголовок страницы. Разметку/ИБ/логику не трогаем.
   Область действия ограничена .main-content, чтобы не влиять на шапку/подвал/виджеты. */

/* Прячем легаси-подвал шаблона (меню/копирайт «.footer-links» и «сделано в…»),
   чтобы не дублировался над новым .lost-footer. На главной это уже делает home.css. */
.footer-links,
.footer__madein {
  display: none !important;
}

/* Заголовки контента: единый шрифт Inter, белый цвет (совпадает с текущим). */
.main-content h1,
.main-content h2,
.main-content h3,
.main-content h4,
.main-content h5,
.main-content h6,
.main-content .main_title {
  font-family: var(--lost-font-family);
  color: var(--lost-text-primary);
  line-height: var(--lost-lh-tight);
}

/* Заголовок страницы (выводится шаблоном в .breadcrumb > .main_title). */
.main-content .main_title {
  margin: var(--lost-space-4) 0 var(--lost-space-6);
  font-size: var(--lost-fs-h2);
  font-weight: var(--lost-fw-bold);
}

/* Основной текст. */
.main-content p,
.main-content li,
.main-content dd,
.main-content td {
  font-family: var(--lost-font-family);
  line-height: var(--lost-lh-body);
}

/* Ссылки в контенте (не трогаем кнопки .lost-btn и легаси-виджеты вне .main-content). */
.main-content a:not([class]) {
  color: var(--lost-text-link);
  transition: color var(--lost-transition);
}
.main-content a:not([class]):hover {
  color: var(--lost-text-primary);
}

/* Хлебные крошки внутренних страниц (если шаблон их показывает). */
.main-content .breadcrumb a {
  color: var(--lost-text-secondary);
  text-decoration: none;
  transition: color var(--lost-transition);
}
.main-content .breadcrumb a:hover {
  color: var(--lost-text-primary);
}

/* ---- Шапка страницы: крошки + H1 (local/includes/page-head.php)
   Единый стандарт для /about, /quest_v_podarok, акций, мероприятий и др. ---- */
.lost-page-head {
  margin-top: clamp(16px, 2.5vw, 28px);
  margin-bottom: clamp(28px, 4vw, 40px);
  font-family: var(--lost-font-family);
}

.lost-page-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-family: var(--lost-font-family);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.4;
}

.lost-page-breadcrumb a {
  color: rgba(255, 255, 255, 0.48);
  text-decoration: none;
  transition: color 0.15s ease;
}

.lost-page-breadcrumb a:hover {
  color: rgba(255, 255, 255, 0.88);
}

.lost-page-breadcrumb__sep {
  color: rgba(255, 255, 255, 0.28);
}

.lost-page-breadcrumb__current {
  color: rgba(255, 255, 255, 0.72);
}

.lost-page-head h1.lost-page-head__title,
.main-content .lost-page-head h1.lost-page-head__title,
.lost-page-head__title {
  margin: 0;
  font-family: var(--lost-font-family) !important;
  font-size: clamp(32px, 4.2vw, 44px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.1;
  color: #fff;
  text-transform: none;
  text-wrap: balance;
}

.lost-page-head__subtitle {
  max-width: 46rem;
  margin: 12px 0 0;
  font-family: var(--lost-font-family);
  font-size: clamp(16px, 1.4vw, 18px);
  font-weight: 400;
  letter-spacing: -0.01em;
  line-height: 1.55;
  color: rgba(236, 230, 246, 0.78);
}
.lost-page-head + .lost-quests-filter {
  margin-top: 0;
}

.lost-page-head + .container.lost-actions,
.lost-page-head + .container.lost-meropriyatiya {
  margin-top: 0;
}

/* ============================================================================
   Волна 4a — оформление контента страниц «О нас» и «Контакты».
   ТОЛЬКО цвет/шрифт/отступы/радиусы (значения из tokens.css).
   Раскладку, порядок блоков, данные ИБ, карту и формы НЕ трогаем.
   Правила scoped обёртками .lost-about / .lost-contacts, чтобы не влиять
   на другие внутренние страницы с теми же классами.
   ============================================================================ */

/* ---- «О нас» (/about/): компонент news.list/text_template, ИБ 10, раздел 21 ---- */
.lost-about {
  max-width: var(--lost-container-max);
  margin-inline: auto;
}
.lost-about .text-item {
  margin-bottom: var(--lost-space-12);
}
.lost-about .photo_img {
  border-radius: var(--lost-radius-lg);
}
.lost-about .label {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-h3);
  font-weight: var(--lost-fw-semibold);
  line-height: var(--lost-lh-tight);
  color: var(--lost-text-primary);
}
.lost-about .decription_text {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-body);
  line-height: var(--lost-lh-relaxed);
  color: var(--lost-text-secondary);
}

/* ---- «Контакты» (/contacts/): карта (iframe) + main.include cont.php + соцсети ---- */
/* Карта — только скругление/обрезка углов, src и размеры не трогаем. */
.lost-contacts .cart_frame {
  border-radius: var(--lost-radius-lg);
  overflow: hidden;
}
/* Инфо-блок как карточка редизайна. */
.lost-contacts .obert {
  padding-block: var(--lost-space-8);
}
.lost-contacts .obert .container.cont {
  box-sizing: border-box;
  background: var(--lost-bg-card);
  border-radius: var(--lost-radius-xl);
  padding: clamp(20px, 4vw, 32px);
}
.lost-contacts .description {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-small);
  color: var(--lost-text-muted);
}
.lost-contacts .contact_item_str .description {
  color: var(--lost-text-muted);
}
.lost-contacts .description_value {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-h3);
  color: var(--lost-text-primary);
}
.lost-contacts .description_value a {
  color: var(--lost-text-link);
  transition: color var(--lost-transition);
}
.lost-contacts .description_value a:hover {
  color: var(--lost-text-primary);
}

/* ============================================================================
   Волна 4b — оформление списков «Акции» и «Мероприятия» (только оболочка).
   ТОЛЬКО цвет/шрифт/отступы/скругления (значения из tokens.css).
   Компоненты bitrix:news, ИБ 9/8, порядок, количество, фильтры, AJAX-панель
   .query_of_mer — не трогаем. Селекторы 3-классовые, чтобы перекрыть prod
   style.css без !important.
   ============================================================================ */

/* ---- «Акции» (/actions/): bitrix:news «actions», ИБ 9 (.action-list/.action-item) ---- */
.lost-actions .action-item {
  background-color: var(--lost-bg-card);
  border-radius: var(--lost-radius-lg);
}
.lost-actions .left_column {
  border-radius: var(--lost-radius-md);
}
.lost-actions .action-item .name {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-h3);
  font-weight: var(--lost-fw-semibold);
  line-height: var(--lost-lh-tight);
  color: var(--lost-text-primary);
}
.lost-actions .action-item .preview_text {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-body);
  line-height: var(--lost-lh-body);
  color: var(--lost-text-secondary);
}
.lost-actions .action-item .read_more {
  padding: 12px 24px;
  background-color: var(--lost-accent-purple);
  border-radius: var(--lost-radius-sm);
  color: var(--lost-text-primary);
  font-family: var(--lost-font-family);
  font-weight: var(--lost-fw-semibold);
  transition: background-color var(--lost-transition);
}
.lost-actions .action-item .read_more:hover {
  background-color: var(--lost-accent-purple-hover);
}

/* «Подробнее»: выравнивание по эталону bx_…_120 (VR) — только кнопки 119 и 118, карточки и VR не трогаем */
@media (min-width: 1200px) {
  .lost-actions #bx_3218110189_119 .read_more,
  .lost-actions #bx_3218110189_118 .read_more {
    margin-top: 44px !important;
  }
}
@media (min-width: 663px) and (max-width: 1199px) {
  .lost-actions #bx_3218110189_119 .read_more {
    margin-top: 44px !important;
  }
  .lost-actions #bx_3218110189_118 .read_more {
    margin-top: -281px !important;
  }
}

/* ---- «Мероприятия» (/meropriyatiya/): bitrix:news «meropriatya», ИБ 8 (.news-list/.news-item) ---- */
.lost-meropriyatiya .news-item {
  border-bottom-color: var(--lost-divider);
}
.lost-meropriyatiya .left_column {
  border-radius: var(--lost-radius-md);
}
.lost-meropriyatiya .news-item .name {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-h3);
  font-weight: var(--lost-fw-semibold);
  line-height: var(--lost-lh-tight);
  color: var(--lost-text-primary);
}
.lost-meropriyatiya .news-item .preview_text {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-body);
  line-height: var(--lost-lh-body);
  color: var(--lost-text-secondary);
}
.lost-meropriyatiya .news-item .btn_custom {
  padding: 12px 24px;
  background-color: var(--lost-accent-purple);
  border-radius: var(--lost-radius-sm);
  color: var(--lost-text-primary);
  font-family: var(--lost-font-family);
  font-weight: var(--lost-fw-semibold);
  transition: background-color var(--lost-transition);
}
.lost-meropriyatiya .news-item .btn_custom:hover {
  background-color: var(--lost-accent-purple-hover);
}

/* Боковая панель детали (.query_of_mer) — поверх .lost-header (z-index 100) */
body.lost-inner-page .query_of_mer {
  z-index: calc(var(--lost-z-header) + 10);
}

/* ============================================================================
   Волна 4c — оформление «Подобрать квест» (каталог) и «Квест в подарок».
   ТОЛЬКО цвет/шрифт/отступы/скругления (значения из tokens.css).
   Компоненты bitrix:news/news.list, ИБ 4/10, порядок, количество, фильтры,
   SEF, формы .block_to_zakaz — не трогаем. Селекторы 3-классовые, чтобы
   перекрыть prod-стили без !important.
   ============================================================================ */

/* ---- «Подобрать квест» (/quests/): news.list «output_kvest» (local override),
   карточки .lost-quest-card (базовый вид — в components.css), ИБ 4. Здесь —
   только сетка каталога и точечные доработки под макет 03/04. ---- */

.lost-quests-catalog {
  padding-bottom: var(--lost-space-section);
}

/* Скрытый H1 раздела (SEO): остаётся в DOM, но визуально не мешает. */
.lost-visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  overflow: hidden; white-space: nowrap;
}

/* Сетка каталога: 1 -> 2 -> 3 колонки, gap 24 (как секция категорий на главной). */
.lost-quests-catalog .lost-quest-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--lost-space-6);
  margin-top: var(--lost-space-2);
}
@media (min-width: 768px) {
  .lost-quests-catalog .lost-quest-list { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .lost-quests-catalog .lost-quest-list { grid-template-columns: repeat(3, 1fr); }
}

/* Карточка кликабельна целиком (js_link) — курсор-подсказка и лёгкий hover. */
.lost-quests-catalog .lost-quest-card { cursor: pointer; transition: transform var(--lost-transition), box-shadow var(--lost-transition); }
.lost-quests-catalog .lost-quest-card:hover { transform: translateY(-2px); }
.lost-quests-catalog .lost-quest-card:hover .lost-quest-card__img { transform: scale(1.03); }
.lost-quests-catalog .lost-quest-card__img { transition: transform 0.4s ease; }

/* Инфографика-оверлей (свойство infografisc): проявляется при наведении. */
.lost-quests-catalog .lost-quest-card__features {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--lost-space-4);
  background: linear-gradient(180deg, rgba(14, 9, 17, 0) 30%, rgba(14, 9, 17, 0.55) 100%);
  opacity: 0;
  transition: opacity var(--lost-transition);
  pointer-events: none;
}
.lost-quests-catalog .lost-quest-card:hover .lost-quest-card__features { opacity: 1; }
.lost-quests-catalog .lost-quest-card__features img { max-width: 100%; max-height: 100%; object-fit: contain; }

/* CTA «Забронировать»: авто-ширина слева, прижата к низу карточки. */
.lost-quests-catalog .lost-quest-card__cta { align-self: flex-start; margin-top: auto; }

/* Пагинация каталога (если появляется) — в палитре редизайна, URL/логику не трогаем. */
.lost-quests-catalog .bx-pagination,
.lost-quests-catalog .modern-page-navigation { margin-top: var(--lost-space-8); text-align: center; }
.lost-quests-catalog .modern-page-navigation a,
.lost-quests-catalog .modern-page-navigation .modern-page-current,
.lost-quests-catalog .bx-pagination .bx-pagination-container li span {
  font-family: var(--lost-font-family);
  color: var(--lost-text-primary);
}
.lost-quests-catalog .modern-page-navigation .modern-page-current,
.lost-quests-catalog .bx-pagination .bx-pagination-container li.bx-active span {
  background: var(--lost-accent-purple);
  border-color: var(--lost-accent-purple);
}

/* ---- «Квест в подарок» (/quest_v_podarok/): news.list «text_template», ИБ 10 ---- */
.lost-gift .text-item .label {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-h3);
  font-weight: var(--lost-fw-semibold);
  line-height: var(--lost-lh-tight);
  color: var(--lost-text-primary);
}
.lost-gift .text-item .decription_text {
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-body);
  line-height: var(--lost-lh-relaxed);
  color: var(--lost-text-secondary);
}
.lost-gift .photo_img {
  border-radius: var(--lost-radius-lg);
}
.lost-gift .btn_row {
  padding: 12px 24px;
  background-color: var(--lost-accent-purple);
  border-radius: var(--lost-radius-sm);
  color: var(--lost-text-primary);
  font-family: var(--lost-font-family);
  font-weight: var(--lost-fw-semibold);
  transition: background-color var(--lost-transition);
}
.lost-gift .btn_row:hover {
  background-color: var(--lost-accent-purple-hover);
}

/* ==========================================================================
   Волна 4d — панель «Подобрать квест»: чипы категорий + клиентский поиск
   ========================================================================== */
.lost-quests-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--lost-space-4);
  margin: var(--lost-space-6) auto var(--lost-space-8);
}
.lost-quests-filter__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lost-space-2);
  min-width: 0;
}
.lost-quests-filter__search-wrap {
  flex: 0 1 320px;
  max-width: 100%;
}
.lost-quests-filter__search {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 18px;
  background-color: var(--lost-bg-input);
  border: 1px solid var(--lost-border-subtle);
  border-radius: var(--lost-radius-pill);
  color: var(--lost-text-primary);
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-body);
  line-height: var(--lost-lh-body);
  outline: none;
  transition: border-color var(--lost-transition), background-color var(--lost-transition);
}
.lost-quests-filter__search::placeholder {
  color: var(--lost-text-muted);
}
.lost-quests-filter__search:focus {
  border-color: var(--lost-accent-purple-hover);
  background-color: var(--lost-bg-card-soft);
}
.lost-quests-filter__search::-webkit-search-cancel-button {
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  cursor: pointer;
  border-radius: 50%;
  background:
    linear-gradient(45deg, transparent 45%, #fff 45%, #fff 55%, transparent 55%),
    linear-gradient(-45deg, transparent 45%, #fff 45%, #fff 55%, transparent 55%);
  opacity: 0.9;
}
.lost-quests-filter__empty {
  padding: var(--lost-space-6) 0;
  color: var(--lost-text-secondary);
  font-family: var(--lost-font-family);
  font-size: var(--lost-fs-body);
  text-align: center;
}

@media (max-width: 767px) {
  .lost-quests-filter {
    flex-direction: column;
    align-items: stretch;
    gap: var(--lost-space-3);
  }
  .lost-quests-filter__chips {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: var(--lost-space-2);
  }
  .lost-quests-filter__chips .lost-btn--chip {
    flex: 0 0 auto;
  }
  .lost-quests-filter__search-wrap {
    flex-basis: auto;
  }
}