/* Section patterns: Hero and Boxed Content.
   Written to reproduce the live site exactly (measured values, see docs/proof-test.md). */

/* ---- Slanted divider (a triangle along the bottom edge) ---- */
.has-divider { position: relative; }
.has-divider::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	height: var(--divider-height, 4em);
	background: var(--divider-color, var(--white));
	clip-path: polygon(0 100%, 100% 0, 100% 100%);
	pointer-events: none;
}
.has-divider--flip::after { transform: scaleX(-1); }
.has-divider--white { --divider-color: var(--white); }
.has-divider--grey { --divider-color: var(--neutral-ultra-light); }

/* ---- Hero ---- */
.wp-block-cover.hero {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	min-height: 0;
	padding: var(--section-space-xxl) var(--gutter) var(--section-space-xl);
	gap: var(--space-xl);
	overflow: hidden;
	color: var(--white);
}
.hero.has-divider::after { --divider-height: 6rem; bottom: -2px; }
.hero .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: calc(var(--space-m) / 1.5);
	width: 100%;
}
.hero .wp-block-cover__inner-container > * { margin: 0; }
.hero__subheading {
	color: var(--white);
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.5;
	text-transform: uppercase;
}
.hero__heading { color: var(--white); font-size: var(--h1); text-wrap: balance; }
.hero__lede { max-width: 800px; color: var(--white); }

/* Hero buttons: outlined white */
.hero .wp-block-button__link, .cta .wp-block-button__link { color: var(--white); border-color: var(--white); background: transparent; }

/* Every button carries the circled-arrow icon (1.5em, 10px gap), as on the live site */
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.wp-block-button__link::after {
	content: "";
	flex: none;
	width: 1.5em;
	height: 1.5em;
	background: currentColor;
	-webkit-mask: var(--icon-circle-arrow) center / contain no-repeat;
	mask: var(--icon-circle-arrow) center / contain no-repeat;
}
.wp-block-button.is-style-fill .wp-block-button__link { color: var(--white); background: var(--primary); }

/* Button hover and keyboard focus (measured on live: outline buttons fill with the brand red) */
.wp-block-button__link { transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; }
.wp-block-button__link:hover, .wp-block-button__link:focus-visible { color: var(--primary-ultra-light); background: var(--primary); border-color: var(--primary); }
.hero .wp-block-button__link:hover, .cta .wp-block-button__link:hover,
.hero .wp-block-button__link:focus-visible, .cta .wp-block-button__link:focus-visible { color: var(--white); }
:root {
	--icon-circle-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2.75a9.25 9.25 0 1 0 0 18.5a9.25 9.25 0 0 0 0-18.5ZM1.25 12C1.25 6.063 6.063 1.25 12 1.25S22.75 6.063 22.75 12S17.937 22.75 12 22.75S1.25 17.937 1.25 12Zm8.72-3.53a.75.75 0 0 1 1.06 0l3 3a.75.75 0 0 1 0 1.06l-3 3a.75.75 0 1 1-1.06-1.06L12.44 12L9.97 9.53a.75.75 0 0 1 0-1.06Z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

/* The live hero always holds a (sometimes empty) button row, and an empty row still adds one flex gap. */
.hero--no-cta .wp-block-cover__inner-container::after { content: ""; display: block; }

@media (max-width: 991px) { .hero.has-divider::after { display: none; } }
@media (max-width: 478px) {
	.wp-block-cover.hero { padding-bottom: var(--section-space-m); }
	.hero__heading { font-size: calc(3rem + (5 * ((100vw - 36rem) / 100.6))); }
}

/* ---- Hero with a form: two columns on wide screens (text left, white card right), stacked below 992px ---- */
.wp-block-cover.hero--form { padding-top: var(--section-space-xl); }
.hero--form .wp-block-cover__inner-container {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: center;
	gap: var(--space-m);
}
.hero--form .hero__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: calc(var(--space-m) / 1.5);
}
.hero--form .hero__content > * { margin: 0; }
.hero--form .hero__content::after { content: ""; display: block; } /* the empty button row, as on the other heroes */
.hero__form {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--space-m);
	padding: var(--space-l);
	border: 1px solid #ccc;
	background: var(--white);
	color: var(--black);
}
.hero__form > * { margin: 0; }
/* The "Get your free quote" buttons link to #quote: leave room for the fixed header, as live does */
.hero__form { scroll-margin-top: 145px; }
@media (max-width: 991px) { .hero__form { scroll-margin-top: 85px; } }
.hero--form .hero__heading { font-size: var(--h2); }
.hero__form-title { color: var(--primary); font-size: var(--h3); text-transform: uppercase; }
@media (max-width: 991px) { .hero--form .wp-block-cover__inner-container { grid-template-columns: minmax(0, 1fr); } }

/* ---- Feature grid (cards): grey band, red heading, grid of white cards ---- */
.cards {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-m) var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.cards.has-top-none { padding-top: 0; }
.cards.has-bottom-large { padding-bottom: var(--section-space-l); }
.cards__intro { display: flex; flex-direction: column; align-items: center; gap: var(--space-m); width: 100%; max-width: 100%; text-align: center; }
.cards__intro > * { margin: 0; }
.cards .intro__heading { color: var(--primary); font-size: var(--h2); line-height: 1.1; }
.cards .cards-grid {
	display: grid;
	grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr));
	justify-content: space-between;
	align-items: stretch;
	gap: var(--space-m);
	width: 100%;
	max-width: 100%;
	margin: var(--text-m) 0 0;
}
.cards-grid.grid--2 { --cols: 2; }
.cards-grid.grid--4 { --cols: 4; }
.card {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
	gap: calc(var(--space-m) * 1.5) var(--space-m);
	max-width: 100%;
	margin: 0;
	padding: var(--space-m);
	border: 1px solid #ccc;
	border-radius: var(--radius);
	background: var(--white);
}
.card__inner { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-m); }
.card__inner > * { margin: 0; }
.card__body { display: flex; flex-direction: column; align-items: flex-start; gap: calc(var(--space-m) * 0.625); }
.card__body > * { margin: 0; }
.card__icon { width: 100px; height: 100px; margin: 0; }
.card__icon img { display: block; width: 100px; height: 100px; }
.card__heading { color: var(--base); font-size: var(--h3); text-transform: uppercase; }
.card .wp-block-buttons { width: 100%; margin: 0; }
.cards--plain { text-align: center; }
.cards--plain .cards-grid { gap: 0; }
.cards--plain .card { align-items: center; border: 0; background: transparent; }
.cards--plain .card__inner, .cards--plain .card__body { align-items: center; }
@media (max-width: 1100px) { .cards-grid.grid--4 { --cols: 2; } }
@media (max-width: 991px) { .cards-grid.grid--2, .cards-grid.grid--3 { --cols: 1; } }
@media (max-width: 767px) { .cards-grid.grid--4 { --cols: 1; } }
@media (max-width: 478px) { .cards .cards-grid { margin-top: 0; } }

/* ---- Callout: grey band with a rule on top, red heading left, large text right ---- */
.callout {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-m) var(--space-xl);
	padding: 0 var(--gutter) var(--section-space-m);
}
.callout.has-bottom-none { padding-bottom: 0; }
.callout .callout__divider { width: 100%; height: 0; margin: 0; border: 0; border-top: 2px solid var(--base); background: none; opacity: 1; }
.callout .callout__inner {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--space-m) var(--space-xl);
	width: 100%;
	max-width: 100%;
	padding-top: var(--section-space-s);
	text-align: left;
}
.callout .callout__inner > * { margin: 0; }
.callout .callout__heading { max-width: 100%; color: var(--primary); font-size: var(--h2); }
@media (max-width: 767px) {
	.callout .callout__inner { flex-wrap: wrap; }
	.callout .callout__heading, .callout .callout__text { flex: none; width: 100%; }
}

/* ---- Call to action: dark band, white text, artwork anchored bottom right ---- */
.cta {
	position: relative;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.cta .cta__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-m); width: 100%; max-width: 100%; }
.cta .cta__inner > * { margin: 0; }
.cta .cta__heading { max-width: 820px; color: var(--white); font-size: var(--h2); }
.cta .cta__lede { max-width: 820px; color: var(--white); }
.cta .cta__inner .wp-block-buttons { margin: 0; }
.cta--no-lede .cta__inner .cta__heading { margin-bottom: var(--space-m); } /* live keeps an empty text block between heading and button, which still adds one gap */
.cta .cta__image { position: absolute; right: 0; bottom: 0; width: 700px; max-width: 100%; margin: var(--text-m) 0; }
.cta .cta__image img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
@media (max-width: 767px) {
	.cta .cta__image { width: 300px; }
	.cta .cta__image img { height: 150px; object-fit: cover; }
}

/* ---- Video (lightbox) and the generic section spacing classes ---- */
.video {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.video .video__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: center;
	gap: var(--space-m);
	width: 100%;
	max-width: 100%;
	margin: 0;
}
.video .video__grid > * { margin: 0; min-width: 0; }
.video .video__heading { color: var(--primary); font-size: var(--h2); }
@media (max-width: 767px) {
	.video .video__grid { grid-template-columns: minmax(0, 1fr); }
	.video .video__heading { order: -1; }
}

/* Spacing choices shared by the section patterns (the live "top space" and "bottom space" settings) */
.wp-block-group.has-top-none { padding-top: 0; }
.wp-block-group.has-top-large { padding-top: var(--section-space-l); }
.wp-block-group.has-bottom-none { padding-bottom: 0; }
.wp-block-group.has-bottom-medium { padding-bottom: var(--section-space-m); }
.wp-block-group.has-bottom-large { padding-bottom: var(--section-space-l); }
@media (max-width: 767px) { .wp-block-group.has-bottom-none-mobile { padding-bottom: 0; } }

/* Slanted edge along the TOP of a section: a triangle hanging from the top edge (thick on the left; with --flip, thick on the right),
   in the colour of the section above, so the two sections run into each other */
.has-divider--top { position: relative; }
.has-divider--top::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
	height: var(--divider-height, 5rem);
	background: var(--divider-color, var(--white));
	clip-path: polygon(0 0, 100% 0, 0 100%);
	pointer-events: none;
}
/* A top slant is only the top slant (the base .has-divider rule also draws a bottom one), and it can be flipped, as on live */
.has-divider--top::after { display: none; }
.has-divider--top.has-divider--flip::before { transform: scaleX(-1); }

/* ---- FAQ: white card on a grey band; text left (sticky), core Accordion right ---- */
.faq {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: var(--section-space-m) var(--gutter) 0;
}
.faq .faq__grid {
	box-sizing: border-box;
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	align-items: stretch;
	gap: var(--space-xl);
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: var(--section-space-m) var(--section-space-s);
}
.faq .faq__content {
	position: sticky;
	top: 0;
	align-self: start;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-m);
}
.faq .faq__content > * { margin: 0; }
.faq .faq__heading { color: var(--primary); font-size: var(--h2); }
.faq .faq__list { width: 100%; margin: 0; }
.faq .faq__list .wp-block-accordion-item { margin: 0; border-bottom: 1px solid #ccc; }
.faq .faq__list .wp-block-accordion-heading { margin: 0; }
.faq .faq__list .wp-block-accordion-heading__toggle {
	align-items: flex-start;
	gap: calc(var(--space-xl) / 2);
	padding: var(--space-xs);
	color: var(--base);
	font-family: var(--wp--preset--font-family--saira);
	font-size: var(--h3);
	font-weight: 600;
	line-height: 1.1;
	text-align: left;
	text-transform: none;
}
.faq .faq__list .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title { text-decoration: none; }
.faq .faq__list .wp-block-accordion-heading__toggle:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.faq .faq__list .wp-block-accordion-heading__toggle-icon {
	flex: none;
	width: 32px;
	height: 32px;
	font-size: 0; /* hides the "+" glyph; the chevron below replaces it */
	background: var(--primary);
	-webkit-mask: var(--icon-chevron-down) center / 18px 12px no-repeat;
	mask: var(--icon-chevron-down) center / 18px 12px no-repeat;
	transform: none;
}
.faq .faq__list .wp-block-accordion-item.is-open > .wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon { transform: rotate(180deg); }
.faq .faq__list .wp-block-accordion-panel { padding: var(--space-xs); }
.faq .faq__list .wp-block-accordion-panel > * { margin: 0; }
:root { --icon-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12'%3E%3Cpath d='M1.5 1.5 9 9l7.5-7.5' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
@media (max-width: 991px) {
	.faq .faq__grid { grid-template-columns: minmax(0, 1fr); }
	.faq .faq__content { position: static; } /* one column: a sticky intro would slide over the questions */
	.faq .faq__list .wp-block-accordion-heading__toggle, .faq .faq__list .wp-block-accordion-panel { padding-right: 0; padding-left: 0; }
}
@media (max-width: 478px) {
	.faq .faq__grid { padding: var(--section-space-xs); }
	.faq .faq__list .wp-block-accordion-heading__toggle { gap: 0; }
}

/* ---- Testimonials: heading and a carousel of testimonial cards (carousel and card are plugin blocks) ---- */
.testimonials {
	--divider-height: 5em;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: var(--section-space-m) var(--gutter) var(--section-space-xl);
	color: var(--base);
}
.testimonials .testimonials__inner { display: flex; flex-direction: column; align-items: center; gap: var(--space-m); width: 100%; max-width: 100%; }
.testimonials .testimonials__inner > * { margin: 0; }
.testimonials .testimonials__heading { color: var(--primary); font-size: var(--h2); }
.testimonials .infinity-carousel { margin: 0; color: var(--black); }
/* On phones live shows the arrows under the card (the carousel hides them elsewhere): 50px squares, 26px apart,
   an arrow icon, grey only while there is nothing to go back or forward to. And the heading sits on the left. */
@media (max-width: 478px) {
	.testimonials .testimonials__heading { align-self: stretch; text-align: left; }
	/* As on live they hang 22px below the card inside the section's bottom padding, so the section keeps its height. */
	.testimonials .infinity-carousel__controls:not([hidden]) { position: absolute; top: calc(100% + 2.2rem); right: 0; left: 0; width: auto; height: auto; margin: 0; overflow: visible; clip-path: none; gap: 2.6rem; }
	.testimonials .infinity-carousel__button { width: 5rem; height: 5rem; border-radius: 0; }
	.testimonials .infinity-carousel__button svg { display: none; }
	.testimonials .infinity-carousel__button::before {
		content: "";
		width: 2.4rem;
		height: 2.4rem;
		background: currentColor;
		-webkit-mask: var(--icon-arrow-right) center / contain no-repeat;
		mask: var(--icon-arrow-right) center / contain no-repeat;
	}
	.testimonials .infinity-carousel__button--prev::before { transform: scaleX(-1); }
}
@media (max-width: 991px) { .testimonials { padding-bottom: calc(var(--section-space-xxl) / 1.2); } }
@media (max-width: 478px) { .testimonials { padding-bottom: var(--section-space-xxl); } }

/* ---- Service locations: two bordered cards, each with a 350px picture or map on top ---- */
.locations {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-m) var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.locations .locations__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	gap: var(--space-m);
	width: 100%;
	max-width: 100%;
	margin: 0;
}
.locations .locations__card {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	max-width: 100%;
	margin: 0;
	border: 1px solid #ccc;
	border-radius: var(--radius);
	background: var(--white);
	overflow: hidden;
}
.locations .locations__card > * { margin: 0; }
.locations .locations__card > .wp-block-infinity-map,
.locations .locations__image { flex: none; width: 100%; height: 35rem; }
.locations .locations__image img { display: block; width: 100%; height: 100%; border-radius: var(--radius); object-fit: cover; }
.locations .locations__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: calc(var(--space-m) * 0.625);
	padding: var(--space-m);
}
.locations .locations__body > * { margin: 0; }
.locations .locations__heading { color: var(--primary); font-size: var(--h2); }
.locations .locations__body .wp-block-list.is-style-icon-list { margin: 0; }
@media (max-width: 991px) { .locations .locations__grid { grid-template-columns: minmax(0, 1fr); } }

/* ---- Careers: heading and a list of jobs (or the "no opportunities" text) ---- */
.careers {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: 0 var(--space-s);
}
.careers .careers__inner {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 1366px;
	padding: var(--space-xl) 0;
}
.careers .careers__inner > * { margin: 0; }
.careers .careers__heading { color: var(--primary); font-size: var(--h2); }
.careers .wp-block-query { display: flex; flex-direction: column; align-items: center; gap: var(--space-xl); width: 100%; max-width: 100%; }
.careers .wp-block-post-template { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-xl); width: 100%; margin: 0; padding: 0; list-style: none; }
.careers .wp-block-post-template:empty { display: none; }
.careers .careers__job { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-s); margin: 0; }
.careers .careers__job > * { margin: 0; }
.careers .careers__job-title { color: var(--base); font-size: var(--h3); }
.careers .careers__job-more { display: inline-flex; align-items: center; gap: 10px; padding: var(--btn-padding-block) var(--btn-padding-inline); border: var(--btn-border-width) var(--btn-border-style) var(--primary); border-radius: var(--btn-radius); color: var(--primary); font-family: var(--wp--preset--font-family--saira); font-weight: var(--btn-font-weight); line-height: var(--btn-line-height); text-decoration: none; text-transform: uppercase; }
.careers .careers__job-more::after { content: ""; width: 1.5em; height: 1.5em; background: currentColor; -webkit-mask: var(--icon-circle-arrow) center / contain no-repeat; mask: var(--icon-circle-arrow) center / contain no-repeat; }
.careers .outro__text { max-width: 100%; margin: 0; padding-top: var(--space-m); }
@media (max-width: 991px) { .careers { padding-right: var(--space-m); padding-left: var(--space-m); } }
@media (max-width: 478px) { .careers { padding-right: var(--space-s); padding-left: var(--space-s); } }
@media (max-width: 478px) { .careers .outro__text.has-text-align-center { align-self: stretch; text-align: left; } } /* live: left on phones */

:root {  /* contact icons, from the live site */
  --icon-arrow-right: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22m16.1716 10.9999-5.364-5.36401 1.4142-1.41421 7.7782 7.77822-7.7782 7.7781-1.4142-1.4142 5.364-5.3639h-12.1716v-2z%22/%3E%3C/svg%3E"); /* testimonial arrows, from the live site */
  --icon-pin: url("data:image/svg+xml,%3Csvg fill=%22%23000%22 xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%2227%22 viewBox=%220 0 21 27%22%3E%3Cpath d=%22M10.4 0.500488C7.64172 0.500488 4.99645 1.5962 3.04608 3.54657C1.09571 5.49694 0 8.14221 0 10.9005C0 17.9204 9.16497 25.8504 9.55497 26.1884C9.79044 26.3898 10.0901 26.5005 10.4 26.5005C10.7098 26.5005 11.0095 26.3898 11.245 26.1884C11.7 25.8504 20.7999 17.9204 20.7999 10.9005C20.7999 8.14221 19.7042 5.49694 17.7539 3.54657C15.8035 1.5962 13.1582 0.500488 10.4 0.500488ZM10.4 23.4454C7.63098 20.8454 2.59999 15.2424 2.59999 10.9005C2.59999 8.83177 3.42177 6.84782 4.88455 5.38504C6.34733 3.92226 8.33128 3.10048 10.4 3.10048C12.4686 3.10048 14.4526 3.92226 15.9154 5.38504C17.3782 6.84782 18.1999 8.83177 18.1999 10.9005C18.1999 15.2424 13.169 20.8584 10.4 23.4454ZM10.4 5.70047C9.37151 5.70047 8.36614 6.00545 7.51101 6.57683C6.65588 7.14821 5.98938 7.96033 5.59581 8.91051C5.20223 9.86068 5.09926 10.9062 5.2999 11.9149C5.50054 12.9236 5.99579 13.8502 6.72302 14.5774C7.45025 15.3046 8.3768 15.7999 9.3855 16.0005C10.3942 16.2012 11.4397 16.0982 12.3899 15.7046C13.3401 15.311 14.1522 14.6445 14.7236 13.7894C15.295 12.9343 15.5999 11.9289 15.5999 10.9005C15.5999 9.52133 15.0521 8.1987 14.0769 7.22351C13.1017 6.24832 11.7791 5.70047 10.4 5.70047ZM10.4 13.5004C9.88574 13.5004 9.38305 13.348 8.95549 13.0623C8.52792 12.7766 8.19467 12.3705 7.99789 11.8954C7.8011 11.4203 7.74961 10.8976 7.84993 10.3932C7.95025 9.88887 8.19788 9.4256 8.56149 9.06198C8.92511 8.69837 9.38838 8.45074 9.89273 8.35042C10.3971 8.2501 10.9199 8.30159 11.3949 8.49838C11.87 8.69516 12.2761 9.02841 12.5618 9.45598C12.8475 9.88354 13 10.3862 13 10.9005C13 11.59 12.726 12.2513 12.2384 12.7389C11.7508 13.2265 11.0895 13.5004 10.4 13.5004Z%22 fill=%22currentColor%22%3E%3C/path%3E%3C/svg%3E");
  --icon-phone: url("data:image/svg+xml,%3Csvg fill=%22%23000%22 viewBox=%220 0 26 25%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22m23.845 16.636-5.653-2.533-.016-.007c-.294-.125-.614-.176-.931-.147-.318.029-.623.137-.889.315-.031.021-.061.043-.09.067l-2.921 2.49c-1.85-.899-3.761-2.795-4.66-4.621l2.494-2.965c.024-.03.047-.06.068-.092.173-.265.279-.568.306-.884.028-.315-.023-.633-.148-.923v-.014l-2.54-5.663c-.165-.38-.448-.697-.807-.903s-.776-.29-1.187-.24c-1.626.214-3.119 1.013-4.199 2.247s-1.674 2.819-1.672 4.459c0 9.528 7.752 17.28 17.28 17.28 1.64.003 3.225-.591 4.459-1.672 1.234-1.08 2.033-2.573 2.247-4.199.05-.411-.034-.827-.239-1.187-.206-.359-.522-.643-.902-.808zm-5.565 5.944c-4.072-.004-7.977-1.624-10.856-4.504-2.88-2.88-4.499-6.784-4.504-10.856-.005-1.172.418-2.305 1.188-3.189.77-.883 1.835-1.456 2.997-1.612v.014l2.52 5.64-2.48 2.969c-.025.029-.048.06-.068.092-.181.277-.287.596-.308.926s.044.66.188.958c1.087 2.224 3.328 4.447 5.575 5.533.3.143.632.205.963.181s.651-.133.927-.318c.031-.021.06-.043.089-.067l2.917-2.489 5.64 2.526h.013c-.153 1.163-.725 2.23-1.609 3.003-.884.772-2.018 1.195-3.191 1.192z%22/%3E%3Cpath d=%22m18.288 24.751h-.008c-9.666 0-17.53-7.864-17.53-17.531-.003-1.701.612-3.343 1.733-4.624 1.121-1.28 2.668-2.107 4.355-2.329.466-.055.94.04 1.344.271.403.231.728.594.912 1.021l2.561 5.727c.125.314.176.657.147.995-.031.355-.151.701-.346.999-.029.042-.055.077-.083.112l-2.391 2.843c.878 1.686 2.62 3.413 4.326 4.289l2.795-2.383c.038-.031.076-.06.115-.085.297-.199.645-.322 1.002-.355.362-.034.722.024 1.053.165l5.673 2.543c.426.186.787.51 1.017.912.231.403.327.88.271 1.341-.223 1.69-1.05 3.237-2.329 4.357-1.278 1.118-2.917 1.733-4.616 1.733zm-11.187-24.001c-.067 0-.134.004-.2.012-1.564.206-3 .974-4.042 2.163-1.041 1.189-1.612 2.714-1.609 4.294 0 9.392 7.64 17.031 17.03 17.031h.008c1.578 0 3.1-.571 4.286-1.61 1.188-1.04 1.957-2.476 2.163-4.043.044-.354-.03-.72-.208-1.03s-.456-.56-.784-.702h-.003s-5.653-2.534-5.653-2.534c-.266-.114-.539-.16-.822-.134-.274.025-.542.12-.772.274-.025.017-.048.033-.069.051l-3.042 2.594-.147-.071c-1.891-.918-3.854-2.865-4.774-4.735l-.072-.146 2.599-3.09c.016-.02.035-.045.053-.072.147-.226.24-.492.264-.765.023-.273-.021-.551-.129-.803l-.02-.059-2.519-5.614c-.144-.332-.393-.61-.704-.789-.252-.145-.542-.221-.832-.221zm11.196 22.08h-.018c-4.167-.004-8.085-1.629-11.032-4.576s-4.573-6.866-4.577-11.033c-.004-1.232.439-2.424 1.25-3.353.811-.93 1.93-1.532 3.152-1.695l.313-.042-.026.26 2.558 5.725-2.581 3.088c-.021.024-.036.045-.049.066-.158.243-.251.521-.269.808s.038.575.163.833c1.064 2.176 3.258 4.354 5.459 5.417.259.124.55.172.837.158.287-.021.566-.117.806-.277.025-.017.047-.033.068-.051l3.034-2.59 5.736 2.569h.231l-.024.282c-.161 1.225-.763 2.346-1.692 3.158-.925.809-2.11 1.253-3.339 1.253zm-11.349-20.132c-1.028.181-1.963.708-2.652 1.498-.73.838-1.131 1.912-1.126 3.023.004 4.035 1.578 7.828 4.431 10.681s6.646 4.426 10.68 4.43h.017c1.107 0 2.177-.4 3.011-1.13.79-.69 1.316-1.628 1.496-2.658l-5.335-2.389-2.797 2.387c-.038.031-.075.06-.114.085-.309.207-.671.331-1.045.358-.374.031-.75-.044-1.089-.205-2.295-1.108-4.582-3.379-5.692-5.649-.163-.335-.236-.71-.212-1.083.024-.372.144-.734.348-1.046.026-.041.056-.083.09-.122l2.376-2.844-2.384-5.336z%22/%3E%3C/svg%3E");
  --icon-clock: url("data:image/svg+xml,%3Csvg fill=%22%23000%22 xmlns=%22http://www.w3.org/2000/svg%22 width=%2225%22 height=%2225%22 viewBox=%220 0 25 25%22%3E%3Cpath d=%22M12.0282 0.500488C15.3521 0.500488 18.1878 1.6742 20.5352 4.02162C22.8826 6.36903 24.0563 9.19532 24.0563 12.5005C24.0563 15.8057 22.8826 18.6319 20.5352 20.9794C18.1878 23.3268 15.3521 24.5005 12.0282 24.5005C8.70423 24.5005 5.86855 23.3268 3.52113 20.9794C1.17371 18.6319 0 15.8057 0 12.5005C0 9.19532 1.17371 6.36903 3.52113 4.02162C5.86855 1.6742 8.70423 0.500488 12.0282 0.500488ZM12.0282 22.1343C14.6761 22.1343 16.939 21.1953 18.8169 19.3174C20.6948 17.4395 21.6338 15.1672 21.6338 12.5005C21.6338 9.83382 20.6948 7.56152 18.8169 5.68359C16.939 3.80565 14.6761 2.86669 12.0282 2.86669C9.38028 2.86669 7.11737 3.80565 5.23944 5.68359C3.3615 7.56152 2.42254 9.83382 2.42254 12.5005C2.42254 15.1672 3.3615 17.4395 5.23944 19.3174C7.11737 21.1953 9.38028 22.1343 12.0282 22.1343ZM12.6197 6.47232V12.7822L18.0282 15.9934L17.1268 17.5146L10.8169 13.6836V6.47232H12.6197Z%22 fill=%22currentColor%22%3E%3C/path%3E%3C/svg%3E");
}

/* ---- Contact (details read from Site Options) and the Request-a-quote band ---- */
.contact {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-m) var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.contact .contact__inner,
.contact .contact__grid {
	display: grid;
	align-items: center;
	gap: var(--space-xl);
	width: 100%;
	max-width: 100%;
	margin: 0;
}
.contact .contact__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.contact .contact__grid { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: stretch; }
.contact .contact__inner > .wp-block-infinity-map { height: 60rem; }
.contact .contact__right,
.contact .contact__top,
.contact .quote__content { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-m); margin: 0; font-style: normal; }
.contact .contact__right { justify-content: center; align-self: stretch; }
.contact--form .quote__content { justify-content: center; }
.contact .contact__right > *, .contact .contact__top > *, .contact .quote__content > * { margin: 0; }
.contact .contact__heading, .quote .quote__heading, .contact .quote__heading { color: var(--primary); font-size: var(--h2); }
.contact__info { display: flex; flex-wrap: nowrap; align-items: flex-start; column-gap: 1em; width: 100%; color: var(--black); }
.contact__info::before {
	content: "";
	flex: none;
	order: -1;
	box-sizing: content-box;
	width: 4rem;
	height: var(--icon-h);
	margin-top: calc(var(--space-xs) / 2);
	background: var(--primary);
	-webkit-mask: var(--icon) left top / var(--icon-w) var(--icon-h) no-repeat;
	mask: var(--icon) left top / var(--icon-w) var(--icon-h) no-repeat;
}
.contact__info--address { --icon: var(--icon-pin); --icon-w: 21px; --icon-h: 27px; }
.contact__info--phone { --icon: var(--icon-phone); --icon-w: 26px; --icon-h: 25px; }
.contact__info--hours { --icon: var(--icon-clock); --icon-w: 25px; --icon-h: 25px; }
.contact__content { max-width: 35rem; width: 80%; }
.contact__content > * { margin: 0; }
.contact__info-heading { color: var(--primary); font-size: var(--h4); text-transform: none; }
.contact__text a { color: inherit; text-decoration: none; }
.contact__text a:hover { color: var(--primary); text-decoration: underline; }
@media (max-width: 767px) {
	.contact .contact__inner, .contact .contact__grid { grid-template-columns: minmax(0, 1fr); }
	.contact .contact__inner > .wp-block-infinity-map { height: 30rem; }
}

.quote {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: var(--section-space-m) var(--gutter);
}
.quote .quote__inner {
	display: grid;
	grid-template-columns: minmax(min-content, 1fr) minmax(0, 1.3fr); /* the form never gets narrower than its own minimum, as on live */
	align-items: start;
	gap: var(--space-xl);
	width: 100%;
	max-width: 100%;
	margin: 0;
}
.quote .quote__content { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-m); margin: 0; }
.quote .quote__content > * { margin: 0; }
.quote .quote__image { margin: 0; }
.quote .quote__image img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
@media (max-width: 767px) {
	.quote .quote__inner { grid-template-columns: minmax(0, 1fr); gap: var(--space-m); }
	.quote .quote__image { display: none; }
}

/* ---- Video with the heading above (plays in place) and the video gallery ---- */
.video--above .video__grid { display: flex; flex-direction: column; align-items: center; gap: var(--space-m); }
.video--above .video__heading { text-align: center; }
.video--above .wp-block-infinity-video-lightbox { width: 100%; max-width: 110rem; margin: auto; }
.video-gallery {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: var(--section-space-s) var(--gutter);
}
.video-gallery .infinity-carousel { margin: 0; }
.video-gallery .wp-block-infinity-video-lightbox { margin: 0; }
.video-gallery .infinity-carousel__track { padding-bottom: var(--space-xs); } /* live gives each slide this much room below the frame */
.video-gallery .video-lightbox.is-framed { box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }
.video-gallery .video-lightbox__poster { aspect-ratio: 410 / 226; object-fit: cover; } /* the interview videos are slightly wider than 16:9 */

/* ---- Content: a readable column (82rem) with a red heading, paragraphs and lists ---- */
.content {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-m) var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.content .content__inner {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-m);
	width: 100%;
	max-width: 82rem;
	margin: 0;
}
.content.content--center .content__inner { align-items: center; text-align: center; }
.content .content__inner > * { margin: 0; }
.content .content__heading { color: var(--primary); font-size: var(--h2); }
.content .content__text { width: 100%; max-width: 100%; margin: 0; }
.content .content__text > * { margin: 0; }
.content .content__text > * + * { margin-top: 1em; }
.wp-block-group.has-top-small { padding-top: var(--section-space-s); }
@media (max-width: 991px) { .content .content__inner { max-width: 100%; } }

/* ---- 404 message: a centred red heading and a button under the hero ---- */
.error-message {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: var(--section-space-m) var(--gutter);
}
.error-message .error-message__inner { display: flex; flex-direction: column; align-items: center; gap: var(--space-m); width: 100%; max-width: 100%; }
.error-message .error-message__inner > * { margin: 0; }
.error-message .error-message__heading { color: var(--primary); font-size: var(--h2); text-align: center; }

/* ---- Single career: job text, then the application form (structure from the Bricks template; no live job to measure) ---- */
.career-body { box-sizing: border-box; display: flex; flex-direction: column; align-items: center; padding: var(--section-space-m) var(--gutter); }
.career-body .career-body__inner { display: flex; flex-direction: column; align-items: flex-start; gap: var(--section-space-xs); width: 100%; max-width: 82rem; }
.career-body .career-body__inner > * { margin: 0; }
.career-body .career-body__content > * + * { margin-top: 1em; }
.career-body .career-body__apply { display: flex; flex-direction: column; gap: var(--space-m); width: 100%; scroll-margin-top: var(--section-space-xs); }
.career-body .career-body__apply > * { margin: 0; }
.career-body .career-body__heading { color: var(--primary); font-size: var(--h2); }

/* ---- Hero video: round pause/play button (added by functions.php to a Cover with the class hero--video) ---- */
.hero-video-control {
	position: absolute;
	z-index: 5;
	right: calc(var(--gutter) * 3);
	bottom: calc(var(--space-xxl) * 1.4);
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}
.hero-video-button {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4.4rem;
	height: 4.4rem;
	padding: 0.4375rem;
	border: 0.0625rem solid var(--white);
	border-radius: 100%;
	background: none;
	cursor: pointer;
}
.hero-video-button svg { display: block; width: var(--text-m); height: var(--text-m); margin: 0 auto; fill: var(--white); }
.hero-video-button:focus-visible { outline: 2px solid var(--white); outline-offset: 3px; }
@media (max-width: 991px) {
	.hero-video-control { top: calc(var(--gutter) * 3); right: calc(var(--gutter) * 2); bottom: auto; }
	.hero-video-button { width: 3.625rem; height: 3.625rem; }
}
@media (max-width: 767px) {
	.hero-video-control { top: calc(var(--gutter) * 3.5); right: calc(var(--gutter) * 1.4); }
	.hero-video-button { width: 3.5rem; height: 3.5rem; }
}
@media (max-width: 478px) {
	.hero-video-control { top: calc(var(--gutter) * 5); right: calc(var(--gutter) * 1.2); }
	.hero-video-button { width: 3.375rem; height: 3.375rem; padding: 0; }
}
@media (max-width: 375px) { .hero-video-button { width: 2.125rem; height: 2.125rem; } }

/* ---- Boxed Content: a white card with an image and text side by side ---- */
.boxed-content {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-xl);
	padding: var(--section-space-m) var(--gutter) var(--section-space-m);
}
.boxed-content.has-bottom-none { padding-bottom: 0; }
.boxed-content.has-bottom-large { padding-bottom: var(--section-space-l); }
.boxed-content__inner {
	position: relative;
	z-index: 2; /* the card sits above the slanted edge, as on the live site */
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 0;
	width: 100%;
	margin: 0;
	border: 1px solid #ccc;
	background: var(--white);
}
.boxed-content__media { flex: 0 1 auto; box-sizing: border-box; width: 100%; max-width: 100%; margin: 0; min-height: 600px; }
.boxed-content__media { display: flex; }
.boxed-content__media img { display: block; flex: 1 1 auto; align-self: stretch; width: 100%; height: auto; min-height: 600px; object-fit: cover; }
.boxed-content__content {
	flex: 0 1 auto;
	box-sizing: border-box;
	width: 100%; /* both columns start at 100% and shrink together, which gives the live 636 / 682 split */
	max-width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: var(--space-m);
	padding: var(--space-l);
}
.boxed-content__content > * { margin: 0; }
.boxed-content__lede { width: 100%; }
.boxed-content__lede > * + * { margin-top: 1em; }

@media (min-width: 768px) { .boxed-content__media.is-image-right { order: 1; } }
@media (max-width: 767px) {
	.boxed-content__inner { flex-wrap: wrap; }
	.boxed-content__media { order: -1; flex-basis: 100%; min-height: 300px; }
	.boxed-content__media img { min-height: 300px; }
}

/* ---- List block style: circled-arrow bullets (the live site's list look) ---- */
.wp-block-list.is-style-icon-list {
	display: flex;
	flex-direction: column;
	gap: 1em;
	margin: 1em 0 0;
	padding-left: 2em;
	list-style: none;
}
.wp-block-list.is-style-icon-list:first-child { margin-top: 0; } /* a list that opens its card, as on the landing pages */
.wp-block-list.is-style-icon-list > li { position: relative; }
.wp-block-list.is-style-icon-list > li::before {
	content: "";
	position: absolute;
	top: 0.2em;
	left: -1.6em;
	width: 1.15em;
	height: 1.15em;
	background: var(--primary);
	-webkit-mask: var(--icon-circle-arrow) center / contain no-repeat;
	mask: var(--icon-circle-arrow) center / contain no-repeat;
}

/* ---- Plain core blocks that sit between sections (the certificate gallery on Resources and the landing pages) ---- */
.entry-content > .wp-block-gallery { box-sizing: border-box; margin-top: 1em; padding-inline: var(--gutter); }
/* A plain heading between sections ("We're Certified" on the landing pages) keeps live's top margin: 1.2 x its font size at every width */
.entry-content > .wp-block-heading { margin-top: 1.2em; }
/* Live centres a column group that is narrower than the page (the 1366px column on Work at Infinity) */
.entry-content > .wp-block-columns { justify-content: center; }
.cis-margin-bottom--l { margin-bottom: var(--space-xl); }
@media (max-width: 599px) { .entry-content > .wp-block-gallery figure.wp-block-image:not(#individual-image) { width: 100%; } } /* live shows one logo per row on phones */

/* Numbered list inside a boxed content card (landing pages): red bold numbers, a line of space between items, as on live */
.boxed-content__lede ol { padding-left: 36px; }
.boxed-content__lede ol li + li { margin-top: 1em; }
.boxed-content__lede ol li::marker { color: var(--primary); font-weight: 700; }

/* ---- Content width: on screens wider than the content, live keeps every section's content in a 136.6rem box, centred ---- */
.entry-content .alignfull > :is(.wp-block-cover__inner-container, .cards__intro, .cards-grid, .callout__inner, .video__grid, .boxed-content__inner, .faq__grid,
	.testimonials__inner, .contact__inner, .contact__grid, .cta__inner, .locations__grid, .error-message__inner, .quote__inner, .infinity-carousel) { max-width: 136.6rem; margin-inline: auto; }
/* The certificate gallery between sections: the same box plus the gutters */
.entry-content > .wp-block-gallery { max-width: calc(136.6rem + 2 * var(--gutter)); margin-inline: auto; }