/* Component: hero-spec-card — the product spec card in the home hero (Main.dc.html). */

.mx-hero { background: var(--mx-sage); border-bottom: 1px solid var(--mx-line); }
.mx-hero__inner {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: 56px;
	padding-top: var(--mx-space-18); padding-bottom: 80px;
}
.mx-hero__copy { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; gap: var(--mx-space-6); }
.mx-hero__title {
	font-size: var(--mx-hero);
	line-height: 1.04;
	letter-spacing: -0.015em;
	color: var(--mx-forest);
}
.mx-hero__lead { margin: 0; font-size: 19px; line-height: var(--mx-leading); color: var(--mx-ink-soft); max-width: 34em; }
.mx-hero__actions { display: flex; flex-wrap: wrap; gap: var(--mx-space-3); }
.mx-hero__trust {
	display: flex; flex-wrap: wrap; gap: var(--mx-space-3) 28px;
	margin: 0; padding: var(--mx-space-3) 0 0; list-style: none;
	font-size: var(--mx-text-sm); color: var(--mx-ink-soft);
}
.mx-hero__trust li { display: inline-flex; align-items: center; gap: var(--mx-space-2); }
.mx-hero__trust .mx-icon { color: var(--mx-leaf); }

.mx-spec-card {
	flex: 1 1 440px; min-width: 0; max-width: 520px;
	background: var(--mx-white);
	border: 1px solid var(--mx-line);
	border-radius: 14px;
	box-shadow: var(--mx-shadow-card);
	overflow: hidden;
}
.mx-spec-card__head {
	display: flex; align-items: center; gap: var(--mx-space-5);
	padding: var(--mx-space-6) var(--mx-space-6) var(--mx-space-5);
	border-bottom: 1px solid var(--mx-line-soft);
}
.mx-spec-card__visual {
	flex: 0 0 auto;
	width: 112px; height: 128px;
	display: flex; align-items: center; justify-content: center;
	background: var(--mx-sage);
	border-radius: var(--mx-radius-md);
	overflow: hidden;
}
.mx-spec-card__id { display: flex; flex-direction: column; gap: var(--mx-space-1); min-width: 0; }
.mx-spec-card__name { font-family: var(--mx-font-display); font-size: var(--mx-h4); font-weight: 500; color: var(--mx-forest); text-decoration: none; line-height: 1.15; }
.mx-spec-card__name:hover { color: var(--mx-leaf-dark); text-decoration: underline; }
.mx-spec-card__latin { font-size: 17px; color: var(--mx-muted); }
.mx-spec-card__meta { font-size: var(--mx-text-xs); color: var(--mx-muted); }
.mx-spec-card .mx-tiers caption { padding: var(--mx-space-4) var(--mx-space-6) var(--mx-space-2); }
.mx-spec-card .mx-tiers th, .mx-spec-card .mx-tiers td { padding-inline: var(--mx-space-6); }
.mx-spec-card__docs { padding: var(--mx-space-4) var(--mx-space-6) var(--mx-space-6); border-top: 1px solid var(--mx-line-soft); }

@media (max-width: 720px) {
	.mx-hero__inner { gap: var(--mx-space-8); padding-top: var(--mx-space-10); padding-bottom: var(--mx-space-12); }
	.mx-hero__lead { font-size: var(--mx-text-base); }
}