/* ==========================================================================
   Το ιατρείο – templates/page-iatreio.php
   reference/Iatreio.html. Hero, cards, FAQ and the CTA band come from
   main.css; this file carries the page rhythm, the info strip and the
   location cards.
   ========================================================================== */

.be_iatreio-hero {
	padding-top: 32px;
	padding-bottom: 64px;
}

.be_iatreio-contactstrip {
	padding-top: 56px;
	padding-bottom: 0;
}

.be_iatreio-info {
	gap: 8px;
}

.be_iatreio-info-main {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.35;
}

.be_iatreio-info-alt {
	font-size: 18px;
	font-weight: 700;
	color: var(--be-muted);
}

.be_iatreio-locations,
.be_iatreio-checklist,
.be_iatreio-faq {
	padding-top: 96px;
	padding-bottom: 0;
}

/* The space down to the closing CTA band is the band's own padding-top now. */

/* --- location card ------------------------------------------------------- */
.be_loccard {
	gap: 0;
	padding: 0;
	overflow: hidden;
	border-radius: var(--be-r-card-lg);
}

.be_loccard-media .be_img,
.be_loccard-media .be_ph {
	border-radius: 0;
}

.be_loccard-body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 28px;
	flex: 1;
}

/* An h3, so the practice name reads as the heading it is — the styling was
   already explicit, only the default heading margin has to go. */
.be_loccard-name {
	margin: 0;
	font-family: var(--be-font-head);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
}

.be_loccard-address {
	font-style: normal;
	color: var(--be-muted);
}

.be_loccard-hours {
	font-size: var(--be-small);
	color: var(--be-muted);
}

.be_loccard-phone {
	font-weight: 700;
}

.be_loccard-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: auto;
	padding-top: 10px;
}

.be_loccard-actions .be_btn {
	min-height: 46px;
	padding: 0 18px;
	font-size: var(--be-small);
}

@media (max-width: 1040px) {
	.be_iatreio-locations,
	.be_iatreio-checklist,
	.be_iatreio-faq {
		padding-top: 72px;
	}
}

@media (max-width: 1040px) {
@media (max-width: 860px) {
	.be_iatreio-hero {
		padding-top: 24px;
		padding-bottom: 40px;
	}

	.be_iatreio-contactstrip {
		padding-top: 40px;
	}

	.be_iatreio-locations,
	.be_iatreio-checklist,
	.be_iatreio-faq {
		padding-top: 48px;
	}

	.be_loccard-body {
		padding: 22px;
	}
}

/* Stand-in for a practice we have no licensed photograph of. It fills the same
   4/3 slot as a photo so the four cards still line up, and says the clinic's
   name rather than pretending a picture is loading. */
.be_loccard-brand {
	aspect-ratio: 4 / 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 28px 24px;
	text-align: center;
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(97, 183, 229, 0.22) 0%, transparent 62%),
		linear-gradient(155deg, var(--be-panel) 0%, var(--be-navy) 72%);
	color: var(--be-on-dark);
}

.be_loccard-brand > svg {
	flex: none;
	color: var(--be-sky);
}

.be_loccard-brandname {
	font-family: var(--be-font-head);
	font-weight: 700;
	font-size: 21px;
	line-height: 1.25;
	letter-spacing: -0.01em;
	max-width: 15ch;
}

.be_loccard-brandcity {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--be-on-dark-mute);
}