/* MM Film — scroll-grown video card (ported from the DÉCAAR Scroll Film). */
.mm-film { height: calc(var(--mm-film-len, 240) * 1vh); height: calc(var(--mm-film-len, 240) * 1svh); }
.mm-film .mm-film__stage { position: sticky; top: var(--mm-hdr); height: calc(100vh - var(--mm-hdr)); height: calc(100svh - var(--mm-hdr)); overflow: hidden; display: grid; place-items: center; }
.mm-film .mm-film__frame { position: relative; width: calc(var(--w, 46) * 1vw); height: calc(var(--h, 52) * (100svh - var(--mm-hdr)) / 100); border-radius: calc(var(--rad, 22) * 1px); overflow: hidden; will-change: width, height; background: #1d1d1f; }
.mm-film .mm-film__frame video { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; transform: scale(var(--vs, 1.15)); }
.mm-film .mm-film__frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(16, 22, 56, .72)); opacity: var(--shade, 0); pointer-events: none; }
.mm-film .mm-film__words { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; gap: 14px; padding: clamp(24px, 5vw, 72px); color: #fff; pointer-events: none; }
.mm-film .mm-film__h { margin: 0; font-size: clamp(32px, 4.4vw, 60px); font-weight: 700; letter-spacing: -0.032em; line-height: 1.04; max-width: 16ch; color: #fff; opacity: var(--tx, 0); transform: translateY(calc((1 - var(--tx, 0)) * 30px)); }
.mm-film .mm-film__words p { margin: 0; max-width: 46ch; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.4; color: rgba(255, 255, 255, .88); opacity: var(--tx, 0); }
.mm-film .mm-film__side { position: absolute; z-index: 1; top: 50%; transform: translateY(-50%); font-size: clamp(30px, 3.6vw, 56px); font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; color: var(--mm-ink); opacity: var(--side, 1); white-space: nowrap; }
.mm-film.tone-black .mm-film__side { color: #f5f5f7; }
.mm-film .mm-film__side--r { color: var(--mm-navy); }
.mm-film .mm-film__side--l { right: calc(50% + var(--fw, 46) * .5vw + 28px); }
.mm-film .mm-film__side--r { left: calc(50% + var(--fw, 46) * .5vw + 28px); }
.mm-film .mm-film__ctrl { position: absolute; z-index: 3; right: clamp(16px, 3vw, 36px); bottom: clamp(16px, 3vw, 36px); width: 46px !important; height: 46px !important; padding: 0 !important; border-radius: 50% !important; border: 1px solid rgba(255, 255, 255, .6) !important; background: rgba(16, 22, 56, .3) !important; color: #fff !important; display: grid; place-items: center; cursor: pointer; box-shadow: none !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.mm-film .mm-film__ctrl:hover, .mm-film .mm-film__ctrl:focus-visible { background: rgba(16, 22, 56, .55) !important; }
.mm-film .mm-film__ctrl svg { width: 16px; height: 16px; }
.elementor-editor-active .mm-film { height: auto; }
.elementor-editor-active .mm-film .mm-film__stage { position: relative; top: 0; height: 70vh; }

@media (max-width: 833px) {
	.mm-film { height: auto; padding: 8px 0 40px; }
	.mm-film .mm-film__stage { position: static; height: auto; display: block; padding: 0 var(--mm-gut); }
	.mm-film .mm-film__frame { width: 100% !important; height: 62svh !important; max-height: 560px; border-radius: 22px !important; }
	.mm-film .mm-film__frame video { transform: none !important; }
	.mm-film .mm-film__frame::after { opacity: 1 !important; }
	.mm-film .mm-film__h, .mm-film .mm-film__words p { opacity: 1 !important; transform: none !important; }
	.mm-film .mm-film__h { font-size: 30px; }
	.mm-film .mm-film__words p { font-size: 16px; }
	.mm-film .mm-film__side { display: none; }
}
