/*
 * Keep Revision's global header aligned with Elementor Top page containers.
 * Static prototypes and dynamic templates share the same 1248px outer width.
 */
.et-landing-page .cs-header > .cs-container {
	max-width: 1248px;
	padding-right: 24px;
	padding-left: 24px;
}

.site-skip-link {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 10000;
	transform: translateY(-140%);
	padding: 12px 16px;
	border-radius: 10px;
	background: var(--cs-color-primary, #29294B);
	color: #FFFFFF;
	font-size: .9375rem;
	font-weight: 800;
	text-decoration: none;
	box-shadow: 0 12px 30px rgba(41, 41, 75, .22);
	transition: transform .2s ease;
}

.site-skip-link:focus-visible {
	transform: translateY(0);
	outline: 3px solid var(--cs-color-accent, #5955D1);
	outline-offset: 3px;
}

body:not(.cs-offcanvas-active) .cs-offcanvas {
	visibility: hidden;
	pointer-events: none;
}

body.cs-offcanvas-active .cs-offcanvas {
	visibility: visible;
	pointer-events: auto;
}

/*
 * Revision switches its accent token to white in dark mode. Elementor Top
 * prototype components use the accent as an active/control background, so keep
 * a saturated brand accent on custom landing pages to preserve contrast.
 */
body[data-scheme="dark"].et-landing-page {
	--cs-color-accent: #9d9aff;
	--cs-color-button: linear-gradient(180deg, #665ee8 0%, #514dcc 100%);
	--cs-color-button-hover: linear-gradient(180deg, #5f56df 0%, #4338ca 100%);
	--cs-color-box-shadow-rgb: 157, 154, 255;
}

body[data-scheme="dark"].et-landing-page .cs-logo-default {
	display: none !important;
}

body[data-scheme="dark"].et-landing-page .cs-logo-dark {
	display: block !important;
	opacity: 1;
}

body[data-scheme="dark"].et-landing-page .tab-btn.active {
	border-color: #665ee8 !important;
	background: linear-gradient(180deg, #665ee8 0%, #514dcc 100%) !important;
	color: #ffffff !important;
	box-shadow: 0 10px 24px rgba(93, 89, 224, .32);
}

body[data-scheme="dark"].et-landing-page .tab-btn:not(.active):hover,
body[data-scheme="dark"].et-landing-page .lp-btn-primary:hover {
	background: linear-gradient(180deg, #5f56df 0%, #4338ca 100%) !important;
	color: #ffffff !important;
}

body[data-scheme="dark"].et-landing-page .service-icon-box,
body[data-scheme="dark"].et-landing-page .pricing-icon-box,
body[data-scheme="dark"].et-landing-page .included-icon,
body[data-scheme="dark"].et-landing-page .outcome-icon,
body[data-scheme="dark"].et-landing-page .process-icon-wrapper,
body[data-scheme="dark"].et-landing-page .start-icon {
	background: rgba(157, 154, 255, .14) !important;
	color: #c4c2ff !important;
}

body[data-scheme="dark"].et-landing-page .service-card:hover .service-icon-box,
body[data-scheme="dark"].et-landing-page .pricing-card:hover .pricing-icon-box {
	background: #665ee8 !important;
	color: #ffffff !important;
}

/*
 * Present Polylang's dropdown markup as the same segmented control used by
 * Revision's light/dark theme switcher.
 */
.cs-header__nav-inner > li.pll-parent-menu-item {
	display: flex;
	align-self: center;
	align-items: center;
	gap: 8px;
	height: auto;
	padding: 4px;
	border-radius: 30px;
	background: var(--cs-color-highlight-background);
}

.cs-header__nav-inner > li.pll-parent-menu-item > a,
.cs-header__nav-inner > li.pll-parent-menu-item > .sub-menu a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	min-width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	box-shadow: none;
	color: var(--cs-color-primary);
	font-size: .75rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .02em;
	text-transform: uppercase;
	transition:
		background-color .2s ease,
		color .2s ease;
}

.cs-header__nav-inner > li.pll-parent-menu-item > a {
	background: var(--cs-layout-background);
}

.cs-header__nav-inner > li.pll-parent-menu-item > a::before,
.cs-header__nav-inner > li.pll-parent-menu-item > a::after {
	content: none;
}

.cs-header__nav-inner > li.pll-parent-menu-item a > span {
	padding: 0;
	background: none;
	color: inherit;
}

.cs-header__nav-inner > li.pll-parent-menu-item .et-language-code {
	transition: opacity .25s ease;
}

.cs-header__nav-inner > li.pll-parent-menu-item a:hover .et-language-code {
	opacity: .7;
}

.cs-header__nav-inner > li.pll-parent-menu-item a:focus-visible {
	outline: 2px solid var(--cs-color-accent);
	outline-offset: 2px;
}

.cs-header__nav-inner > li.pll-parent-menu-item > .sub-menu,
.cs-header__nav-inner > li.pll-parent-menu-item.submenu-visible > .sub-menu {
	position: static;
	display: flex;
	gap: 8px;
	inset: auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	transform: none;
	opacity: 1;
	visibility: visible;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	transition: none;
}

.cs-header__nav-inner > li.pll-parent-menu-item:not(.touch-device):hover > .sub-menu {
	position: static;
	inset: auto;
	opacity: 1;
	visibility: visible;
	background: transparent;
	transition: none;
}

.cs-header__nav-inner > .pll-parent-menu-item > .sub-menu > li,
.cs-header__nav-inner > .pll-parent-menu-item > .sub-menu > li:not(:first-child) {
	margin: 0;
}

.cs-header__nav-inner > .pll-parent-menu-item > .sub-menu > li:hover {
	transform: none;
}

.cs-header__nav-inner > .pll-parent-menu-item > .sub-menu > li::before,
.cs-header__nav-inner > .pll-parent-menu-item > .sub-menu > li::after {
	content: none;
}

.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item {
	display: inline-flex;
	align-items: center;
	gap: 0;
	width: auto;
	padding: 4px;
	border-radius: 30px;
	background: var(--cs-color-highlight-background);
}

.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item > a,
.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item > .sub-menu a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	min-width: 40px;
	min-height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--cs-color-primary);
	font-size: .75rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item > a {
	background: var(--cs-layout-background);
	box-shadow: 0 1px 3px rgba(var(--cs-color-box-shadow-rgb), .1);
}

.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item > span {
	display: none;
}

.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item > .sub-menu {
	display: flex;
	width: auto;
	padding: 0;
}

.cs-offcanvas .widget_nav_menu li.pll-parent-menu-item > .sub-menu > li {
	display: flex;
	margin: 0;
	list-style: none;
}

@media (max-width: 1200px) {
	.et-landing-page .cs-header > .cs-container {
		padding-right: 28px;
		padding-left: 28px;
	}
}

@media (min-width: 992px) and (max-width: 1100px) {
	.et-landing-page .cs-header__inner-desktop .cs-header__col.cs-col-right {
		flex: 0 0 auto;
		min-width: 0;
		padding-left: 12px;
	}

	.et-landing-page .cs-header__inner-desktop .cs-site-scheme-toggle {
		display: none;
	}

	.et-landing-page .cs-header__inner-desktop .cs-header__search-toggle {
		display: none;
	}
}

@media (max-width: 768px) {
	.et-landing-page .cs-header > .cs-container {
		padding-right: 20px;
		padding-left: 20px;
	}
}

@media (max-width: 576px) {
	.et-landing-page .cs-header > .cs-container {
		padding-right: 16px;
		padding-left: 16px;
	}
}

/*
 * Plugin toolbar nodes can make WordPress's logged-in admin bar wider than a
 * mobile viewport. Contain that private UI without affecting public layouts.
 */
@media (max-width: 782px) {
	body.admin-bar.et-landing-page {
		max-width: 100%;
		overflow-x: clip;
	}

	body.admin-bar #wpadminbar {
		width: 100%;
		min-width: 0;
		max-width: 100vw;
		overflow-x: clip;
		contain: inline-size;
	}
}

@media (max-width: 360px) {
	.et-landing-page .cs-header__inner-mobile .cs-header__col.cs-col-left,
	.et-landing-page .cs-header__inner-mobile .cs-header__col.cs-col-right {
		padding-right: 0;
		padding-left: 0;
	}

	.et-landing-page .cs-header__inner-mobile .cs-header__logo img {
		width: auto;
		max-width: 160px;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto !important;
	}

	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
}
