/**
 * Contact Person — first draft.
 *
 * Structure: .ya-contact-person (viewport gutter) → Cover.__frame (bg image)
 * → __card (white). No image/card stacking hacks.
 */

.ya-contact-person {
	box-sizing: border-box;
	width: 100%;
	margin-block: var(--wp--custom--spacing--padding-block, clamp(3rem, 1.004rem + 4.163vi, 6rem));
	color: var(--wp--custom--color--text-primary);
	padding: 0;
}

.ya-contact-person__frame.wp-block-cover {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1440px);
	min-height: 0 !important;
	margin-inline: auto;
	padding: 0;
	overflow: hidden;
	border-radius: 0;
}

.ya-contact-person__frame .wp-block-cover__inner-container {
	box-sizing: border-box;
	width: 100%;
	padding: var(--wp--custom--spacing--padding-block, clamp(3rem, 1.004rem + 4.163vi, 6rem))
		var(--wp--custom--spacing--padding-inline, clamp(1rem, -1.486rem + 8.304vi, 2.5rem));
}

.ya-contact-person__card {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 44.25rem; /* 708px */
	margin-inline: auto;
	padding: var(--wp--custom--spacing--padding-block, clamp(3rem, 1.004rem + 4.163vi, 6rem))
		var(--wp--custom--spacing--padding-inline, clamp(1rem, -1.486rem + 8.304vi, 2.5rem));
	border-radius: 1rem;
	background-color: var(--wp--preset--color--gray-white, #fff);
}

.ya-contact-person__card.has-background {
	background-color: var(--wp--preset--color--gray-white, #fff);
}

.ya-contact-person__intro {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

/*
 * Fixed Small + beige label (Label SM). Not the ya-plugin/tag block.
 * Beige stand-in until tag/beige/background exists in DS.
 */
.ya-contact-person p.ya-contact-person__tag {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	height: 32px;
	margin-block: 0 var(--ya-spacing-24);
	padding-inline: var(--ya-spacing-12);
	border-radius: 4px;
	background-color: var(--wp--preset--color--gray-300, #e8e6de);
	color: var(--wp--custom--color--text-primary);
	white-space: nowrap;
}

.ya-contact-person__title {
	margin-block: 0 0.5rem;
	color: var(--wp--custom--color--text-primary);
}

.ya-contact-person__intro .ya-contact-person__body {
	margin-block: 0 !important;
	color: var(--wp--custom--color--text-primary);
}

.ya-contact-person__person {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--ya-spacing-16);
	width: 100%;
	padding: var(--ya-spacing-24);
	border: 1px solid var(--wp--custom--color--border-subtle, var(--wp--preset--color--gray-400));
	border-radius: 0.75rem;
	background-color: var(--wp--preset--color--gray-white, #fff);
	margin-top: var(--ya-spacing-32);
}

.ya-contact-person__portrait {
	flex-shrink: 0;
	margin: 0;
	line-height: 0;
}

.ya-contact-person__portrait img {
	display: block;
	width: 5rem;
	height: 5rem;
	border-radius: 50%;
	object-fit: cover;
	background-color: var(--wp--preset--color--gray-300, #e8e6de);
}

.ya-contact-person__details {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--ya-spacing-04);
	min-width: 0;
	width: 100%;
}

.ya-contact-person__name {
	margin-block: 0;
	color: var(--wp--custom--color--text-primary);
}

.ya-contact-person__role {
	margin-block: 0 !important;
	color: var(--wp--custom--color--text-primary);
}

.ya-contact-person__links {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--ya-spacing-08);
	width: 100%;
	margin-block-start: var(--ya-spacing-12);
}

.ya-contact-person__link {
	display: flex;
	align-items: center;
	gap: var(--ya-spacing-04);
	margin-block: 0;
	color: var(--wp--custom--color--link-primary);
}

.ya-contact-person__link > .wp-block-paragraph {
	margin-block: 0 !important;
}

.ya-contact-person__link a {
	color: inherit;
}

.ya-contact-person__icon {
	display: inline-flex;
	flex-shrink: 0;
	color: currentColor;
	line-height: 0;
}

.ya-contact-person__icon svg {
	display: block;
	width: 1.25rem;
	height: 1.25rem;
	fill: currentColor;
}

.ya-contact-person__icon svg path {
	fill: currentColor;
}

@media (min-width: 768px) {
	.ya-contact-person__frame.wp-block-cover {
		border-radius: var(--ya-spacing-16);
	}

	.ya-contact-person {
		padding-inline: var(--wp--custom--spacing--padding-inline, clamp(1rem, -1.486rem + 8.304vi, 2.5rem));
	}

	.ya-contact-person__details {
		width: auto;
		flex: 1 1 auto;
	}
}

/* Mobile L+ (≥480px). Smallest mobile (<480px) keeps base card padding. */
@media (min-width: 480px) {
	.ya-contact-person__card,
	.ya-contact-person__card.has-background {
		padding: var(--ya-spacing-40);
	}


	.ya-contact-person__person {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--ya-spacing-24);
		padding: var(--ya-spacing-32);
	}
}