/* Cam3D — En-tête de page (carte + visuel) */

.wcam-page-hero {
	padding-top: 16px;
	padding-bottom: 112px;
}

.wcam-page-hero__grid {
	display: flex;
	align-items: stretch;
	gap: 48px;
}

.wcam-page-hero__card {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(16px, 3.4svh, 26px);
	min-width: 0;
	padding: clamp(28px, 6svh, 48px) 48px;
	border-radius: var(--wcam-radius);
	background: var(--wcam-white);
}

.wcam-page-hero__title {
	font-family: var(--wcam-font-title);
	font-size: min(clamp(44px, 5.56vw, 80px), 9.6svh);
	font-weight: 500;
	line-height: 0.96;
	letter-spacing: -0.03em;
}

.wcam-page-hero__title--l {
	font-size: min(clamp(40px, 4.72vw, 68px), 8.6svh);
}

.wcam-page-hero__title--page {
	font-size: min(clamp(42px, 5.28vw, 76px), 9.6svh);
	line-height: 0.98;
}

.wcam-page-hero__intro {
	max-width: 560px;
	color: var(--wcam-muted);
	font-size: 17px;
	line-height: 1.55;
}

.wcam-page-hero__visual {
	width: 50%; /* 680 / 1360 */
	flex-shrink: 0;
	overflow: hidden;
	border-radius: var(--wcam-radius);
	background: var(--wcam-navy);
}

/* Le bloc tient dans l'écran visible : 16 px au-dessus et 16 px de marge visible en dessous. */
.wcam-page-hero__visual img {
	display: block;
	width: 100%;
	height: clamp(400px, calc(var(--wcam-screen) - 32px), 600px);
	object-fit: cover;
}

@media (max-width: 1023px) {
	.wcam-page-hero {
		padding-bottom: 72px;
	}

	.wcam-page-hero__grid {
		flex-direction: column;
		gap: 20px;
	}

	.wcam-page-hero__visual {
		width: 100%;
	}

	.wcam-page-hero__visual img {
		height: auto;
		aspect-ratio: 16 / 10;
	}
}

@media (max-width: 767px) {
	.wcam-page-hero {
		padding-top: 12px;
		padding-bottom: 64px;
	}

	.wcam-page-hero__card {
		padding: 28px 20px;
		gap: 20px;
	}

	.wcam-page-hero__visual img {
		aspect-ratio: 680 / 600;
	}
}
