/**
 * Global styles: tokens, base, shared components (buttons, underline, slashes),
 * entrance animations. Section styles live with each block in blocks/<name>/style.scss.
 */
:root {
	--teal: #0B4446;
	--gold: #E1B74D;
	--gray: #5F6567;
	--sand: #D0D3C5;
	--white: #FFFFFF;
	--ink: #161616;
	--line: rgba(0, 0, 0, .15);
	--half: rgba(0, 0, 0, .5);
	--sticky: #374B47;
	--sage: #749990;
	--mint: #DBEBE7;
	--green: #86BC9C;
	--cyan: #0794A2;
	--ff: "Figtree", sans-serif;
	--ff2: "Geologica", sans-serif;
	--hdr-h: 80px;
}

*, *::before, *::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--ff);
	font-size: 16px;
	line-height: 1.4;
	font-weight: 300;
	color: var(--gray);
	background: var(--white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.wp-site-blocks {
	overflow-x: clip;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
	border: 0;
}

a {
	color: var(--ink);
	text-decoration: none;
	transition: color .3s;
}

a:hover {
	color: var(--gold);
}

h1, h2, h3, h4, h5, h6, p {
	margin: 0;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

button {
	font: inherit;
}

.ic {
	display: block;
	width: 100%;
	height: 100%;
	fill: currentColor;
}

.sec {
	position: relative;
	padding: 0 30px;
}

.box {
	position: relative;
	display: flex;
	max-width: 1400px;
	margin: 0 auto;
}

.col {
	position: relative;
	display: flex;
}

.col--third {
	width: 33.333%;
}

.wrap {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	width: 100%;
	padding: 10px;
}

.eyebrow {
	width: 100%;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: -.4px;
	color: var(--gold);
}

.title {
	font-size: 48px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--ink);
}

.btn {
	display: inline-block;
	font-family: var(--ff);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ink);
	background-color: transparent;
	border: 1px solid var(--teal);
	border-radius: 0;
	padding: 16.5px 32px;
	text-align: center;
	cursor: pointer;
	transition: all .3s;
}

.btn:hover, .btn:focus-visible {
	background-color: var(--gold);
	color: var(--teal);
	border-color: var(--gold);
}

.btn--light {
	background-color: var(--white);
	border: none;
}

.btn--light:hover, .btn--light:focus-visible {
	background-color: var(--gold);
	color: var(--teal);
}

.btn--ghost-light {
	color: var(--white);
	border-color: var(--white);
}

.btn--ghost-light:hover, .btn--ghost-light:focus-visible {
	background-color: var(--gold);
	color: var(--ink);
	border-color: var(--gold);
}

.link-btn {
	display: inline-block;
	font-family: var(--ff2);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: -.4px;
	color: var(--teal);
	--u-color: var(--gold);
}

.link-btn:hover {
	color: var(--ink);
}

.slash {
	display: flex;
	align-items: center;
	justify-content: center;
}

.slash .ic {
	width: auto;
	aspect-ratio: 18 / 44;
}

.slash--gold {
	width: 20px;
	color: var(--gold);
}

.slash--gold .ic {
	height: 32px;
}

.is-invisible {
	visibility: hidden;
}

.animated {
	animation-duration: 1.25s;
	animation-fill-mode: both;
}

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } }
@keyframes slideInUp { from { transform: translate3d(0, 100%, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } }
.fadeIn {
	animation-name: fadeIn;
}

.fadeInUp {
	animation-name: fadeInUp;
}

.slideInUp {
	animation-name: slideInUp;
}

.hdr__inner {
	opacity: 0;
	animation: hdr-fadein 1s ease forwards;
}

@keyframes hdr-fadein { to { opacity: 1; } }
.hdr__inner {
	display: flex;
	align-items: stretch;
	max-width: 1400px;
	min-height: var(--hdr-h);
	margin: 0 auto;
}

.hdr__logo, .hdr__right {
	display: flex;
	align-items: center;
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.hdr__logo {
	width: 15%;
}

.hdr__right {
	width: 85%;
	justify-content: flex-end;
}

.logo__img {
	width: auto;
	max-width: 120px;
	height: 60px;
}

.is-desktop-only {
}

.hdr__phone {
	display: inline-block;
	margin: 0 10px 0 0;
	padding: 15px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--white);
	--u-color: var(--gold);
}

.hdr__phone:hover {
	color: var(--white);
}

.mhdr__inner {
	display: flex;
	align-items: stretch;
	max-width: 1400px;
	min-height: var(--hdr-h);
	margin: 0 auto;
}

.mhdr__logo, .mhdr__right {
	display: flex;
	align-items: center;
}

.mhdr__logo {
	width: 13%;
}

.mhdr__right {
	width: 87%;
	justify-content: flex-end;
}

.mhdr__cta {
	padding: 0;
	border-bottom: 1px solid var(--gold);
}

.mtoggle__open {
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 100%;
}

.mtoggle__open span {
	display: block;
	height: 2px;
	background: currentColor;
}

.mtoggle__close {
	display: none;
	width: 18px;
	height: 18px;
}

.hero__bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.hero__slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: top center;
	opacity: 0;
	transition: opacity 3s ease;
}

/* The slide image fills its slide exactly as the background did. */
.hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
}

.hero__slide.is-active {
	opacity: 1;
	z-index: 1;
}

.hero__slide.is-leaving {
	opacity: 1;
	z-index: 0;
}

.hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	background-image: linear-gradient(55deg, #00000082 30%, #00000000 60%);
	mix-blend-mode: darken;
}

.hero__box {
	z-index: 3;
	min-height: 95vh;
}

.hero__wrap {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-end;
	align-items: flex-end;
	width: 100%;
	padding: 10px;
}

.hero__title {
	width: 720px;
	max-width: 720px;
	margin: 30px 0 15px;
	font-size: 50px;
	font-weight: 400;
	line-height: 1.2;
	color: var(--white);
}

.hero__text {
	width: 50%;
	max-width: 50%;
	margin-bottom: 30px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--white);
}

.hero__btn {
	width: 100%;
}

.hero__spacer {
	width: 100%;
	height: 7vh;
}

.svc-head__wrap {
	align-items: flex-end;
	align-content: flex-end;
}

.svc-head__eyebrow {
	margin-bottom: 10px;
}

.svc-head__title {
	width: auto;
	align-self: flex-end;
}

.svc-head__slash {
	width: 50px;
	height: 51px;
	margin-bottom: -5px;
	align-self: flex-end;
	color: var(--line);
}

.svc-head__slash .ic {
	height: 50px;
}

.svc-head__text {
	width: 375px;
	max-width: 375px;
	margin-bottom: 5px;
}

.ibox__title {
	margin-bottom: 7.2px;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--ink);
}

.ibox__desc {
	font-size: 16px;
	line-height: 1.4;
	color: var(--gray);
}

.svc-btn__half {
	width: 50%;
	padding: 10px;
}

.testi__col {
	width: 100%;
}

.testi__eyebrow {
	margin-bottom: 10px;
	text-align: center;
}

.testi__title {
	margin-bottom: 30px;
	text-align: center;
}

.tcar__viewport {
	position: relative;
	overflow: hidden;
	margin: 0 34px;
	padding-bottom: 40px;
	cursor: grab;
	touch-action: pan-y;
}

.tcar__viewport.is-dragging {
	cursor: grabbing;
}

.tcar__track {
	display: flex;
	align-items: stretch;
	will-change: transform;
}

.tcar__slide {
	flex: 0 0 100%;
	padding: 0 20px 40px;
	text-align: center;
	user-select: none;
}

.tcar__text {
	font-size: 30px;
	font-weight: 300;
	line-height: 1.3;
	color: var(--gray);
}

.tcar__cite {
	display: flex;
	flex-direction: column;
	margin-top: 37px;
	font-style: normal;
	font-size: 14px;
	line-height: 1.5;
}

.tcar__name {
	font-weight: 700;
	color: var(--green);
}

.tcar__role {
	font-weight: 300;
	color: var(--gray);
}

.tcar__arrow {
	position: absolute;
	top: calc(50% - 20px);
	z-index: 2;
	width: 20px;
	height: 20px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--gold);
	cursor: pointer;
	transform: translateY(-50%);
}

.tcar__arrow--prev {
	left: 10px;
}

.tcar__arrow--next {
	right: 10px;
}

.tcar__dots, .bcar__dots {
	display: flex;
	justify-content: center;
}

.tcar__dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 5px;
	height: 22px;
	align-items: center;
}

.dot {
	position: relative;
	width: 6px;
	height: 6px;
	margin: 0 6px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--sand);
	cursor: pointer;
}

/* A 6px dot is too small to tap: this widens the touch area to 18px — as far as it goes before
   neighbouring dots would overlap — without moving anything on screen. */
.dot::after {
	content: "";
	position: absolute;
	inset: -6px;
}

.dot.is-active {
	background: var(--cyan);
}

.mint__main {
	width: 68%;
	padding: 80px 30px 115px 0;
}

.mint__side {
	width: 31.333%;
	padding-top: 85px;
}

.mint__title {
	margin-bottom: 40px;
}

.mint__text {
	padding-bottom: 20px;
	font-size: 30px;
	font-weight: 300;
	line-height: 1.3;
}

.mint__text p {
	margin-bottom: 30px;
}

.mint__img {
	display: flex;
	justify-content: flex-end;
}

.mint__fx {
	transform-origin: center;
}

.mint__img img {
	width: 400px;
}

.why__box {
	min-height: 600px;
	align-items: stretch;
}

.why__media {
	width: 50%;
	display: flex;
}

.why__img {
	display: flex;
	align-items: center;
	width: 100%;
	margin-right: 15px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.why__spacer {
	width: 100%;
	height: 50px;
}

.why__content {
	width: 50%;
	display: flex;
	align-items: center;
}

.why__inner {
	width: 100%;
	padding: 2% 2% 2% 15%;
}

.why__inner > * + * {
	margin-top: 20px;
}

.why__title {
	margin-bottom: 20px;
}

.why__text p {
	margin-bottom: 16px;
}

.sectors__title {
	margin-bottom: 20px;
	font-size: 26px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--ink);
}

.sbox__icon {
	display: block;
	width: 30px;
	height: 30px;
	margin-bottom: 10px;
	color: var(--sage);
}

.sbox__title {
	margin: 14.4px 0 7.2px;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--ink);
}

.sbox__desc {
	color: var(--gray);
}

.banner__bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.banner__layer {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 120%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	will-change: transform;
}

.banner__overlay {
	position: absolute;
	inset: 0;
	background-image: linear-gradient(19deg, #000000 16%, #00000000 48%);
	opacity: .6;
}

.banner__box {
	min-height: 70vh;
}

.banner__col {
	width: 50%;
	display: flex;
	align-items: flex-end;
}

.banner__col:first-child {
	margin-bottom: 55px;
}

.banner__title {
	font-size: 3.5em;
	font-weight: 700;
	line-height: 1.3;
	color: var(--white);
}

.contact__box {
	align-items: flex-end;
}

.contact__main {
	width: 70%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.contact__main > * + * {
	margin-top: 10px;
}

.contact__img {
	margin-top: 35px !important;
}

.contact__img img {
	width: 100%;
}

.contact__side {
	width: 30%;
	align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact__side-inner {
	width: 100%;
	padding: 0 15%;
	text-align: center;
}

.contact__word {
	position: relative;
	z-index: 1;
	overflow: visible;
	font-size: 27px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--ink);
}

.contact__word--mid {
	line-height: 1.5;
	letter-spacing: -.2px;
}

.contact__divider {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: center;
	height: 86px;
	padding: 12px 0;
}

.contact__divider span {
	display: block;
	width: 1px;
	height: 62px;
	background: var(--line);
}

.contact__note {
	position: relative;
	z-index: 2;
	padding: 5px 0 165px;
	background: var(--white);
	font-size: 20px;
	line-height: 1.5;
	text-align: center;
}

.contact__note p {
	margin-bottom: 20px;
}

.form-sec__box {
	align-items: flex-start;
}

.form-sec__info {
	width: 35%;
}

.form-sec__form {
	width: 65%;
	margin-top: -170px;
	padding: 50px;
	background: var(--white);
}

.reach__link + .reach__link {
	margin-top: 20px;
}

.reach__divider {
	margin: 20px 0 35px;
	padding: 15px 0;
}

.reach__divider span {
	display: block;
	width: 50%;
	border-top: 1px solid var(--line);
}

.cform__group {
	padding: 0 12.5px;
	margin-bottom: 25px;
}

.cform__group--full {
	width: 100%;
}

.cform__group--half {
	width: 50%;
}

.cform__group--recaptcha {
	margin-bottom: 0;
}

.cform__group--submit {
	width: 33.333%;
}

.cform__msg {
	width: 100%;
	padding: 0 12.5px 25px;
	font-size: 14px;
	color: var(--teal);
}

.bcar__viewport {
	overflow: hidden;
	padding-top: 8px;
	margin-top: -8px;
	touch-action: pan-y;
}

.bcar__viewport:not(.is-locked) {
	cursor: default;
}

.bcar__track {
	display: flex;
	align-items: stretch;
	transition-timing-function: ease;
	will-change: transform;
}

.bcar__dots {
	margin-top: 22px;
	min-height: 6px;
}

.bcar__dots.is-locked {
	visibility: hidden;
}

.card__mark {
	display: block;
	width: 18px;
	height: 18px;
	margin-top: -10px;
	margin-bottom: 1px;
	color: var(--gold);
}

.card__cat {
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--ink);
}

.card__img {
	display: block;
	overflow: hidden;
}

.card__img img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	-webkit-user-drag: none;
}

.card__title {
	display: inline-block;
	align-self: flex-start;
	margin: 23px 0 8px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: -.4px;
	color: var(--ink);
	--u-color: var(--gold);
}

.card__title:hover {
	color: var(--gold);
}

.card__excerpt {
	font-size: 14px;
	line-height: 1.4;
	color: var(--gray);
}

.fcta__bleed {
	position: absolute;
	inset: 0;
	display: flex;
}

.fcta__bleed span {
	width: 50%;
}

.fcta__bleed span:first-child {
	background: var(--teal);
}

.fcta__bleed span:last-child {
	background: var(--gold);
}

.fcta__box {
	position: relative;
	display: flex;
	max-width: 1400px;
	min-height: 64px;
	margin: 0 auto;
	padding: 0 10px;
}

.fcta__col {
	display: flex;
	align-items: center;
	justify-content: center;
}

.fcta__col--a {
	width: 15%;
	background: var(--teal);
}

.fcta__col--b {
	width: 34.333%;
	background: var(--teal);
}

.fcta__col--c {
	width: 50%;
	background: var(--gold);
}

.fcta__phone {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	width: 100%;
	padding: 16px 0;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--gold);
	--u-color: var(--gold);
}

.fcta__phone:hover {
	color: var(--gold);
}

.fcta__phone .ic {
	width: 14px;
	height: 14px;
}

.fcta__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	width: calc(100% - 15px);
	margin-left: 15px;
	border: none;
}

.fcta__btn .ic {
	width: 14px;
	height: 14px;
}

.fcta__btn:hover, .fcta__btn:focus-visible {
	color: var(--teal);
}

.fmain__overlay {
	position: absolute;
	inset: 0;
	background-color: var(--half);
}

.fmain__box {
	position: relative;
	max-width: 1400px;
	margin: 0 auto;
}

.ftop__pad {
	width: 15%;
}

.ftop__content {
	width: 85%;
	padding: 50px 34% 0 0;
}

.ftop__content > * + * {
	margin-top: 10px;
}

.ftop__spacer {
	height: 8vh;
}

.ftop__title {
	font-size: 30px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--gold);
}

.ftop__text {
	font-size: 20px;
	line-height: 1.5;
	color: var(--white);
}

.ftop__text p {
	margin-bottom: 20px;
}

.fbar__col {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-self: stretch;
	padding: 60px 0 40px;
	color: var(--white);
}

.fbar__col:first-child {
	padding: 0;
}

.fbar__col--15 {
	width: 15%;
}

.fbar__col--legal {
	width: 24.329%;
}

.fbar__col--social {
	align-items: center;
}

.fcredit__pad {
	width: 15%;
}

.fcredit__text {
	width: 85%;
	color: var(--gray);
}

.fcredit__text p {
	margin-bottom: 16px;
}

.fcredit__text a {
	color: var(--white);
}

.fcredit__text a:hover {
	color: var(--gold);
}

@media (pointer: fine) {
	.u {
		display: inline;
		padding-bottom: 2.7px;
		/* No effect on inline text; inside a flex button it cancels the padding above, so the
		   button keeps production's height (the underline room never adds to it there). */
		margin-bottom: -2.7px;
		background-image: linear-gradient(var(--u-color, var(--ink)) 0 0);
		background-repeat: no-repeat;
		background-position: 0 100%;
		background-size: 0 1px;
		transition: background-size .5s, background-position 0s .5s;
	}

	a:hover .u, button:hover .u, a:focus-visible .u {
		background-position: 100% 100%;
		background-size: 100% 1px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.animated {
		animation: none !important;
	}

	.is-invisible {
		visibility: visible;
	}
}

@media (max-width: 1024px) {
	/* Testimonials on tablet, as production: 26px quotes 46px from the edges, arrows 10px from the screen edges. */
	.tcar__viewport {
		margin: 0 16px;
	}

	.tcar__slide {
		padding: 0 0 40px;
	}

	.tcar__text {
		font-size: 26px;
	}

	.tcar__arrow--prev {
		left: -20px;
	}

	.tcar__arrow--next {
		right: -20px;
	}

	.mint__text {
		font-size: 26px;
	}

	/* Home blog cards on tablet: 20px category, 18px title (production). */
	.card__cat {
		font-size: 20px;
	}

	.card__title {
		font-size: 18px;
	}

	/* Section labels ("Testimonials", "Get in touch", "Blogs") are 18px on tablet in production. */
	.eyebrow {
		font-size: 18px;
	}

	/* The contact form box: 30px on the left, none on the right (the block's own rule loses to the base one). */
	.form-sec__form {
		padding: 30px 0 30px 30px;
	}

	/* Production also scales button padding down per breakpoint. */
	.btn {
		padding: 15px 30px;
	}

	/* Production scales these card headings down per breakpoint. */
	.ibox__title, .sbox__title {
		font-size: 20px;
		margin-bottom: 6px;
	}

	.sbox__title {
		margin-top: 12px;
	}

	.title {
		font-size: 32px;
	}

	.hero__box {
		min-height: 75vh;
	}

	.hero__wrap {
		padding: 0;
	}

	.hero__title {
		width: 75vw;
		max-width: 75vw;
		font-size: 40px;
	}

	.hero__spacer {
		height: 4vh;
	}

	.svc-head__wrap {
		padding: 0;
	}

	.svc-head__title {
		width: 100%;
	}

	.is-desktop-only {
		display: none !important;
	}

	.svc-head__text {
		width: 100%;
		max-width: 100%;
		margin-top: 5px;
	}

	.col--third {
		width: 33%;
	}

	.mint__main {
		padding: 80px 30px 0 0;
		margin-bottom: 55px;
	}

	.mint__title {
		margin-bottom: 30px;
	}

	.mint__img img {
		width: 150px;
	}

	.why__box {
		min-height: 415px;
	}

	.why__inner {
		padding: 0 0 0 15px;
	}

	.why__title {
		margin-bottom: 10px;
	}

	.banner__box {
		min-height: 400px;
	}

	.banner__col:first-child {
		width: 100%;
	}

	.banner__col:last-child {
		display: none;
	}

	.contact__img {
		margin-right: 10px;
	}

	.contact__side-inner {
		padding: 0 5%;
	}

	.fcta__col--a {
		width: 18%;
	}

	.fcta__col--b {
		width: 32%;
	}

	/* Production: 30px sides on tablet (10px on desktop), and the gold button fills its column. */
	.fcta__box {
		padding: 0 30px;
	}

	.fcta__btn {
		width: 100%;
		margin-left: 0;
	}

	.fmain__box {
		max-width: 710px;
	}

	.ftop__pad {
		display: none;
	}

	.ftop__content {
		width: 100%;
		padding: 0 35% 0 0;
	}

	.ftop__spacer {
		height: 40px;
	}

	.fbar__col:first-child {
		width: 100%;
		height: 1px;
	}

	.fbar__col--15 {
		width: 20%;
	}

	.fbar__col--social {
		width: 15%;
	}

	.fbar__col--legal {
		width: 25%;
	}

	.fcredit__pad {
		display: none;
	}

	.fcredit__text {
		width: 100%;
	}

	.ftop__title {
		font-size: 24px;
	}

	.ftop__text {
		font-size: 19px;
	}
}

@media (max-width: 767px) {
	/* Production's base line height is 1.5 on mobile (1.4 above). */
	body {
		line-height: 1.5;
	}

	.card__cat {
		font-size: 18px;
	}

	.ibox__title, .sbox__title {
		font-size: 18px;
		margin-bottom: 5.4px;
	}

	.sbox__title {
		margin-top: 10.8px;
	}

	.ibox__desc, .sbox__desc {
		line-height: 1.5;
	}

	/* Production shrinks every button on mobile. */
	.btn {
		padding: 14px 28px;
	}

	.fcta__btn {
		padding: 15px 20px;
	}

	.ftop__title {
		font-size: 22px;
		line-height: 1.1;
	}

	.ftop__text {
		font-size: 18px;
	}

	.fcredit__text p {
		line-height: 1.5;
	}

	.title {
		font-size: 25px;
		line-height: 1.3;
	}

	.box {
		flex-wrap: wrap;
	}

	.mhdr__logo, .mhdr__right {
		width: 50%;
	}

	.hero__title {
		font-size: 30px;
		line-height: 1em;
		padding-bottom: 10px;
		margin-bottom: 20px;
	}

	.hero__text {
		width: 90%;
		max-width: 90%;
		font-size: 16px;
		line-height: 1.5;
	}

	.col--third {
		width: 100%;
	}

	.svc-head__title {
		font-size: 25px;
	}

	/* The empty second half stays: production keeps its 20px below the button on mobile. */
	.svc-btn {
		flex-wrap: wrap;
		padding: 10px;
	}

	.svc-head__text {
		margin-bottom: 16px;
	}

	.svc-btn__half {
		width: 100%;
	}

	/* Production on mobile: text ~30px from the edges at 23px, arrows 10px from the screen edges
	   (10px keeps the draggable area clear of the arrows). */
	.tcar__viewport {
		margin: 0 10px;
	}

	.tcar__slide {
		padding: 0 0 40px;
	}

	.tcar__text {
		font-size: 23px;
	}

	.tcar__arrow--prev {
		left: -10px;
	}

	.tcar__arrow--next {
		right: -10px;
	}

	.mint__main {
		width: 100%;
		padding: 55px 0 0;
		margin-bottom: 20px;
	}

	.mint__title {
		margin-bottom: 20px;
	}

	/* Production on mobile: 23px statement, one line-height (1em) below each paragraph. */
	.mint__text {
		padding-bottom: 0;
		font-size: 23px;
	}

	.mint__text p {
		margin-bottom: 1em;
	}

	/* The section ends at the image on mobile in production. */
	.mint__side {
		width: 100%;
		padding-top: 0;
		padding-bottom: 0;
	}

	.mint__img {
		justify-content: center;
	}

	.mint__img img {
		width: 200px;
	}

	.why__media, .why__content {
		width: 100%;
	}

	.why__img {
		margin: 0 0 30px;
	}

	.why__spacer {
		height: 55vw;
	}

	.why__inner {
		padding: 0;
	}

	.why__inner > * + * {
		margin-top: 10px;
	}

	/* Production on mobile: 25px from the label to the heading, 20px from the heading to the text. */
	.why__title {
		margin: 25px 0 0;
	}

	.why__inner > .why__title + * {
		margin-top: 20px;
	}

	.why__text {
		margin-bottom: 15px;
	}

	.sectors__title {
		margin-bottom: 20px;
	}

	.sectors__intro > div {
		margin-bottom: 40px;
	}

	.banner__title {
		font-size: 16px;
		line-height: 1.5;
	}

	.contact__main, .contact__side {
		width: 100%;
	}

	.contact__img {
		margin: 10px 0 0 !important;
	}

	.contact__side-inner {
		padding: 30px 20px 0;
	}

	.contact__note {
		padding: 0;
	}

	.form-sec__info, .form-sec__form {
		width: 100%;
	}

	.form-sec__form {
		margin: 0;
		padding: 20px 0 50px;
	}

	.cform__group--half, .cform__group--submit {
		width: 100%;
	}

	.fcta__bleed, .fcta__col--a {
		display: none;
	}

	.fcta__box {
		flex-wrap: wrap;
		padding: 0;
	}

	.fcta__col--b, .fcta__col--c {
		width: 100%;
	}

	.fcta__btn {
		width: 100%;
		margin-left: 0;
	}

	/* Production insets the phone link 20px on the left (its teal band stays full width). */
	.fcta__phone {
		width: calc(100% - 20px);
		margin-left: 20px;
	}

	.fmain__box {
		max-width: 320px;
	}

	.ftop__content {
		padding: 0;
	}

	/* Production on mobile: title 11px lower, 12px less between the text and the menus. */
	.ftop__spacer:first-child {
		height: 51px;
	}

	.ftop__spacer:last-child {
		height: 28px;
	}

	.fbar__col:first-child {
		height: 20px;
	}

	.fbar__col--15, .fbar__col--legal, .fbar__col--social {
		width: 100%;
		padding: 20px 0 0;
	}

	.fbar__col--15:nth-child(4) {
		width: 50%;
		height: 1px;
		padding: 0;
	}

	/* Production aligns the LinkedIn button with the links on mobile, not centred. */
	.fbar__col--social {
		align-items: flex-start;
		padding: 30px 0;
	}
}

/* ---------------------------------------------------------
   WordPress integration
   --------------------------------------------------------- */

/* Template part / main wrappers must not add spacing between sections. */
:where(.wp-site-blocks) > * + *,
:where(.wp-site-blocks main) > * + * { margin-block-start: 0; }
main.wp-block-group { margin: 0; }
.wp-block-post-content > * { max-width: none; margin-left: 0; margin-right: 0; }

/* Logged-in admin bar pushes fixed/sticky chrome down. */
.admin-bar .hdr { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .hdr { top: 46px; }
}

/* Pages without a hero: solid header and content starts below it. */

/* Screen-reader text (used by core blocks and forms). */
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}

.skip-link:focus {
	clip: auto; clip-path: none; height: auto; width: auto; z-index: 100000;
	top: 8px; left: 8px; padding: 12px 16px; background: var(--wp--preset--color--white); color: var(--wp--preset--color--ink);
}

/* ---------------------------------------------------------
   Inner pages (page-hero templates)
   --------------------------------------------------------- */

/* Core blocks placed directly in the page content get the production boxed width (1400 + gutters);
   theme section blocks (wp-block-ccr-*) carry their own layout. */
.page-body > .wp-block-post-content:not(.post-content) > :where(:not([class*="wp-block-ccr-"]):not(.alignfull)) {
	box-sizing: content-box;
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 30px;
	padding-right: 30px;
}

/* Kit typography (production Elementor globals) for content blocks. */
:where(.page-body h2) { font-size: 48px; font-weight: 500; line-height: 1.3; letter-spacing: -1px; color: var(--ink); }
:where(.page-body h3) { font-size: 30px; font-weight: 500; line-height: 1.3; color: var(--ink); }
:where(.page-body h4) { font-size: 24px; font-weight: 500; line-height: 1.4; color: var(--ink); }
:where(.page-body h5) { font-size: 20px; font-weight: 500; line-height: 1.3; letter-spacing: -.4px; color: var(--ink); }
:where(.page-body h6) { font-size: 16px; font-weight: 500; line-height: 1.5; letter-spacing: -.2px; color: var(--ink); }

/* Gold "C" decoration (see ccr_curve_html). Its section must clip it (overflow: clip). */
.ccr-curve {
	position: absolute;
	top: -60px;
	right: -23px;
	z-index: 2;
	width: 98px;
	height: 150px;
	color: #dfb64d;
	pointer-events: none;
}
.ccr-curve__fx, .ccr-curve .ccr-svg { display: block; width: 100%; height: 100%; }

/* Eyebrow with the gold quarter-circle (paragraph/heading block style "Eyebrow"). */
.is-style-ccr-eyebrow {
	display: flex;
	align-items: flex-start;
	font-family: var(--ff);
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: -.2px;
	color: var(--ink);
}
.is-style-ccr-eyebrow::before {
	content: "";
	flex: none;
	width: 18px;
	height: 18px;
	margin: 2px 9.5px 0 0;
	background: var(--gold);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='m0,1.02h0c281.02,0,509.18,228.16,509.18,509.18v1.81H0V1.02h0Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='m0,1.02h0c281.02,0,509.18,228.16,509.18,509.18v1.81H0V1.02h0Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Section heading with a line above (production Contact "How can we help you?"). */
.page-body .is-style-ccr-ruled { position: relative; margin-bottom: 40px; padding-top: 40px; }
.page-body .is-style-ccr-ruled::before { content: ""; position: absolute; top: 0; left: 30px; right: 30px; height: 1px; background: var(--line); }

/* Button block styles: outline (default), gold filled, text link. */
.wp-block-button .wp-block-button__link {
	display: inline-block; padding: 16.5px 32px; border: 1px solid var(--teal); border-radius: 0; background: transparent;
	font-family: var(--ff); font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--ink); text-decoration: none; transition: all .3s;
}
.wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:focus-visible { background: var(--gold); border-color: var(--gold); color: var(--teal); }
.wp-block-button.is-style-ccr-gold .wp-block-button__link { background: var(--gold); }
.wp-block-button.is-style-ccr-gold .wp-block-button__link:hover, .wp-block-button.is-style-ccr-gold .wp-block-button__link:focus-visible { background: var(--white); border-color: var(--gold); color: var(--teal); }
.wp-block-button.is-style-ccr-link .wp-block-button__link {
	padding: 0; border: 0; border-bottom: 1px solid var(--gold); background: none;
	font-family: var(--ff2); font-size: 14px; font-weight: 600; line-height: 1.4; letter-spacing: -.4px; color: var(--teal);
}
.wp-block-button.is-style-ccr-link .wp-block-button__link:hover, .wp-block-button.is-style-ccr-link .wp-block-button__link:focus-visible { background: none; color: var(--ink); }

/* Cards (production loop items 547 = project, 7839 = bordered post) */
.pcard { display: flex; flex-direction: column; }
.pcard__media { display: block; }
.pcard__img { width: 100%; height: auto; }
.pcard__term, .bcard__term { align-self: flex-start; font-size: 12px; font-weight: 600; line-height: 1.8; color: var(--teal); }
.pcard__term:hover, .bcard__term:hover { color: var(--gold); }
.pcard__title, .bcard__title { margin: 0; font-family: var(--ff); font-size: 20px; font-weight: 500; line-height: 1.3; letter-spacing: -.4px; color: var(--ink); }
.pcard__title a, .bcard__title a { color: var(--ink); --u-color: var(--gold); }
.pcard__title a:hover, .bcard__title a:hover { color: var(--ink); }
.pcard__excerpt, .bcard__excerpt { margin: 0; font-size: 14px; font-weight: 300; line-height: 1.4; color: var(--gray); }
/* Production's term sits in a 21.6px line (12px × 1.8): the link text starts 3px lower and the title 2.6px lower. */
.pcard > .pcard__term { margin-top: 18px; line-height: 14px; }
.pcard > .pcard__title { margin-top: 14.6px; }
.pcard > .pcard__excerpt { margin-top: 10px; }
.bcard { display: flex; flex-direction: column; height: 100%; padding: 20px 30px 50px; border: 1px solid var(--line); }
.bcard > * + * { margin-top: 15px; }
.bcard__media { display: block; }
.bcard__img { width: 100%; height: 100%; object-fit: cover; }
.bcard > .bcard__title { margin-top: 23px; }
.bcard > .bcard__title + .bcard__excerpt { margin-top: 23px; }

/* Project page (template single-ccr_project) */
.project-body { margin-bottom: 130px; padding: 0 30px; overflow: clip; }
.project-body__inner { display: flex; align-items: stretch; max-width: 1287px; margin: 0 auto; }
.project-body__main { width: 65%; padding-top: 40px; border-top: 1px solid var(--line); }
.project-body__aside { width: 34.333%; padding-left: 10.3%; }
.page-body .project-content > * { max-width: none; margin: 0; padding: 0; }
.project-content > * + * { margin-top: 20px; }
.project-content h2.is-style-ccr-eyebrow { font-size: 20px; line-height: 26px; letter-spacing: -.4px; }
.project-content h2.is-style-ccr-eyebrow + * { margin-top: 40px; }
.project-content p { margin: 0 0 20px; font-size: 20px; font-weight: 300; line-height: 1.5; color: var(--gray); }
.project-content > p + p { margin-top: 0; }
.project-content > p:last-of-type { margin-bottom: 40px; }
.project-content .wp-block-image { margin: 0 0 60px; padding: 0 10px; }
.project-content > p + .wp-block-image, .project-content > p + .wp-block-gallery { margin-top: 50px; }
.project-content .wp-block-image img { width: 100%; height: auto; }
/* Video: same column and side padding as the images, 10px above the next image (production OVO page). */
.project-content .wp-block-embed { margin: 0 0 10px; padding: 0 10px; }
.project-content > p + .wp-block-embed { margin-top: 50px; }
.project-content > .wp-block-embed + * { margin-top: 0; }
.project-content .wp-block-gallery { gap: 0 !important; margin: 0 0 50px; }
.project-content .wp-block-gallery .wp-block-image { margin: 0 !important; padding: 0 10px; }
.project-content .wp-block-gallery.columns-2 .wp-block-image { width: 50% !important; }
.project-content .wp-block-gallery .wp-block-image img { height: auto !important; object-fit: initial !important; }
.project-figure { display: flex; flex-direction: column; justify-content: flex-end; margin: 0 0 40px; padding: 100px 50px 30px 30px; background: var(--teal); }
.project-figure .project-figure__value { margin: 0 0 15px; font-size: 70px; font-weight: 700; line-height: 1; color: var(--gold); }
.project-figure .project-figure__label { margin: 0; font-size: 16px; font-weight: 500; line-height: 1.5; letter-spacing: -.2px; color: var(--white); }

.project-content .wp-block-gallery.is-style-ccr-carousel { display: block; padding: 0 10px; }
.project-content .wp-block-gallery.is-style-ccr-carousel .wp-block-image { width: 100% !important; padding: 0; }
.project-content .wp-block-gallery.is-style-ccr-carousel .wp-block-image img { aspect-ratio: 3 / 2; object-fit: cover !important; }
.gcar { position: relative; padding-bottom: 30px; }
.gcar__viewport { overflow: hidden; touch-action: pan-y; }
.gcar__track { display: flex; }
.gcar__arrow { position: absolute; top: calc(50% - 15px); z-index: 1; width: 25px; height: 25px; padding: 0; border: 0; background: none; color: rgba(237, 237, 237, .9); cursor: pointer; transform: translateY(-50%); }
.gcar__arrow svg { width: 100%; height: 100%; }
.gcar__arrow--prev { left: 10px; }
.gcar__arrow--next { right: 10px; }
.gcar__dots { position: absolute; left: 0; right: 0; bottom: 5px; display: flex; justify-content: center; }
.gcar__dots .dot { background: #000; opacity: .2; }
.gcar__dots .dot.is-active { opacity: 1; }

/* Blog post (template single) */
.post-header { max-width: 830px; margin: 0 auto 40px; padding: 85px 0 0; border-top: 1px solid var(--line); box-sizing: content-box; text-align: center; }
.page-body > .post-header { padding-left: 30px; padding-right: 30px; }
.post-header__cat { margin-bottom: 30px; font-size: 12px; font-weight: 600; line-height: 1.4; }
.post-header__cat a { color: var(--ink); }
.post-header__cat a:hover { color: var(--gold); }
.post-header__title { margin: 0 0 30px; padding: 0 1%; font-size: 48px; font-weight: 500; line-height: 1.3; letter-spacing: -1px; color: var(--ink); }
.post-header__image { margin: 0; }
.post-header__image img { width: 100%; height: 38vh !important; object-fit: cover; }
.page-body > .post-content { box-sizing: content-box; max-width: 830px; margin: 0 auto 30px; padding: 0 30px; }
.post-content > * { margin: 0; }
.post-content p { margin: 0 0 16px; font-size: 16px; font-weight: 300; line-height: 1.4; color: var(--gray); }
.post-content h2 { margin: .6em 0 .3em; font-size: 48px; font-weight: 500; line-height: 1.3; letter-spacing: -1px; color: var(--ink); }
.post-content h2 strong { font-weight: 700; }
.post-content h3 { margin: .6em 0 .3em; font-size: 30px; font-weight: 500; line-height: 1.3; color: var(--ink); }
.post-content ul, .post-content ol { margin: 16px 0; padding-left: 1.7em; list-style: disc; }
.post-content ol { list-style: decimal; }
.post-content li { font-size: 16px; font-weight: 300; line-height: 1.4; color: var(--gray); }
.post-content a { color: var(--ink); }
.post-content a:hover { color: var(--gold); }
.post-content .wp-block-image { margin: 0; }
.post-content .wp-block-image img { width: 100%; height: auto; }
.post-content .wp-block-quote { margin: 30px 0; padding-left: 20px; border-left: 3px solid var(--gold); }
.post-content .wp-block-quote p { font-size: 20px; line-height: 1.5; color: var(--ink); }
/* Production: a 45px spacer after the text and 70px more before the footer (Tags row is hidden when empty). */
.single-post .related { margin-top: 200px; margin-bottom: 200px; }

/* Legal pages (template page-legal) */
.legal {
	position: relative;
	padding: 30px 30px 130px;
	overflow: clip;
}
.legal__inner { max-width: 1280px; margin: 0 auto; }
.legal__inner > .wp-block-post-content { padding-right: 25%; }
.legal h2 { margin: 40px 0 20px; font-size: 30px; font-weight: 500; line-height: 1.3; letter-spacing: -1px; color: var(--ink); }
.legal h2:first-child { margin-top: 0; }
.legal p, .legal li { font-size: 16px; font-weight: 300; line-height: 1.4; color: var(--gray); }
.legal p { margin: 0 0 16px; }
.legal ul, .legal ol { margin: 16px 0; padding-left: 1.7em; list-style: disc; }
.legal ol { list-style: decimal; }
.legal a { color: var(--ink); }
.legal a:hover { color: var(--gold); }

@media (max-width: 1024px) {
	.ccr-curve { top: 0; right: -31px; }
	.ccr-curve--desktop { display: none; }
	:where(.page-body h2) { font-size: 32px; }
	:where(.page-body h3) { font-size: 24px; }
	:where(.page-body h4) { font-size: 20px; }
	:where(.page-body h5) { font-size: 18px; }
	:where(.page-body h6), .is-style-ccr-eyebrow { letter-spacing: 0; }
	.is-style-ccr-eyebrow::before { margin-top: 3px; }
	.wp-block-button .wp-block-button__link { padding: 15px 30px; }
	.legal { padding: 60px 30px 90px; }
	.pcard__title, .bcard__title { font-size: 18px; }
	.project-body { margin-bottom: 90px; }
	.project-body__main { width: 64%; padding-top: 30px; }
	.project-body__aside { width: 36%; padding-left: 5.4%; }
	.project-content h2.is-style-ccr-eyebrow { font-size: 18px; line-height: 23.4px; }
	.project-content h2.is-style-ccr-eyebrow + * { margin-top: 20px; }
	.project-content p { font-size: 19px; }
	.project-content > p:last-of-type { margin-bottom: 30px; }
	.project-content > p + .wp-block-image, .project-content > p + .wp-block-gallery, .project-content > p + .wp-block-embed { margin-top: 40px; }
	.project-figure { padding-right: 40px; }
	.project-figure .project-figure__value { font-size: 60px; }
	.post-header { margin-bottom: 30px; padding-top: 40px; }
	.post-header__cat { margin-bottom: 20px; }
	.post-header__title { padding: 0 10%; font-size: 32px; }
	.post-content h2 { font-size: 32px; }
	.post-content h3 { font-size: 24px; }
	.single-post .related { margin-top: 160px; margin-bottom: 160px; }
	.bcard { padding: 20px 20px 40px; }
	.page-body .is-style-ccr-ruled { margin-bottom: 90px; padding-top: 30px; }
	.legal__inner > .wp-block-post-content { padding-right: 100px; }
}
@media (max-width: 767px) {
	.page-body > .wp-block-post-content:not(.post-content) > :where(:not([class*="wp-block-ccr-"]):not(.alignfull)) { padding-left: 20px; padding-right: 20px; }
	.ccr-curve { display: none; }
	:where(.page-body h2) { font-size: 25px; }
	:where(.page-body h3) { font-size: 22px; line-height: 1.1; }
	:where(.page-body h4) { font-size: 18px; }
	.is-style-ccr-eyebrow::before { margin-top: 0; }
	.wp-block-button .wp-block-button__link { padding: 14px 28px; }
	.wp-block-button.is-style-ccr-link .wp-block-button__link { padding: 0; }
	.legal { padding: 50px 20px 60px; }
	.bcard { padding: 20px 20px 30px; }
	.project-body { margin-bottom: 60px; padding: 0 20px; }
	.project-body__inner { flex-direction: column; }
	.project-body__main { width: 100%; padding: 30px 0 60px; border-top: 0; }
	.project-body__aside { width: 100%; padding-left: 0; }
	.project-content h2.is-style-ccr-eyebrow + * { margin-top: 20px; }
	.project-content p { font-size: 18px; }
	.project-content > p:last-of-type { margin-bottom: 20px; }
	.project-content > p + .wp-block-image, .project-content > p + .wp-block-gallery, .project-content > p + .wp-block-embed { margin-top: 30px; }
	.project-content .wp-block-image { padding: 0 10px; }
	.project-content .wp-block-gallery.columns-2 .wp-block-image { width: 100% !important; margin-bottom: 20px !important; }
	.project-figure .project-figure__value { font-size: 45px; }
	.page-body > .post-header { padding: 40px 20px 0; }
	.page-body > .post-content { padding: 0 20px; }
	.post-header { margin-bottom: 30px; text-align: left; }
	.post-header__cat { margin-bottom: 0; }
	.post-header__title { padding: 0; font-size: 25px; }
	.post-header__image img { height: 35vh !important; }
	.post-content p, .post-content li { line-height: 1.5; }
	.post-content h2 { font-size: 25px; }
	.post-content h3 { font-size: 22px; }
	.single-post .related { margin-top: 130px; margin-bottom: 150px; }
	.page-body .is-style-ccr-ruled { margin-bottom: 60px; }
	.page-body .is-style-ccr-ruled::before { left: 20px; right: 20px; }
	.legal__inner > .wp-block-post-content { padding-right: 45px; }
	.legal p, .legal li { line-height: 1.5; }
}

/* Mobile gutters (kept here so they always follow the desktop .sec rule in the cascade). */
@media (max-width: 767px) {
	.sec { padding-left: 20px; padding-right: 20px; }
}