/* PROMPT 10 : pages /indice-acip/ (matrice CFC x cantons). Memes jetons que le hub /outils/ (outils.css). Prefixe .cfx- */
.cfx {
  --cfx-bg: #F8FAFC; --cfx-card: #FFFFFF; --cfx-bord: #E2E8F0; --cfx-txt: #1E293B; --cfx-sec: #475569; --cfx-mut: #64748B;
  --cfx-bleu: #2563EB; --cfx-bleu-f: #1D4ED8; --cfx-bleu-s: #EFF6FF; --cfx-ok: #047857; --cfx-ko: #B91C1C; --cfx-r: 16px;
  --cfx-ombre: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px -12px rgba(15,23,42,.10);
  background: var(--cfx-bg); color: var(--cfx-txt); padding: 16px 16px 56px; line-height: 1.6; font-size: 16px;
}
.cfx > * { max-width: 1120px; margin-left: auto; margin-right: auto; }
.cfx *, .cfx *::before, .cfx *::after { box-sizing: border-box; }
.cfx a { color: var(--cfx-bleu-f); }
.cfx a:hover { color: var(--cfx-bleu); }

.cfx-fil ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 8px; margin: 8px auto 16px; padding: 0; font-size: 14px; color: var(--cfx-mut); }
.cfx-fil li + li::before { content: "›"; margin-right: 8px; color: var(--cfx-mut); }
.cfx-fil a { color: var(--cfx-sec); text-decoration: none; }
.cfx-fil a:hover { text-decoration: underline; }

.cfx-hero { background: var(--cfx-card); border: 1px solid var(--cfx-bord); border-radius: var(--cfx-r); box-shadow: var(--cfx-ombre); padding: 24px 20px; margin-bottom: 20px; }
.cfx-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.cfx-badge { display: inline-block; background: var(--cfx-bleu-s); color: var(--cfx-bleu-f); border: 1px solid #BFDBFE; border-radius: 999px; padding: 2px 12px; font-size: 13px; font-weight: 600; }
.cfx-badge-n { background: #F1F5F9; color: var(--cfx-sec); border-color: var(--cfx-bord); }
.cfx-h1 { font-size: clamp(1.45rem, 3.4vw, 2.1rem); line-height: 1.25; margin: 0 0 14px; font-weight: 800; letter-spacing: -.01em; }
.cfx-h2 { font-size: clamp(1.2rem, 2.4vw, 1.5rem); line-height: 1.3; margin: 0 0 12px; font-weight: 750; }
.cfx-h3 { font-size: 1.05rem; margin: 18px 0 8px; font-weight: 700; }
.cfx-intro { color: var(--cfx-sec); margin: 0 0 12px; max-width: 78ch; }

.cfx-kpis { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 18px 0 0; padding: 0; }
.cfx-kpi { background: #F8FAFC; border: 1px solid var(--cfx-bord); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.cfx-kpi-pri { background: var(--cfx-bleu-s); border-color: #BFDBFE; }
.cfx-kpi-l { font-size: 12.5px; color: var(--cfx-mut); line-height: 1.3; }
.cfx-kpi strong { font-size: 1.5rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.cfx-kpi-u { font-size: 12.5px; color: var(--cfx-mut); }

.cfx-carte { background: var(--cfx-card); border: 1px solid var(--cfx-bord); border-radius: var(--cfx-r); box-shadow: var(--cfx-ombre); padding: 22px 20px; margin-bottom: 20px; }
.cfx-aide, .cfx-note { color: var(--cfx-mut); font-size: 14px; margin: 0 0 12px; max-width: 90ch; }
.cfx-note { margin: 12px 0 0; }

.cfx-tablewrap { overflow-x: auto; border: 1px solid var(--cfx-bord); border-radius: 12px; -webkit-overflow-scrolling: touch; }
.cfx-tablewrap:focus-visible { outline: 3px solid var(--cfx-bleu); outline-offset: 2px; }
.cfx-table { border-collapse: collapse; width: 100%; min-width: 760px; font-size: 14.5px; }
.cfx-table th, .cfx-table td { padding: 9px 12px; border-bottom: 1px solid var(--cfx-bord); text-align: left; vertical-align: top; }
.cfx-table thead th { background: #F1F5F9; font-weight: 700; font-size: 13px; white-space: nowrap; position: sticky; top: 0; }
.cfx-table tbody th { font-weight: 600; min-width: 260px; }
.cfx-table tbody tr:hover { background: #F8FAFC; }
.cfx-num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cfx-moy { background: var(--cfx-bleu-s); font-weight: 700; }
.cfx-table tfoot th, .cfx-table tfoot td { background: #F1F5F9; font-weight: 700; border-bottom: 0; }
.cfx-poste { display: block; }
.cfx-code { display: block; font-weight: 400; color: var(--cfx-mut); font-size: 12.5px; line-height: 1.4; margin-top: 2px; }
.cfx-qte { width: 96px; padding: 6px 8px; border: 1px solid #CBD5E1; border-radius: 8px; font: inherit; text-align: right; }
.cfx-qte:focus-visible { outline: 3px solid var(--cfx-bleu); outline-offset: 1px; }
.cfx-matrice { min-width: 900px; }
.cfx-matrice td a { font-variant-numeric: tabular-nums; }
.cfx-lien-btn { background: none; border: 0; color: var(--cfx-bleu-f); text-decoration: underline; cursor: pointer; font: inherit; padding: 4px; }

.cfx-cols { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 880px) { .cfx-cols { grid-template-columns: 5fr 7fr; } }
.cfx-dl { margin: 0; display: grid; gap: 10px; }
.cfx-dl > div { background: #F8FAFC; border: 1px solid var(--cfx-bord); border-radius: 12px; padding: 10px 14px; }
.cfx-dl dt { font-size: 13px; color: var(--cfx-mut); }
.cfx-dl dd { margin: 2px 0 0; font-weight: 700; font-size: 1.05rem; }
.cfx-notes { margin: 0; padding-left: 20px; color: var(--cfx-sec); }
.cfx-notes li { margin-bottom: 8px; }

.cfx-form { display: grid; gap: 12px; max-width: 640px; }
.cfx-champs { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 640px) { .cfx-champs { grid-template-columns: 1fr 1fr; } }
.cfx-form label { display: grid; gap: 4px; font-weight: 600; font-size: 14px; }
.cfx-form input[type="email"], .cfx-form input[type="text"] { padding: 10px 12px; border: 1px solid #CBD5E1; border-radius: 10px; font: inherit; font-weight: 400; }
.cfx-form input:focus-visible { outline: 3px solid var(--cfx-bleu); outline-offset: 1px; }
.cfx-case { display: flex !important; gap: 10px; align-items: flex-start; font-weight: 400 !important; color: var(--cfx-sec); }
.cfx-case input { margin-top: 5px; width: 18px; height: 18px; flex: none; }
.cfx-piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cfx-btn { display: inline-block; background: var(--cfx-bleu); color: #fff !important; border: 0; border-radius: 10px; padding: 11px 20px; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; text-align: center; }
.cfx-btn:hover { background: var(--cfx-bleu-f); }
.cfx-btn[disabled] { opacity: .6; cursor: wait; }
.cfx-retour { min-height: 1.4em; margin: 0; font-size: 14.5px; }
.cfx-retour a { display: block; font-weight: 700; margin-top: 4px; }
.cfx-ok { color: var(--cfx-ok); }
.cfx-ko { color: var(--cfx-ko); }

.cfx-faq { border: 1px solid var(--cfx-bord); border-radius: 12px; margin-bottom: 10px; background: #fff; }
.cfx-faq summary { cursor: pointer; padding: 12px 16px; font-weight: 650; list-style-position: inside; }
.cfx-faq summary:focus-visible { outline: 3px solid var(--cfx-bleu); outline-offset: 2px; border-radius: 12px; }
.cfx-faq p { margin: 0; padding: 0 16px 14px; color: var(--cfx-sec); }

.cfx-liens { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px 14px; }
.cfx-liens a { display: block; padding: 6px 0; }
.cfx-liens-outils { grid-template-columns: 1fr; }
.cfx-cta { margin-top: 20px; background: var(--cfx-bleu-s); border: 1px solid #BFDBFE; border-radius: 14px; padding: 16px 18px; display: grid; gap: 8px; justify-items: start; }
.cfx-cta span { color: var(--cfx-sec); }

@media (max-width: 520px) {
  .cfx { padding: 12px 16px 40px; }
  .cfx-hero, .cfx-carte { padding: 18px 14px; }
}
@media print {
  .cfx-fiche, .cfx-cta, .cfx-qte { display: none; }
  .cfx { background: #fff; }
}

/* ===== ANNUAIRE (index /indice-acip/) : recherche, pastilles, 147 liens par corps d'etat, 21 fiches PDF ===== */
.cfx [hidden] { display: none !important; }
.cfx-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.cfx-sauts { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 10px; margin: 16px 0 0; padding: 0; }
.cfx-sauts a { display: inline-block; padding: 7px 14px; border: 1px solid #BFDBFE; border-radius: 999px; background: var(--cfx-bleu-s); font-size: 14px; font-weight: 600; text-decoration: none; }
.cfx-sauts a:hover { background: #DBEAFE; }
.cfx-tag { display: inline-block; padding: 1px 9px; border-radius: 999px; background: var(--cfx-bleu-s); border: 1px solid #BFDBFE; color: var(--cfx-bleu-f); font-size: 12.5px; font-weight: 700; white-space: nowrap; }

.cfx-filtres { position: relative; }
.cfx-rech { position: relative; max-width: 720px; }
.cfx-rech-ic { position: absolute; left: 14px; top: 14px; width: 20px; height: 20px; fill: none; stroke: var(--cfx-mut); stroke-width: 2; stroke-linecap: round; pointer-events: none; }
.cfx-q { width: 100%; height: 48px; padding: 0 44px 0 44px; border: 1px solid #CBD5E1; border-radius: 12px; background: #fff; color: var(--cfx-txt); font: inherit; font-size: 16px; -webkit-appearance: none; appearance: none; }
.cfx-q::placeholder { color: #7B8798; }
.cfx-q:focus { outline: none; border-color: var(--cfx-bleu); box-shadow: 0 0 0 3px rgba(37,99,235,.18); }
.cfx-q::-webkit-search-cancel-button { display: none; }
.cfx-q-x { position: absolute; right: 6px; top: 6px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.cfx-q-x:hover { background: #F1F5F9; }
.cfx-q-x svg { width: 18px; height: 18px; fill: none; stroke: var(--cfx-sec); stroke-width: 2; stroke-linecap: round; }
.cfx-groupe { margin-top: 14px; }
.cfx-l { margin: 0 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--cfx-mut); }
.cfx-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.cfx-pill { min-height: 40px; padding: 7px 14px; border: 1px solid #CBD5E1; border-radius: 999px; background: #fff; color: var(--cfx-txt); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; line-height: 1.2; }
.cfx-pill:hover { border-color: var(--cfx-bleu); background: var(--cfx-bleu-s); }
.cfx-pill[aria-pressed="true"] { background: var(--cfx-bleu-f); border-color: var(--cfx-bleu-f); color: #fff; }
.cfx-pill:focus-visible, .cfx-plus:focus-visible, .cfx-chip:focus-visible, .cfx-sauts a:focus-visible { outline: 3px solid var(--cfx-bleu); outline-offset: 2px; }
.cfx-legende { margin: 8px 0 0; font-size: 13px; color: var(--cfx-mut); }
.cfx-pills-chap.cfx-ferme { max-height: 92px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }
.cfx-plus { margin-top: 8px; padding: 6px 2px; border: 0; background: none; color: var(--cfx-bleu-f); font: inherit; font-size: 14px; font-weight: 600; text-decoration: underline; cursor: pointer; }
@media (min-width: 900px) {
  .cfx-pills-chap.cfx-ferme { max-height: none; overflow: visible; -webkit-mask-image: none; mask-image: none; }
  .cfx-plus { display: none; }
}
.cfx-etat { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--cfx-bord); }
.cfx-compte { margin: 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.cfx-vide { margin-bottom: 20px; padding: 22px 20px; border: 1px dashed #94A3B8; border-radius: var(--cfx-r); background: #fff; }
.cfx-vide p { margin: 0 0 10px; max-width: 70ch; color: var(--cfx-sec); }
.cfx-vide strong { color: var(--cfx-txt); }

.cfx-chaps { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.cfx-chap { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 12px 14px; border: 1px solid var(--cfx-bord); border-radius: 12px; background: #fff; scroll-margin-top: 90px; }
.cfx-chap:target, .cfx-fc:target { border-color: var(--cfx-bleu); box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
.cfx-chap-nom { margin: 0; font-size: 1.05rem; line-height: 1.3; font-weight: 700; }
.cfx-chips { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 6px; }
.cfx-chip { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 44px; padding: 8px 9px; border: 1px solid #CBD5E1; border-radius: 10px; background: #F8FAFC; color: var(--cfx-txt) !important; text-decoration: none; font-variant-numeric: tabular-nums; }
.cfx-chip b { color: var(--cfx-bleu-f); font-size: 14px; }
.cfx-chip span { font-size: 14.5px; }
.cfx-chip:hover { border-color: var(--cfx-bleu); background: var(--cfx-bleu-s); }
@media (min-width: 900px) {
  .cfx-chap { grid-template-columns: minmax(250px, 1fr) minmax(0, 2fr); align-items: center; }
  .cfx-chips { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
  .cfx-chip { flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; padding: 6px 10px; }
}

.cfx-fiches { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; align-items: start; }
.cfx-fc { display: grid; gap: 6px; padding: 14px; border: 1px solid var(--cfx-bord); border-radius: 12px; background: #fff; scroll-margin-top: 90px; }
.cfx-fc-tete { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; }
.cfx-fc-fmt { font-size: 12.5px; color: var(--cfx-mut); }
.cfx-fc-nom { margin: 0; font-size: 1.05rem; line-height: 1.3; font-weight: 700; }
.cfx-fc .cfx-code { margin: 0 0 6px; }
.cfx-btn-dl { width: 100%; }
.cfx-news-btn { justify-self: start; font-size: 14px; }

/* page d'un chapitre : bouton de telechargement direct, formulaire facultatif repliable */
.cfx-dl-direct { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 14px 0 6px; }
.cfx-dl-direct small { color: var(--cfx-mut); }
.cfx-facultatif { margin-top: 14px; border: 1px solid var(--cfx-bord); border-radius: 12px; background: #fff; }
.cfx-facultatif > summary { cursor: pointer; padding: 12px 16px; font-weight: 650; }
.cfx-facultatif > summary:focus-visible { outline: 3px solid var(--cfx-bleu); outline-offset: 2px; border-radius: 12px; }
.cfx-facultatif .cfx-form { padding: 0 16px 16px; }
@media print { .cfx-filtres, .cfx-sauts, .cfx-news-btn, .cfx-dlg { display: none !important; } }
/* boite de dialogue de la newsletter (facultative) */
.cfx-dlg { width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 20px; border: 1px solid var(--cfx-bord, #E2E8F0); border-radius: 16px; background: #fff; color: #1E293B; box-shadow: 0 24px 60px -12px rgba(15,23,42,.35); }
.cfx-dlg::backdrop { background: rgba(15,23,42,.45); }
.cfx-dlg-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cfx-dlg-x { position: static; flex: none; }
.cfx-dlg .cfx-champs { grid-template-columns: 1fr; }