/* Tour ULM Jeunes, Encadrer, L’ULM ?, Formation, Vie des clubs (modules-pages/pratiquer-encadrer.mjs, js/pratiquer-encadrer.js).
   Couleurs de la charte seulement : Klein #001CA8, Midnight #191970, noir d'aniline #120D16, White Smoke #F5F5F5,
   Cranberry #950714, rouge #F32837, blanc — et leurs transparences. */

/* ── Éléments communs ── */
.fl-px-etiquette { display: inline-flex; align-items: center; gap: .4rem; margin: 0; font: 700 .7rem var(--police-ui); letter-spacing: .1em; text-transform: uppercase; color: #001CA8; }
.fl-px-etiquette::before { content: ''; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
.fl-px-lien { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; }
.fl-px-manque { margin: 1rem 0 0; padding: .7rem .95rem; border-left: 3px solid rgba(0, 28, 168, .35); background: rgba(0, 28, 168, .04); border-radius: 0 .7rem .7rem 0; font-size: .88rem; line-height: 1.5; color: rgba(18, 13, 22, .7); }
.fl-px-petit { margin: 1rem 0 0; font-size: .9rem; line-height: 1.55; color: rgba(18, 13, 22, .72); }
.fl-px-petit .fl-px-lien { margin-left: .2rem; }
.fl-px-boutons { display: flex; flex-wrap: wrap; gap: .7rem 1.2rem; align-items: center; margin: 1.4rem 0 0; }
.fl-px-chapo { font-size: 1.12rem; line-height: 1.6; color: rgba(18, 13, 22, .8); margin: 1.2rem 0 0; }
.fl-px-texte p { font-size: 1.06rem; line-height: 1.7; color: rgba(18, 13, 22, .82); margin: 0 0 1rem; max-width: 62ch; }
.fl-px-coches { list-style: none; margin: 1.2rem 0 0; padding: 0; display: grid; gap: .65rem; }
.fl-px-coches li { display: flex; gap: .7rem; align-items: flex-start; line-height: 1.5; }
.fl-px-coches svg { flex: none; margin-top: .2rem; width: 1.05rem; height: 1.05rem; padding: .2rem; box-sizing: content-box; border-radius: 50%; background: #001CA8; color: #fff; }

/* Segments (filtres) */
.fl-px-filtres { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; justify-content: space-between; margin: 1.6rem 0 1.2rem; }
.fl-px-segments { display: inline-flex; flex-wrap: wrap; gap: .25rem; padding: .25rem; border-radius: 999px; background: #F5F5F5; border: 1px solid var(--filet); max-width: 100%; }
.v6-papier-2 .fl-px-segments { background: #fff; }
.fl-px-segments button { all: unset; box-sizing: border-box; cursor: pointer; padding: .5rem .95rem; border-radius: 999px; font: 600 .88rem var(--police-ui); color: rgba(18, 13, 22, .75); display: inline-flex; gap: .4rem; align-items: center; }
.fl-px-segments button small { font: 700 .72rem var(--police-ui); color: rgba(18, 13, 22, .5); }
.fl-px-segments button[aria-pressed="true"] { background: #001CA8; color: #fff; box-shadow: 0 4px 12px -6px rgba(0, 28, 168, .6); }
.fl-px-segments button[aria-pressed="true"] small { color: rgba(255, 255, 255, .75); }
.fl-px-segments button:focus-visible { outline: 2px solid #001CA8; outline-offset: 2px; }
.fl-px-cherche { flex: 0 1 22rem; display: flex; align-items: center; gap: .55rem; padding: 0 1rem; min-height: 2.9rem; border-radius: 999px; background: #fff; border: 1px solid var(--filet-fort); }
.fl-px-cherche:focus-within { border-color: #001CA8; box-shadow: 0 0 0 3px rgba(0, 28, 168, .14); }
.fl-px-cherche svg { width: 1.1rem; height: 1.1rem; color: #001CA8; flex: none; }
.fl-px-cherche input { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: .98rem; color: #120D16; padding: .6rem 0; outline: none; box-shadow: none; appearance: none; }
.fl-px-vide { padding: 1.6rem; border: 1px dashed var(--filet-fort); border-radius: 1rem; text-align: center; color: rgba(18, 13, 22, .65); }

/* Cartes d'articles */
.fl-px-grille { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17.5rem), 1fr)); gap: 1.2rem; }
.fl-px-carte[hidden] { display: none; }
.fl-px-carte a { display: flex; flex-direction: column; height: 100%; border-radius: 1.15rem; overflow: hidden; background: #fff; border: 1px solid var(--filet); color: #120D16; text-decoration: none; transition: transform .3s cubic-bezier(.2, .7, .2, 1), box-shadow .3s, border-color .3s; }
.fl-px-carte a:hover, .fl-px-carte a:focus-visible { transform: translateY(-4px); box-shadow: 0 24px 44px -28px rgba(0, 28, 168, .5); border-color: rgba(0, 28, 168, .3); outline: none; }
.fl-px-carte-visuel { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #F5F5F5; }
.fl-px-carte-visuel img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.fl-px-carte a:hover .fl-px-carte-visuel img { transform: scale(1.05); }
.fl-px-carte-texte { display: grid; gap: .5rem; padding: 1rem 1.1rem 1.15rem; align-content: start; flex: 1; }
.fl-px-carte-titre { font: 800 1.05rem/1.28 var(--police-display); letter-spacing: -.012em; margin: 0; text-wrap: balance; }
.fl-px-carte-chapo { font-size: .9rem; line-height: 1.5; color: rgba(18, 13, 22, .72); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fl-px-carte-meta { margin-top: auto; padding-top: .35rem; font-size: .82rem; color: rgba(18, 13, 22, .55); }
.fl-px-plus { display: flex; justify-content: center; margin: 1.8rem 0 0; }
.fl-px-plus[hidden] { display: none; }

/* Article à la une */
.fl-px-une { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); border-radius: 1.5rem; overflow: hidden; background: #fff; border: 1px solid var(--filet); color: #120D16; text-decoration: none; box-shadow: 0 30px 60px -42px rgba(0, 28, 168, .45); margin-top: 2rem; transition: box-shadow .3s; }
.fl-px-une:hover, .fl-px-une:focus-visible { box-shadow: 0 34px 70px -34px rgba(0, 28, 168, .6); outline: none; }
.fl-px-une-visuel { position: relative; min-height: 20rem; overflow: hidden; background: #F5F5F5; }
.fl-px-une-visuel img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.fl-px-une:hover .fl-px-une-visuel img { transform: scale(1.035); }
.fl-px-une-texte { display: grid; gap: .8rem; align-content: center; padding: clamp(1.3rem, 3.4vw, 2.6rem); }
.fl-px-une-titre { font: 800 clamp(1.4rem, 2.6vw, 2.05rem)/1.14 var(--police-display); letter-spacing: -.022em; text-wrap: balance; }
.fl-px-lire { display: inline-flex; align-items: center; gap: .55rem; font: 700 .95rem var(--police-display); color: #001CA8; }

/* Documents */
.fl-px-docs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); gap: .7rem; }
.fl-px-docs-court { grid-template-columns: 1fr; gap: .5rem; }
.fl-px-doc[hidden] { display: none; }
.fl-px-doc a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "type lib fleche" "type groupe fleche"; column-gap: .85rem; align-items: center; padding: .75rem .95rem; border-radius: .95rem; background: #fff; border: 1px solid var(--filet); color: #120D16; text-decoration: none; transition: border-color .2s, box-shadow .2s, transform .2s; }
.fl-px-doc a:hover, .fl-px-doc a:focus-visible { border-color: #001CA8; box-shadow: 0 14px 28px -20px rgba(0, 28, 168, .55); transform: translateY(-1px); outline: none; }
.fl-px-doc-type { grid-area: type; display: grid; place-items: center; min-width: 2.7rem; height: 2.7rem; padding: 0 .35rem; border-radius: .7rem; background: rgba(0, 28, 168, .08); color: #001CA8; font: 800 .66rem var(--police-display); letter-spacing: .06em; }
.fl-px-doc-lib { grid-area: lib; font: 600 .93rem/1.35 var(--police-ui); overflow-wrap: anywhere; }
.fl-px-doc small { grid-area: groupe; font-size: .76rem; color: rgba(18, 13, 22, .55); }
.fl-px-doc-fleche { grid-area: fleche; color: #001CA8; }

/* Encarts (liens vers d'autres pages) */
.fl-px-encarts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 1rem; margin-top: 1.6rem; }
.fl-px-encart { display: grid; gap: .4rem; align-content: start; padding: 1.3rem 1.4rem; border-radius: 1.2rem; background: #F5F5F5; color: #120D16; text-decoration: none; border: 1px solid transparent; transition: border-color .2s, transform .2s; }
.v6-papier-2 .fl-px-encart { background: #fff; }
.fl-px-encart b { font: 800 1.12rem/1.25 var(--police-display); }
.fl-px-encart span:last-child { color: rgba(18, 13, 22, .7); font-size: .92rem; line-height: 1.5; }
.fl-px-encart:hover, .fl-px-encart:focus-visible { border-color: #001CA8; transform: translateY(-2px); outline: none; }

/* ═══ Tour ULM Jeunes ═══ */
.fl-px-intro-grille { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.fl-px-intro .fl-px-texte { margin-top: 1.6rem; }
.fl-px-equipages { margin-top: 1.4rem; padding: 1.1rem 1.25rem; border-radius: 1.1rem; background: #F5F5F5; }
.fl-px-equipages ul { list-style: none; margin: .6rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.fl-px-equipages li { padding: .45rem .85rem; border-radius: 999px; background: #fff; border: 1px solid var(--filet); font: 600 .88rem var(--police-ui); }
.fl-px-chiffres { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.fl-px-chiffres > div { display: grid; gap: .3rem; align-content: start; padding: 1.2rem 1.25rem; border-radius: 1.2rem; background: #fff; border: 1px solid var(--filet); }
.fl-px-chiffres b { font: 800 clamp(2.2rem, 4vw, 3.1rem)/1 var(--police-display); letter-spacing: -.04em; color: #001CA8; }
.fl-px-chiffres span { font-size: .9rem; line-height: 1.4; color: rgba(18, 13, 22, .72); }
.fl-px-chiffre-action { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "lib fleche" "titre fleche"; align-items: center; gap: .2rem 1rem; padding: 1.15rem 1.3rem; border-radius: 1.2rem; background: #001CA8; color: #fff; text-decoration: none; transition: background .2s; }
.fl-px-chiffre-action .fl-instru-lib { grid-area: lib; color: rgba(255, 255, 255, .75); margin: 0; }
.fl-px-chiffres .fl-px-chiffre-action b { grid-area: titre; font: 800 1.08rem/1.3 var(--police-display); letter-spacing: -.01em; color: #fff; }
.fl-px-chiffre-action svg { grid-area: fleche; }
.fl-px-chiffre-action:hover, .fl-px-chiffre-action:focus-visible { background: #191970; outline: none; }

.fl-px-sommaire { position: sticky; top: 4.4rem; z-index: 20; background: rgba(245, 245, 245, .93); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-block: 1px solid var(--filet); }
.fl-px-sommaire .v6-zone { display: flex; align-items: center; gap: 1rem; padding-block: .55rem; }
.fl-px-sommaire .fl-instru-lib { margin: 0; flex: none; }
.fl-px-sommaire ol { list-style: none; margin: 0; padding: .1rem; display: flex; gap: .35rem; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.fl-px-sommaire ol::-webkit-scrollbar { display: none; }
.fl-px-sommaire li { flex: none; scroll-snap-align: start; }
.fl-px-sommaire a { display: inline-flex; align-items: baseline; gap: .35rem; padding: .42rem .8rem; border-radius: 999px; font: 700 .9rem var(--police-display); color: #120D16; text-decoration: none; border: 1px solid transparent; transition: background .2s, color .2s; }
.fl-px-sommaire a small { font: 600 .7rem var(--police-ui); color: rgba(18, 13, 22, .5); }
.fl-px-sommaire a:hover, .fl-px-sommaire a:focus-visible { border-color: #001CA8; color: #001CA8; outline: none; }
.fl-px-sommaire a[aria-current="true"] { background: #001CA8; color: #fff; }
.fl-px-sommaire a[aria-current="true"] small { color: rgba(255, 255, 255, .75); }

.fl-px-edition { scroll-margin-top: 7.5rem; }
.fl-px-edition-alt { background: rgba(0, 28, 168, .035); }
.fl-px-ed-tete { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(1rem, 3vw, 2.6rem); align-items: end; }
.fl-px-annee { margin: 0; font: 900 clamp(4rem, 11vw, 9rem)/.82 var(--police-display); letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 2px #001CA8; opacity: .9; }
.fl-px-ed-titres { display: grid; gap: .55rem; padding-bottom: .3rem; min-width: 0; }
.fl-px-ed-sur { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0; }
.fl-px-ed-sur > span { padding: .25rem .65rem; border-radius: 999px; background: rgba(0, 28, 168, .08); font: 700 .72rem var(--police-ui); letter-spacing: .06em; text-transform: uppercase; color: #001CA8; }
.fl-px-ed-sur > .fl-px-statut-annule { background: rgba(243, 40, 55, .1); color: #950714; }
.fl-px-ed-sur > .fl-px-statut-pause { background: rgba(25, 25, 112, .1); color: #191970; }
.fl-px-ed-titre { margin: 0; }
.fl-px-ed-resume { margin: 0; max-width: 64ch; font-size: 1.08rem; line-height: 1.6; color: rgba(18, 13, 22, .8); }
.fl-px-ed-grille { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(1.4rem, 4vw, 3.5rem); align-items: start; margin-top: 2rem; }
.fl-px-ed-grille-seule { grid-template-columns: minmax(0, 1fr); }
.fl-px-ed-infos { display: grid; gap: 1.3rem; min-width: 0; }
.fl-px-faits { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: .6rem; margin: 0; }
.fl-px-faits div { padding: .85rem 1rem; border-radius: 1rem; background: #fff; border: 1px solid var(--filet); }
.fl-px-faits dt { font: 700 .68rem var(--police-ui); letter-spacing: .1em; text-transform: uppercase; color: rgba(18, 13, 22, .55); }
.fl-px-faits dd { margin: .25rem 0 0; font: 700 1rem/1.35 var(--police-display); color: #120D16; }
.fl-px-parcours ol { list-style: none; margin: .7rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem 0; }
.fl-px-parcours li { display: inline-flex; align-items: center; font: 600 .9rem var(--police-ui); }
.fl-px-parcours li span { padding: .35rem .7rem; border-radius: 999px; background: #fff; border: 1px solid var(--filet); white-space: nowrap; }
.fl-px-parcours li + li::before { content: ''; width: 1.1rem; height: 0; border-top: 2px dotted rgba(0, 28, 168, .55); }
.fl-px-parcours li.est-depart span, .fl-px-parcours li.est-arrivee span { background: #001CA8; border-color: #001CA8; color: #fff; }
.fl-px-temps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: .6rem; }
.fl-px-temps li { display: grid; gap: .25rem; padding: .9rem 1rem; border-radius: 1rem; background: #fff; border-left: 4px solid #001CA8; }
.fl-px-temps b { font: 800 .98rem var(--police-display); }
.fl-px-temps span { font-size: .9rem; line-height: 1.45; color: rgba(18, 13, 22, .72); }
.fl-px-citation { margin: 0; padding: 1.1rem 1.3rem; border-radius: 1.1rem; background: #191970; color: #fff; }
.fl-px-citation p { margin: 0; font: 600 1.12rem/1.5 var(--police-display); }
.fl-px-citation p::before { content: '« '; } .fl-px-citation p::after { content: ' »'; }
.fl-px-citation footer { margin-top: .6rem; font-size: .85rem; color: rgba(255, 255, 255, .75); }
.fl-px-ed-actions { display: grid; gap: .8rem; justify-items: start; }
.fl-px-ed-actions .fl-px-docs { width: 100%; }
.fl-px-affiche, .fl-px-carte-parcours { margin: 0; display: grid; gap: .5rem; justify-items: center; }
.fl-px-affiche button, .fl-px-carte-parcours button { all: unset; cursor: zoom-in; display: block; border-radius: 1.1rem; overflow: hidden; background: #fff; border: 1px solid var(--filet); box-shadow: 0 26px 50px -34px rgba(18, 13, 22, .55); max-width: 100%; }
.fl-px-affiche button:focus-visible, .fl-px-carte-parcours button:focus-visible { outline: 3px solid #001CA8; outline-offset: 3px; }
.fl-px-affiche img { display: block; max-height: 30rem; width: auto; max-width: 100%; }
.fl-px-carte-parcours img { display: block; width: 100%; max-height: 28rem; object-fit: contain; background: #fff; }
.fl-px-carte-parcours figcaption { font-size: .82rem; color: rgba(18, 13, 22, .58); }
.fl-px-frise-bloc { margin-top: 2.2rem; }
.fl-px-frise { list-style: none; margin: .8rem 0 0; padding: 0; counter-reset: jour; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); gap: 1rem; }
.fl-px-jour a { position: relative; display: flex; flex-direction: column; height: 100%; border-radius: 1.05rem; overflow: hidden; background: #fff; border: 1px solid var(--filet); color: #120D16; text-decoration: none; transition: transform .3s cubic-bezier(.2, .7, .2, 1), box-shadow .3s, border-color .3s; }
.fl-px-jour a:hover, .fl-px-jour a:focus-visible { transform: translateY(-3px); box-shadow: 0 22px 40px -26px rgba(0, 28, 168, .5); border-color: rgba(0, 28, 168, .3); outline: none; }
.fl-px-jour-visuel { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #F5F5F5; }
.fl-px-jour-visuel img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.fl-px-jour a:hover .fl-px-jour-visuel img { transform: scale(1.05); }
.fl-px-nb { position: absolute; right: .6rem; bottom: .6rem; padding: .2rem .55rem; border-radius: 999px; background: rgba(18, 13, 22, .72); color: #fff; font: 700 .72rem var(--police-ui); }
.fl-px-jour-texte { display: grid; gap: .35rem; padding: .85rem .95rem 1rem; align-content: start; }
.fl-px-jour-quand { font: 700 .7rem var(--police-ui); letter-spacing: .08em; text-transform: uppercase; color: #001CA8; }
.fl-px-jour-texte b { font: 800 1rem/1.3 var(--police-display); text-wrap: balance; }
.fl-px-jour-texte > span:last-child { font-size: .86rem; line-height: 1.45; color: rgba(18, 13, 22, .7); }
.fl-px-medias { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; margin-top: 2.2rem; }
.fl-px-medias:has(.fl-px-video):has(.fl-px-galerie) { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); align-items: start; }
.fl-px-galerie { list-style: none; margin: 0; padding: .2rem .1rem .7rem; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(11rem, 14rem); grid-template-rows: repeat(2, auto); gap: .55rem; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; }
.fl-px-galerie li { scroll-snap-align: start; }
.fl-px-galerie button { all: unset; cursor: zoom-in; display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: .8rem; overflow: hidden; background: #F5F5F5; }
.fl-px-galerie button:focus-visible { outline: 3px solid #001CA8; outline-offset: 2px; }
.fl-px-galerie img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.fl-px-galerie button:hover img { transform: scale(1.06); }
.fl-px-video { margin: 0; display: grid; gap: .5rem; }
.fl-px-video .fl-integration { margin: 0; }
.fl-px-video figcaption { font: 600 .9rem var(--police-ui); color: rgba(18, 13, 22, .7); }
.fl-px-ed-pied { display: flex; flex-wrap: wrap; gap: .8rem 1.6rem; align-items: center; margin: 2rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--filet); }
.fl-px-haut { color: rgba(18, 13, 22, .65); font-size: .9rem; }

.fl-px-recits { scroll-margin-top: 7rem; }
.fl-px-recits-article { max-width: 60rem; margin-top: 1.6rem; }
.fl-px-recit { margin: 0 0 .7rem; border-radius: 1.1rem; background: #fff; border: 1px solid var(--filet); scroll-margin-top: 7.5rem; }
.fl-px-recit > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 1rem 1.2rem; font: 700 1.02rem var(--police-display); }
.fl-px-recit > summary::-webkit-details-marker { display: none; }
.fl-px-recit > summary::after { content: '+'; grid-column: 3; grid-row: 1; width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: #F5F5F5; color: #001CA8; font: 700 1.2rem var(--police-ui); }
.fl-px-recit[open] > summary::after { content: '–'; background: #001CA8; color: #fff; }
.fl-px-recit > summary small { grid-column: 2; grid-row: 2; font: 500 .8rem var(--police-ui); color: rgba(18, 13, 22, .55); margin-top: -.6rem; }
.fl-px-recit-annee { grid-row: 1 / span 2; display: grid; place-items: center; width: 3.6rem; height: 3.6rem; border-radius: .9rem; background: rgba(0, 28, 168, .08); color: #001CA8; font: 800 1.05rem var(--police-display); }
.fl-px-recit > summary:focus-visible { outline: 3px solid #001CA8; outline-offset: -3px; border-radius: 1.1rem; }
.fl-px-recit-corps { padding: .4rem 1.4rem 1.6rem; border-top: 1px solid var(--filet); overflow-wrap: anywhere; }
.fl-px-recit-corps img { max-width: 100%; height: auto; border-radius: .6rem; }
.fl-px-recit-corps iframe { max-width: 100%; }

dialog.fl-px-visionneuse { width: min(72rem, calc(100vw - 1.5rem)); max-height: calc(100dvh - 1.5rem); padding: 0; border: 0; border-radius: 1.2rem; background: #120D16; color: #fff; box-shadow: 0 40px 90px -30px rgba(18, 13, 22, .7); overflow: hidden; }
dialog.fl-px-visionneuse::backdrop { background: rgba(18, 13, 22, .78); backdrop-filter: blur(3px); }
.fl-px-vis-tete { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .7rem .9rem .7rem 1.2rem; }
.fl-px-vis-tete p { margin: 0; font: 600 .92rem var(--police-ui); color: rgba(255, 255, 255, .85); }
.fl-px-vis-fermer, .fl-px-vis-fleche { all: unset; cursor: pointer; width: 2.5rem; height: 2.5rem; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .12); color: #fff; font: 400 1.6rem/1 var(--police-ui); flex: none; }
.fl-px-vis-fermer:hover, .fl-px-vis-fleche:hover, .fl-px-vis-fermer:focus-visible, .fl-px-vis-fleche:focus-visible { background: #001CA8; }
.fl-px-vis-scene { position: relative; display: grid; place-items: center; padding: 0 3.6rem 1.2rem; }
.fl-px-vis-scene img { max-width: 100%; max-height: calc(100dvh - 7rem); object-fit: contain; border-radius: .5rem; }
.fl-px-vis-fleche { position: absolute; top: calc(50% - 1.85rem); }
.fl-px-vis-fleche[data-px-vis="-1"] { left: .6rem; } .fl-px-vis-fleche[data-px-vis="1"] { right: .6rem; }

/* ═══ Encadrer ═══ */
.fl-px-publics { margin: 1.8rem 0 1.4rem; }
.fl-px-offres-grille { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1rem; }
.fl-px-offre { display: flex; flex-direction: column; gap: .6rem; padding: 1.3rem 1.35rem 1.4rem; border-radius: 1.25rem; background: #fff; border: 1px solid var(--filet); transition: border-color .25s, box-shadow .25s, opacity .25s; }
.fl-px-offre[hidden] { display: none; }
.fl-px-offre:hover { border-color: rgba(0, 28, 168, .3); box-shadow: 0 22px 44px -32px rgba(0, 28, 168, .5); }
.fl-px-offre-tete { display: flex; justify-content: space-between; align-items: center; gap: .6rem; }
.fl-px-offre[data-public="structures"] .fl-px-etiquette { color: #191970; }
.fl-px-pic { width: 2.6rem; height: 2.6rem; padding: .55rem; box-sizing: border-box; border-radius: .85rem; background: rgba(0, 28, 168, .08); color: #001CA8; flex: none; }
.fl-px-offre h3 { margin: .2rem 0 0; font: 800 1.15rem/1.25 var(--police-display); letter-spacing: -.012em; }
.fl-px-offre p { margin: 0; font-size: .94rem; line-height: 1.55; color: rgba(18, 13, 22, .76); }
.fl-px-offre .fl-px-offre-liens { margin-top: auto; padding-top: .5rem; display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; font-size: .92rem; }
.fl-px-offre-liens { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin: .8rem 0 0; }

.fl-px-devenir-grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(1.6rem, 5vw, 4.5rem); align-items: center; }
.fl-px-devenir-photo { margin: 0; aspect-ratio: 4 / 5; border-radius: 1.6rem; overflow: hidden; background: #F5F5F5; box-shadow: 0 40px 70px -46px rgba(18, 13, 22, .6); }
.fl-px-devenir-photo img { width: 100%; height: 100%; object-fit: cover; }
.fl-px-etapes { list-style: none; counter-reset: px; margin: 1.6rem 0 0; padding: 0; display: grid; gap: 0; }
.fl-px-etapes li { counter-increment: px; position: relative; display: grid; gap: .15rem; padding: 0 0 1.1rem 3.1rem; }
.fl-px-etapes li::before { content: counter(px); position: absolute; left: 0; top: -.15rem; width: 2.1rem; height: 2.1rem; border-radius: 50%; display: grid; place-items: center; background: #001CA8; color: #fff; font: 800 .88rem var(--police-display); z-index: 1; }
.fl-px-etapes li:not(:last-child)::after { content: ''; position: absolute; left: 1.03rem; top: 1.9rem; bottom: 0; border-left: 2px dotted rgba(0, 28, 168, .45); }
.fl-px-etapes li:last-child::before { content: '↻'; background: #191970; }
.fl-px-etapes b { font: 800 1rem var(--police-display); }
.fl-px-etapes span { font-size: .92rem; line-height: 1.5; color: rgba(18, 13, 22, .72); }

.fl-px-aides-grille { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1rem; }
.fl-px-aides-grille li { display: grid; gap: .4rem; align-content: start; padding: 1.3rem 1.35rem; border-radius: 1.2rem; background: rgba(245, 245, 245, .06); border: 1px solid rgba(245, 245, 245, .16); }
.fl-px-montant { font: 800 clamp(1.7rem, 3vw, 2.3rem)/1 var(--police-display); letter-spacing: -.03em; color: #fff; }
.fl-px-aide-lib { font: 700 .74rem var(--police-ui); letter-spacing: .1em; text-transform: uppercase; color: rgba(245, 245, 245, .75); }
.fl-px-aide-texte { font-size: .92rem; line-height: 1.5; color: rgba(245, 245, 245, .85); }
.fl-px-aides-grille a { margin-top: .3rem; color: #fff; font-weight: 700; font-size: .9rem; text-underline-offset: 3px; }
.fl-px-aides-bas { margin: 1.8rem 0 0; }

.fl-px-annuaire-grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.6rem, 5vw, 4rem); align-items: start; }
.fl-px-annuaire-carte { position: relative; display: grid; gap: 1rem; padding: clamp(1.3rem, 3vw, 2rem); border-radius: 1.5rem; background: #fff; border: 1px solid var(--filet); box-shadow: 0 30px 60px -44px rgba(0, 28, 168, .5); }
.fl-px-annuaire-carte > .fl-px-pic { width: 3rem; height: 3rem; }
.fl-px-mini label { display: grid; gap: .45rem; }
.fl-px-mini select { font: 600 1rem var(--police-ui); color: #120D16; background: #F5F5F5; border: 1px solid var(--filet-fort); border-radius: .9rem; padding: .8rem 2.4rem .8rem 1rem; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23001CA8' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .8rem center; background-size: 1.1rem; width: 100%; }
.fl-px-mini .fl-px-boutons { margin-top: 1rem; }
.fl-px-documents .fl-px-filtres { margin-top: 1.8rem; }

.fl-px-plan .fl-rubrique-plan { margin-top: 1.4rem; }

/* ═══ L’ULM ? ═══ */
.fl-px-classes-grille { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); gap: 1.2rem; }
.fl-px-classe { display: flex; flex-direction: column; border-radius: 1.4rem; overflow: hidden; background: #fff; border: 1px solid var(--filet); scroll-margin-top: 6rem; transition: box-shadow .3s, border-color .3s; }
.fl-px-classe:hover { box-shadow: 0 28px 52px -36px rgba(0, 28, 168, .55); border-color: rgba(0, 28, 168, .25); }
.fl-px-classe-visuel { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #191970; }
.fl-px-classe-visuel > img:first-child { width: 100%; height: 100%; object-fit: cover; }
.fl-px-classe-num { position: absolute; left: 1rem; bottom: .7rem; font: 900 4.2rem/1 var(--police-display); color: #fff; letter-spacing: -.05em; text-shadow: 0 6px 24px rgba(18, 13, 22, .45); }
.fl-px-classe-dessin { position: absolute; right: .8rem; top: .8rem; width: 4.4rem; height: 4.4rem; object-fit: contain; padding: .4rem; border-radius: 1rem; background: rgba(255, 255, 255, .92); }
.fl-px-classe-texte { display: flex; flex-direction: column; gap: .65rem; padding: 1.1rem 1.25rem 1.3rem; flex: 1; }
.fl-px-classe-texte h3 { margin: 0; font: 800 1.35rem/1.15 var(--police-display); letter-spacing: -.02em; }
.fl-px-classe-def { margin: 0; font-size: .95rem; line-height: 1.55; color: rgba(18, 13, 22, .78); }
.fl-px-classe-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); gap: .45rem; margin: .2rem 0 0; }
.fl-px-classe-chiffres div { padding: .6rem .75rem; border-radius: .8rem; background: #F5F5F5; }
.fl-px-classe-chiffres dt { font: 700 .64rem var(--police-ui); letter-spacing: .09em; text-transform: uppercase; color: rgba(18, 13, 22, .55); }
.fl-px-classe-chiffres dd { margin: .2rem 0 0; font: 800 .95rem/1.25 var(--police-display); color: #001CA8; }
.fl-px-classe-conditions { border-top: 1px solid var(--filet); padding-top: .55rem; }
.fl-px-classe-conditions summary { cursor: pointer; font: 700 .9rem var(--police-ui); color: #120D16; padding: .2rem 0; }
.fl-px-classe-conditions summary::marker { color: #001CA8; }
.fl-px-classe-conditions ul { margin: .5rem 0 0; padding-left: 1.1rem; display: grid; gap: .45rem; font-size: .88rem; line-height: 1.5; color: rgba(18, 13, 22, .78); }
.fl-px-classe-conditions li::marker { color: #001CA8; }
.fl-px-classe .fl-px-offre-liens { margin-top: auto; padding-top: .3rem; }
.fl-px-commun-grille { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(1.6rem, 5vw, 4rem); align-items: center; }
.fl-px-choisir { padding: clamp(1.4rem, 3vw, 2.2rem); border-radius: 1.5rem; background: #001CA8; color: #fff; }
.fl-px-choisir .fl-instru-lib { color: rgba(255, 255, 255, .75); margin: 0; }
.fl-px-choisir-texte { font: 600 clamp(1.15rem, 1.8vw, 1.4rem)/1.45 var(--police-display); margin: .8rem 0 0; }

/* ═══ Formation ═══ */
.fl-px-etapier { margin-top: 2rem; border-radius: 1.5rem; background: #fff; border: 1px solid var(--filet); overflow: hidden; }
.fl-px-etapier-liste { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--filet); }
.fl-px-etapier-liste button { all: unset; box-sizing: border-box; cursor: pointer; display: flex; gap: .75rem; align-items: center; padding: 1.1rem 1.2rem 1.25rem; color: rgba(18, 13, 22, .62); transition: background .2s, color .2s; }
.fl-px-etapier-liste button + button { border-left: 1px solid var(--filet); }
.fl-px-etapier-liste button b { display: block; font: 800 1rem var(--police-display); color: #120D16; }
.fl-px-etapier-liste button small { display: block; font-size: .78rem; line-height: 1.35; margin-top: .15rem; }
.fl-px-etapier-num { flex: none; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 2px solid rgba(0, 28, 168, .25); font: 800 .82rem var(--police-display); color: #001CA8; transition: background .2s, color .2s, border-color .2s; }
.fl-px-etapier-liste button[aria-selected="true"] { background: rgba(0, 28, 168, .05); color: rgba(18, 13, 22, .8); }
.fl-px-etapier-liste button[aria-selected="true"] .fl-px-etapier-num, .fl-px-etapier-liste button.est-passe .fl-px-etapier-num { background: #001CA8; border-color: #001CA8; color: #fff; }
.fl-px-etapier-liste button:focus-visible { outline: 3px solid #001CA8; outline-offset: -3px; }
.fl-px-etapier-trace { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: transparent; }
.fl-px-etapier-trace i { display: block; height: 100%; width: 25%; background: #001CA8; transition: width .45s cubic-bezier(.2, .7, .2, 1); }
.fl-px-etapier-panneau { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(1.2rem, 4vw, 3rem); padding: clamp(1.3rem, 3vw, 2.2rem); }
.fl-px-etapier-panneau[hidden] { display: none; }
.fl-px-etapier-panneau h3 { margin: .5rem 0 .8rem; }
.fl-px-etapier-panneau p { line-height: 1.65; color: rgba(18, 13, 22, .8); margin: 0 0 .8rem; }
.fl-px-etapier-cote { padding: 1.1rem 1.2rem; border-radius: 1.1rem; background: #F5F5F5; align-self: start; }
.fl-px-etapier-cote .fl-px-coches { margin-top: 0; }
.fl-px-apres { margin-top: 1.4rem; padding: 1.2rem 1.4rem; border-radius: 1.2rem; background: #191970; color: #fff; display: grid; gap: .5rem; }
.fl-px-apres .fl-instru-lib { color: rgba(255, 255, 255, .7); margin: 0; }
.fl-px-apres p { margin: 0; line-height: 1.6; max-width: 75ch; }
.fl-px-apres .v6-lien { color: #fff; }
.fl-px-titre-fav { margin: .6rem 0 1.6rem; }
.fl-px-fav-grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 19rem); gap: clamp(1.4rem, 4vw, 3rem); align-items: start; }
.fl-px-fav-docs { display: grid; gap: .6rem; padding: 1.1rem; border-radius: 1.2rem; background: #F5F5F5; position: sticky; top: 6.5rem; }
.v6-papier-2 .fl-px-fav-docs { background: #fff; }
.fl-px-fav-docs .fl-instru-lib { margin: 0; }
.fl-px-pole .fl-px-fav-grille { margin-top: 1.6rem; }
.fl-px-fav .fl-px-fav-grille { grid-template-columns: minmax(0, 1fr) minmax(0, 15.5rem); }
.fl-px-classe-chiffres dd { white-space: nowrap; }
.fl-px-mini { display: grid; gap: .2rem; }
.fl-px-mini .fl-instru-lib { margin: 0; }

/* ═══ Vie des clubs ═══ */
.fl-px-appel-grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: 1rem; margin-top: 1.8rem; }
.fl-px-appel-carte { display: grid; gap: .55rem; align-content: start; padding: 1.5rem 1.5rem 1.6rem; border-radius: 1.4rem; background: #F5F5F5; color: #120D16; text-decoration: none; border: 1px solid transparent; transition: transform .25s, border-color .25s, box-shadow .25s; }
.fl-px-appel-carte b { font: 800 1.3rem/1.2 var(--police-display); letter-spacing: -.015em; }
.fl-px-appel-carte > span:not(.fl-instru-lib):not(.fl-px-lire) { font-size: .95rem; line-height: 1.55; color: rgba(18, 13, 22, .74); }
.fl-px-appel-carte .fl-px-lire { margin-top: .4rem; }
.fl-px-appel-carte:hover, .fl-px-appel-carte:focus-visible { transform: translateY(-3px); border-color: #001CA8; box-shadow: 0 24px 46px -32px rgba(0, 28, 168, .55); outline: none; }
.fl-px-appel-bleu { background: #001CA8; color: #fff; }
.fl-px-appel-bleu .fl-instru-lib, .fl-px-appel-bleu > span:not(.fl-instru-lib):not(.fl-px-lire) { color: rgba(255, 255, 255, .82); }
.fl-px-appel-bleu .fl-px-lire { color: #fff; }
.fl-px-appel-bleu:hover, .fl-px-appel-bleu:focus-visible { border-color: #191970; background: #191970; }

/* ── Tablette et téléphone ── */
@media (max-width: 1000px) {
  .fl-px-intro-grille, .fl-px-ed-grille, .fl-px-devenir-grille, .fl-px-annuaire-grille, .fl-px-commun-grille, .fl-px-fav-grille, .fl-px-fav .fl-px-fav-grille, .fl-px-une, .fl-px-medias:has(.fl-px-video):has(.fl-px-galerie) { grid-template-columns: minmax(0, 1fr); }
  .fl-px-une-visuel { min-height: 0; aspect-ratio: 16 / 10; }
  .fl-px-devenir-photo { aspect-ratio: 16 / 10; }
  .fl-px-fav-docs { position: static; }
  /* Téléphone (demande d'Alexis du 11/10/2026) : plus de barre qui défile de côté sans qu'on le sache — les choix passent à la ligne. */
  .fl-px-etapier-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fl-px-etapier-liste button { min-width: 0; padding: .85rem .8rem .95rem; gap: .55rem; border-top: 1px solid var(--filet); }
  .fl-px-etapier-liste button:nth-child(-n+2) { border-top: 0; }
  .fl-px-etapier-liste button + button { border-left: 0; }
  .fl-px-etapier-liste button:nth-child(even) { border-left: 1px solid var(--filet); }
  .fl-px-etapier-trace { display: none; }
  .fl-px-etapier-panneau { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .fl-px-chiffres { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .fl-px-chiffres > div { padding: 1rem; }
  .fl-px-ed-tete { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
  .fl-px-annee { font-size: 4.6rem; }
  .fl-px-sommaire { top: 4rem; }
  .fl-px-sommaire .fl-instru-lib { display: none; }
  .fl-px-frise { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: .8rem; padding-bottom: .6rem; margin-inline: calc(-1 * clamp(1.25rem, 4vw, 3.5rem)); padding-inline: clamp(1.25rem, 4vw, 3.5rem); scroll-padding-inline: clamp(1.25rem, 4vw, 3.5rem); }
  .fl-px-frise > li { flex: 0 0 78%; scroll-snap-align: start; }
  .fl-px-galerie { grid-auto-columns: 9.5rem; }
  .fl-px-parcours li span { white-space: normal; }
  .fl-px-recit > summary { grid-template-columns: auto minmax(0, 1fr) auto; padding: .85rem .9rem; gap: .7rem; font-size: .95rem; }
  .fl-px-recit-annee { width: 3rem; height: 3rem; font-size: .92rem; }
  .fl-px-recit-corps { padding: .3rem 1rem 1.3rem; }
  .fl-px-vis-scene { padding: 0 .6rem 3.6rem; }
  .fl-px-vis-fleche { top: auto; bottom: .6rem; }
  .fl-px-doc a { padding: .7rem .8rem; }
  .fl-px-filtres { align-items: stretch; }
  .fl-px-segments { border-radius: 1.2rem; }
  .fl-px-cherche { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) { .fl-px-carte a, .fl-px-jour a, .fl-px-carte-visuel img, .fl-px-jour-visuel img, .fl-px-une-visuel img, .fl-px-etapier-trace i { transition: none; } }

/* Téléphone (11/10/2026) : ce sommaire défile de côté (une ligne, pour rester discret) ; un fondu à droite montre qu'il
   y a d'autres rubriques. */
@media (max-width: 760px) {
  .fl-px-sommaire ol { padding-right: 2.2rem; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 2.6rem), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 2.6rem), transparent); }
}