/**
 * Shared RockGlobal header authority.
 *
 * Loaded after page-level styles so the homepage, market, platform and Learn
 * templates all use one header geometry and interaction language.
 */

:root {
	--rg-header-gutter: clamp(24px, 4vw, 72px);
	--rg-header-ink: #f7f9ff;
	--rg-header-muted: #c5cede;
}

.rg-navigation-backdrop {
	position: fixed;
	z-index: 40;
	inset: 0;
	background: rgba(1, 7, 22, .52);
	-webkit-backdrop-filter: blur(4px) saturate(88%);
	backdrop-filter: blur(4px) saturate(88%);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateZ(0);
	transition: none;
}

.rg-navigation-backdrop[aria-hidden="false"] {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 100ms cubic-bezier(.4, 0, .2, 1);
}

/* JavaScript owns the accessible open state; these rules override the legacy
 * hover-only selector so Escape and backdrop dismissal remain authoritative. */
.s6-header .s6-navitem > .s6-nav-parent[aria-expanded="false"] + .s6-mega {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate(-50%, 4px);
	transition: none;
}

.s6-header .s6-navitem > .s6-nav-parent[aria-expanded="true"] + .s6-mega {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(-50%, 0);
	transition:
		opacity 100ms cubic-bezier(.4, 0, .2, 1),
		transform 100ms cubic-bezier(.4, 0, .2, 1);
}

@media (max-width: 1180px) {
	.rg-navigation-backdrop {
		display: none;
	}
}

.s6-header:not(.is-scrolled),
.rg-market-site .s6-header:not(.is-scrolled),
.rg-editorial-site > .s6-header:not(.is-scrolled),
.rg-platforms-site > .s6-header:not(.is-scrolled),
.rg-mt4-site > .s6-header:not(.is-scrolled),
.rg-mt5-site > .s6-header:not(.is-scrolled),
.rg-mobile-trading-site > .s6-header:not(.is-scrolled) {
	position: absolute !important;
	z-index: 50;
	top: 0 !important;
	right: 0 !important;
	left: 0 !important;
	width: 100% !important;
	max-width: none !important;
	height: 96px !important;
	box-sizing: border-box;
	padding-inline: var(--rg-header-gutter) !important;
	transform: none !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(143, 185, 255, .18) !important;
	border-radius: 0 !important;
	background: linear-gradient(90deg, rgba(2, 10, 27, .94), rgba(17, 27, 55, .9)) !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}

.s6-brand-lockup {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 10px;
	min-width: max-content;
}

.s6-brand-lockup .s6-brand {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	width: 188px;
	margin: 0;
}

.s6-anniversary {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	width: 140px;
	height: 56px;
	overflow: hidden;
}

.s6-anniversary img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: left center;
}

.s6-header .s6-navitem > .s6-nav-parent,
.s6-header .s6-login {
    color: var(--rg-header-muted) !important;
    font-family: Inter, Aptos, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
}

/* Page bundles must not change the dimensions of the shared language control. */
.s6-header .s6-language > a {
    font-family: Inter, Aptos, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Keep page-level platform button rules out of the shared header. */
.s6-header .s6-cta.s6-cta-small {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 17px !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    font-family: Inter, Aptos, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.s6-header .s6-head-actions {
    flex: 0 0 auto !important;
    min-width: 0 !important;
}

.s6-header .s6-navitem:hover > .s6-nav-parent,
.s6-header .s6-navitem:focus-within > .s6-nav-parent,
.s6-header .s6-login:hover,
.s6-header .s6-login:focus-visible {
	color: var(--rg-header-ink) !important;
}

/* The compact scroll header deliberately returns to the established floating
 * treatment and does not carry the anniversary badge. */
.s6-header.is-scrolled,
.rg-market-site .s6-header.is-scrolled,
.rg-editorial-site > .s6-header.is-scrolled,
.rg-platforms-site > .s6-header.is-scrolled,
.rg-mt4-site > .s6-header.is-scrolled,
.rg-mt5-site > .s6-header.is-scrolled,
.rg-mobile-trading-site > .s6-header.is-scrolled {
	position: fixed !important;
	z-index: 50;
	top: 12px !important;
	right: auto !important;
	left: 50% !important;
	width: min(1380px, calc(100% - clamp(16px, 2.5vw, 32px))) !important;
	height: clamp(66px, 5vw, 72px) !important;
	padding: 0 clamp(10px, 1.5vw, 18px) !important;
	transform: translateX(-50%) !important;
	border: 1px solid rgba(157, 190, 255, .18) !important;
	border-radius: 18px !important;
	background: rgba(8, 18, 38, .94) !important;
	box-shadow: 0 18px 48px rgba(1, 8, 25, .22) !important;
	-webkit-backdrop-filter: blur(18px);
	backdrop-filter: blur(18px);
}

/* Platform heroes extend behind their main navigation. Mask only the compact
 * header's top gutter with a flat strip so their rounded panels cannot show
 * through or create a false halo above the shared header. */
.rg-platforms-site > .s6-header.is-scrolled::before,
.rg-mt4-site > .s6-header.is-scrolled::before,
.rg-mt5-site > .s6-header.is-scrolled::before,
.rg-mobile-trading-site > .s6-header.is-scrolled::before {
	content: "";
	position: absolute;
	top: -12px;
	left: 50%;
	width: 100vw;
	height: 12px;
	transform: translateX(-50%);
	background: #f4f6fb;
	pointer-events: none;
}

.s6-header.is-scrolled .s6-anniversary {
	display: none;
}

.s6-header.is-scrolled .s6-brand-lockup {
	gap: 0;
}

.s6-header.is-scrolled .s6-brand-lockup .s6-brand {
	width: clamp(112px, 11.5vw, 160px);
}

/* Keep the complete desktop navigation inside narrower laptop viewports. */
@media (min-width: 1081px) and (max-width: 1599px) {
	:root {
		--rg-header-gutter: 22px;
	}

	.s6-header .s6-header-inner {
		gap: clamp(10px, 1.15vw, 18px) !important;
	}

	.s6-header .s6-brand-lockup {
		gap: 6px;
	}

	.s6-header .s6-brand-lockup .s6-brand {
		width: 150px;
	}

	.s6-header:not(.is-scrolled) .s6-anniversary {
		width: 96px;
		height: 44px;
	}

	.s6-header .s6-nav {
		gap: 0 !important;
	}

	.s6-header .s6-navitem > .s6-nav-parent {
		padding-inline: 7px !important;
		font-size: 14px !important;
	}

	.s6-header .s6-head-actions {
		gap: 6px !important;
	}

	.s6-header .s6-login {
		font-size: 14px !important;
		white-space: nowrap;
	}

	.s6-header .s6-cta.s6-cta-small {
		padding-inline: 11px !important;
		font-size: 14px !important;
		white-space: nowrap;
	}
}

@media (max-width: 1180px) {
	:root {
		--rg-header-gutter: 28px;
	}

	.s6-brand-lockup .s6-brand {
		width: 166px;
	}

	.s6-anniversary {
		width: 118px;
		height: 48px;
	}
}

@media (max-width: 1180px) {
	.s6-header:not(.is-scrolled),
	.rg-market-site .s6-header:not(.is-scrolled),
	.rg-editorial-site > .s6-header:not(.is-scrolled),
	.rg-platforms-site > .s6-header:not(.is-scrolled),
	.rg-mt4-site > .s6-header:not(.is-scrolled),
	.rg-mt5-site > .s6-header:not(.is-scrolled),
	.rg-mobile-trading-site > .s6-header:not(.is-scrolled) {
		height: 84px !important;
	}

	.s6-anniversary {
		width: 105px;
		height: 44px;
	}
}

@media (max-width: 760px) {
	:root {
		--rg-header-gutter: 18px;
	}

	.s6-brand-lockup {
		gap: 6px;
	}

	.s6-brand-lockup .s6-brand {
		width: clamp(124px, 34vw, 154px);
	}

	.s6-anniversary {
		width: 96px;
		height: 40px;
	}
}

@media (max-width: 420px) {
	.s6-brand-lockup .s6-brand,
	.s6-header.is-scrolled .s6-brand-lockup .s6-brand {
		width: 118px;
	}

	.s6-header .s6-header-inner {
		gap: 6px;
	}

	.s6-header .s6-language {
		min-width: 0;
		padding-inline: 7px;
	}

	.s6-anniversary {
		display: none;
	}
}