/* Різдво в Грушевському + Best Western (Святвечір 24.12.2026, «Вишиванка») — стили страницы.
   Все классы с префиксом rz-, правила под .rz. Шрифт — сайта (inherit). Наряд 2026-11-04_0505.
   Эффекты уровня v2 Маскарада: плавно; НЕ зависят от «уменьшения движения» Windows,
   выключаются только кнопкой «вимкнути рух» в подвале сайта (html.ms-motion-off). */
.rz{--navy:#1c2b39;--red:#d50037;--gold:#e0a43a;--glow:#ffd08a;--pink:#ff4d76;--grey:#666968;--line:#d6d8da;--ease:cubic-bezier(.2,.8,.2,1);margin:0;width:100%;overflow-x:hidden;background:#fff;color:var(--navy);font-family:inherit;font-size:16px;line-height:1.6;-webkit-text-size-adjust:100%}
.rz *{box-sizing:border-box}
.rz h1,.rz h2,.rz h3{margin:0;text-transform:none}
.rz p{margin:0}
.rz a{color:var(--red)}
.rz a:hover{color:var(--navy)}
.rz button{font-family:inherit}
.rz [id]{scroll-margin-top:84px}

/* ключевые кадры */
@keyframes rzStitch{0%{opacity:0;transform:scale(0)}70%{opacity:1;transform:scale(1.25)}100%{opacity:1;transform:scale(1)}}
@keyframes rzGlow{0%,100%{filter:drop-shadow(0 0 6px rgba(255,208,138,.25))}50%{filter:drop-shadow(0 0 26px rgba(255,208,138,.75))}}
@keyframes rzFall{from{translate:0 0;rotate:0deg}to{translate:0 var(--fall,700px);rotate:180deg}}
@keyframes rzTw{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes rzRise{from{opacity:0;translate:0 40px}to{opacity:1;translate:0 0}}
@keyframes rzIn{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@keyframes rzMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes rzFlick{0%,100%{opacity:1}30%{opacity:.55}60%{opacity:.9}}
@keyframes rzBob{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes rzShine{0%{background-position:120% 0}60%,100%{background-position:-20% 0}}
@keyframes rzWiggle{0%,100%{rotate:0deg}25%{rotate:-7deg}75%{rotate:7deg}}
@keyframes rzProg{from{scale:0 1}to{scale:1 1}}

.rz .rz-st{opacity:0;transform-box:fill-box;transform-origin:center;animation:rzStitch .35s cubic-bezier(.3,1.5,.5,1) forwards}
.rz .rz-glow{animation:rzGlow 4s ease-in-out 3.2s infinite}
.rz .rz-flake{position:absolute;top:-30px;color:#fff;animation:rzFall linear infinite;will-change:translate,rotate}
.rz .rz-tw{position:absolute;background:#fff;animation:rzTw 3s ease-in-out infinite}
.rz .rz-in{animation:rzIn 1s var(--ease) both}
.rz .rz-marq{display:flex;width:max-content;animation:rzMarq 40s linear infinite}
.rz .rz-candle path.g{animation:rzFlick 1.4s ease-in-out infinite}
.rz .rz-candle--b path.g{animation-delay:-.7s}
.rz .rz-bob{animation:rzBob 3.6s ease-in-out infinite}
.rz .rz-shine{background:linear-gradient(110deg,#d50037 38%,#ff7a95 48%,#d50037 58%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rzShine 4.5s ease-in-out infinite}

/* вышитые значки: цвета берутся из переменных (их можно менять на самом svg) */
.rz .rz-ic{display:block}
.rz .rz-ic .r{fill:var(--ic-r,#d50037)}
.rz .rz-ic .g{fill:var(--ic-g,#e0a43a)}
.rz .rz-ic .n{fill:var(--ic-n,#1c2b39)}
.rz .rz-ic .w2{fill:var(--ic-w,#fff)}

/* кнопки, карточки, строки */
.rz .rz-btn{position:relative;overflow:hidden;transition:translate .3s,box-shadow .3s}
.rz .rz-btn:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);translate:-120% 0;transition:translate .7s ease}
.rz .rz-btn:hover{translate:0 -2px;box-shadow:0 14px 28px -12px rgba(213,0,55,.55)}
.rz .rz-btn:hover:after{translate:120% 0}
.rz .rz-card{transition:translate .4s,box-shadow .4s}
.rz .rz-card:hover{translate:0 -4px;box-shadow:0 24px 50px -24px rgba(28,43,57,.3)}
.rz .rz-card:hover svg{animation:rzWiggle .6s ease-in-out}
.rz .rz-row{transition:padding .35s,background-color .35s}
.rz .rz-row:hover{padding-left:14px!important;background:rgba(255,255,255,.06)}
.rz .rz-ph{overflow:hidden}
.rz .rz-ph img{transition:scale .7s var(--ease)}
.rz .rz-ph:hover img{scale:1.05}
.rz .rz-dark a:hover{color:inherit}
.rz .rz-kcell{border-left:1px solid rgba(255,255,255,.25)}

/* полоса прокрутки и появление блоков по прокрутке (где браузер умеет) */
.rz .rz-prog{position:fixed;left:0;top:0;width:100%;height:3px;background:#d50037;transform-origin:0 50%;scale:0 1;z-index:10000;pointer-events:none}
@supports (animation-timeline:scroll()){.rz .rz-prog{animation:rzProg linear both;animation-timeline:scroll(root)}}
html:has(.rz){scroll-behavior:smooth}
@keyframes rzRise2{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}
@keyframes rzTw2{0%,100%{opacity:.6}50%{opacity:1}}
@keyframes rzPop{from{opacity:0;scale:.7}to{opacity:1;scale:1}}
@keyframes rzBand{0%,100%{filter:brightness(1)}50%{filter:brightness(1.22) saturate(1.15)}}
@keyframes rzNum{0%,100%{text-shadow:0 0 0 rgba(255,77,118,0)}50%{text-shadow:0 0 12px rgba(255,77,118,.7)}}
.rz .rz-dark>svg{animation:rzBand 5s ease-in-out infinite}
.rz .rz-dark>svg:last-of-type{animation-delay:-2.5s}
.rz .rz-ic .g{animation:rzTw2 3.4s ease-in-out infinite}
.rz .rz-ic .r{animation:rzTw2 4.6s ease-in-out -1.2s infinite;animation-direction:alternate}
.rz .rz-row span:first-child{animation:rzNum 4s ease-in-out infinite}
@supports (animation-timeline:view()){.rz .rz-rev{animation:rzRise2 linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
.rz svg.rz-ic{animation:rzPop linear both;animation-timeline:view();animation-range:entry 10% entry 90%}}

/* условия: строки «название — значение» */
.rz .rz-term{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px 0}

/* переключатели «1 доба / 2 доби», «зі сніданком / без» */
.rz .rz-tog{display:flex;border:1px solid var(--navy)}
.rz .rz-tog button{min-height:46px;padding:0 20px;border:0;border-radius:0;background:transparent;color:var(--navy);font-size:14px;font-weight:600;cursor:pointer;transition:background-color .3s,color .3s}
.rz .rz-tog button.is-on{background:var(--navy);color:#fff}
.rz .rz-tog button:focus-visible{outline:2px solid var(--red);outline-offset:-4px}

/* таблица номеров */
.rz .rz-tr{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:14px}
.rz .rz-v{font-size:clamp(20px,2.4vw,30px);font-weight:400;line-height:1;transition:opacity .25s}
.rz .rz-v.rz-nil{font-size:15px;line-height:1.2;color:#8a8d8c}
.rz .rz-v.is-swap{opacity:0}

@media (max-width:560px){
	.rz .rz-term{grid-template-columns:96px minmax(0,1fr);gap:12px}
	.rz .rz-kcell{border-left:0;border-top:1px solid rgba(255,255,255,.25)}
}

/* «вимкнути рух» в подвале сайта: без анимаций, всё видно сразу */
html.ms-motion-off .rz *,html.ms-motion-off .rz *:before,html.ms-motion-off .rz *:after{animation:none!important;transition:none!important}
html.ms-motion-off .rz .rz-st,html.ms-motion-off .rz .rz-in,html.ms-motion-off .rz .rz-rev{opacity:1!important;translate:none!important}
html.ms-motion-off .rz .rz-flake,html.ms-motion-off .rz .rz-prog{display:none}
html.ms-motion-off .rz .rz-tw{opacity:.6}
html.ms-motion-off .rz .rz-shine{background:none;color:#d50037}

/* 2026-11-04 (слова владельца: эффектов не видно) — заметные эффекты: полосы «едут», значки парят, звезда дышит */
@keyframes rzDrift{from{transform:translateX(0)}to{transform:translateX(-48px)}}
@keyframes rzFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes rzBreath{0%,100%{scale:1}50%{scale:1.07}}
.rz .rz-dark>svg rect{width:calc(100% + 48px);animation:rzDrift 3.2s linear infinite}
.rz svg.rz-ic{animation:rzFloat 3.4s ease-in-out infinite}
.rz #rz-star,.rz #rz-star2{animation:rzGlow 4s ease-in-out 3.2s infinite,rzBreath 4.5s ease-in-out infinite}
@supports (animation-timeline:view()){.rz svg.rz-ic{animation:rzPop linear both,rzFloat 3.4s ease-in-out infinite;animation-timeline:view(),auto;animation-range:entry 10% entry 90%,normal}}
html.ms-motion-off .rz .rz-dark>svg rect{animation:none!important}

/* ===== Слой «живых» эффектов (rizdvo-fx.js), наряд 2026-11-04_0645 ответ 1. Только transform/opacity/clip-path. ===== */
.rz.rzx .rzw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.14em;margin-bottom:-.14em}
.rz.rzx .rzw-i{display:inline-block;transform:translate3d(0,112%,0);transition:transform 1s var(--ease)}
.rz.rzx .rzx-words.is-in .rzw-i{transform:none}
.rz.rzx .rz-dark h2 .rzw-i{background:linear-gradient(110deg,#fff 38%,#ffd08a 50%,#fff 62%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:rzShine 6s ease-in-out infinite}
.rz.rzx .rzx-band{clip-path:inset(0 99.6% 0 0);transition:clip-path 1.8s var(--ease)}
.rz.rzx .rzx-band.is-in{clip-path:inset(0 0 0 0)}
.rz.rzx .rzx-row{opacity:0;transform:translate3d(-26px,0,0);transition:opacity .8s var(--ease),transform .8s var(--ease),padding .35s,background-color .35s}
.rz.rzx .rzx-row.is-in{opacity:1;transform:none}
.rz.rzx .rzx-card{position:relative;overflow:hidden;transform-style:preserve-3d;transition:transform .25s ease-out,translate .4s,box-shadow .4s,opacity .8s,rotate .8s}
.rz.rzx .rzx-card:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(240px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.7),transparent 62%)}
.rz.rzx .rzx-card:hover:after{opacity:1}
@media (hover:none){
 .rz.rzx .rzx-card{opacity:0;transform:perspective(700px) rotateX(18deg) translate3d(0,34px,0);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--ci,0)*90ms)}
 .rz.rzx .rzx-card.is-in{opacity:1;transform:none}
}
.rz .rzx-tog{position:relative}
.rz .rzx-tog:before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w,0);transform:translateX(var(--x,0));background:var(--navy);transition:transform .38s var(--ease),width .38s var(--ease)}
.rz .rzx-tog button{position:relative;z-index:1}
.rz .rzx-tog button.is-on{background:transparent}
.rz .rzx-spot{position:absolute;left:0;top:0;width:640px;height:640px;border-radius:50%;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(circle,rgba(255,208,138,.28),transparent 62%);will-change:transform}
.rz .rzx-flake.rzx-near{filter:blur(1.2px)}
.rz a.rz-btn{transition:translate .3s,box-shadow .3s,transform .2s ease-out}
@keyframes rzSway{0%,100%{rotate:-3deg}50%{rotate:3deg}}
.rz svg.rz-ic{animation:rzPop linear both,rzFloat 3.4s ease-in-out infinite,rzSway 5s ease-in-out infinite}
@supports (animation-timeline:view()){.rz svg.rz-ic{animation:rzPop linear both,rzFloat 3.4s ease-in-out infinite,rzSway 5s ease-in-out infinite;animation-timeline:view(),auto,auto;animation-range:entry 10% entry 90%,normal,normal}}
html.ms-motion-off .rz .rzx-spot{display:none}