/* Everest Custom Elements: feature-grid.css
   everest_feature_grid. Tokens only. Layouts: icon-left, icon-top, card. */

.ehf-features {
	box-sizing: border-box;
	padding-block: var(--ehf-pad-section);
	background: var(--ehf-c-surface);
	color: var(--ehf-c-body);
	font-family: var(--ehf-ff-body);
}

.ehf-features--bg-tint {
	background: var(--ehf-c-tint-50);
}

.ehf-features__inner {
	box-sizing: border-box;
	max-width: var(--ehf-container);
	margin-inline: auto;
	padding-inline: var(--ehf-gutter);
}

/* Intro */
.ehf-features__intro {
	display: flex;
	flex-direction: column;
	gap: var(--ehf-s-1);
	max-width: var(--ehf-container-narrow);
	margin-bottom: var(--ehf-s-5);
}

.ehf-features--align-center .ehf-features__intro {
	margin-inline: auto;
	text-align: center;
	align-items: center;
}

.ehf-features__eyebrow {
	margin: 0;
	font-size: var(--ehf-fs-eyebrow);
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ehf-c-primary);
}

.ehf-features__heading {
	margin: 0;
	font-family: var(--ehf-ff-head);
	font-size: var(--ehf-fs-h2);
	font-weight: 800;
	line-height: 1.15;
	color: var(--ehf-c-ink);
	text-wrap: balance;
}

.ehf-features__sub {
	margin: 0;
	max-width: var(--ehf-prose);
	font-size: var(--ehf-fs-lead);
	line-height: 1.55;
	color: var(--ehf-c-body);
}

/* Grid */
.ehf-features__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--ehf-s-4) var(--ehf-gap-grid);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ehf-features--cols-2 .ehf-features__grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ehf-features--cols-4 .ehf-features__grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ehf-features__item {
	position: relative;
	display: flex;
	gap: var(--ehf-s-2);
	margin: 0;
	min-width: 0;
}

/* Icon: 24px glyph in a 48px tint-100 circle */
.ehf-features__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	border-radius: var(--ehf-r-pill);
	background: var(--ehf-c-tint-100);
	color: var(--ehf-c-primary);
	font-size: 24px;
	line-height: 1;
}

.ehf-features__icon svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.ehf-features--bg-tint .ehf-features__icon {
	background: var(--ehf-c-surface);
}

.ehf-features__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.ehf-features__title {
	margin: 0;
	font-family: var(--ehf-ff-head);
	font-size: var(--ehf-fs-h4);
	font-weight: 700;
	line-height: 1.35;
	color: var(--ehf-c-ink);
}

.ehf-features__link,
.ehf-features__link:link,
.ehf-features__link:visited {
	color: inherit;
	text-decoration: none;
}

.ehf-features__link:hover {
	color: var(--ehf-c-primary);
	text-decoration: underline;
}

.ehf-features__text {
	margin: 0;
	font-size: var(--ehf-fs-body);
	line-height: 1.6;
	color: var(--ehf-c-body);
}

/* Linked items: whole item is clickable via a stretched link */
.ehf-features__item.has-link .ehf-features__link::after {
	content: "";
	position: absolute;
	inset: 0;
}

/* icon-top */
.ehf-features--icon-top .ehf-features__item {
	flex-direction: column;
	align-items: flex-start;
}

.ehf-features--icon-top.ehf-features--align-center .ehf-features__item {
	align-items: center;
	text-align: center;
}

/* card (sits on a tint background) */
.ehf-features--card .ehf-features__item {
	flex-direction: column;
	align-items: flex-start;
	box-sizing: border-box;
	padding: var(--ehf-s-3);
	background: var(--ehf-c-surface);
	border: var(--ehf-border);
	border-radius: var(--ehf-r-lg);
	box-shadow: var(--ehf-shadow-1);
	transition: box-shadow var(--ehf-dur) var(--ehf-ease), border-color var(--ehf-dur) var(--ehf-ease);
}

.ehf-features--card .ehf-features__item.has-link:hover {
	box-shadow: var(--ehf-shadow-2);
	border-color: var(--ehf-c-tint-200);
}

.ehf-features--card .ehf-features__icon {
	background: var(--ehf-c-tint-100);
}

/* Footnote under a hairline */
.ehf-features__footnote {
	margin: var(--ehf-s-5) auto 0;
	padding-top: var(--ehf-s-3);
	max-width: var(--ehf-container-narrow);
	border-top: 1px solid var(--ehf-c-tint-200);
	text-align: center;
	font-size: var(--ehf-fs-small);
	line-height: 1.5;
	color: var(--ehf-c-body);
}

/* Tablet: 3/4 columns become 2 */
@media (max-width: 1024px) {
	.ehf-features--cols-3 .ehf-features__grid,
	.ehf-features--cols-4 .ehf-features__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Mobile: 1 column; icon cards stay compact rows (icon left, 40px) */
@media (max-width: 767px) {
	.ehf-features__grid,
	.ehf-features--cols-2 .ehf-features__grid,
	.ehf-features--cols-3 .ehf-features__grid,
	.ehf-features--cols-4 .ehf-features__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--ehf-s-3);
	}

	.ehf-features__intro {
		margin-bottom: var(--ehf-s-4);
	}

	.ehf-features--icon-left .ehf-features__icon,
	.ehf-features--icon-top .ehf-features__icon {
		flex-basis: 40px;
		width: 40px;
		height: 40px;
		font-size: 20px;
	}

	.ehf-features--icon-left .ehf-features__icon svg,
	.ehf-features--icon-top .ehf-features__icon svg {
		width: 20px;
		height: 20px;
	}

	.ehf-features--icon-top .ehf-features__item,
	.ehf-features--icon-top.ehf-features--align-center .ehf-features__item {
		flex-direction: row;
		align-items: flex-start;
		text-align: left;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ehf-features--card .ehf-features__item {
		transition: none;
	}
}

/* 1.4.1 M11: included (icon-left) followed by schedule (card) is one pair on a shared tint: tight block rhythm
   and a 1px tint-200 hairline on the content edge. Total gap is 2 x pad-tight + 1px (<= 96px). */
.elementor-widget-everest_feature_grid:has(+ .elementor-widget-everest_feature_grid .ehf-features--card) .ehf-features {
	padding-bottom: var(--ehf-pad-tight, 40px);
}

.elementor-widget-everest_feature_grid + .elementor-widget-everest_feature_grid .ehf-features--card {
	padding-top: 0;
}

.elementor-widget-everest_feature_grid + .elementor-widget-everest_feature_grid .ehf-features--card .ehf-features__inner::before {
	content: "";
	display: block;
	height: 1px;
	margin-bottom: var(--ehf-pad-tight, 40px);
	background: var(--ehf-c-tint-200, #dcedf5);
}

/* 1.4.1 N13: schedule cards on phones: icon inline left of the text, padding 16 (about 110px per card) */
@media (max-width: 767px) {
	.ehf-features--card .ehf-features__item {
		flex-direction: row;
		align-items: flex-start;
		gap: 12px;
		padding: var(--ehf-s-2, 16px);
	}

	.ehf-features--card .ehf-features__icon {
		flex-basis: 40px;
		width: 40px;
		height: 40px;
		font-size: 20px;
	}

	.ehf-features--card .ehf-features__icon svg {
		width: 20px;
		height: 20px;
	}
}
