/* escape. — Детский день рождения: блоки, которых нет ни на взрослой
   странице, ни на корпоративе. Подключается только на детских слагах
   (esclub_page_assets), поэтому взрослый ДР и корпоратив их не грузят.
   Общие правила остаются в style.css. */

.esc-den-rozhdenia .host-note{display:grid; grid-template-columns:auto 1fr; gap:18px; padding:clamp(20px,2.6vw,30px); border-radius:var(--radius-lg);
  border:1px solid rgba(255,0,4,.35); background:linear-gradient(165deg, rgba(255,0,4,.10), rgba(28,28,28,0) 60%), var(--surface); margin-bottom:30px; align-items:start;}
.esc-den-rozhdenia .host-ico{width:52px; height:52px; border-radius:14px; background:var(--accent-grad); color:#fff; display:grid; place-items:center; flex:0 0 auto;}
.esc-den-rozhdenia .host-ico svg{width:26px; height:26px;}
.esc-den-rozhdenia .host-note h3{font-size:clamp(18px,2vw,23px); margin-bottom:8px;}
.esc-den-rozhdenia .host-note p{color:var(--muted); font-size:15.5px; max-width:760px;}
@media (max-width:560px){
.esc-den-rozhdenia .host-note{grid-template-columns:1fr;}
}
.esc-den-rozhdenia .skel-badge{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:12px; font-size:13px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; color:var(--muted-2);}
.esc-den-rozhdenia .skel-spin{width:38px; height:38px; border-radius:50%; border:2px solid var(--border-strong); border-top-color:var(--accent); animation:escdrk-skelSpin .9s linear infinite;}
.esc-den-rozhdenia .vid-play{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:3; width:74px; height:74px; border-radius:50%; background:rgba(255,0,4,.94); color:#fff; display:grid; place-items:center;
  cursor:pointer; box-shadow:0 16px 40px -10px rgba(255,0,4,.6); opacity:0; pointer-events:none; transition:opacity .35s var(--ease), transform .3s var(--ease);}
.esc-den-rozhdenia .vid-play:hover{transform:translate(-50%,-50%) scale(1.07);}
.esc-den-rozhdenia .vid-play svg{width:30px; height:30px; margin-left:3px;}
.esc-den-rozhdenia .case-card{border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; background:linear-gradient(180deg,var(--surface),var(--bg-soft));
  box-shadow:0 0 0 1px rgba(255,0,4,.07), 0 34px 70px -40px rgba(0,0,0,.9);}
.esc-den-rozhdenia .case-hero{position:relative; min-height:clamp(300px,32vw,440px); display:flex; align-items:flex-end; overflow:hidden; background:#0d0d0d;}
.esc-den-rozhdenia .case-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 12%; filter:saturate(.88);
  transition:transform .45s var(--ease), filter .45s var(--ease);}
.esc-den-rozhdenia .case-hero:hover img{transform:scale(1.03); filter:none;}
.esc-den-rozhdenia .case-hero::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,10,10,.5) 0%, rgba(10,10,10,.15) 32%, rgba(14,14,14,.82) 78%, #1a1a1a 100%);}
.esc-den-rozhdenia .case-lede{position:relative; z-index:3; padding:clamp(22px,3vw,40px); width:100%; max-width:820px;}
.esc-den-rozhdenia .case-lede h2{font-size:clamp(25px,3.4vw,42px); margin:14px 0 12px; text-wrap:balance; text-shadow:0 2px 24px rgba(0,0,0,.6);}
.esc-den-rozhdenia .case-lede > p{color:#dcdcdc; font-size:clamp(15px,1.5vw,17px); max-width:620px; text-wrap:pretty; text-shadow:0 1px 14px rgba(0,0,0,.7);}
.esc-den-rozhdenia .case-cap{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px;}
.esc-den-rozhdenia .case-cap span{padding:7px 14px; border-radius:999px; background:rgba(12,12,12,.62); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.18); font-size:12.5px; font-weight:500; color:#ededed; transition:border-color .25s var(--ease), color .25s var(--ease);}
.esc-den-rozhdenia .case-cap span:hover{border-color:var(--accent); color:#fff;}
.esc-den-rozhdenia .case-body{display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(20px,2.6vw,38px); padding:clamp(22px,3vw,40px); align-items:stretch;}
/* Текст — колонкой, цитата прижата к низу: рядом квадратная мозаика фото,
   и без этого под текстом оставалась пустая полоса. */
.esc-den-rozhdenia .case-text{display:flex; flex-direction:column;}
.esc-den-rozhdenia .case-text p{color:var(--muted); font-size:15px; margin-bottom:12px; text-wrap:pretty;}
.esc-den-rozhdenia .case-text p:first-child{color:#dedede; font-size:16px;}
.esc-den-rozhdenia .case-text p:last-child{margin-bottom:0;}
.esc-den-rozhdenia .case-text p b{color:var(--text); font-weight:500;}
.esc-den-rozhdenia .case-text p:last-of-type{margin-bottom:20px;}
.esc-den-rozhdenia .case-quote{position:relative; margin:auto 0 0; padding:20px 24px 20px 60px; border-radius:var(--radius);
  border:1px solid rgba(255,0,4,.28); background:linear-gradient(150deg, rgba(255,0,4,.12), rgba(28,28,28,0) 58%), var(--surface-2);}
.esc-den-rozhdenia .case-quote::before{content:"”"; position:absolute; left:20px; top:6px; font-family:'Ubuntu',Arial,sans-serif; font-weight:700; font-size:58px; line-height:1; color:var(--accent); opacity:.55;}
.esc-den-rozhdenia .case-quote p{color:var(--text); font-size:16px; font-weight:500; margin:0;}
@media (max-width:1150px){.esc-den-rozhdenia .case-body{grid-template-columns:1fr;}
}
@media (max-width:900px){
/* Фото героя видно над текстом, а кнопка «видео праздника» больше не
   наезжает на «Кейс праздника»: подзаголовок начинается ниже кнопки. */
.esc-den-rozhdenia .case-hero{min-height:clamp(340px,74vw,440px);}
.esc-den-rozhdenia .case-lede{padding-top:72px;}
}
@media (max-width:480px){.esc-den-rozhdenia .case-quote{padding:18px 18px 18px 52px;}
}
.esc-den-rozhdenia .stp{position:relative; padding:26px 24px; border:1px solid var(--border); border-radius:var(--radius); background:linear-gradient(180deg,var(--surface),var(--bg-soft));
  transition:transform .35s var(--ease), border-color .35s var(--ease);}
.esc-den-rozhdenia .stp:hover{transform:translateY(-4px); border-color:var(--border-strong);}
.esc-den-rozhdenia .stp b{display:block; font-size:16.5px; margin-bottom:6px;}
.esc-den-rozhdenia .stp span{color:var(--muted); font-size:13.5px; line-height:1.5; display:block;}
.esc-den-rozhdenia .steps-rules{margin-top:24px; display:flex; flex-direction:column; gap:10px; max-width:820px;}
.esc-den-rozhdenia .steps-rules li{display:flex; gap:11px; align-items:flex-start; color:var(--muted); font-size:14.5px;}
.esc-den-rozhdenia .steps-rules li svg{width:19px; height:19px; color:var(--accent); flex:0 0 auto; margin-top:3px;}
.esc-den-rozhdenia .steps-rules b{color:var(--text); font-weight:500;}
.esc-den-rozhdenia .cmp{margin-top:30px;}
.esc-den-rozhdenia .cmp h3{font-size:clamp(20px,2.4vw,28px); margin-bottom:18px;}
.esc-den-rozhdenia .cmp-table{width:100%; min-width:680px; border-collapse:collapse; font-size:14.5px;}
.esc-den-rozhdenia .cmp-table th,.esc-den-rozhdenia .cmp-table td{padding:13px 18px; text-align:left; border-bottom:1px solid var(--border);}
.esc-den-rozhdenia .cmp-table thead th{font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); background:var(--bg-soft);}
.esc-den-rozhdenia .cmp-table thead th.cmp-feat{color:var(--accent-text);}
.esc-den-rozhdenia .cmp-table tbody th{color:var(--muted); font-weight:500;}
.esc-den-rozhdenia .cmp-table tbody td{color:var(--text);}
.esc-den-rozhdenia .cmp-table tbody tr:last-child th,.esc-den-rozhdenia .cmp-table tbody tr:last-child td{border-bottom:none;}
.esc-den-rozhdenia .cmp-table .cmp-feat{background:rgba(255,0,4,.07);}
.esc-den-rozhdenia .cmp-table tbody tr{transition:background-color .2s var(--ease);}
.esc-den-rozhdenia .cmp-table tbody tr:hover{background-color:rgba(255,255,255,.025);}
.esc-den-rozhdenia .confetti-cv{position:absolute; inset:0; z-index:3; width:100%; height:100%; pointer-events:none;}
.esc-den-rozhdenia .popper{position:absolute; z-index:4; right:clamp(20px,4.5vw,74px); top:calc(var(--nav-h) + clamp(24px,6vw,90px));
  display:grid; place-items:center; width:clamp(46px,5.2vw,64px); height:clamp(46px,5.2vw,64px); padding:0; border-radius:50%; cursor:pointer;
  background:radial-gradient(circle at 34% 28%,#FFE7A3 0%,#FFC93C 52%,#f0a01c 100%);
  border:1px solid rgba(255,255,255,.5); box-shadow:0 16px 44px -18px rgba(0,0,0,.85), 0 0 34px -6px rgba(255,201,60,.5);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), filter .3s var(--ease);}
.esc-den-rozhdenia .popper > svg:first-child{display:block; width:64%; height:64%; filter:drop-shadow(0 6px 14px rgba(0,0,0,.5));}
.esc-den-rozhdenia .popper .popper-ring{width:auto; height:auto;}
.esc-den-rozhdenia .popper:hover{transform:translateY(-3px) rotate(-6deg) scale(1.04); box-shadow:0 22px 60px -18px rgba(255,201,60,.75);}
.esc-den-rozhdenia .popper:active{transform:scale(.94) rotate(-3deg);}
.esc-den-rozhdenia .popper-ring{position:absolute; inset:-5px; transform:rotate(-90deg); pointer-events:none; opacity:0; transition:opacity .25s linear; overflow:visible;}
.esc-den-rozhdenia .popper-ring circle{fill:none; stroke-width:4; stroke-linecap:round;}
.esc-den-rozhdenia .popper-ring .ring-bg{stroke:rgba(255,255,255,.16);}
.esc-den-rozhdenia .popper-ring .ring-fg{stroke:#FFC93C; filter:drop-shadow(0 0 6px rgba(255,201,60,.7)); transition:stroke-dashoffset .1s linear;}
.esc-den-rozhdenia .popper em{position:absolute; top:calc(100% + 14px); left:50%; transform:translateX(-50%); white-space:nowrap;
  font-style:normal; font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:#FFC93C;
  opacity:0; transition:opacity .3s var(--ease); pointer-events:none;}
@media (max-width:760px){.esc-den-rozhdenia .popper{top:auto; bottom:calc(88px + env(safe-area-inset-bottom,0px)); right:18px;}
.esc-den-rozhdenia .popper em{top:auto; bottom:calc(100% + 12px);}
}
@media (prefers-reduced-motion: reduce){
.esc-den-rozhdenia .popper,.esc-den-rozhdenia .confetti-cv{display:none !important;}
}
.esc-den-rozhdenia .hero-video-btn{display:inline-flex; align-items:center; gap:11px; padding:8px 18px 8px 8px; border-radius:999px; border:1px solid var(--border-strong);
  background:rgba(15,15,15,.5); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:var(--text); font-size:14px; font-weight:500; min-height:52px; cursor:pointer;
  transition:border-color .25s var(--ease), background .25s var(--ease), transform .25s var(--ease);}
.esc-den-rozhdenia .hero-video-btn:hover{border-color:rgba(255,0,4,.55); background:rgba(18,18,18,.75); transform:translateY(-2px);}
.esc-den-rozhdenia .hvb-ic{width:36px; height:36px; border-radius:50%; background:var(--accent-grad); color:#fff; display:grid; place-items:center; flex:0 0 auto; box-shadow:0 8px 22px -8px rgba(255,0,4,.75);}
.esc-den-rozhdenia .hvb-ic svg{width:15px; height:15px; margin-left:2px;}
@media (max-width:760px){
.esc-den-rozhdenia .hero-video-btn{width:100%; justify-content:center;}
}
.esc-den-rozhdenia .how-callig{position:absolute; right:-4%; top:4%; width:min(620px,58%); opacity:.07; filter:brightness(.75); pointer-events:none; user-select:none; z-index:0;}
@media (max-width:760px){
.esc-den-rozhdenia .how-callig{display:none;}
}
.esc-den-rozhdenia .tip-pop{position:absolute; left:50%; bottom:calc(100% + 10px); transform:translate(-50%,4px); width:min(300px,72vw); padding:12px 14px; border-radius:12px;
  background:#101010; border:1px solid var(--border-strong); box-shadow:0 18px 40px -16px rgba(0,0,0,.8);
  color:var(--muted); font-size:13px; font-weight:400; line-height:1.5; text-align:left; text-transform:none; letter-spacing:0; white-space:normal;
  opacity:0; pointer-events:none; z-index:6; transition:opacity .2s var(--ease), transform .2s var(--ease);}
.esc-den-rozhdenia .host-ico{transition:transform .35s var(--ease);}
.esc-den-rozhdenia .host-note:hover .host-ico{transform:scale(1.06) rotate(-4deg);}

@keyframes escdrk-skelSpin{ to{ transform:rotate(360deg); } }