/*
 * blocks/pricing-transparency.css — carte de frais de la section accueil
 * "Tarifs transparents" (visuel droit du .split-visual).
 */

.pricing-transparency__card {
	background: #fff;
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-card);
	padding: var(--s8);
	display: flex;
	flex-direction: column;
	gap: var(--s5);
}

.pricing-transparency__head {
	display: flex;
	align-items: center;
	gap: var(--s3);
	padding-bottom: var(--s4);
	border-bottom: 1px solid var(--divider);
	font-size: .82rem;
	font-weight: 700;
	color: var(--ink-2);
}

.pricing-transparency__head-icon {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--teal-soft);
	color: var(--teal);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.pricing-transparency__head-icon i { width: 1.05rem; height: 1.05rem; }

.pricing-transparency__row {
	display: flex;
	align-items: flex-start;
	gap: var(--s4);
	padding-top: var(--s4);
}
.pricing-transparency__row:first-of-type { padding-top: 0; }
.pricing-transparency__row + .pricing-transparency__row {
	border-top: 1px solid var(--divider);
}

.pricing-transparency__icon {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--teal-soft);
	color: var(--teal);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.pricing-transparency__icon i { width: 1rem; height: 1rem; }

.pricing-transparency__body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: .2rem;
	padding-top: .1rem;
}
.pricing-transparency__body strong {
	font-size: .95rem;
	font-weight: 700;
	color: var(--ink);
}
.pricing-transparency__body p {
	font-size: .8rem;
	color: var(--muted);
	line-height: 1.45;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Tablette : garde la mise en page 2 colonnes du PC (au lieu de l'empilement
   générique .split-visual à 1020px) — seul le mobile reste empilé. */
@media (min-width: 781px) and (max-width: 1020px) {
	.pricing-transparency__grid { grid-template-columns: 1.1fr .9fr; gap: var(--s12); }
}

@media (max-width: 1020px) {
	.pricing-transparency__card { padding: var(--s6); }
}

/* Téléphone : les 2 panneaux (texte / carte tarifs) deviennent des slides
   balayables plutôt qu'empilés, même traitement que .app-promo__grid. */
@media (max-width: 780px) {
	.pricing-transparency__card { padding: var(--s5); }
	.pricing-transparency__icon { width: 30px; height: 30px; }
	.pricing-transparency__icon i { width: .9rem; height: .9rem; }

	.pricing-transparency__grid {
		display: flex;
		grid-template-columns: none;
		gap: var(--s4);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	.pricing-transparency__grid::-webkit-scrollbar { display: none; }
	.pricing-transparency__grid > * {
		flex: 0 0 88%;
		scroll-snap-align: start;
		min-width: 0;
	}
	.pricing-transparency__grid .split-visual__visual {
		max-width: none;
	}
	.pricing-transparency__grid + .scroll-bars { display: flex; }
}