/* Motion Studio – frontend styles (all classes prefixed .ms-) */
.ms-slider-embed { position: relative; display: block; max-width: 100%; box-sizing: border-box; }
.ms-slider-embed:not([data-ms-init]) { min-height: 0; }
.ms-slider-embed.ms-pre-fullscreen { height: 100vh; height: 100dvh; }
.ms-slider-embed.ms-pre-auto { aspect-ratio: var(--ms-ar, 16/9); max-width: var(--ms-mw, 100%); margin-inline: auto; }
.ms-slider-embed.ms-pre-fullwidth { height: var(--ms-h, 600px); }
.ms-slider-embed.ms-ready, .ms-slider-embed[data-ms-init] { aspect-ratio: auto; height: auto; }

.ms-root { position: relative; display: block; max-width: none; box-sizing: border-box; -webkit-text-size-adjust: 100%; }
.ms-root *, .ms-root *::before, .ms-root *::after { box-sizing: border-box; }
.ms-viewport { position: relative; overflow: hidden; outline: none; isolation: isolate; }
.ms-type-carousel .ms-viewport { overflow: hidden; }
.ms-track { position: absolute; inset: 0; }
.ms-slide { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; visibility: hidden; backface-visibility: hidden; }
.ms-slide.ms-active { visibility: visible; }
.ms-carousel .ms-slide { visibility: visible; transition: transform var(--ms-cspeed, 700ms) cubic-bezier(.65, 0, .35, 1), opacity var(--ms-cspeed, 700ms) ease; will-change: transform; cursor: pointer; }
.ms-slide.ms-linked { cursor: pointer; }

.ms-bgc, .ms-bgm, .ms-ov, .ms-pat, .ms-stagewrap { position: absolute; inset: 0; }
.ms-bgm { will-change: transform; transform-origin: 50% 50%; }
.ms-bgvideo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ms-ov, .ms-pat { pointer-events: none; }
.ms-stagewrap { overflow: hidden; pointer-events: none; }
.ms-stage { position: absolute; left: 0; top: 0; transform-origin: 0 0; }

/* layers */
.ms-lp { position: absolute; pointer-events: auto; transition: scale .3s ease; }
.ms-lp:hover { scale: var(--ms-hs, 1); }
.ms-lc { will-change: transform, opacity; width: 100%; height: 100%; }
.ms-lb { margin: 0; opacity: var(--ms-bo, 1); transition: opacity .3s ease; position: relative; max-width: none; }
.ms-lp:hover .ms-lb { opacity: var(--ms-ho, var(--ms-bo, 1)); }
.ms-t-text, .ms-t-button { font-family: inherit; }
.ms-t-image img { display: block; max-width: none; user-select: none; -webkit-user-drag: none; }
.ms-t-video iframe, .ms-t-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.ms-t-video { overflow: hidden; background: #000; }
.ms-w { display: inline-block; white-space: nowrap; }
.ms-p { display: inline-block; will-change: transform, opacity; white-space: pre; }
.ms-t-button { cursor: pointer; }

/* arrows */
.ms-arrow { position: absolute; top: 50%; z-index: 20; width: var(--ms-nav-s, 46px); height: var(--ms-nav-s, 46px); margin-top: calc(var(--ms-nav-s, 46px) / -2); padding: 0; border: 0; color: var(--ms-nav-c, #fff); background: var(--ms-nav-bg, rgba(0, 0, 0, .35)); cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: calc(var(--ms-nav-s, 46px) * .5); transition: background .25s, transform .25s, opacity .25s; }
.ms-arrow:hover { transform: scale(1.08); }
.ms-arrow:disabled { opacity: .25; cursor: default; }
.ms-arrow.ms-prev { left: var(--ms-nav-i, 20px); }
.ms-arrow.ms-prev svg { transform: scaleX(-1); }
.ms-arrow.ms-next { right: var(--ms-nav-i, 20px); }
.ms-arrow-round { border-radius: 50%; }
.ms-arrow-square { border-radius: 4px; }
.ms-arrow-pill { border-radius: 40px; width: calc(var(--ms-nav-s, 46px) * 1.4); }
.ms-arrow-plain { background: transparent !important; font-size: calc(var(--ms-nav-s, 46px) * .9); }
.ms-arrow-plain:hover { transform: scale(1.15); }
.ms-arrow:focus-visible, .ms-bullet:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* bullets */
.ms-bullets { position: absolute; z-index: 20; display: flex; gap: 8px; }
.ms-bl-pos-bottom { left: 50%; bottom: var(--ms-bl-o, 22px); transform: translateX(-50%); }
.ms-bl-pos-top { left: 50%; top: var(--ms-bl-o, 22px); transform: translateX(-50%); }
.ms-bl-pos-left { left: var(--ms-bl-o, 22px); top: 50%; transform: translateY(-50%); flex-direction: column; }
.ms-bl-pos-right { right: var(--ms-bl-o, 22px); top: 50%; transform: translateY(-50%); flex-direction: column; }
.ms-bullet { padding: 0; border: 0; cursor: pointer; background: var(--ms-bl-c, rgba(255, 255, 255, .45)); width: var(--ms-bl-s, 10px); height: var(--ms-bl-s, 10px); border-radius: 50%; transition: all .3s; }
.ms-bullet.ms-on { background: var(--ms-bl-a, #fff); transform: scale(1.25); }
.ms-bl-lines .ms-bullet { border-radius: 2px; width: calc(var(--ms-bl-s, 10px) * 3); height: 3px; }
.ms-bl-lines .ms-bullet.ms-on { transform: none; width: calc(var(--ms-bl-s, 10px) * 5); }
.ms-bl-numbers .ms-bullet { width: auto; height: auto; min-width: 26px; padding: 4px 6px; border-radius: 4px; background: transparent; color: var(--ms-bl-c); font: 600 13px/1 system-ui, sans-serif; }
.ms-bl-numbers .ms-bullet.ms-on { color: var(--ms-bl-a); transform: none; border-bottom: 2px solid currentColor; border-radius: 0; }

/* progress */
.ms-progress { position: absolute; left: 0; right: 0; height: var(--ms-pg-h, 4px); background: rgba(255, 255, 255, .15); z-index: 19; pointer-events: none; }
.ms-pg-bottom { bottom: 0; }
.ms-pg-top { top: 0; }
.ms-progress-fill { height: 100%; background: var(--ms-pg-c, #fff); transform-origin: 0 50%; transform: scaleX(0); }

@media (max-width: 778px) { .ms-hide-mobile { display: none; } }
@media (prefers-reduced-motion: reduce) {
	.ms-lp, .ms-lb, .ms-arrow, .ms-bullet { transition: none; }
}
