/* THEMAN Site Kit — component styles and light motion.
   Colours and type come from Elementor's global variables (Site Settings), so editing a global restyles this too. */

:root {
	--tm-orange: var(--e-global-color-wix23, #ED5829);
	--tm-black: var(--e-global-color-wix15, #000);
	--tm-white: var(--e-global-color-wix11, #fff);
	--tm-grey: var(--e-global-color-wix13, #C7C7C7);
	--tm-ease: cubic-bezier(.2, .7, .2, 1);
	--tm-header-h: 76px;
}
@media (max-width: 1024px) { :root { --tm-header-h: 68px; } }
@media (max-width: 767px) { :root { --tm-header-h: 64px; } }

html { scroll-behavior: smooth; }
body { background: var(--tm-black); color: var(--tm-white); -webkit-font-smoothing: antialiased; }
::selection { background: var(--tm-orange); color: var(--tm-white); }
:focus-visible { outline: 2px solid var(--tm-orange); outline-offset: 3px; }
.tm-sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ------------------------------------------------------------------ text */
.tm-accent { color: var(--tm-orange); }
.tm-text p { margin: 0 0 1em; }
.tm-text p:last-child { margin-bottom: 0; }
.tm-text a, .tm-heading .elementor-heading-title a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; transition: color .25s; }
.tm-text a:hover, .tm-heading .elementor-heading-title a:hover { color: var(--tm-orange); }
.tm-heading .elementor-heading-title a .tm-accent, .tm-text a .tm-accent { text-decoration: inherit; }
.tm-heading .elementor-heading-title { overflow-wrap: break-word; hyphens: manual; }
/* Big titles in a narrow text column scale with the viewport so long names ("Elektrodashline") stay on one line. */
.tm-col--text .tm-heading :is(h1, h2).elementor-heading-title { font-size: min(var(--e-global-typography-tmh2-font-size, 60px), 3.6vw); }
@media (max-width: 767px) { .tm-col--text .tm-heading :is(h1, h2).elementor-heading-title { font-size: min(var(--e-global-typography-tmh2-font-size, 34px), 9.5vw); } }
.tm-eyebrow .elementor-heading-title { display: inline-flex; align-items: center; gap: .75em; }
.tm-eyebrow .elementor-heading-title::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.tm-light { color: var(--tm-black); }

/* Link lists (Matthew Law releases, interviews…) */
.tm-links { list-style: none; margin: 0; padding: 0; }
.tm-links li { border-top: 1px solid color-mix(in srgb, currentColor 22%, transparent); }
.tm-links li:last-child { border-bottom: 1px solid color-mix(in srgb, currentColor 22%, transparent); }
.tm-links a { display: flex; justify-content: space-between; align-items: baseline; gap: 1em; padding: .55em 0; text-decoration: none !important; transition: color .25s, padding .35s var(--tm-ease); }
.tm-links a::after { content: "↗"; font-size: .8em; opacity: .5; transition: transform .35s var(--tm-ease), opacity .25s; }
.tm-links a:hover { color: var(--tm-orange); padding-left: .4em; }
.tm-links a:hover::after { transform: translate(3px, -3px); opacity: 1; }

/* ------------------------------------------------------------------ buttons */
.tm-btn .elementor-button { transition: background-color .3s, color .3s, border-color .3s, transform .3s var(--tm-ease); }
.tm-btn--arrow .elementor-button-text { display: inline-flex; align-items: center; gap: .65em; }
.tm-btn--arrow .elementor-button-text::after {
	content: ""; width: 1em; height: 1em; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15m-6-6 6 6-6 6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15m-6-6 6 6-6 6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .35s var(--tm-ease);
}
.tm-btn .elementor-button:hover .elementor-button-text::after { transform: translateX(4px); }
.tm-btn .elementor-button:active { transform: scale(.98); }
.tm-yt .elementor-button-text::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 4.5v15l12-7.5z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 4.5v15l12-7.5z'/%3E%3C/svg%3E"); }

/* ------------------------------------------------------------------ layout pieces */
.tm-hero--statement .elementor-heading-title { max-width: 22ch; }
.tm-hero--statement { gap: 24px; }
.tm-hero--statement.tm-hero .tm-text { max-width: 46ch; }
.e-con.tm-stack > .elementor-widget.elementor-widget-text-editor { max-width: 820px; }

/* Duo rows: media column next to text column */
.tm-duo { position: relative; overflow: hidden; }
.tm-col--media { position: relative; overflow: hidden; transition: transform 1.4s var(--tm-ease); background-color: #111; }
.tm-col--text { position: relative; z-index: 1; }
@media (hover: hover) { .tm-duo:hover .tm-col--media:not(.tm-col--overlay) { transform: scale(1.025); } }
.tm-col--overlay::after, .tm-band--media.tm-has-text::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.75)); z-index: 0; }
.tm-col--overlay > * { position: relative; z-index: 1; }
.tm-col--overlay { color: #fff; }
.tm-col--overlay .elementor-heading-title, .tm-col--overlay .tm-text { color: #fff !important; }

/* Hero */
.tm-hero--media { position: relative; overflow: hidden; }
.tm-hero--media > .e-con-inner, .tm-hero--media > .elementor-element { position: relative; z-index: 2; }
@supports (animation-timeline: view()) {
	.tm-hero--media, .tm-band--media { animation: tm-parallax linear both; animation-timeline: view(); animation-range: exit -20% exit 100%; }
	@keyframes tm-parallax { from { background-position-y: 50%; } to { background-position-y: 80%; } }
}
.tm-hero--home { position: relative; overflow: hidden; }
.tm-hero--home::after { content: ""; position: absolute; inset: auto 0 0 0; height: 40%; background: linear-gradient(180deg, transparent, rgba(0,0,0,.55)); pointer-events: none; z-index: 1; }
.tm-hero--home > * { position: relative; z-index: 2; }
.tm-scrollcue { display: block; width: 1px; height: 56px; margin: 28px auto 0; background: rgba(255,255,255,.25); position: relative; overflow: hidden; }
.tm-scrollcue span { position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: #fff; animation: tm-cue 2.2s var(--tm-ease) infinite; }
@keyframes tm-cue { to { top: 100%; } }

/* Lazy background images: held back until theman.js marks the element (.is-bg) about 600px before it is on screen. */
html.tm-js body:not(.elementor-editor-active) .tm-lazybg:not(.is-bg) { background-image: none !important; }

/* Background videos (injected by theman.js) */
.tm-bgvideo { position: relative; }
.tm-bgvideo > .tm-video-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; opacity: 0; transition: opacity .8s; pointer-events: none; }
.tm-bgvideo > .tm-video-bg.is-playing { opacity: 1; }
.tm-bgvideo > *:not(.tm-video-bg) { position: relative; z-index: 2; }

/* Cover art next to text */
.tm-img--cover img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.tm-img img { transition: transform 1.2s var(--tm-ease), filter .6s; }
@media (hover: hover) { .tm-img:hover img { transform: scale(1.03); } }
.tm-img--wide img { width: 100%; max-height: 72vh; object-fit: cover; }
.tm-img { overflow: hidden; }

/* Embeds */
.tm-embed { position: relative; width: 100%; background: #111; }
.tm-embed iframe { display: block; width: 100%; border: 0; }
.tm-embed--soundcloud iframe { height: 360px; }
.tm-embed--spotify iframe { height: 152px; border-radius: 12px; }
.tm-embed--spotify.tm-embed--tall iframe { height: 452px; }
.tm-embed--spotify { background: transparent; }
@media (max-width: 767px) { .tm-embed--soundcloud iframe { height: 300px; } }

/* Marquee */
.tm-marquee { overflow: hidden; border-block: 1px solid rgba(255,255,255,.12); }
.tm-marquee__track { display: flex; width: max-content; color: var(--tm-marquee-color, #000); }
.tm-marquee__run { display: flex; flex-shrink: 0; gap: .6em; padding-right: .6em; animation: tm-marquee 32s linear infinite; font: 700 clamp(28px, 4.4vw, 60px)/1.25 "TeX Gyre Heros", Helvetica, Arial, sans-serif; letter-spacing: -.04em; text-transform: uppercase; white-space: nowrap; padding-block: .18em; }
.tm-marquee:hover .tm-marquee__run { animation-play-state: paused; }
@keyframes tm-marquee { to { transform: translateX(-100%); } }

/* Music index */
.tm-index__row { border-top: 1px solid rgba(255,255,255,.18); color: inherit; text-decoration: none; transition: background-color .4s; }
.tm-index__row:last-child { border-bottom: 1px solid rgba(255,255,255,.18); }
.tm-index__row > .tm-index__num { flex: 0 0 64px; padding-top: .9em; }
.tm-index__row > .tm-index__title { flex: 1 1 46%; }
.tm-index__title .elementor-heading-title { transition: color .3s, transform .5s var(--tm-ease); }
.tm-index__row > .tm-index__desc { flex: 1 1 34%; padding-top: .5em; }
.tm-index__row > .elementor-widget-html:last-child { flex: 0 0 auto; }
.tm-index__arrow { display: grid; place-items: center; width: 44px; height: 44px; margin-top: .4em; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; color: var(--tm-orange); transition: background-color .3s, border-color .3s, color .3s, transform .5s var(--tm-ease); }
.tm-index__arrow::after {
	content: ""; width: 18px; height: 18px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15m-6-6 6 6-6 6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15m-6-6 6 6-6 6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.tm-index__row:hover .tm-index__title .elementor-heading-title { color: var(--tm-orange); transform: translateX(10px); }
.tm-index__row:hover .tm-index__arrow { background: var(--tm-orange); border-color: var(--tm-orange); color: #fff; transform: rotate(-45deg); }
@media (max-width: 767px) { .tm-index__num { flex-basis: auto; padding-top: 0; } .tm-index__arrow { display: none; } }

/* Social icons: outline on dark, solid white on the home video, solid black on light sections */
.tm-social .elementor-social-icon { transition: background-color .3s, color .3s, transform .35s var(--tm-ease), border-color .3s; }
.tm-social--outline .elementor-social-icon { border: 1px solid rgba(255,255,255,.35); }
.tm-social .elementor-social-icon:hover { background: var(--tm-orange) !important; border-color: var(--tm-orange) !important; transform: translateY(-3px); }
.tm-social .elementor-social-icon:hover svg { fill: #fff !important; }

/* Gallery */
.tm-gallery .e-gallery-item { overflow: hidden; }

/* Video widget */
.tm-video .elementor-custom-embed-image-overlay::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.2); }

/* End-of-page navigation */
.tm-endnav { border-top: 1px solid rgba(255,255,255,.12); }
.tm-endnav.tm-light { border-top-color: rgba(0,0,0,.12); }

/* Forms */
.tm-form .elementor-field-group .elementor-field { background: transparent; border: 1px solid rgba(255,255,255,.45); border-radius: 0; color: #fff; padding: 14px 16px; transition: border-color .25s, background-color .25s; }
.tm-form .elementor-field-group .elementor-field:focus { border-color: var(--tm-orange); background: rgba(255,255,255,.04); box-shadow: none; }
.tm-form .elementor-field-label { color: #fff; margin-bottom: 8px; }
.tm-form .elementor-button { background: var(--tm-orange); color: #fff; border-radius: 0; transition: background-color .3s, color .3s; }
.tm-form .elementor-button:hover { background: #fff; color: #000; }
.tm-form--dark .elementor-field-group .elementor-field { border-color: rgba(0,0,0,.55); color: #000; }
.tm-form--dark .elementor-field-group .elementor-field:focus { border-color: #000; background: rgba(255,255,255,.12); }
.tm-form--dark .elementor-field-label { color: #000; }
.tm-form--dark .elementor-button { background: #000; color: #fff; }
.tm-form--dark .elementor-button:hover { background: #fff; color: #000; }
.tm-popup .tm-text a { color: #000; }
.tm-contact .tm-text a { text-decoration: none; }
.tm-contact .tm-text a:hover { color: var(--tm-orange); }

/* ------------------------------------------------------------------ header */
.elementor-location-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 100; }
.tm-header { transition: background-color .4s, min-height .4s; }
body.home .elementor-location-header { position: fixed; left: 0; right: 0; }
body.home:not(.tm-scrolled) .tm-header { background-color: transparent !important; background-image: linear-gradient(180deg, rgba(0,0,0,.55), transparent) !important; }
.tm-logo img { display: block; transition: transform .4s var(--tm-ease); }
.tm-logo:hover img { transform: rotate(-4deg) scale(1.04); }

/* Wix-style boxed menu: every item a bordered cell, current page filled white */
.tm-nav .elementor-nav-menu--main > .elementor-nav-menu { border: 1px solid #fff; }
.tm-nav .elementor-nav-menu--main > .elementor-nav-menu > li + li { border-left: 1px solid #fff; }
/* Fixed-height cells: the bar never changes size on hover (the menu font's own line-height would otherwise win). */
.tm-nav .elementor-nav-menu--main > .elementor-nav-menu { align-items: center; }
.tm-nav .elementor-nav-menu--main > .elementor-nav-menu > li { position: relative; display: flex; align-items: center; }
.tm-nav .elementor-nav-menu--main .elementor-item { position: relative; z-index: 0; display: flex; align-items: center; height: 40px; padding: 0 22px !important; line-height: 1 !important; color: #fff; background: transparent; transition: color .45s var(--tm-ease); }
.tm-nav .elementor-nav-menu--main .sub-menu { position: absolute !important; top: 100% !important; left: -1px !important; margin: 0 !important; }
.tm-nav .elementor-nav-menu--main .elementor-item::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--tm-orange); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .45s var(--tm-ease); }
.tm-nav .elementor-nav-menu--main .elementor-item:hover::before, .tm-nav .elementor-nav-menu--main .elementor-item:focus-visible::before, .tm-nav .elementor-nav-menu--main .elementor-item.highlighted::before { transform: scaleY(1); }
.tm-nav .elementor-nav-menu--main .elementor-item:hover, .tm-nav .elementor-nav-menu--main .elementor-item:focus { color: #fff; background: transparent; }
.tm-nav .elementor-nav-menu--main .elementor-item.elementor-item-active, .tm-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item { background: #fff; color: #000; }
.tm-nav .elementor-nav-menu--main .elementor-item.elementor-item-active:hover, .tm-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item:hover { color: #fff; }
.tm-nav .elementor-nav-menu--main .sub-menu { background: #000; border: 1px solid #fff; min-width: 220px !important; }
.tm-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item { position: relative; z-index: 0; color: #fff !important; background: #000 !important; padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,.15); transition: padding .4s var(--tm-ease); }
.tm-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--tm-orange); transform: scaleX(0); transform-origin: 0 50%; transition: transform .4s var(--tm-ease); }
.tm-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item:hover, .tm-nav .elementor-nav-menu--main .sub-menu .elementor-item-active { background: transparent !important; padding-left: 26px; }
.tm-nav .elementor-nav-menu--main .sub-menu .elementor-sub-item:hover::before, .tm-nav .elementor-nav-menu--main .sub-menu .elementor-item-active::before { transform: scaleX(1); }
/* Dropdown opens and closes smoothly both ways. SmartMenus toggles display instantly, so the panel stays rendered
   and the hover / keyboard / SmartMenus state (.highlighted) drives opacity, position and a top-down wipe instead. */
.tm-nav .elementor-nav-menu--main .sub-menu {
	display: block !important; opacity: 0; visibility: hidden; pointer-events: none;
	transform: translateY(10px); clip-path: inset(0 0 100% 0);
	transition: opacity .3s ease, transform .45s var(--tm-ease), clip-path .45s var(--tm-ease), visibility 0s linear .45s;
}
.tm-nav .elementor-nav-menu--main li:hover > .sub-menu,
.tm-nav .elementor-nav-menu--main li:focus-within > .sub-menu,
.tm-nav .elementor-nav-menu--main a.highlighted + .sub-menu {
	opacity: 1; visibility: visible; pointer-events: auto; transform: none; clip-path: inset(0 0 0 0);
	transition: opacity .3s ease, transform .45s var(--tm-ease), clip-path .45s var(--tm-ease), visibility 0s;
}
.tm-nav .elementor-nav-menu--main .sub-menu li { opacity: 0; transform: translateY(6px); transition: opacity .25s ease, transform .35s var(--tm-ease); }
.tm-nav .elementor-nav-menu--main li:hover > .sub-menu li,
.tm-nav .elementor-nav-menu--main li:focus-within > .sub-menu li,
.tm-nav .elementor-nav-menu--main a.highlighted + .sub-menu li { opacity: 1; transform: none; }
.tm-nav .elementor-nav-menu--main li:hover > .sub-menu li:nth-child(2), .tm-nav .elementor-nav-menu--main a.highlighted + .sub-menu li:nth-child(2) { transition-delay: .04s; }
.tm-nav .elementor-nav-menu--main li:hover > .sub-menu li:nth-child(3), .tm-nav .elementor-nav-menu--main a.highlighted + .sub-menu li:nth-child(3) { transition-delay: .08s; }
.tm-nav .elementor-nav-menu--main li:hover > .sub-menu li:nth-child(4), .tm-nav .elementor-nav-menu--main a.highlighted + .sub-menu li:nth-child(4) { transition-delay: .12s; }
/* The chevron turns as the panel opens. */
.tm-nav .elementor-nav-menu--main .sub-arrow { display: inline-flex; align-items: center; margin-left: 8px; padding: 0; transition: transform .45s var(--tm-ease); }
.tm-nav .elementor-nav-menu--main li:hover > a .sub-arrow, .tm-nav .elementor-nav-menu--main a.highlighted .sub-arrow { transform: rotate(180deg); }
.tm-nav .sub-arrow svg { fill: currentColor; width: .6em; }

/* Mobile / tablet: full-screen menu. Desktop sub-menus also carry .elementor-nav-menu--dropdown, so every rule is scoped to the toggle's container. */
.tm-nav .elementor-menu-toggle { background: transparent !important; color: #fff !important; font-size: 26px; }
.tm-nav .elementor-menu-toggle svg { fill: #fff !important; }
.tm-nav .elementor-nav-menu--dropdown.elementor-nav-menu__container {
	position: fixed; left: 0 !important; right: 0; top: calc(var(--tm-header-h) + var(--wp-admin--admin-bar--height, 0px)); width: 100vw !important;
	height: calc(100dvh - var(--tm-header-h) - var(--wp-admin--admin-bar--height, 0px)); max-height: none !important; overflow-y: auto;
	background: #000; padding: 24px 20px 48px; margin: 0 !important; transform: none !important;
	opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s;
}
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown.elementor-nav-menu__container { opacity: 1; visibility: visible; }
.tm-nav .elementor-nav-menu__container.elementor-nav-menu--dropdown .elementor-item { font-weight: 700; color: #fff; background: transparent; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.14); justify-content: space-between; }
.tm-nav .elementor-nav-menu__container.elementor-nav-menu--dropdown .elementor-item:hover, .tm-nav .elementor-nav-menu__container.elementor-nav-menu--dropdown .elementor-item.elementor-item-active { color: var(--tm-orange); background: transparent; }
.tm-nav .elementor-nav-menu__container.elementor-nav-menu--dropdown .sub-menu .elementor-sub-item { font-size: 20px; color: #C7C7C7; padding: 10px 0 10px 16px; background: transparent; border: 0; }
.tm-nav .elementor-nav-menu__container.elementor-nav-menu--dropdown li { opacity: 0; transform: translateY(14px); transition: opacity .45s, transform .45s var(--tm-ease); }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li { opacity: 1; transform: none; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(2) { transition-delay: .04s; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(3) { transition-delay: .08s; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(4) { transition-delay: .12s; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(5) { transition-delay: .16s; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(6) { transition-delay: .2s; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(7) { transition-delay: .24s; }
.tm-nav .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown li:nth-child(8) { transition-delay: .28s; }
body.tm-menu-open { overflow: hidden; }

/* ------------------------------------------------------------------ footer */
.tm-footer .tm-madein a { color: var(--tm-orange); text-decoration: underline; text-underline-offset: .15em; }
.tm-footer__rule { width: 100%; margin-top: 24px; }
.tm-footer__bottom { width: 100%; }
.tm-totop a { color: inherit; text-decoration: none; }
.tm-totop a:hover { color: var(--tm-orange); }

/* ------------------------------------------------------------------ YouTube lightbox */
.tm-yt-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; background: rgba(0,0,0,.92); opacity: 0; transition: opacity .3s; padding: 20px; }
.tm-yt-modal.is-open { opacity: 1; }
.tm-yt-modal__frame { width: min(1200px, 100%); aspect-ratio: 16 / 9; background: #000; transform: scale(.96); transition: transform .4s var(--tm-ease); }
.tm-yt-modal.is-open .tm-yt-modal__frame { transform: none; }
.tm-yt-modal iframe { width: 100%; height: 100%; border: 0; }
.tm-yt-modal__close { position: absolute; top: 16px; right: 20px; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; background: transparent; color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
.tm-yt-modal__close:hover { background: var(--tm-orange); border-color: var(--tm-orange); }

/* ------------------------------------------------------------------ motion
   Hidden states only apply once theman.js has marked <html class="tm-js">, and never in the editor. */
html.tm-js body:not(.elementor-editor-active) .tm-reveal { opacity: 0; transform: translateY(28px); }
/* Image reveal: a black curtain lifts off (clip-path on the element itself would stop IntersectionObserver firing). */
.tm-reveal-img { position: relative; }
html.tm-js body:not(.elementor-editor-active) .tm-reveal-img::before { content: ""; position: absolute; inset: 0; z-index: 3; background: #000; transform-origin: 50% 0; pointer-events: none; }
html.tm-js body:not(.elementor-editor-active) .tm-reveal-line { transform: scaleX(0); transform-origin: left; }
html.tm-js body:not(.elementor-editor-active) .tm-reveal.is-in { opacity: 1; transform: none; transition: opacity .9s var(--tm-ease) var(--tm-d, 0s), transform .9s var(--tm-ease) var(--tm-d, 0s); }
html.tm-js body:not(.elementor-editor-active) .tm-reveal-img.is-in::before { transform: scaleY(0); transition: transform 1.1s var(--tm-ease) var(--tm-d, 0s); }
html.tm-js body:not(.elementor-editor-active) .tm-reveal-line.is-in { transform: none; transition: transform 1.1s var(--tm-ease) var(--tm-d, 0s); }

/* Popups open after the page's reveal pass, so their content is always shown. */
html.tm-js body .elementor-popup-modal .tm-reveal { opacity: 1; transform: none; }
html.tm-js body .elementor-popup-modal .tm-reveal-img::before { display: none; }

/* Display headings: words rise in one by one (theman.js wraps them) */
.tm-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.tm-w > span { display: inline-block; }
html.tm-js body:not(.elementor-editor-active) .tm-split.tm-reveal { opacity: 1; transform: none; }
html.tm-js body:not(.elementor-editor-active) .tm-split .tm-w > span { transform: translateY(105%); }
html.tm-js body:not(.elementor-editor-active) .tm-split.is-in .tm-w > span { transform: none; transition: transform 1s var(--tm-ease) calc(var(--tm-d, 0s) + var(--tm-i, 0) * 45ms); }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	html.tm-js body .tm-reveal-img::before { display: none; }
	html.tm-js body .tm-reveal, html.tm-js body .tm-reveal-line, html.tm-js body .tm-split .tm-w > span { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
	.tm-marquee__run, .tm-scrollcue span { animation: none; }
	.tm-hero--media, .tm-band--media { animation: none !important; }
}

/* ------------------------------------------------------------------ lightbox (white, like the Wix gallery viewer) */
.elementor-lightbox .elementor-lightbox-image { box-shadow: none !important; }
.elementor-lightbox .elementor-swiper-button { color: #111 !important; opacity: 1; transition: color .25s; }
.elementor-lightbox .elementor-swiper-button svg { fill: currentColor !important; }
/* Only the icon grows: the button itself is a tall hit area that Elementor centres with transform. */
.elementor-lightbox .elementor-swiper-button:hover { color: var(--tm-orange) !important; }
.elementor-lightbox .elementor-swiper-button svg { transition: scale .3s var(--tm-ease); }
.elementor-lightbox .elementor-swiper-button:hover svg { scale: 1.2; }
.elementor-lightbox .elementor-swiper-button.swiper-button-disabled { opacity: .25; }
/* Header icons (fullscreen) sit left of the close button instead of under it. */
.elementor-lightbox .elementor-slideshow__header { padding-right: 72px !important; }
.elementor-lightbox .elementor-slideshow__header > svg, .elementor-lightbox .elementor-slideshow__header > i { color: #111; fill: #111; }
.elementor-lightbox .dialog-lightbox-close-button { color: #111 !important; }
.elementor-lightbox .dialog-lightbox-close-button svg { fill: #111 !important; }
.elementor-lightbox .dialog-lightbox-close-button:hover, .elementor-lightbox .dialog-lightbox-close-button:hover svg { color: var(--tm-orange) !important; fill: var(--tm-orange) !important; }
.elementor-lightbox .elementor-slideshow__footer { display: none; }