:root {
    --alerte-fond: #fff4dc;
    --alerte-bord: #e7b54a;
    --alerte-texte: #5a3a00;
    --pave-date: 3.6rem;
    --fond-commune-hauteur: 30rem;
    --plan-enfance: #a8561a;
    --plan-patrimoine: #5b4a8a;
    --plan-loisirs: #2f6f8f;
    --plan-tri: #5e6f22;
}

.bandeau-alerte { background: var(--alerte-fond); border-bottom: 1px solid var(--alerte-bord); color: var(--alerte-texte); }
.bandeau-alerte__ligne { display: flex; align-items: center; gap: .8rem; padding-block: .75rem; flex-wrap: wrap; }
.bandeau-alerte__ligne > .icone { flex: none; color: var(--ambre); }
.bandeau-alerte p { margin: 0; flex: 1 1 24rem; }
.bandeau-alerte__texte { color: color-mix(in srgb, var(--alerte-texte) 85%, transparent); }
.bandeau-alerte__lien { color: var(--alerte-texte); font-weight: 650; white-space: nowrap; }
.bandeau-alerte__lien:hover { color: var(--encre); }

.bandeau--vitrine .bandeau__contenu { padding-block: clamp(3rem, 7vw, 5rem) clamp(6rem, 12vw, 9.5rem); }
.bandeau__titre--commune { font-size: clamp(2.8rem, 1.6rem + 5vw, 5.2rem); margin-bottom: .6rem; }
.bandeau--vitrine .surtitre { color: inherit; opacity: .85; }

.etat-mairie { display: inline-flex; align-items: center; gap: .55rem; margin: .8rem 0 0; font-weight: 650; font-size: .95rem; }
.etat-mairie__point { width: .7rem; height: .7rem; border-radius: 50%; background: var(--gris); box-shadow: 0 0 0 4px color-mix(in srgb, var(--gris) 22%, transparent); flex: none; }
.etat-mairie--ouverte { color: var(--vert); }
.etat-mairie--ouverte .etat-mairie__point { background: var(--vert); box-shadow: 0 0 0 4px color-mix(in srgb, var(--vert) 22%, transparent); }
.etat-mairie--fermee { color: var(--texte-doux); }
.etat-mairie--bandeau { margin-top: 1.4rem; padding: .5rem 1rem .5rem .8rem; border-radius: 999px; background: rgb(255 255 255 / .92); color: var(--encre); }
.etat-mairie--bandeau.etat-mairie--ouverte { color: var(--vert); }

.chiffres-cles { background: var(--encre); color: #fff; }
.chiffres-cles__liste { list-style: none; margin: 0 auto; padding: 1.1rem 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .8rem 1.5rem; }
.chiffres-cles__liste li { display: flex; flex-direction: column; line-height: 1.25; }
.chiffres-cles__liste strong { font: 600 1.7rem/1.1 var(--police-titre); color: #ffd98a; }
.chiffres-cles__liste span { font-size: .88rem; color: rgb(255 255 255 / .78); }

.une { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.section.demarches { margin-top: 3.5rem; }
.lien-fleche { display: inline-flex; align-items: center; gap: .35rem; font-weight: 650; font-size: .95rem; text-decoration: none; }
.lien-fleche:hover { text-decoration: underline; }
.lien-fleche--retour .icone { transform: scaleX(-1); }

.actualites { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.actualites--liste { grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); }
.actualites--etroites { grid-template-columns: 1fr; gap: .7rem; }
.actualite { position: relative; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1.1rem 1.25rem 1.2rem; box-shadow: var(--ombre); transition: border-color .15s, box-shadow .15s; }
.actualite:hover, .actualite:focus-within { border-color: var(--couleur); box-shadow: var(--ombre-survol); }
.actualite:has(.carte__lien:focus-visible) { outline: 3px solid var(--couleur); outline-offset: 2px; }
.actualite--une { grid-column: 1 / -1; padding: 1.5rem 1.6rem; border-top: 4px solid var(--couleur); }
.actualite--une .actualite__titre { font: 600 1.45rem/1.2 var(--police-titre); }
.actualite--alerte { border-left: 4px solid var(--alerte-bord); }
.actualite__date { margin: 0 0 .35rem; font-size: .84rem; color: var(--texte-doux); }
.actualite__marque { color: var(--ambre); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: .76rem; }
.actualite__titre { margin: 0; font-size: 1.06rem; font-weight: 650; line-height: 1.3; }
.actualite__chapo { margin: .5rem 0 0; color: var(--texte-doux); font-size: .95rem; line-height: 1.55; }

.agenda-court { list-style: none; margin: 0 0 1.2rem; padding: 0; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); box-shadow: var(--ombre); }
.agenda-court li { display: flex; gap: 1rem; align-items: center; padding: .9rem 1.1rem; }
.agenda-court li + li { border-top: 1px solid var(--bordure); }
.agenda-court__titre { margin: 0; font-weight: 650; line-height: 1.3; }
.agenda-court__infos { margin: .15rem 0 0; font-size: .88rem; color: var(--texte-doux); }
.agenda-court__infos:empty { display: none; }

.pave-date { flex: none; width: var(--pave-date); height: var(--pave-date); border-radius: 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--couleur-teinte); color: var(--couleur-fonce); line-height: 1; }
.pave-date__jour { font: 600 1.45rem/1 var(--police-titre); }
.pave-date__mois { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-top: .2rem; }

.agenda-mois + .agenda-mois { margin-top: 2.5rem; }
.agenda-mois__titre { font: 600 1.25rem/1.2 var(--police-titre); padding-bottom: .5rem; border-bottom: 1px solid var(--bordure-forte); margin-bottom: 1rem; }
.agenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.agenda__rdv { display: flex; gap: 1.2rem; align-items: flex-start; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1.2rem 1.3rem; box-shadow: var(--ombre); }
.agenda__titre { margin: 0 0 .45rem; font-size: 1.12rem; }
.agenda__faits { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem 1.2rem; font-size: .93rem; color: var(--texte-doux); }
.agenda__faits li { display: inline-flex; align-items: center; gap: .35rem; }
.agenda__texte { margin: .7rem 0 0; }

.mairie-encart { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 1.5rem 2.5rem; align-items: center; background: var(--couleur-teinte); border: 1px solid var(--couleur-teinte-2); border-radius: var(--rayon); padding: clamp(1.4rem, 3vw, 2.2rem); }
.mairie-encart .section__titre { margin-bottom: .7rem; }
.mairie-encart p { margin-bottom: .3rem; }
.mairie-encart__titre { font: 600 1.1rem/1.2 var(--police-titre); margin: 0 0 .6rem; color: var(--encre); }
.mairie-encart__action { margin: 0; }
.mairie-encart .pied__ligne { display: flex; gap: .5rem; align-items: flex-start; }

.commune-grille { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 2rem; align-items: start; }
.commune-aside { display: grid; gap: 1.2rem; position: sticky; top: 6rem; }
.commune-aside .panneau { padding: 1.4rem; }
.commune-aside .pied__ligne { display: flex; gap: .5rem; align-items: flex-start; margin-bottom: .6rem; }
.commune-aside .bouton { margin-top: .6rem; }
.chiffres-liste { margin: 0; display: grid; gap: .55rem; }
.chiffres-liste div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed var(--bordure); padding-bottom: .45rem; }
.chiffres-liste div:last-child { border-bottom: 0; padding-bottom: 0; }
.chiffres-liste dt { color: var(--texte-doux); font-size: .92rem; }
.chiffres-liste dd { margin: 0; font-weight: 700; color: var(--encre); text-align: right; }

.elus { list-style: none; margin: 0; padding: 0; }
.elus--executif { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .9rem; }
.elu { display: flex; gap: .9rem; align-items: center; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: .9rem 1rem; }
.elu__initiales { flex: none; width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; background: var(--couleur); color: #fff; font: 600 1.05rem/1 var(--police-titre); letter-spacing: .03em; }
.elu__nom { display: block; font-weight: 650; color: var(--encre); }
.elu__fonction { display: block; font-size: .9rem; color: var(--texte-doux); }
.elus__sous-titre { margin: 1.8rem 0 .8rem; font-size: 1rem; color: var(--texte-doux); font-weight: 650; }
.elus--conseil { columns: 3 13rem; column-gap: 2rem; }
.elus--conseil li { break-inside: avoid; padding: .3rem 0; border-bottom: 1px solid var(--bordure); }

.article-grille { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: 2rem; align-items: start; }
.article h1 { margin-top: .2rem; }
.article--alerte { border-top: 4px solid var(--alerte-bord); }
.article__chapo { font-size: 1.14rem; color: var(--encre); font-weight: 500; line-height: 1.55; }
.article__retour { margin: 2rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--bordure); }

.associations { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.association { display: flex; gap: 1rem; align-items: flex-start; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1.2rem; box-shadow: var(--ombre); }
.association .carte__picto { flex: none; margin: 0; }
.association__nom { font: 600 1.12rem/1.25 var(--police-titre); margin: .1rem 0 .2rem; }
.association__domaine { margin: 0 0 .5rem; font-size: .88rem; font-weight: 650; color: var(--or-texte); }
.association__contact { margin: .6rem 0 0; font-size: .92rem; }

@media (max-width: 960px) {
    .une, .commune-grille, .article-grille { grid-template-columns: 1fr; }
    .commune-aside { position: static; }
    .mairie-encart { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .actualites { grid-template-columns: 1fr; }
    .section.demarches { margin-top: 2.5rem; }
    .bandeau--vitrine .bandeau__contenu { padding-bottom: 7rem; }
    .agenda__rdv { padding: 1rem; gap: .9rem; }
    .bandeau-alerte__texte { display: none; }
    .bandeau-alerte__ligne { display: grid; grid-template-columns: auto 1fr; gap: .15rem .7rem; padding-block: .6rem; }
    .bandeau-alerte__ligne > .icone { grid-row: span 2; align-self: start; margin-top: .15rem; }
    .bandeau-alerte + .bandeau-alerte .bandeau-alerte__ligne { padding-top: .5rem; }
    .navigation ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: .2rem; }
    .navigation ul::-webkit-scrollbar { display: none; }
    .navigation li { flex: none; }
    .chiffres-cles__liste strong { font-size: 1.45rem; }
}
@media print {
    .bandeau-alerte, .chiffres-cles { display: none !important; }
}
.horaires { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.horaires__jours { display: block; font-weight: 650; color: inherit; }
.horaires__heures { display: block; }
.pied .horaires__heures { opacity: .85; }

.fond-commune main { position: relative; isolation: isolate; }
.fond-commune main::before { content: ""; position: absolute; inset: 0 0 auto; height: var(--fond-commune-hauteur); z-index: -1; background: var(--photo-commune) center 35% / cover no-repeat; filter: blur(3px) saturate(.9); opacity: .38; mask-image: linear-gradient(to bottom, #000 30%, transparent); -webkit-mask-image: linear-gradient(to bottom, #000 30%, transparent); }
.fond-commune main::after { content: ""; position: absolute; inset: 0 0 auto; height: var(--fond-commune-hauteur); z-index: -1; background: linear-gradient(to bottom, rgb(247 244 238 / .35), var(--fond)); }
.fond-commune .entete-page h1, .fond-commune .article h1 { text-shadow: 0 1px 0 rgb(255 255 255 / .6); }

.contenu-editorial .tableau-defilant { margin: 1.2rem 0; box-shadow: none; }
.contenu-editorial table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.contenu-editorial th, .contenu-editorial td { padding: .6rem .8rem; border-bottom: 1px solid var(--bordure); text-align: left; vertical-align: top; }
.contenu-editorial thead th { background: var(--couleur-teinte); color: var(--encre); font-weight: 650; }
.contenu-editorial tbody th { font-weight: 600; color: var(--encre); }
.contenu-editorial td { white-space: nowrap; }

.sommaire ul { list-style: none; margin: 0 0 2rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.sommaire a { display: inline-block; padding: .4rem .9rem; border: 1px solid var(--bordure-forte); border-radius: 999px; background: var(--blanc); text-decoration: none; font-size: .92rem; font-weight: 600; }
.sommaire a:hover { border-color: var(--couleur); }
.rubrique { margin-bottom: 2.6rem; scroll-margin-top: 6rem; }
.rubrique__titre { font: 600 1.3rem/1.2 var(--police-titre); padding-bottom: .5rem; border-bottom: 1px solid var(--bordure-forte); margin-bottom: 1.1rem; }

.fiches { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.fiche { background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1.2rem 1.3rem; box-shadow: var(--ombre); }
.fiche__nom { font: 600 1.08rem/1.3 var(--police-titre); margin: 0 0 .4rem; }
.fiche__description { margin: 0 0 .7rem; color: var(--texte-doux); font-size: .94rem; }
.fiche__coordonnees { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; font-size: .94rem; }
.fiche__coordonnees li, .fiche__horaires { display: flex; gap: .5rem; align-items: flex-start; overflow-wrap: anywhere; }
.fiche__coordonnees .icone, .fiche__horaires .icone { flex: none; margin-top: .2rem; color: var(--texte-doux); }
.fiche__horaires { margin: .7rem 0 0; padding-top: .7rem; border-top: 1px dashed var(--bordure); font-size: .9rem; color: var(--texte-doux); }

.demarches-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.demarche { display: flex; gap: 1.2rem; align-items: center; justify-content: space-between; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1rem 1.2rem; }
.demarche__titre { font-size: 1.04rem; margin: 0 0 .2rem; }
.demarche__texte { margin: 0; color: var(--texte-doux); font-size: .93rem; max-width: 70ch; }
.demarche__action { flex: none; }

.pratique { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.pratique--deux { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.pratique__tuile { position: relative; display: grid; grid-template-columns: auto 1fr; gap: .15rem .85rem; align-items: start; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1rem 1.1rem; box-shadow: var(--ombre); transition: border-color .15s, box-shadow .15s; }
.pratique__tuile:hover, .pratique__tuile:focus-within { border-color: var(--couleur); box-shadow: var(--ombre-survol); }
.pratique__tuile:has(.carte__lien:focus-visible) { outline: 3px solid var(--couleur); outline-offset: 2px; }
.pratique__tuile--urgence { border-left: 4px solid var(--vert); }
.pratique__picto { grid-row: span 2; width: 2.6rem; height: 2.6rem; border-radius: 6px; display: grid; place-items: center; background: var(--couleur-teinte); color: var(--couleur-fonce); }
.pratique__titre { font-weight: 650; font-size: 1.02rem; }
.pratique__texte { font-size: .9rem; color: var(--texte-doux); line-height: 1.45; }

.plan-village { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 2rem; align-items: start; }
.plan-village__carte { margin: 0; background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: .8rem; box-shadow: var(--ombre); position: sticky; top: 6rem; }
.plan-village__carte svg { display: block; width: 100%; height: auto; background: color-mix(in srgb, var(--couleur) 4%, #fbf9f4); border-radius: var(--rayon-petit); }
.plan-village__carte figcaption { margin-top: .6rem; font-size: .85rem; color: var(--texte-doux); }
.plan-village__trait { stroke: color-mix(in srgb, var(--couleur) 10%, #e9e3d7); stroke-width: 1; }
.plan-village__rose circle { fill: var(--blanc); stroke: var(--bordure-forte); }
.plan-village__rose path { fill: var(--encre); }
.plan-village__rose text { font: 700 16px var(--police); fill: var(--encre); }
.plan-point circle { stroke: #fff; stroke-width: 3; }
.plan-point text { font: 700 14px var(--police); fill: #fff; }
.plan-point--defibrillateur circle { fill: var(--vert); }
.plan-point--service circle { fill: var(--couleur); }
.plan-point--enfance circle { fill: var(--plan-enfance); }
.plan-point--patrimoine circle { fill: var(--plan-patrimoine); }
.plan-point--loisirs circle { fill: var(--plan-loisirs); }
.plan-point--stationnement circle { fill: var(--gris); }
.plan-point--tri circle { fill: var(--plan-tri); }
.plan-pastille { display: inline-block; width: .8rem; height: .8rem; border-radius: 50%; flex: none; background: var(--gris); }
.plan-pastille.plan-point--defibrillateur { background: var(--vert); }
.plan-pastille.plan-point--service { background: var(--couleur); }
.plan-pastille.plan-point--enfance { background: var(--plan-enfance); }
.plan-pastille.plan-point--patrimoine { background: var(--plan-patrimoine); }
.plan-pastille.plan-point--loisirs { background: var(--plan-loisirs); }
.plan-pastille.plan-point--tri { background: var(--plan-tri); }
.plan-village__categorie { display: flex; align-items: center; gap: .55rem; font: 600 1.02rem/1.2 var(--police-titre); margin: 1.4rem 0 .6rem; }
.plan-village__categorie:first-child { margin-top: 0; }
.plan-village__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; font-size: .94rem; }
.plan-village__liste li { display: grid; grid-template-columns: 1.8rem 1fr auto; gap: .6rem; align-items: baseline; padding: .35rem 0; border-bottom: 1px solid var(--bordure); }
.plan-village__liste a { font-size: .86rem; white-space: nowrap; }
.plan-village__numero { font-weight: 700; color: var(--encre); text-align: right; }

.seances { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.seance { background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: 1.1rem 1.3rem; box-shadow: var(--ombre); }
.seance__titre { font: 600 1.08rem/1.3 var(--police-titre); margin: 0 0 .6rem; }
.actes { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.actes--cartes { gap: .8rem; }
.actes--cartes .acte { background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: .9rem 1.1rem; }
.seance .acte { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .1rem 1rem; padding-top: .5rem; border-top: 1px solid var(--bordure); }
.seance .acte:first-child { border-top: 0; padding-top: 0; }
.acte__nature { font-weight: 650; color: var(--encre); }
.acte__nature--deliberation { font-size: .85rem; color: var(--or-texte); text-transform: uppercase; letter-spacing: .06em; }
.acte__titre { display: block; font-weight: 600; color: var(--encre); }
.acte__detail { display: block; font-size: .92rem; color: var(--texte); }
.acte__date { display: block; font-size: .85rem; color: var(--texte-doux); }
.acte__lien { display: inline-flex; align-items: center; gap: .35rem; font-size: .9rem; font-weight: 600; white-space: nowrap; }
.seance .acte__lien { grid-column: 2; grid-row: 1 / span 3; align-self: center; }

@media (max-width: 960px) {
    .plan-village { grid-template-columns: 1fr; }
    .plan-village__carte { position: static; }
}
@media (max-width: 640px) {
    .demarche { flex-direction: column; align-items: stretch; }
    .fiches { grid-template-columns: 1fr; }
    .seance .acte { grid-template-columns: 1fr; }
    .seance .acte__lien { grid-column: 1; grid-row: auto; }
}