/* ==========================================================================
   Ο Ιατρός – templates/page-iatros.php
   Figma 197:1279 (hero/CV), 215:1542 (tabs). Columns on 1720:
   portrait 551 · 50 · CV 869 · 50 · photos 200.
   ========================================================================== */

.be_doctor {
	display: flex;
	flex-direction: column;
	gap: calc(50 * var(--u));
	padding-top: calc(50 * var(--u));
	padding-bottom: calc(50 * var(--u));
}

.be_doctor-name {
	display: flex;
	flex-direction: column;
	gap: calc(12 * var(--u));
}

.be_doctor-title {
	font: 300 max(40px, calc(50 * var(--u)))/1.2 var(--be-font-display);
}

.be_doctor-title-small {
	font-size: max(32px, calc(40 * var(--u)));
}

.be_doctor-subtitle {
	font: 300 max(26px, calc(32 * var(--u)))/1.2 var(--be-font-display);
}

.be_doctor-layout {
	display: grid;
	grid-template-columns: minmax(0, 551fr) minmax(0, 869fr) minmax(0, 200fr);
	gap: calc(50 * var(--u));
	align-items: start;
}

.be_doctor-portrait {
	position: sticky;
	top: calc(var(--be-header-h, calc(111 * var(--u))) + calc(30 * var(--u)));
	aspect-ratio: 551 / 617;
	background: var(--be-navy);
}

.be_doctor-portrait img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: bottom;
}

.be_doctor-cv {
	display: flex;
	flex-direction: column;
	gap: calc(25 * var(--u));
}

.be_doctor-section {
	display: flex;
	flex-direction: column;
	gap: calc(25 * var(--u));
}

.be_doctor-research {
	gap: calc(25 * var(--u));
}

.be_doctor-side {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: calc(415 * var(--u));
}

.be_doctor-side-photo {
	background: var(--be-panel);
}

.be_doctor-side-photo--1 {
	aspect-ratio: 200 / 245;
}

.be_doctor-side-photo--2 {
	aspect-ratio: 1;
}

.be_doctor-side-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Publications tabs (215:1542). */
.be_doctor-tabs {
	display: flex;
	flex-direction: column;
	gap: calc(25 * var(--u));
	padding-top: calc(50 * var(--u));
	padding-bottom: calc(50 * var(--u));
}

.be_tabs-list {
	display: flex;
	flex-wrap: wrap;
	gap: calc(16 * var(--u)) calc(50 * var(--u));
	padding-bottom: calc(12 * var(--u));
	border-bottom: 1px solid var(--be-white);
}

.be_tab {
	display: flex;
	align-items: center;
	gap: calc(12 * var(--u));
	padding: 0;
	border: 0;
	background: none;
	color: var(--be-white);
	font: var(--be-h3);
	text-transform: uppercase;
	text-align: left;
	cursor: pointer;
}

.be_tab::after {
	content: "";
	flex: none;
	width: calc(21 * var(--u));
	height: calc(21 * var(--u));
	background: url("../../img/icon-tab.svg") center / contain no-repeat;
}

.be_tab[aria-selected="true"] {
	color: var(--be-gold);
}

.be_tab[aria-selected="true"]::after {
	background-image: url("../../img/icon-tab-active.svg");
}

.be_tab:hover {
	color: var(--be-gold);
}

.be_publications {
	display: grid;
	gap: calc(25 * var(--u));
	list-style: none;
	font: var(--be-h4);
	font-size: max(18px, calc(22 * var(--u)));
	line-height: max(26px, calc(32 * var(--u)));
}

@media (max-width: 1280px) {
	.be_doctor-layout {
		grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
	}

	.be_doctor-side {
		grid-column: 1 / -1;
		flex-direction: row;
		gap: 24px;
	}

	.be_doctor-side-photo {
		width: 200px;
	}
}

@media (max-width: 860px) {
	.be_doctor-layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.be_doctor-portrait {
		position: static;
	}
}

@media (max-width: 700px) {
	.be_doctor {
		gap: 32px;
		padding-top: 24px;
	}

	.be_doctor-title {
		font-size: 40px;
	}

	.be_doctor-title-small {
		font-size: 30px;
	}

	.be_doctor-subtitle {
		font-size: 22px;
	}

	.be_doctor-side-photo {
		width: calc(50% - 12px);
	}

	.be_tabs-list {
		flex-direction: column;
		gap: 14px;
	}

	.be_tab {
		font-size: 18px;
		line-height: 24px;
	}

	.be_publications {
		font-size: 16px;
		line-height: 24px;
		gap: 16px;
	}
}