/* ==========================================================================
   Home components: hero, features, values, testimonials.
   Loaded only when the page contains rm-hero-home / rm-features / rm-values / rm-testimonials.
   ========================================================================== */

/* Hero: building photo inside a rounded card, copy bottom-left on a dark gradient. */
.rm-hero-home {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	margin: clamp(12px, 2vw, 24px) clamp(12px, 2vw, 24px) 0;
	border-radius: var(--rm-r-hero);
	min-height: min(88svh, 860px);
	display: flex;
	align-items: flex-end;
	background: var(--rm-graphite);
}
.rm-hero-home__media { position: absolute; inset: 0; z-index: -2; margin: 0 !important; }
.rm-hero-home__media .wp-block-image, .rm-hero-home__media figure { height: 100%; margin: 0; }
.rm-hero-home__media img { width: 100%; height: 100% !important; object-fit: cover; object-position: 55% 45%; }
.rm-hero-home::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(90deg, rgb(14 14 14 / .82) 0%, rgb(14 14 14 / .55) 42%, rgb(14 14 14 / .05) 75%),
		linear-gradient(0deg, rgb(14 14 14 / .55), transparent 45%);
}
.rm-hero-home__content {
	width: 100%;
	max-width: calc(var(--rm-wide) + 2 * var(--rm-gutter));
	margin: 0 auto !important;
	padding: clamp(7rem, 16vw, 12rem) var(--rm-gutter) clamp(2.5rem, 6vw, 5rem);
	display: grid;
	gap: 1.5rem;
	justify-items: start;
}
.rm-hero-home__content > * { margin: 0 !important; }
.rm-hero-home h1 {
	color: #fff;
	max-width: 13ch;
	font-size: clamp(2.9rem, 7vw, 6.4rem);
	line-height: .95;
	letter-spacing: -.05em;
}
.rm-hero-home__lead {
	color: rgb(255 255 255 / .86);
	font-size: clamp(1.1rem, 1.6vw, 1.35rem);
	line-height: 1.5;
	max-width: 36ch;
	padding-left: 1.1rem;
	border-left: 2px solid var(--rm-orange);
}
.rm-hero-home .wp-block-buttons { margin-top: .75rem !important; }

/* Intro + features ------------------------------------------------------ */
.rm-features__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	border-top: 1px solid var(--rm-line);
}
.rm-feature {
	padding: clamp(1.75rem, 3vw, 2.5rem) clamp(1.25rem, 2.5vw, 2.25rem) clamp(1.75rem, 3vw, 2.5rem) 0;
	display: grid;
	gap: .75rem;
	align-content: start;
}
.rm-feature + .rm-feature { padding-left: clamp(1.25rem, 2.5vw, 2.25rem); border-left: 1px solid var(--rm-line); }
.rm-feature > * { margin: 0 !important; }
.rm-feature__icon img, .rm-value__icon img {
	/* sources are 600x150 with the icon centred: a square cover crop is exactly the icon */
	width: 44px;
	height: 44px !important;
	object-fit: cover;
}
.rm-feature__icon, .rm-value__icon {
	width: 64px;
	height: 64px;
	border-radius: 18px;
	background: #fff3e4;
	display: grid !important;
	place-items: center;
	overflow: hidden;
	margin-bottom: .75rem !important;
}
.rm-feature h4 { font-size: 1.45rem; }
.rm-feature p { color: var(--rm-muted); }
.rm-features > .wp-block-buttons { margin-top: clamp(1.5rem, 3vw, 2.5rem); }

/* Values (dark) --------------------------------------------------------- */
.rm-values > h2 { color: #fff; }
.rm-values__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.rm-value {
	padding: clamp(1.75rem, 3.5vw, 3rem);
	border-radius: var(--rm-r-card);
	background: rgb(255 255 255 / .04);
	box-shadow: inset 0 0 0 1px rgb(255 255 255 / .1);
	display: grid;
	gap: .9rem;
	align-content: start;
	backdrop-filter: blur(4px);
}
.rm-value > * { margin: 0 !important; }
.rm-value__icon { background: rgb(231 152 62 / .14); }
.rm-value h4 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.rm-value p { font-size: 1.125rem; line-height: 1.65; color: rgb(255 255 255 / .74); max-width: 44ch; }

/* Testimonials ---------------------------------------------------------- */

.rm-testimonials__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); }
.rm-testimonial {
	margin: 0;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	background: #fff;
	border-radius: var(--rm-r-card);
	box-shadow: 0 0 0 1px var(--rm-line);
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	transition: box-shadow .3s var(--rm-ease), transform .3s var(--rm-ease);
}
.rm-testimonial:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px var(--rm-line), var(--wp--custom--shadow--raised); }
.rm-testimonial > * { margin: 0 !important; }
.rm-testimonial::before {
	/* five-star rating as shown on the old site (decorative, aria-hidden by nature) */
	content: "";
	height: 18px;
	width: 106px;
	background: var(--rm-orange);
	-webkit-mask: var(--rm-star) 0 0 / 18px 18px space;
	mask: var(--rm-star) 0 0 / 18px 18px space;
}
.rm-testimonial__quote { color: var(--rm-ink); font-size: 1.0625rem; line-height: 1.65; flex: 1; }
.rm-testimonial__name { padding-top: 1.1rem; border-top: 1px solid var(--rm-line); font-weight: 600; color: var(--rm-ink); font-size: .9375rem; }

@media (max-width: 1024px) {
	.rm-features__grid, .rm-testimonials__grid { grid-template-columns: 1fr; }
	.rm-feature, .rm-feature + .rm-feature { padding: 1.5rem 0; border-left: 0; border-bottom: 1px solid var(--rm-line); display: grid; grid-template-columns: 64px 1fr; column-gap: 1.25rem; }
	.rm-feature__icon { grid-row: span 2; margin: 0 !important; }
	.rm-testimonials__grid { grid-auto-flow: column; grid-auto-columns: minmax(280px, 82%); grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; margin-inline: calc(-1 * var(--rm-gutter)); padding-inline: var(--rm-gutter); scroll-padding-inline: var(--rm-gutter); }
	.rm-testimonial { scroll-snap-align: start; }
}
@media (max-width: 1024px) {
	.rm-hero-home { min-height: min(80svh, 760px); }
	.rm-hero-home__media img { object-position: 50% 72%; }
}
@media (max-width: 781px) {
	.rm-values__grid { grid-template-columns: 1fr; }
	.rm-hero-home { min-height: min(78svh, 680px); border-radius: 22px; }
	.rm-hero-home::after { background: linear-gradient(0deg, rgb(14 14 14 / .88) 0%, rgb(14 14 14 / .55) 55%, rgb(14 14 14 / .2) 100%); }
	.rm-hero-home__media img { object-position: 42% 78%; }
}
