/* ==========================================================================
   ABL Transfo — page « Avantages PRO »
   Haut de page clair : l'inscription commence tout de suite (profil, société) et la carte du compte pro, marine au motif
   de la marque, s'écrit à ce nom. La même carte accompagne le formulaire d'ABL Pro, sa jauge se remplit avec les champs.
   Puis avantages en liste typographique, trois étapes, gammes (bandeau marine), guide et FAQ.
   Charte : Poppins ; marine, bleu, gris ; vert seulement pour un compte actif ; cartes plates, filet fin, sans ombre.
   ========================================================================== */
.abl-ap {
	--marine: #002331; --marine-2: #0A3446; --bleu: #1E6E8F; --bleu-f: #175873; --bleu-c: #E8F2F7;
	--fond: #F4F8FA; --filet: #DDE6EB; --texte: #243B45; --doux: #5A6D76; --pale: #8A9CA5; --vert: #1B7A43;
	--ff: Poppins, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--w: var(--wd-container-w, 1400px); --gut: 15px; --colle: calc(var(--wd-header-sticky-h, 90px) + 24px);
	--fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%231E6E8F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.abl-ap .wd-content-layout, .abl-ap #main-content { max-width: none !important; padding: 0 !important; margin: 0 !important; }
.abl-ap .wd-page-content { background: #fff; }

.aap { font-family: var(--ff); font-size: 16px; line-height: 1.6; color: var(--texte); -webkit-font-smoothing: antialiased; overflow-x: clip; --wd-link-color: currentColor; --wd-link-color-hover: currentColor; }
.aap *, .aap *::before, .aap *::after { box-sizing: border-box; }
.aap :where(h1, h2, h3, p, ul, ol, li, dl, dt, dd, figure, fieldset, legend) { margin: 0; padding: 0; }
.aap :where(ul, ol) { list-style: none; }
.aap :where(a) { color: inherit; text-decoration: none; }
.aap-in { max-width: var(--w); margin-inline: auto; padding-inline: var(--gut); }
.aap a:focus-visible, .aap button:focus-visible, .aap input:focus-visible, .aap select:focus-visible { outline: 2px solid var(--bleu); outline-offset: 3px; }
.aap-ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.aap-sec { padding: clamp(56px, 6vw, 96px) 0; }
.abl-ap .aap .aap-h2 { font-family: var(--ff); font-weight: 600; font-size: clamp(28px, 2.6vw, 40px); line-height: 1.15; letter-spacing: -.015em; color: var(--marine); text-transform: none; text-wrap: balance; }
.abl-ap .aap .aap-h2--c { text-align: center; }
.aap-sous { max-width: 58ch; font-size: 16.5px; line-height: 1.65; color: var(--doux); }

/* ---------------- Boutons (plats : pas d'ombre) ---------------- */
.aap-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.abl-ap .aap .aap-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 0 26px; border: 0; border-radius: 999px; font: 600 15.5px/1 var(--ff); letter-spacing: 0; text-transform: none; white-space: nowrap; cursor: pointer; box-shadow: none; transition: background-color .2s, color .2s, box-shadow .2s; }
.abl-ap .aap .aap-btn--plein { background: var(--marine); color: #fff; }
.abl-ap .aap .aap-btn--plein:hover { background: var(--bleu-f); color: #fff; }
.abl-ap .aap .aap-btn--trait { background: #fff; color: var(--marine); box-shadow: inset 0 0 0 1px #C9D6DD; }
.abl-ap .aap .aap-btn--trait:hover { box-shadow: inset 0 0 0 1px var(--bleu); color: var(--bleu-f); }
.aap-btn .aap-ic { transition: transform .2s; }
.aap-btn:hover .aap-ic { transform: translateX(3px); }

/* ---------------- Haut de page : on commence son compte, la carte s'écrit à votre nom ---------------- */
.aap-hero { position: relative; isolation: isolate; overflow: clip; padding: clamp(36px, 4vw, 64px) 0 0;
	background: linear-gradient(180deg, var(--fond) 0%, #fff 100%); } /* pas de halo derrière la carte : rien qui ressemble à une ombre */
.aap-hero__grille { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 40px clamp(40px, 5.5vw, 100px); align-items: center; }
.abl-ap .aap .aap-h1 { margin: 0; font: inherit; color: inherit; text-transform: none; letter-spacing: 0; }
.aap-h1__k { display: block; font: 600 13px/1.35 var(--ff); letter-spacing: .14em; text-transform: uppercase; color: var(--bleu); }
.aap-h1__d { display: block; margin-top: 16px; font-family: var(--ff); font-weight: 600; font-size: clamp(40px, 4.4vw, 64px); line-height: 1.08; letter-spacing: -.025em; color: var(--marine); text-wrap: balance; }
.aap-h1__d em { font-style: normal; color: var(--bleu); }
.aap-hero .aap-lead { max-width: 37em; margin-top: 20px; font-size: clamp(16.5px, 1.2vw, 18px); line-height: 1.65; color: var(--doux); }

.aap-debut { margin-top: 28px; }
.aap-debut fieldset { border: 0; min-width: 0; margin: 0; padding: 0; }
.abl-ap .aap .aap-debut__t { display: block; float: none; width: auto; margin: 0 0 10px; padding: 0; border: 0; font: 600 12.5px/1.3 var(--ff); letter-spacing: .12em; text-transform: uppercase; color: var(--doux); }
.aap-puces { display: flex; flex-wrap: wrap; gap: 8px; }
.abl-ap .aap .aap-puce { position: relative; display: inline-flex; margin: 0; cursor: pointer; }
.aap-puce input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.aap-puce span { display: inline-flex; align-items: center; height: 40px; padding: 0 16px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--filet); font: 500 14.5px/1 var(--ff); color: var(--marine); white-space: nowrap; user-select: none; transition: background-color .2s, color .2s, box-shadow .2s; }
.aap-puce:hover span { box-shadow: inset 0 0 0 1px #AFC5D0; }
.aap-puce input:checked + span { background: var(--marine); color: #fff; box-shadow: none; }
.aap-puce input:focus-visible + span { outline: 2px solid var(--bleu); outline-offset: 2px; }
.aap-fit { max-height: 0; overflow: hidden; font-size: 15px; line-height: 1.55; color: var(--bleu-f); opacity: 0; transition: max-height .4s ease, margin-top .4s ease, opacity .4s ease; }
.aap-fit.is-on { max-height: 5em; margin-top: 12px; opacity: 1; }
.aap-debut__ligne { display: flex; align-items: flex-end; gap: 12px; margin-top: 20px; }
.abl-ap .aap .aap-debut__nom { flex: 1; min-width: 0; margin: 0; }
.abl-ap .aap .aap-debut__nom input { display: block; width: 100%; height: 56px; margin: 0; padding: 0 18px; border: 1px solid var(--filet); border-radius: 12px; background: #fff; box-shadow: none; font: 500 16px var(--ff); color: var(--texte); }
.abl-ap .aap .aap-debut__nom input:focus { border-color: var(--bleu); outline: none; box-shadow: 0 0 0 3px rgba(30, 110, 143, .16); }
.abl-ap .aap .aap-debut .aap-btn { min-height: 56px; }
.aap-debut__plus { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 16px; font-size: 14px; color: var(--doux); }
.aap-debut__plus span { display: inline-flex; align-items: center; gap: 8px; }
.aap-debut__plus span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--bleu); }
.aap-debut__connexion { margin-top: 12px; font-size: 14.5px; color: var(--doux); }
.aap-debut__connexion a, .aap-contact__connexion a { font-weight: 600; color: var(--marine); text-decoration: underline; text-decoration-color: rgba(0, 35, 49, .3); text-underline-offset: 3px; }
.aap-debut__connexion a:hover, .aap-contact__connexion a:hover { text-decoration-color: var(--bleu); }

.aap-hero__carte { display: grid; place-items: center; padding: 28px 0 44px; }
.aap-preuves { display: flex; flex-wrap: wrap; gap: 8px 36px; margin-top: clamp(36px, 4.5vw, 64px); padding: 20px 0 24px; border-top: 1px solid var(--filet); font-size: 14.5px; color: var(--doux); }
.aap-preuves b { font-weight: 600; color: var(--marine); }

/* ---------------- La carte du compte pro (haut de page et formulaire) ---------------- */
.aap-carte { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; width: min(100%, 480px); aspect-ratio: 1.586; padding: 26px 28px 22px; border-radius: 20px; color: #fff;
	background: radial-gradient(90% 80% at 100% 0%, rgba(30, 110, 143, .55), transparent 62%), linear-gradient(155deg, var(--marine-2) 0%, var(--marine) 58%, #001A25 100%); }
.aap-carte::before { content: ""; position: absolute; z-index: -1; inset: 0; background: url('/wp-content/plugins/abl-avantages-pro/img/motif-clair.svg') -40px -30px / 760px auto repeat; opacity: .085; pointer-events: none; }
.aap-carte::after { content: ""; position: absolute; inset: 10px; border-radius: 13px; box-shadow: inset 0 0 0 1px rgba(232, 242, 247, .16); pointer-events: none; }
.aap-carte--hero { transform: rotate(-3deg); }
@media (min-width: 1600px) { .aap-carte--hero { width: 520px; } }
.aap-carte__reflet { position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .16) 50%, transparent 62%) 130% 0 / 260% 100% no-repeat; }
.aap-carte.is-lit .aap-carte__reflet { animation: aap-reflet 1.1s cubic-bezier(.2, .7, .2, 1); }
@keyframes aap-reflet { from { background-position: 130% 0; } to { background-position: -30% 0; } }
.aap-carte__haut { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.aap-carte__logo { display: block; width: auto; height: 44px; }
.aap-carte__type { display: inline-flex; align-items: center; gap: 8px; font: 600 10.5px/1.2 var(--ff); letter-spacing: .15em; text-transform: uppercase; color: rgba(232, 242, 247, .9); text-align: right; }
.aap-carte--membre .aap-carte__type { padding: 6px 11px 6px 9px; border-radius: 999px; background: var(--vert); color: #fff; letter-spacing: .1em; }
.aap-carte--membre .aap-carte__type::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; }
.aap-carte--attente .aap-carte__type { padding: 6px 11px; border-radius: 999px; background: rgba(232, 242, 247, .14); letter-spacing: .1em; }
.aap-carte__label { margin-top: auto; font: 600 10px/1 var(--ff); letter-spacing: .16em; text-transform: uppercase; color: rgba(232, 242, 247, .6); }
.aap-carte__nom { margin-top: 9px; font: 600 clamp(26px, 2.3vw, 34px)/1.1 var(--ff); letter-spacing: -.015em; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .3s; }
.aap-carte__nom.is-vide { color: rgba(232, 242, 247, .34); }
.aap-carte__ligne { display: block; height: 2px; margin: 13px 0 11px; border-radius: 2px; background: linear-gradient(90deg, #E8F2F7, #6FB3CF 45%, rgba(30, 110, 143, 0)); transform-origin: 0 50%; transform: scaleX(.18); opacity: .5; transition: transform .8s cubic-bezier(.2, .7, .2, 1), opacity .4s; }
.aap-carte.has-nom .aap-carte__ligne { transform: none; opacity: 1; }
.aap-carte__meta { font-size: 14px; line-height: 1.4; color: rgba(255, 255, 255, .82); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aap-carte:not(.has-profil) [data-aap-carte-profil] { color: rgba(232, 242, 247, .42); }
.aap-carte__bas { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; margin-top: 14px; }
.aap-carte__titulaire { font: 500 12px/1.2 var(--ff); letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .7); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.aap-carte__titulaire:empty { display: none; }
.aap-carte__atouts { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11.5px; letter-spacing: .01em; color: rgba(232, 242, 247, .7); }
.aap-carte__atouts li { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.aap-carte__atouts li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #6FB3CF; }
.aap-carte .aap-carte__ue, .aap-carte.is-ue .aap-carte__marque { display: none; }
.aap-carte.is-ue .aap-carte__ue { display: inline-flex; }
.aap-carte--cote { width: 100%; padding: 22px 24px 18px; border-radius: 18px; }
.aap-carte--cote .aap-carte__logo { height: 36px; }
.aap-carte--cote .aap-carte__nom { font-size: 27px; }

/* ---------------- Avantages : une liste, la typographie fait la hiérarchie ---------------- */
.aap-atouts__grille { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 32px clamp(40px, 6vw, 110px); align-items: start; }
.aap-atouts__tete { position: sticky; top: var(--colle); }
.aap-atouts__tete .aap-sous { margin-top: 16px; }
.aap-atout { padding: 26px 0; border-top: 1px solid var(--filet); }
.aap-atout:first-child { padding-top: 4px; border-top: 0; }
.abl-ap .aap .aap-atout dt { font: 600 clamp(20px, 1.7vw, 24px)/1.25 var(--ff); letter-spacing: -.01em; color: var(--marine); }
.aap-atout--remise dt { color: var(--bleu) !important; }
.abl-ap .aap .aap-atout dd { max-width: 60ch; margin: 8px 0 0; font-size: 16px; line-height: 1.65; color: var(--doux); }
.aap-atout dd a { font-weight: 600; color: var(--bleu-f); text-decoration: underline; text-decoration-color: rgba(23, 88, 115, .35); text-underline-offset: 3px; white-space: nowrap; }
.aap-atout dd a:hover { text-decoration-color: var(--bleu); }

/* ---------------- Trois étapes : le filet bleu les relie ---------------- */
.aap-etapes { background: var(--fond); }
.aap-etapes__liste { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px clamp(24px, 4vw, 72px); max-width: 1160px; margin: clamp(30px, 3vw, 44px) auto 0; text-align: center; }
.aap-etapes__liste::before { content: ""; position: absolute; left: 17%; right: 17%; top: 34px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, rgba(30, 110, 143, 0), var(--bleu) 14%, #6FB3CF 50%, var(--bleu) 86%, rgba(30, 110, 143, 0)); }
.aap-etapes__liste li { position: relative; }
.aap-etapes__n { position: relative; display: inline-grid; place-items: center; width: 70px; height: 70px; border-radius: 50%; background: var(--fond); box-shadow: inset 0 0 0 1.5px var(--bleu); font: 600 26px/1 var(--ff); color: var(--bleu); }
.abl-ap .aap .aap-etapes__liste h3 { margin: 18px 0 6px; font: 600 19px/1.3 var(--ff); color: var(--marine); text-transform: none; letter-spacing: 0; }
.aap-etapes__liste p { max-width: 34ch; margin: 0 auto; font-size: 15.5px; line-height: 1.6; color: var(--doux); }

/* ---------------- Inscription : le formulaire d'ABL Pro, la carte et la jauge à côté ---------------- */
.aap-inscription { scroll-margin-top: var(--colle); }
.aap-inscription__grille { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 32px clamp(28px, 4vw, 64px); align-items: start; }
.aap-inscription__panneau { padding: clamp(24px, 3vw, 44px); border: 1px solid var(--filet); border-radius: 22px; background: #fff; }
.aap-inscription__panneau > .aap-sous { margin-top: 10px; font-size: 15.5px; }
.aap-inscription__panneau > .aap-ctas { margin-top: 24px; }
.aap-form { margin-top: 26px; }
.aap-form h2, .aap-form h3 { display: none; }
.abl-ap .aap-form form.register { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px 18px; margin: 0; padding: 0; border: 0; }
.abl-ap .aap-form form.register > * { grid-column: 1 / -1; margin: 0; }
.abl-ap .aap-form form.register > .aap-champ { padding: 0; }
.abl-ap .aap-form form.register > .aap-champ--billing_company, .abl-ap .aap-form form.register > .aap-champ--billing_vat,
.abl-ap .aap-form form.register > .aap-champ--billing_country, .abl-ap .aap-form form.register > .aap-champ--profil { grid-column: span 3; }
.abl-ap .aap-form form.register > .aap-champ--billing_first_name, .abl-ap .aap-form form.register > .aap-champ--billing_last_name, .abl-ap .aap-form form.register > .aap-champ--billing_phone,
.abl-ap .aap-form form.register > .aap-champ--reg_email, .abl-ap .aap-form form.register > .aap-champ--reg_username, .abl-ap .aap-form form.register > .aap-champ--reg_password { grid-column: span 2; }
.abl-ap .aap-form .aap-form__groupe { display: flex; align-items: center; gap: 14px; margin: 12px 0 -2px; font: 600 12px/1.3 var(--ff); letter-spacing: .12em; text-transform: uppercase; color: var(--bleu); }
.abl-ap .aap-form form.register > .aap-form__groupe:nth-child(2) { margin-top: 0; }
.aap-form .aap-form__groupe::after { content: ""; flex: 1; height: 1px; background: var(--filet); }
.abl-ap .aap-form label { display: block; margin: 0 0 7px; font: 600 13px/1.35 var(--ff); letter-spacing: .01em; color: var(--texte); text-transform: none; }
.abl-ap .aap-form label .required { color: var(--bleu); text-decoration: none; border: 0; font-weight: 600; }
.abl-ap .aap-form :is(input[type="text"], input[type="email"], input[type="password"], input[type="tel"], select) { display: block; width: 100%; height: 50px; margin: 0; padding: 0 16px; border: 1px solid var(--filet); border-radius: 12px; background-color: #fff; box-shadow: none; font: 500 15.5px var(--ff); color: var(--texte); }
.abl-ap .aap-form select { -webkit-appearance: none; appearance: none; padding-right: 44px; background: #fff var(--fleche) no-repeat right 18px center / 12px 8px; cursor: pointer; }
.abl-ap .aap-form select:invalid, .abl-ap .aap-form select.is-vide { color: var(--pale); }
.abl-ap .aap-form select option { color: var(--texte); }
.abl-ap .aap-form :is(input, select):focus { border-color: var(--bleu); outline: none; box-shadow: 0 0 0 3px rgba(30, 110, 143, .16); }
.abl-ap .aap-form ::placeholder { color: #9AABB3; opacity: 1; }
.abl-ap .aap-form .aap-champ--billing_vat input { text-transform: uppercase; letter-spacing: .03em; }
.abl-ap .aap-form .aap-champ--billing_vat input::placeholder { text-transform: none; letter-spacing: 0; }
.abl-ap .aap-form .aap-champ--billing_vat.is-faux input { border-color: #B8C8D0; }
.aap-form .aap-aide { display: block; margin-top: 7px; font-size: 13px; line-height: 1.45; color: var(--doux); }
.abl-ap .aap-form .aap-note-ue { padding: 11px 14px; border-radius: 10px; background: var(--bleu-c); font-size: 13.5px; line-height: 1.5; color: var(--bleu-f); }
.abl-ap .aap-form .aap-note-ue[hidden] { display: none; }
.aap-form .cf-turnstile { grid-column: 1 / -1; min-height: 65px; }
.aap-form .cf-turnstile-br, .aap-form wc-order-attribution-inputs { display: none; }
.abl-ap .aap-form .aap-confidentialite, .abl-ap .aap-form .aap-confidentialite p { font-size: 13px; line-height: 1.5; color: var(--doux); }
.aap-form .aap-confidentialite a { color: var(--bleu-f); text-decoration: underline; text-underline-offset: 2px; }
.abl-ap .aap-form .form-row-btn, .abl-ap .aap-form .woocommerce-form-row:has(button[name="register"]) { margin: 4px 0 0; padding: 0; }
.abl-ap .aap .aap-form button[name="register"] { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 56px; margin: 0; padding: 0 24px; border: 0; border-radius: 999px; background: var(--marine); color: #fff; font: 600 16px/1 var(--ff); letter-spacing: 0; text-transform: none; box-shadow: none; }
.abl-ap .aap .aap-form button[name="register"]:hover { background: var(--bleu-f); color: #fff; }
.abl-ap .aap-form .aap-form__apres { margin-top: -6px; font-size: 13.5px; color: var(--doux); text-align: center; }
.abl-ap .aap-inscription :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) { margin: 20px 0 0 !important; padding: 14px 18px !important; border: 1px solid var(--filet) !important; border-radius: 12px; background: #fff !important; color: var(--texte) !important; font: 500 14.5px/1.5 var(--ff); list-style: none; box-shadow: none !important; }
.abl-ap .aap-inscription .woocommerce-error { border-color: #E3B6AE !important; background: #FDF6F4 !important; color: #8E2B1E !important; }
.abl-ap .aap-inscription :is(.woocommerce-error, .woocommerce-message, .woocommerce-info)::before { display: none; }
.abl-ap .aap-inscription :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) li { margin: 0; padding: 0; list-style: none; }

.aap-inscription__cote { position: sticky; top: var(--colle); display: grid; gap: 20px; }
.aap-inscription__carte { display: grid; gap: 16px; }
.aap-jauge { padding: 0 4px; }
.aap-jauge__t { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 14px; color: var(--doux); }
.aap-jauge__t b { font-weight: 600; color: var(--marine); font-variant-numeric: tabular-nums; }
.aap-jauge__barre { position: relative; display: block; height: 3px; margin-top: 10px; border-radius: 3px; background: var(--filet); overflow: hidden; }
.aap-jauge__barre span { position: absolute; inset: 0; border-radius: 3px; background: linear-gradient(90deg, var(--bleu), #6FB3CF); transform-origin: 0 50%; transform: scaleX(0); transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.aap-jauge.is-pleine .aap-jauge__t span { font-weight: 600; color: var(--vert); }
.aap-jauge.is-pleine .aap-jauge__barre span { background: var(--vert); }
.aap-contact { padding: 22px 24px; border-radius: 18px; background: var(--fond); }
.aap-contact__t { font: 600 18px/1.3 var(--ff); color: var(--marine); }
.aap-contact__tel { display: inline-block; margin-top: 12px; font: 600 21px/1 var(--ff); letter-spacing: -.01em; color: var(--marine) !important; }
.aap-contact__h { margin-top: 6px; font-size: 13.5px; color: var(--doux); }
.aap-contact__mail { display: block; width: fit-content; margin-top: 12px; font-weight: 600; color: var(--bleu-f) !important; text-decoration: underline !important; text-decoration-color: rgba(23, 88, 115, .35) !important; text-underline-offset: 3px; }
.aap-contact__adr { margin-top: 14px; font-size: 13.5px; line-height: 1.5; color: var(--doux); }
.aap-contact__connexion { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--filet); font-size: 14.5px; color: var(--doux); }

/* ---------------- Gammes : bandeau marine au motif de la marque ---------------- */
.aap-familles { position: relative; isolation: isolate; overflow: hidden; background: var(--marine); color: #fff; }
.aap-familles::before { content: ""; position: absolute; z-index: -1; inset: 0; background: url('/wp-content/plugins/abl-avantages-pro/img/motif-clair.svg') left top / 1180px auto repeat; opacity: .06; pointer-events: none; }
.aap-familles__tete { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 40px; margin-bottom: clamp(24px, 3vw, 36px); }
.abl-ap .aap .aap-familles .aap-h2 { color: #fff; }
.aap-familles .aap-sous { color: rgba(232, 242, 247, .72); }
.aap-familles__liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.aap-familles__liste a { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 100%; padding: 20px 22px; border-radius: 16px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px rgba(232, 242, 247, .16); transition: background-color .2s, box-shadow .2s; }
.aap-familles__liste a:hover { background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1px rgba(232, 242, 247, .38); }
.aap-familles__liste b { display: block; font: 600 18px/1.3 var(--ff); color: #fff; }
.aap-familles__liste small { display: block; margin-top: 3px; font-size: 13.5px; line-height: 1.45; color: rgba(232, 242, 247, .68); }
.aap-familles__liste .aap-ic { color: #6FB3CF; transition: transform .2s; }
.aap-familles__liste a:hover .aap-ic { transform: translateX(3px); }

/* ---------------- Guide et FAQ (contenu de la page, celui que Rank Math analyse) ---------------- */
.aap-guide__corps { max-width: 820px; margin: 0 auto; font-size: 16.5px; line-height: 1.75; color: var(--texte); }
.aap-guide__corps > *:first-child { margin-top: 0 !important; }
.aap-guide__corps p { margin: 0 0 1.05em; }
.abl-ap .aap .aap-guide__corps h2 { margin: 1.9em 0 .6em; scroll-margin-top: var(--colle); font: 600 clamp(24px, 2vw, 30px)/1.25 var(--ff); letter-spacing: -.012em; color: var(--marine); text-transform: none; text-wrap: balance; }
.aap-guide__corps ul, .aap-guide__corps ol { margin: 0 0 1.2em; }
.aap-guide__corps ul li { position: relative; margin: 0 0 .55em; padding-left: 22px; }
.aap-guide__corps ul li::before { content: ""; position: absolute; left: 3px; top: .72em; width: 7px; height: 7px; border-radius: 50%; background: var(--bleu); }
.aap-guide__corps ol { counter-reset: aap-o; }
.aap-guide__corps ol li { position: relative; margin: 0 0 .7em; padding-left: 38px; counter-increment: aap-o; }
.aap-guide__corps ol li::before { content: counter(aap-o); position: absolute; left: 0; top: .12em; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--bleu); font: 600 13px/1 var(--ff); color: var(--bleu); }
.aap-guide__corps strong { font-weight: 600; color: var(--marine); }
.aap-guide__corps a { color: var(--bleu-f); text-decoration: underline; text-decoration-color: rgba(23, 88, 115, .35); text-underline-offset: 3px; }
.aap-guide__corps a:hover { text-decoration-color: var(--bleu); }
.aap-guide__corps .rank-math-list { display: grid; gap: 10px; margin: 10px 0 0; }
.aap-guide__corps .rank-math-list-item { padding: 20px 24px; border-radius: 16px; background: var(--fond); }
.abl-ap .aap .aap-guide__corps .rank-math-question { margin: 0 0 8px; font: 600 17px/1.4 var(--ff); color: var(--marine); text-transform: none; letter-spacing: 0; }
.aap-guide__corps .rank-math-answer { font-size: 15.5px; line-height: 1.65; color: var(--doux); }
.aap-guide__corps .rank-math-answer p:last-child { margin-bottom: 0; }

/* ---------------- Tablette et téléphone ---------------- */
@media (max-width: 1179px) {
	.aap-hero__grille { grid-template-columns: minmax(0, 1fr); }
	.aap-hero__carte { padding: 8px 0 0; }
	.aap-carte--hero { width: min(100%, 460px); }
	.aap-atouts__grille { grid-template-columns: minmax(0, 1fr); }
	.aap-atouts__tete { position: static; }
	.aap-inscription__grille { grid-template-columns: minmax(0, 1fr); }
	.aap-inscription__cote { position: static; }
	.aap-inscription__carte { display: none; } /* la carte du haut de page a déjà repris les réponses */
	.aap-familles__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
	.aap-h1__d { font-size: clamp(34px, 9.6vw, 44px); }
	.aap-puces { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; margin: 0 calc(var(--gut) * -1); padding: 0 var(--gut) 2px; }
	.aap-puces::-webkit-scrollbar { display: none; }
	.aap-puce { flex: 0 0 auto; }
	.aap-debut__ligne { flex-direction: column; align-items: stretch; }
	.abl-ap .aap .aap-btn { width: 100%; }
	.aap-ctas { flex-direction: column; }
	.aap-carte { padding: 18px 20px 16px; border-radius: 16px; }
	.aap-carte::after { inset: 8px; border-radius: 11px; }
	.aap-carte--hero { width: calc(100% - 10px); transform: rotate(-1.6deg); }
	.aap-carte__logo { height: 30px; }
	.aap-carte__nom { font-size: 24px; margin-top: 7px; }
	.aap-carte__ligne { margin: 10px 0 8px; }
	.aap-carte__meta { font-size: 13px; }
	.aap-carte__bas { margin-top: 10px; gap: 4px 12px; }
	.aap-carte__atouts { gap: 3px 11px; font-size: 10.5px; }
	.aap-carte__titulaire { font-size: 11px; }
	.aap-preuves { gap: 6px 22px; font-size: 14px; }
	.aap-etapes__liste { grid-template-columns: minmax(0, 1fr); gap: 34px; }
	.aap-etapes__liste::before { left: 50%; right: auto; top: 20px; bottom: 20px; width: 2px; height: auto; background: linear-gradient(180deg, rgba(30, 110, 143, 0), var(--bleu) 10%, #6FB3CF 50%, var(--bleu) 90%, rgba(30, 110, 143, 0)); }
	.aap-etapes__liste li { background: var(--fond); padding-bottom: 4px; }
	.abl-ap .aap-form form.register { grid-template-columns: minmax(0, 1fr); }
	.abl-ap .aap-form form.register > * { grid-column: 1 / -1 !important; }
	.aap-inscription__panneau { border-radius: 18px; }
	.aap-familles__liste { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.aap-familles__liste a { padding: 16px 18px; }
	.aap-guide__corps, .aap-guide__corps p { font-size: 16px; }
}
/* Pas de mot seul en fin de paragraphe (navigateurs récents ; les autres coupent comme avant). */
.aap-lead, .aap-sous, .aap-fit, .aap-atout dd, .aap-etapes__liste p, .aap-familles__liste small, .aap-guide__corps p, .aap-guide__corps li { text-wrap: pretty; }
@media (prefers-reduced-motion: reduce) { .aap *, .aap *::before, .aap *::after { animation: none !important; transition: none !important; } }