/* ==========================================================================
   PHOTO PROFILE
   Plates from the master profile document. Each source image is itself a
   collage, so they are shown large and left uncropped — cropping a collage
   cuts people out of it.
   ========================================================================== */

.ev-head {
	padding: clamp(48px, 7vw, 84px) 0 clamp(28px, 4vw, 44px);
	background: var(--bg-alt, #F4F7FB);
	border-bottom: 1px solid var(--line, rgba(15, 23, 42, .1));
}

[data-theme="dark"] .ev-head { background: rgba(255, 255, 255, .03); }

.ev-eyebrow {
	margin: 0 0 12px;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.ev-title {
	margin: 0 0 14px;
	font-family: var(--font-display);
	font-size: clamp(1.8rem, 4vw, 2.8rem);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -.02em;
	color: var(--ink, #0b1f3a);
}

.ev-lead {
	margin: 0;
	max-width: 66ch;
	font-size: 1rem;
	line-height: 1.7;
	color: var(--muted, #64748b);
}

.ev-body { padding: clamp(40px, 6vw, 72px) 0 clamp(56px, 8vw, 96px); }

.ev-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}

.ev-card { margin: 0; }

.ev-card__link {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--bg-alt, #f1f5f9);
	border: 1px solid var(--line, rgba(15, 23, 42, .1));
	border-radius: var(--radius-md, 14px);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.ev-card__link:hover,
.ev-card__link:focus-visible {
	border-color: var(--color-primary);
	box-shadow: var(--shadow-md, 0 12px 30px rgba(15, 23, 42, .1));
	transform: translateY(-2px);
}

.ev-card__link img {
	display: block;
	width: 100%;
	height: auto;
}

.ev-card__zoom {
	position: absolute;
	right: 12px;
	bottom: 12px;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	color: #fff;
	background: rgba(10, 22, 40, .62);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border-radius: 50%;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .18s ease, transform .18s ease;
}

.ev-card__link:hover .ev-card__zoom,
.ev-card__link:focus-visible .ev-card__zoom { opacity: 1; transform: none; }

.ev-card__cap {
	margin-top: 10px;
	font-size: .85rem;
	line-height: 1.5;
	color: var(--muted, #64748b);
}

.ev-prose { max-width: 72ch; margin: 46px auto 0; }

/* ---------------- lightbox ---------------- */

.ev-lb {
	position: fixed;
	inset: 0;
	z-index: 1300;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px;
	padding: 24px;
	background: rgba(6, 16, 32, .93);
	opacity: 0;
	transition: opacity .2s ease;
}

.ev-lb[hidden] { display: none; }
.ev-lb.is-open { opacity: 1; }

.ev-lb__stage { margin: 0; text-align: center; max-height: 100%; }

.ev-lb__stage img {
	max-width: 100%;
	max-height: calc(100vh - 130px);
	width: auto;
	height: auto;
	border-radius: 8px;
	background: #fff;
}

.ev-lb__stage figcaption {
	margin-top: 14px;
	font-size: .9rem;
	color: rgba(255, 255, 255, .82);
}

.ev-lb__close,
.ev-lb__nav {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	color: #fff;
	background: rgba(255, 255, 255, .1);
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 50%;
	cursor: pointer;
	transition: background-color .16s ease;
}

.ev-lb__close:hover,
.ev-lb__nav:hover { background: rgba(255, 255, 255, .24); }

.ev-lb__close {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 2;
}

/* ---------------- responsive ---------------- */

@media (max-width: 1000px) { .ev-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 620px) {
	.ev-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	.ev-card__zoom { opacity: 1; transform: none; }

	.ev-lb { padding: 14px; grid-template-columns: minmax(0, 1fr); }
	.ev-lb__nav { position: absolute; bottom: 18px; }
	.ev-lb__nav--prev { left: 18px; }
	.ev-lb__nav--next { right: 18px; }
	.ev-lb__stage img { max-height: calc(100vh - 170px); }
}

@media (prefers-reduced-motion: reduce) {
	.ev-card__link, .ev-card__zoom, .ev-lb { transition: none; }
	.ev-card__link:hover { transform: none; }
}
