/* ===========================================================================
 * Editor choices.
 * Styles behind the settings the client changes in the block editor sidebar:
 * the icon picker, icon colour, the arrow switch, and the hero and testimonial
 * colour settings. Generated by make_choices_css.py. Loaded last, on the
 * homepage and inside the editor.
 * ======================================================================== */

/* A solid background chosen in the editor replaces the design's gradient. */
.mc-home .has-background:not([class*="-gradient-background"]):not([style*="background:"]):not([style*="background-image"]) {
	background-image: none !important;
}

/* --- Icons added to the set. -------------------------------------------- */

.mc-home {
	--ico-arrow-up-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
	--ico-sparkle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3c.6 4.6 1.9 7.9 9 9-7.1 1.1-8.4 4.4-9 9-.6-4.6-1.9-7.9-9-9 7.1-1.1 8.4-4.4 9-9Z'/%3E%3C/svg%3E");
	--ico-plant: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 28V13l8 4v-7l9 5V5h7l2 23ZM8 23h2m5 0h2m5 0h2M21 5V2h5v3'/%3E%3C/svg%3E");
	--ico-process: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10h9v12h8V10h9M6 6v8m20-8v8M12 18H8v8h8M17 4h6M20 4v6'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
	--ico-hydraulic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 20 13-13 6 6-13 13-6-6Zm-3 8 6-6m13-12 5-5M3 25l4 4M25 3l4 4M14 10l8 8'/%3E%3C/svg%3E");
	--ico-lift: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 28V4h20v5M8 28V8h12M24 9v9c5 0 5 7 0 7-2 0-3-1-3-3M2 28h10M17 28h13'/%3E%3C/svg%3E");
	--ico-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 3 6v6c0 5 9 10 9 10s9-5 9-10V6l-9-4Z'/%3E%3Cpath d='m8 11 3 3 5-5'/%3E%3C/svg%3E");
	--ico-wrench: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 0 0 5.4-5.4l-2.6 2.6-2.4-.6-.6-2.4Z'/%3E%3C/svg%3E");
	--ico-chart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V11M10 20V5M16 20v-6M21 20H3'/%3E%3C/svg%3E");
	--ico-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
	--ico-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9Z'/%3E%3C/svg%3E");
	--ico-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1'/%3E%3C/svg%3E");
	--ico-leaf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21c0-9 5-15 15-16 0 10-6 15-15 16ZM5 21l8-8'/%3E%3C/svg%3E");
	--ico-truck: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3ZM14 10h4l3 3v3h-7'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3C/svg%3E");
	--ico-support: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14v-2a8 8 0 0 1 16 0v2M4 14h3v5H4ZM17 14h3v5h-3Z'/%3E%3C/svg%3E");
	--ico-download: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11m-5-5 5 5 5-5M4 20h16'/%3E%3C/svg%3E");
	--ico-play: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m8 5 11 7-11 7Z'/%3E%3C/svg%3E");
}

.mc-home .mc-ico-arrow-up-right { --mc-ico-src: var(--ico-arrow-up-right); }
.mc-home .mc-ico-sparkle { --mc-ico-src: var(--ico-sparkle); }
.mc-home .mc-ico-star { --mc-ico-src: var(--ico-star); }
.mc-home .mc-ico-shield { --mc-ico-src: var(--ico-shield); }
.mc-home .mc-ico-target { --mc-ico-src: var(--ico-target); }
.mc-home .mc-ico-plant { --mc-ico-src: var(--ico-plant); }
.mc-home .mc-ico-process { --mc-ico-src: var(--ico-process); }
.mc-home .mc-ico-hydraulic { --mc-ico-src: var(--ico-hydraulic); }
.mc-home .mc-ico-lift { --mc-ico-src: var(--ico-lift); }
.mc-home .mc-ico-wrench { --mc-ico-src: var(--ico-wrench); }
.mc-home .mc-ico-leaf { --mc-ico-src: var(--ico-leaf); }
.mc-home .mc-ico-truck { --mc-ico-src: var(--ico-truck); }
.mc-home .mc-ico-support { --mc-ico-src: var(--ico-support); }
.mc-home .mc-ico-chart { --mc-ico-src: var(--ico-chart); }
.mc-home .mc-ico-clock { --mc-ico-src: var(--ico-clock); }
.mc-home .mc-ico-download { --mc-ico-src: var(--ico-download); }
.mc-home .mc-ico-play { --mc-ico-src: var(--ico-play); }
.mc-home .mc-ico-check { --mc-ico-src: var(--ico-check); }
.mc-home .mc-ico-calendar { --mc-ico-src: var(--ico-calendar); }

/* --- Icon colours. ------------------------------------------------------ */

.mc-home .mc-ico-tone-rust { --mc-ico-tone: #1677a8; }
.mc-home .mc-ico-tone-blue { --mc-ico-tone: #0078a8; }
.mc-home .mc-ico-tone-deep { --mc-ico-tone: #0d5d78; }
.mc-home .mc-ico-tone-teal { --mc-ico-tone: #148b9b; }
.mc-home .mc-ico-tone-navy { --mc-ico-tone: #0b2430; }
.mc-home .mc-ico-tone-white { --mc-ico-tone: #ffffff; }

.mc-home .mc-stat.mc-ico[class*="mc-ico-tone-"]::after,
.mc-home .mc-industry.mc-ico[class*="mc-ico-tone-"]::before,
.mc-home .mc-footer .mc-footer-link.mc-ico[class*="mc-ico-tone-"] > .wp-block-button__link::before,
.mc-home .mc-footer-address.mc-ico[class*="mc-ico-tone-"]::before,
.mc-home .mc-division-title.mc-ico[class*="mc-ico-tone-"]::after {
	background-color: var(--mc-ico-tone) !important;
}

/* --- Division cards: the icon in a tinted disc above the title. --------- */

.mc-home .mc-division-title.mc-ico {
	position: relative;
}

.mc-home .mc-division-title.mc-ico::before {
	content: "";
	display: block;
	width: 50px;
	height: 50px;
	margin-bottom: 20px;
	border-radius: 50%;
	background: var(--v2-tint, rgb(0 120 168 / 8%));
}

.mc-home .mc-division-title.mc-ico::after {
	content: "";
	position: absolute;
	left: 12px;
	top: 12px;
	width: 26px;
	height: 26px;
	background-color: var(--mc-rust, #1677a8);
	-webkit-mask: var(--mc-ico-src) center / contain no-repeat;
	mask: var(--mc-ico-src) center / contain no-repeat;
}

/* --- Benefit points and project labels: the icon in a coloured badge. ---
 * The badge circle stays where the design draws it; the chosen icon is laid
 * over it in white, replacing the text glyph the design used before. */

.mc-home .mc-benefit.mc-ico::before,
.mc-home .mc-project > .mc-project-label.mc-ico::before {
	content: "" !important;
	font-size: 0 !important;
}

.mc-home .mc-benefit.mc-ico[class*="mc-ico-tone-"]::before,
.mc-home .mc-project > .mc-project-label.mc-ico[class*="mc-ico-tone-"]::before {
	background: var(--mc-ico-tone) !important;
}

.mc-home .mc-benefit.mc-ico::after,
.mc-home .mc-project > .mc-project-label.mc-ico::after {
	content: "";
	position: absolute;
	background-color: #fff;
	-webkit-mask: var(--mc-ico-src) center / 54% no-repeat;
	mask: var(--mc-ico-src) center / 54% no-repeat;
	pointer-events: none;
}

.mc-home .mc-benefit.mc-ico::after {
	left: 0;
	top: 1px;
	width: 28px;
	height: 28px;
}

.mc-home .mc-project > .mc-project-label.mc-ico::after {
	left: 7px;
	top: 50%;
	width: 22px;
	height: 22px;
	translate: 0 -50%;
}

.mc-home .mc-ico-tone-white.mc-benefit::after,
.mc-home .mc-project > .mc-ico-tone-white.mc-project-label::after {
	background-color: var(--mc-ink, #0b2430);
}

@media (max-width: 700px){
	.mc-home .mc-benefit.mc-ico::after {
		width: 25px;
		height: 25px;
	}
}

/* --- Brochure badge: its text is now an editable paragraph. ------------- */

.mc-home .mc-brochure-card:has(> .mc-brochure-badge)::before {
	content: none;
}

.mc-home .mc-brochure-card > .mc-brochure-badge {
	position: absolute;
	left: 28px;
	top: 28px;
	z-index: 2;
	display: grid;
	place-items: center;
	min-width: 42px;
	height: 42px;
	margin: 0;
	padding: 0 6px;
	border: 1px solid #1677a8;
	background: #fff;
	box-shadow: 0 5px 14px rgb(13 37 55 / 10%);
	color: #1677a8;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1px;
	line-height: 1;
}

@media (max-width: 700px){
	.mc-home .mc-brochure-card > .mc-brochure-badge {
		left: 18px;
		top: 18px;
	}
}

/* --- The arrow switch. ---------------------------------------------------- */

.mc-home .mc-no-arrow > .wp-block-button__link::after,
.mc-home .mc-brochure-card.mc-no-arrow::after {
	content: none !important;
}

/* --- Hero carousel colours. ------------------------------------------------
 * The hero block writes each chosen colour as a custom property on its section,
 * so these rules only take over when the client has picked a colour. */

.mc-home .mc-carousel[style*="--mc-c-bg"],
.mc-home .mc-carousel[style*="--mc-c-bg"] .mc-carousel-selector {
	background: var(--mc-c-bg) !important;
}

.mc-home .mc-carousel[style*="--mc-c-heading"] .mc-slide h2 {
	color: var(--mc-c-heading) !important;
	-webkit-text-fill-color: currentColor;
}

.mc-home .mc-carousel[style*="--mc-c-highlight"] .mc-slide h2 em,
.mc-home .mc-carousel[style*="--mc-c-highlight"] .mc-slide h2 em .mc-word-inner {
	color: var(--mc-c-highlight) !important;
	-webkit-text-fill-color: var(--mc-c-highlight) !important;
	background: none !important;
}

.mc-home .mc-carousel[style*="--mc-c-text"] :is(.mc-slide-description, .mc-slide-assurance, .mc-product-label, .mc-product-caption, .mc-product-features, .mc-carousel-kicker, .mc-carousel-kicker strong, .mc-carousel-count, .mc-brand-selector) {
	color: var(--mc-c-text) !important;
}

.mc-home .mc-carousel[style*="--mc-c-accent"] :is(.mc-slide-eyebrow, .mc-brand-selector.mc-selected small) {
	color: var(--mc-c-accent) !important;
}

.mc-home .mc-carousel[style*="--mc-c-accent"] :is(.mc-slide-eyebrow > span, .mc-product-dot),
.mc-home .mc-carousel[style*="--mc-c-accent"] .mc-product-features > span::before {
	background: var(--mc-c-accent) !important;
}

.mc-home .mc-carousel[style*="--mc-c-button"] .mc-slide .mc-button {
	background: var(--mc-c-button) !important;
}

.mc-home .mc-carousel[style*="--mc-c-button-text"] .mc-slide .mc-button {
	color: var(--mc-c-button-text) !important;
}

/* --- Testimonial colours. -------------------------------------------------- */

.mc-home .mc-testimonials[style*="--mc-c-bg"] {
	background: var(--mc-c-bg) !important;
}

.mc-home .mc-testimonials[style*="--mc-c-heading"] :is(h2, .mc-quote strong, .mc-quote cite) {
	color: var(--mc-c-heading) !important;
}

.mc-home .mc-testimonials[style*="--mc-c-text"] :is(.mc-testimonial-intro > p:not(.mc-eyebrow), .mc-quote > p, .mc-quote > div > span) {
	color: var(--mc-c-text) !important;
}

.mc-home .mc-testimonials[style*="--mc-c-accent"] :is(.mc-eyebrow, .mc-quote-mark) {
	color: var(--mc-c-accent) !important;
}

.mc-home .mc-testimonials[style*="--mc-c-accent"] .mc-quote-dot.is-active {
	background: var(--mc-c-accent) !important;
}

.mc-home .mc-testimonials[style*="--mc-c-card"] .mc-quote-stage {
	background: var(--mc-c-card) !important;
}
