.tc-doctors {
	background: var(--wp--preset--color--surface-warm);
}

.tc-doctors-grid {
	display: grid;
	gap: var(--wp--preset--spacing--6xl);
	align-items: center;
}

.tc-doctors-media {
	width: min(100%, var(--wp--custom--layout--doctor-media));
	aspect-ratio: var(--wp--custom--aspect--doctor);
	overflow: hidden;
}

.tc-doctors-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tc-doctors-copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--2xl);
}

.tc-doctor-label {
	color: var(--wp--preset--color--primary-content);
	font-size: var(--wp--preset--font-size--body);
	font-weight: var(--wp--custom--font-weight--semibold);
}

.tc-doctors h2 {
	font-size: var(--wp--preset--font-size--doctor-heading);
	line-height: var(--wp--custom--line-height--base);
}

.tc-doctor-body {
	display: grid;
	gap: var(--wp--preset--spacing--xs);
	color: var(--wp--preset--color--text-soft);
	font-size: var(--wp--preset--font-size--body);
	line-height: var(--wp--custom--line-height--doctor-body);
	letter-spacing: var(--wp--custom--letter-spacing--doctor);
}

/* TODO: Figma에 없음 — 임의값: 1024px부터 의료진 이미지와 본문을 두 열로 배치한다. */
@media (min-width: 1024px) {
	.tc-doctors-grid {
		grid-template-columns: minmax(0, var(--wp--custom--layout--doctor-media)) minmax(0, 1fr);
	}
}
