/* ============ ЛЕНДИНГ-ШАПКА (fixed + glassmorphism) ============ */ /* Обёртка
— фиксируем поверх контента. Селектор усилен (.site header.header-1), чтобы перебить zerro.site.css «.module, .template {position:relative}» — иначе шапка уезжает при скролле. */ .site header.header-1 { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: transparent; transition: background .35s ease, backdrop-filter .35s ease, box-shadow .35s ease, border-color .35s ease; border-bottom: 1px solid transparent; } /* Контентная колонка шапки = ширина контента модулей */ .header-1 > .container { max-width: var(--maxw); margin: 0 auto; padding-left: 20px; padding-right: 20px; } /* При скролле — чёрное стекло (glassmorphism) */ .site header.header-1.is-scrolled { background: rgba(10, 10, 12, .55); -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4); box-shadow: 0 8px 30px rgba(0, 0, 0, .35); border-bottom-color: rgba(255, 255, 255, .08); } /* Внутренние страницы (без hero): шапка сразу тёмное стекло, плотнее — контент под ней светлый */ .site header.header-1.is-solid { background: rgba(10, 10, 12, .9); -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4); box-shadow: 0 8px 30px rgba(0, 0, 0, .35); border-bottom-color: rgba(255, 255, 255, .08); } /* --- Бар --- */ .header-1 .lh { position: relative; z-index: 2; display: flex; align-items: center; gap: 34px; min-height: 78px; } .header-1 .lh__logo { flex: 0 0 auto; display: block; } .header-1 .lh__logo img { height: 42px; width: auto; display: block; } .header-1 .lh__nav { display: flex; gap: 30px; } .header-1 .lh__nav a { color: #fff; font-family: var(--font-text); font-weight: 500; white-space: nowrap; opacity: .9; } .header-1 .lh__nav a:hover { color: var(--red); opacity: 1; } .header-1 .lh__actions { display: flex; align-items: center; gap: 14px; margin-left: auto; } .header-1 .lh__phone { display: inline-flex; align-items: center; color: #fff; font-weight: 700; white-space: nowrap; } .header-1 .lh__phone:hover { color: var(--red); } .header-1 .lh__phone-ic { display: none; } .header-1 .lh__reg { flex: 0 0 auto; padding: 12px 20px; font-size: 15px; white-space: nowrap; } /* «Забронировать» (форма) — обводка, чтобы отличать от билетной кнопки */ .header-1 .lh__reg--book { background: transparent; border: 1px solid rgba(255,255,255,.5); } .header-1 .lh__reg--book:hover { background: var(--red); border-color: var(--red); } /* --- Гамбургер (моб.) --- */ .header-1 .lh__burger { display: none; width: 44px; height: 44px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; background: none; border: none; cursor: pointer; padding: 0; } .header-1 .lh__burger span { display: block; width: 24px; height: 2px; background: #fff; border-radius: 2px; transition: transform .3s ease, opacity .3s ease; } body.lh-open .header-1 .lh__burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); } body.lh-open .header-1 .lh__burger span:nth-child(2) { opacity: 0; } body.lh-open .header-1 .lh__burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } /* --- Мобильное меню (полноэкранное стекло) --- */ /* ВАЖНО: дравер выносится JS-ом в , поэтому селекторы БЕЗ префикса .header-1. Причина: при скролле шапка получает backdrop-filter и становится containing-block для position:fixed потомков — внутри неё меню схлопывалось. */ .lh-drawer { display: none; position: fixed; inset: 0; z-index: 999; background: rgba(10, 10, 12, .92); -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); flex-direction: column; align-items: center; justify-content: center; gap: 24px; opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility .35s ease; } body.lh-open .lh-drawer { opacity: 1; visibility: visible; } /* Блокируем прокрутку страницы под открытым меню */ body.lh-open { overflow: hidden; } .lh-drawer__nav { display: flex; flex-direction: column; align-items: center; gap: 22px; } .lh-drawer__nav a { color: #fff; font-family: var(--font-display); font-weight: 800; text-transform: uppercase; letter-spacing: .02em; font-size: 24px; } .lh-drawer__nav a:hover { color: var(--red); } .lh-drawer__reg { margin-top: 10px; } .lh-drawer__reg--book { background: transparent; border: 1px solid rgba(255,255,255,.5); } .lh-drawer__reg--book:hover { background: var(--red); border-color: var(--red); } .site .lh-drawer__phone { color: #fff; font-weight: 700; font-size: 18px; } .site .lh-drawer__phone:hover { color: var(--red); } .lh-drawer__org { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 22px; } .lh-drawer__org img { height: 88px; width: auto; display: block; } .lh-drawer__org span { color: rgba(255,255,255,.6); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; } /* ===== Билетный попап (fullscreen iframe) ===== */ .tickets-modal .modal-content { background: #fff; border: 0; border-radius: 0; height: 100%; position: relative; } .tickets-modal .modal-body { padding: 0; height: 100%; overflow: hidden; } .tickets-modal iframe { width: 100%; height: 100%; border: 0; display: block; } /* Явный крестик — белый на тёмном круге, поверх iframe */ .tickets-modal .tickets-close { position: absolute; top: 14px; right: 14px; z-index: 10; width: 46px; height: 46px; border-radius: 50%; background: rgba(15, 15, 15, .8); color: #fff; border: 1px solid rgba(255, 255, 255, .25); font-size: 30px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s ease; padding: 0; } .tickets-modal .tickets-close:hover { background: var(--red); border-color: var(--red); } @media (max-width: 575px) { .tickets-modal .tickets-close { width: 40px; height: 40px; font-size: 26px; top: 10px; right: 10px; } } /* ============ Мобилка ============ */ @media (max-width: 991px) { .header-1 > .container { padding-left: 16px; padding-right: 16px; } .header-1 .lh { min-height: 62px; gap: 14px; } .header-1 .lh__logo img { height: 34px; } .header-1 .lh__nav { display: none; } .header-1 .lh__reg { display: none; } .header-1 .lh__phone-txt { display: none; } .header-1 .lh__phone { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); justify-content: center; } .header-1 .lh__phone-ic { display: block; font-size: 17px; color: #fff; line-height: 1; } .header-1 .lh__phone:hover .lh__phone-ic { color: var(--red); } .header-1 .lh__actions { gap: 12px; } .header-1 .lh__burger { display: inline-flex; } .lh-drawer { display: flex; } } [data-color="#000000FF"] {color:#000000FF} /* Левое навигационное меню (системное) — как на /business-details */ .oferta .left-menu ul {position: sticky; top:0; border:1px solid #ddd; padding: 1rem 0; margin: 0;} .oferta .left-menu ul li {padding: 0; margin: 0; display: block; text-overflow: ellipsis; overflow: hidden;} .oferta .left-menu ul li a {padding: .5rem; display: block; text-overflow: ellipsis; overflow: hidden;} /* Типографика юридического текста */ .oferta .legal { color: #222; line-height: 1.6; max-width: 900px; } .oferta .legal .legal__title { font-size: clamp(26px, 4vw, 38px); line-height: 1.15; margin: 0 0 20px; } .oferta .legal h2 { font-size: clamp(19px, 2.4vw, 23px); margin: 34px 0 12px; color: #111; } .oferta .legal h3 { font-size: 17px; margin: 22px 0 8px; color: #111; } .oferta .legal p { margin: 0 0 12px; } .oferta .legal ul, .oferta .legal ol { margin: 0 0 14px; padding-left: 22px; } .oferta .legal li { margin-bottom: 7px; } .oferta .legal a { color: var(--red); } .oferta .legal a:hover { text-decoration: underline; } /* Блок реквизитов */ .oferta .legal .legal__req { margin-top: 14px; border: 1px solid #eee; border-radius: 8px; padding: 18px 20px; background: #fafafa; } .oferta .legal .legal__req dl { display: grid; grid-template-columns: minmax(160px, 240px) 1fr; gap: 4px 18px; margin: 0; } .oferta .legal .legal__req dt { color: #777; } .oferta .legal .legal__req dd { margin: 0; color: #111; } @media (max-width: 767px) { .oferta .left-menu ul { position: static; margin-bottom: 24px; } .oferta .legal .legal__req dl { grid-template-columns: 1fr; gap: 0; } .oferta .legal .legal__req dt { margin-top: 8px; } } .module.oferta {padding:100px 0;} /* ============ ФИНАЛЬНЫЙ CTA + ПОДВАЛ (template footer-1) ============ */ .footer-1 { padding: 0; } /* --- CTA (светлый) --- */ .footer-1 .ftr__cta { background: #fff; color: #111; padding: 70px 0; } .footer-1 .ftr__cta-grid { display: flex; align-items: center; gap: 60px; } .footer-1 .ftr__cta-photo { flex: 0 0 40%; display: flex; flex-direction: column; gap: 16px; } /* Чёрный квадрат с логотипом организатора над фото Владимира */ .footer-1 .ftr__cta-brandbox { background: #000; border-radius: 6px; height: 315px; display: flex; align-items: center; justify-content: center; padding: 6%; } .footer-1 .ftr__cta-brandbox img { width: auto; height: auto; max-width: 80%; max-height: 80%; object-fit: contain; } .footer-1 .ftr__cta-portrait { width: 100%; border-radius: 6px; object-fit: cover; } .footer-1 .ftr__cta-body { flex: 1 1 auto; text-align: right; } .footer-1 .ftr__cta-title { font-size: 48px; color: #111; margin-bottom: 14px; } .footer-1 .ftr__cta-title span { display: block; } .footer-1 .ftr__cta-seats { display: flex; justify-content: flex-end; margin-bottom: 24px; } .footer-1 .ftr__cta-seats .cc-seats { color: #111; } .footer-1 .ftr__cta-text { color: #555; margin-bottom: 26px; } /* Мета: дата / место / организатор */ .footer-1 .ftr__cta-meta { border-top: 1px solid rgba(0,0,0,.1); padding-top: 22px; margin-bottom: 28px; } .footer-1 .ftr__cta-date { font-family: var(--font-display); font-size: 30px; font-weight: 700; color: var(--red); margin-bottom: 6px; } .footer-1 .ftr__cta-address { font-weight: 700; color: #111; margin-bottom: 10px; } .footer-1 .ftr__cta-org { color: #555; } .footer-1 .ftr__cta-org b { color: #111; font-weight: 700; } .footer-1 .ftr__cta-org a { color: var(--red); white-space: nowrap; } .footer-1 .ftr__cta-org a:hover { color: var(--red-hover); } /* --- Галерея зала --- */ .footer-1 .ftr__hall { background: #fff; padding: 0 0 70px; } .footer-1 .ftr__hall-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; } .footer-1 .ftr__hall-item { border-radius: 12px; overflow: hidden; aspect-ratio: 3 / 2; } .footer-1 .ftr__hall-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; } .footer-1 .ftr__hall-item:hover img { transform: scale(1.05); } /* --- Подвал (тёмный) --- */ .footer-1 .ftr__bottom { background: #0d0d0d; color: #fff; padding: 70px 0 40px; } .footer-1 .ftr__id { display: flex; align-items: flex-start; gap: 28px; margin-bottom: 32px; } /* Логотип уменьшен, чтобы поместились реквизиты */ .footer-1 .ftr__org-logo { flex: 0 0 auto; height: 150px; width: auto; order: 2; margin-left: auto; } .footer-1 .ftr__id-text { min-width: 0; } .footer-1 .ftr__id-text .ftr__brand { margin-bottom: 12px; } .footer-1 .ftr__id-text .ftr__tagline { margin-bottom: 0; max-width: 720px; } .footer-1 .ftr__brand { font-size: 40px; color: var(--red); margin-bottom: 16px; } .footer-1 .ftr__tagline { max-width: 780px; color: var(--muted); margin-bottom: 20px; } /* Реквизиты организатора — мелким шрифтом */ .footer-1 .ftr__req { font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.5); max-width: 720px; } .footer-1 .ftr__req-head { font-size: 14px; color: rgba(255,255,255,.85); margin-bottom: 4px; } .footer-1 .ftr__req-head b { color: #fff; font-weight: 700; } .footer-1 .ftr__req-row { margin-top: 2px; } .footer-1 .ftr__req a { color: rgba(255,255,255,.65); } .footer-1 .ftr__req a:hover { color: var(--red); } /* Правовые ссылки — рендерится системное меню (