/* Modern Art Hotel — праздничный «квиток»: Різдво + Новий рік в одной карточке (на странице праздника — только вторая половинка). Наряд 2026-11-05_0020, правка 05.11 (вариант «Квиток»).
   Шрифты — из ../fonts/. Анимации не отключаются при «уменьшении движения» (решение владельца). */
@font-face{font-family:"MhpCaveat";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/caveat-cyr.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"MhpCaveat";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/caveat-lat.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"MhpCormorant";font-style:italic;font-weight:400 700;font-display:swap;src:url("../fonts/cormorant-garamond-italic-cyrillic.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"MhpCormorant";font-style:italic;font-weight:400 700;font-display:swap;src:url("../fonts/cormorant-garamond-italic-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

.mhp-slot{position:fixed;right:22px;bottom:26px;z-index:45;pointer-events:none}
.mht{position:relative;width:400px;max-width:calc(100vw - 32px);pointer-events:auto;filter:drop-shadow(0 18px 40px rgba(0,0,0,.45));
  opacity:0;transform:translate3d(0,30px,0) scale(.97);transition:opacity .55s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.mht[hidden]{display:none}
.mht.is-open{opacity:1;transform:none}
.mht.is-leaving{opacity:0;transform:translate3d(0,20px,0) scale(.98)}
.mht--single{width:220px}
.mht__x{position:absolute;top:-11px;right:-11px;z-index:5;width:26px;height:26px;padding:0;min-width:0;box-sizing:border-box;line-height:1;border:1px solid #c9a96a;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:#12100d;color:#e3c88b;transition:transform .25s,background .25s}
.mht__x svg{flex:none;display:block;width:13px;height:13px}
.mht__x:hover{transform:rotate(90deg);background:#241d14}
.mht__x:focus-visible,.mht__h:focus-visible{outline:2px solid #f3d9a8;outline-offset:2px}
.mht__in{display:grid;grid-template-columns:1fr 1fr;border-radius:6px;overflow:hidden;
  -webkit-mask:radial-gradient(circle 9px at 50% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 9px at 50% 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle 9px at 50% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 9px at 50% 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
.mht--single .mht__in{grid-template-columns:1fr;-webkit-mask:none;mask:none}
.mht__h{position:relative;transition:filter .3s;padding:16px 16px 14px;display:flex;flex-direction:column;gap:4px;min-height:150px;overflow:hidden;text-decoration:none !important;box-sizing:border-box}
.mht__h--rz{background:linear-gradient(160deg,#16184a,#2a2f7c);color:#e7ecff}
.mht__h--ny{background:linear-gradient(160deg,#12100d,#241d14);color:#f5efe4}
.mht:not(.mht--single) .mht__h--rz::after{content:"";position:absolute;top:0;bottom:0;right:0;width:2px;background:repeating-linear-gradient(180deg,rgba(243,217,168,.6) 0 6px,transparent 6px 12px);background-size:2px 24px;animation:mhtPerf 1.6s linear infinite}
@keyframes mhtPerf{to{background-position:0 24px}}
/* поява: половинки з'їжджаються, дата спалахує, сніг і золото */
.mht.is-open .mht__h--rz{animation:mhtInL .9s cubic-bezier(.16,1,.3,1) both}
.mht.is-open .mht__h--ny{animation:mhtInR .9s cubic-bezier(.16,1,.3,1) .08s both}
@keyframes mhtInL{from{transform:translate3d(-40px,0,0) rotate(-2deg);opacity:0}to{transform:none;opacity:1}}
@keyframes mhtInR{from{transform:translate3d(40px,0,0) rotate(2deg);opacity:0}to{transform:none;opacity:1}}
.mht.is-open .mht__d{animation:mhtDate 1.4s ease-out .5s both}
@keyframes mhtDate{0%{opacity:0;transform:translateY(10px) scale(.8);text-shadow:0 0 0 rgba(255,236,190,0)}45%{opacity:1;text-shadow:0 0 18px rgba(255,236,190,.9)}100%{transform:none;text-shadow:0 0 0 rgba(255,236,190,0)}}
.mht__sn{position:absolute;top:-6px;width:3px;height:3px;border-radius:50%;background:#fff;opacity:.8;animation:mhtSnow 6s linear infinite;pointer-events:none}
@keyframes mhtSnow{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(6px,90px,0)}100%{transform:translate3d(-4px,180px,0);opacity:0}}
.mht__h:hover{filter:brightness(1.08)}
.mht__h--rz .mht__d{animation-name:mhtDate}
.mht__h--ny .mht__t em{background:linear-gradient(100deg,#9c7a3c,#efd9a4 30%,#b48b48 50%,#f3dca6 70%,#a8823f);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:mhtShine 3.6s ease-in-out infinite}
@keyframes mhtShine{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.mht__k{font:600 10px/1.3 "Ysabeau Infant",system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.mht__h--rz .mht__k{color:#f0b46e}.mht__h--ny .mht__k{color:#c9a96a}
.mht__d{font:700 34px/1 "Ysabeau Infant",system-ui,sans-serif;letter-spacing:-.02em;transition:transform .3s}
.mht__h--rz .mht__d{color:#fff6dc}.mht__h--ny .mht__d{color:#e3c88b}
.mht__d small{font-size:11px;letter-spacing:.18em;margin-left:6px;font-weight:600;vertical-align:middle;opacity:.8;text-transform:uppercase}
.mht__h:hover .mht__d{transform:translateY(-2px)}
.mht__t{line-height:1}
.mht__h--rz .mht__t{font-family:"MhpCaveat","Caveat",cursive;font-weight:700;font-size:24px;color:#fff6dc}
.mht__h--ny .mht__t{font-family:"MhpCormorant","Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:25px;color:#f5efe4}
.mht__h--ny .mht__t em{color:#d9bd84;font-style:italic}
.mht__a{margin-top:auto;padding-top:6px;font:600 11px/1 "Ysabeau Infant",system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;display:inline-flex;gap:6px;align-items:center}
.mht__h--rz .mht__a{color:#f3d9a8}.mht__h--ny .mht__a{color:#e3c88b}
.mht__a i{font-style:normal;transition:transform .3s}
.mht__h:hover .mht__a i{transform:translateX(5px)}
.mht__ic{position:absolute;right:12px;top:12px}
.mht__star{display:block;width:22px;height:22px;animation:mhpSpin 22s linear infinite;filter:drop-shadow(0 0 6px rgba(243,217,168,.8))}
.mht__mask{display:block;width:46px;height:22px;transform-origin:50% 0;animation:mhpSwing 5s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(217,189,132,.5))}
.mht__st{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff6dc;box-shadow:0 0 6px 1px rgba(255,246,220,.8);animation:mhpTw 2.6s ease-in-out infinite}
.mht__gl{position:absolute;width:4px;height:4px;background:#f3e2b8;transform:rotate(45deg);animation:mhpTw 3s ease-in-out infinite}
.mht__h--ny::before{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(243,226,184,.18),transparent);transform:translateX(-130%) skewX(-16deg);animation:mhtSheen 5.5s ease-in-out infinite;pointer-events:none}
@keyframes mhtSheen{0%,55%{transform:translateX(-130%) skewX(-16deg)}100%{transform:translateX(330%) skewX(-16deg)}}
@keyframes mhpTw{0%,100%{opacity:.95;transform:scale(1)}50%{opacity:.25;transform:scale(.6)}}
@keyframes mhpSpin{to{transform:rotate(360deg)}}
@keyframes mhpSwing{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
.mht.is-open .mht__in{animation:mhtFloat 6s ease-in-out 1.2s infinite}
@keyframes mhtFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* телефон: полоска-квиток снизу */
@media (max-width:640px){
  .mhp-slot{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px))}
  .mht{width:auto;max-width:none}
  .mht--single{width:auto}
  .mht__h{min-height:96px;padding:10px 12px;gap:2px}
  .mht__d{font-size:24px}.mht__d small{display:none}
  .mht__k{font-size:8.5px;letter-spacing:.14em}
  .mht__h--rz .mht__t{font-size:18px}.mht__h--ny .mht__t{font-size:19px}
  .mht__a{font-size:9.5px;letter-spacing:.12em;padding-top:4px}
  .mht__ic{right:8px;top:8px}.mht__mask{width:34px;height:16px}.mht__star{width:16px;height:16px}
  .mht__x{top:-10px;right:-6px}
}

/* Старый боковой попап Modern «Маскарад 2027» (inline-скрипт в head, .mqa-pop) стоял в том же углу и перекрывал наш: пока работают праздничные попапы — он скрыт; после автовыключения этот CSS не подключается и старый попап возвращается. Наряд 2026-11-05_0935 */
.mqa-pop{display:none!important}
