/* RezXs Motion 1.1.0
   Hooks are Elementor global classes that start with rx-m-. Nothing here touches other elements.
   html.rx-js     = the script is on its way (set in <head>, removed again if it never arrives)
   html.rx-ready  = the script has set its start states
   html.rx-reduce = the visitor asked for reduced motion: nothing below hides anything */

/* ── start states: only while the script is loading, so nothing flashes ─────────────── */
html.rx-js:not(.rx-ready) .rx-m-reveal,
html.rx-js:not(.rx-ready) .rx-m-stagger > *,
html.rx-js:not(.rx-ready) .rx-m-split,
html.rx-js:not(.rx-ready) .rx-m-rise > * { opacity: 0; }

/* ── rising headlines: every word rises out of its own line box ─────────────────────── */
.rx-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: 0.12em; margin-bottom: -0.12em; }
.rx-wi { display: inline-block; will-change: transform; }

/* ── scrolling mockups: hover a frame and the whole page scrolls past ───────────────── */
.rx-m-pan img { object-position: 50% 0%; transition: object-position 7s cubic-bezier(0.45, 0, 0.4, 1); }
.rx-m-pan:hover img, .rx-m-pan:focus-within img { object-position: 50% 100%; transition-duration: 9s; }
.rx-m-pan { transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); }
a.rx-m-pan:hover, .rx-m-pan:hover { transform: translateY(-4px); }
.rx-m-pan .rx-browser { transition: box-shadow 0.5s cubic-bezier(0.22, 1, 0.36, 1); }
.rx-m-pan:hover .rx-browser { box-shadow: 0 0 0 1px rgba(17, 24, 39, 0.08), 0 36px 60px -20px rgba(10, 25, 54, 0.45); }
.rx-m-pan .rx-link { transition: color 0.2s; }

/* ── template switcher: rows on one side, stacked screenshots on the other ──────────── */
.rx-m-switch-stage { display: grid !important; }
.rx-m-switch-stage > * { grid-area: 1 / 1; }
.rx-m-switch-stage > :not(:first-child) { opacity: 0; }
html.rx-ready .rx-m-switch-stage > * { opacity: 0; transform: scale(1.03); transition: opacity 0.6s ease, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1); }
html.rx-ready .rx-m-switch-stage > .is-active { opacity: 1; transform: none; }
html.rx-ready .rx-m-switch-item { position: relative; cursor: pointer; transition: opacity 0.3s ease; }
html.rx-ready .rx-m-switch-item:not(.is-active) { opacity: 0.5; }
html.rx-ready .rx-m-switch-item:hover { opacity: 1; }
.rx-switch-bar { position: absolute; top: -1px; left: 0; height: 2px; width: 100%; background-color: #E63312; transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
.rx-m-switch-item.is-active .rx-switch-bar { transform: scaleX(1); }
.rx-m-switch-item:focus-visible { outline: 2px solid #122E5C; outline-offset: 6px; border-radius: 4px; }

/* ── booking demo: search, rooms, confirmation ──────────────────────────────────────── */
html.rx-ready .rx-m-demo:not(.is-searched) .rx-m-demo-results { display: none; }
.rx-m-demo.is-done .rx-m-demo-search, .rx-m-demo.is-done .rx-m-demo-results { display: none; }
.rx-m-demo.is-done .rx-m-demo-done { display: flex !important; }
.rx-m-demo-go, .rx-m-demo-pick, .rx-m-demo-reset { cursor: pointer; user-select: none; }
.rx-m-demo-go.is-busy { opacity: 0.8; pointer-events: none; }
.rx-m-demo-go.is-busy::after { content: ''; display: inline-block; width: 0.9em; height: 0.9em; margin-left: 0.6em; border: 2px solid rgba(255, 255, 255, 0.45); border-top-color: #FFFFFF; border-radius: 50%; vertical-align: -0.1em; animation: rx-spin 0.7s linear infinite; }
@keyframes rx-spin { to { transform: rotate(360deg); } }
.rx-m-demo .rx-widget-field { transition: box-shadow 0.25s ease, background-color 0.25s ease; }
.rx-m-demo .rx-widget-field:hover { box-shadow: inset 0 0 0 1px #9DB2D6; background-color: #FFFFFF; }
.rx-m-demo-check { font-size: 0; display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 999px; background-color: #DCF3E6; }
.rx-m-demo-check::before { content: ''; width: 1.4rem; height: 1.4rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23157A47' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat; }

/* ── lines that draw themselves: the top rule of each child ─────────────────────────── */
html.rx-ready .rx-m-draw > * { border-top-color: transparent !important; background-repeat: no-repeat; background-position: 0 0; }
html.rx-ready .rx-m-draw > .rx-step { background-image: linear-gradient(#111827, #111827); background-size: 100% 2px; }
html.rx-ready .rx-m-draw > .rx-rule, html.rx-ready .rx-m-draw > .rx-ledger { background-image: linear-gradient(currentColor, currentColor); background-size: 100% 1px; }
html.rx-ready .rx-m-draw > .rx-rule { color: inherit; background-image: linear-gradient(#E5E7EB, #E5E7EB); }
html.rx-ready .rx-m-draw > .rx-ledger { background-image: linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)); }

/* ── statement text that fills in while you scroll ──────────────────────────────────── */
.rx-fw { transition: none; }

/* ── links: the arrow nudges ────────────────────────────────────────────────────────── */
.rx-step-arrow::after { transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1); }
.rx-step:hover .rx-step-arrow::after { transform: translateX(4px); }

/* ── reduced motion: everything visible, nothing moves ──────────────────────────────── */
html.rx-reduce .rx-m-pan img { transition: none; }
html.rx-reduce .rx-m-pan:hover img { object-position: 50% 0%; }

/* ── cards that rise on hover ───────────────────────────────────────────────────────── */
.rx-m-lift { transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1); }
.rx-m-lift:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -18px rgba(11, 15, 25, 0.35); }
html.rx-reduce .rx-m-lift:hover { transform: none; }
.rx-m-zoom { overflow: hidden; }