/*
 * "Bedrijfsgegevens" card on Contact (new, BW 3:15d). [D: anchor = the steps card (contact-map.css): gray-50, radius 16,
 * p 24, H3 16/24 bold mb 16, 14/20 text; labels gray-500 (the map card's secondary tone), values gray-700 (the steps'
 * text); links gray-700 with an orange underline: the site's orange text is 2.8:1 on gray-50, too low for new UI.] Label column 9rem, value wraps; one column below 360 where 9rem + the
 * 12-digit vestigingsnummer no longer fit side by side.
 */
.contact-company { padding: calc(var(--spacing) * 6); border-radius: var(--radius-2xl); background-color: var(--color-gray-50); }
.contact-company__title { margin-bottom: calc(var(--spacing) * 4); font-weight: var(--font-weight-bold); color: var(--color-brand-dark); }
.contact-company__list { display: flex; flex-direction: column; gap: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--text-sm-lh); }
.contact-company__row { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: calc(var(--spacing) * 3); }
@media (max-width: 22.49rem) { .contact-company__row { grid-template-columns: minmax(0, 1fr); gap: 0; } }
.contact-company__row dt { color: var(--color-gray-500); }
.contact-company__row dd { color: var(--color-gray-700); overflow-wrap: anywhere; }
.contact-company__row a {
	color: var(--color-gray-700);
	text-decoration: underline;
	text-decoration-color: var(--color-brand-orange);
	text-underline-offset: 2px;
	transition: color var(--duration-fast) var(--ease-default);
}
.contact-company__row a:hover { color: var(--color-brand-dark); }