/* Rijschool Oude Maas – Contact v2: Ossy-fotokaart + WhatsApp/bel */

.rom-c2 {
	position: relative;
	overflow: hidden;
	background: var(--rom-c2-bg, #fff);
	padding: clamp(80px, 10vw, 140px) clamp(24px, 5vw, 72px);
}

.rom-c2__inner {
	max-width: 1400px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: clamp(40px, 6vw, 96px);
	align-items: center;
}

.rom-c2--photo-right .rom-c2__card { order: 2; }

/* Fotokaart */
.rom-c2__card { position: relative; justify-self: center; width: 100%; max-width: 460px; }

.rom-c2__photo {
	position: relative;
	aspect-ratio: 4/5;
	border-radius: 32px;
	overflow: hidden;
	background: var(--rom-c2-card-bg, #0f1b2d);
	box-shadow: 0 40px 80px -40px rgba(15, 27, 45, .5);
}

.rom-c2__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.rom-c2__photo-ov { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 60, 100, 0) 45%, var(--rom-c2-card-ov, rgba(0, 45, 80, .9)) 100%); }
.rom-c2__caption { position: absolute; left: 24px; right: 24px; bottom: 24px; color: var(--rom-c2-name, #fff); }
.rom-c2__name { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 28px; letter-spacing: -.02em; line-height: 1; }
.rom-c2__role { font-size: 14px; opacity: .85; margin-top: 4px; }

.rom-c2__badge1 {
	position: absolute;
	top: 22px;
	left: -18px;
	background: var(--rom-c2-b1-bg, #fff);
	color: var(--rom-c2-b1-text, #0f1b2d);
	border-radius: 16px;
	padding: 12px 16px;
	box-shadow: 0 16px 40px -16px rgba(15, 27, 45, .35);
	display: flex;
	align-items: center;
	gap: 10px;
	transform: rotate(-4deg);
	font-family: 'Outfit', sans-serif;
	font-size: 14px;
}

.rom-c2__stars { color: var(--rom-c2-b1-stars, #ffb400); letter-spacing: 1px; font-size: 14px; }

.rom-c2__badge2 {
	position: absolute;
	bottom: 88px;
	right: -22px;
	background: var(--rom-c2-b2-bg, #e5007d);
	color: var(--rom-c2-b2-text, #fff);
	border-radius: 16px;
	padding: 12px 16px;
	box-shadow: 0 16px 40px -12px rgba(229, 0, 125, .5);
	transform: rotate(5deg);
	font-family: 'Outfit', sans-serif;
	font-weight: 800;
	font-size: 14px;
	line-height: 1.2;
}

.rom-c2__badge2 span { font-weight: 600; font-size: 11px; opacity: .9; }

/* Tekst */
.rom-c2__text { display: flex; flex-direction: column; gap: 26px; }

.rom-c2__status {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 8px;
	background: var(--rom-c2-status-bg, #eaf8ef);
	color: var(--rom-c2-status-text, #1c8a4c);
	padding: 8px 14px;
	border-radius: 999px;
	font-family: 'Outfit', sans-serif;
	font-weight: 700;
	font-size: 12px;
}

.rom-c2__status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--rom-c2-status-dot, #3ddc84); display: inline-block; }

.rom-c2__title {
	margin: 0;
	font-family: 'Outfit', sans-serif;
	font-weight: 800;
	font-size: clamp(38px, 5vw, 64px);
	line-height: .98;
	letter-spacing: -.035em;
	text-wrap: balance;
	color: var(--rom-c2-title, #0f1b2d);
}

.rom-c2__hl { color: var(--rom-c2-title-hl, #0091d5); }
.rom-c2__par { margin: 0; font-size: 17px; line-height: 1.7; color: var(--rom-c2-par, #4a5568); max-width: 46ch; text-wrap: pretty; }

.rom-c2__btns { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }

.rom-c2__btn {
	display: flex;
	align-items: center;
	gap: 14px;
	border-radius: 18px;
	padding: 16px 18px;
	transition: transform .2s;
	color: #fff;
}

.rom-c2__btn:hover { transform: translateY(-3px); }
.rom-c2__btn--wa { background: var(--rom-c2-wa-bg, #22c55e); color: var(--rom-c2-wa-text, #fff); box-shadow: 0 14px 30px -12px rgba(34, 197, 94, .6); }
.rom-c2__btn--wa:hover { color: var(--rom-c2-wa-text, #fff); }
.rom-c2__btn--ph { background: var(--rom-c2-ph-bg, #0f1b2d); color: var(--rom-c2-ph-text, #fff); }
.rom-c2__btn--ph:hover { color: var(--rom-c2-ph-text, #fff); }
.rom-c2__btn-ico { width: 42px; height: 42px; border-radius: 12px; background: rgba(255, 255, 255, .18); display: grid; place-items: center; flex-shrink: 0; }
.rom-c2__btn-txt { line-height: 1.25; }
.rom-c2__btn-small { display: block; font-size: 12px; opacity: .85; }
.rom-c2__btn-big { display: block; font-family: 'Outfit', sans-serif; font-size: 16px; }

.rom-c2__meta { display: flex; gap: 24px; flex-wrap: wrap; font-size: 14px; color: var(--rom-c2-meta, #5a6b7a); padding-top: 6px; border-top: 1px solid var(--rom-c2-meta-line, #e1e8ef); }
.rom-c2__meta b { color: var(--rom-c2-meta-strong, #0f1b2d); }
.rom-c2__meta a { color: var(--rom-c2-meta, #5a6b7a); transition: color .2s; }
.rom-c2__meta a:hover { color: var(--rom-c2-meta-strong, #0f1b2d); }

@media (max-width: 640px) {
	.rom-c2 { padding: 64px 20px; }
	.rom-c2__badge1 { left: 8px; }
	.rom-c2__badge2 { right: 8px; }
}