/* motion.css — the scroll and entrance motion the reference stores use,
   as classes any Elementor element can carry (Advanced → CSS Classes).
   Hidden states apply only once motion.js has added html.rs-motion, so the
   page is fully visible without JavaScript, in the Elementor editor, and for
   anyone who prefers reduced motion. Timings are per-site custom properties:
   --rs-ease, --rs-reveal-dur, --rs-reveal-y, --rs-stagger.

   rs-reveal          rises and fades in as it enters the viewport
   rs-reveal-stagger  the same for each child in turn (motion.js marks them .rs-r)
   rs-words           a heading whose words rise into place one after another
   rs-clip            an image revealed top to bottom
   rs-kenburns        a slow drift on an image standing in for a background video
   rs-smart-header    a sticky header that slides away scrolling down, returns scrolling up */

:root {
	--rs-ease: cubic-bezier(0.23, 1, 0.32, 1);
	--rs-reveal-dur: 800ms;
	--rs-reveal-y: 20px;
	--rs-stagger: 70ms;
}

html.rs-motion .rs-reveal,
html.rs-motion .rs-r {
	opacity: 0;
	transform: translateY(var(--rs-reveal-y));
	transition: opacity var(--rs-reveal-dur) var(--rs-ease), transform var(--rs-reveal-dur) var(--rs-ease);
	transition-delay: calc(var(--rs-i, 0) * var(--rs-stagger));
}
html.rs-motion .rs-reveal.rs-in,
html.rs-motion .rs-in > .rs-r,
html.rs-motion .rs-in .rs-r { opacity: 1; transform: none; }

.rs-word { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: 0.1em; margin-bottom: -0.1em; }
.rs-word > span { display: inline-block; }
html.rs-motion .rs-words .rs-word > span {
	transform: translateY(110%);
	transition: transform 1000ms var(--rs-ease);
	transition-delay: calc(var(--rs-i, 0) * var(--rs-stagger));
}
html.rs-motion .rs-words.rs-in .rs-word > span { transform: none; }

html.rs-motion .rs-clip img { clip-path: inset(0 0 100% 0); transition: clip-path 1200ms var(--rs-ease); }
html.rs-motion .rs-clip.rs-in img { clip-path: inset(0 0 0 0); }

.rs-kenburns { overflow: hidden; }
html.rs-motion .rs-kenburns img { animation: rs-kenburns 24s ease-in-out infinite alternate; transform-origin: 60% 40%; }
@keyframes rs-kenburns { from { transform: scale(1); } to { transform: scale(1.08); } }

.rs-smart-header { transition: transform 300ms var(--rs-ease); will-change: transform; }
.rs-smart-header.rs-header-hidden { transform: translateY(-100%); }

/* rs-intro: see motion.js. The logo's travel is on-screen movement, so
   ease-in-out; everything else fades in after it, in --rs-d order (ms). */
html.rs-intro-lock, html.rs-intro-lock body { overflow: hidden; }
.rs-intro-moving { transition: transform 1100ms cubic-bezier(0.77, 0, 0.175, 1); }
.rs-intro-fade, html.rs-motion [data-elementor-type=header] .e-n-menu, html.rs-motion [data-elementor-type=header] .elementor-widget-woocommerce-menu-cart {
	transition: opacity 700ms var(--rs-ease) calc(600ms + var(--rs-d, 0) * 1ms);
}
html.rs-intro-wait .rs-intro-fade,
html.rs-intro-wait [data-elementor-type=header] .e-n-menu,
html.rs-intro-wait [data-elementor-type=header] .elementor-widget-nav-menu,
html.rs-intro-wait [data-elementor-type=header] .elementor-widget-woocommerce-menu-cart,
html.rs-intro-wait [data-elementor-type=header] .elementor-icon-wrapper:not(.rs-drawer *) { opacity: 0; pointer-events: none; }

/* rs-fade-slider: slides stacked in one cell, the active one shown. */
.rs-fade-slider { display: grid !important; }
.rs-fade-slider > .e-con-inner { display: grid !important; }
.rs-fade-slider .rs-slide { grid-area: 1 / 1; transition: opacity 500ms ease, visibility 0s linear 500ms; }
html.rs-motion .rs-fade-slider .rs-slide:not(.rs-active) { opacity: 0; visibility: hidden; }
html.rs-motion .rs-fade-slider .rs-slide.rs-active { opacity: 1; visibility: visible; transition: opacity 500ms ease, visibility 0s; }
html:not(.rs-motion) .rs-fade-slider .rs-slide ~ .rs-slide { display: none; }
/* In the editor every slide is laid out one under another, so each can be edited. */
body.elementor-editor-active .rs-fade-slider, body.elementor-editor-active .rs-fade-slider > .e-con-inner { display: flex !important; flex-direction: column; gap: 24px; }
body.elementor-editor-active .rs-fade-slider .rs-slide ~ .rs-slide { display: flex; }

/* rs-marquee: constant motion, so linear; edges fade out; pauses on hover. */
.rs-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
.rs-marquee .elementor-heading-title { white-space: nowrap; }
.rs-mq-track { display: inline-flex; align-items: center; animation: rs-mq 40s linear infinite; will-change: transform; }
.rs-mq-item { padding: 0 0.22em; }
.rs-mq-dot { width: 0.1em; height: 0.1em; border-radius: 50%; background: var(--e-global-color-accent); flex: none; }
.rs-marquee:hover .rs-mq-track { animation-play-state: paused; }
@keyframes rs-mq { to { transform: translateX(-50%); } }

/* Pressable things answer the press. */
.elementor-button, .rs-chip, .single_add_to_cart_button { transition: transform 160ms ease-out, background-color 200ms ease, color 200ms ease, border-color 200ms ease; }
.elementor-button:active, .rs-chip:active, .single_add_to_cart_button:active { transform: scale(0.97); }

@media (prefers-reduced-motion: reduce) {
	html.rs-motion .rs-reveal, html.rs-motion .rs-r, html.rs-motion .rs-words .rs-word > span, html.rs-motion .rs-clip img {
		opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important;
	}
	html.rs-motion .rs-kenburns img, .rs-mq-track { animation: none; }
	.rs-smart-header { transition: none; }
}

/* rs-strip: a draggable row of images wider than the screen. */
.rs-strip { overflow-x: auto !important; overflow-y: hidden; flex-wrap: nowrap !important; scrollbar-width: none; cursor: grab; overscroll-behavior-x: contain; }
.rs-strip::-webkit-scrollbar { display: none; }
.rs-strip.rs-dragging { cursor: grabbing; user-select: none; }
.rs-strip > .elementor-widget-image { flex: none !important; }
.rs-strip img { display: block; height: 100%; object-fit: cover; -webkit-user-drag: none; pointer-events: none; }
.rs-strip-wrap { position: relative; }
.rs-strip-caption { position: absolute !important; left: 20px; bottom: 20px; z-index: 2; pointer-events: none; }

/* Slider pagers (motion.js): numbered dots and an item row, the active one marked. */
.rs-dots { display: flex; flex-direction: row; gap: 8px; }
.rs-dots .rs-dot { width: 28px; height: 28px; border-radius: 50%; border: 0; padding: 0; background: #666; color: #fff; font: inherit; font-size: 12px; line-height: 28px; text-align: center; cursor: pointer; transition: background-color 200ms ease, color 200ms ease, transform 160ms ease-out; }
.rs-dots .rs-dot.rs-active { background: #fff; color: #000; }
.rs-dots .rs-dot:active { transform: scale(0.96); }
.rs-pager > *, .rs-pager > .e-con-inner > * { cursor: pointer; transition: opacity 300ms ease, transform 500ms cubic-bezier(0.23, 1, 0.32, 1); opacity: .45; }
.rs-pager .rs-active { opacity: 1; transform: scale(1.12); }
@media (prefers-reduced-motion: reduce) { .rs-pager > *, .rs-pager > .e-con-inner > * { transition: opacity 200ms ease; } .rs-pager .rs-active { transform: none; } }

/* Quiz (quiz.js): one step at a time, fading between them. */
.rs-quiz.rs-quiz-on { display: grid !important; }
.rs-quiz.rs-quiz-on > .e-con-inner { display: grid !important; }
.rs-quiz.rs-quiz-on .rs-quiz-step { grid-area: 1 / 1; transition: opacity 300ms ease, transform 300ms cubic-bezier(0.23, 1, 0.32, 1), visibility 0s linear 300ms; }
.rs-quiz.rs-quiz-on .rs-quiz-step:not(.rs-active) { opacity: 0; visibility: hidden; transform: translateY(8px); pointer-events: none; }
.rs-quiz.rs-quiz-on .rs-quiz-step.rs-active { opacity: 1; visibility: visible; transform: none; transition: opacity 300ms ease, transform 300ms cubic-bezier(0.23, 1, 0.32, 1), visibility 0s; }
@media (prefers-reduced-motion: reduce) { .rs-quiz.rs-quiz-on .rs-quiz-step { transition: opacity 150ms ease, visibility 0s linear 150ms; transform: none !important; } }