/* ==========================================================================
   Olton Golf Club - site header
   Everything here is prefixed ogc-hdr-. Nothing outside the header is styled.

   Contrast, measured against the brand palette (see handover notes):
     white on solid header rgba(26,29,84,.97)   14.40:1
     dropdown link, 78% white on navy            9.91:1
     wordmark "GOLF CLUB", 62% white on navy     6.75:1
     gold hairline on navy (non-text, >=3:1)     6.11:1
     white text over the brightest scrimmed hero 5.23:1
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fonts

   Self-hosted latin subsets under private family names, so they apply to the
   header only and the rest of the site keeps its current rendering.
   -------------------------------------------------------------------------- */

@font-face {
	font-family: "OGC Public Sans";
	src: url("fonts/ogc-public-sans-var-latin.woff2") format("woff2-variations"),
	     url("fonts/ogc-public-sans-var-latin.woff2") format("woff2");
	font-weight: 100 900; /* variable file, covers 400 and 500 */
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "OGC Cormorant";
	src: url("fonts/ogc-cormorant-garamond-400-latin.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* --------------------------------------------------------------------------
   Tokens
   -------------------------------------------------------------------------- */

:root {
	--ogc-hdr-navy: #1a1d54;
	--ogc-hdr-navy-solid: rgba(26, 29, 84, 0.97);
	--ogc-hdr-gold: #b5a162;

	--ogc-hdr-sans: "OGC Public Sans", "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
	--ogc-hdr-serif: "OGC Cormorant", "Cormorant Garamond", Georgia, "Times New Roman", serif;

	--ogc-hdr-h: 96px;         /* height at the top of the page */
	--ogc-hdr-h-solid: 72px;   /* height once scrolled */
	--ogc-hdr-pad: 56px;       /* side padding, desktop */
	--ogc-hdr-top: 0px;        /* admin bar offset, maintained in JS */

	--ogc-hdr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* --------------------------------------------------------------------------
   Let the Avada layout section collapse so the fixed header is the only
   thing occupying the top of the page.
   -------------------------------------------------------------------------- */

.fusion-tb-header {
	position: static;
	min-height: 0;
}

.fusion-tb-header .fusion-fullwidth {
	min-height: 0;
	padding-top: 0;
	padding-bottom: 0;
}

/* Avada's `.fusion-fullwidth .fusion-row{position:relative;z-index:10}` makes
   the row a stacking context. That traps the header's z-index inside it, so
   the mobile overlay - a direct child of <body> - paints over the crest and
   the Close button, leaving the menu with no way out. Dropping to auto removes
   the context without changing layout, so the header's 9999 competes at body
   level as intended.

   Three class levels, because a two-level selector only ties with Avada's and
   its compiled stylesheet is enqueued after this one. Scoped to the header
   layout section, so page content keeps Avada's stacking untouched. */
.fusion-tb-header .fusion-fullwidth .fusion-row,
.fusion-tb-header .fusion-builder-row.fusion-row {
	z-index: auto;
}

/* --------------------------------------------------------------------------
   Hold the line against Avada's global link styling.

   Avada sets a gold a:hover colour site-wide, which would turn the menu items
   gold on hover - against the brand rule that gold is never used for small
   text. Pin colour and decoration for every state on every header link; the
   underline and fill effects below are what signal hover instead.
   -------------------------------------------------------------------------- */

/* Decoration only - colour is pinned per component below, so nothing here
   has to out-specify the component rules. */
.ogc-hdr a,
.ogc-hdr a:link,
.ogc-hdr a:visited,
.ogc-hdr a:hover,
.ogc-hdr a:focus,
.ogc-hdr a:active,
.ogc-hdr-overlay a,
.ogc-hdr-overlay a:link,
.ogc-hdr-overlay a:visited,
.ogc-hdr-overlay a:hover,
.ogc-hdr-overlay a:focus,
.ogc-hdr-overlay a:active {
	text-decoration: none;
	border-bottom: 0;
	box-shadow: none;
}

.ogc-hdr button,
.ogc-hdr button:hover,
.ogc-hdr button:focus {
	color: #fff;
	background: none;
	box-shadow: none;
}

/* Beats Avada's bare `a:hover{color:var(--link_hover_color)}` (0,1,1). */
.ogc-hdr .ogc-hdr__link,
.ogc-hdr .ogc-hdr__link:link,
.ogc-hdr .ogc-hdr__link:visited,
.ogc-hdr .ogc-hdr__link:hover,
.ogc-hdr .ogc-hdr__link:focus,
.ogc-hdr .ogc-hdr__link:active,
.ogc-hdr .ogc-hdr__members,
.ogc-hdr .ogc-hdr__members:link,
.ogc-hdr .ogc-hdr__members:visited,
.ogc-hdr .ogc-hdr__members:hover,
.ogc-hdr .ogc-hdr__members:focus,
.ogc-hdr .ogc-hdr__members:active,
.ogc-hdr .ogc-hdr__brand,
.ogc-hdr .ogc-hdr__brand:hover,
.ogc-hdr .ogc-hdr__brand:focus,
.ogc-hdr-overlay .ogc-hdr-overlay__link,
.ogc-hdr-overlay .ogc-hdr-overlay__link:link,
.ogc-hdr-overlay .ogc-hdr-overlay__link:visited,
.ogc-hdr-overlay .ogc-hdr-overlay__link:hover,
.ogc-hdr-overlay .ogc-hdr-overlay__link:focus,
.ogc-hdr-overlay .ogc-hdr-overlay__link:active,
.ogc-hdr-overlay .ogc-hdr-overlay__tel,
.ogc-hdr-overlay .ogc-hdr-overlay__tel:hover,
.ogc-hdr-overlay .ogc-hdr-overlay__tel:focus {
	color: #fff;
}

.ogc-hdr .ogc-hdr__sublink,
.ogc-hdr .ogc-hdr__sublink:link,
.ogc-hdr .ogc-hdr__sublink:visited {
	color: rgba(255, 255, 255, 0.78);
}

.ogc-hdr .ogc-hdr__sublink:hover,
.ogc-hdr .ogc-hdr__sublink:focus,
.ogc-hdr .ogc-hdr__sublink:active,
.ogc-hdr .ogc-hdr__sublink[aria-current="page"] {
	color: #fff;
}

.ogc-hdr .ogc-hdr__book,
.ogc-hdr .ogc-hdr__book:link,
.ogc-hdr .ogc-hdr__book:visited {
	color: #fff;
}

.ogc-hdr .ogc-hdr__book:hover,
.ogc-hdr .ogc-hdr__book:focus,
.ogc-hdr .ogc-hdr__book:active,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--solid,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--solid:hover,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--solid:focus,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--ghost:hover,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--ghost:focus {
	color: var(--ogc-hdr-navy);
}

.ogc-hdr-overlay .ogc-hdr-overlay__btn--ghost,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--ghost:link,
.ogc-hdr-overlay .ogc-hdr-overlay__btn--ghost:visited {
	color: #fff;
}

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */

.ogc-hdr {
	position: fixed;
	top: var(--ogc-hdr-top);
	left: 0;
	right: 0;
	z-index: 9999;
	background: transparent;
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
	transition:
		transform 0.45s var(--ogc-hdr-ease),
		background-color 0.3s ease,
		border-color 0.3s ease;
	will-change: transform;
}

/* The scrim. Olton's heroes often blow out to pure white sky at the top, so
   white header text needs help. An eased ramp over 340px gets the worst hero
   to 5.23:1 while dissolving far more gently than a short linear band. */
.ogc-hdr::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 340px;
	z-index: -1;
	pointer-events: none;
	background: linear-gradient(
		to bottom,
		rgba(26, 29, 84, 0.70) 0,
		rgba(26, 29, 84, 0.66) 56px,
		rgba(26, 29, 84, 0.52) 110px,
		rgba(26, 29, 84, 0.28) 180px,
		rgba(26, 29, 84, 0.10) 260px,
		rgba(26, 29, 84, 0) 340px
	);
	transition: opacity 0.3s ease;
}

.ogc-hdr__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 24px;
	height: var(--ogc-hdr-h);
	padding: 0 var(--ogc-hdr-pad);
	transition: height 0.3s var(--ogc-hdr-ease);
}

/* Scrolled past 60px: solid navy, shorter, no scrim needed. */
.ogc-hdr--solid {
	background-color: var(--ogc-hdr-navy-solid);
	border-bottom-color: transparent;
}

.ogc-hdr--solid::before {
	opacity: 0;
}

.ogc-hdr--solid .ogc-hdr__inner {
	height: var(--ogc-hdr-h-solid);
}

/* Scrolling down past 120px. */
.ogc-hdr--hidden {
	transform: translateY(-100%);
}

/* Pages with no full-screen hero start solid, so white never lands on white. */
body.ogc-hdr-no-hero .ogc-hdr {
	background-color: var(--ogc-hdr-navy-solid);
	border-bottom-color: transparent;
}

body.ogc-hdr-no-hero .ogc-hdr::before {
	opacity: 0;
}

/* Screen-reader-only text. */
.ogc-hdr__sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* --------------------------------------------------------------------------
   Brand
   -------------------------------------------------------------------------- */

.ogc-hdr__brand {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	justify-self: start;
	text-decoration: none;
	border: 0;
}

.ogc-hdr__crest {
	display: block;
	height: 48px;
	width: auto;
	transition: height 0.3s var(--ogc-hdr-ease);
}

.ogc-hdr--solid .ogc-hdr__crest {
	height: 40px;
}

.ogc-hdr__wordmark {
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-family: var(--ogc-hdr-sans);
	color: #fff;
	line-height: 1.25;
}

.ogc-hdr__wordmark-top {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.34em;
	text-transform: uppercase;
	/* letter-spacing pads the right edge; pull it back so the block looks centred */
	margin-right: -0.34em;
}

.ogc-hdr__wordmark-bottom {
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.62);
	margin-right: -0.32em;
}

/* --------------------------------------------------------------------------
   Desktop menu
   -------------------------------------------------------------------------- */

.ogc-hdr__nav {
	justify-self: center;
}

.ogc-hdr__menu {
	display: flex;
	align-items: center;
	gap: 34px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ogc-hdr__item {
	position: relative;
	display: flex;
	align-items: center;
	height: var(--ogc-hdr-h);
	margin: 0;
	transition: height 0.3s var(--ogc-hdr-ease);
}

.ogc-hdr--solid .ogc-hdr__item {
	height: var(--ogc-hdr-h-solid);
}

.ogc-hdr__link {
	display: inline-flex;
	align-items: center;
	font-family: var(--ogc-hdr-sans);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	border: 0;
	white-space: nowrap;
}

/* Underline grows from the centre on hover and focus. White, not gold: over
   the brightest scrimmed hero a gold hairline falls to 1.98:1, white holds
   5.04:1. Gold is kept for the dropdown's top line, which is always on navy. */
.ogc-hdr__link-text {
	position: relative;
	display: inline-block;
	padding-bottom: 4px;
}

.ogc-hdr__link-text::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: #fff;
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 0.35s var(--ogc-hdr-ease);
}

.ogc-hdr__link:hover .ogc-hdr__link-text::after,
.ogc-hdr__link:focus-visible .ogc-hdr__link-text::after,
.ogc-hdr__members:hover .ogc-hdr__link-text::after,
.ogc-hdr__members:focus-visible .ogc-hdr__link-text::after,
.ogc-hdr__item.is-current .ogc-hdr__link-text::after {
	transform: scaleX(1);
}

.ogc-hdr__link:focus-visible,
.ogc-hdr__members:focus-visible,
.ogc-hdr__book:focus-visible,
.ogc-hdr__brand:focus-visible,
.ogc-hdr__toggle:focus-visible,
.ogc-hdr__subtoggle:focus-visible,
.ogc-hdr__sublink:focus-visible,
.ogc-hdr-overlay__link:focus-visible,
.ogc-hdr-overlay__btn:focus-visible,
.ogc-hdr-overlay__tel:focus-visible {
	outline: 1px solid #fff;
	outline-offset: 4px;
}

/* Caret / submenu toggle. Separate from the link so the parent item keeps a
   real destination on touch, which the link alone cannot do. */
.ogc-hdr__subtoggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 100%;
	padding: 0;
	margin-left: 2px;
	background: none;
	border: 0;
	cursor: pointer;
	color: #fff;
}

.ogc-hdr__caret {
	display: block;
	width: 5px;
	height: 5px;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform 0.25s var(--ogc-hdr-ease);
}

.ogc-hdr__item--has-sub:hover .ogc-hdr__caret,
.ogc-hdr__item--has-sub:focus-within .ogc-hdr__caret,
.ogc-hdr__item--has-sub.is-open .ogc-hdr__caret {
	transform: translateY(0) rotate(225deg);
}

/* --------------------------------------------------------------------------
   Dropdown
   -------------------------------------------------------------------------- */

.ogc-hdr__sub {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 240px;
	margin: 0;
	padding: 18px 0;
	list-style: none;
	background: var(--ogc-hdr-navy);
	border-top: 1px solid var(--ogc-hdr-gold);
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%) translateY(-6px);
	transition:
		opacity 0.25s ease,
		transform 0.25s var(--ogc-hdr-ease),
		visibility 0s linear 0.25s;
}

.ogc-hdr__item--has-sub:hover .ogc-hdr__sub,
.ogc-hdr__item--has-sub:focus-within .ogc-hdr__sub,
.ogc-hdr__item--has-sub.is-open .ogc-hdr__sub {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
	transition:
		opacity 0.25s ease,
		transform 0.25s var(--ogc-hdr-ease),
		visibility 0s linear 0s;
}

.ogc-hdr__subitem {
	margin: 0;
}

.ogc-hdr__sublink {
	display: block;
	padding: 9px 24px;
	font-family: var(--ogc-hdr-sans);
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.78);
	text-decoration: none;
	border: 0;
	transition:
		color 0.25s ease,
		transform 0.25s var(--ogc-hdr-ease);
}

.ogc-hdr__sublink:hover,
.ogc-hdr__sublink:focus-visible,
.ogc-hdr__sublink[aria-current="page"] {
	color: #fff;
	transform: translateX(6px);
}

/* --------------------------------------------------------------------------
   Right-hand utilities
   -------------------------------------------------------------------------- */

.ogc-hdr__utils {
	display: inline-flex;
	align-items: center;
	gap: 20px;
	justify-self: end;
}

.ogc-hdr__members {
	font-family: var(--ogc-hdr-sans);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	border: 0;
	white-space: nowrap;
}

.ogc-hdr__divider {
	display: block;
	width: 1px;
	height: 18px;
	background: rgba(255, 255, 255, 0.25);
}

.ogc-hdr__book {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 22px;
	font-family: var(--ogc-hdr-sans);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	white-space: nowrap;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.55);
	transition:
		background-color 0.3s ease,
		color 0.3s ease,
		border-color 0.3s ease;
}

.ogc-hdr__book:hover,
.ogc-hdr__book:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--ogc-hdr-navy);
}

/* --------------------------------------------------------------------------
   Mobile toggle
   -------------------------------------------------------------------------- */

.ogc-hdr__toggle {
	display: none;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	justify-self: end;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	background: none;
	border: 0;
	cursor: pointer;
	color: #fff;
}

.ogc-hdr__toggle-label {
	font-family: var(--ogc-hdr-sans);
	font-size: 10.5px;
	font-weight: 500;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: #fff;
}

.ogc-hdr__toggle-icon {
	position: relative;
	display: block;
	width: 22px;
	height: 9px;
	flex: 0 0 22px;
}

.ogc-hdr__toggle-bar {
	position: absolute;
	right: 0;
	display: block;
	height: 1px;
	background: #fff;
	transition:
		width 0.3s var(--ogc-hdr-ease),
		transform 0.3s var(--ogc-hdr-ease),
		top 0.3s var(--ogc-hdr-ease);
}

.ogc-hdr__toggle-bar:nth-child(1) {
	top: 0;
	width: 22px;
}

.ogc-hdr__toggle-bar:nth-child(2) {
	top: 8px;
	width: 14px;
}

/* Open: both bars meet in the middle and cross. */
.ogc-hdr__toggle[aria-expanded="true"] .ogc-hdr__toggle-bar {
	top: 4px;
	width: 22px;
}

.ogc-hdr__toggle[aria-expanded="true"] .ogc-hdr__toggle-bar:nth-child(1) {
	transform: rotate(45deg);
}

.ogc-hdr__toggle[aria-expanded="true"] .ogc-hdr__toggle-bar:nth-child(2) {
	transform: rotate(-45deg);
}

/* --------------------------------------------------------------------------
   Mobile overlay
   -------------------------------------------------------------------------- */

.ogc-hdr-overlay {
	position: fixed;
	inset: 0;
	z-index: 9998;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: calc(var(--ogc-hdr-top) + var(--ogc-hdr-h-solid) + 16px) 24px 32px;
	background: var(--ogc-hdr-navy);
	opacity: 0;
	transition: opacity 0.35s ease;
}

.ogc-hdr-overlay[hidden] {
	display: none;
}

.ogc-hdr-overlay.is-open {
	opacity: 1;
}

.ogc-hdr-overlay__inner {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	width: 100%;
	min-height: 100%;
	transform: translateY(12px);
	transition: transform 0.35s var(--ogc-hdr-ease);
}

.ogc-hdr-overlay.is-open .ogc-hdr-overlay__inner {
	transform: translateY(0);
}

.ogc-hdr-overlay__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ogc-hdr-overlay__item {
	margin: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.ogc-hdr-overlay__item:first-child {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.ogc-hdr-overlay__link {
	display: block;
	padding: 14px 0;
	font-family: var(--ogc-hdr-serif);
	font-size: 24px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: #fff;
	text-decoration: none;
	border-left: 0;
	border-right: 0;
	border-top: 0;
}

.ogc-hdr-overlay__link.is-current {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 6px;
	text-decoration-thickness: 1px;
}

.ogc-hdr-overlay__actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 12px;
}

.ogc-hdr-overlay__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 50px;
	font-family: var(--ogc-hdr-sans);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	transition:
		background-color 0.3s ease,
		color 0.3s ease,
		border-color 0.3s ease;
}

.ogc-hdr-overlay__btn--solid {
	background: #fff;
	color: var(--ogc-hdr-navy);
	border: 1px solid #fff;
}

.ogc-hdr-overlay__btn--ghost {
	background: transparent;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.55);
}

.ogc-hdr-overlay__btn--ghost:hover,
.ogc-hdr-overlay__btn--ghost:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--ogc-hdr-navy);
}

.ogc-hdr-overlay__tel {
	display: block;
	padding-top: 4px;
	font-family: var(--ogc-hdr-sans);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.08em;
	text-align: center;
	color: #fff;
	text-decoration: none;
	border: 0;
}

/* Body scroll lock while the overlay is open. Pinning the body rather than
   just hiding overflow is what makes this hold on iOS; JS stores the scroll
   position and restores it on close. Note: no touch-action:none here, that
   would also kill panning inside the overlay itself. */
html.ogc-hdr-menu-open {
	overflow: hidden;
}

body.ogc-hdr-menu-open {
	position: fixed;
	left: 0;
	right: 0;
	width: 100%;
	overflow: hidden;
}

/* --------------------------------------------------------------------------
   Breakpoints
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	:root {
		--ogc-hdr-h: 72px;
		--ogc-hdr-h-solid: 60px;
		--ogc-hdr-pad: 20px;
	}

	.ogc-hdr__inner {
		grid-template-columns: auto 1fr;
	}

	.ogc-hdr__nav,
	.ogc-hdr__utils {
		display: none;
	}

	.ogc-hdr__toggle {
		display: inline-flex;
	}

	.ogc-hdr__crest {
		height: 40px;
	}

	.ogc-hdr--solid .ogc-hdr__crest {
		height: 34px;
	}

	.ogc-hdr::before {
		height: 260px;
		background: linear-gradient(
			to bottom,
			rgba(26, 29, 84, 0.70) 0,
			rgba(26, 29, 84, 0.66) 44px,
			rgba(26, 29, 84, 0.50) 90px,
			rgba(26, 29, 84, 0.26) 150px,
			rgba(26, 29, 84, 0.10) 205px,
			rgba(26, 29, 84, 0) 260px
		);
	}
}

@media (min-width: 1025px) {
	.ogc-hdr__toggle,
	.ogc-hdr-overlay {
		display: none !important;
	}
}

/* Narrow phones: the wordmark would crowd the toggle. */
@media (max-width: 400px) {
	.ogc-hdr__wordmark-top {
		font-size: 11px;
		letter-spacing: 0.28em;
		margin-right: -0.28em;
	}

	.ogc-hdr__wordmark-bottom {
		font-size: 8.5px;
		letter-spacing: 0.26em;
		margin-right: -0.26em;
	}
}

/* --------------------------------------------------------------------------
   Reduced motion: show and hide, but do not slide.
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.ogc-hdr,
	.ogc-hdr__inner,
	.ogc-hdr__item,
	.ogc-hdr__crest,
	.ogc-hdr__sub,
	.ogc-hdr__sublink,
	.ogc-hdr__link-text::after,
	.ogc-hdr__caret,
	.ogc-hdr__toggle-bar,
	.ogc-hdr-overlay,
	.ogc-hdr-overlay__inner,
	.ogc-hdr-overlay__btn {
		transition: none !important;
	}

	.ogc-hdr--hidden {
		transform: none;
		visibility: hidden;
	}

	.ogc-hdr-overlay__inner {
		transform: none;
	}
}