/*
 * blocks/section-split.css — texte fond couleur (motif SVG) / image plein cadre, 50/50.
 * Complète guest.css, ne redéfinit aucune primitive existante.
 */

.section-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 480px;
}
.section-split--reverse { direction: rtl; }
.section-split--reverse > * { direction: ltr; }
.section-split__text {
	background: #fff;
	color: var(--ink);
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: var(--s16) clamp(1.5rem, 6vw, 5rem);
}
.section-split__text > * { position: relative; z-index: 1; }
.section-split__text .eyebrow { color: var(--teal); }
.section-split__text h2 { color: var(--ink); margin-top: var(--s4); }
.section-split__text p { color: var(--muted, #64748b); margin-top: var(--s4); max-width: 480px; }
.section-split__text .btn { margin-top: var(--s8); }
.section-split__extra { margin-top: var(--s6); width: 100%; max-width: 480px; }
.section-split__list { display: flex; flex-direction: column; gap: var(--s3); margin-top: var(--s6); }
.section-split__list li { display: flex; align-items: center; gap: var(--s2); }
.section-split__list i { width: 20px; height: 20px; color: var(--teal); flex-shrink: 0; }
.section-split--dark .section-split__list i { color: var(--signal); }
.section-split--dark .section-split__text {
	background: var(--teal);
	color: #fff;
}
.section-split--dark .section-split__text::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.12' stroke-width='1.4'%3E%3Cpath d='M-10 30 C 20 10, 40 50, 70 30 S 110 10, 140 30'/%3E%3Cpath d='M-10 70 C 20 50, 40 90, 70 70 S 110 50, 140 70'/%3E%3Cpath d='M-10 110 C 20 90, 40 130, 70 110 S 110 90, 140 110'/%3E%3C/g%3E%3C/svg%3E");
	background-size: 120px 120px;
	pointer-events: none;
}
.section-split--dark .section-split__text .eyebrow { color: var(--signal); }
.section-split--dark .section-split__text h2 { color: #fff; }
.section-split--dark .section-split__text p { color: rgba(255,255,255,.82); }

.section-split__media { position: relative; min-height: 320px; }
.section-split__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 900px) {
	.section-split { grid-template-columns: 1fr; min-height: 0; }
	.section-split__media { min-height: 280px; }
}
