/**
 * Hermosillo Valores: encabezado centrado + columnas con icono (Figma About: "This is who we are").
 */
.hermosillo-features-widget {
	background: var(--hmo-white);
	box-sizing: border-box;
	color: var(--hmo-black);
	font-family: 'Flama Condensed', 'FlamaCond', 'Roboto Condensed', sans-serif;
	padding: 120px 24px;
	width: 100%;
}

.hermosillo-features-widget * { box-sizing: border-box; }

.hermosillo-features-widget .hfeat-inner { margin: 0 auto; max-width: 1200px; width: 100%; }

.hermosillo-features-widget .hfeat-header { margin: 0 auto 64px; max-width: 792px; text-align: center; }

.hermosillo-features-widget .hfeat-badge {
	align-items: center;
	background: var(--hmo-orange);
	display: inline-flex;
	height: 38px;
	justify-content: center;
	margin-bottom: 20px;
	width: 38px;
}

.hermosillo-features-widget .hfeat-badge svg { display: block; height: 18px; width: 22px; }

.hermosillo-features-widget .hfeat-eyebrow {
	color: var(--hmo-blue-steel);
	font-size: 20px;
	font-weight: 600;
	letter-spacing: .06em;
	line-height: 22px;
	margin: 0 0 8px;
	text-transform: uppercase;
}

.hermosillo-features-widget .hfeat-title {
	color: var(--hmo-blue);
	font-family: 'Flama Condensed', 'FlamaCond', 'Roboto Condensed', sans-serif;
	font-size: clamp(34px, 4vw, 48px);
	font-weight: 600 !important;
	line-height: 44px;
	margin: 0 !important;
	text-transform: uppercase;
}

.hermosillo-features-widget .hfeat-line {
	background: var(--hmo-orange);
	display: block;
	height: 2px;
	margin: 16px auto 0;
	width: 54px;
}

.hermosillo-features-widget .hfeat-desc {
	color: var(--hmo-gray);
	font-family: 'Enriqueta', Georgia, serif;
	font-size: 18px;
	line-height: 28px;
	margin: 24px 0 0;
}

.hermosillo-features-widget .hfeat-grid { display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr)); }

.hermosillo-features-widget .hfeat-item { text-align: left; }

.hermosillo-features-widget .hfeat-icon {
	align-items: center;
	background: var(--hmo-porcelain);
	border-radius: 50%;
	color: var(--hmo-blue);
	display: inline-flex;
	font-size: 20px;
	height: 56px;
	justify-content: center;
	margin-bottom: 24px;
	width: 56px;
}

.hermosillo-features-widget .hfeat-icon svg { fill: currentColor; height: 22px; width: 22px; }

.hermosillo-features-widget .hfeat-item-title {
	color: var(--hmo-blue);
	font-family: 'Flama', 'Flama Condensed', sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
	margin: 0 0 12px;
}

.hermosillo-features-widget .hfeat-item-text {
	color: var(--hmo-gray);
	font-family: 'Enriqueta', Georgia, serif;
	font-size: 18px;
	line-height: 28px;
	margin: 0;
}

/* ===== Figma High-Fi Mobile (<= 768 px) ===== */
@media (max-width: 768px) {
	.hermosillo-features-widget { padding: 80px 16px 0; }
	.hermosillo-features-widget .hfeat-header { margin-bottom: 40px; }
	.hermosillo-features-widget .hfeat-eyebrow { font-size: 18px; }
	.hermosillo-features-widget .hfeat-title { font-size: 32px; line-height: 36px; }
	.hermosillo-features-widget .hfeat-grid { gap: 40px; }
	.hermosillo-features-widget .hfeat-item { text-align: center; }
	.hermosillo-features-widget .hfeat-item-title { font-size: 18px; line-height: 24px; }
	.hermosillo-features-widget .hfeat-item-text { font-size: 16px; line-height: 24px; }
}

/* Frase destacada sobre el encabezado (Figma Story and Leadership) */
.hermosillo-features-widget .hfeat-statement {
	color: var(--hmo-blue);
	font-family: 'Flama Condensed', 'FlamaCond', 'Roboto Condensed', sans-serif;
	font-size: clamp(28px, 3vw, 36px);
	font-weight: 600 !important;
	line-height: 40px;
	margin: 0 auto 72px !important;
	max-width: 792px;
	text-align: center;
	text-transform: uppercase;
}
.hermosillo-features-widget .hfeat-statement span { color: var(--hmo-orange); }

/* Variante "values": iconos grandes centrados con etiqueta corta */
.hermosillo-features-widget.is-values .hfeat-grid { gap: 48px 24px; margin: 0 auto; max-width: 960px; }
.hermosillo-features-widget.is-values .hfeat-item { text-align: center; }
.hermosillo-features-widget.is-values .hfeat-icon { color: var(--hmo-white); font-size: 28px; height: 80px; margin-bottom: 16px; width: 80px; }
.hermosillo-features-widget.is-values .hfeat-icon svg { height: 30px; width: 30px; }
.hermosillo-features-widget.is-values .hfeat-item-title { font-size: 16px; line-height: 22px; margin: 0; }
.hermosillo-features-widget.is-values .hfeat-header { margin-bottom: 48px; }
@media (max-width: 768px) {
	.hermosillo-features-widget .hfeat-statement { font-size: 28px; line-height: 32px; margin-bottom: 56px !important; }
	.hermosillo-features-widget.is-values .hfeat-grid { gap: 32px 16px; }
	.hermosillo-features-widget.is-values .hfeat-icon { height: 72px; width: 72px; }
}
.hermosillo-features-widget .hfeat-statement strong { color: var(--hmo-orange); font-weight: inherit; }
.hermosillo-features-widget .hfeat-statement:last-child { margin-bottom: 0 !important; }

/* Variante "rows": icono + titulo a la izquierda, texto a la derecha (Figma Safety Culture) */
.hermosillo-features-widget.is-rows .hfeat-grid { display: block; margin: 0 auto; max-width: 1200px; }
.hermosillo-features-widget.is-rows .hfeat-header { margin-bottom: 40px; max-width: 700px; }
.hermosillo-features-widget.is-rows .hfeat-desc { font-size: 16px; line-height: 24px; }
.hermosillo-features-widget.is-rows .hfeat-item { align-items: center; column-gap: 24px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); padding: 20px 0; }
.hermosillo-features-widget.is-rows .hfeat-icon { grid-column: 3; grid-row: 1; margin: 0; }
.hermosillo-features-widget.is-rows .hfeat-item-title { font-family: 'Flama Condensed', 'FlamaCond', sans-serif; font-size: 20px; grid-column: 4 / span 3; grid-row: 1; margin: 0; text-transform: uppercase; }
.hermosillo-features-widget.is-rows .hfeat-item-text { font-size: 16px; grid-column: 7 / span 5; grid-row: 1; line-height: 24px; }
@media (max-width: 1024px) {
	.hermosillo-features-widget.is-rows .hfeat-item { display: block; padding: 24px 0; text-align: center; }
	.hermosillo-features-widget.is-rows .hfeat-icon { margin: 0 auto 16px; }
	.hermosillo-features-widget.is-rows .hfeat-item-title { margin-bottom: 12px; }
}