/* Каркасные стили. Это не дизайн — это скелет, чтобы сборка проходила
   и страницу можно было смотреть. Дизайн делаем отдельно. */
:root{
  --red:#D6191D; --black:#111; --green:#3C5A28;
  --muted:#6b6b6b; --border:#d8d8d8; --bg:#fff;
  --max:1100px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--black);
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--red)}
.wrap{max-width:var(--max); margin:0 auto; padding:0 16px}
.hero{padding-top:32px; padding-bottom:32px}
.hero h1{font-size:clamp(28px,6vw,48px); line-height:1.1; margin:0 0 12px}
.lead{font-size:18px; color:var(--muted); margin:0 0 24px}
.cols{display:grid; gap:32px}
@media(min-width:860px){ .cols{grid-template-columns:1fr 420px; align-items:start} }
section{padding:32px 0; border-top:1px solid var(--border)}
h2{font-size:clamp(22px,4vw,32px); margin:0 0 16px}
.cards{display:grid; gap:16px}
@media(min-width:640px){ .cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))} }
.card{border:1.5px solid var(--border); border-radius:12px; padding:18px}
.card h3{margin:0 0 6px; font-size:18px}
.card .p{color:var(--red); font-weight:700; font-size:20px}
.card ul{margin:10px 0 0; padding-left:18px; color:var(--muted); font-size:14px}
.facts{display:flex; flex-wrap:wrap; gap:8px 24px; color:var(--muted); font-size:15px; margin:0; padding:0; list-style:none}
/* Шапка: логотип, меню по разделам, телефон. Липкая — меню всегда под рукой */
.site-header{position:sticky; top:0; z-index:1000; background:#fff; border-bottom:1px solid var(--border)}
.hdr{display:flex; align-items:center; gap:16px; height:60px}
.logo{display:block; flex:0 0 auto; line-height:0}
.logo img{height:40px; width:auto}
.menu-inline{display:none; gap:20px; margin-left:8px; flex:1 1 auto}
.menu-inline a, .menu-drop nav a{color:var(--black); text-decoration:none; font-size:15px; white-space:nowrap}
.menu-inline a:hover{color:var(--red)}
.hdr-tel{margin-left:auto; color:var(--black); font-weight:700; font-size:16px; text-decoration:none; white-space:nowrap}
.menu-drop{position:static}
.menu-drop summary{list-style:none; cursor:pointer; width:44px; height:44px; display:grid; place-items:center; margin-right:-10px}
.menu-drop summary::-webkit-details-marker{display:none}
.menu-drop summary span, .menu-drop summary span::before, .menu-drop summary span::after{
  display:block; width:22px; height:2px; background:var(--black); position:relative; content:""}
.menu-drop summary span::before{position:absolute; top:-7px}
.menu-drop summary span::after{position:absolute; top:7px}
.menu-drop[open] summary span{background:transparent}
.menu-drop[open] summary span::before{top:0; transform:rotate(45deg)}
.menu-drop[open] summary span::after{top:0; transform:rotate(-45deg)}
.menu-drop nav{position:absolute; left:0; right:0; top:60px; background:#fff; border-bottom:1px solid var(--border);
  box-shadow:0 8px 16px rgba(0,0,0,.08); display:grid; padding:8px 16px 12px}
.menu-drop nav a{padding:12px 0; border-top:1px solid #f0f0f0; font-size:17px}
.menu-drop nav a:first-child{border-top:0}
/* семь пунктов и телефон в строку влезают с 1024 px, ниже — бургер */
@media(min-width:1024px){
  .menu-inline{display:flex}
  .menu-drop{display:none}
}
@media(max-width:380px){ .hdr-tel{font-size:14px} .hdr{gap:10px} }
/* якоря не прячутся под липкой шапкой */
[id]{scroll-margin-top:72px}

/* Карта */
.map-box{position:relative; display:block; border-radius:12px; overflow:hidden; background:#eef0f2; max-width:650px}
.map-box img{width:100%; height:auto; display:block}
.map-cta{position:absolute; left:12px; bottom:12px; background:var(--red); color:#fff; font-weight:700;
  padding:10px 16px; border-radius:10px; box-shadow:0 4px 12px rgba(0,0,0,.25)}

/* Крупный телефон в первом экране */
.tel-big{display:inline-block; font-size:clamp(24px,5vw,32px); font-weight:700; color:var(--black); text-decoration:none; margin:0 0 4px}
.tel-note{color:var(--muted); font-size:15px; margin:0 0 24px}

/* Фото первого экрана — во всю ширину колонки, обрезка по высоте */
.hero-img img{width:100%; height:clamp(170px,46vw,440px); object-fit:cover; border-radius:12px; margin:0 0 24px}

/* Проза */
.prose p{max-width:720px; font-size:18px; margin:0 0 16px}

/* Лестница: строка на программу, цена справа */
.ladder{display:grid; gap:12px}
.tier{border:1.5px solid var(--border); border-radius:12px; padding:18px; display:grid; gap:6px 16px}
@media(min-width:640px){ .tier{grid-template-columns:1fr auto; align-items:baseline} }
.tier h3{margin:0; font-size:20px}
.tier .p{color:var(--red); font-weight:700; font-size:22px; white-space:nowrap}
.tier .meta{color:var(--muted); font-size:15px}
.tier .note{grid-column:1/-1; font-size:15px; margin:4px 0 0}
.unit{display:inline-block; padding:1px 8px; border-radius:6px; background:#efefef; font-size:13px; font-weight:600; color:var(--black); vertical-align:2px}
.unit-tour{background:var(--black); color:#fff}

/* Калькулятор цены на человека */
.calc{display:grid; gap:12px; max-width:720px; border:1.5px solid var(--border); border-radius:14px; padding:18px}
.calc-row{display:grid; gap:6px}
@media(min-width:640px){ .calc-row{grid-template-columns:220px 1fr; align-items:center} }
.calc-row > span:first-child{font-weight:600}
.calc-row small{display:block; font-weight:400; color:var(--muted); font-size:13px}
.calc select, .calc input[type=number]{font:inherit; font-size:16px; padding:10px 12px; border:1.5px solid var(--border); border-radius:10px; background:#fff; width:100%}
.calc-people{display:flex; gap:8px; align-items:center}
.calc-people input{width:80px; text-align:center}
.calc-people button{width:44px; height:44px; border:1.5px solid var(--border); border-radius:10px; background:#fff; font-size:22px; cursor:pointer}
.calc-check{display:flex; gap:10px; align-items:center; font-size:16px}
.calc-check input{width:20px; height:20px; flex:0 0 auto}
.calc-row > label:first-child{font-weight:600}
.calc-row small a{color:var(--red)}
.calc-desc{font-size:14px; color:var(--muted); margin:8px 0 0; line-height:1.45}
.calc-desc a{color:var(--red); white-space:nowrap}
.calc-sub{margin-top:10px; font-size:15px; align-items:flex-start}
.calc-sub input{flex:0 0 auto; margin-top:2px}
.calc-sub input:disabled + span{color:var(--muted); opacity:.6}
.tier-desc{color:var(--black)}
.calc-out{border-top:1px solid var(--border); padding-top:14px; display:grid; gap:6px}
.calc-out > div{display:flex; justify-content:space-between; align-items:baseline; gap:12px}
.calc-out b{font-size:24px; color:var(--red)}
.calc-lines{font-size:14px; color:var(--muted); margin:0}
.calc-note{font-size:13px; color:var(--muted); margin:0 0 6px}

/* Кнопка «Забронировать» в карточке тура */
.tier-actions{grid-column:1/-1; margin-top:8px}
.book-btn{background:var(--red); color:#fff; border:0; border-radius:10px; padding:14px 26px;
  font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; width:100%}
@media(min-width:640px){ .book-btn{width:auto} }
.book-btn:hover{filter:brightness(.92)}

/* Всплывающая форма бронирования */
.book-dlg{width:calc(100% - 24px); max-width:440px; max-height:calc(100dvh - 24px); overflow:auto;
  border:0; border-radius:16px; padding:24px 20px 20px; box-shadow:0 20px 60px rgba(0,0,0,.3)}
.book-dlg::backdrop{background:rgba(0,0,0,.55)}
html:has(.book-dlg[open]){overflow:hidden}
.book-close{position:absolute; right:8px; top:8px; width:44px; height:44px; border:0; background:none;
  font-size:30px; line-height:1; color:var(--muted); cursor:pointer}
.book-title{font-size:24px; margin:0 40px 4px 0}
.book-price{color:var(--red); font-weight:700; font-size:20px; margin:0 0 4px}
.book-note{font-size:14px; font-weight:600; margin:0 0 4px}
.book-lead{color:var(--muted); font-size:15px; margin:8px 0 16px}

/* Разворот в карточке тура */
.tier-more{grid-column:1/-1; border:0; padding:0; margin-top:6px}
.tier-more:last-of-type{border:0}
.tier-more summary{font-size:16px; color:var(--red); list-style:none; padding:6px 0}
.tier-more summary::-webkit-details-marker{display:none}
.tier-more summary::after{content:" ▾"}
.tier-more[open] summary::after{content:" ▴"}
.comp{columns:2 220px; column-gap:24px; margin:8px 0 12px; padding-left:18px}
.comp li{break-inside:avoid; margin-bottom:4px}
.tier-photos{display:grid; grid-template-columns:1fr 1fr; gap:10px}
@media(min-width:640px){ .tier-photos{grid-template-columns:repeat(4,1fr)} }
.tier-photos figcaption{font-size:13px; margin-top:4px}
.tier-photos img, .gallery img{width:100%; aspect-ratio:3/2; height:auto; object-fit:cover}
.gallery{display:grid; grid-template-columns:1fr 1fr; gap:10px}
@media(min-width:640px){ .gallery{grid-template-columns:repeat(3,1fr); gap:14px} }

/* Видео: обложка с кнопкой, плеер Kinescope — по нажатию */
.video{margin:24px 0 0}
.video-box{position:relative; width:100%; border-radius:12px; overflow:hidden; background:#111}
.video-box iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.video-play{position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; background:none; cursor:pointer}
.video-play img{width:100%; height:100%; object-fit:cover; display:block}
.video-icon{position:absolute; left:50%; top:50%; width:72px; height:72px; margin:-36px 0 0 -36px;
  border-radius:50%; background:rgba(214,25,29,.92); box-shadow:0 4px 16px rgba(0,0,0,.3)}
.video-icon::after{content:""; position:absolute; left:29px; top:22px;
  border-style:solid; border-width:14px 0 14px 22px; border-color:transparent transparent transparent #fff}
.video-play:hover .video-icon{background:var(--red)}
.video-dur{position:absolute; right:10px; bottom:10px; background:rgba(0,0,0,.65); color:#fff;
  font-size:13px; padding:2px 8px; border-radius:6px}
.video-narrow{max-width:420px}

/* Состав программ — раскрывается без JS */
details{border-top:1px solid var(--border); padding:12px 0}
details:last-of-type{border-bottom:1px solid var(--border)}
summary{cursor:pointer; font-weight:600; font-size:17px}
details ul{margin:10px 0 4px; padding-left:20px}

figure{margin:0}
.card img, figure img{border-radius:10px}
figcaption{color:var(--muted); font-size:14px; margin-top:6px}
.two{display:grid; gap:16px}
@media(min-width:640px){ .two{grid-template-columns:1fr 1fr} }

.info{display:grid; gap:12px; margin:0}
.info dt{font-weight:600}
.info dd{margin:0 0 4px; color:var(--muted)}

/* Плашка cookie — поверх всего, у нижнего края */
.cookie-notice{position:fixed; left:12px; right:12px; bottom:12px; z-index:2147483000;
  max-width:720px; margin:0 auto; background:#fff; color:var(--black);
  border:1px solid var(--border); border-radius:12px; box-shadow:0 6px 24px rgba(0,0,0,.15);
  padding:14px 16px; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; font-size:14px; line-height:1.45}
.cookie-notice[hidden]{display:none}
.cookie-notice p{margin:0; flex:1 1 300px}
.cookie-notice a{color:var(--muted)}
.cookie-btn{flex:0 0 auto; background:var(--black); color:#fff; border:0; border-radius:8px;
  padding:10px 20px; font-family:inherit; font-size:15px; font-weight:600; line-height:1; cursor:pointer}

footer{border-top:1px solid var(--border); padding:24px 0 40px; color:var(--muted); font-size:13px}
footer a{color:var(--muted)}
.legal{margin-top:8px}
.links{display:flex; flex-wrap:wrap; gap:4px 20px}
.pay{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:16px}
.pay span{margin-right:4px}

/* Правила цифрой: крупно число или короткое правило, под ним пояснение.
   Для блоков «оплата», «расписание», «перенос» — сегмент считает, а не верит обещаниям */
.rules{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 20px; padding:0; list-style:none}
@media(min-width:640px){ .rules{grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px} }
.rules li{border:1.5px solid var(--border); border-radius:12px; padding:12px 14px}
.rules b{display:block; font-size:18px; line-height:1.2; color:var(--red); margin-bottom:4px}
.rules span{display:block; font-size:14px; line-height:1.4}
@media(min-width:640px){ .rules li{padding:16px 18px} .rules b{font-size:22px; margin-bottom:6px} .rules span{font-size:15px} }
/* нечётная последняя плитка на телефоне — во всю ширину, без дыры справа */
@media(max-width:639px){ .rules li:last-child:nth-child(odd){grid-column:1/-1} }

/* Карточки цен в две колонки и на телефоне — когда их много и они короткие */
@media(max-width:639px){ .cards-tight{grid-template-columns:1fr 1fr; gap:10px} .cards-tight .card{padding:12px 14px} .cards-tight .card h3{font-size:15px} }

/* Пометка у программы: групповой тур или только ваша компания */
.tag{display:inline-block; vertical-align:3px; margin-left:6px; padding:2px 8px; border-radius:6px;
  background:#efefef; color:var(--black); font-size:13px; font-weight:600; white-space:nowrap}
.tag-own{background:var(--green); color:#fff}

.durations{margin:8px 0 16px}
.durations dd{color:var(--black)}
.calc-banya{flex-wrap:wrap; justify-content:space-between}
.calc-hours{display:flex; align-items:center; gap:8px}
.calc .calc-hours input{width:72px; text-align:center; padding:6px 8px}
.calc-hours input:disabled{opacity:.5}
.calc-out .calc-prepay b{font-size:18px; color:var(--black)}

.card-unit{margin:6px 0 0; color:var(--muted); font-size:15px}

/* ==========================================================================
   Дизайн d2 — включается фронтматтером design: d2 (класс на <body>).
   Тёмно-оливковый, песочный и белый фон по очереди, красный — действие и цена.
   Скошенные углы у кнопок и плашек — армейский мотив без картинок и шрифтов.
   ========================================================================== */
.d2{
  --ink:#151a10; --ink-2:#1e2618; --olive:#3C5A28; --sand:#f3efe6; --sand-2:#e6dfcf;
  --red:#D6191D; --red-hi:#ff4448; --muted:#62655c; --on-dark:rgba(255,255,255,.74);
  --cut:10px; counter-reset:sec;
}
.d2 .wrap{max-width:1160px}
.d2 section{padding:56px 0; border-top:0}
@media(min-width:860px){ .d2 section{padding:88px 0} }
.d2 section.alt, .d2 #map{background:var(--sand)}
.d2 section.dark{background:var(--ink); color:#fff}
.d2 section.dark .note, .d2 section.dark .sec-lead{color:var(--on-dark)}
.d2 h1, .d2 h2, .d2 h3{letter-spacing:-.02em}
.d2 h2{font-size:clamp(28px,5.2vw,46px); line-height:1.04; font-weight:800; margin:10px 0 0}
.d2 .sec-head{max-width:780px; margin-bottom:32px}
.d2 .sec-lead{font-size:17px; line-height:1.5; color:var(--muted); margin:14px 0 0}
@media(min-width:860px){ .d2 .sec-lead{font-size:19px} }
.d2 .sec-foot{margin-top:18px; max-width:780px}
.d2 .sub-h{font-size:20px; margin:40px 0 14px}
.d2 .note{font-size:15px}

/* Метка секции: номер по порядку, черта, название — как пункт боевого приказа */
.d2 .kicker{display:flex; align-items:center; gap:10px; margin:0; font-size:12px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--red)}
.d2 .kicker::before{counter-increment:sec; content:counter(sec, decimal-leading-zero);
  color:var(--ink); background:var(--sand-2); padding:3px 7px; letter-spacing:.06em;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.d2 .kicker::after{content:""; height:2px; width:36px; background:currentColor; opacity:.5}
.d2 .dark .kicker{color:var(--red-hi)}
.d2 .dark .kicker::before{background:var(--red); color:#fff}
.d2 .kicker-hero{counter-increment:none; color:#fff}
.d2 .kicker-hero::before{content:none}
.d2 .kicker-hero::after{order:-1; width:28px; background:var(--red); opacity:1; height:3px}

/* Кнопки: скошенные углы, фокус виден внутри среза */
.d2 .book-btn{border-radius:0; clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));
  padding:15px 28px; letter-spacing:.01em}
.d2 .book-btn:focus-visible{outline:3px solid #fff; outline-offset:-6px}
.d2 .book-btn::after{content:" →"}
.d2 .af-btn{border-radius:0; clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}

/* ---------- Первый экран ---------- */
.d2 .hero2{position:relative; background:var(--ink); color:#fff; overflow:hidden}
.d2 .hero2-media, .d2 .hero2-media picture, .d2 .hero2-media img{position:absolute; inset:0; width:100%; height:100%}
.d2 .hero2-media img{object-fit:cover; object-position:50% 35%; border-radius:0; margin:0}
.d2 .hero2::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,rgba(21,26,16,.05) 0%,rgba(21,26,16,.35) 26%,rgba(21,26,16,.9) 48%,var(--ink) 64%)}
.d2 .hero2-grid{position:relative; z-index:1; display:grid; gap:28px; padding-top:min(58vw,360px); padding-bottom:40px}
.d2 .hero2 h1{font-size:clamp(34px,8.4vw,64px); line-height:1; font-weight:800; text-transform:uppercase; margin:12px 0 18px}
.d2 .hero2-price{display:flex; align-items:center; gap:14px; margin:0 0 14px}
.d2 .hero2-price b{font-size:clamp(28px,6vw,40px); font-weight:800; color:#fff; background:var(--red); padding:4px 14px; white-space:nowrap;
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
.d2 .hero2-price span{font-size:15px; line-height:1.35; color:var(--on-dark)}
.d2 .hero2-lead{font-size:18px; line-height:1.45; color:#fff; margin:0 0 22px; max-width:560px}
.d2 .hero2-facts{list-style:none; margin:0 0 22px; padding:0; display:grid; grid-template-columns:repeat(3,auto); justify-content:start; gap:10px 24px}
.d2 .hero2-facts li{border-left:3px solid var(--red); padding-left:10px}
.d2 .hero2-facts b{display:block; font-size:18px; line-height:1.2; white-space:nowrap}
.d2 .hero2-facts span{font-size:13px; color:var(--on-dark)}
.d2 .hero2 .tel-big{color:#fff}
@media(max-width:420px){ .d2 .hero2-facts{grid-template-columns:1fr 1fr} .d2 .hero2-facts li:last-child{grid-column:1/-1} }
@media(min-width:900px){
  .d2 .hero2::after{background:linear-gradient(90deg,rgba(21,26,16,.94) 0%,rgba(21,26,16,.78) 40%,rgba(21,26,16,.2) 75%,rgba(21,26,16,.35) 100%)}
  .d2 .hero2-grid{grid-template-columns:minmax(0,1fr) 400px; align-items:center; padding-top:88px; padding-bottom:88px; min-height:640px}
}
.d2 .form-card{background:#fff; color:var(--ink); padding:22px 20px 18px; box-shadow:0 24px 60px rgba(0,0,0,.35);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.d2 .form-card-title{font-size:20px; font-weight:800; line-height:1.2; margin:0 0 16px; letter-spacing:-.01em}

/* ---------- Калькулятор: ввод слева, итог справа и липкий ---------- */
.d2 .calc{max-width:none; border:0; padding:0; gap:20px}
.d2 .calc-in{display:grid; gap:14px; background:#fff; padding:20px; box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.08)}
.d2 .calc-out{background:var(--ink); color:#fff; border:0; padding:22px 20px; gap:10px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}
.d2 .calc-out b{color:#fff; font-size:22px}
.d2 .calc-out .calc-each b{font-size:40px; color:var(--red-hi); line-height:1}
.d2 .calc-out .calc-prepay b{color:#fff; font-size:18px}
.d2 .calc-out > div{border-bottom:1px solid rgba(255,255,255,.12); padding-bottom:10px}
.d2 .calc-lines{color:var(--on-dark)}
.d2 .calc-note{color:rgba(255,255,255,.55)}
.d2 .calc-out .book-btn{width:100%; margin-top:6px}
@media(min-width:900px){
  .d2 .calc{grid-template-columns:minmax(0,1fr) 360px; align-items:start; gap:28px}
  .d2 .calc-in{padding:28px}
  .d2 .calc-out{position:sticky; top:84px}
}

/* ---------- Карточки программ ---------- */
.d2 .ladder{gap:16px}
@media(min-width:760px){ .d2 #bigfoot .ladder{grid-template-columns:1fr 1fr} }
@media(min-width:960px){ .d2 #tanks .ladder{grid-template-columns:repeat(3,1fr)} }
.d2 .tier{display:flex; flex-direction:column; gap:8px; background:#fff; border:0; border-radius:0; padding:22px;
  box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.08); border-top:4px solid var(--ink)}
.d2 .tier h3{font-size:22px; line-height:1.15}
.d2 .tier .p{font-size:30px; font-weight:800; color:var(--red); line-height:1.1; margin-top:4px}
.d2 .tier-each{margin:0; font-size:15px; background:var(--sand); padding:8px 12px; align-self:flex-start}
.d2 .tier-each b{font-size:17px}
.d2 .tier .note{margin:0}
.d2 .tier-small{color:var(--muted)}
.d2 .tier-actions{margin-top:auto; padding-top:10px}
.d2 .tier-more{border:0; padding:0; margin-top:4px}
.d2 .dark .tier{background:var(--ink-2); color:#fff; box-shadow:none; border-top-color:var(--red)}
.d2 .dark .tier .p{color:var(--red-hi)}
.d2 .dark .tier .meta{color:var(--on-dark)}
.d2 .dark .unit{background:rgba(255,255,255,.12); color:#fff}
.d2 .dark .tag{background:rgba(255,255,255,.14); color:#fff}
.d2 .dark .tier-more summary{color:var(--red-hi)}
.d2 .dark .comp{color:var(--on-dark)}
.d2 .tag{border-radius:0; clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.d2 .unit{border-radius:0}

.d2 .card{background:#fff; border:0; border-radius:0; box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.08); border-left:4px solid var(--sand-2)}
.d2 .alt .card{box-shadow:none}
.d2 .card .p{font-size:24px; font-weight:800}

/* ---------- Фото ---------- */
.d2 .photos{margin-top:28px}
.d2 .gallery img, .d2 .two figure img, .d2 .card img, .d2 figure img{border-radius:0}
.d2 .gallery{gap:8px}
@media(min-width:640px){ .d2 .gallery{gap:12px} }

/* ---------- Правила цифрой ---------- */
.d2 .rules{gap:12px}
.d2 .rules li{background:#fff; border:0; border-radius:0; border-left:4px solid var(--red); padding:14px 16px;
  box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.07)}
.d2 .rules b{color:var(--ink); font-weight:800; font-size:20px; letter-spacing:-.01em}
@media(min-width:640px){ .d2 .rules li{padding:20px 22px} .d2 .rules b{font-size:28px} }
.d2 .alt .rules li{box-shadow:none}
.d2 .dark .rules li{background:rgba(255,255,255,.06); box-shadow:none; color:#fff}
.d2 .dark .rules b{color:#fff}
.d2 .dark .rules span{color:var(--on-dark)}

/* ---------- Расписание: шаги по линии ---------- */
.d2 .steps{list-style:none; margin:0; padding:0; display:grid; gap:0; counter-reset:step}
.d2 .steps li{position:relative; padding:0 0 26px 58px}
.d2 .steps li::before{counter-increment:step; content:counter(step); position:absolute; left:0; top:0; width:40px; height:40px;
  display:grid; place-items:center; background:var(--ink); color:#fff; font-weight:800;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.d2 .steps li::after{content:""; position:absolute; left:19px; top:44px; bottom:4px; width:2px; background:var(--sand-2)}
.d2 .steps li:last-child::after{display:none}
.d2 .steps b{display:block; font-size:24px; font-weight:800; line-height:1.15; letter-spacing:-.01em}
.d2 .steps span{display:block; color:var(--muted); margin-top:2px}
@media(min-width:860px){
  .d2 .steps{grid-template-columns:repeat(3,1fr); gap:24px}
  .d2 .steps li{padding:56px 0 0}
  .d2 .steps li::after{left:48px; right:-24px; top:19px; bottom:auto; width:auto; height:2px}
  .d2 .steps b{font-size:30px}
}
.d2 .durations{display:grid; gap:12px}
@media(min-width:640px){ .d2 .durations{grid-template-columns:1fr 1fr} }
@media(min-width:1000px){ .d2 .durations{grid-template-columns:repeat(4,1fr)} }
.d2 .durations > div{background:#fff; padding:16px 18px}
.d2 .durations h4{margin:0 0 8px; font-size:13px; text-transform:uppercase; letter-spacing:.12em; color:var(--red)}
.d2 .durations ul{list-style:none; margin:0; padding:0}
.d2 .durations li{display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-top:1px dashed var(--sand-2); font-size:15px}
.d2 .durations li:first-child{border-top:0}
.d2 .durations i{font-style:normal; font-weight:700; white-space:nowrap}

/* ---------- Обзоры блогеров: вертикальные ролики ---------- */
@media(min-width:900px){ .d2 .bloggers{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,560px); gap:48px; align-items:center} }
.d2 .reels{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.d2 .reels .video{margin:0}
.d2 .reels .video-box{border-radius:0}
.d2 .dark .reels figcaption{color:var(--on-dark)}

/* ---------- Заявка, карта, отзывы, подвал ---------- */
.d2 #order .cols{align-items:center}
.d2 #order .tel-big{color:#fff; margin-top:20px}
.d2 #order .tel-note{color:var(--on-dark)}
.d2 #reviews{padding:56px 0}
.d2 .map-box{border-radius:0}
.d2 footer{background:#0f130b; color:rgba(255,255,255,.55); border:0}
.d2 footer a{color:rgba(255,255,255,.75)}
.nw{white-space:nowrap}
@media(max-width:639px){ .d2 .gallery > figure:first-child:nth-last-child(3){grid-column:1/-1} }
.d2 #map h2{margin-bottom:0}
.d2 #map .lead{margin-top:14px}
.d2 #map h2::before{content:"Дорога"; display:block; font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--red); margin-bottom:10px}
/* Липкая плашка калькулятора на телефоне */
.calc-bar{position:fixed; left:12px; right:12px; bottom:12px; z-index:900; display:flex; align-items:center; gap:12px;
  background:#151a10; color:#fff; padding:12px 16px; text-decoration:none; box-shadow:0 10px 30px rgba(0,0,0,.35);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.calc-bar[hidden]{display:none}
.calc-bar span{font-size:14px; color:rgba(255,255,255,.74)}
.calc-bar b{font-size:22px; color:#ff4448; margin-right:auto}
.calc-bar i{font-style:normal; font-size:14px; font-weight:700}
.d2 .map-cta{border-radius:0; clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}

/* Переключатель языка в шапке (lang_switch во фронтматтере) */
.lang-switch{display:flex; margin-left:auto; font-size:13px; font-weight:800; letter-spacing:.04em}
.lang-switch a, .lang-switch span{padding:5px 9px; text-decoration:none; color:var(--black); border:1.5px solid var(--border)}
.lang-switch a + span, .lang-switch span + a{border-left:0}
.lang-switch span{background:var(--black); color:#fff; border-color:var(--black)}
.lang-switch + .hdr-tel{margin-left:12px}
@media(max-width:380px){ .lang-switch a, .lang-switch span{padding:4px 6px} }

/* «Как добраться»: дорога без машины, парковка, трансфер */
.route{list-style:none; margin:0 0 20px; padding:0; display:grid; gap:8px; max-width:780px}
.route li{padding-left:14px; border-left:3px solid var(--red)}

/* Сценарии дня (пара) и выбор программы в сертификате */
.d2 .scen{display:grid; gap:16px}
@media(min-width:900px){ .d2 .scen{grid-template-columns:repeat(3,1fr)} }
.d2 .scen .tier{border-top-color:var(--red)}
.d2 .scen-list{list-style:none; margin:4px 0 0; padding:0; font-size:15px}
.d2 .scen-list li{display:flex; justify-content:space-between; gap:12px; padding:6px 0; border-top:1px dashed var(--sand-2)}
.d2 .scen-list li span:last-child{white-space:nowrap; font-weight:700}
.d2 .scen-total{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin:6px 0 0; font-weight:800}
.d2 .scen-total b{font-size:26px; color:var(--red)}
.d2 .hero2-facts.four{grid-template-columns:repeat(4,auto)}
@media(max-width:700px){ .d2 .hero2-facts.four{grid-template-columns:1fr 1fr} .d2 .hero2-facts.four li:last-child{grid-column:auto} }
.d2 .reels.one{grid-template-columns:minmax(0,300px)}
@media(min-width:760px){ .d2 .bf-ladder{grid-template-columns:1fr 1fr} }
@media(min-width:960px){ .d2 .tank-ladder{grid-template-columns:repeat(3,1fr)} }
/* На узком экране в переключателе — только ссылка на другой язык: иначе шапка
   (логотип, язык, телефон, меню) не помещается в 390 px */
@media(max-width:480px){ .lang-switch span{display:none} .lang-switch a{border:1.5px solid var(--border)} .lang-switch + .hdr-tel{margin-left:8px} }
.d2 .dark .tier-each{background:rgba(255,255,255,.1); color:#fff}
.d2 .photo-solo .cards{max-width:780px}
/* Первый экран на телефоне: фото целиком сверху (3:2), текст ниже на тёмном —
   иначе фото растягивается на всю высоту блока и лица уходят под текст */
@media(max-width:899px){
  .d2 .hero2-media{bottom:auto; height:min(72vw, 560px)}
  .d2 .hero2-media picture, .d2 .hero2-media img{height:100%}
  .d2 .hero2::after{background:linear-gradient(180deg, rgba(21,26,16,0) 0, rgba(21,26,16,0) 34vw, rgba(21,26,16,.85) 60vw, var(--ink) 72vw, var(--ink) 100%)}
  .d2 .hero2-grid{padding-top:56vw}
}
.d2 .hero2-media img.pos-top{object-position:50% 15%}
html[lang="en"] .d2 #map h2::before{content:"Getting here"}

/* Обзоры блогеров (seg/bloggers.njk) — вертикальные ролики по два в ряд, на любой странице */
.reels{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; max-width:560px}
.reels .video{margin:0}
.reels figcaption{font-weight:600}

/* Главная (index.njk): карточки страниц и блок активностей */
.d2 .hub{display:grid; gap:16px}
@media(min-width:640px){ .d2 .hub{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(min-width:900px){ .d2 .hub{grid-template-columns:repeat(3,minmax(0,1fr))} }
.d2 .hub-card{display:flex; flex-direction:column; background:#fff; color:inherit; text-decoration:none;
  box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.08); border-bottom:4px solid var(--sand-2); transition:border-color .15s}
.d2 .hub-card:hover, .d2 .hub-card:focus-visible{border-bottom-color:var(--red)}
.d2 .hub-card img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
.d2 .hub-body{display:flex; flex-direction:column; gap:6px; padding:16px 18px 18px; flex:1}
.d2 .hub-body b{font-size:20px; line-height:1.2; letter-spacing:-.01em}
.d2 .hub-body span{color:var(--muted); font-size:15px}
.d2 .hub-body .hub-more{margin-top:auto; padding-top:6px; color:var(--red); font-weight:700}
.d2 .acts{display:grid; gap:16px}
@media(min-width:640px){ .d2 .acts{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(min-width:900px){ .d2 .acts{grid-template-columns:repeat(3,minmax(0,1fr))} }
.d2 .act{background:#fff; padding:20px 22px; border-left:4px solid var(--red); display:flex; flex-direction:column; gap:8px}
.d2 .act h3{font-size:20px; margin:0}
.d2 .act p, .d2 .act ul{margin:0}
.d2 .act-list{padding-left:18px; font-size:15px}
.d2 .act-links{margin-top:auto !important; padding-top:6px; display:flex; flex-wrap:wrap; gap:6px 14px; font-weight:700}
.d2 .act-links a{color:var(--red)}

/* ---------- Квесты (quests.njk, quests-b.njk): тёмная хоррор-тема, design: "d2 hz" ---------- */
.hz section.dark{background:#0c0e0a}
.hz section.dark + section.dark{border-top:1px solid rgba(255,255,255,.06)}
.hz .dark a:not(.book-btn):not(.tel-big){color:var(--red-hi)}
/* быстрый выбор под первым экраном */
.hz .hz-pick{background:#0c0e0a; padding:24px 0 8px}
.hz .hz-pick-grid{display:grid; gap:10px; grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:900px){ .hz .hz-pick-grid{grid-template-columns:repeat(4,minmax(0,1fr))} }
.hz .hz-pick-card{display:flex; flex-direction:column; gap:6px; padding:16px; background:var(--ink-2); color:#fff; text-decoration:none;
  border-top:3px solid var(--red); transition:background .15s}
.hz .hz-pick-card:hover{background:#2a3322}
.hz .hz-pick-card b{font-size:19px; line-height:1.15}
.hz .hz-pick-card > span:not([class]){font-size:14px; color:var(--on-dark); line-height:1.4}
.hz .hz-pick-genre{font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--red-hi)}
.hz .hub-card .hz-pick-genre{color:var(--red)}
.hz .hz-pick-price{margin-top:auto; padding-top:6px; font-weight:800; font-size:17px}
.hz .hz-pick-price i, .hz .hz-card-price i{font-style:normal; font-weight:400; font-size:13px; opacity:.75}
@media(max-width:520px){ .hz .hz-pick-card > span:not([class]){display:none} }
/* раздел квеста */
.hz .hz-chips{list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 0; padding:0}
.hz .hz-chips li{font-size:13px; font-weight:700; padding:5px 10px; background:rgba(255,255,255,.08); border-left:3px solid var(--red)}
.hz .hz-quest-grid{display:grid; gap:28px}
@media(min-width:900px){ .hz .hz-quest-grid{grid-template-columns:340px minmax(0,1fr); align-items:start}
  .hz .hz-quest-grid.no-video{grid-template-columns:minmax(0,780px)} .hz .hz-quest-video{position:sticky; top:90px} }
.hz .hz-quest-video .video{margin:0}
.hz .hz-quest-video .video-box{max-width:340px; margin:0 auto}
.hz .hz-story p{margin:0 0 12px; color:var(--on-dark); font-size:17px; line-height:1.55}
.hz .hz-story .hz-story-lead{color:#fff; font-size:22px; font-weight:800; letter-spacing:-.01em}
.hz .hz-mission{list-style:none; counter-reset:m; margin:0; padding:0; display:grid; gap:10px}
.hz .hz-mission li{counter-increment:m; position:relative; padding:12px 14px 12px 52px; background:rgba(255,255,255,.05)}
.hz .hz-mission li::before{content:counter(m); position:absolute; left:14px; top:12px; width:26px; height:26px; display:grid; place-items:center;
  background:var(--red); color:#fff; font-weight:800; font-size:14px}
.hz .hz-mission b{display:block; font-size:17px}
.hz .hz-mission span{font-size:15px; opacity:.8}
.hz :not(.dark) > .wrap .hz-mission li, .hz section:not(.dark) .hz-mission li{background:#fff}
.hz .hz-awaits{margin:0 0 14px; padding-left:18px; display:grid; gap:8px; font-size:15px}
.hz .hz-price{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin-top:22px; padding:18px 20px;
  background:var(--ink-2); border-left:4px solid var(--red)}
.hz .hz-price > div{display:flex; flex-direction:column; gap:4px}
.hz .hz-price b{font-size:32px; font-weight:800; color:var(--red-hi); line-height:1}
.hz .hz-price span{font-size:14px; color:var(--on-dark)}
.hz .hz-price.light{background:#fff; box-shadow:0 10px 30px rgba(21,26,16,.08)}
.hz .hz-price.light b{color:var(--red)}
.hz .hz-price.light span{color:var(--muted)}
.hz .hz-frames{display:grid; gap:8px; grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:28px}
@media(min-width:700px){ .hz .hz-frames{grid-template-columns:repeat(var(--n,4),minmax(0,1fr)); max-width:calc(var(--n,4) * 260px)} }
.hz .hz-frames figure{margin:0}
.hz .hz-frames img{display:block; width:100%; aspect-ratio:3/4; object-fit:cover; filter:contrast(1.05)}
.hz .hz-frames.small{grid-template-columns:repeat(3,minmax(0,1fr)); max-width:560px; margin-top:16px}
/* лазертаг */
.hz .hz-lt{display:grid; gap:24px}
@media(min-width:900px){ .hz .hz-lt{grid-template-columns:400px minmax(0,1fr); align-items:start} }
.hz .hz-lt-photo{margin:0}
.hz .hz-lt-photo img{display:block; width:100%; height:auto}
.hz .hz-lt .sub-h:first-child{margin-top:0}
.hz .hz-tags{list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0}
.hz .hz-tags li{background:var(--sand); padding:6px 10px; font-size:14px; font-weight:600}
.hz .hz-modes, .hz .hz-more{display:grid; gap:12px}
@media(min-width:640px){ .hz .hz-modes{grid-template-columns:repeat(2,minmax(0,1fr))} .hz .hz-more{grid-template-columns:repeat(3,minmax(0,1fr))} }
.hz .hz-modes > div, .hz .hz-more > div{display:flex; flex-direction:column; gap:4px; background:#fff; padding:14px 16px; border-left:4px solid var(--red);
  box-shadow:0 10px 30px rgba(21,26,16,.06)}
.hz .hz-more > div{border-left-color:var(--sand-2)}
.hz .hz-modes b, .hz .hz-more b{font-size:16px}
.hz .hz-modes span, .hz .hz-more span{font-size:14px; color:var(--muted); line-height:1.45}
/* вариант Б: карточки, таблица, калькулятор, видео, аккордеон */
.hz .hz-card .hub-body{gap:6px}
@media(min-width:640px){ .hz .hub.hz-hub{grid-template-columns:repeat(2,minmax(0,1fr))} }
.hz .hz-acc .hz-awaits{margin-top:16px}
.hz .hz-card-meta{font-size:14px; color:var(--muted)}
.hz .hz-card-price{font-size:22px; font-weight:800; color:var(--red) !important}
.hz .hz-card-actions{display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; margin-top:auto; padding-top:8px}
.hz .hz-card-actions a{color:var(--red); font-weight:700; text-decoration:none}
.hz .hz-table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
.hz .hz-table{border-collapse:collapse; width:100%; min-width:640px; font-size:15px}
.hz .hz-table th, .hz .hz-table td{padding:12px 14px; text-align:left; vertical-align:top; border-bottom:1px solid rgba(255,255,255,.1)}
.hz .hz-table thead th{font-size:18px; color:#fff; border-bottom:3px solid var(--red)}
.hz .hz-table tbody th{color:var(--on-dark); font-weight:600; white-space:nowrap}
.hz .hz-table td{color:#fff}
.hz .hz-row-price b{color:var(--red-hi); font-size:20px; display:block}
.hz .hz-calc{display:grid; gap:20px}
@media(min-width:760px){ .hz .hz-calc{grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start} }
.hz .hz-calc-in{display:grid; gap:8px; background:#fff; padding:20px}
.hz .hz-calc-in label{font-weight:700; margin-top:6px}
.hz .hz-calc-in select, .hz .hz-calc-in input{font:inherit; font-size:17px; padding:10px 12px; border:1px solid var(--border); width:100%; background:#fff}
.hz .hz-calc-out{background:var(--ink); color:#fff; padding:20px; display:grid; gap:6px}
.hz .hz-calc-out p{margin:0}
.hz .hz-calc-total, .hz .hz-calc-pp{display:flex; justify-content:space-between; align-items:baseline; gap:12px}
.hz .hz-calc-total b{font-size:34px; color:var(--red-hi)}
.hz .hz-calc-pp b{font-size:20px}
.hz .hz-calc-out .note{color:var(--on-dark)}
.hz .hz-calc-out .book-btn{justify-self:start; margin-top:8px}
.hz .hz-reels{max-width:640px}
.hz .hz-reels figcaption{color:#fff}
.hz .hz-acc{display:grid; gap:10px}
.hz .hz-acc details{background:var(--sand); padding:0}
.hz .hz-acc summary{cursor:pointer; padding:16px 18px; display:flex; flex-wrap:wrap; gap:4px 14px; align-items:baseline; list-style:none}
.hz .hz-acc summary::-webkit-details-marker{display:none}
.hz .hz-acc summary::after{content:"+"; margin-left:auto; font-size:24px; font-weight:800; color:var(--red); line-height:1}
.hz .hz-acc details[open] summary::after{content:"−"}
.hz .hz-acc summary b{font-size:20px}
.hz .hz-acc summary span{font-size:14px; color:var(--muted)}
.hz .hz-acc-body{padding:0 18px 18px}
.hz .hz-acc .hz-story p{color:var(--ink)}
.hz .hz-acc .hz-story .hz-story-lead{color:var(--ink)}
.hz .hz-acc .hz-mission li{background:#fff}

/* ---------- Квесты, вариант В (quests-c.njk): хоррор-эффекты, design: "d2 hz hz3" ---------- */
.hz3{background:#0c0e0a}
/* плёночное зерно и виньетка поверх всей страницы — клики проходят насквозь */
.hz3::before, .hz3::after{content:""; position:fixed; pointer-events:none; z-index:60}
.hz3::before{inset:0; background:radial-gradient(ellipse at center, transparent 55%, rgba(0,0,0,.45) 100%)}
.hz3::after{inset:-50%; opacity:.09; animation:hz3-grain .5s steps(5) infinite;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes hz3-grain{0%{transform:translate(0,0)} 20%{transform:translate(-4%,3%)} 40%{transform:translate(3%,-5%)} 60%{transform:translate(-6%,-2%)} 80%{transform:translate(5%,4%)} 100%{transform:translate(0,0)}}
.hz3 section{position:relative}
.hz3 section.alt, .hz3 #map{background:#11140e; color:#fff}
.hz3 #map .lead, .hz3 #map .route, .hz3 #map p{color:var(--on-dark)}
.hz3 #map a:not(.map-cta):not(.map-box){color:var(--red-hi)}
.hz3 #map h2{color:#fff}
/* первый экран: «камера», сканлинии, туман, глитч */
.hz3 .hz3-scan{position:absolute; inset:0; pointer-events:none; z-index:0; opacity:.35;
  background:repeating-linear-gradient(180deg, rgba(0,0,0,.55) 0 1px, transparent 1px 3px)}
.hz3 .hz3-fog{position:absolute; left:0; right:0; bottom:0; height:55%; pointer-events:none; z-index:0; overflow:hidden}
.hz3 .hz3-fog i{position:absolute; bottom:-30%; width:120%; height:100%; left:-10%; filter:blur(30px); opacity:.35;
  background:radial-gradient(ellipse at 30% 70%, rgba(200,210,220,.5), transparent 60%), radial-gradient(ellipse at 75% 80%, rgba(200,210,220,.4), transparent 55%);
  animation:hz3-fog 28s ease-in-out infinite alternate}
.hz3 .hz3-fog i + i{animation-duration:41s; animation-direction:alternate-reverse; opacity:.25}
@keyframes hz3-fog{from{transform:translateX(-8%)} to{transform:translateX(8%)}}
.hz3 .hz3-rec{position:absolute; top:14px; right:16px; z-index:2; color:#fff; font:700 15px/1.2 "Courier New", Consolas, monospace;
  letter-spacing:.08em; text-shadow:0 0 6px rgba(0,0,0,.9); text-align:right}
.hz3 .hz3-rec b{color:#ff2b2f}
.hz3 .hz3-rec b::before{content:"● "; animation:hz3-blink 1s steps(1) infinite}
.hz3 .hz3-rec small{display:block; font-size:11px; opacity:.75; margin-top:2px}
@keyframes hz3-blink{50%{opacity:0}}
.hz3 .hz3-glitch{position:relative}
.hz3 .hz3-glitch::before, .hz3 .hz3-glitch::after{content:attr(data-text); position:absolute; inset:0; pointer-events:none; opacity:0}
.hz3 .hz3-glitch::before{color:#ff2b2f; animation:hz3-glitch-a 5s infinite}
.hz3 .hz3-glitch::after{color:#38d7ff; animation:hz3-glitch-b 5s infinite}
@keyframes hz3-glitch-a{0%,91%,100%{opacity:0; transform:none} 92%{opacity:.85; transform:translate(-4px,1px); clip-path:inset(10% 0 55% 0)} 94%{opacity:.85; transform:translate(3px,-2px); clip-path:inset(60% 0 10% 0)} 96%{opacity:.8; transform:translate(-2px,0); clip-path:inset(35% 0 40% 0)}}
@keyframes hz3-glitch-b{0%,91%,100%{opacity:0; transform:none} 93%{opacity:.7; transform:translate(4px,-1px); clip-path:inset(45% 0 30% 0)} 95%{opacity:.7; transform:translate(-3px,2px); clip-path:inset(5% 0 70% 0)}}
.hz3 .hero2-media img{animation:hz3-flicker 9s infinite}
@keyframes hz3-flicker{0%,96%,100%{filter:none} 96.5%{filter:brightness(.4)} 97%{filter:brightness(1.25) contrast(1.2)} 97.6%{filter:brightness(.6)}}
/* лента ограждения */
.hz3 .hz3-tape{overflow:hidden; background:repeating-linear-gradient(-45deg, #b5121b 0 22px, #0c0e0a 22px 44px); padding:7px 0; transform:rotate(-1deg); margin:0 -10px; box-shadow:0 6px 20px rgba(0,0,0,.6)}
.hz3 .hz3-tape-wrap{overflow:hidden; position:relative; z-index:3; margin-top:-12px; padding:12px 0 10px}
.hz3 .hz3-tape > div{display:flex; width:max-content; animation:hz3-tape 40s linear infinite}
.hz3 .hz3-tape span{display:block; white-space:nowrap; background:#0c0e0a; color:#ff3b3f; font:800 13px/1 "Courier New", Consolas, monospace; letter-spacing:.18em; text-transform:uppercase; padding:6px 0}
@keyframes hz3-tape{to{transform:translateX(-50%)}}
/* подтёки сверху тёмных разделов */
.hz3 .hz3-drip{position:absolute; top:0; left:0; right:0; height:46px; pointer-events:none; z-index:1;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 46' preserveAspectRatio='none'%3E%3Cpath fill='%238e0b10' d='M0 0h300v6c-6 0-8 3-9 9-1 9-6 9-7 0s-4-9-12-9c-9 0-10 4-11 14-1 14-8 14-9 0-1-9-4-14-14-14-8 0-9 2-10 6s-5 4-6 0-4-6-12-6c-9 0-12 7-13 22-1 18-9 18-10 0-1-15-5-22-16-22-7 0-9 3-10 8s-6 5-7 0-5-8-14-8c-8 0-10 4-11 12-1 10-7 10-8 0-1-8-4-12-14-12-9 0-11 6-12 16-1 13-8 13-9 0-1-10-5-16-15-16-6 0-8 2-9 5s-5 3-6 0-4-5-11-5c-6 0-8 3-9 8-1 6-5 6-6 0-1-5-3-8-9-8z'/%3E%3C/svg%3E") repeat-x top / 300px 46px;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.6))}
.hz3 .hz-quest, .hz3 #lasertag{padding-top:84px}
/* фонарик */
.hz3 .hz3-torch{position:relative; max-width:760px; aspect-ratio:4/3; overflow:hidden; background:#000; cursor:crosshair; touch-action:pan-y; --x:50%; --y:50%}
.hz3 .hz3-torch picture, .hz3 .hz3-torch img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; margin:0}
.hz3 .hz3-torch-dim{position:absolute; inset:0; opacity:.13; filter:blur(2px)}
.hz3 .hz3-torch-lit{position:absolute; inset:0;
  -webkit-mask-image:radial-gradient(circle 130px at var(--x) var(--y), #000 30%, rgba(0,0,0,.6) 55%, transparent 100%);
          mask-image:radial-gradient(circle 130px at var(--x) var(--y), #000 30%, rgba(0,0,0,.6) 55%, transparent 100%)}
.hz3 .hz3-torch-lit img{filter:contrast(1.15) saturate(1.1)}
.hz3 .hz3-torch.still .hz3-torch-lit{-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 45%, #000 40%, transparent 100%); mask-image:radial-gradient(ellipse 70% 70% at 50% 45%, #000 40%, transparent 100%)}
.hz3 .hz3-torch-hint{position:absolute; left:50%; bottom:14px; transform:translateX(-50%); font:700 12px/1 "Courier New", Consolas, monospace; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(255,255,255,.55); transition:opacity .4s}
.hz3 .hz3-torch.touched .hz3-torch-hint{opacity:0}
/* печатная машинка, отсчёт */
.hz3 .hz-story .hz-story-lead{font-family:"Courier New", Consolas, monospace; font-weight:700; letter-spacing:-.01em; color:#ff4d50}
.hz3 .hz3-type.typing::after{content:"▌"; color:#ff4d50; animation:hz3-blink .8s steps(1) infinite}
.hz3 .hz3-count{margin:-4px 0 14px; font:700 14px/1.3 "Courier New", Consolas, monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--on-dark)}
.hz3 .hz3-count b{display:inline-block; margin-left:8px; padding:4px 10px; background:#1a0507; color:#ff3b3f; font-size:20px; border:1px solid #5c0b0e;
  text-shadow:0 0 8px rgba(255,40,40,.7)}
/* неон надзаголовков, свечение, пульс кнопок */
.hz3 .dark .kicker{animation:hz3-neon 7s infinite}
@keyframes hz3-neon{0%,18%,22%,62%,64%,100%{opacity:1} 19%,21%,63%{opacity:.25}}
.hz3 .dark h2{text-shadow:0 0 22px rgba(214,25,29,.35)}
.hz3 .book-btn{animation:hz3-beat 2.6s infinite}
@keyframes hz3-beat{0%,30%,100%{transform:scale(1)} 8%{transform:scale(1.06)} 16%{transform:scale(1)} 22%{transform:scale(1.04)}}
.hz3 .book-btn:hover{animation:none}
/* кадры: приглушены, на наведении — «моргнувшая лампа» и полный цвет */
.hz3 .hz-frames img{filter:grayscale(.55) brightness(.85) contrast(1.15); transition:filter .3s}
.hz3 .hz-frames figure:hover img{filter:none; animation:hz3-lamp .5s steps(2) 1}
@keyframes hz3-lamp{0%{opacity:1} 30%{opacity:.3} 60%{opacity:1} 80%{opacity:.6} 100%{opacity:1}}
.hz3 .hz-pick-card:hover{animation:hz3-shake .35s 1}
@keyframes hz3-shake{25%{transform:translate(-2px,1px) rotate(-.4deg)} 50%{transform:translate(2px,-1px) rotate(.4deg)} 75%{transform:translate(-1px,0)}}
/* красные глаза в темноте */
.hz3 .hz3-eyes{position:absolute; left:4%; bottom:18%; display:flex; gap:14px; pointer-events:none; z-index:1; opacity:0; animation:hz3-eyes 11s infinite}
.hz3 .hz3-eyes.right{left:auto; right:6%; bottom:auto; top:22%; animation-delay:-5s}
.hz3 .hz3-eyes i{width:12px; height:6px; border-radius:50%; background:#ff1f25; box-shadow:0 0 10px 3px rgba(255,20,30,.7)}
@keyframes hz3-eyes{0%,55%,100%{opacity:0; transform:scaleY(1)} 60%,82%{opacity:.9} 70%,71%{transform:scaleY(.1)} 72%{transform:scaleY(1)}}
/* лазертаг и «как проходит» на тёмном */
.hz3 .dark .hz-tags li{background:rgba(255,255,255,.08); color:#fff}
.hz3 .dark .hz-modes > div, .hz3 .dark .hz-more > div{background:var(--ink-2); box-shadow:none}
.hz3 .dark .hz-modes span, .hz3 .dark .hz-more span{color:var(--on-dark)}
.hz3 .dark .rules li{background:var(--ink-2); color:var(--on-dark)}
.hz3 .dark .rules b{color:#fff}
.hz3 .dark .sub-h{color:#fff}
/* тише: системная настройка «уменьшить движение» */
@media (prefers-reduced-motion: reduce){
  .hz3::after, .hz3 *, .hz3 *::before, .hz3 *::after{animation:none !important}
  .hz3 .hz3-eyes{opacity:.6}
}

/* Квесты: цена с человека и калькулятор (quest-calc.njk) — во всех вариантах */
.hz .hz-pick-group{font-size:12px; color:var(--on-dark)}
.hz .hz-price-calc{display:grid; gap:14px; justify-content:stretch}
.hz .hz-price-head{display:flex; flex-direction:column; gap:4px}
.hz .hz-price > .qcalc{display:grid; flex-direction:initial; gap:14px; padding-top:14px; border-top:1px solid rgba(255,255,255,.12)}
@media(min-width:640px){ .hz .hz-price > .qcalc{grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px 28px} }
.hz .qcalc-in{display:grid; gap:6px}
.hz .qcalc-label{font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--on-dark)}
.hz .qcalc .calc-people button{background:transparent; color:#fff; border-color:rgba(255,255,255,.3); border-radius:0}
.hz .qcalc .calc-people button:hover{border-color:var(--red-hi); color:var(--red-hi)}
.hz .qcalc .calc-people input{width:72px; height:44px; background:#0c0e0a; color:#fff; border:1px solid rgba(255,255,255,.25); font-size:20px; font-weight:800; text-align:center}
.hz .qcalc-range{font-size:12px; color:var(--on-dark)}
.hz .qcalc-out{display:grid; gap:2px}
.hz .qcalc-out p{margin:0}
.hz .qcalc .qcalc-pp b{font-size:30px; line-height:1.05; color:var(--red-hi)}
.hz .qcalc-pp span{margin-left:8px; font-size:14px; color:var(--on-dark)}
.hz .qcalc-total{display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; font-size:14px; color:var(--on-dark)}
.hz .qcalc .qcalc-total b{font-size:18px; color:#fff}
.hz .qcalc-lines{font-size:13px; color:var(--on-dark); opacity:.85}
.hz .qcalc .book-btn{justify-self:start}
/* вариант Б: таблица и калькулятор */
.hz .hz-row-pp b{color:var(--red-hi)}
.hz .hz-calc-in .calc-people input{width:90px; text-align:center; font-weight:800}
.hz .hz-calc-in .calc-people button{border-radius:0}

/* Главная: блок «Хоррор-квесты и лазертаг» (index.njk, #quests) */
.d2 .idx-q{display:grid; gap:28px}
@media(min-width:900px){ .d2 .idx-q{grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:48px} }
.d2 .idx-q-media{display:block; border-left:4px solid var(--red)}
.d2 .idx-q-media img{display:block; width:100%; aspect-ratio:16/10; object-fit:cover}
.d2 .idx-q .sec-head{margin-bottom:20px}
.d2 .idx-q-list{list-style:none; margin:0 0 24px; padding:0; display:grid; gap:8px}
.d2 .idx-q-list a{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; padding:12px 14px; background:var(--ink-2); color:#fff; text-decoration:none; border-left:3px solid var(--red)}
.d2 .idx-q-list a:hover{background:#2a3322}
.d2 .idx-q-list b{font-size:18px}
.d2 .idx-q-list span{font-size:14px; color:var(--on-dark)}

.d2 a.book-btn{text-decoration:none}

/* ==========================================================================
   /friends/ — блоки «живости» (26.10.2026): цифры, техника, сравнение туров,
   ближайшие заезды, день по шагам с фото, свежие кадры, видеоотзывы, вопросы,
   кнопки мессенджеров у форм
   ========================================================================== */
.d2 .stats-band{background:var(--ink); color:#fff; border-top:1px solid rgba(255,255,255,.08)}
.d2 .stats-band ul{list-style:none; margin:0 auto; padding:22px 16px; display:grid; grid-template-columns:repeat(2,1fr); gap:18px 12px}
@media(min-width:760px){ .d2 .stats-band ul{grid-template-columns:repeat(4,1fr); padding:30px 16px} }
.d2 .stats-band li{border-left:3px solid var(--red); padding-left:12px}
.d2 .stats-band b{display:block; font-size:clamp(26px,5vw,40px); font-weight:800; line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.d2 .stats-band span{display:block; margin-top:6px; font-size:14px; color:var(--on-dark)}

.d2 .tech{display:grid; gap:16px}
@media(min-width:640px){ .d2 .tech{grid-template-columns:repeat(2,1fr)} }
@media(min-width:1000px){ .d2 .tech{grid-template-columns:repeat(4,1fr)} }
.d2 .tech-card{margin:0; background:#fff; box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.08); border-bottom:4px solid var(--red)}
.d2 .tech-card img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
.d2 .tech-card figcaption{padding:14px 16px 16px}
.d2 .tech-card b{display:block; font-size:19px; line-height:1.2}
.d2 .tech-card span{display:block; margin-top:4px; color:var(--muted); font-size:15px}

.d2 .compare-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 -16px; padding:0 16px}
.d2 .compare{border-collapse:collapse; width:100%; min-width:620px; font-size:15px}
.d2 .compare th, .d2 .compare td{padding:12px 10px; text-align:center; border-bottom:1px solid rgba(255,255,255,.12)}
.d2 .compare thead th{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--on-dark); font-weight:700}
.d2 .compare tbody th{text-align:left; font-weight:800}
.d2 .compare td{color:var(--red-hi); font-weight:800}
.d2 .compare td:nth-child(2){color:#fff; font-weight:600}

.d2 .dates{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
@media(min-width:760px){ .d2 .dates{grid-template-columns:repeat(4,1fr)} }
.d2 .date-card{background:#fff; padding:14px; box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(21,26,16,.07)}
.d2 .date-head{margin:0 0 10px; display:flex; align-items:baseline; justify-content:space-between; gap:8px}
.d2 .date-head b{font-size:18px}
.d2 .date-head span{font-size:13px; text-transform:uppercase; letter-spacing:.08em; color:var(--red); font-weight:800}
.d2 .date-slots{display:flex; flex-wrap:wrap; gap:6px}
.d2 .slot{font:inherit; font-weight:800; font-size:15px; padding:8px 12px; border:2px solid var(--ink); background:#fff; color:var(--ink); cursor:pointer;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.d2 .slot:hover, .d2 .slot:focus-visible{background:var(--red); border-color:var(--red); color:#fff}

.d2 .day{list-style:none; margin:0; padding:0; display:grid; gap:20px; counter-reset:step}
@media(min-width:640px){ .d2 .day{grid-template-columns:repeat(2,1fr)} }
@media(min-width:1000px){ .d2 .day{grid-template-columns:repeat(5,1fr); gap:16px} }
.d2 .day li{position:relative}
.d2 .day figure{margin:0 0 12px; position:relative}
.d2 .day img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
.d2 .day figure::after{counter-increment:step; content:counter(step); position:absolute; left:10px; top:10px; width:36px; height:36px;
  display:grid; place-items:center; background:var(--red); color:#fff; font-weight:800;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.d2 .day b{display:block; font-size:20px; line-height:1.15}
.d2 .day span{display:block; margin-top:4px; color:var(--muted); font-size:15px}

.d2 .live-strip{display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding:0 16px 8px; -webkit-overflow-scrolling:touch}
.d2 .live-strip{scroll-padding-inline:16px}
@media(min-width:1192px){ .d2 .live-strip{padding-left:calc((100vw - 1160px) / 2 + 16px); scroll-padding-inline-start:calc((100vw - 1160px) / 2 + 16px)} }
.d2 .live-strip figure{flex:0 0 80vw; max-width:360px; margin:0; scroll-snap-align:start; position:relative}
.d2 .live-strip img{display:block; width:100%; aspect-ratio:3/2; object-fit:cover}
.d2 .live-strip figcaption{position:absolute; left:0; bottom:0; padding:6px 10px; background:var(--red); color:#fff; font-size:13px; font-weight:800; letter-spacing:.04em}

.d2 .vreviews{display:grid; gap:16px}
@media(min-width:760px){ .d2 .vreviews{grid-template-columns:repeat(3,1fr)} }
.d2 .vreviews .video{margin:0}
.d2 .vreviews figcaption{font-weight:700; margin-top:8px}

.d2 .faq{max-width:820px}
.d2 .faq details{border-top:1px solid var(--sand-2); padding:0}
.d2 .faq details:last-child{border-bottom:1px solid var(--sand-2)}
.d2 .faq summary{cursor:pointer; list-style:none; padding:16px 36px 16px 0; font-weight:800; font-size:18px; position:relative}
.d2 .faq summary::-webkit-details-marker{display:none}
.d2 .faq summary::after{content:"+"; position:absolute; right:4px; top:12px; font-size:26px; color:var(--red); font-weight:400}
.d2 .faq details[open] summary::after{content:"−"}
.d2 .faq p{margin:0 0 16px; color:var(--muted); max-width:700px}

.msgr{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:14px 0 0; font-size:14px}
.msgr span{flex-basis:100%; color:var(--muted, #6b6b6b)}
.msgr a{display:inline-block; padding:6px 12px; font-size:13px; font-weight:700; text-decoration:none; border:1px solid currentColor; border-radius:999px; color:inherit}
.msgr a:hover{background:var(--red); border-color:var(--red); color:#fff}
.d2 .dark .msgr span{color:var(--on-dark)}
.d2 .weather-photos{margin:0 0 16px}
.d2 .weather-photos img{aspect-ratio:3/2; object-fit:cover; width:100%}
@media(max-width:639px){
  .d2 .day{gap:14px}
  .d2 .day li{display:grid; grid-template-columns:128px 1fr; grid-template-rows:auto 1fr; gap:4px 14px; align-items:start}
  .d2 .day figure{grid-row:span 2; margin:0}
  .d2 .day img{aspect-ratio:1/1}
  .d2 .day figure::after{width:28px; height:28px; left:6px; top:6px; font-size:14px}
  .d2 .day b{font-size:18px}
}
@media(min-width:760px){ .d2 .tir-photos{grid-template-columns:repeat(4,1fr)} }
.d2 .tir-photos img{aspect-ratio:3/2; object-fit:cover; width:100%}
.d2 .arsenal{display:grid; gap:16px}
@media(min-width:640px){ .d2 .arsenal{grid-template-columns:repeat(2,1fr)} }
@media(min-width:1000px){ .d2 .arsenal{grid-template-columns:repeat(3,1fr)} }
.d2 .arsenal-card{margin:0; background:var(--ink-2); border-bottom:4px solid var(--red)}
.d2 .arsenal-card img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
.d2 .arsenal-card figcaption{padding:14px 16px 16px}
.d2 .arsenal-card b{display:block; font-size:20px; line-height:1.2; color:#fff}
.d2 .arsenal-card span{display:block; margin-top:4px; color:var(--on-dark); font-size:15px}
.d2 .arsenal-card small{display:block; margin-top:10px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--red-hi)}
.d2 #arsenal .sec-lead a{color:var(--red-hi)}
.d2 .packs .card-photo{margin:-18px -18px 14px}
.d2 .packs .card-photo img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
