/* =========================================================
   Секція: «Ihre Ärztin» — картка лікарки напрямку
   Макети «Fachrichtung *»
   ========================================================= */

.phm-doccard {
	padding-block: 120px;
}

.phm-doccard--beige { background: var(--phm-beige); }
.phm-doccard--white { background: var(--phm-white); }

.phm-doccard__card {
	background: var(--phm-mint);
	border-radius: var(--phm-radius);
	overflow: hidden;
	display: grid;
	grid-template-columns: 1fr 2fr;
}

.phm-doccard--media-right .phm-doccard__card {
	grid-template-columns: 2fr 1fr;
}

/* Портрет праворуч — міняємо колонки місцями, а не порядок у розмітці:
   для читача з екрана спершу має йти ім'я, а не фото. */
.phm-doccard--media-right .phm-doccard__media { grid-column: 2; grid-row: 1; }
.phm-doccard--media-right .phm-doccard__body  { grid-column: 1; grid-row: 1; }

.phm-doccard--no-photo .phm-doccard__card {
	grid-template-columns: minmax(0, 1fr);
}

/* ---- Портрет ----
   Мінімальна висота з макета. Фото тягнеться на всю колонку, тож
   пропорції портрета не диктують висоту картки. */
.phm-doccard__media {
	position: relative;
	min-height: 440px;
	background: var(--phm-shell);
}

/* Селектор із двох класів навмисно: Elementor скидає `.elementor img
   { height: auto }` вагою (0,1,1), і однокласове правило програвало —
   портрет лишався у власних пропорціях, а під ним зяяла порожнеча. */
.phm-doccard__media .phm-doccard__photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--phm-doccard-focus, center top);
}

/* ---- Текст ---- */

.phm-doccard__body {
	padding: 72px 80px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

.phm-doccard__name {
	font-size: 36px;
	line-height: 1.3;
	margin: 16px 0 0;
}

.phm-eyebrow + .phm-doccard__name {
	margin-top: 16px;
}

.phm-doccard__name:first-child {
	margin-top: 0;
}

.phm-doccard__specialty {
	margin: 10px 0 0;
	font-weight: 500;
	text-transform: uppercase;
	font-size: var(--phm-eyebrow-size);
	letter-spacing: var(--phm-eyebrow-ls);
	line-height: 1.5;
	color: var(--phm-text);
}

.phm-doccard__points {
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.phm-doccard__point {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--phm-text);
}

.phm-doccard__check {
	flex-shrink: 0;
	color: var(--phm-primary-dark);
	/* Галочка на оптичній осі першого рядка тексту. */
	margin-top: 4px;
}

.phm-doccard__action {
	margin-top: 40px;
}

/* ---- Адаптив ---- */

@media (max-width: 1024px) {
	.phm-doccard {
		padding-block: 80px;
	}

	.phm-doccard__body {
		padding: 48px;
	}

	.phm-doccard__name {
		font-size: 30px;
	}

	.phm-doccard__media {
		min-height: 380px;
	}
}

@media (max-width: 767px) {
	.phm-doccard {
		padding-block: 56px;
	}

	/* Одна колонка: портрет зверху, з якого б боку він не стояв
	   на десктопі. */
	.phm-doccard__card,
	.phm-doccard--media-right .phm-doccard__card {
		grid-template-columns: minmax(0, 1fr);
	}

	.phm-doccard--media-right .phm-doccard__media,
	.phm-doccard--media-right .phm-doccard__body {
		grid-column: 1;
		grid-row: auto;
	}

	.phm-doccard__media {
		min-height: 0;
		/* Портрет у горизонтальному форматі — вертикальний з'їдав би
		   пів екрана до першого рядка тексту. */
		aspect-ratio: 3 / 2;
	}

	.phm-doccard__media .phm-doccard__photo {
		position: static;
	}

	.phm-doccard__body {
		padding: 32px 28px 36px;
	}

	.phm-doccard__name {
		font-size: 26px;
	}
}