/*
 * [T4 A-4-1 2026-09-30 · Claude Opus 5.5] Styles propres d'EUSEP, en CSS simple,
 * servis par AssetMapper (nom logique « styles/app.css », adresse versionnée
 * /modules/styles/app-<empreinte>.css), liés par le layout public APRÈS
 * Bootstrap 5.3.3.
 *
 * 1. Les styles des deux greffons jQuery que le layout charge (select2 4.0.13,
 *    jquery-bootgrid 1.3.1), fichiers d'origine des paquets npm, importés sans
 *    modification. AssetMapper réécrit ces @import en adresses versionnées.
 * 2. Les règles propres d'EUSEP : assets/css/app.css, de sa ligne 10 043 à la
 *    fin, recopiées sans modification. Les 10 042 premières lignes de ce fichier
 *    sont une copie de select2, de Bootstrap 4.4.1 et de jquery-bootgrid : elles
 *    ne sont PAS reprises, elles annuleraient Bootstrap 5. assets/css/app.css
 *    n'est pas modifié (source de l'entrée Encore « app », qui n'est plus chargée).
 *    Écart relevé : la fin de ce fichier (repli du menu en mobile et tablette,
 *    en CSS imbriqué) n'avait jamais été reportée dans la feuille compilée
 *    build/app.min.css ; elle est désormais servie.
 * 3. Le pont Bootstrap 4 → 5, en fin de fichier.
 */
@import url("bibliotheques/select2-4.0.13.min-RYax0r9.css");
@import url("bibliotheques/jquery.bootgrid-1.3.1.min-kDfYZmO.css");
/* [hors-planning 2026-10-05 · Claude Opus 5.5] Styles par famille de pages (design du client). */
@import url("pages/association-ufS0yVg.css");
@import url("pages/evaluation-k4DBnzI.css");
@import url("pages/donnees-portail-ECmRboV.css");
@import url("pages/donnees-listes-Ue1Bu7v.css");
@import url("pages/espace-personnel-c0Wx5pj.css");
@import url("pages/donnees-finances-Zlu_YyI.css");
@import url("pages/legal-e6C4lG0.css");
@import url("pages/aide--RRztUs.css");
/* [hors-planning 2026-10-05 · Claude] Composant commun des tableaux et filtres repliés, importé en dernier. */
@import url("composants/tableaux-bfMGMSV.css");
/* [ABC-4-108] Style commun des tableaux DataTables. */
@import url("composants/datatables-hTzy8rj.css");
/* [hors-planning ABC-4-12] Composant commun lu / non lu. */
@import url("composants/jetons-nyicfpC.css");
@import url("composants/detail-OtCSfdV.css");
@import url("composants/echange-9l9yKHk.css");
@import url("composants/lecture-oOt_0Ui.css");
@import url("composants/messagerie-1NDOnTE.css");
/* [hors-planning ABC-4-34 L4] Règle unique des listes déroulantes. */
@import url("composants/listes-deroulantes-JVg5gob.css");
/* [ABC-4-223 2026-10-15] Assistant d'IA flottant (toutes les pages). */
@import url("composants/assistant-hgwmwX3.css");
/* [ABC-4-235 2026-10-15] Bloc « Notre Circuit » (passerelles EPE · EUSEP · RIF). */
@import url("composants/passerelles-hAoOHdR.css");
/* [ABC-4-268 2026-10-16] Vue d'ensemble du territoire d'une fiche commune. */
/* [A-R-28] Rubrique « Commune » : annuaire des communes, pages thématiques, fiche. */
@import url("composants/fiche-commune-ch4sQTO.css");
/* [A-R-68 2026-10-21] Vie locale : rubriques à cartes (modèle service-public.gouv.fr) et sommaire des fiches. */
@import url("composants/rubriques-cartes-Cm3Sr1u.css");
/* [ABC-4-237 2026-10-15] Défi anti-robot Cloudflare Turnstile de tous les formulaires protégés. */
@import url("composants/defi-anti-robot-2LB4vZJ.css");
@import url("composants/pot-de-miel-cqY3XC-.css");

.navbar-fixed {
    position: fixed;
    width: 100%;
    z-index: 10;
    top: 0;
    font-weight: 550;
}
/*
 * [T4 A-4-1 2026-09-30 · Claude Opus 5.5] Le lien « Aller au contenu » devant la
 * barre fixe. Il recevait le focus au premier Tab mais restait SOUS .navbar-fixed :
 * invisible (trouvé en recette). Au focus seulement : hors focus, la classe
 * Bootstrap le garde masqué. Gardes : tests/Unit/Twig/LienDEvitementVisibleTest.php
 * et tests/Navigateur/lien-d-evitement.mjs (Chromium et Firefox).
 */
.visually-hidden-focusable:focus,
.visually-hidden-focusable:focus-within {
    position: fixed;
    top: 0.5rem;
    left: 0.5rem;
    z-index: 1100;
    padding: 0.5rem 1rem;
    background-color: #fff;
    color: #0a58ca;
    border: 2px solid #0a58ca;
    border-radius: 0.25rem;
    font-weight: 600;
}
/*
 * [T4 A-4-2 2026-09-30 · Claude Opus 5.5] Contraste WCAG 2.1 AA (1.4.3, 4,5:1).
 * Le bleu-vert d'origine du menu, #17a2b8 (le « info » de Bootstrap 4), donnait
 * 3,04:1 avec le texte blanc : sous le seuil, sur les cinq entrées du menu et
 * sur chaque page (axe-core : 5 violations « color-contrast » par page, relevé
 * du 30/09 avant modification). Même teinte assombrie, #117a8b = 5,02:1. Vaut
 * pour le fond du menu, le fond des sous-menus et le texte d'une entrée survolée.
 * Garde : tests/Unit/Twig/ComposantsPartagesTest.php (contraste recalculé).
 */
.navbar-custom {
    background-color: #ffffff;
    box-shadow: 0 1px 0 #dce3ee;
    color: #10265a;
}
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: #10265a;
}
.navbar-custom .navbar-nav .nav-link {
    color: #10265a;
}
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #183a8f;
}
.navbar-custom .dropdown-menu {
    background-color: #ffffff;
    border: 1px solid #dce3ee;
}
.navbar-custom .dropdown-item {
    color: #10265a;
    font-weight: 400;
}
.navbar-custom .dropdown-item:focus,
.navbar-custom .dropdown-item:hover {
    color: #183a8f;
    background-color: #f2f5fa;
}
.navbar-custom .navbar-toggler {
    color: #183a8f;
    border: 1px solid #dce3ee;
}
.dropdown-menu .dropdown-item:hover:before {
    content: "» ";
}
a:hover {
    text-decoration: none;
}
a.nav-link {
    font-size: 0.9em;
}
a.nav-link:hover {
    transform: scale(1.1, 1.1);
}
a.dropdown-item:hover {
    transform: scaleY(1.1);
}
.justify-content-end .navbar-nav {
    flex-direction: row;
    padding: 0 0.5em;
}
.justify-content-end .navbar-nav .nav-item {
    padding: 0 0.5em;
}
html {
    font-size: 14px;
}
.main {
    position: relative;
    top: var(--entete-decalage);
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Source Sans 3", system-ui, sans-serif;
}
h1 {
    color: #2a2b33;
    font-weight: 700;
}
h5 {
    color: #2a2b33;
    font-weight: 700;
}
.homepage h2 {
    font-weight: 700;
}
.homepage .sub-title,
.homepage h3,
.homepage h4 {
    color: #293991;
}
.homepage .sub-title {
    font-size: 1.5rem;
    font-weight: 400;
}
.little-titles h4 {
    color: #666;
    font-size: 1em;
    font-weight: 400;
}
.homepage p {
    color: #666;
}
.homepage ol {
    list-style: none;
    counter-reset: my-counter;
    margin: 0;
    padding: 0;
}
.homepage ol li {
    counter-increment: my-counter;
    font-size: 1rem;
    color: #666;
}
.homepage ol li::before {
    content: "0" counter(my-counter);
    font-weight: 500;
    color: #293991;
    font-size: 1.5rem;
    margin-right: 0.5rem;
    line-height: 1;
}
ul:not(.browser-default) li {
    list-style-type: none;
}
img {
    max-width: 100%;
    max-height: 100%;
}
.logo {
    max-height: 120px;
    padding: 1em;
}
.smiley {
    padding-top: 0.25em;
}
h1.title {
    font-size: 1.9em;
    font-weight: 700;
    text-align: center;
    border-top: 1px dashed #d71b5b;
    border-bottom: 1px dashed #d71b5b;
    color: #d71b5b;
    margin: 0.55em auto 0.55em auto;
    padding: 0.25em;
}
h2.sub-title {
    color: #293991;
    font-size: 1.7em;
    font-weight: 700;
    margin: auto;
    padding: 5px;
    border: 1px solid #293991;
    width: 100%;
    height: auto;
    border-radius: 30px;
    background-color: #fff;
    text-align: center;
}
.com-title h2 {
    margin-bottom: 0;
    padding-bottom: 15px;
    margin-top: 0;
    font-weight: 600;
    font-size: 28px;
    color: #2a3a8f;
    text-transform: uppercase;
}
.hom-cre-acc-left h4 {
    border: 2px solid #2a2b33;
    border-radius: 20px;
    padding: 15px;
    text-align: center;
}
.faq h2,
.faq h3,
.faq p {
    text-align: center;
}
.faq h2 {
    color: #d71b5b;
}
.questions {
    text-align: justify;
}
.land-packages {
    background: #e9f8fd;
    margin-top: -5px;
    margin-bottom: -5px;
    border-bottom: 1px solid #cfe5ec;
    border-top: 1px solid #cfe5ec;
    padding-top: 50px;
}
.land-pack {
    position: relative;
    display: table;
    width: 80%;
    margin: 0 auto;
    padding-bottom: 50px;
}
.land-pack-grid {
    display: inline-block;
    width: 90%;
    position: relative;
    overflow: hidden;
    height: auto;
    box-sizing: border-box;
    background: #141e30;
}
.land-pack-grid-img img {
    width: 100%;
    height: 180px;
    transition: all 0.5s ease;
    object-fit: cover;
    opacity: 0.8;
}
.land-pack-grid-text {
    position: relative;
    transition: all 0.5s ease;
    margin-top: -5px;
}
.land-pack-grid-text h4 {
    margin: 0;
    background: #fff;
    padding: 15px;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    font-family: "Source Sans 3", system-ui, sans-serif;
}
.land-pack-grid-btn-blu {
    background: #01a0d8;
}
.land-pack-grid-btn {
    background: #17b599;
    color: #fff !important;
    text-align: center;
    display: block;
    height: 2.5px;
    line-height: 42px;
    box-sizing: border-box;
    transition: all 0.5s ease;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.5px;
}
.land-pack-grid:hover .land-pack-grid-img img {
    transform: scale(1.05);
}
.land-pack-grid:hover .land-pack-grid-text {
    margin-top: -42px;
    transition: all 0.5s ease;
}
.land-pack-grid:hover .land-pack-grid-btn {
    height: 40px;
    transition: all 0.5s ease;
}
.list-mig-like-com {
    position: relative;
    border-radius: 10px;
    margin-bottom: 20px;
    background: #14addb;
    transition: all 0.5s ease;
}
.list-mig-like-com:hover img {
    transition: all 0.5s ease;
    opacity: 0.5;
}
.list-mig-lc-img img {
    width: 100%;
    border-radius: 5px;
}
.list-mig-like-com:before {
    content: "";
    position: absolute;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.82) 10%, rgba(84, 84, 84, 0.35) 80%);
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    border-radius: 5px;
}
.list-mig-lc-con {
    position: absolute;
    width: 100%;
    margin-top: -125px;
    padding: 20px 20px 0 20px;
    display: block;
}
.list-mig-lc-con2 {
    margin-top: -90px;
}
.list-mig-lc-con h5 {
    font-size: 18px;
    color: #fff;
    padding-top: 10px;
    padding-bottom: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.list-mig-lc-con h6 {
    font-size: 14px;
    color: #fff;
    position: absolute;
    top: -20px;
    border: 1px solid #fff;
    padding: 8px 10px 3px 10px;
    border-radius: 18px;
    margin-bottom: 5px;
    padding-bottom: 10px;
}
.list-mig-lc-con p {
    color: #c1c1c1;
    font-size: 13px;
}
.list-mi-pr {
    top: 15px;
}
.old-row {
    margin-left: -0.75rem;
    margin-right: -0.75rem;
}
.old-grid {
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.old-grid.percent-50 {
    width: 50%;
}
.old-grid.percent-25 {
    width: 25%;
}
.list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding-left: 0;
}
.list .list-item {
    padding: 0.5em;
}
.notation-criteres {
    padding-left: 0;
}
.notation-criteres li {
    padding: 0.8em;
}
.notation-criteres li img {
    width: 30px;
    height: 30px;
}
h3.small-grey {
    font-size: 1.35em;
    color: #666;
}
span.or-connector {
    font-size: 2.35em;
    font-weight: 700;
    padding: 0.25em;
    background: #a4a4a4;
    color: #fff;
    border-radius: 1.25em;
}
.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
}
.breadcrumb > li + li::before {
    color: #8a8a8a;
}
.breadcrumb > li + li::before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}
.breadcrumb > li {
    display: inline-block;
}
.share-btn ul {
    margin-top: 1.5em;
}
.share-btn ul {
    padding-left: 0;
}
.share-btn ul li {
    display: inline-block;
    margin-bottom: 5px;
    margin-right: 1px;
    padding: 7px;
    border-radius: 3px;
}
.share-btn ul li a {
    color: #fff;
    font-weight: 500;
    font-size: 12px;
    text-shadow: none;
}
.share-btn i.fa {
    color: #fff;
}
.share-btn ul li.one {
    background: #3b5998;
}
.share-btn ul li.two {
    background: #00aced;
}
.share-btn ul li.three {
    background: #d34836;
}
@media (min-width: 768px) and (max-width: 991.98px) {
    a.dropdown-item:hover,
    a.nav-link:hover {
        transform: none !important;
    }
    .old-grid.percent-50 {
        width: 100%;
    }
    .old-grid.percent-25 {
        width: 50%;
    }
}
@media (max-width: 767.98px) {
    a.dropdown-item:hover,
    a.nav-link:hover {
        transform: none !important;
    }
    .old-grid.percent-50 {
        width: 100%;
    }
    .old-grid.percent-25 {
        width: 100%;
    }
}
.noter {
    min-height: 80vh;
}
.noter .message {
    color: #117a8b;
    font-weight: 700;
}
.starrating {
    justify-content: left !important;
}
/*
 * [T4 A-4-3 2026-09-30 · Claude Opus 5.5] Les boutons radio des étoiles étaient
 * en display:none : hors de portée du clavier (Tab ne s'y arrêtait jamais), la
 * note ne se donnait qu'à la souris. Ils sont désormais masqués à l'œil
 * seulement (même technique que visually-hidden), et l'étoile qui a le focus
 * est entourée.
 */
.starrating > input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.starrating > input:focus-visible + label {
    outline: 2px solid #117a8b;
    outline-offset: 2px;
}
.starrating > label:before {
    content: "\f005";
    font-family: fontAwesome;
    margin: 0.25em;
    font-size: 1.75em;
    display: inline-block;
}
.starrating > label {
    color: #ccc;
}
.starrating > input:checked ~ label {
    color: #ffca08;
}
.starrating > input:hover ~ label {
    color: #ffca08;
}
footer {
    position: relative;
    top: var(--entete-decalage);
    border-top: solid 1px #999;
    color: #000;
    font-weight: 300;
    margin-top: 55px;
    padding: 60px 0 50px;
    background: #fff;
    background: linear-gradient(360deg, #fff 0, #e4e4e4 38%, #282828 255%);
}
footer .strong,
footer h4 {
    color: #293991;
    font-weight: 400;
    font-size: 21px;
}
footer h4 {
    margin-bottom: 5px;
}
footer .highlighted {
    color: #000;
    font-size: 21px;
    vertical-align: -1px;
}
footer ul {
    padding-left: 0;
}
footer ul li a {
    color: #000;
    font-size: 15px;
    transition: all 0.5s ease;
}
footer ul li a:hover {
    color: #000;
    padding-left: 4px;
}
.smiley {
    display: block;
    color: #518110;
    font-weight: 550;
}
.smiley img {
    min-width: 65px;
}
@media (max-width: 767.98px) {
    .smiley-wrapper {
        position: absolute;
        right: 75px;
    }
}
@media (max-width: 575.98px) {
    .smiley-wrapper {
        width: 100px;
        position: absolute;
        top: 10px;
        right: 10px;
    }
    footer h4 {
        text-align: center;
    }
    div.d-flex,
    ul.d-flex {
        align-items: center;
        justify-content: center;
    }
    ul.mx-auto li {
        text-align: center;
    }
}
.foot-sec2 p {
    font-size: 15px;
}
.foot-logo img {
    width: 150px;
    padding-bottom: 20px;
}
.foot-sec2 {
    padding-top: 50px;
}
.foot-social ul {
    padding: 0;
}
.foot-social ul li {
    list-style-type: none;
    padding-right: 10px;
    background: 0 0;
    padding-left: 0;
}
.foot-social ul li i {
    font-size: 16px;
    width: 32px;
    height: 32px;
    border-radius: 50px;
    padding: 7px;
    text-align: center;
    color: #fff;
}
.foot-social ul li:nth-child(1) i {
    background: #3b5998;
}
.foot-social ul li:nth-child(2) i {
    background: #dd4b39;
}
.foot-social ul li:nth-child(3) i {
    background: #1da1f2;
}
.foot-social ul li:nth-child(4) i {
    background: #0077b5;
}
.foot-social ul li:nth-child(5) i {
    background: #b00;
}
.foot-social ul li:nth-child(6) i {
    background: #34af23;
}
.foot-social ul li a:hover {
    padding-left: 0;
}
.copy {
    position: relative;
    top: var(--entete-decalage);
    background: #121212;
}
.copy p {
    color: #fff;
    font-size: 13px;
    font-family: "Source Sans 3", system-ui, sans-serif;
    font-weight: 400;
    margin-bottom: 0;
    text-align: center;
    padding: 8px;
}
.copy p a {
    color: #fff;
}
.dir-foot h3 {
    text-transform: uppercase;
    color: #d0d0d0;
    font-weight: 600;
    font-size: 15px;
    border-bottom: 1px #676767;
    border-bottom-style: dashed;
    padding-bottom: 14px;
}
.dir-foot ul {
    padding: 0;
}
.dir-foot ul li {
    list-style-type: none;
    padding-left: 15px;
    background-size: 6px;
}
.dir-foot ul li a {
    text-decoration: none;
    color: #929292;
    font-weight: 600;
    line-height: 32px;
}
.dir-foot-foll-soc {
    padding: 0;
    float: right;
}
.dir-foot-foll-soc li {
    float: left;
    list-style-type: none;
    padding-right: 5px;
}
.dir-foot-foll-soc li h5 {
    color: #f2be33;
    font-size: 16px;
    font-weight: 500 !important;
    padding-right: 15px;
}
.dir-foot-foll-soc li h5 span {
    padding-left: 30px;
    color: #7d7d7d;
    font-size: 18px;
    font-weight: 700;
}
.dir-foot-foll-soc li a i {
    font-size: 16px;
    width: 32px;
    height: 32px;
    background: #ffc732;
    color: #343c42;
    padding: 8px;
    text-align: center;
    border-radius: 1px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.44);
}
.dir-foo2 {
    position: relative;
    overflow: hidden;
}
.dir-foo-cen img {
    float: left;
    padding-right: 15px;
}
.dir-foo-cen h5 {
    font-size: 24px;
    color: #7d7d7d;
    margin-top: 14px;
}
.dir-alp-tit h1 {
    color: #c41b58;
}
.dir-alp-tit ol {
    background: 0 0;
}
.dir-alp-tit ol li a {
    color: #000;
}
.notations .card,
.search-results .card {
    background: #f4f4f4;
    box-shadow: 4px 4px 4px rgba(150, 150, 150, 0.24);
}
/*
 * [T4 A-4-2 2026-09-30 · Claude Opus 5.5] Titre d'une carte de service : le lien
 * bleu par défaut de Bootstrap 5 (#0d6efd) sur le gris de la carte (#f4f4f4)
 * donnait 4,09:1 (axe-core, 12 violations par page d'annuaire). #0a58ca, la
 * teinte « lien survolé » de Bootstrap 5, donne 5,85:1. Le titre est un h2
 * (il était en h5, sous le h1 de la page) ramené à la taille d'un h5.
 */
.search-results .card .card-title a {
    color: #0a58ca;
}
.notations .card .card-text-bottom {
    position: absolute;
    bottom: 0;
    right: 10px;
}
span.twitter-typeahead .tt-dropdown-menu,
span.twitter-typeahead .tt-menu {
    cursor: pointer;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: left;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
}
span.twitter-typeahead .tt-suggestion {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}
span.twitter-typeahead .tt-suggestion.tt-cursor,
span.twitter-typeahead .tt-suggestion:focus,
span.twitter-typeahead .tt-suggestion:hover {
    color: #fff;
    text-decoration: none;
    outline: 0;
    background-color: #337ab7;
}
.input-group.input-group-lg span.twitter-typeahead .form-control {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
}
.input-group.input-group-sm span.twitter-typeahead .form-control {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
span.twitter-typeahead {
    width: 100%;
}
.input-group span.twitter-typeahead {
    display: block !important;
    height: 34px;
}
.input-group span.twitter-typeahead .tt-dropdown-menu,
.input-group span.twitter-typeahead .tt-menu {
    top: 32px !important;
}
.input-group span.twitter-typeahead:not(:first-child):not(:last-child) .form-control {
    border-radius: 0;
}
.input-group span.twitter-typeahead:first-child .form-control {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group span.twitter-typeahead:last-child .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.input-group.input-group-sm span.twitter-typeahead {
    height: 30px;
}
.input-group.input-group-sm span.twitter-typeahead .tt-dropdown-menu,
.input-group.input-group-sm span.twitter-typeahead .tt-menu {
    top: 30px !important;
}
.input-group.input-group-lg span.twitter-typeahead {
    height: 46px;
}
.input-group.input-group-lg span.twitter-typeahead .tt-dropdown-menu,
.input-group.input-group-lg span.twitter-typeahead .tt-menu {
    top: 46px !important;
}

/** DESKTOP **/
@media (min-width: 991.98px) {
    .content {
        min-height: 75vh;
    }
}

/** MOBILE + TABLET **/
@media (max-width: 991.98px) {
    #main-menu {
        max-height: 100vh;
        overflow-y: scroll;

        .nav-item, .dropdown-item {
            text-align: center;
        }

        #menu-contact-profile-container {
            flex-direction: column;
        }

        #menu-burger-button {
            position: fixed;
            top: 12px;
            right: 18px;
        }
    }
}

/** TABLET **/
@media (min-width: 768px) and (max-width: 991.98px) {
    #menu-contact-profile-container {
        #menu-contact, #menu-profile {
            padding: 0;
        }

        #menu-contact {
            .navbar-nav {
                flex-direction: row;
                justify-content: center;
                .nav-item {
                    & > a {
                        padding-left: 0.5em;
                        padding-right: 0.5em;
                    }
                    &:first-child {
                        & > a {
                            padding-left: 0;
                        }
                    }
                    &:last-child {
                        & > a {
                            padding-right: 0;
                        }
                    }
                }
            }
        }

        #menu-profile {
            .navbar-nav {
                .nav-item {
                    & > a {
                        padding-left: 0;
                        padding-right: 0;
                    }
                }
            }
        }
    }
}

/** MOBILE **/
@media (max-width: 767.98px) {
    #menu-contact-profile-container {
        .dropdown-menu {
            padding: 0;
        }
        #menu-contact, #menu-profile {
            width: 100%;
        }
    }
}

/*
 * [T4 A-4-1 2026-09-30 · Claude Opus 5.5] PONT BOOTSTRAP 4 → 5.
 *
 * Classes de Bootstrap 4 que Bootstrap 5 a retirées et que des gabarits d'EUSEP
 * emploient encore (relevé du 30/09/2026 : form-group ×110, btn-block ×41,
 * text-right ×21, badge-* ×15, text-left ×4…). Sans ces règles, ces pages
 * perdraient leur mise en forme en silence dès que le layout charge Bootstrap 5.
 * Chaque règle reprend l'équivalent Bootstrap 5 (me-2, text-end, d-grid,
 * text-bg-info, visually-hidden…), valeurs de Bootstrap 5.3.3.
 *
 * Provisoire : A-4-2 (composants) et A-4-3 (pages) remplacent ces classes dans
 * les gabarits ; une règle se retire quand plus aucun gabarit ne l'emploie.
 * Garde : tests/Unit/Twig/LayoutPublicBootstrap5Test.php
 * (testChaqueClasseBootstrap4EncoreEmployeeAUneRegleDePont).
 * [T4 A-4-3 2026-09-30] ml-2, mr-2, mr-5 et pl-5 retirées : plus aucun gabarit
 * ne les emploie (tests/Unit/Twig/PagesModerniseesTest.php,
 * testLePontBootstrap4NeGardeQueDesClassesEncoreEmployees).
 * [hors-planning 2026-09-30] form-inline, text-left, text-right et sr-only
 * retirées : plus aucun gabarit rendu sous Bootstrap 5 ne les écrit
 * (GabaritsBootstrap5SansClasseBootstrap4Test) ; la barre de filtres des listes
 * est une ligne de grille Bootstrap 5 (voir BARRE DE FILTRES plus bas).
 */
.form-group {
    margin-bottom: 1rem;
}
/* [hors-planning 2026-10-05] btn-block retirée : plus aucun gabarit ne l'emploie
   depuis la refonte sur le design du client (PagesModerniseesTest). */

/*
 * [T4 A-4-2 2026-09-30 · Claude Opus 5.5] COMPOSANTS PARTAGÉS.
 *
 * Alertes. Les écrans d'attente de code (inscription, mot de passe oublié)
 * écrivent alert-{{ label }} avec label = « error » : Bootstrap n'a jamais eu
 * de classe alert-error, le message d'erreur sortait sans couleur ni bordure.
 * Même rendu qu'alert-danger (valeurs de Bootstrap 5.3.3), 10,2:1 —
 * sans toucher à la variable Twig.
 *
 * Disclaimer IA (R20). templates/_composants/_disclaimer_ia.html.twig :
 * visible, contrasté (#664d03 sur #fff3cd, 7,2:1), jamais masqué — aucune
 * règle de ce fichier ne peut le cacher (DisclaimerIaComposantTest).
 *
 * Les badges de Bootstrap 4 (badge-pill, badge-info, badge-danger) ont quitté
 * les gabarits (rounded-pill, text-bg-*) : leurs règles de pont sont retirées.
 */
.alert-error {
    color: #58151c;
    background-color: #f8d7da;
    border-color: #f1aeb5;
}
/* Pied de page : anciens styles en ligne des logos */
.logo-magasin {
    max-width: 150px;
}
.logo-marque-rif {
    max-width: 190px;
}
.logo-marque-epe {
    max-width: 250px;
}
.disclaimer-ia {
    color: #664d03;
    background-color: #fff3cd;
    border-left: 4px solid #997404;
    padding: .5rem .75rem;
    margin: .5rem 0 1rem;
}

/*
 * [T4 A-4-3 2026-09-30 · Claude Opus 5.5] PAGES : fiche service, liste des
 * services d'une commune, finances de la commune, tableau des évaluations,
 * espace personnel. Anciens styles en ligne et blocs <style> sans nonce (que
 * la CSP refusait) des gabarits de ces pages, ramenés ici. Contrastes WCAG 2.1 AA sur blanc :
 *   titre de section #117a8b → 5,02:1 (était #17a2b8, 3,04:1)
 *   message de réussite #467900 → 5,26:1 (inchangé)
 *   message d'erreur, aide #b02a37 → 6,50:1 (était red, 4,00:1)
 * Garde : tests/Unit/Twig/PagesModerniseesTest.php, et le rendu calculé :
 * tests/Navigateur/pages-a-4-3.mjs (axe-core).
 */
.titre-section {
    color: #117a8b;
}
.message {
    font-size: 1.12em;
}
.message--succes {
    color: #467900;
    font-weight: 700;
}
.message--erreur {
    color: #b02a37;
    font-weight: 600;
}
.aide-notation {
    color: #b02a37;
    font-weight: 500;
}
.clear-both {
    clear: both;
}
/* Fiche service : la carte (ancien bloc <style> de organisme.html.twig). */
.carte-service {
    width: 100%;
    height: 100%;
    min-height: 300px;
    border: solid 1px #c4c4c4;
    margin-bottom: 1.25em;
}
/* [A-R-51] Fiche de la Vie locale : la carte a sa hauteur propre, dans sa carte de présentation. */
.vie-locale .carte-service {
    height: 320px;
    min-height: 0;
}
/* [A-R-52] Pilote « Mobilité » : légende de la carte des accidents (couleur ET texte, jamais la couleur seule), blocs de comparaison. */
.vie-locale .legende-point {
    display: inline-block;
    width: 0.8em;
    height: 0.8em;
    border-radius: 50%;
    border: 1px solid #fff;
    box-shadow: 0 0 0 1px #6c757d;
    vertical-align: baseline;
}
.vie-locale .legende-point--tue { background: #7f0000; }
.vie-locale .legende-point--blesse_hospitalise { background: #d35400; }
.vie-locale .legende-point--blesse_leger { background: #e0a800; }
.vie-locale .legende-point--indemne { background: #1f6f8b; }
.vie-locale [data-comparaison] dl dt { font-weight: 600; margin-top: 0.5rem; }
.vie-locale [data-comparaison] dl dd { margin-left: 0; }
.vie-locale [data-comparaison] .nav-pills .nav-link { margin-bottom: 0.25rem; }
.vie-locale [data-membres] tr[aria-current="true"] { font-weight: 700; }
/*
 * Finances de la commune (eusep/donnees/communes.html.twig et
 * depenses.html.twig) : anciens blocs <style> des deux pages. Ils visaient
 * .nav-tabs et .tab-content sans préfixe ; ils sont bornés ici aux deux pages
 * (classes donnees-finances et donnees-depenses de leur <article>), pour ne pas
 * s'étendre à tout le site en passant dans cette feuille commune.
 */
.donnees-finances .container.tabs {
    background: #f6f6f6;
    border: solid 1px #e4e4e4;
    border-top: none;
}
.donnees-finances .nav-tabs .nav-link.active {
    background: #f6f6f6;
    color: #131313;
    font-weight: 650;
}
.donnees-finances .nav-tabs .nav-link {
    border: solid 1px #e4e4e4;
    background: #fff;
}
.donnees-finances .tab-content {
    display: block;
    min-width: 100%;
    border: solid 1px #eee;
    border-top: 0;
}
.donnees-finances .tab-content td {
    font-size: 0.9em;
    white-space: nowrap !important;
}
.donnees-depenses .tab-content td {
    padding: 0 !important;
}
.donnees-depenses .tab-content td,
.donnees-depenses .tab-content th {
    text-align: center;
}
.donnees-depenses .tab-content td.Annee1 {
    padding: .75em !important;
}
.donnees-depenses .tab-content td span {
    display: block;
    padding: .75em;
}
.donnees-depenses span.class_1 {
    display: block;
    background: rgba(249, 108, 108, 0.7);
    padding: .75em;
}
.donnees-depenses span.class_2 {
    display: block;
    background: rgba(255, 235, 132, 0.6);
    padding: .75em;
}
.donnees-depenses span.class_3 {
    display: block;
    background: rgba(147, 209, 162, 0.7);
    padding: .75em;
}
.donnees-depenses span.class_4 {
    display: block;
    background: rgba(101, 190, 123, 0.7);
    padding: .75em;
}
/* Légende des dépenses : anciens styles en ligne des quatre pastilles. */
.legende-couleur {
    width: 25px;
    height: 25px;
    display: inline-block;
    padding: 0.25em;
}
.legende-couleur--1 {
    background: #f59292;
}
.legende-couleur--2 {
    background: #f7ebae;
}
.legende-couleur--3 {
    background: #aed9b8;
}
.legende-couleur--4 {
    background: #8dcc9d;
}
.legende-libelle {
    position: relative;
    top: -0.65em;
    padding-right: 0.25em;
}

/*
 * [hors-planning 2026-09-30 · Claude Opus 5.5] BARRE DE FILTRES DES LISTES
 * (_composants/liste/_recherche.html.twig, /donnees/listes/…).
 *
 * Une ligne de grille Bootstrap 5 (« row g-2 align-items-end ») : la recherche
 * prend la place restante, chaque filtre garde une largeur fixe et courte,
 * « Filtrer » et « Réinitialiser » ferment la ligne. Sur un téléphone, la
 * recherche occupe sa propre ligne et les filtres vont par deux.
 * Garde : ListeDonneesTestCase::testLaBarreDeFiltresTientSurUneLigneEnBootstrap5.
 */
.barre-filtres__recherche {
    min-width: 12rem;
}
.barre-filtres > .col-auto > .form-control,
.barre-filtres > .col-auto > .form-select {
    width: 10.5rem;
}
@media (max-width: 575.98px) {
    .barre-filtres > .col-auto {
        flex: 1 1 45%;
    }
    .barre-filtres > .col-auto > .form-control,
    .barre-filtres > .col-auto > .form-select {
        width: 100%;
    }
}

/*
 * [hors-planning 2026-09-30 · Claude Opus 5.5] LE CADRE DE DÉFILEMENT DES
 * TABLEAUX EST UN BLOC POSITIONNÉ. Un élément en position absolue (légende ou
 * libellé visually-hidden) d'un tableau plus large que l'écran s'échappait d'un
 * « table-responsive » non positionné et élargissait la page sur un téléphone
 * (constaté dans RIF et EPE le 30/09). Positionné, le cadre le garde dans son
 * défilement. Garde : LaPageNeDebordePasSurTelephoneTest.
 */
.table-responsive {
    position: relative;
}

/* [T5 ABC-5-33 2026-10-05] FC.5 — accessibilité. Garde : PageAccessibiliteTest, ContrasteEleveCookieTest. */

/* Navigation au clavier : le focus est toujours entouré d'un contour visible. */
:focus-visible {
    outline: 3px solid #0b57d0;
    outline-offset: 2px;
}

/* Contraste élevé : noir, blanc, jaune ; liens soulignés. Demandé par le cookie `contraste_eleve` (classe posée sur
   <html> par le serveur) OU par le réglage « contraste renforcé » du système. */
.contraste-eleve,
.contraste-eleve * {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #fff !important;
    text-shadow: none !important;
}

.contraste-eleve a,
.contraste-eleve a:visited,
.contraste-eleve a *,
.contraste-eleve .nav-link,
.contraste-eleve .navbar a {
    color: #ff0 !important;
    text-decoration: underline !important;
}

.contraste-eleve .btn-primary,
.contraste-eleve .btn-secondary,
.contraste-eleve .btn-primary * {
    background-color: #ff0 !important;
    color: #000 !important;
    border-color: #fff !important;
}

.contraste-eleve :focus-visible {
    outline: 3px solid #fff;
    box-shadow: 0 0 0 6px #000;
}

@media (prefers-contrast: more) {
    body {
        background-color: #fff;
        color: #000;
    }

    a {
        color: #0000ee;
        text-decoration: underline;
    }
}


/*
 * [hors-planning 2026-10-05 · Claude Opus 5.5] DESIGN « INSTITUTIONNEL » fourni par
 * le client (maquette eusep-accueil-moderne.html du 05/10/2026), sans photo :
 * menu blanc, accueil (classes v2-*), pied bleu nuit. Mêmes composants qu'avant,
 * seule l'apparence change. Palette et police de la maquette.
 */
:root {
    --v2-bleu: #183a8f;
    --v2-nuit: #10265a;
    --v2-rouge: #c6283d;
    --v2-encre: #17243c;
    --v2-doux: #536179;
    --v2-pale: #f2f5fa;
    --v2-trait: #dce3ee;
}
body {
    font-family: "Source Sans 3", system-ui, sans-serif;
    color: var(--v2-encre);
}

/* --- Menu --- */
.navbar-custom {
    min-height: 65px;
    padding: .25rem 2rem;
    border-bottom: 1px solid var(--v2-trait);
    box-shadow: 0 2px 10px rgba(16, 38, 90, .05);
}
.navbar-custom .navbar-brand {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-right: 2rem;
    text-decoration: none;
}
.navbar-custom .navbar-logo {
    height: 46px;
    width: auto;
    max-height: none;
}
.navbar-signature {
    display: grid;
    gap: 1px;
    padding-left: 16px;
    border-left: 1px solid var(--v2-trait);
    font-size: 13px;
    line-height: 1.3;
    color: var(--v2-doux);
    white-space: normal;
    max-width: 230px;
}
.navbar-signature strong {
    font-size: 15px;
    font-weight: 600;
    color: var(--v2-nuit);
}
.navbar-custom .navbar-nav .nav-link {
    font-size: 16px;
    font-weight: 600;
    padding: .7rem 1rem;
}
a.nav-link:hover,
a.dropdown-item:hover {
    transform: none;
}
.navbar-custom .navbar-nav .nav-link.show {
    color: var(--v2-bleu);
}
.navbar-custom .dropdown-menu {
    min-width: 290px;
    padding: 8px;
    margin-top: .3rem;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 10px 25px rgba(16, 38, 90, .08);
}
.navbar-custom .dropdown-item {
    font-size: 16px;
    padding: 10px 12px;
    border-radius: 4px;
    white-space: normal;
}
.dropdown-menu .dropdown-item:hover:before {
    content: none;
}
.navbar-custom .menu-contact-lien {
    font-size: 15px;
    font-weight: 400;
    color: var(--v2-bleu);
    padding: .5rem .8rem;
}
.navbar-custom .nav-link.special {
    font-size: 15px;
    font-weight: 400;
    color: var(--v2-bleu);
    padding: 9px 15px;
    border: 1px solid var(--v2-trait);
    border-radius: 5px;
}
.navbar-custom .nav-link.special:hover {
    background: var(--v2-pale);
}
#main-menu a:focus-visible,
.v2-hero a:focus-visible,
.v2-section a:focus-visible,
.v2-pied a:focus-visible {
    outline: 3px solid var(--v2-rouge);
    outline-offset: 3px;
}
@media (max-width: 1199.98px) {
    .navbar-signature {
        display: none;
    }
}
@media (max-width: 991.98px) {
    .navbar-custom {
        padding: .4rem 1rem;
    }
    #main-menu #menu-contact-profile-container {
        align-items: stretch !important;
        padding-bottom: .8rem;
    }
}

/* --- [A-4-193 2026-10-14] En-tête sur la STRUCTURE de service-public.fr, aux couleurs
 * d'EUSEP (palette v2 ci-dessus ; aucune couleur de l'État) : barre du haut (logo, champ
 * « Rechercher sur le site » et sa loupe, « Se connecter »), puis le menu principal sur sa
 * propre ligne — icône d'accueil, rubriques en entrées sur deux lignes, soulignées en bleu
 * EUSEP au survol ou à l'ouverture. --- */
:root {
    /* Écart que le contenu laissait sous l'ancienne barre FIXE de 65 px (.main, .hero,
     * .page-heading, pied de page). L'en-tête de service-public.fr n'est pas fixe : il
     * défile avec la page, le contenu commence donc juste dessous. */
    --entete-decalage: 0px;
    /* [A-4-218] Le CONTENU de l'en-tête suit la largeur centrée des sections (.wrap : 1200 px
     * au plus, 32 px de marge, 20 px sous 720 px) ; le fond de la bande reste pleine largeur. */
    --entete-marge: max(32px, calc((100% - 1136px) / 2));
}
@media (max-width: 720px) {
    :root {
        --entete-marge: 20px;
    }
}
.navbar-custom.entete-sp {
    position: relative;
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    padding: 0;
}
.entete-sp .entete-haut {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem 1.25rem;
    padding: .5rem var(--entete-marge);
}
.entete-sp #menu-contact-profile-container .navbar-nav {
    flex-direction: row;
}
.recherche-site {
    display: flex;
    align-items: stretch;
    width: 100%;
    max-width: 340px;
}
.recherche-site input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    height: 42px;
    padding: 0 .9rem;
    font-size: 16px;
    color: var(--v2-encre);
    background: var(--v2-pale);
    border: 1px solid var(--v2-trait);
    border-right: 0;
    border-radius: 5px 0 0 5px;
}
.recherche-site input[type="search"]::placeholder {
    color: var(--v2-doux);
}
/* [ABC-4-261] La loupe est centrée par le bouton lui-même (flex) et non par la hauteur de ligne : même position dans l'en-tête et sur la page de résultats, quel que soit le navigateur. */
.recherche-site button {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 0 0 46px;
    height: 42px;
    padding: 0;
    line-height: 1;
    font-size: 18px;
    color: #fff;
    background: var(--v2-bleu);
    border: 1px solid var(--v2-bleu);
    border-radius: 0 5px 5px 0;
}
.recherche-site button i {
    display: block;
    line-height: 1;
}
.recherche-site button:hover {
    background: var(--v2-nuit);
}
.recherche-site :focus-visible {
    outline: 3px solid var(--v2-rouge);
    outline-offset: 2px;
}
.entete-sp #menu-principal {
    padding: 0 var(--entete-marge);
    border-top: 1px solid var(--v2-trait);
}
.entete-sp .entete-menu {
    align-items: stretch;
}
.entete-sp .entete-menu > .nav-item > .nav-link {
    height: 100%;
    padding: .55rem 1.1rem;
    border-bottom: 3px solid transparent;
    line-height: 1.2;
    color: var(--v2-nuit);
}
.entete-sp .entete-menu > .nav-item > .nav-link:hover,
.entete-sp .entete-menu > .nav-item > .nav-link.show {
    color: var(--v2-bleu);
    border-bottom-color: var(--v2-bleu);
    background: var(--v2-pale);
}
.entete-sp .entete-accueil > .nav-link {
    display: flex;
    align-items: center;
    font-size: 22px;
}
.entete-sp .entete-menu .dropdown-toggle {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    column-gap: .6rem;
    text-align: left;
}
.entete-sp .entete-menu .dropdown-toggle::after {
    grid-column: 2;
    grid-row: 1 / span 2;
}
.entete-sp .entree-ligne {
    display: block;
    grid-column: 1;
}
.entete-sp .entree-ligne + .entree-ligne {
    font-size: 14px;
    font-weight: 400;
    color: var(--v2-doux);
}
.entete-sp .dropdown-menu {
    margin-top: 0;
}
/* [A-R-51 2026-10-20] Menu « Vie locale » (§ 2 de l'instruction du client) : sur téléphone, neuf groupes dépliables par leur bouton
   (aria-expanded) ; sur ordinateur, un menu élargi en trois colonnes, groupes ouverts. Sept rubriques au menu : les entrées se
   resserrent et passent à la ligne plutôt que de se chevaucher ou de rapetisser (texte agrandi à 200 % compris). */
.entete-sp .menu-vie-locale {
    padding: .5rem 0;
}
.entete-sp .menu-groupe__titre {
    display: block;
    width: 100%;
    padding: .5rem 1rem;
    border: 0;
    background: none;
    color: var(--v2-nuit);
    font-weight: 700;
    text-align: left;
}
.entete-sp .menu-groupe__titre::after {
    content: "▾";
    float: right;
}
.entete-sp .menu-groupe__titre[aria-expanded="true"]::after {
    content: "▴";
}
.entete-sp .menu-groupe__titre:focus-visible {
    outline: 3px solid var(--v2-rouge);
    outline-offset: -3px;
}
.entete-sp .menu-groupe__liste {
    margin: 0;
    padding: 0 0 .4rem;
    list-style: none;
}
.entete-sp .menu-groupe__titre[aria-expanded="false"] + .menu-groupe__liste {
    display: none;
}
.entete-sp .menu-groupe__liste .dropdown-item {
    white-space: normal;
}
@media (min-width: 992px) {
    .entete-sp .entete-menu {
        position: relative;
        flex-wrap: wrap;
    }
    .entete-sp .entete-menu > .nav-item > .nav-link {
        padding: .55rem .8rem;
    }
    .entete-sp .entree-ligne + .entree-ligne {
        max-width: 8rem;
        white-space: normal;
    }
    /* [A-R-81 2026-10-22] Menu « Vie locale » raccourci (G7, G18) : une colonne étroite de neuf titres sous son entrée ; les
       sous-rubriques d'un groupe s'ouvrent en volet À DROITE de leur titre (survol, clic, clavier), comme les autres menus. */
    .entete-sp .entete-menu > .nav-item:has(> .menu-vie-locale) {
        position: relative;
    }
    .entete-sp .menu-vie-locale {
        left: 0;
        width: 17rem;
    }
    .entete-sp .menu-vie-locale__groupes {
        display: block;
    }
    .entete-sp .menu-groupe {
        position: relative;
    }
    .entete-sp .menu-groupe__titre {
        cursor: pointer;
    }
    .entete-sp .menu-groupe__titre:hover,
    .entete-sp .menu-groupe__titre[aria-expanded="true"] {
        background: var(--bs-dropdown-link-hover-bg, #e9ecef);
    }
    .entete-sp .menu-groupe__titre::after {
        content: "▸";
    }
    .entete-sp .menu-groupe__titre[aria-expanded="true"]::after {
        content: "▸";
    }
    .entete-sp .menu-groupe__liste {
        position: absolute;
        left: 100%;
        top: 0;
        z-index: 1;
        width: 21rem;
        max-height: 80vh;
        overflow-y: auto;
        padding: .5rem 0;
        background: var(--bs-dropdown-bg, #fff);
        border: 1px solid var(--bs-dropdown-border-color, rgba(0, 0, 0, .15));
        border-radius: .375rem;
        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
    }
    .entete-sp .menu-groupe:hover > .menu-groupe__liste,
    .entete-sp .menu-groupe__titre[aria-expanded="true"] + .menu-groupe__liste {
        display: block;
    }
}
/* Écran d'ordinateur étroit (992 à 1199 px) : la seconde ligne des entrées s'efface, le menu tient sur une ligne sans rapetisser. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .entete-sp .entree-ligne + .entree-ligne {
        display: none;
    }
}
.recherche-du-site .recherche-site-page {
    max-width: 560px;
    margin-top: 1rem;
}
.recherche-du-site .recherche-site-page input[type="search"],
.recherche-du-site .recherche-site-page button {
    height: 50px;
    margin: 0;
}
.recherche-du-site .recherche-site-total {
    margin-bottom: 1.5rem;
}
/* [A-R-109] Chaque catégorie de résultats est une carte : 2 par ligne dès 992 px, une colonne dessous ; hauteur égale sur une ligne. */
.recherche-du-site .recherche-site-cartes {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--ds-espace-4);
    align-items: stretch;
}
@media (min-width: 992px) {
    .recherche-du-site .recherche-site-cartes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.recherche-du-site .recherche-site-carte {
    min-width: 0;
    padding: var(--ds-espace-4);
    border: 1px solid var(--ds-couleur-trait);
    border-radius: var(--ds-rayon);
    background: var(--ds-couleur-surface);
    box-shadow: var(--ds-ombre-carte);
    overflow-wrap: anywhere;
}
.recherche-du-site .recherche-site-carte:hover,
.recherche-du-site .recherche-site-carte:focus-within {
    border-color: var(--ds-couleur-primaire-fonce);
}
.recherche-du-site .recherche-site-carte li:last-child {
    border-bottom: 0;
}
.recherche-du-site .recherche-site-carte li a:hover,
.recherche-du-site .recherche-site-carte li a:focus-visible {
    text-decoration: underline;
}
.recherche-du-site .recherche-site-carte h2 {
    font-size: 24px;
    color: var(--v2-nuit);
    margin-bottom: .8rem;
}
.recherche-du-site .recherche-site-compte,
.recherche-du-site .recherche-site-rubrique {
    font-size: 15px;
    font-weight: 400;
    color: var(--v2-doux);
}
.recherche-du-site .recherche-site-carte ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.recherche-du-site .recherche-site-carte li {
    padding: .7rem 0;
    border-bottom: 1px solid var(--v2-trait);
}
.recherche-du-site .recherche-site-carte li a {
    font-weight: 600;
}
.recherche-du-site .recherche-site-carte li p {
    margin: .2rem 0 0;
    font-size: 16px;
    color: var(--v2-doux);
}
@media (max-width: 991.98px) {
    .entete-sp .entete-haut {
        padding: .4rem var(--entete-marge);
    }
    #main-menu.entete-sp {
        max-height: none;
        overflow-y: visible;
    }
    #main-menu.entete-sp #menu-burger-button {
        position: static;
        order: 2;
    }
    #main-menu.entete-sp #menu-contact-profile-container {
        flex-direction: row;
        align-items: center !important;
        margin-left: auto;
        padding-bottom: 0;
    }
    .entete-sp .entete-haut .recherche-site {
        order: 3;
        max-width: none;
        flex: 1 1 100%;
    }
    .entete-sp #menu-principal {
        padding: 0 var(--entete-marge);
    }
    .entete-sp .entete-menu .dropdown-toggle {
        justify-content: center;
        text-align: center;
    }
    .entete-sp .entete-accueil > .nav-link {
        justify-content: center;
    }
    /* [A-R-67] Liens du compte dans le burger (le menu « Bienvenue » est masqué sous 992 px). */
    .entete-sp .entete-compte-mobile {
        border-top: 1px solid var(--v2-trait);
        margin-top: .4rem;
        padding: .4rem 0 .6rem;
    }
    .entete-sp .entete-compte-mobile .dropdown-item {
        padding: .6rem .25rem;
        white-space: normal;
        text-align: center;
    }
}

/* --- Accueil, pages publiques et pied de page : feuille des maquettes du client,
 * RECOPIÉE TELLE QUELLE (eusep-accueil-moderne.html, puis les sept pages du
 * 05/10/2026 — connexion, inscription, réinitialisation du mot de passe,
 * annuaire, annuaire d'une commune, fiche d'un service, évaluation — dont la
 * feuille de la réinitialisation contient toutes les autres), sans
 * les deux @font-face embarqués (Source Sans 3 est chargée par Google Fonts dans
 * le layout). Ses règles d'en-tête (.masthead, .navigation…) ne trouvent rien à
 * styler : le menu reste le composant Bootstrap, restylé plus haut. --- */
/* EUSEP — proposition institutionnelle. Styles isolés à .eusep-v2. */
.eusep-v2{--blue:#183a8f;--deep:#10265a;--red:#c6283d;--ink:#17243c;--muted:#536179;--pale:#f2f5fa;--line:#dce3ee;margin:0;background:#fff;color:var(--ink);font:400 18px/1.55 "Source Sans 3",system-ui,sans-serif;scroll-behavior:smooth}
.eusep-v2 *,.eusep-v2 *::before,.eusep-v2 *::after{box-sizing:border-box}
.eusep-v2 a{color:var(--blue);text-underline-offset:4px}
.eusep-v2 a:hover{text-decoration:underline}
.eusep-v2 :where(a,button,input,summary):focus-visible{outline:3px solid var(--red);outline-offset:4px}
.eusep-v2 button,.eusep-v2 input{font:inherit}
.eusep-v2 img{display:block;max-width:100%;height:auto}
.eusep-v2 h1,.eusep-v2 h2,.eusep-v2 h3,.eusep-v2 h4,.eusep-v2 p{margin:0}
.eusep-v2 h1,.eusep-v2 h2,.eusep-v2 h3,.eusep-v2 h4{line-height:1.2;font-weight:600;color:var(--deep)}
.eusep-v2 ul{list-style:none;margin:0;padding:0}
.eusep-v2 .wrap{max-width:1200px;margin-inline:auto;padding-inline:32px}
.eusep-v2 .skip{position:absolute;top:-100px;left:20px;z-index:50;padding:12px 18px;background:#fff}
.eusep-v2 .skip:focus{top:10px}
.eusep-v2 .masthead{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:20px}
.eusep-v2 .brand{display:flex;align-items:center;gap:23px;text-decoration:none}
.eusep-v2 .brand img{width:92px;height:66px;object-fit:contain}
.eusep-v2 .brand-copy{border-left:1px solid var(--line);padding-left:23px;display:grid;gap:2px;max-width:330px;font-size:15px;line-height:1.35;color:var(--muted)}
.eusep-v2 .brand-copy strong{font-size:17px;color:var(--deep);font-weight:600}
.eusep-v2 .utility{display:flex;align-items:center;gap:22px;font-size:15px}
.eusep-v2 .utility a{text-decoration:none}
.eusep-v2 .sign-in{padding:10px 15px;border:1px solid var(--line);border-radius:5px}
.eusep-v2 .menu-toggle{display:none;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--blue);padding:11px 16px;min-height:44px}
.eusep-v2 .navigation{border-block:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.eusep-v2 .nav-row{display:flex;align-items:stretch;gap:38px;min-height:57px}
.eusep-v2 .nav-item{position:relative}
.eusep-v2 .nav-item summary{list-style:none;padding:17px 0;cursor:pointer;color:var(--deep);font-weight:600;font-size:16px;display:flex;align-items:center;gap:12px}
.eusep-v2 .nav-item summary::-webkit-details-marker{display:none}
.eusep-v2 .nav-item summary::after{content:"⌄";font-size:14px;color:var(--blue)}
.eusep-v2 .nav-item[open] summary::after{content:"⌃"}
.eusep-v2 .nav-item[open] summary{color:var(--blue)}
.eusep-v2 .nav-panel{position:absolute;top:100%;left:-12px;padding:8px;background:#fff;min-width:300px;max-width:390px;border:1px solid var(--line);border-radius:0 0 8px 8px;box-shadow:0 10px 25px #10265a12}
.eusep-v2 .nav-panel a{display:block;text-decoration:none;padding:12px;border-radius:4px;font-size:16px;line-height:1.4}
.eusep-v2 .nav-panel a:hover{background:var(--pale)}
.eusep-v2 .hero{background:var(--pale);border-bottom:1px solid var(--line)}
.eusep-v2 .hero-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:35px;align-items:center;padding-block:48px 52px}
.eusep-v2 .eyebrow{font-size:13px;line-height:1.4;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--red);margin-bottom:15px}
.eusep-v2 h1{font-size:clamp(32px,3.8vw,48px);letter-spacing:-.025em;max-width:730px;margin-bottom:20px}
.eusep-v2 .hero-description{font-size:21px;line-height:1.5;color:var(--muted);max-width:660px}
.eusep-v2 .trust-line{font-size:15px;color:var(--blue);margin-top:24px;display:flex;flex-wrap:wrap;gap:12px 24px}
.eusep-v2 .trust-line span::before{content:"";display:inline-block;vertical-align:middle;margin-right:8px;width:5px;height:5px;border-radius:50%;background:var(--red)}
.eusep-v2 .hero-image{width:100%;border-radius:12px}
.eusep-v2 .search-section{padding-block:35px 12px}
.eusep-v2 .search-box{background:var(--deep);color:#fff;padding:29px 32px;border-radius:8px;display:grid;grid-template-columns:1fr 1.3fr;gap:22px 40px;align-items:center}
.eusep-v2 .search-box h2{color:#fff;font-size:25px;margin-bottom:9px}
.eusep-v2 .search-box p{color:#dce5f7;font-size:16px}
.eusep-v2 .search-form label{font-size:15px;font-weight:600;display:block;margin-bottom:8px}
.eusep-v2 .input-row{display:flex;gap:10px}
.eusep-v2 input{min-width:0;flex:1;min-height:50px;background:#fff;color:var(--ink);padding:12px 14px;border:1px solid #a8b9db;border-radius:5px;font-size:17px}
.eusep-v2 .primary-button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 19px;background:var(--blue);border:1px solid var(--blue);border-radius:5px;color:#fff;text-decoration:none;font-weight:600;font-size:16px;white-space:nowrap;cursor:pointer}
.eusep-v2 .search-box .primary-button{background:#e7edfa;color:var(--deep);border-color:#e7edfa}
.eusep-v2 .search-box .primary-button:hover{background:#fff}
.eusep-v2 .search-meta{grid-column:1/-1;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px;padding-top:17px;border-top:1px solid #3d5380}
.eusep-v2 .search-meta a{color:#fff}
.eusep-v2 .form-error{margin-top:9px!important;color:#fff!important;font-size:14px!important}
.eusep-v2 .section{padding-block:44px}
.eusep-v2 .section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:25px}
.eusep-v2 .section-heading h2{font-size:30px;letter-spacing:-.015em;margin-bottom:9px}
.eusep-v2 .section-heading p{font-size:17px;color:var(--muted);max-width:720px}
.eusep-v2 .section-heading>a{font-size:16px;font-weight:600;white-space:nowrap}
.eusep-v2 .tools-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.eusep-v2 .tool{padding:26px 25px;border:1px solid var(--line);border-radius:7px;border-top:3px solid var(--blue);background:#fff}
.eusep-v2 .tool-number{font-size:13px;color:var(--red);margin-bottom:17px;font-weight:600}
.eusep-v2 .tool h3{font-size:24px;margin-bottom:12px}
.eusep-v2 .tool p{font-size:17px;color:var(--muted);margin-bottom:18px}
.eusep-v2 .tool a{font-size:16px;font-weight:600;display:inline-block;padding-block:4px;line-height:1.45}
.eusep-v2 .tool li+li{margin-top:5px}
.eusep-v2 .services-band{background:var(--pale);border-block:1px solid var(--line)}
.eusep-v2 .services-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.eusep-v2 .service-card{background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden;display:flex;flex-direction:column}
.eusep-v2 .service-card img{width:100%;aspect-ratio:1.8;object-fit:cover}
.eusep-v2 .service-content{padding:18px 20px 22px;flex:1}
.eusep-v2 .service-content h3{font-size:22px;margin-bottom:11px}
.eusep-v2 .service-content a{font-size:15px;font-weight:600;display:inline-block}
.eusep-v2 .cities-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.eusep-v2 .city{display:block;border:1px solid var(--line);border-radius:7px;overflow:hidden;text-decoration:none;font-weight:600;background:#fff}
.eusep-v2 .city:hover{border-color:#9cb0d7}
.eusep-v2 .city img{width:100%;aspect-ratio:1.65;object-fit:cover}
.eusep-v2 .city span{display:flex;justify-content:space-between;align-items:center;padding:14px 15px;color:var(--deep);font-size:18px}
.eusep-v2 .city span::after{content:"→";color:var(--blue)}
.eusep-v2 .mission-band{border-top:1px solid var(--line);background:#fbfcfe}
.eusep-v2 .mission-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:center}
.eusep-v2 .mission h2{font-size:31px;letter-spacing:-.015em;margin-bottom:18px;max-width:430px}
.eusep-v2 .mission p{color:var(--muted);font-size:18px;margin-bottom:17px}
.eusep-v2 .mission-links{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:16px;font-weight:600;margin-top:23px}
.eusep-v2 .video-poster{width:100%;padding:0;border:1px solid var(--line);border-radius:8px;background:#eef3fa;position:relative;overflow:hidden;cursor:pointer;display:block;aspect-ratio:16/9}
.eusep-v2 .video-poster img{width:100%;height:100%;object-fit:cover}
.eusep-v2 .video-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.eusep-v2 .video-play span{display:inline-flex;align-items:center;gap:10px;padding:13px 18px;background:var(--deep);color:#fff;border-radius:6px;font-size:17px;box-shadow:0 5px 15px #10265a33}
.eusep-v2 .video-play span::before{content:"▶";font-size:12px}
.eusep-v2 .video-title{font-size:18px;font-weight:600;color:var(--deep);margin-top:13px}
.eusep-v2 .video-caption{font-size:16px;color:var(--muted);margin-top:4px}
.eusep-v2 .youtube-link{font-size:16px;display:inline-block;margin-top:11px}
.eusep-v2 iframe{width:100%;aspect-ratio:16/9;display:block;border:0;border-radius:8px;background:var(--deep)}
.eusep-v2 .faq-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:70px}
.eusep-v2 .faq-grid h2{font-size:29px;margin-bottom:12px}
.eusep-v2 .faq-grid>div>p{color:var(--muted);font-size:17px}
.eusep-v2 .faq-item{border-bottom:1px solid var(--line);padding-block:15px}
.eusep-v2 .faq-item:first-child{border-top:1px solid var(--line)}
.eusep-v2 .faq-item summary{font-weight:600;font-size:18px;color:var(--deep);cursor:pointer}
.eusep-v2 .faq-item p{color:var(--muted);font-size:17px;margin-top:12px}
.eusep-v2 .footer{background:var(--deep);color:#fff;padding-top:45px;margin-top:10px}
.eusep-v2 .footer h2,.eusep-v2 .footer h3{color:#fff}
.eusep-v2 .footer a{color:#e1e9fc;font-size:15px;text-decoration:none;line-height:1.5;display:inline-block;padding-block:3px}
.eusep-v2 .footer a:hover{text-decoration:underline}
.eusep-v2 .footer-main{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.25fr;gap:38px;padding-bottom:29px}
.eusep-v2 .footer-title{font-size:22px;margin-bottom:14px;letter-spacing:.01em}
.eusep-v2 .footer-description{font-size:15px;line-height:1.65;color:#c6d2e9;max-width:280px}
.eusep-v2 .footer h3{font-size:17px;margin-bottom:15px}
.eusep-v2 .footer li{margin-bottom:4px}
.eusep-v2 .footer address{font-style:normal;color:#c6d2e9;font-size:15px;line-height:1.8}
.eusep-v2 .social-links{display:flex;gap:15px;flex-wrap:wrap;margin-top:14px}
.eusep-v2 .footer-secondary{display:grid;grid-template-columns:1fr 1fr;gap:38px;border-top:1px solid #344975;padding-block:26px}
.eusep-v2 .inline-list{display:flex;gap:7px 20px;flex-wrap:wrap}
.eusep-v2 .footer-resources{border-top:1px solid #344975;padding-block:20px}
.eusep-v2 .footer-resources summary{font-size:15px;font-weight:600;cursor:pointer}
.eusep-v2 .footer-resources[open] ul{margin-top:16px}
.eusep-v2 .footer-projects{display:flex;gap:15px 35px;flex-wrap:wrap;border-top:1px solid #344975;padding-block:19px;align-items:center;font-size:14px;color:#c6d2e9}
.eusep-v2 .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #344975;padding-block:20px 25px}
.eusep-v2 .footer-bottom p{color:#c6d2e9;font-size:13px;max-width:560px}
.eusep-v2 .legal-links{display:flex;flex-wrap:wrap;gap:17px}
.eusep-v2 .legal-links a{font-size:13px}
.eusep-v2 [hidden]{display:none!important}
@media(max-width:1000px){.eusep-v2 .hero-grid{grid-template-columns:1.4fr 1fr;gap:20px}.eusep-v2 .hero-description{font-size:19px}.eusep-v2 .search-box{grid-template-columns:1fr}.eusep-v2 .tools-grid{gap:15px}.eusep-v2 .tool{padding:22px 19px}.eusep-v2 .services-grid{grid-template-columns:1fr 1fr}.eusep-v2 .cities-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.eusep-v2 .mission-grid,.eusep-v2 .faq-grid{gap:35px}.eusep-v2 .footer-main{grid-template-columns:1fr 1fr;gap:28px}.eusep-v2 .nav-row{gap:28px}}
@media(max-width:720px){.eusep-v2 .wrap{padding-inline:20px}.eusep-v2 .masthead{padding-block:16px;gap:12px}.eusep-v2 .brand img{width:80px;height:58px}.eusep-v2 .brand-copy{display:none}.eusep-v2 .utility{margin-left:auto;gap:12px}.eusep-v2 .utility>a{display:none}.eusep-v2 .menu-toggle{display:block}.eusep-v2 .navigation{position:relative}.eusep-v2 .nav-row{display:none;padding-block:10px}.eusep-v2 .navigation.is-open .nav-row{display:block}.eusep-v2 .nav-item summary{padding-block:15px;border-bottom:1px solid var(--line);justify-content:space-between}.eusep-v2 .nav-panel{position:static;min-width:0;width:100%;box-shadow:none;border:0;padding:6px 0 12px}.eusep-v2 .hero-grid{grid-template-columns:1fr;padding-block:32px;gap:24px}.eusep-v2 h1{font-size:34px}.eusep-v2 .hero-description{font-size:19px}.eusep-v2 .hero-image{max-width:360px;margin-inline:auto}.eusep-v2 .trust-line{margin-top:18px}.eusep-v2 .search-section{padding-block:24px 5px}.eusep-v2 .search-box{padding:24px 20px;gap:20px}.eusep-v2 .input-row{flex-direction:column}.eusep-v2 .search-meta{font-size:14px}.eusep-v2 .section{padding-block:32px}.eusep-v2 .section-heading{align-items:flex-start;flex-direction:column;gap:12px}.eusep-v2 .section-heading h2{font-size:27px}.eusep-v2 .tools-grid{grid-template-columns:1fr}.eusep-v2 .tool-number{margin-bottom:10px}.eusep-v2 .services-grid{gap:12px}.eusep-v2 .service-content{padding:15px 13px 19px}.eusep-v2 .service-content h3{font-size:21px}.eusep-v2 .service-content a{font-size:14px}.eusep-v2 .cities-grid{grid-template-columns:1fr 1fr;gap:12px}.eusep-v2 .mission-grid,.eusep-v2 .faq-grid{grid-template-columns:1fr;gap:26px}.eusep-v2 .mission h2{font-size:29px}.eusep-v2 .footer-main{grid-template-columns:1fr;gap:26px}.eusep-v2 .footer-secondary{grid-template-columns:1fr;gap:24px}.eusep-v2 .footer-bottom{flex-direction:column}.eusep-v2 .footer-description{max-width:none}}
/* [A-R-60] « Votre commune au quotidien » : une carte par ligne sur téléphone (titres et listes de liens lisibles, rien de rogné à 375 px et texte agrandi) */
@media(max-width:560px){.eusep-v2 [data-votre-commune-au-quotidien] .services-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.eusep-v2{scroll-behavior:auto}.eusep-v2 *{transition:none!important}}
/* Déclinaisons annuaire, résultats, fiche et évaluation — identité EUSEP v2. */
.eusep-v2 select,.eusep-v2 textarea{font:inherit}
.eusep-v2 select:focus-visible,.eusep-v2 textarea:focus-visible{outline:3px solid var(--red);outline-offset:4px}
.eusep-v2 .breadcrumbs{list-style:none;margin:0;padding:24px 0 0;display:flex;gap:7px 12px;flex-wrap:wrap;align-items:center;font-size:14px;color:var(--muted)}
.eusep-v2 .nav-item.active>summary{color:var(--blue);box-shadow:inset 0 -3px var(--red)}
.eusep-v2 .breadcrumbs li+li::before{content:"/";color:#7b879d;margin-right:12px}
.eusep-v2 .breadcrumbs a{text-decoration:none}
.eusep-v2 .page-heading{border-bottom:1px solid var(--line);background:var(--pale)}
.eusep-v2 .page-heading-grid{display:grid;grid-template-columns:1fr 210px;align-items:center;gap:30px;padding-block:30px 37px}
.eusep-v2 .page-heading h1{font-size:clamp(30px,3.3vw,41px);margin-bottom:14px}
.eusep-v2 .page-heading p:not(.eyebrow){font-size:19px;color:var(--muted);max-width:810px}
.eusep-v2 .page-illustration{width:210px;border-radius:8px}
.eusep-v2 .page-heading .eyebrow{margin-bottom:11px}
.eusep-v2 .two-paths{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.eusep-v2 .path-panel{padding:28px;border:1px solid var(--line);border-radius:8px;background:#fff;min-width:0}
.eusep-v2 .path-panel h2{font-size:28px;margin-bottom:12px}
.eusep-v2 .path-panel>p{font-size:17px;color:var(--muted);margin-bottom:24px}
.eusep-v2 .path-panel h3{font-size:19px;margin-top:27px;margin-bottom:14px}
.eusep-v2 .path-number{color:var(--red);font-size:13px;font-weight:600;letter-spacing:.07em;margin-bottom:14px}
.eusep-v2 .input-label{display:block;font-size:15px;font-weight:600;color:var(--deep);margin-bottom:8px}
.eusep-v2 .field-row{display:flex;align-items:stretch;gap:10px}
.eusep-v2 .field-row input,.eusep-v2 .field-row select{width:100%;min-width:0;min-height:50px;padding:12px 14px;color:var(--ink);border:1px solid #b7c4d9;border-radius:5px;background:#fff;font-size:16px}
.eusep-v2 .field-row input{flex:1}
.eusep-v2 .field-help{font-size:14px;color:var(--muted);margin-top:10px}
.eusep-v2 .quick-links{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.eusep-v2 .quick-links a{display:flex;align-items:center;justify-content:space-between;text-decoration:none;padding:11px 0;border-bottom:1px solid var(--line);font-size:16px}
.eusep-v2 .quick-links a::after{content:"→";margin-left:8px}
.eusep-v2 .notice{padding:18px 21px;background:var(--pale);border-left:3px solid var(--blue);font-size:16px;color:var(--muted);border-radius:0 5px 5px 0}
.eusep-v2 .notice strong{color:var(--deep);font-weight:600}
.eusep-v2 .notice a{display:inline-block;margin-left:4px}
.eusep-v2 .error-message{font-size:15px;color:#a21d31;margin-top:9px}
.eusep-v2 .directory-layout{display:grid;grid-template-columns:265px 1fr;align-items:start;gap:32px}
.eusep-v2 .filter-panel{padding:24px;background:var(--pale);border:1px solid var(--line);border-radius:7px;min-width:0}
.eusep-v2 .filter-panel h2{font-size:22px;margin-bottom:13px}
.eusep-v2 .filter-panel p{font-size:15px;color:var(--muted);margin-bottom:19px}
.eusep-v2 .filter-panel label{display:block;font-size:15px;color:var(--deep);font-weight:600;margin-bottom:7px}
/* [A-4-132] Champs de recherche du panneau de filtres alignés sur « Rechercher une commune » (.eusep-v2 input) : 50 px,
   bordure #a8b9db, rayon 5 px, marges 12/14 px, 17 px. */
.eusep-v2 .filter-panel input,.eusep-v2 .filter-panel select{display:block;width:100%;min-height:50px;border:1px solid #a8b9db;border-radius:5px;padding:12px 14px;background:#fff;font-size:17px;color:var(--ink);margin-bottom:17px}
.eusep-v2 .filter-panel .twitter-typeahead input,.eusep-v2 .filter-panel .liste-filtrable input{margin-bottom:0}
.eusep-v2 .filter-panel .twitter-typeahead,.eusep-v2 .filter-panel .liste-filtrable{margin-bottom:17px}
.eusep-v2 .secondary-button{display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border:1px solid #b7c4d9;border-radius:5px;background:#fff;color:var(--blue);font:600 16px/1.4 "Source Sans 3",system-ui,sans-serif;min-height:46px;text-decoration:none;cursor:pointer}
.eusep-v2 .filter-panel .secondary-button{width:100%;margin-bottom:21px}
/* [A-4-132] Variante RÉDUITE commune des boutons (primary-button, secondary-button) : action secondaire placée dans un texte
   (« Nous le signaler »). Cible tactile de 36 px, au-dessus du minimum WCAG 2.2 (24 px). */
.eusep-v2 .bouton--reduit{min-height:36px;padding:6px 12px;font-size:15px;line-height:1.3}
/* [A-4-170 2026-10-13] Bouton « Écouter » des sorties IA (T5 ABC-5-33, inséré par scripts-publics/ecouter-ia.js après la mention IA). */
/* [ABC-4-232 2026-10-15] Barre d'actions de la sortie IA (.actions-ia, posée par ecouter-ia.js autour de la mention et du bouton) :
   badge « à titre indicatif » et bouton « Écouter » sur la même ligne, même hauteur, centrés verticalement, un seul écart
   (gap) entre eux et entre les lignes quand ils passent à la ligne (375 px) ; aucune marge au cas par cas dans la barre. */
.eusep-v2{--ecart-actions-ia:12px}
.eusep-v2 .actions-ia{display:flex;flex-wrap:wrap;align-items:stretch;gap:var(--ecart-actions-ia);margin:0 0 12px}
.eusep-v2 .actions-ia>.mention-ia,.eusep-v2 .actions-ia>.ecouter-ia{margin:0}
.eusep-v2 .actions-ia>.mention-ia{display:inline-flex;align-items:center}
.eusep-v2 .ecouter-ia{display:inline-flex;align-items:center;justify-content:center}
.eusep-v2 .result-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}
.eusep-v2 .result-heading h2{font-size:26px}
.eusep-v2 .result-count{font-size:15px;color:var(--muted)}
.eusep-v2 .result-titles h2{margin-bottom:4px}
.eusep-v2 .result-total{font-size:17px;font-weight:600;color:var(--deep);margin:0}
/* [AC-4-125 13/10] Filtre des pages de liste : barre HORIZONTALE pleine largeur au-dessus des résultats (label + champ + bouton sur une
   ligne ; empilés sous 576 px). La mise en page à deux colonnes devient une seule colonne : les résultats prennent toute la largeur. */
.eusep-v2 .directory-layout{grid-template-columns:minmax(0,1fr)}
.eusep-v2 .filter-bar{display:block;padding:18px 24px}
.eusep-v2 .filter-bar h2{font-size:20px;margin-bottom:10px}
.eusep-v2 .filter-bar p{margin-bottom:10px}
.eusep-v2 .filter-bar .filter-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 16px}
.eusep-v2 .filter-bar .filter-form{display:contents}
.eusep-v2 .filter-bar .filter-field{flex:1 1 260px;min-width:0}
.eusep-v2 .filter-bar .filter-action{flex:0 0 auto}
.eusep-v2 .filter-bar input,.eusep-v2 .filter-bar select,.eusep-v2 .filter-bar .twitter-typeahead,.eusep-v2 .filter-bar .liste-filtrable{margin-bottom:0}
.eusep-v2 .filter-bar .secondary-button,.eusep-v2 .filter-bar .primary-button{width:auto;margin-bottom:0;min-height:50px}
@media(max-width:575.98px){.eusep-v2 .filter-bar{padding:16px}.eusep-v2 .filter-bar .filter-row{flex-direction:column;align-items:stretch}.eusep-v2 .filter-bar .filter-field,.eusep-v2 .filter-bar .filter-action{flex:none;width:100%}.eusep-v2 .filter-bar .secondary-button,.eusep-v2 .filter-bar .primary-button{width:100%}}
.eusep-v2 .results-list{display:grid;gap:14px}
.eusep-v2 .result-card{border:1px solid var(--line);border-radius:7px;padding:22px;display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:17px;align-items:start;min-width:0}
.eusep-v2 .result-symbol{width:46px;height:46px;border-radius:7px;background:var(--pale);display:flex;align-items:center;justify-content:center;color:var(--blue);font-size:21px}
.eusep-v2 .result-card h3{font-size:21px;line-height:1.3;margin-bottom:9px;overflow-wrap:anywhere}
.eusep-v2 .result-card h3 a{text-decoration:none}
.eusep-v2 .result-address{font-size:16px;color:var(--muted);line-height:1.5}
.eusep-v2 .result-category{font-size:13px;color:var(--muted);margin-top:11px}
.eusep-v2 .result-open{font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;padding-top:3px}
.eusep-v2 .pagination{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:26px}
.eusep-v2 .pagination a,.eusep-v2 .pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:42px;min-height:43px;border:1px solid var(--line);border-radius:5px;padding:9px 12px;font-size:15px;text-decoration:none}
.eusep-v2 .pagination [aria-current]{color:#fff;background:var(--blue);border-color:var(--blue)}
.eusep-v2 .pagination .ellipsis{border:0;min-width:20px}
.eusep-v2 .empty-results{padding:30px;border:1px solid var(--line);background:var(--pale);border-radius:7px;margin-top:16px}
.eusep-v2 .empty-results h3{font-size:21px;margin-bottom:9px}
.eusep-v2 .empty-results p{font-size:17px;color:var(--muted)}
.eusep-v2 .service-layout{display:grid;grid-template-columns:1.8fr 1fr;gap:30px;align-items:start}
.eusep-v2 .service-name{font-size:clamp(26px,2.5vw,34px);margin-bottom:13px;max-width:930px}
.eusep-v2 .service-meta{font-size:16px;color:var(--muted);margin-bottom:25px}
.eusep-v2 .info-panel{padding:27px 28px;border:1px solid var(--line);border-radius:8px;margin-bottom:23px}
.eusep-v2 .info-panel h3{font-size:24px;margin-bottom:22px}
/* [A-4-170] Synthèse citoyenne du service (T5 A-5-2) : carte du site, grille CSS à la place de la grille Bootstrap, étiquettes et mots-clés aux couleurs du site. */
.eusep-v2 .synthese-grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:28px;align-items:start}
.eusep-v2 .synthese-etiquette{font-size:14px;font-weight:600;color:var(--muted);margin:0 0 8px}
.eusep-v2 .synthese-note p,.eusep-v2 .synthese-texte p{margin:0 0 6px;font-size:17px}
.eusep-v2 .synthese-note p.field-help,.eusep-v2 .synthese-texte p.field-help{font-size:14px;color:var(--muted)}
.eusep-v2 .synthese-mots{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:12px 0;padding:0}
.eusep-v2 .synthese-mots li{padding:3px 12px;border-radius:999px;background:var(--pale);border:1px solid var(--line);color:var(--deep);font-size:15px}
.eusep-v2 .synthese-courbe{margin-top:24px}
@media(max-width:720px){.eusep-v2 .synthese-grille{grid-template-columns:1fr;gap:18px}}
.eusep-v2 .contact-list{margin:0;display:grid;gap:21px}
.eusep-v2 .contact-list dt{font-size:14px;font-weight:600;color:var(--muted);margin-bottom:5px}
.eusep-v2 .contact-list dd{margin:0;font-size:18px;color:var(--deep)}
.eusep-v2 .contact-list address{font-style:normal}
.eusep-v2 .contact-list a{overflow-wrap:anywhere}
.eusep-v2 .contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.eusep-v2 .hours-table{width:100%;border-collapse:collapse;font-size:17px}
.eusep-v2 .hours-table th,.eusep-v2 .hours-table td{text-align:left;padding:14px 0;border-bottom:1px solid var(--line)}
.eusep-v2 .hours-table th{font-weight:600}
.eusep-v2 .data-source{font-size:14px;color:var(--muted);margin-top:18px}
.eusep-v2 .route-panel{background:var(--pale);border-radius:8px;border:1px solid var(--line);overflow:hidden;margin-bottom:23px}
.eusep-v2 .route-panel img{width:100%;aspect-ratio:2.2;object-fit:cover}
.eusep-v2 .route-body{padding:24px}
.eusep-v2 .route-body h3{font-size:23px;margin-bottom:12px}
.eusep-v2 .route-body p{font-size:16px;color:var(--muted);margin-bottom:18px}
.eusep-v2 .rating-callout{background:var(--deep);padding:27px;border-radius:8px;color:#fff}
.eusep-v2 .rating-callout h3{font-size:24px;color:#fff;margin-bottom:12px}
.eusep-v2 .rating-callout p{color:#d6e1f5;font-size:17px;margin-bottom:19px}
.eusep-v2 .rating-callout .primary-button{color:var(--deep);background:#fff;border-color:#fff}
.eusep-v2 .rating-callout .quiet-link{font-size:15px;color:#fff;display:block;margin-top:14px}
.eusep-v2 .evaluation-layout{display:grid;grid-template-columns:1.65fr 1fr;gap:30px;align-items:start}
.eusep-v2 .evaluation-layout.evaluation-layout--message{grid-template-columns:1fr}
.eusep-v2 .evaluation-form-title{font-size:29px;margin-bottom:24px}
.eusep-v2 .evaluation-step{border:1px solid var(--line);border-radius:8px;padding:27px;margin-bottom:17px}
.eusep-v2 .evaluation-step h3{font-size:22px;line-height:1.35;margin-bottom:15px;display:flex;gap:13px}
.eusep-v2 .step-index{color:var(--red);font-size:15px;padding-top:5px}
.eusep-v2 .evaluation-step p{font-size:17px;color:var(--muted)}
.eusep-v2 .account-notice{border-radius:6px;background:var(--pale);padding:22px;margin-top:20px}
.eusep-v2 .account-notice h4{font-size:20px;margin-bottom:10px}
.eusep-v2 .account-notice .primary-button{margin-top:17px}
.eusep-v2 .waiting-step{background:#fafbfd}
.eusep-v2 .waiting-status{display:inline-block;font-size:13px;color:var(--muted);padding:5px 9px;background:#eaf0f8;border-radius:4px;margin-top:15px}
.eusep-v2 .evaluation-help{background:var(--pale);border:1px solid var(--line);border-radius:8px;padding:26px}
.eusep-v2 .evaluation-help h2{font-size:23px;margin-bottom:16px}
.eusep-v2 .evaluation-help p{font-size:16px;color:var(--muted);margin-bottom:15px}
.eusep-v2 .evaluation-help li{padding:12px 0;border-top:1px solid var(--line);font-size:16px}
.eusep-v2 .evaluation-help li a{display:inline-block}
.eusep-v2 .evaluation-help .mini-title{font-size:17px;color:var(--deep);font-weight:600;margin-top:24px}
.eusep-v2 .source-link{font-size:14px;color:var(--muted);margin-top:20px}
@media(max-width:1000px){.eusep-v2 .two-paths{gap:20px}.eusep-v2 .path-panel{padding:24px}.eusep-v2 .field-row{flex-direction:column}.eusep-v2 .directory-layout{gap:22px}.eusep-v2 .filter-panel{padding:20px}.eusep-v2 .result-card{grid-template-columns:40px 1fr;gap:14px}.eusep-v2 .result-open{grid-column:2}.eusep-v2 .result-symbol{width:39px;height:39px}.eusep-v2 .service-layout,.eusep-v2 .evaluation-layout{grid-template-columns:1.5fr 1fr;gap:23px}.eusep-v2 .info-panel,.eusep-v2 .rating-callout,.eusep-v2 .evaluation-step{padding:24px}.eusep-v2 .page-heading-grid{grid-template-columns:1fr 160px}.eusep-v2 .page-illustration{width:160px}.eusep-v2 .steps-overview{gap:10px}}
@media(max-width:720px){.eusep-v2 .page-heading-grid{grid-template-columns:1fr;padding-block:25px 30px}.eusep-v2 .page-illustration{display:none}.eusep-v2 .page-heading h1{font-size:32px}.eusep-v2 .page-heading p:not(.eyebrow){font-size:18px}.eusep-v2 .two-paths,.eusep-v2 .directory-layout,.eusep-v2 .service-layout,.eusep-v2 .evaluation-layout{grid-template-columns:1fr}.eusep-v2 .path-panel{padding:23px 20px}.eusep-v2 .quick-links{gap:0 16px}.eusep-v2 .result-heading{align-items:flex-start;flex-direction:column;gap:9px}.eusep-v2 .result-card{padding:20px 17px;grid-template-columns:1fr}.eusep-v2 .result-symbol{display:none}.eusep-v2 .result-open{grid-column:auto}.eusep-v2 .result-card h3{font-size:20px}.eusep-v2 .filter-panel{padding:22px}.eusep-v2 .filter-panel .secondary-button{margin-bottom:14px}.eusep-v2 .service-name{font-size:27px}.eusep-v2 .evaluation-step{padding:24px 20px}.eusep-v2 .evaluation-step h3{font-size:21px}.eusep-v2 .account-notice{padding:19px}.eusep-v2 .evaluation-help{padding:24px}.eusep-v2 .contact-actions{flex-direction:column}.eusep-v2 .hours-table{font-size:16px}}
/* Connexion et inscription — identité EUSEP v2, styles isolés. */
.eusep-v2 .auth-background{background:#fbfcfe;padding-bottom:16px}
.eusep-v2 .auth-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:60px;align-items:start}
.eusep-v2 .auth-layout.signup{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:42px}
.eusep-v2 .auth-layout>*{min-width:0}
.eusep-v2 .account-intro{padding-top:8px}
.eusep-v2 .account-intro h2{font-size:30px;margin-bottom:19px;max-width:430px}
.eusep-v2 .account-intro>p{color:var(--muted);font-size:18px;max-width:430px;margin-bottom:23px}
.eusep-v2 .account-intro img{width:100%;max-width:390px;border-radius:8px;margin-block:25px}
.eusep-v2 .account-benefits{display:grid;gap:18px;margin-block:25px}
.eusep-v2 .account-benefits li{display:flex;gap:14px;align-items:flex-start}
.eusep-v2 .benefit-index{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:6px;background:#eaf0fc;color:var(--blue);font-size:13px;font-weight:600}
.eusep-v2 .account-benefits strong{display:block;font-size:17px;color:var(--deep);font-weight:600;margin-bottom:3px}
.eusep-v2 .account-benefits p{color:var(--muted);font-size:16px}
.eusep-v2 .account-related{font-size:16px;padding-top:20px;border-top:1px solid var(--line);margin-top:25px}
.eusep-v2 .auth-card{padding:34px;border:1px solid var(--line);border-top:3px solid var(--blue);border-radius:8px;background:#fff;box-shadow:0 8px 28px #10265a06}
.eusep-v2 .auth-card h2{font-size:28px;margin-bottom:10px}
.eusep-v2 .auth-card .auth-description{font-size:16px;color:var(--muted);margin-bottom:27px}
.eusep-v2 .auth-card fieldset{padding:0;margin:0;border:0;min-width:0}
.eusep-v2 .auth-field{margin-bottom:21px;min-width:0}
.eusep-v2 .auth-field label{display:block;font-size:16px;font-weight:600;color:var(--deep);margin-bottom:8px}
.eusep-v2 .auth-field input{display:block;width:100%;min-height:50px;padding:12px 14px;border:1px solid #b7c4d9;border-radius:5px;background:#fff;font-size:17px;color:var(--ink)}
.eusep-v2 .auth-field input::placeholder{color:#65738a;opacity:1}
.eusep-v2 .auth-field input[aria-invalid="true"]{border-color:var(--red)}
.eusep-v2 .password-wrap{position:relative}
.eusep-v2 .password-wrap input{padding-right:93px}
.eusep-v2 .password-toggle{position:absolute;inset-block:7px;right:7px;padding:5px 10px;border:0;border-left:1px solid var(--line);border-radius:0;background:#fff;color:var(--blue);font-size:14px;font-weight:600;cursor:pointer;min-width:78px}
.eusep-v2 .forgot-password{display:block;text-align:right;font-size:15px;margin-top:10px}
.eusep-v2 .auth-submit{width:100%;margin-top:5px}
.eusep-v2 .auth-submit:disabled{cursor:default;opacity:.65}
.eusep-v2 .auth-divider{border-top:1px solid var(--line);padding-top:22px;margin-top:25px;text-align:center;font-size:16px;color:var(--muted)}
.eusep-v2 .auth-divider a{display:block;font-weight:600;margin-top:7px}
.eusep-v2 .auth-section+.auth-section{margin-top:29px;padding-top:26px;border-top:1px solid var(--line)}
.eusep-v2 .auth-section h3{font-size:21px;margin-bottom:22px;display:flex;align-items:baseline;gap:12px}
.eusep-v2 .auth-section h3>span{font-size:14px;color:var(--red)}
.eusep-v2 .auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.eusep-v2 .auth-grid .full-width{grid-column:1/-1}
.eusep-v2 .auth-helper{font-size:14px;color:var(--muted);margin-top:8px}
.eusep-v2 .password-guide{padding:20px;background:var(--pale);border-radius:6px;margin-bottom:8px}
.eusep-v2 .password-guide h4{font-size:17px;margin-bottom:13px}
.eusep-v2 .password-rules{display:grid;gap:8px}
.eusep-v2 .password-rules li{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--muted);line-height:1.45}
.eusep-v2 .rule-icon{width:17px;text-align:center;color:#64748b;flex-shrink:0}
.eusep-v2 .rule-state{font-size:12px;margin-left:auto;white-space:nowrap;color:#64748b}
.eusep-v2 .password-rules .is-met,.eusep-v2 .password-rules .is-met .rule-icon,.eusep-v2 .password-rules .is-met .rule-state{color:#1b654b}
.eusep-v2 .field-error{font-size:14px;color:#a21d31;margin-top:8px}
.eusep-v2 .consent{display:flex;align-items:flex-start;gap:12px;font-size:15px;color:var(--ink);margin-block:18px;line-height:1.55;cursor:pointer}
.eusep-v2 .consent input{flex:0 0 20px;width:20px;min-height:20px;height:20px;padding:0;margin:2px 0 0;accent-color:var(--blue)}
.eusep-v2 .consent a{display:inline}
/* [A-4-131] Case commune : focus clavier visible (le contour suit la case, pas le texte) ; le libellé entier reste cliquable. */
/* La case commune garde son dessin dans un .auth-field (qui style tout label et tout input en bloc pleine largeur). */
.eusep-v2 .auth-field .consent{display:flex;font-size:15px;font-weight:400;color:var(--ink);margin-bottom:0}
.eusep-v2 .auth-field .consent input{display:block;flex:0 0 20px;width:20px;min-height:20px;height:20px;padding:0;margin:2px 0 0}
.eusep-v2 .consent input:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
/* [ABC-4-236] Socle commun des cases à cocher et boutons radio : taille normale (20 px), jamais étirée par une règle de champ
   (width:100 %, padding), couleur de la charte, focus visible. Spécificité NULLE (:where) : les styles propres (.consent, étoiles
   de l'évaluation, form-check-input de Bootstrap) gardent la main ; seul un champ sans style propre reçoit ce socle. */
:where(.eusep-v2) input:where([type="checkbox"], [type="radio"]){width:20px;height:20px;min-height:0;padding:0;flex:0 0 20px;accent-color:var(--blue)}
:where(.eusep-v2) input:where([type="checkbox"], [type="radio"]):focus-visible{outline:3px solid var(--blue);outline-offset:2px}
/* [A-R-137] Espace avant « Se connecter » (ancien style en ligne) ; la case « Se souvenir de moi » garde un espace régulier avec « Mot de passe oublié ? » et le bouton. */
.eusep-v2 #account-form .auth-submit{margin-top:25px}
.eusep-v2 .auth-privacy{font-size:14px;color:var(--muted);margin-top:16px;text-align:center}
.eusep-v2 .preview-banner{font-size:13px;background:#eaf0fa;color:var(--deep);padding-block:9px;border-bottom:1px solid #d3deef}
.eusep-v2 .preview-banner .wrap{display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between}
.eusep-v2 .preview-message{padding:20px;border-left:3px solid var(--blue);border-radius:0 5px 5px 0;background:var(--pale);margin-top:22px;scroll-margin-top:90px}
.eusep-v2 .preview-message h3{font-size:19px;margin-bottom:9px}
.eusep-v2 .preview-message p{font-size:15px;color:var(--muted);margin-bottom:10px}
.eusep-v2 .preview-message a{font-size:15px;font-weight:600}
@media(max-width:1000px){.eusep-v2 .auth-layout{gap:30px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.eusep-v2 .auth-layout.signup{grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:27px}.eusep-v2 .auth-card{padding:27px}.eusep-v2 .auth-grid{grid-template-columns:1fr}.eusep-v2 .account-intro h2{font-size:27px}}
@media(max-width:720px){.eusep-v2 .auth-layout,.eusep-v2 .auth-layout.signup{grid-template-columns:minmax(0,1fr);gap:26px}.eusep-v2 .auth-card{padding:26px 20px;order:0}.eusep-v2 .account-intro{order:1;padding-top:0}.eusep-v2 .account-intro img{max-width:300px}.eusep-v2 .account-intro h2{font-size:26px}.eusep-v2 .auth-card h2{font-size:25px}.eusep-v2 .preview-banner .wrap{justify-content:flex-start}.eusep-v2 .password-guide{padding:17px}.eusep-v2 .rule-state{font-size:11px}.eusep-v2 .password-rules li{font-size:13px}.eusep-v2 .auth-section h3{font-size:20px}.eusep-v2 .auth-background{padding-bottom:0}}
/* Compléments pour la demande de réinitialisation. */
.eusep-v2 .reset-request .auth-submit{white-space:normal;text-align:center}
.eusep-v2 .reset-help{border-top:1px solid var(--line);margin-top:25px;padding-top:20px}
.eusep-v2 .reset-help summary{font-weight:600;font-size:16px;color:var(--deep);cursor:pointer}
.eusep-v2 .reset-help p{font-size:15px;color:var(--muted);margin-top:12px;line-height:1.6}
.eusep-v2 .reset-note{font-size:15px;color:var(--muted);padding-top:18px;border-top:1px solid var(--line);margin-top:23px}

/* --- Adaptations de la maquette aux composants existants (05/10/2026) --- */
/* Titres gardés au niveau d'origine pour le référencement : mêmes styles que la maquette. */
.eusep-v2 .section-heading .section-kicker{font-size:13px;line-height:1.4;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--red);margin-bottom:12px}
.eusep-v2 .section-heading .section-subtitle{font-size:19px;color:var(--blue);margin:14px 0 6px}
.eusep-v2 .tool .tool-title{font-size:24px;margin-bottom:12px;line-height:1.2;font-weight:600;color:var(--deep)}
.eusep-v2 .tool h4{font-size:16px;font-weight:600;line-height:1.45;margin:0}
.eusep-v2 .tool h4 a::after{content:" →"}
.eusep-v2 .service-content h4{font-size:22px;margin-bottom:11px}
.eusep-v2 .city .city-label{display:flex;justify-content:space-between;align-items:center;padding:14px 15px;color:var(--deep);font-size:18px}
.eusep-v2 .city .city-label::after{content:"→";color:var(--blue)}
.eusep-v2 .city h5{font-size:18px;font-weight:600;color:var(--deep);margin:0}
.eusep-v2 .hero h1{text-align:left;border:0;font-size:clamp(32px,3.8vw,48px)}
.eusep-v2 .hero-image{max-height:none}
.eusep-v2 .service-card img,.eusep-v2 .city img{max-height:none}
/* Le contenu de l'accueil commence sous la barre fixe du menu (65 px). */
.eusep-v2 .hero{margin-top:var(--entete-decalage)}
/* Recherche : code postal ou ville, puis service (trois commandes au lieu d'une). */
.eusep-v2 .search-box{grid-template-columns:1fr 1.6fr}
.eusep-v2 .search-form .input-row{flex-wrap:wrap}
.eusep-v2 .search-form .input-row>div{margin:0;min-width:0}
.eusep-v2 .search-form .input-row .typeahead{flex:1 1 220px}
.eusep-v2 .search-form .input-row .champ-service{flex:1.4 1 240px}
.eusep-v2 .search-form .twitter-typeahead{width:100%}
.eusep-v2 .search-form input[type="text"]{width:100%;text-overflow:ellipsis}
.eusep-v2 .search-box .primary-button:disabled{opacity:.6;cursor:not-allowed}
/* [A-4-132] Composant commun liste-filtrable (scripts/composants/liste-filtrable.js) : le champ service est un champ texte
   typeahead, comme « Rechercher une commune » ; il hérite donc de .eusep-v2 input et des listes ci-dessous. Champ inactif =
   même fond que l'ancien Select2 inactif. */
.eusep-v2 .liste-filtrable,.eusep-v2 .liste-filtrable .twitter-typeahead{display:block;width:100%}
.eusep-v2 .liste-filtrable input{width:100%;text-overflow:ellipsis}
.eusep-v2 .liste-filtrable input:disabled{background:#e7edfa;cursor:not-allowed}
/* Listes déroulantes de la recherche : les mêmes pour tous les champs typeahead du site (commune, service, type). */
.eusep-v2 span.twitter-typeahead .tt-menu{min-width:100%;width:max-content;max-width:min(480px,calc(100vw - 48px));max-height:360px;overflow-y:auto;margin-top:6px;padding:6px;color:var(--ink);border:1px solid var(--line);border-radius:8px;box-shadow:0 18px 40px #10265a2e;font-size:16px}
.eusep-v2 span.twitter-typeahead .tt-suggestion{border-radius:4px;white-space:normal;color:var(--ink)}
.eusep-v2 span.twitter-typeahead .tt-suggestion.commune-suggestion{padding:.5rem .65rem}
.eusep-v2 span.twitter-typeahead .tt-suggestion.tt-cursor,.eusep-v2 span.twitter-typeahead .tt-suggestion:hover{background-color:var(--pale);color:var(--ink)}
.commune-suggestion{display:flex;align-items:center;gap:.75rem}
.commune-suggestion__cp{flex:none;min-width:4.2em;text-align:center;font-variant-numeric:tabular-nums;font-weight:600;font-size:14px;color:var(--blue);background:#e7edfa;border-radius:4px;padding:.15rem .45rem}
.commune-suggestion__nom{line-height:1.35}
.commune-suggestion .tt-highlight{font-weight:700;color:var(--deep)}
.commune-suggestion--vide{padding:.5rem .65rem;color:var(--muted);font-style:italic}
.liste-filtrable__option--neutre{color:var(--muted);font-style:italic}
.accueil-recherche .select2-container--open .select2-dropdown{min-width:100%;max-width:min(520px,calc(100vw - 48px));margin-top:6px;color:var(--ink);border:1px solid var(--line);border-radius:8px;box-shadow:0 18px 40px #10265a2e;overflow:hidden}
.accueil-recherche .select2-results__options{max-height:340px!important;padding:6px}
.accueil-recherche .select2-results__option{padding:.5rem .7rem;border-radius:4px;white-space:normal;line-height:1.35;font-size:16px}
.accueil-recherche .select2-results__option:first-child{color:var(--muted);font-style:italic}
.accueil-recherche .select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:var(--pale);color:var(--ink)}
.accueil-recherche .select2-container--default .select2-results__option[aria-selected=true]{background-color:var(--blue);color:#fff;font-style:normal}
.accueil-recherche .select2-search--dropdown .select2-search__field{border:1px solid var(--line);border-radius:4px;padding:.45rem .6rem;min-height:0}
/* Pied de page : la règle générale « footer » d'avant (dégradé, décalage) ne s'applique plus. */
.eusep-v2 footer.footer{position:relative;top:var(--entete-decalage);border-top:0;padding-bottom:0;font-weight:400}
body:has(.eusep-v2 .hero) .eusep-v2 footer.footer{top:0}
.eusep-v2 .footer ul li a:hover{padding-left:0}
.eusep-v2 .footer-logo{display:inline-block;background:#fff;border-radius:6px;padding:6px 10px;margin-bottom:14px}
.eusep-v2 .footer-logo img{height:44px;width:auto}
.eusep-v2 .footer h3{font-weight:600}
@media(max-width:720px){.eusep-v2 .search-box{grid-template-columns:1fr}}
.eusep-v2 .search-form .input-row .typeahead{flex:1 1 170px}
.eusep-v2 .search-form .input-row .champ-service{flex:1.5 1 190px}
.eusep-v2 .search-form .input-row .primary-button{flex:none}

/* [hors-planning 2026-10-05 · Claude Opus 5.5] Pages de connexion, d'inscription
 * et de réinitialisation (maquettes du client) : règles d'abord posées dans des
 * blocs <style> des gabarits — sans nonce, la CSP les refuse — regroupées ici.
 * La page commence sous la barre de menu fixe (65 px), comme l'accueil ; les
 * règles de mot de passe gardent les classes lues par password-rules.js. */
.eusep-v2 .page-heading { margin-top: var(--entete-decalage); }
.eusep-v2 .alert-custom-info { color: #000000; background-color: #FFA500; border-color: #bee5eb; }
.eusep-v2 .auth-card .alert { margin-bottom: 20px; font-size: 16px; }
.eusep-v2 .auth-card .nouveau-code { display: block; margin-top: 18px; text-align: center; font-size: 16px; }
/* [ABC-4-239] « Envoyer un nouveau code » est un bouton (POST + jeton), plus un lien : même rendu que le lien d'avant. */
.eusep-v2 .auth-card button.nouveau-code { width: 100%; padding: 0; border: 0; background: none; color: var(--blue); font-family: inherit; line-height: inherit; text-underline-offset: 4px; cursor: pointer; }
.eusep-v2 .auth-card button.nouveau-code:hover { text-decoration: underline; }
.eusep-v2 .password_rules { margin-top: 0; padding: 0; background: transparent; }
.eusep-v2 .password_rules h4 { font-size: 20px; margin-bottom: 12px; }
.eusep-v2 .password_rules p { font-size: 16px; margin: 0 0 6px; }
.eusep-v2 .password-rules li::before { content: none; }
/* Compléments demandés par les pages de l'annuaire. */
.eusep-v2 .primary-button:disabled{opacity:.6;cursor:not-allowed}
/* Une page déjà écartée du menu par « .main » (top: 65px) ne s'écarte pas deux fois. */
.eusep-v2.main .page-heading{margin-top:0}
/* Fiche service : la carte Google gardée dans l'encadré « S'y rendre » de la maquette. */
.eusep-v2 .route-panel .carte-service{min-height:260px;border:0;margin:0;border-bottom:1px solid var(--line)}
/* [ABC-4-8] Composant d'adresse : liste de propositions alignée sur celle de la recherche de commune. */
.eusep-v2 .adresse-recherche{position:relative}
.eusep-v2 .adresse-liste{position:absolute;left:0;right:0;z-index:30;margin:2px 0 0;padding:6px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 18px 40px #10265a2e;max-height:340px;overflow:auto}
.eusep-v2 .adresse-liste[hidden]{display:none}
.eusep-v2 .adresse-suggestion{padding:.5rem .65rem;border-radius:4px;cursor:pointer;color:var(--ink)}
.eusep-v2 .adresse-suggestion:hover,.eusep-v2 .adresse-suggestion--active{background-color:var(--pale)}
.eusep-v2 .adresse-statut{font-size:14px;color:var(--muted);margin:6px 0 0}

/* [hors-planning ABC-4-19 2026-10-06] Photo de profil de l'en-tête : taille fixe, ronde. */
.entete-avatar {
    display: inline-flex;
    align-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
}
.entete-avatar-photo,
.entete-avatar-pastille {
    width: 36px;
    height: 36px;
    border-radius: 50%;
}
.entete-avatar-photo {
    object-fit: cover;
    border: 1px solid var(--v2-trait);
}
.entete-avatar-pastille {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--v2-bleu);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
}
@media (max-width: 991.98px) {
    .entete-avatar {
        margin: .4rem auto 0 !important;
    }
}

/* Message 19, point 6 : une heure (« 14:35 ») tient toujours sur une seule ligne. */
.heure { white-space: nowrap; }

/* [hors-planning ABC-4-47 · G24] Champ obligatoire : astérisque rouge (contraste AA sur fond clair) et légende commune. */
.champ-obligatoire { color: #b02a37; font-weight: 700; }
.legende-obligatoire { font-size: .875rem; margin-bottom: 1rem; }
/* [A-4-132] Liste filtrable dans une rangée champ + bouton (annuaire : catégorie, département, région). */
.eusep-v2 .field-row>.liste-filtrable{flex:1;min-width:0}

/* [ABC-4-152] Page du second facteur : carte compacte, centrée, champ de code en avant, actions secondaires discrètes. */
/* Sans bandeau de titre, la carte se place elle-même sous la barre fixe (65 px, comme .page-heading). */
.eusep-v2 .auth-layout--compact{display:block;max-width:460px;margin-inline:auto;padding-block:89px 24px}
.eusep-v2 .auth-card--compacte{padding:24px}
.eusep-v2 .auth-card--compacte h1{font-size:26px;margin-bottom:8px}
.eusep-v2 .auth-card--compacte .auth-description{font-size:16px;margin-bottom:16px}
.eusep-v2 .auth-card--compacte .code-2fa{width:100%;font-size:24px;letter-spacing:.25em;text-align:center}
.eusep-v2 .auth-card--compacte .auth-field{margin-bottom:12px}
.eusep-v2 .auth-card--compacte .auth-submit{width:100%}
.eusep-v2 .qr-compact{margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid var(--line);text-align:center}
.eusep-v2 .renvoi-code{margin:12px 0 0;text-align:center}
.eusep-v2 .qr-compact h2{font-size:16px;margin-bottom:8px}
.eusep-v2 .qr-compact [data-qr-image] svg{width:150px;height:150px}
.eusep-v2 .qr-compact p{font-size:14px;margin:6px 0 0;color:var(--muted)}
.eusep-v2 .actions-secondaires{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;margin-top:16px;font-size:14px}
.eusep-v2 .actions-secondaires form{margin:0}
.eusep-v2 .lien-discret{padding:0;border:0;background:none;color:var(--blue);font:inherit;text-decoration:underline;cursor:pointer}
@media(max-width:720px){.eusep-v2 .auth-card--compacte{padding:20px 16px}.eusep-v2 .qr-compact [data-qr-image] svg{width:130px;height:130px}}

/* [ABC-4-269] Cloche des notifications (menu) et alerte en direct. */
.cloche-notifications { position: relative; }
.cloche-notifications__lien { position: relative; display: inline-flex; align-items: center; padding: .25rem .5rem; color: inherit; text-decoration: none; font-size: 1.15rem; }
.cloche-notifications__compteur { position: absolute; top: -.1rem; right: -.1rem; min-width: 1.15rem; padding: 0 .3rem; border-radius: 999px; background: #b3261e; color: #fff; font-size: .72rem; line-height: 1.15rem; font-weight: 700; text-align: center; }
.cloche-notifications__compteur[hidden] { display: none; }
.alerte-en-direct { position: fixed; top: 8.5rem; right: 1rem; z-index: 2000; display: flex; flex-direction: column; gap: .5rem; max-width: min(24rem, calc(100vw - 2rem)); pointer-events: none; }
.alerte-en-direct__carte { pointer-events: auto; display: flex; align-items: flex-start; gap: .5rem; padding: .75rem 1rem; background: #fff; color: #1b1b1b; border: 1px solid #0b3a75; border-left-width: .35rem; border-radius: .35rem; box-shadow: 0 .25rem 1rem rgba(0, 0, 0, .2); }
.alerte-en-direct__texte { display: flex; flex-direction: column; flex: 1; color: inherit; text-decoration: none; }
.alerte-en-direct__texte:hover strong, .alerte-en-direct__texte:focus strong { text-decoration: underline; }
.alerte-en-direct__fermer { border: 0; background: transparent; font-size: 1.4rem; line-height: 1; cursor: pointer; color: inherit; }
@media (max-width: 991.98px) { .alerte-en-direct { top: 5rem; } }

/* [ABC-4-264] Pictogramme de la fiche d'un service public, sous le titre. */
.eusep-v2 .service-visuel{display:block;width:96px;height:96px;max-width:100%;margin:0 0 1rem;border-radius:12px;object-fit:contain}
@media (max-width:575.98px){.eusep-v2 .service-visuel{width:72px;height:72px}}

/* [A-R-44 · G42] Rappel des critères appliqués d'une page de liste de l'annuaire (même rendu que celui des listes de données). */
.eusep-v2 .page-heading p.rappel-criteres { font-size: 16px; font-weight: 600; color: var(--deep); margin: 6px 0 0; max-width: none; }

/* [A-R-144 V26] Accueil : onglets de recherche, repères nationaux, courbe de population, thèmes, participation, association. */
.eusep-v2 .onglets-recherche { display: flex; gap: .5rem; margin-bottom: .75rem; }
.eusep-v2 .onglets-recherche [role=tab] { border: 1px solid #c9d7ea; background: #fff; color: #17325c; border-radius: 999px; padding: .5rem 1.1rem; font-weight: 600; cursor: pointer; }
.eusep-v2 .onglets-recherche [role=tab][aria-selected=true] { background: #17325c; color: #fff; border-color: #17325c; }
.eusep-v2 .cartes-reperes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.eusep-v2 .carte-repere { background: linear-gradient(180deg, #fff, #eef4fc); border: 1px solid #d6e2f3; border-radius: 16px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1.1rem; display: flex; flex-direction: column; gap: .35rem; }
.eusep-v2 .carte-repere strong { font-size: 1.5rem; color: #17325c; }
.eusep-v2 .pastille { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #dbe8fa; font-size: 1.25rem; }
.eusep-v2 .courbe-aire { width: 100%; height: 200px; background: linear-gradient(180deg, #f4f8fd, #e6effa); border-radius: 16px; }
.eusep-v2 .courbe-aire .aire { fill: rgba(44, 100, 180, .35); stroke: #2c64b4; stroke-width: 2; }
.eusep-v2 .cartes-themes { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; }
.eusep-v2 .cartes-themes a { display: flex; align-items: center; gap: .75rem; background: #fff; border: 1px solid #d6e2f3; border-radius: 16px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1rem; font-weight: 600; text-decoration: none; }
.eusep-v2 .actions-participation { display: flex; flex-wrap: wrap; gap: .75rem; }
.eusep-v2 .engagements { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.eusep-v2 .engagements li { background: #eef4fc; border-radius: 16px; padding: 1rem; }
.eusep-v2 .engagements strong { display: block; color: #17325c; }
#association, #participation { background: linear-gradient(180deg, #fff, #f1f6fd); }

/* [A-R-144] Quatre graphiques « données publiques » (V26), cadre Vie locale (V30), fiche de service (V31), météo et lieux de soins de la fiche commune (V27). */
.eusep-v2 .donnees-publiques__graphiques { margin-top: 1rem; }
.eusep-v2 .donnees-publiques__graphiques .chiffres-cles__carte h3 { font-size: 1.1rem; color: #17325c; }
.eusep-v2 .nuage-dvf svg { width: 100%; height: auto; max-height: 260px; background: linear-gradient(180deg, #f4f8fd, #e6effa); border-radius: 12px; color: #2c64b4; }
.eusep-v2 .chiffres-cles__voir a { margin-right: .75rem; }
.eusep-v2 .vl30-bandeau { background: linear-gradient(180deg, #fff, #eef4fc); border: 1px solid #d6e2f3; border-radius: 16px; padding: 1rem; margin-bottom: 1rem; }
.eusep-v2 .vl30-bandeau form.selecteur { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; }
.eusep-v2 .vl30-bandeau form.selecteur .form-control { flex: 1 1 260px; }
.eusep-v2 .vl30-indicateurs { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.eusep-v2 .vl30-indicateurs li { background: #fff; border: 1px solid #d6e2f3; border-radius: 16px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1rem; }
.eusep-v2 .vl30-indicateurs strong { display: block; font-size: 1.4rem; color: #17325c; }
.eusep-v2 .vl30-courbe svg { width: 100%; height: auto; max-height: 240px; color: #2c64b4; background: linear-gradient(180deg, #f4f8fd, #e6effa); border-radius: 12px; }
.eusep-v2 .vl30-sources ul { margin: 0; padding-left: 1.2rem; }
.eusep-v2 .v31-badge { display: inline-block; background: #17325c; color: #fff; border-radius: 999px; padding: .2rem .8rem; font-weight: 600; margin-right: .5rem; }
.eusep-v2 .v31-onglets { position: sticky; top: 0; z-index: 5; background: #fff; border-bottom: 1px solid #d6e2f3; margin: 1rem 0; }
.eusep-v2 .v31-onglets ul { display: flex; gap: .5rem; margin: 0; padding: .5rem 0; list-style: none; overflow-x: auto; }
.eusep-v2 .v31-onglets a { white-space: nowrap; border: 1px solid #c9d7ea; border-radius: 999px; padding: .35rem .9rem; text-decoration: none; color: #17325c; font-weight: 600; }
.eusep-v2 .v31-sections > div > section { scroll-margin-top: 4.5rem; margin-bottom: 1rem; }
.eusep-v2 .fiche-commune__rubrique ul.lieux { margin: .5rem 0; padding-left: 1.2rem; }

/* [A-R-144 V27] Fiche commune : cartes de services et repères en grille (la classe .carte-service des cartes de services n'est pas une carte géographique). */
.fiche-commune__rubrique .cartes-services, .fiche-commune__rubrique .fiche-commune__pictos, .fiche-commune__rubrique .cartes-poursuivre {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.75rem;
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
}
.fiche-commune__rubrique .cartes-services > .carte-service {
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.fiche-commune__rubrique .fiche-commune__pictos > li { display: flex; flex-direction: column; }
.fiche-commune__rubrique .cartes-poursuivre a { display: flex; flex-direction: column; text-decoration: none; }

/* [A-R-144 étape 1, 27/10/2026] Maquette V26 — en-tête, bandeau, recherche (nos couleurs, nos composants).
   En-tête : à partir de 1200 px, logo, signature, sept libellés courts, loupe et compte sur UNE ligne
   (la deuxième ligne des libellés et l'icône maison disparaissent : le logo ramène à l'accueil). */
@media (min-width: 1200px) { .navbar-signature { display: block; max-width: 180px; font-size: 14px; color: var(--v2-doux); } }
.entete-sp .entete-compte { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0 !important; border-radius: 50%; font-size: 20px; }
.recherche-site.loupe-repliee { width: auto; }
.recherche-site.loupe-repliee input[type="search"] { display: none; }
.recherche-site.loupe-repliee button { flex: 0 0 42px; width: 42px; border-radius: 50%; color: var(--v2-nuit); background: transparent; border-color: transparent; }
.recherche-site.loupe-repliee button:hover { color: #fff; }
@media (min-width: 1200px) {
    .navbar-custom.entete-sp { flex-direction: row; align-items: center; padding: 0 var(--entete-marge); }
    .entete-sp .entete-haut { display: contents; }
    .entete-sp .navbar-brand { order: 1; }
    .entete-sp #menu-principal { order: 2; display: flex !important; flex: 1 1 auto; justify-content: flex-end; padding: 0; border-top: 0; }
    .entete-sp .entete-recherche { order: 3; flex: 0 0 auto; margin-left: .5rem !important; }
    .entete-sp #menu-contact-profile-container { flex: 0 0 auto; }
    .entete-sp #menu-profile { padding-left: .25rem !important; }
    .entete-sp #menu-contact-profile-container { order: 4; flex: 0 0 auto; }
    .entete-sp .entete-accueil { display: none; }
    .entete-sp .entree-ligne + .entree-ligne { display: none; }
    .entete-sp .entete-menu > .nav-item > .nav-link { padding: 1.4rem .6rem; font-size: 15px; }
    .entete-sp .recherche-site:not(.loupe-repliee) { max-width: 260px; }
}
/* Bandeau (corrections du 27/10, points 3 et 4) : titre de la maquette sur deux lignes à gauche ; la scène occupe la moitié
   droite, de l'en-tête jusque derrière la carte de recherche, et se fond dans le fond (dégradé sur ses bords, ni cadre ni arrondi). */
.eusep-v2 .hero { position: relative; overflow: hidden; background: linear-gradient(180deg, #f3f9fe 0%, #e8f4fc 72%, #fff 100%); border-bottom: 0; }
.eusep-v2 .hero-grid { position: relative; z-index: 1; display: block; padding-block: 56px 150px; }
.eusep-v2 .hero-texte { max-width: 50%; }
.eusep-v2 .hero h1 { font-size: clamp(36px, 4.9vw, 64px); line-height: 1.04; letter-spacing: -.01em; margin-bottom: 16px; }
.eusep-v2 .hero h1 .ligne-titre { display: block; white-space: nowrap; }
.eusep-v2 .hero-description { font-size: 22px; max-width: 440px; }
.eusep-v2 .hero-scene { position: absolute; z-index: 0; top: 0; right: 0; width: 58%; height: 100%; object-fit: cover; object-position: left bottom; border-radius: 0;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 24%), linear-gradient(to bottom, transparent 0, #000 12%, #000 82%, transparent 100%);
    -webkit-mask-composite: source-in; mask-image: linear-gradient(to right, transparent 0, #000 24%), linear-gradient(to bottom, transparent 0, #000 12%, #000 82%, transparent 100%); mask-composite: intersect; }
/* Recherche (points 1, 2, 5, 6) : carte blanche à cheval sur le bas du bandeau, onglets collés à la carte, bouton plein bleu. */
.eusep-v2 .search-section { position: relative; z-index: 2; margin-top: -104px; padding-block: 0 12px; }
.eusep-v2 .carte-recherche { filter: drop-shadow(0 14px 28px #10265a1f); }
.eusep-v2 .onglets-recherche { display: flex; gap: 0; margin: 0; }
.eusep-v2 .onglets-recherche [role=tab] { display: inline-flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 30px; border: 1px solid #d5e2f1; border-bottom: 0; border-radius: 10px 10px 0 0; background: #ffffffb3; color: #34415f; font-size: 19px; font-weight: 500; cursor: pointer; }
.eusep-v2 .onglets-recherche [role=tab] + [role=tab] { margin-left: -1px; }
.eusep-v2 .onglets-recherche [role=tab][aria-selected=true] { position: relative; z-index: 1; background: #fff; color: var(--blue); font-weight: 600; border-color: var(--blue); border-top-width: 2px; margin-bottom: -1px; }
.eusep-v2 .onglets-recherche [role=tab] svg { flex: none; }
.eusep-v2 #recherche .search-box { display: block; background: #fff; color: var(--ink); border-radius: 0 10px 10px 10px; padding: 26px 32px 22px; }
.eusep-v2 #recherche .search-box label { color: var(--deep); font-weight: 600; font-size: 17px; }
.eusep-v2 .recherche-service, .eusep-v2 .recherche-commune { display: grid; grid-template-columns: 1fr 1fr auto; gap: 16px 20px; align-items: end; }
.eusep-v2 .recherche-commune { grid-template-columns: 1fr auto; }
.eusep-v2 .champ-recherche { min-width: 0; }
.eusep-v2 .champ-recherche .twitter-typeahead { width: 100%; }
.eusep-v2 .champ-recherche input[type="text"] { width: 100%; }
.eusep-v2 .champ-recherche .ts-wrapper { min-height: 50px; }
.eusep-v2 .champ-recherche .ts-control { min-height: 50px; font-size: 17px; }
.eusep-v2 .champ-recherche .form-error-message, .eusep-v2 .champ-recherche .invalid-feedback, .eusep-v2 .champ-recherche ul { color: #b42318; display: block; margin: 6px 0 0; padding: 0; list-style: none; }
.eusep-v2 .actions-recherche { display: flex; flex-direction: column; gap: 10px; }
.eusep-v2 #recherche .search-box .primary-button, .eusep-v2 #recherche .search-box .primary-button:disabled { background: var(--blue); border-color: var(--blue); color: #fff; opacity: 1; cursor: pointer; min-width: 230px; }
.eusep-v2 #recherche-annuaire .primary-button::after { content: "→"; margin-left: 10px; font-size: 18px; line-height: 1; }
.eusep-v2 #recherche .search-box .primary-button:hover { background: var(--deep); border-color: var(--deep); }
.eusep-v2 .actions-recherche .btn-outline-primary { min-height: 50px; font-size: 16px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; background: #fff; color: var(--blue); border-color: var(--blue); }
.eusep-v2 .actions-recherche .btn-outline-primary:hover { background: var(--pale); color: var(--deep); }
.eusep-v2 .message-recherche { grid-column: 1 / -1; margin: 0; color: #b42318; font-weight: 600; }
.eusep-v2 #recherche .search-actions { margin-top: 10px; }
.eusep-v2 #recherche .search-actions p { margin: 0; color: var(--muted); font-size: 15px; }
.eusep-v2 #recherche .search-actions a { color: var(--blue); }
@media (max-width: 900px) { .eusep-v2 .recherche-service, .eusep-v2 .recherche-commune { grid-template-columns: 1fr; } }
@media (max-width: 720px) {
    .eusep-v2 .hero-grid { padding-block: 28px 210px; }
    .eusep-v2 .hero-texte { max-width: none; }
    .eusep-v2 .hero h1 .ligne-titre { white-space: normal; }
    .eusep-v2 .hero-description { font-size: 18px; }
    .eusep-v2 .hero-scene { top: auto; bottom: 0; width: 100%; height: 300px; object-position: center bottom;
        -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 35%, #000 85%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 35%, #000 85%, transparent 100%); }
    .eusep-v2 .search-section { margin-top: -70px; }
    .eusep-v2 .onglets-recherche [role=tab] { flex: 1 1 50%; justify-content: center; padding: 0 10px; font-size: 15px; gap: 6px; min-height: 52px; }
    .eusep-v2 #recherche .search-box { padding: 20px 16px; border-radius: 0 0 10px 10px; }
    .eusep-v2 #recherche .search-box .primary-button { min-width: 0; width: 100%; }
}
@media (max-width: 991.98px) {
    /* [A-R-144 étape 1] Loupe repliée sur la ligne du logo (à côté du compte et du menu) ; dépliée, le champ prend la ligne suivante. */
    .entete-sp .entete-haut .recherche-site.loupe-repliee { order: 1; flex: 0 0 auto; margin-left: auto !important; }
    #main-menu.entete-sp .recherche-site.loupe-repliee ~ #menu-contact-profile-container { order: 1; margin-left: 0; }
}

/* [A-R-144 étape 2] « La France et ses territoires » et « Évolution de la population en France » au plus près de la maquette V26 :
   quatre cartes en ligne (icône ronde à gauche, chiffre en grand, précision, source en petit), courbe dans une carte, tableau replié. */
.eusep-v2 #reperes-nationaux .cartes-reperes { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.eusep-v2 #reperes-nationaux .carte-repere { flex-direction: row; align-items: center; gap: .9rem; background: #fff; border-radius: 12px; padding: 1.1rem 1rem; }
.eusep-v2 #reperes-nationaux .pastille { flex: 0 0 3.8rem; width: 3.8rem; height: 3.8rem; background: #e7effb; color: #2c64b4; }
.eusep-v2 #reperes-nationaux .corps { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.eusep-v2 #reperes-nationaux .libelle { font-weight: 600; color: #17325c; font-size: 1rem; }
.eusep-v2 #reperes-nationaux .chiffre { font-size: 2rem; line-height: 1.2; color: #17325c; }
.eusep-v2 #reperes-nationaux .chiffre .ligne { display: block; font-size: .95rem; font-weight: 400; }
.eusep-v2 #reperes-nationaux .chiffre .ligne b { font-size: 1.75rem; font-weight: 700; margin-right: .2rem; }
.eusep-v2 #reperes-nationaux .precision { color: #4a5a72; font-size: .92rem; }
.eusep-v2 #reperes-nationaux .source, .eusep-v2 #population-france .source { font-size: .78rem; color: #6b7a90; }
.eusep-v2 #population-france .carte-courbe { background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1.25rem 1.5rem 1rem; }
.eusep-v2 #population-france .section-heading { margin-bottom: .5rem; }
.eusep-v2 #population-france .trace { display: flex; align-items: center; gap: .5rem; }
.eusep-v2 #population-france .axe-titre { flex: 0 0 6rem; margin: 0; font-size: .85rem; color: #4a5a72; line-height: 1.3; }
.eusep-v2 #population-france .axe-titre span { display: block; }
.eusep-v2 #population-france .courbe-population { flex: 1 1 auto; width: 100%; min-width: 0; height: auto; overflow: visible; }
.eusep-v2 .courbe-population .grille { stroke: #e3e9f2; stroke-width: 1; }
.eusep-v2 .courbe-population .graduation, .eusep-v2 .courbe-population .annee { font-size: 13px; fill: #4a5a72; }
.eusep-v2 .courbe-population .aire { fill: url(#degrade-population); stroke: none; }
.eusep-v2 .courbe-population .ligne { fill: none; stroke: #2c64b4; stroke-width: 2.2; }
.eusep-v2 .courbe-population .point { fill: #2c64b4; stroke: #fff; stroke-width: 1.5; }
.eusep-v2 .courbe-population .valeur { font-size: 15px; font-weight: 700; fill: #17325c; }
.eusep-v2 #population-france [data-affichage=tableau-replie]:not(:target) { display: none; }
.eusep-v2 #population-france .pied-courbe { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1.5rem; margin-top: .5rem; }
.eusep-v2 #population-france .liens { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0; }
.eusep-v2 #population-france .liens a { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; text-decoration: none; }
.eusep-v2 #population-france .liens a::after { content: "→"; }
@media (max-width: 991.98px) { .eusep-v2 #reperes-nationaux .cartes-reperes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) {
  .eusep-v2 #reperes-nationaux .cartes-reperes { grid-template-columns: 1fr; }
  .eusep-v2 #population-france .trace { flex-direction: column; align-items: stretch; }
  /* les six points restent visibles : textes du tracé agrandis en unités du dessin (1000 de large ramené à ~330 px) */
  .eusep-v2 .courbe-population .valeur { font-size: 34px; }
  .eusep-v2 .courbe-population .annee { font-size: 30px; }
  .eusep-v2 .courbe-population .graduation { display: none; } /* trop serrées sur 375 px : la valeur de chaque point suffit */
  .eusep-v2 .courbe-population .point { r: 9px; }
  .eusep-v2 .courbe-population .ligne { stroke-width: 4; }
  .eusep-v2 #population-france .liens { justify-content: flex-end; }
  .eusep-v2 #population-france .axe-titre { flex: none; }
  .eusep-v2 #population-france .carte-courbe { padding: 1rem .75rem; }
}
.eusep-v2 #population-france.section { padding-top: 0; } /* la carte de la courbe suit les cartes de repères, comme sur la maquette */
/* [A-R-144 étape 2, corrections du 27/10] Au plus près de la maquette : titres de section grands et gras (en proportion du titre
   du bandeau), grands disques bleu clair à pictogramme bleu franc, chiffres grands et gras, aire de la courbe d'un bleu plus franc. */
.eusep-v2 #reperes-nationaux .cartes-reperes { gap: .75rem; }
.eusep-v2 #reperes-nationaux .carte-repere { padding: 1rem .75rem; gap: .7rem; }
.eusep-v2 #reperes-nationaux .pastille { flex: 0 0 5rem; width: 5rem; height: 5rem; background: #e3edfc; color: #1f63d6; }
.eusep-v2 #reperes-nationaux .pastille svg { width: 2.9rem; height: 2.9rem; }
.eusep-v2 #reperes-nationaux .pastille svg [stroke] { stroke-width: 2.4; }
.eusep-v2 #reperes-nationaux .libelle { font-size: 1.02rem; font-weight: 700; }
.eusep-v2 #reperes-nationaux .chiffre { font-size: 1.95rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; white-space: nowrap; }
.eusep-v2 #reperes-nationaux .chiffre .ligne { font-size: 1rem; white-space: nowrap; }
.eusep-v2 #reperes-nationaux .chiffre .ligne b { font-size: 1.85rem; font-weight: 800; }
.eusep-v2 #reperes-nationaux .precision { font-size: .98rem; color: #3f4f66; }
.eusep-v2 .courbe-population stop:first-child { stop-color: #3b7fe8; stop-opacity: .55; }
.eusep-v2 .courbe-population stop:last-child { stop-color: #3b7fe8; stop-opacity: .14; }
.eusep-v2 .courbe-population .ligne { stroke: #1f63d6; }
.eusep-v2 .courbe-population .point { fill: #1f63d6; }
/* [A-R-144 étape 3] « Comprendre les données publiques » et « Repères par région » au plus près de la maquette V26, aux tailles validées à
   l'étape 2 : titres grands et gras, quatre cartes repères en ligne (grand disque bleu clair, chiffre grand et gras), quatre cartes graphiques
   en grille 2×2 (barres bleues franches, dépenses en rouge, nuage bleu semi-transparent), liens Tableau / Méthode / Détails en bas,
   tableau des régions à en-tête bleu très clair. */
.eusep-v2 #donnees-publiques .cartes-reperes { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.eusep-v2 #donnees-publiques .carte-repere { flex-direction: row; align-items: center; gap: .7rem; background: #fff; border-radius: 12px; padding: 1rem .75rem; }
.eusep-v2 #donnees-publiques .pastille { flex: 0 0 5rem; width: 5rem; height: 5rem; background: #e3edfc; color: #1f63d6; }
.eusep-v2 #donnees-publiques .pastille svg { width: 2.9rem; height: 2.9rem; }
.eusep-v2 #donnees-publiques .pastille svg [stroke] { stroke-width: 2.4; }
.eusep-v2 #donnees-publiques .corps { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.eusep-v2 #donnees-publiques .libelle { color: #17325c; font-size: 1.02rem; font-weight: 700; }
.eusep-v2 #donnees-publiques .chiffre { font-size: 1.95rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; color: #17325c; white-space: nowrap; }
.eusep-v2 #donnees-publiques .precision { font-size: .98rem; color: #3f4f66; }
.eusep-v2 #donnees-publiques .source, .eusep-v2 #reperes-regions .source { font-size: .78rem; color: #6b7a90; }
.eusep-v2 #donnees-publiques .donnees-publiques__graphiques { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.eusep-v2 #donnees-publiques .carte-graphique { display: flex; flex-direction: column; background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1.1rem 1.25rem .85rem; }
.eusep-v2 #donnees-publiques .carte-graphique h3 { font-size: 1.6rem; font-weight: 800; letter-spacing: -.01em; color: #17325c; margin: 0; }
.eusep-v2 #donnees-publiques .carte-graphique .sous-titre { color: #4a5a72; font-size: .95rem; margin: .15rem 0 .5rem; }
.eusep-v2 #donnees-publiques .carte-graphique .vide { flex: 1 1 auto; }
.eusep-v2 .trace-accueil { width: 100%; height: auto; overflow: visible; }
.eusep-v2 .trace-accueil .grille { stroke: #e3e9f2; stroke-width: 1; }
.eusep-v2 .trace-accueil .axe { stroke: #9aa8bc; stroke-width: 1; }
.eusep-v2 .trace-accueil .graduation, .eusep-v2 .trace-accueil .etiquette { font-size: 11px; fill: #4a5a72; }
.eusep-v2 .trace-accueil .axe-titre { font-size: 11px; fill: #4a5a72; }
.eusep-v2 .trace-accueil .barre { fill: #2f7de1; }
.eusep-v2 .trace-accueil .barre--negative { fill: #f25c5c; }
.eusep-v2 .trace-accueil .valeur { font-size: 13px; font-weight: 800; fill: #17325c; }
.eusep-v2 .trace-accueil .valeur--negative { fill: #c62828; }
.eusep-v2 .trace-accueil .point { fill: #2f7de1; fill-opacity: .55; }
.eusep-v2 #donnees-publiques [data-affichage=tableau-replie]:not(:target) { display: none; }
.eusep-v2 #donnees-publiques .carte-graphique .liens { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1rem; margin: auto 0 0; padding-top: .5rem; }
.eusep-v2 #donnees-publiques .carte-graphique .liens a { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; text-decoration: none; }
.eusep-v2 #donnees-publiques .carte-graphique .liens a::after { content: "→"; }
.eusep-v2 #reperes-regions .tableau-regions { border: 1px solid #d6e2f3; border-radius: 10px; overflow: hidden; }
.eusep-v2 #reperes-regions .tableau-regions thead th { background: #eaf2fc; color: #17325c; font-weight: 700; border-bottom: 1px solid #d6e2f3; }
.eusep-v2 #reperes-regions .tableau-regions tbody th, .eusep-v2 #reperes-regions .tableau-regions td { background: #fff; color: #17325c; border-bottom: 1px solid #e8eef6; font-weight: 400; }
.eusep-v2 #reperes-regions .tableau-regions tbody th { font-weight: 600; }
@media (max-width: 991.98px) { .eusep-v2 #donnees-publiques .cartes-reperes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) {
  .eusep-v2 #donnees-publiques .cartes-reperes, .eusep-v2 #donnees-publiques .donnees-publiques__graphiques { grid-template-columns: 1fr; }
  .eusep-v2 .trace-accueil .graduation, .eusep-v2 .trace-accueil .etiquette, .eusep-v2 .trace-accueil .axe-titre { font-size: 13px; }
  .eusep-v2 .trace-accueil .valeur { font-size: 15px; }
}
.eusep-v2 #reperes-regions .table-responsive { max-height: none; overflow-y: visible; } /* toutes les régions d'un seul tenant, comme la maquette */
/* [A-R-144 étape 3, 27/10] « Chiffres clés » rétablis après « Repères par région », dans le style de l'accueil : titre grand et gras comme
   « Comprendre les données publiques », vues en onglets comme ceux de la recherche, chiffres en cartes repères de l'étape 2. */
.eusep-v2 #chiffres-cles .onglets-chiffres-cles a[role=tab] { text-decoration: none; }
.eusep-v2 #chiffres-cles .chiffres-cles__vue-panneau { background: #fff; border: 1px solid var(--blue); border-radius: 0 12px 12px 12px; padding: 1.25rem; }
.eusep-v2 #chiffres-cles .chiffres-cles__vue-panneau:not([role=tabpanel]) { border-color: #d6e2f3; border-radius: 12px; }
.eusep-v2 #chiffres-cles .cartes-reperes { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: .75rem; }
.eusep-v2 #chiffres-cles .carte-repere { flex-direction: row; align-items: center; gap: .7rem; background: #fff; border-radius: 12px; padding: 1rem .75rem; }
.eusep-v2 #chiffres-cles .pastille { flex: 0 0 5rem; width: 5rem; height: 5rem; background: #e3edfc; color: #1f63d6; }
.eusep-v2 #chiffres-cles .pastille svg { width: 2.9rem; height: 2.9rem; }
.eusep-v2 #chiffres-cles .pastille svg [stroke] { stroke-width: 2.4; }
.eusep-v2 #chiffres-cles .corps { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.eusep-v2 #chiffres-cles .libelle { color: #17325c; font-size: 1.02rem; font-weight: 700; }
.eusep-v2 #chiffres-cles .chiffre { font-size: 1.95rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; color: #17325c; white-space: nowrap; }
.eusep-v2 #chiffres-cles .source { font-size: .78rem; color: #6b7a90; }
@media (max-width: 575.98px) { .eusep-v2 #chiffres-cles .cartes-reperes { grid-template-columns: 1fr; } .eusep-v2 #chiffres-cles .chiffres-cles__vue-panneau { padding: 1rem .75rem; } }
/* [A-R-144 étape 3, 27/10] titres des quatre cartes graphiques un peu plus grands, comme la maquette ; 400 points du nuage plus légers */
.eusep-v2 #donnees-publiques .carte-graphique h3 { font-size: 1.85rem; }
.eusep-v2 .trace-accueil .point { fill-opacity: .45; }
@media (max-width: 575.98px) { .eusep-v2 #donnees-publiques .carte-graphique h3 { font-size: 1.5rem; } }
/* [A-R-144 accueil, « Découvrez votre commune », 27/10] au plus près de la maquette V26 : fond bleu très clair, titre grand et gras, champ commune
   et bouton « Découvrir » à droite du titre, cinq tuiles à grand disque d'icône bleu clair, libellé gras et précision. */
.eusep-v2 #decouvrir-commune { background: #f1f6fd; border-radius: 16px; padding-top: 2rem; padding-bottom: 2rem; }
.eusep-v2 #decouvrir-commune .section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.eusep-v2 .decouvrir-commune__recherche { flex: 0 1 560px; display: flex; align-items: stretch; background: #fff; border: 1px solid #d6e2f3; border-radius: 10px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); overflow: visible; }
.eusep-v2 .decouvrir-commune__icone { display: inline-flex; align-items: center; padding: 0 .25rem 0 1rem; color: #1f63d6; }
.eusep-v2 .decouvrir-commune__recherche .typeahead { flex: 1 1 auto; min-width: 0; }
.eusep-v2 .decouvrir-commune__recherche .twitter-typeahead { width: 100%; }
.eusep-v2 .decouvrir-commune__recherche input[type=search] { width: 100%; height: 56px; border: 0; padding: 0 .75rem; font-size: 1rem; background: transparent; }
.eusep-v2 .decouvrir-commune__recherche input[type=search]:focus { outline: 2px solid var(--blue); outline-offset: -2px; }
.eusep-v2 .decouvrir-commune__recherche button { border-radius: 0 10px 10px 0; padding: 0 2rem; min-height: 56px; font-weight: 600; }
.eusep-v2 #decouvrir-commune .cartes-themes { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; margin-top: 1.25rem; }
.eusep-v2 #decouvrir-commune .cartes-themes a { border-radius: 12px; padding: 1rem .75rem; gap: .7rem; font-weight: 400; }
.eusep-v2 #decouvrir-commune .cartes-themes .pastille { flex: 0 0 4.2rem; width: 4.2rem; height: 4.2rem; background: #e3edfc; color: #1f63d6; }
.eusep-v2 #decouvrir-commune .cartes-themes .pastille svg { width: 2.4rem; height: 2.4rem; }
.eusep-v2 #decouvrir-commune .cartes-themes .pastille svg [stroke] { stroke-width: 2.2; }
.eusep-v2 #decouvrir-commune .cartes-themes .corps { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.eusep-v2 #decouvrir-commune .cartes-themes strong { color: #17325c; font-weight: 700; font-size: 1.02rem; }
.eusep-v2 #decouvrir-commune .cartes-themes .precision { color: #4a5a72; font-size: .9rem; line-height: 1.3; }
@media (max-width: 991.98px) { .eusep-v2 #decouvrir-commune .cartes-themes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .eusep-v2 .decouvrir-commune__recherche { flex-basis: 100%; } }
@media (max-width: 575.98px) {
  .eusep-v2 #decouvrir-commune .cartes-themes { grid-template-columns: 1fr; }
  .eusep-v2 .decouvrir-commune__recherche button { padding: 0 1rem; }
  .eusep-v2 .decouvrir-commune__recherche input[type=search] { font-size: .95rem; }
}
/* [A-R-144 accueil, « Votre expérience compte », 27/10] titre grand et gras, deux boutons à icône à droite, trois cartes blanches à grand disque. */
.eusep-v2 #participation .section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.eusep-v2 #participation .actions-participation, .eusep-v2 #association .actions-participation { margin: 0; }
.eusep-v2 #participation .actions-participation .btn, .eusep-v2 #association .actions-participation .btn { display: inline-flex; align-items: center; gap: .6rem; min-height: 52px; padding: 0 1.6rem; border-radius: 8px; font-weight: 600; font-size: 1rem; }
.eusep-v2 #participation .actions-participation .btn-outline-primary, .eusep-v2 #association .actions-participation .btn-outline-primary { background: #fff; }
.eusep-v2 #participation .engagements { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.eusep-v2 #participation .engagements li { display: flex; align-items: center; gap: .9rem; background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1rem; }
.eusep-v2 #participation .engagements .pastille { flex: 0 0 4.2rem; width: 4.2rem; height: 4.2rem; background: #e3edfc; color: #1f63d6; }
.eusep-v2 #participation .engagements .pastille svg { width: 2.4rem; height: 2.4rem; }
.eusep-v2 #participation .engagements .corps { display: flex; flex-direction: column; gap: .2rem; }
.eusep-v2 #participation .engagements strong { font-size: 1.05rem; font-weight: 700; }
.eusep-v2 #participation .engagements .precision { color: #4a5a72; font-size: .92rem; line-height: 1.35; }
@media (max-width: 991.98px) { .eusep-v2 #participation .engagements { grid-template-columns: 1fr; } }
@media (max-width: 575.98px) { .eusep-v2 #participation .actions-participation .btn, .eusep-v2 #association .actions-participation .btn { flex: 1 1 100%; justify-content: center; } }
.eusep-v2 #participation .actions-participation .btn-primary, .eusep-v2 #association .actions-participation .btn-primary { background: #1f63d6; border-color: #1f63d6; color: #fff; }
.eusep-v2 #participation .actions-participation .btn-primary:hover, .eusep-v2 #association .actions-participation .btn-primary:hover { background: #17325c; border-color: #17325c; color: #fff; }
/* [A-R-144 accueil, « Une association au service des usagers », 27/10] titre à gauche, trois boutons à droite, comme la maquette. */
.eusep-v2 #association .section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 0; }
.eusep-v2 #association .section-heading > div { flex: 1 1 420px; }
/* [A-R-144 accueil, « Vos questions, simplement », 27/10] titre grand et gras à gauche ; à droite trois questions en cartes blanches bordées,
   chevron à droite (tourné à l'ouverture), puis « Voir toute l'aide ». */
.eusep-v2 #faq.faq-grid { grid-template-columns: 1fr 1.25fr; gap: 2rem; align-items: start; }
.eusep-v2 #faq .section-heading { display: block; margin-bottom: 0; }
.eusep-v2 #faq .faq-item { background: #fff; border: 1px solid #d6e2f3; border-radius: 10px; box-shadow: 0 2px 8px rgba(23, 50, 92, .06); padding: 0; margin-bottom: .6rem; }
.eusep-v2 #faq .faq-item:first-child { border-top: 1px solid #d6e2f3; }
.eusep-v2 #faq .faq-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1.1rem; font-size: 1.02rem; font-weight: 700; color: #17325c; }
.eusep-v2 #faq .faq-item summary::-webkit-details-marker { display: none; }
.eusep-v2 #faq .faq-item summary::after { content: ""; flex: none; width: .6rem; height: .6rem; border-right: 2px solid #1f63d6; border-bottom: 2px solid #1f63d6; transform: rotate(45deg) translateY(-2px); transition: transform .15s; }
.eusep-v2 #faq .faq-item[open] summary::after { transform: rotate(-135deg) translateY(-2px); }
.eusep-v2 #faq .faq-item p { margin: 0; padding: 0 1.1rem 1rem; font-size: .98rem; }
.eusep-v2 #faq .faq-toute-l-aide a { color: #1f63d6; font-weight: 600; text-decoration: none; }
@media (max-width: 767.98px) { .eusep-v2 #faq.faq-grid { grid-template-columns: 1fr; gap: 1rem; } }
.eusep-v2 #faq h2 { font-size: clamp(28px, 2.9vw, 38px); }
/* [A-R-144 fiche commune, en-tête, 27/10] au plus près de la maquette V27 : sous-titre, cinq repères en cartes (composant de l'accueil). */
.eusep-v2 #entete .fiche-commune__sous-titre { font-size: 1.15rem; color: #17325c; max-width: 640px; margin: 0 0 var(--ds-espace-3); }
.eusep-v2 #reperes.cartes-reperes { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; margin: var(--ds-espace-5) 0; }
.eusep-v2 #reperes .carte-repere { flex-direction: row; align-items: center; gap: .7rem; background: #fff; border-radius: 12px; padding: 1rem .75rem; }
.eusep-v2 #reperes .pastille { flex: 0 0 3.8rem; width: 3.8rem; height: 3.8rem; background: #e3edfc; color: #1f63d6; }
.eusep-v2 #reperes .pastille svg { width: 2.2rem; height: 2.2rem; }
.eusep-v2 #reperes .corps { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.eusep-v2 #reperes .chiffre { font-size: 1.35rem; font-weight: 800; line-height: 1.15; color: #17325c; overflow-wrap: anywhere; }
.eusep-v2 #reperes .libelle { color: #4a5a72; font-size: .92rem; }
@media (max-width: 991.98px) { .eusep-v2 #reperes.cartes-reperes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .eusep-v2 #reperes.cartes-reperes { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, en-tête, 27/10] pastilles Département / Région séparées, en puces blanches ; boutons en cartes blanches à droite (1280). */
.eusep-v2 #entete .pastilles { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; }
.eusep-v2 #entete .pastilles .badge-eusep { display: inline-flex; align-items: center; gap: .35rem; background: #fff; border: 1px solid #d6e2f3; border-radius: 999px; padding: .35rem .9rem; color: #17325c; font-weight: 600; text-decoration: none; }
.eusep-v2 #entete .pastilles .badge-eusep::before { content: ""; width: .55rem; height: .55rem; border: 2px solid #1f63d6; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }
.eusep-v2 #entete .fiche-commune__boutons { display: flex; flex-wrap: wrap; gap: .5rem; margin: var(--ds-espace-3) 0 0; }
/* [A-R-169, 01/11] Haut de fiche aéré : jetons --ds-espace-* (12 / 20 / 28 px) entre fil d'Ariane, sur-titre, titre, phrase, pastilles, repères, introduction et « Utile maintenant ». */
.eusep-v2 #entete > .wrap:last-child { padding-block: var(--ds-espace-4) var(--ds-espace-5); }
.eusep-v2 #entete .eyebrow { margin-bottom: var(--ds-espace-3); }
.eusep-v2 #entete #page-title { margin-bottom: var(--ds-espace-3); }
.eusep-v2 #entete .fiche-commune__boutons .secondary-button { background: #fff; border-radius: 10px; }
@media (min-width: 992px) {
  .eusep-v2 #entete > .wrap:last-child { position: relative; }
  .eusep-v2 #entete .fiche-commune__boutons { position: absolute; right: 0; top: calc(2.5rem + var(--ds-espace-4)); margin: 0; flex-direction: column; width: 15rem; }
  .eusep-v2 #entete #page-title, .eusep-v2 #entete .fiche-commune__sous-titre { max-width: calc(100% - 17rem); }
}
/* [A-R-144 fiche commune, « Utile maintenant », 27/10] titre grand et gras, sous-titre, trois cartes blanches côte à côte (météo, carburants, bornes). */
.eusep-v2 #utile-maintenant > h2 { font-size: clamp(28px, 3vw, 40px); font-weight: 800; letter-spacing: -.02em; margin-bottom: .1rem; }
.eusep-v2 #utile-maintenant .fiche-commune__sous-titre { color: #17325c; font-size: 1.05rem; margin: 0 0 1rem; }
.eusep-v2 #utile-maintenant .ec-cartes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; }
.eusep-v2 #utile-maintenant .ec-cartes > div { background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; box-shadow: 0 2px 8px rgba(23, 50, 92, .08); padding: 1.25rem 1.4rem; margin: 0; min-width: 0; font-size: 1.02rem; }
.eusep-v2 #utile-maintenant .ec-cartes > div > h3 { font-size: 1.35rem; font-weight: 800; color: #17325c; margin-bottom: .8rem; }
@media (max-width: 991.98px) { .eusep-v2 #utile-maintenant .ec-cartes { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, « Utile maintenant », 27/10] « Autres informations utiles » : titre puis trois cartes-liens sur une rangée, comme la maquette. */
.eusep-v2 #utile-maintenant .ec-cartes + h3 { display: inline-block; font-size: 1.1rem; font-weight: 800; color: #17325c; margin: 1rem 1rem .5rem 0; }
.eusep-v2 #utile-maintenant .ec-useful-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; list-style: none; padding: 0; margin: 0; }
.eusep-v2 #utile-maintenant .ec-useful-links a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; background: #fff; border: 1px solid #d6e2f3; border-radius: 10px; padding: .8rem 1rem; color: #1f63d6; font-weight: 600; text-decoration: none; }
.eusep-v2 #utile-maintenant .ec-useful-links a::after { content: "→"; }
@media (max-width: 767.98px) { .eusep-v2 #utile-maintenant .ec-useful-links { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, « Utile maintenant », 27/10] liens de bas de carte (vigilance, toutes les stations, toutes les bornes) en boutons bordés, comme la maquette. */
.eusep-v2 #utile-maintenant .ec-cartes > div > p.small:has(> a[target=_blank]) a { display: flex; justify-content: center; align-items: center; gap: .4rem; border: 1.5px solid #1f63d6; border-radius: 8px; padding: .6rem 1rem; color: #1f63d6; font-weight: 600; font-size: .98rem; text-decoration: none; background: #fff; }
.eusep-v2 #utile-maintenant .ec-cartes > div > p.small:has(> a[target=_blank]) a:hover { background: #eef4fc; }
/* [A-R-144 fiche commune, « Utile maintenant », cartes, 27/10] icônes des titres, filtres sur une ligne, tableau compact comme la maquette. */
.eusep-v2 #utile-maintenant .ec-cartes > div > h3 { display: flex; align-items: center; gap: .5rem; }
.eusep-v2 #utile-maintenant .ec-cartes > div > h3 svg { color: #1f63d6; flex: none; }
.eusep-v2 #utile-maintenant .ec-fuel-filtres { display: grid; grid-template-columns: 1fr 1.3fr auto; gap: .4rem; align-items: center; }
.eusep-v2 #utile-maintenant .ec-fuel-origine { text-align: right; color: #4a5a72; margin: .25rem 0 .5rem; }
.eusep-v2 #utile-maintenant .ec-fuel-table { font-size: .85rem; margin: 0; }
.eusep-v2 #utile-maintenant .ec-fuel-table th { background: #e9f1fc; color: #17325c; font-weight: 700; }
.eusep-v2 #utile-maintenant .ec-fuel-table td { padding: .35rem .5rem; vertical-align: top; }
.eusep-v2 #utile-maintenant .ec-charge-station { border-bottom: 1px solid #e3eaf5; padding: .5rem 0; }
/* [A-R-144 réouverture du 28/10 13:52] « Événements à venir » : mêmes lignes que les bornes, lien vers la page des événements en bouton bordé comme « Voir toutes les stations ». */
.eusep-v2 #utile-maintenant .ec-itineraire { margin-top: .35rem; }
.eusep-v2 #utile-maintenant .ec-sources-ligne { margin: .75rem 0 0; color: #4a5a72; }
/* [A-R-144 « Utile maintenant », 27/10] comme la maquette : les deux listes sur une ligne (rayon lisible en entier), « Afficher » dessous ; « Voir toutes les stations » et « Itinéraire » côte à côte. */
.eusep-v2 #utile-maintenant .ec-fuel-filtres { grid-template-columns: minmax(0, 1fr) minmax(0, 1.75fr); }
.eusep-v2 #utile-maintenant .ec-fuel-filtres .form-select { font-size: .9rem; padding-left: .5rem; padding-right: 1.6rem; background-position: right .4rem center; }
.eusep-v2 #utile-maintenant .ec-fuel-filtres button { grid-column: 1 / -1; justify-self: end; }
.eusep-v2 #utile-maintenant .ec-fuel > p.small:has(> .ec-itineraire) { display: flex; flex-wrap: wrap; gap: .5rem; }
.eusep-v2 #utile-maintenant .ec-fuel > p.small:has(> .ec-itineraire) a { flex: 1 1 0; margin-top: 0; }
.eusep-v2 #utile-maintenant .ec-fuel > p.small:has(> .ec-itineraire) a { padding: .6rem .4rem; font-size: .9rem; white-space: nowrap; }
/* [A-R-144 réouverture du 28/10 22:51] deux cartes par rangée (carburants, bornes) : polices un peu plus grandes, espacements plus amples ; une colonne sous 992 px (règle ci-dessus). */
.eusep-v2 #utile-maintenant .ec-cartes .small { font-size: .95rem; }
.eusep-v2 #utile-maintenant .ec-fuel-table { font-size: 1rem; }
.eusep-v2 #utile-maintenant .ec-fuel-table td, .eusep-v2 #utile-maintenant .ec-fuel-table th { padding: .55rem .7rem; }
.eusep-v2 #utile-maintenant .ec-fuel-table td strong { font-size: 1.1rem; }
.eusep-v2 #utile-maintenant .ec-fuel-filtres { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto; gap: .6rem; }
.eusep-v2 #utile-maintenant .ec-fuel-filtres .form-select { font-size: 1rem; }
.eusep-v2 #utile-maintenant .ec-fuel-filtres button { grid-column: auto; }
.eusep-v2 #utile-maintenant .ec-fuel > p.small:has(> .ec-itineraire) a { font-size: 1rem; padding: .7rem .8rem; }
.eusep-v2 #utile-maintenant .ec-charge-station { padding: .8rem 0; }
.eusep-v2 #utile-maintenant .ec-charge-station__titre { font-size: 1.1rem; color: #17325c; }
@media (max-width: 575.98px) { .eusep-v2 #utile-maintenant .ec-fuel-filtres { grid-template-columns: 1fr; } .eusep-v2 #utile-maintenant .ec-cartes > div { padding: 1rem; } }
/* [A-R-144 fiche commune, « De quoi avez-vous besoin ? », 27/10] titre gras, cinq accès en rangée de boutons bordés à icône et flèche, comme la maquette. */
.eusep-v2 #actions #actions-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #actions .fiche-commune__acces { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; list-style: none; padding: 0; margin: .5rem 0 1rem; }
.eusep-v2 #actions .fiche-commune__acces a.acces { display: flex; align-items: center; gap: .6rem; height: 100%; background: #fff; border: 1px solid #d6e2f3; border-radius: 10px; padding: .75rem .9rem; color: #1f63d6; font-weight: 600; text-decoration: none; }
.eusep-v2 #actions .fiche-commune__acces a.acces:hover { background: #eef4fc; }
.eusep-v2 #actions .fiche-commune__acces a.acces svg { flex: none; }
.eusep-v2 #actions .fiche-commune__acces a.acces::after { content: "→"; margin-left: auto; }
@media (max-width: 991.98px) { .eusep-v2 #actions .fiche-commune__acces { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .eusep-v2 #actions .fiche-commune__acces { grid-template-columns: 1fr; } }
.eusep-v2 #actions .fiche-commune__acces > li { margin: 0; padding: 0; }
.eusep-v2 #actions .fiche-commune__acces a.acces { font-size: .92rem; gap: .45rem; padding: .65rem .7rem; line-height: 1.25; }
/* [A-R-144 fiche commune, « L’essentiel », 27/10] titre gras, introduction, « À retenir » en trois cartes à grand disque d’icône comme la maquette. */
.eusep-v2 #essentiel #essentiel-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #essentiel .fiche-commune__intro { color: #4a5a72; }
.eusep-v2 #essentiel .a-retenir { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 1rem; list-style: none; background: none; border-radius: 0; padding: 0; margin: 1rem 0 1.5rem; }
.eusep-v2 #essentiel .a-retenir > li { display: grid; grid-template-columns: auto 1fr; column-gap: .75rem; align-content: start; background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; padding: 1.1rem 1.25rem; margin: 0; }
.eusep-v2 #essentiel .a-retenir > li > svg { grid-row: 1 / span 4; box-sizing: content-box; padding: .55rem; border-radius: 50%; background: #e9f1fc; color: #1f63d6; }
.eusep-v2 #essentiel .a-retenir > li > .libelle { font-weight: 700; color: #17325c; }
.eusep-v2 #essentiel .a-retenir > li > .valeur { font-size: 1.5rem; font-weight: 800; color: #17325c; }
.eusep-v2 #essentiel .a-retenir > li > a { color: #1f63d6; font-weight: 600; text-decoration: none; }
.eusep-v2 #essentiel .a-retenir > li > a::before { content: "→ "; }
@media (max-width: 767.98px) { .eusep-v2 #essentiel .a-retenir { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, Sommaire, 27/10] sommaire latéral à gauche comme la maquette V27, titre gras ; fiche d’identité de « L’essentiel » en grille compacte. */
@media (min-width: 992px) {
  .eusep-v2 .fiche-commune__grille { grid-template-columns: 260px minmax(0, 1fr); }
  .eusep-v2 .fiche-commune__grille > .fiche-commune__aside { grid-column: 1; grid-row: 1; }
  .eusep-v2 .fiche-commune__grille > .fiche-commune__contenu { grid-column: 2; grid-row: 1; }
}
.eusep-v2 .fiche-commune__sommaire #sommaire-titre { font-size: 1.25rem; font-weight: 800; color: #17325c; }
.eusep-v2 #essentiel .fiche-commune__identite { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content minmax(0, 1fr); gap: .35rem .9rem; align-items: baseline; }
.eusep-v2 #essentiel .fiche-commune__identite > dt, .eusep-v2 #essentiel .fiche-commune__identite > dd { margin: 0; }
@media (max-width: 767.98px) { .eusep-v2 #essentiel .fiche-commune__identite { grid-template-columns: minmax(0, 1fr); gap: 0; } .eusep-v2 #essentiel .fiche-commune__identite > dd { margin-bottom: .4rem; } }
.eusep-v2 #essentiel .fiche-commune__identite > dd { min-width: 0; overflow-wrap: anywhere; position: relative; }
/* [A-R-144 fiche commune, « Population et société », 27/10] titre gras, sous-titre, courbe à points et encadré « +x % » côte à côte, tableaux repliés. */
.eusep-v2 #population #population-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #population .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #population .fiche-commune__courbe-bloc { display: grid; grid-template-columns: minmax(0, 1fr) 13rem; gap: 1rem; align-items: center; }
.eusep-v2 #population .fiche-commune__courbe { width: 100%; height: auto; color: #1f63d6; }
.eusep-v2 #population .fiche-commune__courbe-bloc .fiche-commune__evolution { background: #e9f1fc; border-radius: 12px; padding: .9rem 1rem; margin: 0; color: #17325c; }
.eusep-v2 #population .fiche-commune__courbe-bloc .fiche-commune__evolution strong { display: block; font-size: 1.6rem; font-weight: 800; }
.eusep-v2 #population details.fiche-commune__tableaux { margin: .5rem 0 1rem; }
.eusep-v2 #population details.fiche-commune__tableaux > summary { cursor: pointer; color: #1f63d6; font-weight: 600; }
@media (max-width: 767.98px) { .eusep-v2 #population .fiche-commune__courbe-bloc { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, « Économie et emploi », 27/10] titre gras, sous-titre, chaque indicateur en carte à disque d’icône comme la maquette. */
.eusep-v2 #economie #economie-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #economie .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #economie .fiche-commune__economie > li { display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: center; background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; padding: .75rem 1rem; margin: 0 0 .6rem; }
.eusep-v2 #economie .fiche-commune__economie > li > svg { box-sizing: content-box; padding: .5rem; border-radius: 50%; background: #e9f1fc; color: #1f63d6; }
.eusep-v2 #economie .fiche-commune__economie .libelle { display: block; color: #17325c; }
.eusep-v2 #economie .fiche-commune__economie .valeur { font-weight: 800; color: #17325c; }
.eusep-v2 #economie .fiche-commune__economie { padding-left: 0; margin-left: 0; }
/* [A-R-144 fiche commune, « Santé et accès aux soins », 27/10] titre gras, sous-titre, carte bornée et liste des catégories à icône côte à côte, comme la maquette. */
.eusep-v2 #sante #sante-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #sante .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #sante .fiche-commune__sante-grille { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.eusep-v2 #sante .fiche-commune__sante-grille > .carte-service { height: 260px; min-height: 0; border-radius: 12px; overflow: hidden; margin: 0; }
.eusep-v2 #sante .fiche-commune__sante-grille > .categories { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.eusep-v2 #sante .fiche-commune__sante-grille > .categories > li { margin: 0; }
.eusep-v2 #sante .fiche-commune__sante-grille > .categories a { display: flex; align-items: center; gap: .55rem; background: #fff; border: 1px solid #d6e2f3; border-radius: 10px; padding: .6rem .8rem; color: #1f63d6; font-weight: 600; text-decoration: none; }
.eusep-v2 #sante .fiche-commune__sante-grille > .categories a::after { content: "›"; margin-left: auto; font-size: 1.2rem; }
.eusep-v2 #sante .fiche-commune__sante-note { color: #4a5a72; margin: .6rem 0; }
@media (max-width: 767.98px) { .eusep-v2 #sante .fiche-commune__sante-grille { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, « Logement et urbanisme », 27/10] titre gras, sous-titre, deux cartes à grand disque d’icône, liens fléchés, comme la maquette. */
.eusep-v2 #logement #logement-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #logement .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #logement .cartes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; list-style: none; padding: 0; margin: 0 0 .75rem; }
.eusep-v2 #logement .cartes > li { display: flex; flex-direction: column; align-items: flex-start; gap: .3rem; background: #fff; border: 1px solid #d6e2f3; border-radius: 12px; padding: .9rem 1rem; margin: 0; }
.eusep-v2 #logement .cartes > li > svg { box-sizing: content-box; padding: .55rem; border-radius: 50%; background: #e9f1fc; color: #1f63d6; }
.eusep-v2 #logement .cartes .libelle { font-weight: 700; color: #17325c; }
.eusep-v2 #logement .fiche-commune__liens { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; list-style: none; padding: 0; }
.eusep-v2 #logement .fiche-commune__liens a::after { content: " →"; }
@media (max-width: 575.98px) { .eusep-v2 #logement .cartes { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, « Services publics et démarches », 27/10] titre gras, sous-titre, quatre cartes à disque d’icône et bouton bordé « Consulter la fiche », comme la maquette. */
.eusep-v2 #services #services-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #services .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #services [data-cartes-services] { gap: 1rem; margin-bottom: 1.25rem; }
.eusep-v2 #services [data-cartes-services] > li { padding: 1rem; gap: .5rem; }
.eusep-v2 #services [data-cartes-services] > li > svg { box-sizing: content-box; padding: .5rem; border-radius: 50%; background: #e9f1fc; color: #1f63d6; }
.eusep-v2 #services [data-cartes-services] > li > a { display: inline-flex; justify-content: center; border: 1.5px solid #1f63d6; border-radius: 8px; padding: .45rem .8rem; color: #1f63d6; font-weight: 600; text-decoration: none; margin-top: auto; }
.eusep-v2 #services [data-cartes-services] > li > a::after { content: " →"; margin-left: .3rem; }
.eusep-v2 #services .fiche-commune__services-note { color: #4a5a72; }
.eusep-v2 #services details.fiche-commune__tous-services > summary { cursor: pointer; color: #1f63d6; font-weight: 600; margin: .5rem 0; }
/* [A-R-144 fiche commune, « Vos élus et représentants », 27/10] titre gras, sous-titre, bouton « Consulter sur EPE » et annonce de sortie sur une ligne, comme la maquette. */
.eusep-v2 #elus #elus-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #elus .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #elus .fiche-commune__epe { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.eusep-v2 #elus .fiche-commune__sortie-epe { color: #4a5a72; }
/* [A-R-144 fiche commune, « Finances et fiscalité », 28/10] titre gras, deux barres en euros par habitant côte à côte, encadré Sources / Exercice / Périmètre à droite, bouton bordé pleine largeur, comme la maquette. */
.eusep-v2 #finances #finances-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #finances .fiche-commune__sous-titre { color: #4a5a72; margin: -.25rem 0 0; }
.eusep-v2 #finances .fiche-commune__finances-grille { display: grid; grid-template-columns: 1fr minmax(9rem, 12rem); gap: 1rem; align-items: start; margin: .75rem 0; }
.eusep-v2 #finances .fiche-commune__barres { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; text-align: center; }
.eusep-v2 #finances [data-barre] { display: flex; flex-direction: column; align-items: center; }
.eusep-v2 #finances [data-barre] .valeur { font-size: 1.35rem; font-weight: 800; color: #17325c; }
.eusep-v2 #finances [data-barre] .unite { color: #17325c; font-size: .95rem; }
.eusep-v2 #finances [data-barre] .colonne { display: block; width: 60%; height: 7rem; border-bottom: 1px solid #c8d3e3; margin: .35rem 0; fill: #4f8fe8; }
.eusep-v2 #finances .barre--depenses .colonne { fill: #e94b4b; }
.eusep-v2 #finances [data-barre] .libelle { color: #4a5a72; font-size: .95rem; }
.eusep-v2 #finances .encadre-finances { margin: 0; padding: .75rem; border-radius: 8px; background: #eef4fd; color: #4a5a72; font-size: .92rem; }
.eusep-v2 #finances .encadre-finances div { margin: .2rem 0; }
.eusep-v2 #finances .encadre-finances dt, .eusep-v2 #finances .encadre-finances dd { display: inline; margin: 0; font-weight: 400; }
.eusep-v2 #finances details.fiche-commune__repli > summary { cursor: pointer; color: #1f63d6; font-weight: 600; margin: .25rem 0; }
.eusep-v2 #finances .fiche-commune__bouton .secondary-button { display: flex; justify-content: center; width: 100%; }
@media (max-width: 575.98px) { .eusep-v2 #finances .fiche-commune__finances-grille { grid-template-columns: 1fr; } }
/* [A-R-144 fiche commune, « Mobilité et équipements » et « Environnement et risques », 28/10] titres gras, repères à disque d'icône côte à côte (empilés à 375 px), note discrète, comme la maquette. */
.eusep-v2 #mobilite #mobilite-titre, .eusep-v2 #environnement #environnement-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #mobilite .fiche-commune__sous-titre, .eusep-v2 #environnement .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 .fiche-commune__reperes-liens { list-style: none; margin: .75rem 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: .6rem; }
.eusep-v2 .fiche-commune__reperes-liens [data-repere] { display: grid; grid-template-columns: auto 1fr; column-gap: .55rem; align-items: center; border: 1px solid #d6e2f3; border-radius: 8px; padding: .55rem .6rem; }
.eusep-v2 .fiche-commune__reperes-liens .pastille { grid-row: span 2; width: 2.6rem; height: 2.6rem; color: #1f63d6; }
.eusep-v2 .fiche-commune__reperes-liens .libelle { font-weight: 700; color: #17325c; line-height: 1.2; }
.eusep-v2 .fiche-commune__reperes-liens .valeur { color: #4a5a72; font-size: .92rem; }
.eusep-v2 .fiche-commune__reperes-liens a.valeur { color: #1f63d6; font-weight: 600; }
.eusep-v2 #mobilite .fiche-commune__note, .eusep-v2 #environnement .fiche-commune__note { color: #4a5a72; font-size: .92rem; }
.eusep-v2 #mobilite details.fiche-commune__repli > summary, .eusep-v2 #environnement details.fiche-commune__repli > summary { cursor: pointer; color: #1f63d6; font-weight: 600; margin: .25rem 0; }
/* [A-R-144 fiche commune, « Histoire, patrimoine et vie locale », 28/10] deux cartes illustrées côte à côte (empilées à 375 px), titre gras, deux lignes et « Lire la suite → », comme la maquette. */
.eusep-v2 #histoire #histoire-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #histoire .fiche-commune__histoire-grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; }
.eusep-v2 #histoire .carte-histoire { margin: 0; padding: 0 0 .75rem; overflow: hidden; border: 1px solid #d6e2f3; border-radius: 10px; }
.eusep-v2 #histoire .carte-histoire > img, .eusep-v2 #histoire .carte-histoire > svg.illustration { display: block; width: 100%; height: 9rem; object-fit: cover; background: #e7effb; color: #2c64b4; padding: 0; }
.eusep-v2 #histoire .carte-histoire > svg.illustration { padding: 1rem 2rem; }
.eusep-v2 #histoire .carte-histoire > h3, .eusep-v2 #histoire .carte-histoire > p, .eusep-v2 #histoire .carte-histoire > details { margin-left: .9rem; margin-right: .9rem; }
.eusep-v2 #histoire .carte-histoire > h3 { font-size: 1.1rem; font-weight: 800; color: #17325c; margin-top: .75rem; }
.eusep-v2 #histoire .fiche-commune__chapeau { color: #4a5a72; }
.eusep-v2 #histoire details.fiche-commune__repli > summary { cursor: pointer; color: #1f63d6; font-weight: 600; }
/* [A-R-144 fiche commune, « Sources et actualisation », 28/10] titre gras, tableau compact à quatre colonnes, replis et bouton bordé pleine largeur, comme la maquette. */
.eusep-v2 #sources #sources-titre { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; color: #17325c; }
.eusep-v2 #sources .fiche-commune__sous-titre { color: #4a5a72; margin-top: -.25rem; }
.eusep-v2 #sources .fiche-commune__tableau { font-size: .92rem; }
.eusep-v2 #sources .fiche-commune__tableau th[scope="row"] { font-weight: 600; color: #17325c; }
.eusep-v2 #sources details.fiche-commune__repli > summary { cursor: pointer; color: #1f63d6; font-weight: 600; margin: .25rem 0; }
.eusep-v2 #sources .fiche-commune__bouton .secondary-button { display: flex; justify-content: center; width: 100%; }
/* [A-R-144 fiche commune, « Questions fréquentes » et « Poursuivre votre découverte », 28/10] questions en accordéon à chevron, quatre cartes en rangée (deux par ligne sur tablette, une à 375 px) à disque d'icône, titre, sous-titre et chevron, comme la maquette. */
.eusep-v2 #faq #faq-titre, .eusep-v2 #poursuivre #poursuivre-titre { font-size: clamp(22px, 2.2vw, 28px); font-weight: 800; color: #17325c; }
.eusep-v2 #faq details { border-bottom: 1px solid #d6e2f3; padding: .45rem 0; }
.eusep-v2 #faq details > summary { cursor: pointer; color: #17325c; list-style: none; display: flex; justify-content: space-between; }
.eusep-v2 #faq details > summary::-webkit-details-marker { display: none; }
.eusep-v2 #faq details > summary::after { content: "⌄"; color: #1f63d6; }
.eusep-v2 #faq details[open] > summary::after { content: "⌃"; }
.eusep-v2 #poursuivre .cartes-poursuivre { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.eusep-v2 #poursuivre .cartes-poursuivre > li { margin: 0; padding: 0; }
.eusep-v2 #poursuivre .cartes-poursuivre a, .eusep-v2 #poursuivre .carte-poursuivre--indisponible { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: .6rem; align-items: center; padding: .6rem .75rem; text-decoration: none; color: #17325c; height: 100%; }
.eusep-v2 #poursuivre .pastille { grid-row: span 2; width: 2.4rem; height: 2.4rem; color: #1f63d6; }
.eusep-v2 #poursuivre .sous-titre { grid-column: 2; color: #4a5a72; font-size: .88rem; }
.eusep-v2 #poursuivre .chevron { grid-column: 3; grid-row: 1 / span 2; color: #1f63d6; font-size: 1.5rem; }
@media (max-width: 991.98px) { .eusep-v2 #poursuivre .cartes-poursuivre { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .eusep-v2 #poursuivre .cartes-poursuivre { grid-template-columns: 1fr; } }
.eusep-v2 #finances .detail__entete { flex-direction: column; align-items: flex-start; gap: .25rem; }
.eusep-v2 #finances .fiche-commune__barres { align-items: end; }
.eusep-v2 #finances [data-barre] { justify-content: flex-end; }
.eusep-v2 .fiche-commune__rubrique ul.fiche-commune__reperes-liens { padding-left: 0; margin-left: 0; }
.eusep-v2 .fiche-commune__rubrique ul.fiche-commune__reperes-liens > li { margin: 0; }
.eusep-v2 #histoire .carte-histoire > h3 { border-top: 0; padding-top: 0; }
.eusep-v2 #sources details#signalement:not([open]) > summary { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.eusep-v2 #sources details#signalement:not([open]) > summary:focus { position: static; width: auto; height: auto; clip: auto; }
/* [A-R-144 Vie locale V30, bandeau, 28/10] h1 de la catégorie, sélecteur « commune · code » encadré à droite, « Changer de commune » qui ouvre notre recherche de commune, comme la maquette. */
.eusep-v2.vie-locale .page-heading .selecteur-commune { align-self: center; min-width: 15rem; max-width: 22rem; background: #fff; border: 1.5px solid #1f63d6; border-radius: 10px; padding: .6rem .9rem; }
.eusep-v2.vie-locale .selecteur-commune > summary { cursor: pointer; list-style: none; display: flex; flex-direction: column; }
.eusep-v2.vie-locale .selecteur-commune > summary::-webkit-details-marker { display: none; }
.eusep-v2.vie-locale .selecteur-commune__nom { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; color: #17325c; font-size: 1.1rem; }
.eusep-v2.vie-locale .selecteur-commune__nom svg { color: #1f63d6; }
.eusep-v2.vie-locale .selecteur-commune__changer { color: #1f63d6; font-size: .92rem; margin-left: 1.9rem; }
.eusep-v2.vie-locale .selecteur-commune form { display: grid; gap: .4rem; margin-top: .6rem; }
@media (max-width: 575.98px) { .eusep-v2.vie-locale .page-heading .selecteur-commune { max-width: none; width: 100%; } }
/* [A-R-144 Vie locale V30, indicateurs, 28/10] quatre cartes en rangée (deux à 375 px) : disque d'icône, libellé, grand chiffre, sous-ligne, comme la maquette. */
.eusep-v2 .vl30-indicateurs { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.eusep-v2 .vl30-indicateurs > li { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: .75rem; align-items: center; background: #fff; border: 1px solid #d6e2f3; border-radius: 10px; padding: .8rem; margin: 0; }
.eusep-v2 .vl30-indicateurs .pastille { grid-row: span 3; align-self: start; width: 2.8rem; height: 2.8rem; color: #1f63d6; }
.eusep-v2 .vl30-indicateurs .libelle { color: #17325c; font-weight: 600; font-size: .95rem; }
.eusep-v2 .vl30-indicateurs .valeur { font-size: 1.8rem; font-weight: 800; color: #17325c; line-height: 1.1; }
.eusep-v2 .vl30-indicateurs .sous-ligne { color: #4a5a72; font-size: .9rem; }
@media (max-width: 991.98px) { .eusep-v2 .vl30-indicateurs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* [A-R-144 Vie locale V30, évolution, 28/10] titre et bascule « Graphique | Tableau » sur une ligne, courbe à axes bornés, « À retenir » en encadré à disque d'icône sous le graphique, comme la maquette. */
.eusep-v2 .vl30-evolution__entete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; }
.eusep-v2 .vl30-bascule { display: inline-flex; background: #eef4fd; border-radius: 8px; padding: .2rem; }
.eusep-v2 .vl30-bascule button { border: 0; background: transparent; color: #4a5a72; padding: .35rem .9rem; border-radius: 6px; font-weight: 600; }
.eusep-v2 .vl30-bascule button[aria-pressed="true"] { background: #fff; color: #1f63d6; box-shadow: 0 1px 2px rgba(23, 50, 92, .15); }
.eusep-v2 .vl30-courbe { margin: .75rem 0; color: #1f63d6; }
.eusep-v2 .vl30-courbe text { fill: #4a5a72; }
.eusep-v2 .a-retenir { display: flex; gap: .75rem; align-items: flex-start; background: #eef4fd; border-radius: 10px; padding: .8rem 1rem; margin-top: .75rem; }
.eusep-v2 .a-retenir .pastille { flex: 0 0 2.6rem; width: 2.6rem; height: 2.6rem; background: #dbe8fa; color: #1f63d6; }
.eusep-v2 .a-retenir h3 { font-size: 1.05rem; font-weight: 800; color: #17325c; margin: 0 0 .2rem; }
/* [A-R-144 Vie locale V30, comparer, 28/10] trois boutons pleine largeur à icône et chevron (la strate en plein), note discrète, comme la maquette. */
.eusep-v2 .vl30-comparer__boutons { list-style: none; padding: 0; margin: .75rem 0; display: grid; gap: .6rem; }
.eusep-v2 .vl30-comparer__boutons li { margin: 0; }
.eusep-v2 .vl30-comparer__boutons a { display: flex; align-items: center; gap: .75rem; width: 100%; padding: .7rem 1rem; }
.eusep-v2 .vl30-comparer__boutons a .chevron { margin-left: auto; font-size: 1.4rem; line-height: 1; }
.eusep-v2 .vl30-comparer__note { color: #4a5a72; border-top: 1px solid #d6e2f3; padding-top: .6rem; margin-bottom: .2rem; }
/* [A-R-144 V30 « Explorer les sous-rubriques »] sous-titre, badge départemental et chevron des cartes */
.eusep-v2 .vl30-sous-rubriques .fr-card { position: relative; padding-right: 2.2rem; }
.eusep-v2 .vl30-sous-rubriques .sous-titre { display: block; color: #4a5a72; font-size: .9rem; }
.eusep-v2 .vl30-sous-rubriques .badge { display: inline-block; margin-top: .35rem; background: #eef4fd; color: #1f63d6; font-weight: 600; font-size: .78rem; border-radius: 999px; padding: .2rem .6rem; }
.eusep-v2 .vl30-sous-rubriques .chevron { position: absolute; right: .9rem; top: 50%; transform: translateY(-50%); font-size: 1.5rem; color: #1f63d6; line-height: 1; }
/* [A-R-144 V30 « Sources et méthode »] barre : texte à gauche, deux boutons à droite (empilés en mobile) */
.eusep-v2 .vl30-sources { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.eusep-v2 .vl30-sources__texte p { margin: .2rem 0 0; color: #4a5a72; }
.eusep-v2 .vl30-sources .actions { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0; }
/* [A-R-144 V31 « Contacter ce service »] lignes à disque d'icône et « Préparer votre démarche » */
.eusep-v2 .v31-sections .sous-titre { color: #4a5a72; margin: .1rem 0 .8rem; }
.eusep-v2 .v31-lignes > div, .eusep-v2 .v31-preparer { display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: start; margin-bottom: .75rem; }
.eusep-v2 .v31-lignes > div > .pastille, .eusep-v2 .v31-preparer > .pastille { grid-row: span 2; display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #eef4fd; color: #1f63d6; }
.eusep-v2 .v31-lignes dt { font-weight: 600; color: #17325c; }
.eusep-v2 .v31-lignes dd { margin: 0; }
.eusep-v2 .v31-preparer { border-top: 1px solid #d6e2f3; padding-top: .9rem; }
.eusep-v2 .v31-preparer__titre { font-weight: 600; color: #17325c; margin: 0; }
/* [A-R-144 V31 « Découvrir la commune », « Explorer la vie locale »] carte à disque d'icône et bouton */
.eusep-v2 .v31-carte-lien { display: grid; grid-template-columns: auto 1fr; column-gap: .9rem; align-items: start; }
.eusep-v2 .v31-carte-lien > .pastille { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #eef4fd; color: #1f63d6; }
.eusep-v2 .v31-carte-lien h3 { margin-bottom: .2rem; }
/* [A-R-144 V31 « Accès et localisation »] bouton d'itinéraire pleine largeur, ligne d'accessibilité */
.eusep-v2 .v31-itineraire { display: flex; justify-content: center; width: 100%; }
.eusep-v2 .v31-accessibilite svg { color: #1f63d6; vertical-align: -4px; }
/* [A-R-144 V31 « Services et démarches »] liste à pastille, titre, sous-titre et chevron */
.eusep-v2 .v31-demarches { list-style: none; padding: 0; margin: 0; }
.eusep-v2 .v31-demarches li + li { border-top: 1px solid #d6e2f3; }
.eusep-v2 .v31-demarches a { display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center; padding: .7rem 0; text-decoration: none; color: inherit; }
.eusep-v2 .v31-demarches .pastille { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #eef4fd; color: #1f63d6; }
.eusep-v2 .v31-demarches .titre { display: block; font-weight: 600; color: #17325c; }
.eusep-v2 .v31-demarches .sous-titre { display: block; margin: 0; font-size: .9rem; }
.eusep-v2 .v31-demarches .chevron { font-size: 1.5rem; color: #1f63d6; }
/* [A-R-144 V31 « Votre expérience compte », « Évaluations des usagers »] boutons empilés pleine largeur, état vide centré */
.eusep-v2 .v31-boutons { display: grid; gap: .6rem; margin: .5rem 0 .75rem; }
.eusep-v2 .v31-boutons a { display: flex; justify-content: center; }
.eusep-v2 .v31-vide { text-align: center; background: #f4f8fd; border-radius: 12px; padding: 1.5rem 1rem; }
.eusep-v2 .v31-vide .vide--bloc { font-weight: 700; color: #17325c; margin-bottom: .2rem; }
/* [A-R-144 V31 « Sources et dernière vérification »] trois colonnes (une en mobile) */
.eusep-v2 .v31-sources { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; border: 1px solid #d6e2f3; border-radius: 12px; padding: 1rem; }
.eusep-v2 .v31-source, .eusep-v2 .v31-verification { display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: start; }
.eusep-v2 .v31-sources .pastille { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #eef4fd; color: #1f63d6; }
.eusep-v2 .v31-sources p { margin: 0; }
.eusep-v2 .v31-sources__titre { font-weight: 600; color: #17325c; }
.eusep-v2 .v31-sources__actions { display: grid; gap: .5rem; align-content: start; }
@media (max-width: 767.98px) { .eusep-v2 .v31-sources { grid-template-columns: 1fr; } }
/* [A-R-144 V31 « Avant de vous déplacer »] conseils à disque d'icône, carte teintée */
.eusep-v2 #avant-deplacement { background: #f4f8fd; }
.eusep-v2 .v31-conseils { list-style: none; padding: 0; margin: 0 0 .75rem; display: grid; gap: .9rem; }
.eusep-v2 .v31-conseils li { display: grid; grid-template-columns: auto 1fr; gap: .8rem; align-items: start; }
.eusep-v2 .v31-conseils .pastille { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #fff; color: #1f63d6; }
.eusep-v2 .v31-conseils .titre { display: block; font-weight: 600; color: #17325c; }
.eusep-v2 .v31-conseils .sous-titre { display: block; margin: 0; font-size: .9rem; }
.eusep-v2 .v31-note { border-top: 1px solid #d6e2f3; padding-top: .6rem; color: #4a5a72; }
/* [A-R-144 V31] sections deux par deux comme la maquette (Contacter | Avant, Horaires | Accès, Démarches | Expérience, Commune | Vie locale) ; évaluations, sources et FAQ en pleine largeur ; une colonne en mobile */
.eusep-v2 .service-layout.v31-sections { display: block; }
.eusep-v2 .v31-sections > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; }
.eusep-v2 .v31-sections > div > section, .eusep-v2 .v31-sections > div > div { margin: 0; }
.eusep-v2 .v31-sections #evaluations, .eusep-v2 .v31-sections #sources, .eusep-v2 .v31-sections #faq { grid-column: 1 / -1; }
.eusep-v2 .entete-service .v31-badge-public { background: #eef4fd; color: #1f63d6; border-radius: 8px; padding: .3rem .6rem; font-weight: 600; }
@media (max-width: 991.98px) { .eusep-v2 .v31-sections > div { grid-template-columns: 1fr; } }
/* [A-R-144 V31 « Accès et localisation »] titre, sous-titre, puis la carte, comme la maquette */
.eusep-v2 .v31-sections .route-panel { display: block; }
.eusep-v2 .v31-sections .route-panel .carte-service { height: 220px; min-height: 0; border-radius: 10px; margin: .5rem 0 .75rem; }
/* [A-R-144 V30 rendu] page de catégorie sur toute la largeur (pas de colonne latérale vide), « Évolution » et « Comparer » côte à côte, sous-rubriques en une rangée de quatre cartes compactes (icône à gauche, titre, sous-titre, chevron) */
.eusep-v2 .commune-theme:has(> .commune-theme__contenu > [data-bloc=evolution]) { grid-template-columns: minmax(0, 1fr); }
.eusep-v2 .commune-theme__contenu:has(> [data-bloc=evolution]) { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); align-items: stretch; }
.eusep-v2 .commune-theme__contenu:has(> [data-bloc=evolution]) > * { grid-column: 1 / -1; }
.eusep-v2 .commune-theme__contenu:has(> [data-bloc=evolution]) > [data-bloc=evolution], .eusep-v2 .commune-theme__contenu:has(> [data-bloc=evolution]) > [data-bloc=comparer] { grid-column: auto; margin: 0; }
.eusep-v2 .commune-theme__contenu > [data-bloc=evolution] > .carte { height: 100%; }
.eusep-v2 .vl30-sous-rubriques .fr-grid-row--gutters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin: 0; }
.eusep-v2 .vl30-sous-rubriques .fr-grid-row--gutters > * { width: auto; max-width: none; padding: 0; }
.eusep-v2 .vl30-sous-rubriques .fr-card { display: grid; grid-template-columns: auto 1fr; column-gap: .7rem; align-content: start; height: 100%; }
.eusep-v2 .vl30-sous-rubriques .fr-card > :not(svg):not(.fr-card__icone) { grid-column: 2; }
.eusep-v2 .vl30-sous-rubriques .fr-card__detail { display: none; }
.eusep-v2 .vl30-sous-rubriques .fr-card__chiffre { font-size: .85rem; margin: .3rem 0 0; }
@media (max-width: 991.98px) { .eusep-v2 .commune-theme__contenu:has(> [data-bloc=evolution]) { grid-template-columns: minmax(0, 1fr); } .eusep-v2 .vl30-sous-rubriques .fr-grid-row--gutters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .eusep-v2 .vl30-sous-rubriques .fr-grid-row--gutters { grid-template-columns: minmax(0, 1fr); } }
.eusep-v2 .vl30-sous-rubriques .fr-card__icone { grid-row: span 5; }
.eusep-v2 .vl30-sources__texte { flex: 1 1 420px; min-width: 0; }


/* [A-R-144 maquette validée du 28/10/2026] Accueil : un surtitre rouge sur chacune des dix sections, un seul style de h2 et de sous-titre.
   Remplace les tailles propres à chaque section (48 px, 38 px, 32 px). */
.eusep-v2.accueil .ligne-surtitre { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.eusep-v2.accueil .surtitre { font-size: 13px; line-height: 1.4; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; color: var(--red); margin: 0; }
.eusep-v2.accueil .section .section-heading h2 { font-size: clamp(26px, 2.6vw, 34px); font-weight: 700; letter-spacing: -.015em; line-height: 1.15; color: var(--deep); margin-bottom: 8px; }
.eusep-v2.accueil .section .section-heading p:not(.surtitre) { font-size: 17px; color: var(--muted); }
.eusep-v2.accueil .section .section-heading > div:first-child { flex: 1 1 420px; }
.eusep-v2.accueil .section .section-heading .section-subtitle { font-size: 19px; color: var(--blue); margin: 14px 0 6px; }
/* [A-R-144 maquette validée du 28/10/2026] Recherche du bandeau : les deux champs à 52 px, libellés sur une même ligne, loupe dans le champ
   service (notre liste Tom Select) et repère dans le champ commune (notre typeahead) ; « Rechercher un service » aligné sur les champs,
   « Évaluer un service public » dessous dans la 3e colonne ; une seule colonne en mobile. */
.eusep-v2.accueil .recherche-service { grid-template-columns: 1fr 1fr minmax(240px, 290px); column-gap: 24px; row-gap: 12px; align-items: end; }
.eusep-v2.accueil .recherche-service .champ-recherche { position: relative; display: flex; flex-direction: column; gap: 8px; margin: 0; }
.eusep-v2.accueil .recherche-service .champ-recherche label { font-weight: 600; font-size: 17px; line-height: 1.3; margin: 0; color: var(--deep); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eusep-v2.accueil .recherche-service .champ-recherche .ts-wrapper { min-height: 52px; }
.eusep-v2.accueil .recherche-service .champ-recherche .ts-control,
.eusep-v2.accueil .recherche-service .champ-recherche input[type="text"] { height: 52px; min-height: 52px; box-sizing: border-box; width: 100%; border: 1px solid #b7c4d9; border-radius: 8px; padding: 0 40px 0 46px; font-size: 17px; margin: 0; box-shadow: none; display: flex; align-items: center; }
.eusep-v2.accueil .recherche-service .champ-recherche::before { content: ""; position: absolute; left: 15px; top: calc(17px * 1.3 + 8px + 15px); width: 22px; height: 22px; background: no-repeat center / 22px 22px; pointer-events: none; z-index: 2; }
.eusep-v2.accueil .recherche-service .champ-service::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23183a8f' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E"); }
.eusep-v2.accueil .recherche-service .champ-recherche:not(.champ-service)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23183a8f' stroke-width='2'%3E%3Cpath d='M12 21s-6.5-5.6-6.5-11a6.5 6.5 0 0 1 13 0c0 5.4-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E"); }
.eusep-v2.accueil .recherche-service .actions-recherche { display: contents; }
.eusep-v2.accueil .recherche-service .actions-recherche .primary-button { height: 52px; min-width: 0; width: 100%; display: flex; align-items: center; justify-content: center; margin: 0; grid-column: 3; grid-row: 1; align-self: end; }
.eusep-v2.accueil .recherche-service .actions-recherche a.btn { grid-column: 3; height: 46px; min-height: 46px; width: 100%; margin: 0; }
.eusep-v2.accueil .recherche-service .message-recherche { grid-column: 1 / -1; }
.eusep-v2.accueil #recherche-annuaire .search-actions { margin-top: 18px; }
@media (max-width: 900px) {
  .eusep-v2.accueil .recherche-service { grid-template-columns: 1fr; }
  .eusep-v2.accueil .recherche-service .actions-recherche .primary-button, .eusep-v2.accueil .recherche-service .actions-recherche a.btn { grid-column: 1; grid-row: auto; }
  .eusep-v2.accueil #recherche-annuaire .search-actions { margin-top: 12px; max-width: none; }
}

/* [A-R-144 maquette validée du 28/10/2026] Chiffres clés : « Et pour votre commune : » sous les cartes des deux onglets. */
.eusep-v2.accueil .vl-chiffres { margin-bottom: 22px; }
.eusep-v2.accueil .vl-chiffres-sep { height: 22px; }
.eusep-v2.accueil .vl-choisir { font-weight: 600; color: var(--deep); margin: 0 0 10px; }

/* [A-R-144 maquette validée du 28/10/2026] « Comprendre les données publiques » : une couleur par graphique, prise dans Palette::POOL
   (G22), les quatre existants recolorés ; un filet de cette couleur devant chaque titre de carte. */
.eusep-v2.accueil #carte-decp { --c: #0072B2; }
.eusep-v2.accueil #carte-fiscalite { --c: #D55E00; }
.eusep-v2.accueil #carte-dvf { --c: #7B5EA7; }
.eusep-v2.accueil #carte-ofgl { --c: #B8860B; }
.eusep-v2.accueil #carte-procedures { --c: #2A9D8F; }
.eusep-v2.accueil #carte-categories { --c: #009E73; }
.eusep-v2.accueil #carte-ventes-mois { --c: #B5528A; }
.eusep-v2.accueil #carte-types-biens { --c: #8C564B; }
.eusep-v2.accueil #donnees-publiques .carte-graphique .trace-accueil .barre:not(.barre--negative),
.eusep-v2.accueil #donnees-publiques .carte-graphique .trace-accueil .point { fill: var(--c); }
.eusep-v2.accueil #donnees-publiques .carte-graphique .trace-accueil .ligne { stroke: var(--c); stroke-width: 3; }
.eusep-v2.accueil #donnees-publiques .carte-graphique .trace-accueil .aire { fill: var(--c); opacity: .15; }
.eusep-v2.accueil #carte-ventes-mois .trace-accueil .point { fill-opacity: 1; }
.eusep-v2.accueil #donnees-publiques .carte-graphique h3 { position: relative; padding-left: 14px; }
.eusep-v2.accueil #donnees-publiques .carte-graphique h3::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 5px; border-radius: 3px; background: var(--c, #0072B2); }
.eusep-v2.accueil .trace-accueil .valeur--centre { font-size: 22px; }
.eusep-v2.accueil .trace-accueil .valeur--segment { fill: #fff; font-weight: 700; font-size: 15px; }
/* [A-R-166] Surtitre rouge d'un titre de section : le style vient de .eyebrow ; seul l'espacement est propre. Dans l'en-tête flex d'une section, il prend sa ligne. */
.eusep-v2 .surtitre-section{margin-bottom:6px;overflow-wrap:anywhere}
.eusep-v2 .detail__entete > .surtitre-section{width:100%;margin-bottom:0}