/* ==========================================================================
   DoctorCura Design – Ärzteseite
   ========================================================================== */

/* Hero: twee portretten in een zwevende kaart */
.dcd-docs-visual__card {
	position: relative; display: grid; place-items: center; min-height: 440px; padding: 40px 24px 96px; border-radius: var(--dcd-radius-xl);
	background: radial-gradient(360px 260px at 50% 38%, #fff 0%, var(--dcd-blue-50) 62%, #dce8ff 100%);
	border: 6px solid #fff; box-shadow: var(--dcd-shadow-lg); overflow: hidden; transform: translateZ(0);
}
.dcd-docs-visual__card::before {
	content: ""; position: absolute; width: 380px; aspect-ratio: 1; border-radius: 50%; border: 2px dashed rgba(5, 96, 255, .2); top: 26px;
}
.dcd-docs-visual__portrait { position: absolute; display: block; border-radius: 50%; overflow: hidden; border: 7px solid #fff; box-shadow: 0 30px 50px -22px rgba(10, 26, 61, .5); background: #fff; }
.dcd-docs-visual__portrait img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; }
.dcd-docs-visual__portrait--1 { width: 250px; height: 250px; left: 12%; top: 40px; z-index: 2; }
.dcd-docs-visual__portrait--2 { width: 220px; height: 220px; right: 12%; top: 120px; z-index: 1; }
.dcd-docs-visual__caption {
	position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 2px;
	padding: 12px 22px; border-radius: 16px; background: rgba(255, 255, 255, .9); backdrop-filter: blur(12px); box-shadow: var(--dcd-shadow-sm); white-space: nowrap;
}
.dcd-docs-visual__caption strong { font: 700 15px/1.2 var(--dcd-font-head); color: var(--dcd-navy); }
.dcd-docs-visual__caption small { font-size: 12.5px; color: var(--dcd-muted); }
.dcd-docs-visual .dcd-float--a { top: 6%; left: -6%; }
.dcd-docs-visual .dcd-float--b { top: 52%; right: -8%; }
.dcd-docs-visual .dcd-float--c { bottom: 26%; left: -10%; }

/* Profiel */
.e-con.dcd-profile {
	display: grid !important; grid-template-columns: 400px minmax(0, 1fr); gap: 64px !important; align-items: start; padding: 0 !important;
}
.e-con.dcd-profile--reverse { grid-template-columns: minmax(0, 1fr) 400px; }
.e-con.dcd-profile--reverse > .dcd-profile__media { order: 2; }
.e-con.dcd-profile__media { position: sticky; top: 140px; gap: 18px !important; padding: 0 !important; }
.dcd-profile__photo img {
	width: 100% !important; aspect-ratio: 1 / 1.08; height: auto !important; object-fit: cover; border-radius: var(--dcd-radius-xl);
	border: 6px solid #fff; box-shadow: var(--dcd-shadow-lg); background: var(--dcd-blue-50);
	transition: transform .6s var(--dcd-ease);
}
.dcd-profile__photo:hover img { transform: translateY(-4px) rotate(-.6deg); }
.dcd-profile__field p { margin: -4px 0 6px !important; font: 600 18px/1.4 var(--dcd-font-head); color: var(--dcd-blue) !important; }
.e-con.dcd-profile__body { gap: 14px !important; }
.dcd-profile__body .dcd-prose h3:first-child { margin-top: .4em; }
.dcd-profile__body .dcd-prose { max-width: 720px; }

.dcd-docfacts { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dcd-docfacts li {
	display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: #fff; border: 1px solid var(--dcd-line);
	box-shadow: var(--dcd-shadow-sm); font: 600 14px/1.35 var(--dcd-font); color: var(--dcd-ink);
}
.dcd-docfacts li span { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 12px; color: var(--dcd-blue); background: linear-gradient(145deg, #fff, var(--dcd-blue-50)); box-shadow: 0 0 0 1px var(--dcd-blue-100) inset; }
.dcd-docfacts li .dcd-icon { width: 18px; height: 18px; }

@media (max-width: 1024px) {
	.e-con.dcd-profile, .e-con.dcd-profile--reverse { grid-template-columns: 1fr; gap: 32px !important; }
	.e-con.dcd-profile--reverse > .dcd-profile__media { order: 0; }
	.e-con.dcd-profile__media { position: relative; top: 0; max-width: 460px; }
}
@media (max-width: 767px) {
	.dcd-docs-visual__card { min-height: 340px; padding-bottom: 80px; }
	.dcd-docs-visual__portrait--1 { width: 170px; height: 170px; left: 8%; top: 30px; }
	.dcd-docs-visual__portrait--2 { width: 150px; height: 150px; right: 8%; top: 96px; }
	.dcd-docs-visual__card::before { width: 260px; }
	.dcd-docs-visual .dcd-float--a { left: -2%; }
	.dcd-docs-visual .dcd-float--b { right: 0; }
	.dcd-docs-visual .dcd-float--c { display: none; }
}
