/* Gabarit Tarifs — nodes Figma (référence 1728).
   Titre 157→312, rémunération 381→541, barèmes 610→1117, renvoi 1178→1264. */

.tarifs > section {
	position: relative;
}

.tf-hero {
	padding-top: clamp(2.25rem, 3.99306vw, 4.3125rem); /* 69 : 157 − 88 */
	padding-left: 2.83565%;  /* 49 */
	padding-right: 2.89352%;
}

.tf-hero__title {
	max-width: 48.55740%; /* 791 sur les 1629 utiles de la section */
	font-family: var(--ff-display);
	font-size: var(--fs-h1);
	line-height: var(--lh-h1);
	color: var(--c-ink);
}

.tf-hero__intro {
	margin-top: clamp(0.5rem, 0.92593vw, 1rem); /* 16 */
	max-width: 48.55740%;                       /* 791 sur 1629 */
}

.tf-block {
	padding-inline: 2.89352%; /* 50 → 1628 */
}

.tf-block--pay {
	margin-top: clamp(2.25rem, 3.99306vw, 4.3125rem); /* 69 : 381 − 312 */
}

.tf-block--rates {
	/* 69 : 610 − 541 */
	margin-top: clamp(2.25rem, 3.99306vw, 4.3125rem);
}

.tf-block__badge {
	padding-block: 11px; /* hauteur fixe 33 */
}

.tf-block__text {
	margin-top: clamp(1rem, 2.14120vw, 2.3125rem); /* 37 : 451 − 414 */
}

/* La politique tarifaire du client (site actuel) tient en quatre paragraphes
   et une liste de textes de référence, là où la maquette n'en montre qu'un :
   même rythme et même retrait de liste que le corps d'article. */
.tf-block__text > * + * {
	margin-top: calc(var(--fs-body) * var(--lh-body)); /* 30 */
}

.tf-block__text ul {
	padding-left: 1.5em;
	list-style: revert;
}

.tf-block__text li + li {
	margin-top: 0.4em;
}

/* Deux colonnes indépendantes : les barèmes n'ont pas la même hauteur à
   gauche et à droite (un bloc de trois seuils face à trois blocs). */
.tf-rates {
	margin-top: clamp(1rem, 1.67824vw, 1.8125rem); /* 29 : 672 − 643 */
	display: grid;
	grid-template-columns: repeat(2, 48.46437%); /* 789 sur 1628 */
	column-gap: 3.07125%;                        /* 50 */
	align-items: start;
}

.tf-rates__column > * + * {
	margin-top: clamp(1.5rem, 2.14120vw, 2.3125rem); /* 37 */
}

.tf-rate__title {
	font-size: var(--fs-card);
	line-height: var(--lh-card);
	letter-spacing: var(--ls-card);
	color: var(--c-ink);
}

/* Sous-titre d'un barème (renvoi aux articles 787 B et 787 C) : absent de la
   maquette, calé sur le corps de texte pour ne pas dégrader le contraste. */
.tf-rate__note {
	margin-top: clamp(0.25rem, 0.52083vw, 0.5625rem); /* 9 */
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	color: var(--c-ink);
	opacity: var(--o-text);
}

.tf-rate__box {
	margin-top: clamp(0.25rem, 0.52083vw, 0.5625rem); /* 9 : 714 − 705 */
	border: var(--rule) solid var(--c-line);
	padding-block: clamp(0.75rem, 1.33102vw, 1.4375rem); /* 23 : 78 = 1 + 23 + 30 + 23 + 1 */
	padding-left: 3.04182%;  /* 24 sur une boîte de 789 */
	padding-right: 4.69011%; /* 37 */
}

.tf-rate__line {
	display: flex;
	/* baseline laisse la boîte flex dépasser l'interligne (78 devenait 79). */
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	color: var(--c-ink);
}

/* Un barème à plusieurs seuils : 84 entre deux lignes (979 − 895). */
.tf-rate__line + .tf-rate__line {
	margin-top: clamp(1.5rem, 3.12500vw, 3.375rem); /* 54 : 84 − 30 */
}

.tf-rate__threshold {
	opacity: var(--o-text);
}

/* DIN Pro Bold (node 596:2314), extrait de l'archive de polices fournie. */
.tf-rate__value {
	flex: none;
	font-weight: 700;
	opacity: var(--o-text);
	text-align: right;
	white-space: nowrap;
}

.tf-footnote {
	margin-top: clamp(2.5rem, 3.52975vw, 3.8125rem); /* 61 : 1178 − 1117 */
	margin-bottom: clamp(3rem, 5.95486vw, 6.4375rem); /* 103 : 1367 − 1264 */
	padding-inline: 2.89352%;
}

.tf-footnote__link {
	display: inline-block;
	margin-top: clamp(0.25rem, 0.52083vw, 0.5625rem); /* 9 : 1217 − 1208 */
}

@media (max-width: 1199px) {
	.tf-hero,
	.tf-block,
	.tf-footnote {
		padding-inline: var(--gutter-text);
	}

	.tf-hero__title,
	.tf-hero__intro {
		max-width: 46ch;
	}

	.tf-rates {
		grid-template-columns: 1fr;
		column-gap: 0;
		row-gap: clamp(1.5rem, 2.14120vw, 2.3125rem);
	}
}

@media (max-width: 767px) {
	.tf-rate__line {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.25rem;
	}

	.tf-rate__value {
		text-align: left;
	}
}