.photo-carousel {
	margin: 22px auto 10px;
}

.photo-carousel__header {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 12px;
}

.photo-carousel__title {
	margin: 0;
	color: var(--sm-text);
	font-size: clamp(1.15rem, 2vw, 1.55rem);
	line-height: 1.2;
}

.photo-carousel__controls { display: flex; gap: 8px; }

.photo-carousel__button {
	display: inline-grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid var(--sm-border);
	border-radius: 50%;
	background: var(--sm-surface);
	color: var(--sm-text);
	font-size: 1.35rem;
	line-height: 1;
	cursor: pointer;
}

.photo-carousel__button:hover { border-color: var(--sm-accent); color: var(--sm-accent); }
.photo-carousel__button:disabled { opacity: .35; cursor: default; }

.photo-carousel__track {
	display: flex;
	gap: 18px;
	margin: 0;
	padding: 0 0 10px;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline mandatory;
	scrollbar-width: thin;
	scrollbar-color: var(--sm-accent) transparent;
}

.photo-carousel__item {
	position: relative;
	flex: 0 0 min(78vw, 760px);
	aspect-ratio: 16 / 8;
	overflow: hidden;
	border: 1px solid var(--sm-border);
	border-radius: var(--sm-radius);
	background: var(--sm-surface-2);
	box-shadow: var(--sm-shadow);
	scroll-snap-align: start;
}

.photo-carousel__link { display: block; width: 100%; height: 100%; color: #fff !important; }
.photo-carousel__image { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.photo-carousel__link:hover .photo-carousel__image { transform: scale(1.025); }

.photo-carousel__caption {
	position: absolute;
	inset: auto 0 0;
	padding: clamp(42px, 9vw, 90px) clamp(18px, 4vw, 36px) clamp(18px, 4vw, 32px);
	background: linear-gradient(transparent, rgba(0, 0, 0, .82));
	pointer-events: none;
}

.photo-carousel__caption strong {
	display: block;
	max-width: 720px;
	font-size: clamp(1.05rem, 2.5vw, 1.8rem);
	line-height: 1.25;
	text-wrap: balance;
}