/* Honorine — logiciel des agents de la mairie. S'appuie sur portail.css (mêmes
   composants, mêmes polices) avec sa propre identité : vert profond, barre
   latérale sombre à courbes de niveau, interface calme où la couleur porte le sens. */

.honorine {
    --couleur: #1f5a47;
    --couleur-fonce: #143d31;
    --couleur-teinte: #e7f0ec;
    --couleur-teinte-2: #cfe2da;
    --h-barre: #111c1a;
    --h-barre-texte: #c3cfcb;
    --fond: #f3f1ec;
    background: var(--fond);
}

/* ---------- Cadre : barre latérale + contenu ---------- */
.h-cadre { display: grid; grid-template-columns: 17rem 1fr; min-height: 100vh; }
.h-barre {
    position: sticky; top: 0; height: 100vh; overflow-y: auto; padding: 1.4rem 1rem;
    display: flex; flex-direction: column; gap: 1.4rem; color: var(--h-barre-texte);
    background: url("../img/topographie.svg") 30% 60% / 620px auto no-repeat, linear-gradient(170deg, #16302a 0%, #111c1a 45%, #141a26 100%);
    background-blend-mode: soft-light, normal;
}
.h-barre::before { content: ""; position: absolute; inset: 0; background: url("../img/topographie.svg") center / 700px auto no-repeat; opacity: .05; pointer-events: none; }
.h-marque { position: relative; display: flex; align-items: center; gap: .8rem; color: #fff; text-decoration: none; padding: .2rem .4rem; }
.h-marque:hover { color: #fff; }
.h-marque__monogramme {
    width: 2.7rem; height: 2.7rem; border-radius: 14px; display: grid; place-items: center; flex: none;
    background: linear-gradient(150deg, #d9b26a, #a97a33); color: #1b1a14; font: 600 1.45rem/1 var(--police-titre);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .35), 0 8px 18px -8px rgb(217 178 106 / .7);
}
.h-marque__nom { display: block; font: 600 1.25rem/1.1 var(--police-titre); letter-spacing: -.01em; }
.h-marque__commune { display: block; font-size: .78rem; color: #92a39d; margin-top: .1rem; }
.h-menu { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; }
.h-menu__titre { margin: 1.1rem .7rem .4rem; font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: #7c8e88; font-weight: 700; }
.h-menu a { display: flex; align-items: center; gap: .7rem; padding: .6rem .75rem; border-radius: 10px; color: var(--h-barre-texte); text-decoration: none; font-size: .94rem; font-weight: 500; transition: background .15s, color .15s; }
.h-menu a .icone { opacity: .8; }
.h-menu a:hover { background: rgb(255 255 255 / .06); color: #fff; }
.h-menu a[aria-current="page"] { background: linear-gradient(90deg, rgb(217 178 106 / .22), rgb(217 178 106 / .06)); color: #fff; box-shadow: inset 3px 0 0 #d9b26a; }
.h-menu a[aria-current="page"] .icone { opacity: 1; color: #e6c27f; }
.h-menu__pastille { margin-left: auto; min-width: 1.4rem; padding: 0 .4rem; height: 1.4rem; border-radius: 999px; display: grid; place-items: center; background: #d9b26a; color: #1b1a14; font-size: .74rem; font-weight: 700; }
.h-compte { position: relative; margin-top: auto; display: flex; align-items: center; gap: .7rem; padding: .8rem .6rem 0; border-top: 1px solid rgb(255 255 255 / .08); font-size: .88rem; }
.h-compte__avatar { width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; background: rgb(255 255 255 / .1); color: #fff; font-weight: 700; font-size: .85rem; flex: none; }
.h-compte__nom { color: #fff; font-weight: 600; display: block; line-height: 1.2; }
.h-compte a { color: #92a39d; font-size: .8rem; }
.h-compte a:hover { color: #fff; }

.h-contenu { padding: 1.9rem clamp(1.1rem, 3vw, 2.75rem) 3.5rem; min-width: 0; outline: none; }
.h-bandeau-demo { display: inline-flex; align-items: center; gap: .4rem; margin: 0 0 1.2rem; padding: .3rem .85rem; border-radius: 999px; background: #fbf1d9; color: #7a5a00; font-size: .78rem; font-weight: 700; letter-spacing: .02em; border: 1px solid #f0dca8; }
.h-bandeau-demo::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: #d9a52b; }

.h-entete { margin-bottom: 1.6rem; }
.h-entete h1 { margin-bottom: .25rem; }
.h-entete--ligne { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.h-surtitre { margin: 0 0 .3rem; font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; color: var(--or); }
.h-titre-bloc { font: 600 1.12rem/1.2 var(--police-titre); margin-bottom: .9rem; color: var(--encre); }
.h-aide { color: var(--texte-doux); font-size: .88rem; margin: .7rem 0 0; }

/* ---------- Accueil : bandeau de bienvenue ---------- */
.h-accueil {
    position: relative; overflow: hidden; isolation: isolate; border-radius: 22px; margin-bottom: 1.8rem;
    padding: clamp(1.6rem, 3vw, 2.4rem); min-height: 12.5rem; color: #fff;
    background: linear-gradient(170deg, #1a3a47 0%, #2a4c5b 40%, #c9876a 100%);
    box-shadow: 0 20px 40px -24px rgb(17 28 26 / .6);
}
.h-accueil .paysage { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: -1; }
.h-accueil::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(17 28 26 / .72) 0%, rgb(17 28 26 / .35) 45%, transparent 75%); }
.h-accueil h1 { color: #fff; font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.5rem); max-width: 20ch; }
.h-accueil p { color: rgb(255 255 255 / .85); max-width: 46ch; margin: 0; }
.h-accueil .h-surtitre { color: #f0cf8f; }
.h-date { display: inline-block; margin-top: 1rem; font-size: .86rem; color: rgb(255 255 255 / .75); }

/* Version crépuscule du paysage (connexion et accueil d'Honorine) */
.paysage--crepuscule .p-ciel-haut { stop-color: #1b3446; }
.paysage--crepuscule .p-ciel-milieu { stop-color: #3f5a6a; }
.paysage--crepuscule .p-ciel-bas { stop-color: #d9906b; }
.paysage--crepuscule .p-halo-coeur { stop-color: #ffb877; stop-opacity: .8; }
.paysage--crepuscule .p-halo-bord { stop-color: #ffb877; stop-opacity: 0; }
.paysage--crepuscule .p-soleil { fill: #ffc98a; }
.paysage--crepuscule .p-nuage { display: none; }
.paysage--crepuscule .p-loin { fill: #52697a; }
.paysage--crepuscule .p-coteau { fill: #5d6e56; }
.paysage--crepuscule .p-rang { stroke: #3e4d3b; opacity: .6; }
.paysage--crepuscule .p-village { fill: #3d5145; }
.paysage--crepuscule .p-mur { fill: #d8c7a8; }
.paysage--crepuscule .p-toit { fill: #4a3834; }
.paysage--crepuscule .p-fenetre { fill: #ffd27a; }
.paysage--crepuscule .p-croix { stroke: #4a3834; }
.paysage--crepuscule .p-arbre { fill: #34503d; }
.paysage--crepuscule .p-arbre-fonce { fill: #22382c; }
.paysage--crepuscule .p-tronc { fill: #2d231d; }
.paysage--crepuscule .p-avant { fill: #1a2a26; }
.paysage--crepuscule .p-chemin { stroke: #6e6653; opacity: .6; }

/* ---------- Indicateurs ---------- */
.h-kpis { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); margin-bottom: 1.8rem; }
.h-kpi { background: #fff; border: 1px solid var(--bordure); border-radius: 16px; padding: 1.1rem 1.2rem; box-shadow: var(--ombre); display: grid; gap: .2rem; text-decoration: none; color: inherit; transition: transform .15s, box-shadow .15s; }
a.h-kpi:hover { transform: translateY(-2px); box-shadow: var(--ombre-survol); color: inherit; }
.h-kpi__valeur { font: 600 2rem/1 var(--police-titre); color: var(--encre); font-variant-numeric: tabular-nums; }
.h-kpi__libelle { color: var(--texte-doux); font-size: .88rem; }
.h-kpi--alerte { box-shadow: inset 4px 0 0 #d97a2b, var(--ombre); }
.h-kpi--alerte .h-kpi__valeur { color: #b3541e; }

/* ---------- Modules ---------- */
.h-modules { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.3rem; grid-template-columns: repeat(auto-fill, minmax(285px, 1fr)); }
.h-module { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--bordure); border-radius: 20px; overflow: hidden; box-shadow: var(--ombre); transition: transform .2s, box-shadow .2s; }
.h-module:not(.h-module--bientot):hover, .h-module:not(.h-module--bientot):focus-within { transform: translateY(-3px); box-shadow: var(--ombre-survol); }
.h-module__scene { height: 9.5rem; border-bottom: 1px solid var(--bordure); overflow: hidden; }
.h-module__scene .scene { display: block; width: 100%; height: 100%; transition: transform .6s ease; }
.h-module:not(.h-module--bientot):hover .scene { transform: scale(1.035); }
.h-module__corps { padding: 1.2rem 1.35rem 1.3rem; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.h-module__corps .carte__titre { font: 600 1.22rem/1.2 var(--police-titre); }
.h-module--bientot .h-module__scene { filter: grayscale(.85) opacity(.65); }
.h-module--bientot .carte__titre, .h-module--bientot .carte__texte { color: var(--texte-doux); }
.h-module__chiffres { margin: auto 0 0; padding-top: .8rem; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .88rem; color: var(--texte-doux); }
.pastille { display: inline-block; padding: .18rem .62rem; border-radius: 999px; font-size: .78rem; font-weight: 700; }
.pastille--rouge { background: #fde4e2; color: #9c231d; }
.pastille--orange { background: #fdebdc; color: #93470c; }
.pastille--jaune { background: #fdf3cf; color: #7a5a00; }
.pastille--bleu { background: #e3eefb; color: #1f5fa8; }
.pastille--vert { background: #dff1e6; color: #1d6b41; }
.etiquette-bientot { padding: .18rem .65rem; border-radius: 999px; background: #eeebe4; color: #6b7280; font-size: .78rem; font-weight: 700; letter-spacing: .02em; }

/* ---------- Plan du cimetière ---------- */
.h-recherche { display: flex; align-items: center; gap: .5rem; background: #fff; border: 1.5px solid #d5cdbf; border-radius: 14px; padding: 0 .5rem 0 .9rem; min-width: min(27rem, 100%); box-shadow: var(--ombre); }
.h-recherche:focus-within { border-color: var(--couleur); box-shadow: 0 0 0 4px color-mix(in srgb, var(--couleur) 16%, transparent); }
.h-recherche input { border: 0; outline: none; min-height: 2.9rem; padding: 0; background: transparent; box-shadow: none; }
.h-recherche input:focus { box-shadow: none; }
.h-plan { display: grid; grid-template-columns: minmax(0, 1fr) 17.5rem; gap: 1.3rem; align-items: start; }
.h-plan__legende { background: #fff; border: 1px solid var(--bordure); border-radius: 18px; padding: 1.25rem; position: sticky; top: 1rem; box-shadow: var(--ombre); }
.h-plan__carte .plan-cadre { border-radius: 18px; box-shadow: var(--ombre); }
.tombe { fill-opacity: .42; stroke-width: 5; transition: fill-opacity .15s, opacity .2s; }
.tombe--vert { fill: var(--tombe-vert); stroke: var(--tombe-vert); }
.tombe--jaune { fill: var(--tombe-jaune); stroke: var(--tombe-jaune); }
.tombe--orange { fill: var(--tombe-orange); stroke: var(--tombe-orange); }
.tombe--rouge { fill: var(--tombe-rouge); stroke: var(--tombe-rouge); }
.tombe--libre { fill: #fff; fill-opacity: .18; stroke: #fff; stroke-dasharray: 8 6; }
.plan-lien:hover .tombe, .plan-lien:focus .tombe { fill-opacity: .6; stroke: #fff; }
.plan-lien:focus { outline: none; }
.tombe.est-estompee { opacity: .12; }
.tombe.est-trouvee { fill-opacity: .55; stroke: #fff; stroke-width: 5; }
.legende-etats { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.legende-etat { width: 100%; display: flex; align-items: center; gap: .65rem; padding: .55rem .65rem; border: 1px solid transparent; border-radius: 10px; background: none; font: inherit; text-align: left; cursor: pointer; color: var(--texte); }
.legende-etat:hover { background: var(--fond); }
.legende-etat[aria-pressed="true"] { border-color: var(--couleur); background: var(--couleur-teinte); }
.legende-etat__libelle { flex: 1; font-size: .9rem; }
.legende-etat strong { font-variant-numeric: tabular-nums; }
.pastille-couleur { width: 1rem; height: 1rem; border-radius: 5px; flex: none; display: inline-block; border: 2px solid; }
.pastille-couleur.tombe--vert { background: var(--tombe-vert); border-color: var(--tombe-vert); }
.pastille-couleur.tombe--jaune { background: var(--tombe-jaune); border-color: var(--tombe-jaune); }
.pastille-couleur.tombe--orange { background: var(--tombe-orange); border-color: var(--tombe-orange); }
.pastille-couleur.tombe--rouge { background: var(--tombe-rouge); border-color: var(--tombe-rouge); }
.pastille-couleur.tombe--libre { background: #fff; border-color: var(--tombe-libre); border-style: dashed; }

/* ---------- Fiches ---------- */
.etat { display: inline-block; padding: .32rem .9rem; border-radius: 999px; font-weight: 700; font-size: .86rem; }
.etat--vert { background: #dcf3e6; color: #16623a; }
.etat--jaune { background: #fdf3cf; color: #7a5a00; }
.etat--orange { background: #fdebdc; color: #93470c; }
.etat--rouge { background: #fde4e2; color: #9c231d; }
.etat--libre { background: #eeebe4; color: #5c6576; }
.h-fiche { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 25rem); gap: 1.3rem; align-items: start; }
.h-fiche__principal { display: grid; gap: 1.1rem; }
.h-fiche__principal .panneau { padding: 1.35rem 1.5rem; }
.h-fiche__plan { position: sticky; top: 1rem; }
.h-dl { display: grid; grid-template-columns: 9.5rem 1fr; gap: .5rem 1rem; margin: 0; }
.h-dl dt { color: var(--texte-doux); font-size: .92rem; }
.h-dl dd { margin: 0; font-weight: 550; }
.h-liste-simple { margin: 0; padding-left: 1.1rem; }
.h-defunts { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.h-journal { list-style: none; margin: 0; padding: 0 0 0 1.1rem; border-left: 2px solid var(--couleur-teinte-2); display: grid; gap: .8rem; }
.h-journal li { position: relative; }
.h-journal li::before { content: ""; position: absolute; left: -1.53rem; top: .45rem; width: .75rem; height: .75rem; border-radius: 50%; background: #fff; border: 3px solid var(--couleur); }
.h-journal__date { display: inline-block; min-width: 7.5rem; color: var(--texte-doux); font-size: .88rem; font-variant-numeric: tabular-nums; }
.h-journal__type { display: inline-block; margin-right: .4rem; padding: .08rem .55rem; border-radius: 6px; background: var(--couleur-teinte); color: var(--couleur-fonce); font-size: .78rem; font-weight: 700; }

/* ---------- Filtres ---------- */
.h-filtres { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1.2rem; }
.h-filtres a { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .9rem; border-radius: 999px; border: 1.5px solid var(--bordure); background: #fff; color: var(--texte); text-decoration: none; font-size: .9rem; font-weight: 500; }
.h-filtres a:hover { border-color: var(--bordure-forte); }
.h-filtres a[aria-current="page"] { border-color: var(--couleur); color: var(--couleur); background: var(--couleur-teinte); font-weight: 700; }

/* ---------- Salles ---------- */
.h-deux-colonnes { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.3rem; align-items: start; }
.h-bloc { background: #fff; border: 1px solid var(--bordure); border-radius: 18px; box-shadow: var(--ombre); overflow: hidden; }
.h-bloc__entete { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--bordure); }
.h-bloc__entete h2 { margin: 0; font: 600 1.1rem/1.2 var(--police-titre); }
.h-bloc .liste { border: 0; border-radius: 0; box-shadow: none; }
.h-bloc .vide { padding: 1rem 1.25rem; margin: 0; }
.h-salles { list-style: none; margin: 0 0 1.8rem; padding: 0; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.h-salle { background: #fff; border: 1px solid var(--bordure); border-radius: 18px; overflow: hidden; box-shadow: var(--ombre); }
.h-salle__visuel { aspect-ratio: 16 / 8; overflow: hidden; border-bottom: 1px solid var(--bordure); }
.h-salle__visuel svg { display: block; width: 100%; height: 100%; }
.h-salle__corps { padding: .95rem 1.1rem 1.05rem; display: grid; gap: .3rem; }
.h-salle__corps h3 { margin: 0; font: 600 1.08rem/1.2 var(--police-titre); }
.h-salle__etat { font-size: .86rem; color: var(--texte-doux); }
.h-salle__etat strong { color: var(--encre); }
.date-bloc { display: grid; place-items: center; width: 3.1rem; height: 3.3rem; border-radius: 12px; background: var(--couleur-teinte); color: var(--couleur-fonce); flex: none; line-height: 1; }
.date-bloc b { font: 600 1.25rem/1 var(--police-titre); }
.date-bloc span { font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.ligne-resa { display: flex; align-items: center; gap: .9rem; padding: .85rem 1.25rem; border-top: 1px solid var(--bordure); text-decoration: none; color: inherit; transition: background .15s; }
.ligne-resa:first-child { border-top: 0; }
.ligne-resa:hover { background: #fbfaf7; color: inherit; }
.ligne-resa__texte { flex: 1; min-width: 0; display: grid; }
.ligne-resa__texte strong { color: var(--encre); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.puce-salle { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-right: .35rem; vertical-align: 1px; }
.salle-0 { --teinte: #b86b4b; }
.salle-1 { --teinte: #3d6fa8; }
.salle-2 { --teinte: #3f7d5c; }
.salle-3 { --teinte: #8a5aa8; }
.puce-salle { background: var(--teinte); }

/* Planning mensuel multi-salles */
.planning { background: #fff; border: 1px solid var(--bordure); border-radius: 18px; overflow: hidden; box-shadow: var(--ombre); }
.planning table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.planning th { padding: .6rem; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--texte-doux); background: #fbf9f5; border-bottom: 1px solid var(--bordure); }
.planning td { vertical-align: top; height: 7.2rem; padding: .4rem; border-right: 1px solid var(--bordure); border-bottom: 1px solid var(--bordure); }
.planning td:last-child { border-right: 0; }
.planning td.hors-mois { background: #faf8f4; }
.planning td.hors-mois .planning__jour { color: #b9b1a3; }
.planning td.week-end { background: #fcfbf8; }
.planning__jour { display: inline-grid; place-items: center; min-width: 1.7rem; height: 1.7rem; border-radius: 8px; font-size: .84rem; font-weight: 600; color: var(--texte); margin-bottom: .25rem; }
.planning td.aujourdhui .planning__jour { background: var(--couleur); color: #fff; }
.resa { display: block; margin-top: .22rem; padding: .22rem .45rem; border-radius: 7px; font-size: .74rem; line-height: 1.25; text-decoration: none; color: var(--encre); background: color-mix(in srgb, var(--teinte) 14%, #fff); border-left: 3px solid var(--teinte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.resa:hover { background: color-mix(in srgb, var(--teinte) 24%, #fff); color: var(--encre); }
.resa--demande { background: repeating-linear-gradient(135deg, #fff 0 5px, color-mix(in srgb, var(--teinte) 12%, #fff) 5px 10px); border-left-style: dashed; }
.planning__legende { display: flex; flex-wrap: wrap; gap: 1rem; padding: .85rem 1.1rem; font-size: .85rem; color: var(--texte-doux); border-top: 1px solid var(--bordure); }

.h-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: flex-start; }
.h-actions form { margin: 0; }
.h-refus { display: grid; gap: .5rem; flex: 1 1 18rem; }
.h-refus textarea { min-height: 3rem; }
.bouton--danger { border-color: #c2413a; color: #a3261f; }
.bouton--danger:hover { background: #fbe6e3; color: #7c1d17; }

/* ---------- Connexion Honorine : écran partagé ---------- */
.h-connexion { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(24rem, 1fr); background: #f3f1ec; }
.h-connexion__visuel { position: relative; overflow: hidden; isolation: isolate; color: #fff; padding: clamp(2rem, 5vw, 4rem); display: flex; flex-direction: column; justify-content: space-between;
    background: linear-gradient(180deg, #13283a 0%, #1b3446 35%, #3f5a6a 70%, #a8765d 100%); }
.h-connexion__visuel .paysage { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 72%; z-index: -2; }
.h-connexion__visuel::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(10 20 28 / .35), transparent 40%, transparent 75%, rgb(10 20 28 / .45)); }
.h-connexion__visuel::before { content: ""; position: absolute; inset: 0; z-index: -3; background: radial-gradient(1.5px 1.5px at 20% 12%, #fff8, transparent), radial-gradient(1px 1px at 42% 22%, #fff7, transparent), radial-gradient(1.5px 1.5px at 68% 9%, #fff9, transparent), radial-gradient(1px 1px at 82% 26%, #fff6, transparent), radial-gradient(1px 1px at 12% 30%, #fff6, transparent), radial-gradient(1.2px 1.2px at 55% 16%, #fff7, transparent); }
.h-connexion__accroche { max-width: 26rem; }
.h-connexion__accroche h2 { color: #fff; font: 600 clamp(1.8rem, 1.2rem + 2vw, 2.6rem)/1.1 var(--police-titre); margin: 0 0 .7rem; }
.h-connexion__accroche p { color: rgb(255 255 255 / .82); margin: 0; }
.h-connexion__modules { display: flex; flex-wrap: wrap; gap: .5rem; }
.h-connexion__modules span { padding: .35rem .8rem; border-radius: 999px; background: rgb(255 255 255 / .12); backdrop-filter: blur(6px); font-size: .82rem; border: 1px solid rgb(255 255 255 / .18); }
.h-connexion__formulaire { display: grid; place-items: center; padding: 2rem 1.25rem; }
.h-connexion__carte { width: min(26rem, 100%); }
.h-connexion__carte h1 { font-size: 1.7rem; margin: 1.6rem 0 .3rem; }
.h-connexion__carte .intro { font-size: .98rem; margin-bottom: 1.5rem; }
.h-marque--centre { color: var(--encre); margin: 0; padding: 0; }
.h-marque--centre .h-marque__commune { color: var(--texte-doux); }
.h-connexion__pied { margin: 2rem 0 0; color: var(--texte-doux); font-size: .8rem; }

@media (max-width: 1100px) {
    .h-deux-colonnes { grid-template-columns: 1fr; }
}
@media (max-width: 960px) {
    .h-cadre { grid-template-columns: 1fr; }
    .h-barre { position: static; height: auto; }
    .h-plan, .h-fiche { grid-template-columns: 1fr; }
    .h-plan__legende, .h-fiche__plan { position: static; }
    .h-connexion { grid-template-columns: 1fr; }
    .h-connexion__visuel { min-height: 16rem; }
    .planning td { height: 5.5rem; }
}