/*
 * Front page only (body.ri-home), on top of shell.css. Everything here is either specific to the
 * homepage's sections or is deliberately louder than the inner pages: the tall slideshow hero,
 * the hand-drawn heading underline, the services grid, the dark bands and the
 * coverage map. Sections are picked out by what they contain (:has) rather than Elementor ids,
 * which are not stable.
 */

/* Section shortcuts (by content) */
/* services:   > .e-con:has(.ri-card h3):not(.ri-dark)
   industries: > .e-con.ri-dark:not(.ri-hero)
   coverage:   > .e-con:has(.ri-feature)
   reviews:    > .e-con:has(.ri-tcarousel)
   what we do: > .e-con:has(.ri-card):not(:has(.ri-card h3)) */

/* Hand-drawn underline (words wrapped by home.js)
   ========================================================================== */

.rh-hl {
	position: relative; white-space: nowrap; padding-bottom: .12em;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none'%3E%3Cpath d='M3 14c52-7 112-10 172-9 42 1 82 3 122 7' fill='none' stroke='%23eb2329' stroke-width='6' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: 0 100%; background-size: 0% .38em;
	transition: background-size 1.1s var(--rh-ease) .15s;
}
.rh-hl.is-drawn, html:not(.rh-motion) .rh-hl { background-size: 100% .38em; }

/* Hero
   ========================================================================== */

.ri-home .ri-hero { --min-height: 88vh; }
.ri-home .ri-hero::before,
.ri-home .ri-hero > .elementor-background-slideshow::before {
	background-image:
		linear-gradient(90deg, rgba(10, 12, 16, .54) 0%, rgba(10, 12, 16, .15) 50%, rgba(10, 12, 16, 0) 100%),
		linear-gradient(180deg, rgba(10, 12, 16, .2) 0%, rgba(10, 12, 16, 0) 30%, rgba(10, 12, 16, .2) 100%) !important;
}
.ri-home .ri-hero > .e-con-inner { max-width: 1240px; align-items: flex-start; }
.ri-home .ri-hero .elementor-widget-heading,
.ri-home .ri-hero .elementor-widget-heading * { text-align: left !important; }
.ri-home .ri-hero h1.elementor-heading-title {
	max-width: 780px; margin: 0;
	font-size: clamp(34px, 3.9vw, 56px) !important; line-height: 1.08 !important; font-weight: 800 !important;
	letter-spacing: -0.025em !important; text-shadow: 0 2px 24px rgba(0, 0, 0, .35); text-wrap: balance;
}
/* Pill label above the headline, in place of the red bar */
.ri-home .ri-hero h1.elementor-heading-title::before {
	content: "Industrial cleaning & painting"; display: flex; align-items: center; gap: .6em; width: max-content; height: auto;
	margin: 0 0 22px; padding: .5em 1em; border-radius: 999px; background: var(--rh-red);
	font-family: Montserrat, sans-serif; font-size: 13px; line-height: 1.4; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	color: #fff; text-shadow: none; box-shadow: 0 8px 24px rgba(235, 35, 41, .45);
}
.ri-home .ri-hero h3.elementor-heading-title {
	max-width: 560px; padding-left: 20px; border-left: 3px solid var(--rh-red);
	font-family: Montserrat, sans-serif !important; font-size: clamp(16px, 1.3vw, 19px) !important; font-weight: 600 !important;
	letter-spacing: 0 !important; line-height: 1.45 !important; color: rgba(255, 255, 255, .92) !important;
}
.ri-home .ri-hero .elementor-widget-button { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; }
.ri-home .ri-hero .elementor-button { padding: 1.05em 1.9em !important; font-size: 17px !important; box-shadow: 0 12px 30px rgba(235, 35, 41, .45); }
.ri-home .ri-hero .rh-hero-call {
	display: inline-flex; align-items: center; gap: .55em;
	background: rgba(255, 255, 255, .08) !important; color: #fff !important;
	box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .7) !important;
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.ri-home .ri-hero .rh-hero-call svg { width: 1.05em; height: 1.05em; fill: currentColor; }
.ri-home .ri-hero .rh-hero-call:hover { background: #fff !important; color: var(--rh-ink) !important; box-shadow: none !important; }

/* Our Services: a category card (red top line) over one icon card per service
   ========================================================================== */

.ri-home .ri-svc-cat { margin-bottom: 4px; }
.ri-home .ri-svc-cat h3.elementor-heading-title { font-size: 22px !important; }

.ri-home .ri-svc-card {
	position: relative;
	background: #fff; border: 1px solid var(--rh-line); border-radius: var(--rh-radius-sm);
	box-shadow: var(--rh-shadow);
	transition: transform .2s var(--rh-ease), box-shadow .2s var(--rh-ease), border-color .2s ease;
}
.ri-home .ri-svc-card { padding: 12px 16px; }
.ri-home .ri-svc-card .elementor-icon-box-wrapper {
	display: flex !important; flex-direction: row !important; align-items: center !important; gap: 14px; text-align: left !important;
}
.ri-home .ri-svc-card .elementor-icon-box-icon { margin: 0 !important; flex: 0 0 auto; line-height: 0; }
.ri-home .ri-svc-card .elementor-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 42px; height: 42px; border-radius: 50%;
	background: rgba(235, 35, 41, .1); color: var(--rh-red); fill: var(--rh-red);
	font-size: 18px; transition: background-color .2s ease, color .2s ease;
}
.ri-home .ri-svc-card .elementor-icon i,
.ri-home .ri-svc-card .elementor-icon svg { width: 18px; height: 18px; font-size: 18px; }
.ri-home .ri-svc-card .elementor-icon-box-content { flex: 1 1 auto; }
.ri-home .ri-svc-card .elementor-icon-box-title {
	margin: 0 !important; font-family: var(--rh-head) !important; font-size: 16.5px !important; line-height: 1.3 !important;
	font-weight: 600 !important; text-transform: none !important; letter-spacing: -0.01em !important; color: var(--rh-ink);
}
.ri-home .ri-svc-card .elementor-icon-box-title a { color: inherit; text-decoration: none; }
/* The whole card is the link */
.ri-home .ri-svc-card .elementor-icon-box-title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ri-home .ri-svc-card .elementor-icon-box-description { display: none; }
.ri-home .ri-svc-card:hover,
.ri-home .ri-svc-card:focus-within {
	transform: translateY(-2px); border-color: rgba(235, 35, 41, .45); box-shadow: var(--rh-shadow-lg);
}
.ri-home .ri-svc-card:hover .elementor-icon,
.ri-home .ri-svc-card:focus-within .elementor-icon { background: var(--rh-red); color: #fff; fill: #fff; }
.ri-home .ri-svc-card:hover .elementor-icon-box-title,
.ri-home .ri-svc-card:focus-within .elementor-icon-box-title { color: var(--rh-red); }
.ri-home .ri-svc-card .elementor-icon-box-title a:focus-visible { outline: none; }
.ri-home .ri-svc-card:focus-within { outline: 2px solid var(--rh-red); outline-offset: 2px; }

/* Industries (dark band)
   ========================================================================== */

.ri-home [data-elementor-type="wp-page"] > .e-con.ri-dark:not(.ri-hero) {
	position: relative; margin-top: -56px;
	clip-path: polygon(0 56px, 100% 0, 100% 100%, 0 100%);
	--padding-top: 136px; --padding-bottom: 96px;
	background:
		radial-gradient(600px 300px at 12% 20%, rgba(235, 35, 41, .22), transparent 70%),
		radial-gradient(500px 280px at 90% 85%, rgba(235, 35, 41, .16), transparent 70%),
		var(--rh-ink) !important;
}

/* What We Do (dark band, breaks up the light run of map, reviews and FAQ)
   ========================================================================== */

.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) {
	position: relative; margin-top: -56px;
	clip-path: polygon(0 56px, 100% 0, 100% 100%, 0 100%);
	--padding-top: 136px; --padding-bottom: 96px;
	background:
		radial-gradient(560px 300px at 88% 18%, rgba(235, 35, 41, .2), transparent 70%),
		radial-gradient(480px 260px at 8% 90%, rgba(235, 35, 41, .14), transparent 70%),
		var(--rh-ink) !important;
}
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) h2.elementor-heading-title { color: #fff; }
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) .ri-card {
	border: 1px solid rgba(255, 255, 255, .08) !important;
	background: rgba(255, 255, 255, .04) !important; box-shadow: none !important;
}
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) .ri-card:hover {
	background: rgba(255, 255, 255, .07) !important; box-shadow: 0 24px 50px rgba(0, 0, 0, .4) !important;
}
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) .ri-card .elementor-widget-text-editor { color: rgba(255, 255, 255, .74); }
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) .ri-card .elementor-widget-text-editor p > strong:first-child { color: #fff; }

/* Coverage map
   ========================================================================== */

.ri-home .ri-feature { align-items: center; }
.ri-home .ri-feature h3.elementor-heading-title {
	font-size: clamp(40px, 3.4vw, 52px) !important; line-height: 1 !important; font-weight: 800 !important; color: var(--rh-red) !important;
	font-variant-numeric: tabular-nums;
}
.ri-home .ri-feature .elementor-widget-text-editor p { margin: 0 0 4px; }
.ri-home .ri-feature .elementor-widget-text-editor p strong { color: var(--rh-ink); }

/* The six main states become location chips */
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-feature) .elementor-widget-text-editor:not(details *) .ri-cols {
	display: flex; flex-wrap: wrap; gap: 10px; columns: auto; margin: 0;
}
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-feature) .elementor-widget-text-editor:not(details *) .ri-cols > li {
	margin: 0; padding: 9px 16px 9px 34px; border-radius: 999px;
	background: var(--rh-surface-2); border: 1px solid var(--rh-line); font-size: 15px; font-weight: 600; color: var(--rh-ink);
}
.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-feature) .elementor-widget-text-editor:not(details *) .ri-cols > li::before {
	left: 13px; top: 50%; width: 12px; height: 12px; border: 0; transform: translateY(-50%); background: var(--rh-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.3 7 13 7 13s7-7.7 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%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 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.3 7 13 7 13s7-7.7 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Motion
   ========================================================================== */

.ri-home .ri-hero .elementor-widget { animation: rh-fade-up .9s var(--rh-ease) both; }
.ri-home .ri-hero .elementor-widget:nth-child(2) { animation-delay: .15s; }
.ri-home .ri-hero .elementor-widget:nth-child(3) { animation-delay: .3s; }

/* Phone
   ========================================================================== */

@media (max-width: 767px) {
	.ri-home .ri-hero h1.elementor-heading-title { font-size: 34px !important; }
	.ri-home .ri-hero h1.elementor-heading-title::before { margin-bottom: 16px; font-size: 12px; }
	.ri-home .ri-hero h3.elementor-heading-title { font-size: 17px !important; padding-left: 14px; }
	.ri-home .ri-hero .elementor-widget-button { width: 100%; }
	.ri-home .ri-hero .elementor-button { flex: 1 1 100%; justify-content: center; }

	.ri-home [data-elementor-type="wp-page"] > .e-con.ri-dark:not(.ri-hero) {
		margin-top: -28px; clip-path: polygon(0 28px, 100% 0, 100% 100%, 0 100%); --padding-top: 84px; --padding-bottom: 64px;
	}
	.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-card):not(:has(.ri-card h3)) {
		margin-top: -28px; clip-path: polygon(0 28px, 100% 0, 100% 100%, 0 100%); --padding-top: 84px; --padding-bottom: 64px;
	}

	.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-feature) .elementor-widget-text-editor:not(details *) .ri-cols { gap: 6px; }
	.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-feature) .elementor-widget-text-editor:not(details *) .ri-cols > li { padding: 6px 11px 6px 26px; font-size: 13px; }
	.ri-home [data-elementor-type="wp-page"] > .e-con:has(.ri-feature) .elementor-widget-text-editor:not(details *) .ri-cols > li::before { left: 10px; width: 10px; height: 10px; }
}