/******************************************************************
 * MOVIE RECORDS — GLOBAL HEADER
 ******************************************************************/

.mr-global-header {
	position: sticky !important;
	top: 0 !important;
	z-index: 9999 !important;

	width: 100% !important;
	box-sizing: border-box !important;

	padding-right: clamp(18px, 2.5vw, 44px) !important;
	padding-left: clamp(18px, 2.5vw, 44px) !important;

	background: rgba(5, 7, 11, 0.98) !important;

	border: 0 !important;
	border-bottom: 1px solid rgba(210, 216, 225, 0.32) !important;

	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.22) !important;

	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);

	transform: translate3d(0, 0, 0);
	transition: transform 280ms ease;
	will-change: transform;
}


/******************************************************************
 * INNER HEADER
 ******************************************************************/

.mr-global-header .mr-header,
.mr-global-header header,
.mr-global-header .wp-block-template-part,
.mr-global-header .wp-block-group,
.mr-global-header .wp-block-group-is-layout-constrained,
.mr-global-header .wp-block-group-is-layout-flex {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
}


/******************************************************************
 * HEADER ROW
 ******************************************************************/

.mr-global-header .mr-header-row {
	display: grid !important;
	grid-template-columns: 1fr auto 1fr !important;
	align-items: center !important;

	width: 100% !important;
	max-width: none !important;
	min-height: 44px;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
}


/******************************************************************
 * HEADER ELEMENTS
 ******************************************************************/

.mr-global-header .mr-header-logo {
	justify-self: start;
	margin-left: 0 !important;
}

.mr-global-header .mr-header-nav {
	justify-self: center;
}

.mr-global-header .mr-header-actions {
	justify-self: end;
	margin-right: 0 !important;
}

.mr-global-header,
.mr-global-header a,
.mr-global-header button,
.mr-header {
	font-family: var(--mr-font-family);
}

.mr-global-header a,
.mr-global-header button {
	color: #ffffff;
}


/******************************************************************
 * HEADER HIDE / SHOW
 ******************************************************************/

.mr-global-header.mr-header--hidden {
	transform: translateY(-110%);
}


/******************************************************************
 * MOBILE
 ******************************************************************/

@media (max-width: 620px) {
	.mr-global-header {
		padding-right: 16px !important;
		padding-left: 16px !important;
	}
}
