
/* Header Two Columns - reveal after Hero heading */
.header-two-columns-block {
	transition: opacity 0.55s cubic-bezier(0.2, 0.65, 0.3, 1),
							transform 0.55s cubic-bezier(0.2, 0.65, 0.3, 1);
}

.site-header {
	will-change: opacity, transform;
}

.site-header.sticky {
	opacity: 0;
	transform: translateY(-18px);
	transition:
		opacity 0.34s ease,
		transform 0.42s cubic-bezier(0.22, 0.61, 0.36, 1),
		box-shadow 0.42s ease,
		background-color 0.42s ease;
}

.site-header.sticky.visible {
	opacity: 1;
	transform: translateY(0);
}

.site-header.sticky.hide {
	opacity: 0;
	transform: translateY(-22px);
	transition:
		opacity 0.52s ease,
		transform 0.62s cubic-bezier(0.16, 0.84, 0.32, 1),
		box-shadow 0.46s ease,
		background-color 0.46s ease;
	pointer-events: none;
}

.site-header .header-two-columns-block {
	transition:
		opacity 0.44s ease,
		transform 0.52s cubic-bezier(0.22, 0.61, 0.36, 1),
		filter 0.3s ease;
	transform-origin: center top;
	will-change: opacity, transform;
}

.site-header.sticky:not(.visible) .header-two-columns-block,
.site-header.sticky.hide .header-two-columns-block {
	opacity: 0;
	transform: translateY(-5px);
	filter: none;
	pointer-events: none;
}

.site-header.sticky.visible .header-two-columns-block {
	opacity: 1;
	transform: translateY(0);
	filter: none;
	pointer-events: auto;
}

.site-header.sticky.animate-in .header-two-columns-block {
	animation: sticky-header-content-in 0.56s ease forwards;
	pointer-events: none;
}

.site-header.sticky.hide .header-two-columns-block {
	transform: translateY(-10px);
	filter: blur(1.5px);
	transition-duration: 0.38s, 0.54s, 0.34s;
	transition-timing-function: ease, cubic-bezier(0.16, 0.84, 0.32, 1), ease;
}

.site-header .header-two-columns-block .header-logo-container .static-logo,
.site-header .header-two-columns-block .header-logo-container .sticky-logo {
	transition:
		opacity 0.34s ease,
		transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1),
		visibility 0s linear 0.34s;
}

.site-header .header-two-columns-block .header-logo-container .sticky-logo {
	opacity: 0;
	transform: translateY(-2px) scale(0.992);
	visibility: hidden;
	pointer-events: none;
}

.site-header.sticky.visible .header-two-columns-block .header-logo-container .static-logo {
	opacity: 0;
	transform: translateY(2px) scale(0.992);
	visibility: hidden;
	pointer-events: none;
}

.site-header.sticky.visible .header-two-columns-block .header-logo-container .sticky-logo {
	opacity: 1;
	transform: translateY(0) scale(1);
	visibility: visible;
	transition-delay: 0.03s;
	pointer-events: auto;
}

@keyframes sticky-header-content-in {
	0% {
		opacity: 0;
		transform: translateY(-5px);
		filter: blur(1.5px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
		filter: none;
	}
}

.header-two-columns-block.header-reveal--hidden {
	opacity: 0;
	transform: translateY(-12px);
}

.header-two-columns-block.header-reveal--visible {
	opacity: 1;
	transform: none;
}

/* Header CTA text link */
.header-two-columns-block .header-cta-link-container {
	display: flex;
	align-items: center;
}

.header-two-columns-block .header-cta-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	white-space: nowrap;
	transition: gap 0.25s ease;
	color: var(--colour-white);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-weight: 300;
}

.header-two-columns-block .header-cta-link:hover,
.header-two-columns-block .header-cta-link:focus-visible {
	gap: 14px;
}

.header-two-columns-block .header-cta-link svg {
	flex-shrink: 0;
	transition: transform 0.25s ease;
}

.header-two-columns-block .header-cta-link:hover svg,
.header-two-columns-block .header-cta-link:focus-visible svg {
	transform: translateX(2px);
}

.header-two-columns-block .header-cta-link__label--mobile {
	display: none;
}

@media all and (max-width: 768px) {
	.header-two-columns-block .header-cta-link__label--desktop {
		display: none;
	}

	.header-two-columns-block .header-cta-link__label--mobile {
		display: inline;
	}
}

@media (prefers-reduced-motion: reduce) {
	.header-two-columns-block {
		transition: none;
	}
	.site-header,
	.site-header.sticky,
	.site-header.sticky.hide {
		transition: none;
		transform: none;
		opacity: 1;
	}
	.site-header .header-two-columns-block,
	.site-header .header-two-columns-block .header-logo-container .static-logo,
	.site-header .header-two-columns-block .header-logo-container .sticky-logo {
		transition: none;
		filter: none;
	}
	.header-two-columns-block.header-reveal--hidden {
		opacity: 1;
		transform: none;
	}
	.site-header.sticky:not(.visible) .header-two-columns-block,
	.site-header.sticky.hide .header-two-columns-block,
	.site-header.sticky.visible .header-two-columns-block,
	.site-header.sticky.visible .header-two-columns-block .header-logo-container .static-logo,
	.site-header.sticky.visible .header-two-columns-block .header-logo-container .sticky-logo {
		opacity: 1;
		transform: none;
		visibility: visible;
		pointer-events: auto;
	}
}

