/* =========================================================================
   unbebe.fr · pages du parcours d'abonnement (formules, confirmation, espace membre, aide).
   Charte du thème « Doudou Géométrique » : aplats pastel par section, séparateurs organiques (ub_divider),
   Baloo 2 + Nunito, cartes « autocollant » inclinées. Jetons --ub-* (clair et sombre). Hors @layer.
   Composants partagés (carte de membre, tuiles) : sections.css.
   ========================================================================= */

/* Le gabarit du studio centre le contenu sur 1100 px : les pages du site prennent toute la largeur,
   chaque section porte son aplat et recentre son contenu. */
.afps-main .afps-wrap:has(> .afub) { inline-size: 100%; max-inline-size: none; margin: 0; padding: 0; }
.afub {
	/* cqi : la marge se calcule toujours sur la largeur de la page, même dans une section (séparateurs pleine largeur). */
	container-type: inline-size;
	--afub-pad: max(var(--ub-gutter), calc((100cqi - 75rem) / 2));
	color: var(--ub-text);
	font-family: var(--ub-font-text);
	font-size: var(--ub-fs-body);
	line-height: var(--ub-lh-normal);
}
.afub > section, .afub > .afub-help__grid { padding-inline: var(--afub-pad); }
.afub .ub-divider { margin-inline: calc(-1 * var(--afub-pad)); }
.afub > .ub-divider { margin-inline: 0; }
.afub :where(h1, h2, h3, p, ul, ol, li, dl, dt, dd, figure, fieldset, legend) { margin: 0; padding: 0; }
.afub :where(ul[role="list"], ol) { list-style: none; }
.afub :where(a) { color: var(--ub-link); }
.afub a.ub-btn--primary, .afub a.ub-btn--primary:hover { color: #FFFFFF; }
.afub :is(a, button, summary, input):focus-visible { outline: 0.1875rem solid var(--ub-focus); outline-offset: 0.1875rem; }

/* ── Typographie ───────────────────────────────────────────────────────── */
.afub .afub-kicker {
	display: inline-flex;
	align-items: center;
	gap: var(--ub-s-2);
	padding: 0.35rem 0.85rem 0.35rem 0.6rem;
	border-radius: var(--ub-r-full);
	background-color: var(--ub-framboise-50);
	color: var(--ub-framboise-700);
	font-size: var(--ub-fs-xs);
	font-weight: 800;
	letter-spacing: var(--ub-ls-caps);
	text-transform: uppercase;
	line-height: 1.2;
}
.afub .afub-kicker .afub-i { inline-size: 1.1rem; block-size: 1.1rem; }
.afub .afub-kicker--plain { padding: 0; background: none; }
.afub .afub-h1, .afub .afub-hero__title {
	margin-block-start: var(--ub-s-4);
	font-family: var(--ub-font-display);
	font-size: var(--ub-fs-display-l);
	font-weight: 800;
	line-height: var(--ub-lh-tight);
	letter-spacing: var(--ub-ls-display);
	color: var(--ub-text);
	text-wrap: balance;
}
.afub .afub-h2 {
	margin-block-start: var(--ub-s-2);
	font-family: var(--ub-font-display);
	font-size: var(--ub-fs-h2);
	font-weight: 700;
	line-height: var(--ub-lh-snug);
	letter-spacing: var(--ub-ls-display);
	color: var(--ub-text);
	text-wrap: balance;
}
.afub .afub-h3 {
	display: flex;
	align-items: center;
	gap: var(--ub-s-2);
	font-family: var(--ub-font-display);
	font-size: var(--ub-fs-h4);
	font-weight: 700;
	line-height: 1.2;
}
.afub .afub-h3 .afub-i { color: var(--ub-framboise-600); }
html[data-ub-theme="dark"] .afub .afub-h3 .afub-i { color: var(--ub-framboise-300); }
.afub .afub-lede { margin-block-start: var(--ub-s-4); max-inline-size: 36rem; font-size: var(--ub-fs-lead); line-height: 1.5; color: var(--ub-encre-700); }
.afub .afub-sub { margin-block-start: var(--ub-s-3); max-inline-size: 40rem; font-size: var(--ub-fs-body); color: var(--ub-encre-700); }
.afub .afub-fine { margin-block-start: var(--ub-s-3); font-size: var(--ub-fs-sm); color: var(--ub-text-muted); }
.afub .afub-accent { position: relative; display: inline-block; line-height: 1; color: var(--ub-framboise-600); white-space: nowrap; }
.afub .afub-accent::after {
	content: "";
	position: absolute;
	inset-inline: -0.12em;
	inset-block-end: -0.16em;
	block-size: 0.13em;
	border-radius: var(--ub-r-full);
	background-color: var(--ub-soleil-500);
	transform: rotate(-1.2deg);
}
html[data-ub-theme="dark"] .afub .afub-accent { color: var(--ub-framboise-300); }
.afub .afub-head { max-inline-size: 46rem; }
.afub .afub-head--center { margin-inline: auto; text-align: center; }
.afub .afub-head--center .afub-sub { margin-inline: auto; }

/* ── Boutons (composant .ub-btn du thème) ──────────────────────────────── */
.afub .ub-btn.afub-btn { gap: var(--ub-s-2); text-decoration: none; white-space: normal; text-align: center; }
.afub .ub-btn.afub-btn .afub-i { inline-size: 1.15rem; block-size: 1.15rem; }
.afub .ub-btn--outline.afub-btn { border: var(--ub-stroke) solid var(--ub-text); background: none; color: var(--ub-text); }
.afub .ub-btn--outline.afub-btn:hover { background-color: var(--ub-text); color: var(--ub-bg); }
.afub .afub-btn--sm { min-block-size: 2.5rem; padding: var(--ub-s-2) var(--ub-s-5); font-size: var(--ub-fs-sm); }
.afub .afub-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ub-s-3); margin-block-start: var(--ub-s-6); }

/* Chiffres réels en bande (comme « Pourquoi nous faire confiance » de l'accueil) */
.afub .afub-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-block-start: var(--ub-s-6); max-inline-size: 34rem; border-radius: var(--ub-r-lg); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub .afub-stats li { display: grid; align-content: start; gap: 0.2rem; padding: var(--ub-s-4) var(--ub-s-4); }
.afub .afub-stats li + li { border-inline-start: 0.0625rem solid var(--ub-border); }
.afub .afub-stats b { font-family: var(--ub-font-display); font-size: clamp(1.625rem, 1.3rem + 1vw, 2.125rem); font-weight: 800; line-height: 1; color: var(--ub-framboise-600); }
html[data-ub-theme="dark"] .afub .afub-stats b { color: var(--ub-framboise-300); }
.afub .afub-stats small { font-size: var(--ub-fs-xs); font-weight: 700; line-height: 1.3; color: var(--ub-text-muted); }
@media (max-width: 23.999rem) { .afub .afub-stats li { padding-inline: var(--ub-s-3); } }

/* Faits en autocollants (comme le hero de l'accueil) */
.afub .afub-facts { display: flex; flex-wrap: wrap; gap: var(--ub-s-3); margin-block-start: var(--ub-s-6); }
.afub .afub-facts li {
	display: flex;
	align-items: center;
	gap: var(--ub-s-3);
	padding: var(--ub-s-2) var(--ub-s-4) var(--ub-s-2) var(--ub-s-2);
	border-radius: var(--ub-r-full);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-sticker);
}
.afub .afub-facts li:nth-child(2) { transform: rotate(-1deg); }
.afub .afub-facts li:nth-child(3) { transform: rotate(0.8deg); }
.afub .afub-facts li > span:last-child { display: grid; line-height: 1.2; }
.afub .afub-facts b { font-size: var(--ub-fs-sm); font-weight: 800; }
.afub .afub-facts small { font-size: var(--ub-fs-xs); color: var(--ub-text-muted); }
.afub .afub-facts__i { display: grid; place-items: center; inline-size: 2.25rem; block-size: 2.25rem; border-radius: 50%; }
.afub .afub-facts__i .afub-i { inline-size: 1.2rem; block-size: 1.2rem; }
.afub .afub-facts__i--lilas { background-color: var(--ub-lilas-100); color: var(--ub-lilas-700); }
.afub .afub-facts__i--menthe { background-color: var(--ub-menthe-100); color: var(--ub-menthe-700); }
.afub .afub-facts__i--soleil { background-color: var(--ub-soleil-100); color: var(--ub-soleil-700); }

.afub .afub-note, .afub .afub-alert {
	display: flex;
	gap: var(--ub-s-3);
	align-items: flex-start;
	margin: var(--ub-s-5) var(--afub-pad);
	padding: var(--ub-s-4);
	border-radius: var(--ub-r-md);
	background-color: var(--ub-ciel-50);
	font-size: var(--ub-fs-sm);
}
.afub .afub-alert { background-color: var(--ub-framboise-50); color: var(--ub-text); }
.afub .afub-alert .afub-i { color: var(--ub-danger); }
.afub-dash .afub-alert, .afub-member .afub-alert { margin-inline: 0; }

/* =========================================================================
   FORMULES
   ========================================================================= */
.afub-hero {
	position: relative;
	display: grid;
	gap: var(--ub-s-8);
	padding-block: clamp(2rem, 1rem + 4vw, 4.5rem) 0;
	background-color: var(--ub-bg);
}
@media (min-width: 64rem) { .afub-hero { background-image:
		radial-gradient(circle at 6% 12%, var(--ub-framboise-500) 0 0.3rem, transparent 0.32rem),
		radial-gradient(circle at 44% 6%, var(--ub-ciel-500) 0 0.28rem, transparent 0.3rem),
		radial-gradient(circle at 38% 88%, var(--ub-soleil-500) 0 0.32rem, transparent 0.34rem),
		radial-gradient(circle at 96% 70%, var(--ub-menthe-500) 0 0.26rem, transparent 0.28rem); }
}
.afub-hero > .ub-divider { grid-column: 1 / -1; margin-block-start: var(--ub-s-6); }
@media (min-width: 64rem) {
	.afub-hero { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); align-items: center; column-gap: var(--ub-s-9); }
}
.afub-hero__text { position: relative; z-index: 1; }
.afub .afub-hero__go { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ub-s-3) var(--ub-s-5); margin-block-start: var(--ub-s-7); }
.afub-hero__from { font-size: var(--ub-fs-sm); color: var(--ub-text-muted); }
.afub-hero__from b { color: var(--ub-text); font-weight: 800; }

/* Scène de la carte : la formule choisie au premier plan, les deux autres finitions en éventail derrière. */
.afub-stage { position: relative; display: grid; place-items: center; min-block-size: clamp(17rem, 10rem + 22vw, 31rem); padding-block: var(--ub-s-6) var(--ub-s-8); overflow-x: clip; }
.afub-stage__glow { position: absolute; inset: 8% 6% 14%; border-radius: 62% 38% 45% 55% / 55% 48% 52% 45%; background: radial-gradient(closest-side, var(--ub-soleil-100), color-mix(in oklab, var(--ub-framboise-100) 70%, transparent) 70%, transparent); }
.afub-stage__front, .afub-stage__back { position: absolute; inline-size: min(78%, 30rem); }
.afub-stage .afub-card { max-inline-size: none; }
.afub-stage__front { z-index: 3; transform: rotate(-3deg); transition: transform var(--ub-dur-slow) var(--ub-ease-spring); }
.afub-stage__front .afub-card__face { box-shadow: 0 2.4rem 3.4rem -1.4rem rgb(27 16 51 / 0.6), 0 0.3rem 0.7rem rgb(27 16 51 / 0.16); }
.afub-stage__back { z-index: 1; opacity: 0.96; }
.afub-stage__back--0 { transform: translate(-17%, -15%) rotate(-11deg) scale(0.86); }
.afub-stage__back--1 { transform: translate(17%, -21%) rotate(8deg) scale(0.86); z-index: 2; }
.afub .afub-stage__caption {
	position: absolute;
	inset-block-end: 0;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	gap: var(--ub-s-2);
	padding: var(--ub-s-2) var(--ub-s-4);
	border-radius: var(--ub-r-full);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-sticker);
	font-size: var(--ub-fs-sm);
	font-weight: 800;
	color: var(--ub-text);
}
.afub .afub-stage__caption .afub-i { color: var(--ub-framboise-600); }
html[data-ub-theme="dark"] .afub .afub-stage__caption .afub-i { color: var(--ub-framboise-300); }
@media (max-width: 63.999rem) {
	.afub-hero { gap: var(--ub-s-5); }
	.afub-hero__text { display: contents; }
	.afub-hero__text > .afub-kicker { order: 1; justify-self: start; }
	.afub-hero__text > .afub-hero__title { order: 2; }
	.afub-hero > .afub-stage { order: 3; }
	.afub-hero__text > .afub-lede { order: 4; }
	.afub-hero__text > .afub-stats { order: 5; }
	.afub-hero__text > .afub-hero__go { order: 6; }
	.afub-hero > .ub-divider { order: 9; }
	.afub .afub-hero__title, .afub .afub-lede, .afub .afub-stats, .afub .afub-hero__go { margin-block-start: 0; }
	.afub-stage__front, .afub-stage__back { inline-size: min(84%, 26rem); }
	.afub-stage__back--0 { transform: translate(-9%, -13%) rotate(-9deg) scale(0.88); }
	.afub-stage__back--1 { transform: translate(9%, -18%) rotate(7deg) scale(0.88); }
}

/* ── Sélecteur ─────────────────────────────────────────────────────────── */
.afub-plans { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) 0; background-color: var(--ub-lilas-50); }
.afub-plans > .ub-divider { margin-block-start: var(--ub-s-9); }
.afub-picker { margin-block-start: var(--ub-s-7); }

.afub-period {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	inline-size: min(100%, 24rem);
	margin: 0 auto var(--ub-s-7);
	padding: 0.3rem;
	border: 0;
	border-radius: var(--ub-r-full);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-sticker);
}
.afub-period__opt { position: relative; z-index: 1; display: grid; place-items: center; min-block-size: 2.75rem; padding: 0 var(--ub-s-3); border-radius: var(--ub-r-full); cursor: pointer; transition: background-color var(--ub-dur-base) var(--ub-ease-out); }
.afub-period__opt:has(input:checked) { background-color: var(--ub-encre); }
html[data-ub-theme="dark"] .afub-period__opt:has(input:checked) { background-color: var(--ub-text); }
.afub-period__opt input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.afub-period__opt > span { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.35rem; font-weight: 800; font-size: var(--ub-fs-sm); color: var(--ub-text); transition: color var(--ub-dur-fast); }
.afub-period__opt:has(input:checked) > span { color: var(--ub-bg); }
html[data-ub-theme="dark"] .afub-period__opt:has(input:checked) > span { color: var(--ub-creme); }
.afub-period__opt em { padding: 0.1rem 0.45rem; border-radius: var(--ub-r-full); background-color: var(--ub-soleil-300); color: #1B1033; font-size: 0.6875rem; font-style: normal; font-weight: 800; }
.afub-period__opt:has(input:focus-visible) { outline: 0.1875rem solid var(--ub-focus); outline-offset: 0.125rem; }

.afub-tiers { display: grid; gap: var(--ub-s-5); border: 0; }
@media (min-width: 64rem) { .afub-tiers { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ub-s-6); align-items: stretch; } }
.afub-offer label.afub-plan {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 0.1875rem solid transparent;
	border-radius: var(--ub-r-lg);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-card);
	cursor: pointer;
	transform: rotate(var(--afub-tilt, 0deg));
	transition: transform var(--ub-dur-base) var(--ub-ease-spring), border-color var(--ub-dur-fast), box-shadow var(--ub-dur-base);
}
.afub-offer label.afub-plan:hover { transform: rotate(0deg) translateY(-0.25rem); }
.afub-offer label.afub-plan:has(input:checked) {
	border-color: var(--ub-framboise-600);
	box-shadow: 0 1.5rem 3rem -1.25rem color-mix(in oklab, var(--ub-framboise-600) 55%, transparent);
	transform: rotate(0deg) translateY(-0.375rem);
}
.afub-offer label.afub-plan:has(input:focus-visible) { outline: 0.1875rem solid var(--ub-focus); outline-offset: 0.25rem; }
.afub-plan__input { position: absolute; inset-block-start: 1rem; inset-inline-start: 1rem; inline-size: 1.25rem; block-size: 1.25rem; margin: 0; opacity: 0; }
.afub-plan__art { position: relative; display: grid; place-items: center; block-size: 10.5rem; overflow: hidden; }
.afub-offer .afub-plan__art img { display: block; inline-size: 11rem; block-size: 11rem; max-inline-size: none; object-fit: contain; transition: transform var(--ub-dur-slow) var(--ub-ease-spring); }
.afub-offer label.afub-plan:has(input:checked) .afub-plan__art img { transform: scale(1.08) rotate(-4deg); }
.afub-plan__body { display: flex; flex-direction: column; gap: var(--ub-s-2); padding: var(--ub-s-5) var(--ub-s-5) var(--ub-s-6); flex: 1; }
.afub-plan__top { display: flex; align-items: center; justify-content: space-between; gap: var(--ub-s-3); }
.afub-plan__name { font-family: var(--ub-font-display); font-size: var(--ub-fs-h3); font-weight: 800; line-height: 1.1; }
.afub-plan__tick { display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; border: 0.125rem solid var(--ub-border); border-radius: 50%; color: transparent; transition: background-color var(--ub-dur-fast), border-color var(--ub-dur-fast), color var(--ub-dur-fast); }
.afub-plan__tick .afub-i { inline-size: 1.1rem; block-size: 1.1rem; }
label.afub-plan:has(input:checked) .afub-plan__tick { border-color: var(--ub-framboise-600); background-color: var(--ub-framboise-600); color: #FFFFFF; }
.afub-plan__price { display: flex; align-items: baseline; gap: 0.35rem; color: var(--ub-text); }
.afub-plan__price b { font-family: var(--ub-font-display); font-size: clamp(2.25rem, 1.8rem + 1.4vw, 2.875rem); font-weight: 800; line-height: 1; letter-spacing: -0.02em; }
.afub-plan__price > span { font-weight: 700; color: var(--ub-text-muted); }
.afub-offer .afub-plan__sub.afps-when-month { display: block; }
.afub-offer:has(input[name="period"][value="year"]:checked) .afub-plan__sub.afps-when-year { display: block; }
.afub-plan__sub { min-block-size: 2.6em; font-size: var(--ub-fs-sm); color: var(--ub-encre-700); }
.afub-plan__finishline { display: flex; gap: var(--ub-s-3); align-items: flex-start; margin-block-start: auto; padding-block-start: var(--ub-s-4); border-block-start: 0.09375rem dashed var(--ub-border); font-size: var(--ub-fs-sm); color: var(--ub-encre-700); }
.afub-plan__finishline > span { display: grid; }
.afub-plan__finishline b { font-weight: 800; color: var(--ub-text); }
.afub-plan__finishline .afub-i { inline-size: 1.5rem; block-size: 1.5rem; margin-block-start: 0.1rem; }
.afub-plan--t0 .afub-plan__finishline .afub-i { color: #9C6A3C; }
.afub-plan--t1 .afub-plan__finishline .afub-i { color: #B8892B; }
.afub-plan--t2 .afub-plan__finishline .afub-i { color: #7D8794; }
html[data-ub-theme="dark"] .afub-plan--t0 .afub-plan__finishline .afub-i { color: #E7BF93; }
html[data-ub-theme="dark"] .afub-plan--t1 .afub-plan__finishline .afub-i { color: #F7DE8E; }
html[data-ub-theme="dark"] .afub-plan--t2 .afub-plan__finishline .afub-i { color: #D5DBE3; }
@media (max-width: 63.999rem) {
	.afub-offer label.afub-plan { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); }
	.afub-plan__art { block-size: auto; min-block-size: 100%; }
	.afub-offer .afub-plan__art img { inline-size: 6rem; block-size: 6rem; }
	.afub-plan__body { padding: var(--ub-s-4); }
	.afub-plan__price b { font-size: 2rem; }
	.afub-plan__sub { min-block-size: 0; }
	.afub-plan__finishline { padding-block-start: var(--ub-s-3); }
}
@media (max-width: 23.999rem) {
	.afub-offer label.afub-plan { grid-template-columns: 4.5rem minmax(0, 1fr); }
	.afub-offer .afub-plan__art img { inline-size: 4.25rem; block-size: 4.25rem; }
}

.afub-common { margin-block-start: var(--ub-s-7); padding: var(--ub-s-5); border-radius: var(--ub-r-lg); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub .afub-common__title { margin-block-end: var(--ub-s-4); font-family: var(--ub-font-display); font-size: var(--ub-fs-h4); font-weight: 700; }
.afub-common ul { display: grid; gap: var(--ub-s-4); }
@media (min-width: 48rem) { .afub-common ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 72rem) { .afub-common ul { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.afub-common li { display: flex; gap: var(--ub-s-3); align-items: flex-start; }
.afub-common li > span:last-child { display: grid; gap: 0.15rem; }
.afub-common b { font-weight: 800; line-height: 1.25; }
.afub-common small { font-size: var(--ub-fs-xs); line-height: 1.4; color: var(--ub-text-muted); }
.afub-common__i { display: grid; place-items: center; flex: none; inline-size: 2.5rem; block-size: 2.5rem; border-radius: var(--ub-r-sm); background-color: var(--ub-framboise-50); color: var(--ub-framboise-700); }
.afub-common__i .afub-i { inline-size: 1.35rem; block-size: 1.35rem; }

.afub-bar {
	position: sticky;
	inset-block-end: max(0.75rem, env(safe-area-inset-bottom));
	z-index: 20;
	display: flex;
	align-items: center;
	gap: var(--ub-s-4);
	inline-size: min(100%, 52rem);
	margin: var(--ub-s-7) auto 0;
	padding: var(--ub-s-3) var(--ub-s-3) var(--ub-s-3) var(--ub-s-4);
	border: 0.09375rem solid var(--ub-border);
	border-radius: var(--ub-r-full);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-float);
}
.afub-bar__mini { flex: none; inline-size: 5.25rem; transform: rotate(-5deg); }
.afub-bar__mini .afub-card { max-inline-size: none; }
.afub-bar__mini .afub-card__face { box-shadow: 0 0.5rem 1rem -0.5rem rgb(27 16 51 / 0.45); }
.afub .afub-bar__sum { display: grid; min-inline-size: 0; line-height: 1.2; }
.afub-bar__sum b { font-family: var(--ub-font-display); font-size: var(--ub-fs-h4); font-weight: 800; }
.afub-bar__sum span { font-size: var(--ub-fs-sm); color: var(--ub-text-muted); }
.afub-offer .afub-bar .ub-btn.afub-cta[data-afps-cta] { margin-inline-start: auto; min-block-size: 3.25rem; padding-inline: var(--ub-s-6); background-color: var(--ub-framboise-600); color: #FFFFFF; font-size: var(--ub-fs-body); }
.afub-offer .afub-bar .ub-btn.afub-cta[data-afps-cta]:hover { background-color: #B3123F; }
@media (max-width: 47.999rem) {
	.afub-bar { flex-wrap: wrap; gap: var(--ub-s-2) var(--ub-s-3); border-radius: var(--ub-r-lg); padding: var(--ub-s-3); }
	.afub-bar__mini { inline-size: 3.75rem; }
	.afub-offer .afub-bar .ub-btn.afub-cta[data-afps-cta] { flex: 1 0 100%; margin: 0; min-block-size: 3rem; padding-inline: var(--ub-s-4); font-size: var(--ub-fs-sm); }
}
.afub .afub-assure { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--ub-s-2) var(--ub-s-6); margin-block-start: var(--ub-s-5); font-size: var(--ub-fs-sm); color: var(--ub-encre-700); }
.afub-assure li { display: inline-flex; align-items: center; gap: var(--ub-s-2); }
.afub-assure .afub-i { color: var(--ub-menthe-700); }

/* ── Sceaux et finitions ──────────────────────────────────────────────── */
.afub-seals { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) 0; background-color: var(--ub-beurre); }
.afub-seals > .afub-seals__grid + .ub-divider { margin-block-start: var(--ub-s-9); }
.afub-seals__grid { display: grid; gap: var(--ub-s-8); }
.afub-seals__text { display: grid; gap: var(--ub-s-7); align-items: center; }
@media (min-width: 64rem) { .afub-seals__text { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); } }
.afub-fan { position: relative; display: flex; justify-content: center; align-items: flex-end; gap: var(--ub-s-4); padding-block: var(--ub-s-4); }
.afub-fan__item { display: grid; justify-items: center; gap: var(--ub-s-3); flex: 1 1 0; min-inline-size: 0; max-inline-size: 14.5rem; transform: rotate(calc((var(--afub-n) - 1) * 5deg)); }
.afub-fan__item:nth-child(2) { transform: translateY(-1rem); z-index: 1; }
.afub-fan__item .afub-card { max-inline-size: none; }
.afub-fan__label { font-size: var(--ub-fs-xs); text-align: center; color: var(--ub-encre-700); }
.afub-fan__label b { display: block; font-family: var(--ub-font-display); font-size: var(--ub-fs-body); color: var(--ub-text); }

.afub-track { counter-reset: afub-step; display: grid; grid-template-columns: repeat(7, minmax(7.5rem, 1fr)); gap: var(--ub-s-3); overflow-x: auto; padding: var(--ub-s-2) var(--ub-s-1) var(--ub-s-4); scroll-snap-type: x proximity; }
.afub-track__step {
	position: relative;
	display: grid;
	justify-items: center;
	gap: 0.15rem;
	padding: var(--ub-s-4) var(--ub-s-2);
	border-radius: var(--ub-r-md);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-sticker);
	text-align: center;
	scroll-snap-align: start;
}
.afub-track__step { counter-increment: afub-step; }
.afub-track__step::before { content: counter(afub-step); position: absolute; inset-block-start: 0.5rem; inset-inline-start: 0.65rem; font-size: 0.6875rem; font-weight: 800; color: var(--ub-text-muted); }
.afub-track__seal { display: block; inline-size: 4.5rem; block-size: 4.5rem; margin-block-end: var(--ub-s-2); }
.afub-track__seal :is(img, svg) { display: block; inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: contain; }
.afub-track__step b { font-family: var(--ub-font-display); font-size: 0.9375rem; font-weight: 700; line-height: 1.15; }
.afub-track__step small { font-size: var(--ub-fs-xs); color: var(--ub-text-muted); }

/* ── Univers illustrés par leur dernier guide ─────────────────────────── */
.afub-univers { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) 0; }
.afub-univers > .ub-divider { margin-block-start: var(--ub-s-9); }
.afub-univers__grid { display: grid; gap: var(--ub-s-4); margin-block-start: var(--ub-s-6); }
@media (min-width: 64rem) {
	.afub-univers__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 1fr; }
	.afub-univers__tile:first-child { grid-column: span 2; grid-row: span 2; }
	.afub-univers__media { aspect-ratio: auto; flex: 1; min-block-size: 8rem; }
}
@media (max-width: 63.999rem) {
	.afub-univers__grid { grid-auto-flow: column; grid-auto-columns: min(72%, 17rem); overflow-x: auto; padding-block-end: var(--ub-s-3); scroll-snap-type: x mandatory; margin-inline: calc(-1 * var(--afub-pad)); padding-inline: var(--afub-pad); scroll-padding-inline: var(--afub-pad); }
	.afub-univers__tile { scroll-snap-align: start; }
}
.afub-univers__tile a {
	display: flex;
	flex-direction: column;
	block-size: 100%;
	overflow: hidden;
	border-radius: var(--ub-r-lg);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-card);
	color: var(--ub-text);
	text-decoration: none;
	transition: transform var(--ub-dur-fast) var(--ub-ease-spring);
}
.afub-univers__tile a:hover { transform: translateY(-0.25rem); }
.afub-univers__media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background-color: var(--ub-silo-bg); }
.afub-univers__tile:first-child .afub-univers__media { aspect-ratio: auto; flex: 1; min-block-size: 12rem; }
.afub .afub-univers__media img { display: block; inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover; transition: transform var(--ub-dur-slow) var(--ub-ease-out); }
.afub-univers__tile a:hover .afub-univers__media img { transform: scale(1.04); }
.afub-univers__body { display: grid; gap: var(--ub-s-2); padding: var(--ub-s-4); }
.afub-univers__head { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: var(--ub-s-2); }
.afub-univers__head .afub-silo-i { grid-row: span 2; inline-size: 2rem; block-size: 2rem; color: var(--ub-silo-deep); }
.afub-univers__head b { font-family: var(--ub-font-display); font-size: var(--ub-fs-h4); font-weight: 700; line-height: 1.1; color: var(--ub-silo-ink); }
.afub-univers__head small { font-size: var(--ub-fs-xs); font-weight: 800; color: var(--ub-text-muted); }
.afub-univers__latest { font-size: var(--ub-fs-sm); line-height: 1.35; color: var(--ub-encre-700); }
.afub-univers__tile:first-child .afub-univers__latest { font-family: var(--ub-font-display); font-size: var(--ub-fs-h4); font-weight: 700; color: var(--ub-text); }

/* ── Questions ────────────────────────────────────────────────────────── */
.afub-faq { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); background-color: var(--ub-menthe-50); }
.afub-faq__grid { display: grid; gap: var(--ub-s-3); margin-block-start: var(--ub-s-6); align-items: start; }
@media (min-width: 56rem) { .afub-faq__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.afub .afub-faq__item { border-radius: var(--ub-r-md); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub .afub-faq__item summary {
	display: flex;
	align-items: center;
	gap: var(--ub-s-3);
	min-block-size: 3.5rem;
	padding: var(--ub-s-3) var(--ub-s-5);
	font-family: var(--ub-font-display);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.25;
	cursor: pointer;
	list-style: none;
}
.afub .afub-faq__item summary::-webkit-details-marker { display: none; }
.afub .afub-faq__plus { margin-inline-start: auto; color: var(--ub-framboise-600); transition: transform var(--ub-dur-base) var(--ub-ease-spring); }
html[data-ub-theme="dark"] .afub .afub-faq__plus { color: var(--ub-framboise-300); }
.afub .afub-faq__item[open] .afub-faq__plus { transform: rotate(45deg); }
.afub .afub-faq__item > p, .afub .afub-answer__body { padding: 0 var(--ub-s-5) var(--ub-s-5); font-size: var(--ub-fs-sm); line-height: 1.6; color: var(--ub-encre-700); }
.afub .afub-more { margin-block-start: var(--ub-s-6); }

/* =========================================================================
   CONFIRMATION
   ========================================================================= */
.afub-confirm {
	display: grid;
	gap: var(--ub-s-8);
	align-items: center;
	padding: clamp(2rem, 1rem + 4vw, 5rem) var(--afub-pad);
	background-color: var(--ub-bg);
	background-image:
		radial-gradient(circle at 8% 18%, var(--ub-framboise-500) 0 0.32rem, transparent 0.34rem),
		radial-gradient(circle at 30% 86%, var(--ub-soleil-500) 0 0.3rem, transparent 0.32rem),
		radial-gradient(circle at 52% 10%, var(--ub-menthe-500) 0 0.28rem, transparent 0.3rem),
		radial-gradient(circle at 92% 82%, var(--ub-lilas-500) 0 0.3rem, transparent 0.32rem);
}
@media (min-width: 64rem) { .afub-confirm { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: var(--ub-s-10); } }
.afub-confirm__stage {
	position: relative;
	display: grid;
	justify-items: center;
	gap: var(--ub-s-5);
	padding: clamp(2rem, 1rem + 3vw, 3.5rem) var(--ub-s-5);
	border-radius: var(--ub-r-2xl);
	background-color: var(--ub-lilas-50);
}
.afub-confirm__stage::before {
	content: "";
	position: absolute;
	inset: 12% 18%;
	border-radius: 62% 38% 45% 55% / 55% 48% 52% 45%;
	background-color: var(--ub-soleil-100);
}
.afub-confirm__stage .afub-card { position: relative; transform: rotate(-3deg); }
.afub .afub-confirm__stamp {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: var(--ub-s-2);
	padding: var(--ub-s-2) var(--ub-s-4);
	border-radius: var(--ub-r-full);
	background-color: var(--ub-surface);
	box-shadow: var(--ub-sh-sticker);
	font-size: var(--ub-fs-sm);
	font-weight: 800;
}
.afub .afub-confirm__stamp.is-done .afub-i { color: var(--ub-success); }
.afub .afub-status {
	display: inline-flex;
	align-items: center;
	gap: var(--ub-s-2);
	margin-block-start: var(--ub-s-5);
	padding: var(--ub-s-2) var(--ub-s-4);
	border-radius: var(--ub-r-full);
	background-color: var(--ub-ciel-50);
	font-size: var(--ub-fs-sm);
	font-weight: 700;
	color: var(--ub-text);
}
.afub .afub-confirm__slow { margin-block-start: var(--ub-s-4); padding: var(--ub-s-4); border-radius: var(--ub-r-md); background-color: var(--ub-soleil-50); font-size: var(--ub-fs-sm); }
.afub .afub-confirm__slow p + p { margin-block-start: var(--ub-s-2); }
.afub .afub-next { display: grid; gap: var(--ub-s-3); margin-block-start: var(--ub-s-7); }
@media (min-width: 40rem) { .afub .afub-next { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.afub .afub-next li { display: grid; gap: var(--ub-s-3); align-content: start; padding: var(--ub-s-4); border-radius: var(--ub-r-md); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub .afub-next li > span:last-child { display: grid; gap: 0.15rem; }
.afub .afub-next b { font-weight: 800; line-height: 1.2; }
.afub .afub-next small { font-size: var(--ub-fs-xs); color: var(--ub-text-muted); }
.afub .afub-next__i { display: grid; place-items: center; inline-size: 2.5rem; block-size: 2.5rem; border-radius: var(--ub-r-sm); }
.afub .afub-next__i .afub-i { inline-size: 1.35rem; block-size: 1.35rem; }

/* Faits (confirmation, espace membre) */
.afub .afub-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ub-s-3); margin-block-start: var(--ub-s-6); }
.afub .afub-tiles > div { display: grid; gap: 0.3rem; align-content: start; padding: var(--ub-s-4); border-radius: var(--ub-r-md); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub .afub-tiles dt { display: flex; align-items: center; gap: var(--ub-s-2); font-size: var(--ub-fs-xs); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ub-text-muted); }
.afub .afub-tiles dt .afub-i { color: var(--ub-framboise-600); }
html[data-ub-theme="dark"] .afub .afub-tiles dt .afub-i { color: var(--ub-framboise-300); }
.afub .afub-tiles dd { display: grid; font-family: var(--ub-font-display); font-size: 1.375rem; font-weight: 700; line-height: 1.15; overflow-wrap: anywhere; }
.afub .afub-tiles dd small { font-family: var(--ub-font-text); font-size: var(--ub-fs-xs); font-weight: 600; color: var(--ub-text-muted); }

/* =========================================================================
   ESPACE MEMBRE
   ========================================================================= */
.afub-dash {
	display: grid;
	gap: var(--ub-s-8);
	align-items: center;
	padding-block: clamp(2rem, 1rem + 4vw, 4.5rem) var(--ub-s-6);
	background-color: var(--ub-bg);
}
@media (min-width: 64rem) { .afub-dash { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: var(--ub-s-10); } }
.afub-dash__card { position: relative; display: grid; justify-items: center; gap: var(--ub-s-4); padding: clamp(1.5rem, 1rem + 3vw, 3rem); border-radius: var(--ub-r-2xl); background-color: var(--ub-rose-poudre); }
.afub-dash__card::before { content: ""; position: absolute; inset: 14% 12%; border-radius: 62% 38% 45% 55% / 55% 48% 52% 45%; background-color: var(--ub-framboise-100); }
.afub-dash__card .afub-card { position: relative; transform: rotate(-2.5deg); }
.afub .afub-dash__finish { position: relative; display: inline-flex; align-items: center; gap: var(--ub-s-2); padding: var(--ub-s-2) var(--ub-s-4); border-radius: var(--ub-r-full); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); font-size: var(--ub-fs-sm); font-weight: 800; }
.afub .afub-pill { display: inline-flex; align-items: center; gap: var(--ub-s-2); margin-block-start: var(--ub-s-4); padding: 0.35rem 0.85rem; border-radius: var(--ub-r-full); background-color: var(--ub-menthe-100); font-size: var(--ub-fs-sm); font-weight: 800; color: var(--ub-text); }
.afub .afub-pill > span { inline-size: 0.6rem; block-size: 0.6rem; border-radius: 50%; background-color: var(--ub-menthe-600); }
.afub .afub-pill.is-warn { background-color: var(--ub-framboise-100); }
.afub .afub-pill.is-warn > span { background-color: var(--ub-framboise-600); }
.afub .afub-pill.is-ending { background-color: var(--ub-soleil-100); }
.afub .afub-pill.is-ending > span { background-color: var(--ub-soleil-600); }
.afub .afub-minis { display: grid; gap: var(--ub-s-3); margin-block-start: var(--ub-s-5); }
.afub .afub-minis a { display: flex; align-items: center; gap: var(--ub-s-3); padding: var(--ub-s-2) var(--ub-s-4) var(--ub-s-2) var(--ub-s-2); border-radius: var(--ub-r-md); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); color: var(--ub-text); text-decoration: none; }
.afub .afub-minis img { inline-size: 3rem; block-size: 3rem; border-radius: var(--ub-r-sm); background-color: var(--ub-soleil-100); mix-blend-mode: multiply; }
html[data-ub-theme="dark"] .afub .afub-minis img { mix-blend-mode: normal; }
.afub .afub-minis a > span { display: grid; }
.afub .afub-minis small { font-size: var(--ub-fs-xs); color: var(--ub-text-muted); }
.afub .afub-minis a > .afub-i { margin-inline-start: auto; color: var(--ub-text-muted); }

.afub-loyal { padding-block: var(--ub-s-6) 0; background-color: var(--ub-beurre); }
.afub-loyal > .ub-divider { margin-block-start: var(--ub-s-8); }
.afub-loyal__now { display: grid; gap: var(--ub-s-5); align-items: center; margin-block-end: var(--ub-s-6); }
@media (min-width: 48rem) { .afub-loyal__now { grid-template-columns: auto minmax(0, 1fr); gap: var(--ub-s-7); } }
.afub-loyal__seal { display: block; inline-size: 9rem; block-size: 9rem; filter: drop-shadow(0 0.75rem 1rem rgb(27 16 51 / 0.25)); }
.afub-loyal__seal svg { inline-size: 100%; block-size: 100%; }
.afub .afub-progress { margin-block-start: var(--ub-s-5); max-inline-size: 34rem; }
.afub .afub-progress p { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--ub-s-2); margin-block-end: var(--ub-s-2); font-size: var(--ub-fs-sm); }
.afub-progress__bar { display: block; block-size: 0.75rem; overflow: hidden; border-radius: var(--ub-r-full); background-color: var(--ub-surface); box-shadow: inset 0 0 0 0.09375rem var(--ub-border); }
.afub-progress__bar > span { display: block; block-size: 100%; border-radius: inherit; background-color: var(--ub-framboise-600); }
.afub-track--member .afub-track__step.is-locked .afub-track__seal { filter: grayscale(1); opacity: 0.35; }
.afub-track--member .afub-track__step.is-current { box-shadow: 0 0 0 0.1875rem var(--ub-framboise-600), var(--ub-sh-card); }
.afub-track--member .afub-track__step.is-locked { background-color: color-mix(in oklab, var(--ub-surface) 60%, transparent); box-shadow: none; }

.afub-cols { display: grid; gap: var(--ub-s-5); padding: var(--ub-s-8) var(--afub-pad) clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
@media (min-width: 64rem) { .afub-cols { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; } }
.afub-cols__side { display: grid; gap: var(--ub-s-5); }
.afub .afub-panel { padding: var(--ub-s-5); border-radius: var(--ub-r-lg); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub .afub-panel > .afub-h3 { margin-block-end: var(--ub-s-4); }
.afub-ledger { overflow-x: auto; }
.afub-ledger table { inline-size: 100%; border-collapse: collapse; font-size: var(--ub-fs-sm); }
.afub-ledger :is(th, td) { padding: var(--ub-s-3) var(--ub-s-2); border-block-end: 0.0625rem solid var(--ub-border); text-align: start; }
.afub-ledger th { font-size: var(--ub-fs-xs); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ub-text-muted); }
.afub-ledger td:last-child, .afub-ledger th:last-child { text-align: end; font-weight: 800; white-space: nowrap; }
.afub .afub-links { display: grid; gap: var(--ub-s-1); }
.afub .afub-links a { display: flex; align-items: center; gap: var(--ub-s-3); min-block-size: 2.75rem; padding: var(--ub-s-2) var(--ub-s-3); border-radius: var(--ub-r-sm); color: var(--ub-text); font-weight: 700; text-decoration: none; }
.afub .afub-links a:hover { background-color: var(--ub-lilas-50); }
.afub .afub-links .afub-i { color: var(--ub-lilas-600); }
html[data-ub-theme="dark"] .afub .afub-links .afub-i { color: var(--ub-lilas-300); }
.afub .afub-links .afub-links__out { margin-inline-start: auto; color: var(--ub-text-muted); }
.afub .afub-saved { display: flex; align-items: center; gap: var(--ub-s-2); margin-block-end: var(--ub-s-3); font-size: var(--ub-fs-sm); font-weight: 700; color: var(--ub-success); }
.afub-switch { position: relative; display: flex; gap: var(--ub-s-3); align-items: flex-start; margin-block-end: var(--ub-s-4); cursor: pointer; }
.afub-switch input { position: absolute; inline-size: 2.75rem; block-size: 1.5rem; margin: 0; opacity: 0; cursor: pointer; }
.afub-switch__ui { position: relative; flex: none; inline-size: 2.75rem; block-size: 1.5rem; border-radius: var(--ub-r-full); background-color: var(--ub-encre-300); transition: background-color var(--ub-dur-fast); }
.afub-switch__ui::after { content: ""; position: absolute; inset-block-start: 0.1875rem; inset-inline-start: 0.1875rem; inline-size: 1.125rem; block-size: 1.125rem; border-radius: 50%; background-color: #FFFFFF; transition: transform var(--ub-dur-base) var(--ub-ease-spring); }
.afub-switch input:checked + .afub-switch__ui { background-color: var(--ub-menthe-700); }
html[data-ub-theme="dark"] .afub-switch input:checked + .afub-switch__ui { background-color: var(--ub-menthe-600); }
.afub-switch input:checked + .afub-switch__ui::after { transform: translateX(1.25rem); }
.afub-switch input:focus-visible + .afub-switch__ui { outline: 0.1875rem solid var(--ub-focus); outline-offset: 0.125rem; }
.afub-switch__text { display: grid; gap: 0.15rem; }
.afub-switch__text small { font-size: var(--ub-fs-xs); color: var(--ub-text-muted); }

/* =========================================================================
   AIDE
   ========================================================================= */
.afub-helphero { padding-block: clamp(2rem, 1rem + 4vw, 4.5rem) 0; background-color: var(--ub-rose-poudre); }
.afub-helphero > .ub-divider { margin-block-start: var(--ub-s-8); }
.afub-help__grid { display: grid; gap: var(--ub-s-7); padding-block: var(--ub-s-8) var(--ub-s-9); }
@media (min-width: 64rem) { .afub-help__grid { grid-template-columns: 18rem minmax(0, 1fr); gap: var(--ub-s-9); align-items: start; } }
.afub-toc { position: sticky; inset-block-start: 6rem; padding: var(--ub-s-5); border-radius: var(--ub-r-lg); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
@media (max-width: 63.999rem) { .afub-toc { position: static; } }
.afub .afub-toc__title { margin-block-end: var(--ub-s-3); font-family: var(--ub-font-display); font-size: var(--ub-fs-h4); font-weight: 700; }
.afub-toc ol { display: grid; gap: 0.15rem; }
.afub-toc a { display: flex; gap: var(--ub-s-3); align-items: flex-start; padding: var(--ub-s-2); border-radius: var(--ub-r-sm); color: var(--ub-text); font-size: var(--ub-fs-sm); line-height: 1.3; text-decoration: none; }
.afub-toc a:hover { background-color: var(--ub-lilas-50); }
.afub-toc a > span { display: grid; place-items: center; flex: none; inline-size: 1.5rem; block-size: 1.5rem; border-radius: 50%; background-color: var(--ub-menthe-100); color: var(--ub-menthe-700); font-size: 0.75rem; font-weight: 800; }
.afub-toc a > span .afub-i { inline-size: 0.9rem; block-size: 0.9rem; }
.afub-answers { display: grid; gap: var(--ub-s-3); }
.afub .afub-answer { scroll-margin-block-start: 6rem; }
.afub .afub-answer__n { display: grid; place-items: center; flex: none; inline-size: 2rem; block-size: 2rem; border-radius: 50%; background-color: var(--ub-lilas-100); color: var(--ub-lilas-700); font-family: var(--ub-font-text); font-size: var(--ub-fs-sm); font-weight: 800; }
.afub .afub-answer__body p + p, .afub .afub-answer__body ul, .afub .afub-answer__body table { margin-block-start: var(--ub-s-3); }
.afub .afub-answer__body ul { padding-inline-start: 1.25rem; list-style: disc; }
.afub .afub-answer__body li + li { margin-block-start: var(--ub-s-1); }
.afub .afub-answer__body table { inline-size: 100%; border-collapse: collapse; }
.afub .afub-answer__body :is(th, td) { padding: var(--ub-s-2); border-block-end: 0.0625rem solid var(--ub-border); text-align: start; }
.afub-prices { margin-block-start: var(--ub-s-7); scroll-margin-block-start: 6rem; }
.afub-prices__grid { display: grid; gap: var(--ub-s-4); margin-block-start: var(--ub-s-5); }
@media (min-width: 48rem) { .afub-prices__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.afub-price { display: grid; gap: var(--ub-s-2); align-content: start; padding: var(--ub-s-5); border-radius: var(--ub-r-lg); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); }
.afub-price__art { display: block; inline-size: 4.5rem; block-size: 4.5rem; overflow: hidden; border-radius: var(--ub-r-md); }
.afub-price__art img { display: block; inline-size: 100%; block-size: 100%; max-inline-size: none; object-fit: cover; }
.afub-price__name { font-family: var(--ub-font-display); font-size: var(--ub-fs-h3); font-weight: 800; line-height: 1.1; }
.afub-price__finish { font-size: var(--ub-fs-xs); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ub-text-muted); }
.afub-price dl { display: grid; gap: var(--ub-s-1); margin-block: var(--ub-s-2); }
.afub-price dl > div { display: flex; justify-content: space-between; gap: var(--ub-s-2); padding-block: var(--ub-s-2); border-block-end: 0.0625rem dashed var(--ub-border); font-size: var(--ub-fs-sm); }
.afub-price dd { font-weight: 800; }
.afub-price__save { font-size: var(--ub-fs-xs); color: var(--ub-encre-700); }
.afub .afub-price__go { display: inline-flex; align-items: center; gap: var(--ub-s-2); margin-block-start: var(--ub-s-2); font-weight: 800; color: var(--ub-link); text-decoration: none; }

.afub-contact { display: grid; gap: var(--ub-s-6); padding-block: var(--ub-s-6) clamp(2.5rem, 1.5rem + 3vw, 4.5rem); background-color: var(--ub-menthe-50); }
@media (min-width: 64rem) { .afub-contact { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: stretch; } }
.afub-contact__card { display: grid; gap: var(--ub-s-5); align-items: center; padding: var(--ub-s-6); border-radius: var(--ub-r-lg); background-color: var(--ub-surface); box-shadow: var(--ub-sh-card); }
@media (min-width: 40rem) { .afub-contact__card:has(> .afub-contact__img) { grid-template-columns: 10rem minmax(0, 1fr); } }
.afub-contact__img { display: block; inline-size: 10rem; block-size: 10rem; max-inline-size: none; border-radius: var(--ub-r-lg); object-fit: cover; background-color: var(--ub-peche); }
.afub-quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ub-s-3); }
.afub-quick a { display: grid; gap: 0.2rem; align-content: start; block-size: 100%; padding: var(--ub-s-4); border-radius: var(--ub-r-md); background-color: var(--ub-surface); box-shadow: var(--ub-sh-sticker); color: var(--ub-text); text-decoration: none; transition: transform var(--ub-dur-fast) var(--ub-ease-spring); }
.afub-quick a:hover { transform: translateY(-0.2rem); }
.afub-quick a > span { display: grid; place-items: center; inline-size: 2.5rem; block-size: 2.5rem; margin-block-end: var(--ub-s-2); border-radius: var(--ub-r-sm); }
.afub-quick a > span .afub-i { inline-size: 1.35rem; block-size: 1.35rem; }
.afub-quick b { font-weight: 800; line-height: 1.2; }
.afub-quick small { font-size: var(--ub-fs-xs); color: var(--ub-text-muted); }
@media (max-width: 22rem) { .afub-quick { grid-template-columns: minmax(0, 1fr); } }

@media (prefers-reduced-motion: reduce) {
	.afub *, .afub *::before, .afub *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
	.afub-offer label.afub-plan, .afub-offer label.afub-plan:hover, .afub-offer label.afub-plan:has(input:checked) { transform: none; }
}