/* Страница развлечения — «Обложка» (вариант Д3 с /design).
   Фото во весь экран под шапкой, название и кнопки на тёмной подложке слева,
   описание и контакты внизу на стеклянной панели, лента миниатюр справа. */
.leisure-page { background:#0a0e15; }
/* общие стили сайта делают ссылки прописными — здесь регистр как в тексте */
.leisure-page a { text-transform:none; letter-spacing:0; }
.dl-cover { position:relative; height:calc(100svh - 100px); min-height:600px; max-height:1080px; overflow:hidden; color:#fff; background:#0a0e15; }
.dl-cover__media { position:absolute; inset:0; }
.dl-shot { position:absolute; inset:0; margin:0; opacity:0; transition:opacity .9s ease; overflow:hidden; }
.dl-shot.is-active { opacity:1; z-index:1; }
.dl-shot img { width:100%; height:100%; object-fit:cover; object-position:50% 35%; display:block; transform:scale(1.07); transition:transform 7s ease-out; }
.dl-shot.is-active img { transform:scale(1); }
/* вертикальный кадр — целиком, правее текста, на размытом фоне из самого кадра */
.dl-shot.is-portrait::before { content:""; position:absolute; inset:-60px; background:var(--bg) center/cover; filter:blur(36px) brightness(.45) saturate(1.2); }
.dl-shot.is-portrait img { position:relative; object-fit:contain; object-position:74% 50%; transform:none; }
.dl-cover__shade { position:absolute; inset:0; z-index:2; background:linear-gradient(90deg,#090d14f5 0%,#090d14d9 30%,#090d1466 58%,#090d1400 80%),linear-gradient(0deg,#090d14e6 0%,#090d1400 42%); }
.dl-cover__inner { position:relative; z-index:3; height:100%; max-width:1640px; margin:0 auto; padding:clamp(20px,3.5vh,44px) 40px clamp(18px,3vh,32px); display:grid; grid-template-rows:minmax(0,1fr) auto; gap:20px; }
.dl-cover__main { align-self:center; display:flex; flex-direction:column; align-items:flex-start; gap:clamp(12px,2vh,20px); max-width:640px; }
.dl-crumbs { display:flex; gap:8px; font-size:12px; color:#ffffffb3; }
.dl-crumbs a { color:#ffffffd9; transition:color .2s; }
.dl-crumbs a:hover { color:#ff6b84; }
.dl-kind { display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#ff6b84; }
.dl-kind::before { content:""; width:22px; height:2px; background:currentColor; }
.dl-title { font-family:"Oswald",sans-serif; font-weight:400; text-transform:uppercase; line-height:1; letter-spacing:-.005em; color:#fff; font-size:clamp(48px,6vw,108px); margin:0; text-shadow:0 6px 40px #0006; }
.dl-lead { font-size:clamp(15px,1.15vw,19px); line-height:1.5; color:#e4e9f1; max-width:560px; }
.dl-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.dl-btn { display:inline-flex; align-items:center; gap:10px; height:48px; padding:0 22px; border-radius:24px; border:1px solid #ffffff59; font-size:14px; font-weight:600; color:#fff; background:transparent; transition:background .2s,border-color .2s; }
.dl-btn svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; }
.dl-btn:hover { border-color:#fff; color:#fff; }
.dl-btn--primary { background:#ee1b3c; border-color:#ee1b3c; }
.dl-btn--primary:hover { background:#d0102f; border-color:#d0102f; }
.dl-social { display:inline-flex; gap:8px; margin-left:4px; }
.dl-social a { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; background:#ffffff1f; color:#fff; transition:background .2s,color .2s; }
.dl-social a:hover { background:#fff; color:#17243a; }
.dl-social svg { width:18px; height:18px; fill:currentColor; }
.dl-cover__bottom { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px; align-items:end; }
.dl-cover__about { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:24px; padding:18px 22px; border-radius:16px; background:#0b1019a6; border:1px solid #ffffff1c; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); max-width:980px; }
.dl-text p { font-size:13.5px; line-height:1.65; color:#cdd4df; }
.dl-text p+p { margin-top:8px; }
.dl-facts { display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; align-content:start; margin:0; }
.dl-facts>div { min-width:0; }
.dl-facts>div.is-wide { grid-column:1/-1; order:3; }
.dl-facts dd a[href^="tel:"],.dl-facts .nw { white-space:nowrap; }
.dl-facts dt { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#ffffff8c; margin-bottom:4px; }
.dl-facts dt svg { width:15px; height:15px; fill:none; stroke:#ff6b84; stroke-width:1.7; }
.dl-facts dd { margin:0; font-size:14px; font-weight:500; color:#fff; overflow-wrap:anywhere; }
.dl-facts dd a { color:inherit; border-bottom:1px solid #ffffff4d; }
.dl-facts dd a:hover { color:#fff; border-color:#fff; }
.dl-cover__strip { display:flex; gap:10px; }
.dl-thumb { position:relative; flex:0 0 auto; width:clamp(84px,7.6vw,128px); aspect-ratio:3/2; padding:0; border:0; border-radius:10px; overflow:hidden; background:#ffffff14; opacity:.6; outline:2px solid transparent; outline-offset:2px; transition:opacity .25s,outline-color .25s; cursor:pointer; }
.dl-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.dl-thumb:hover { opacity:.85; }
.dl-thumb.is-active { opacity:1; outline-color:#fff; }
.dl-thumb__bar { position:absolute; left:0; bottom:0; height:3px; width:calc(var(--p,0) * 100%); background:#ee1b3c; }
.dl-thumb:not(.is-active) .dl-thumb__bar { width:0; }
@media (max-width:980px) {
  /* на телефоне фото сверху, название лежит на его нижнем крае, остальное — ниже на тёмном */
  .dl-cover { height:auto; min-height:0; max-height:none; }
  .dl-cover__media { position:relative; height:62svh; }
  .dl-cover__shade { background:linear-gradient(0deg,#0a0e15 0%,#0a0e15a6 34%,#0a0e1500 62%); }
  .dl-cover__inner { height:auto; display:block; margin-top:-240px; padding:0 20px 28px; }
  .dl-cover__main { max-width:none; }
  .dl-cover__bottom { grid-template-columns:1fr; margin-top:24px; }
  .dl-cover__about { grid-template-columns:1fr; }
  .dl-cover__strip { overflow-x:auto; padding:2px; }
}
@media (prefers-reduced-motion:reduce) {
  .dl-shot,.dl-shot img { transition:none; }
  .dl-shot img { transform:none; }
}
