/* Accueil « mélange » : structure commune (gabarits/accueil.html). L'univers de chaque site se règle dans
   sites/<id>/theme/static/accueil.css (variables --a-* ci-dessous + motifs, vignettes d'outils), ajouté à la suite au build. */
.accueil, .acc-univers {
  --a-ouv-fond: var(--fond); --a-ouv-texte: var(--texte); --a-ouv-pale: var(--a-pale);
  --a-carte: var(--fond); --a-trait: var(--doux); --a-texte: var(--texte); --a-pale: #555;
  --a-accent: var(--accent); --a-lien: var(--accent); --a-etiquette: var(--a-pale);
  --a-titre: inherit; --a-mono: ui-monospace, Consolas, monospace;
  --a-rayon: 12px; --a-bord: 1.5px; --a-ombre: none; --a-focus: var(--accent);
}
.accueil main.conteneur { max-width: 1160px; padding: 0 18px; }
.accueil .conteneur { box-sizing: border-box; }
.accueil :focus-visible { outline: 3px solid var(--a-focus); outline-offset: 3px; }
.acc-ouverture h1, .acc-ouverture h2, .acc-ouverture h3, .acc-bloc h2, .acc-bloc h3, .acc-confiance h2 { font-family: var(--a-titre); margin: 0; }
.accueil svg { max-width: 100%; }

/* 1. Ouverture */
.acc-ouverture { position: relative; overflow: hidden; background: var(--a-ouv-fond); color: var(--a-ouv-texte); }
.acc-ouverture .conteneur { max-width: 1160px; padding: 0 18px; position: relative; }
.acc-tete { position: relative; }
.acc-tete > .conteneur { padding-top: 30px; padding-bottom: 30px; }
.acc-surtitre { font: 13px/1.5 var(--a-mono); color: var(--a-ouv-pale); letter-spacing: .03em; margin: 0 0 12px; }
.acc-ouverture h1 { font-size: clamp(32px, 6.2vw, 56px); line-height: 1.08; max-width: 18ch; color: inherit; }
.acc-ouverture h1 em { font-style: normal; }
.acc-chapo { font-size: 19px; line-height: 1.6; max-width: 54ch; margin: 14px 0 0; }
.acc-chez { padding-bottom: 34px; }
.acc-vous { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 10px 0 12px; }
.acc-vous h2 { font-size: clamp(28px, 4.6vw, 40px); line-height: 1.12; }
.acc-vous span { font: 13px var(--a-mono); color: var(--a-ouv-pale); }
.acc-scene { display: grid; gap: 22px; align-items: start; }
@media (min-width: 960px) { .acc-scene { grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: 40px; } }
.acc-situations { list-style: none; margin: 0; padding: 0; counter-reset: s; }
.acc-situation { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 14px;
  align-items: center; width: 100%; padding: 10px 6px; color: inherit; }
.acc-situation:focus-visible { outline: 3px solid var(--a-focus); outline-offset: -3px; }
.acc-icone { width: 54px; height: 54px; display: grid; place-items: center; }
.acc-icone svg { width: 36px; height: 36px; }
.acc-s-nom { display: block; font: 600 19px/1.2 var(--a-titre); }
.acc-s-indice { display: block; font: 13px/1.4 var(--a-mono); color: var(--a-ouv-pale); margin-top: 3px; }
.acc-s-num { font: 12px var(--a-mono); color: var(--a-ouv-pale); }
.acc-s-num::before { counter-increment: s; content: "0" counter(s); }
.acc-parcours { background: var(--a-carte); color: var(--a-texte); border: var(--a-bord) solid var(--a-trait); border-radius: var(--a-rayon);
  padding: 20px 18px 18px; margin: 4px 0 14px; position: relative; }
.acc-js .acc-parcours[hidden] { display: none; }
.acc-js .acc-parcours { animation: acc-apparait .35s ease-out; }
@keyframes acc-apparait { from { opacity: 0; transform: translateY(6px); } }
.acc-p-tete { font: 12px var(--a-mono); color: var(--a-etiquette); text-transform: uppercase; letter-spacing: .1em; margin: 0 0 4px; }
.acc-parcours > h3 { font-size: 25px; line-height: 1.15; margin-bottom: 14px; }
.acc-etapes { list-style: none; margin: 0; padding: 0; position: relative; counter-reset: e; }
.acc-etapes > li { position: relative; padding-left: 40px; margin-bottom: 16px; counter-increment: e; }
.acc-etapes > li:last-child { margin-bottom: 0; }
.acc-e-titre { display: block; font: 700 12px var(--a-mono); text-transform: uppercase; letter-spacing: .1em; margin-bottom: 4px; }
.acc-etapes p { margin: 0 0 8px; }
.acc-choix { margin-top: 10px; border: var(--a-bord) solid var(--a-trait); border-radius: var(--a-rayon); padding: 14px; }
.acc-choix-label { font: 12px var(--a-mono); color: var(--a-etiquette); text-transform: uppercase; letter-spacing: .08em; }
.acc-choix-nom { font: 600 22px/1.15 var(--a-titre); margin: 2px 0 8px; }
.acc-cotes { display: flex; flex-wrap: wrap; gap: 6px 0; margin: 0 0 8px; padding: 0; list-style: none; font: 14px var(--a-mono); }
.acc-choix-defaut { font-size: 16px; margin: 0 0 12px; }
.acc-choix .bouton, .acc-bouton-second { margin-top: 2px; }
.acc-lien-fort { font: 600 19px var(--a-titre); }
.acc-affil { font: 12px/1.5 var(--a-mono); color: var(--a-ouv-pale); margin: 14px 0 0; }

/* Titres de section */
.acc-bloc { padding-top: 60px; }
.acc-entete-bloc { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; margin-bottom: 22px; }
.acc-bloc h2 { font-size: clamp(28px, 4.2vw, 40px); line-height: 1.12; max-width: 24ch; }
.acc-entete-bloc p { font: 13px/1.5 var(--a-mono); color: var(--a-pale); margin: 0; }

/* 2. Outils : chaque case montre l'outil (placement des cases : univers du site) */
.acc-outils { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .acc-outils { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .acc-outils { grid-template-columns: repeat(12, minmax(0, 1fr)); } .acc-outil { grid-column: span 6; } }
.acc-outil { position: relative; background: var(--a-carte); border: var(--a-bord) solid var(--a-trait); border-radius: var(--a-rayon);
  padding: 18px; display: flex; flex-direction: column; min-width: 0; }
.acc-num { font: 12px var(--a-mono); color: var(--a-etiquette); letter-spacing: .08em; text-transform: uppercase; margin: 0; }
.acc-outil h3 { font-size: 22px; line-height: 1.15; margin: 6px 0; }
.acc-outil h3 a { color: var(--a-texte); text-decoration: none; }
.acc-outil h3 a::after { content: ""; position: absolute; inset: 0; border-radius: var(--a-rayon); }
.acc-outil h3 a:hover { text-decoration: underline; }
.acc-outil:focus-within { outline: 3px solid var(--a-focus); outline-offset: 3px; }
.acc-outil h3 a:focus-visible { outline: none; }
.acc-outil p { font-size: 16px; color: var(--a-pale); margin: 0 0 12px; }
.acc-vers { margin-top: auto; font: 13px var(--a-mono); color: var(--a-lien); }
.acc-vis { margin: 6px 0 14px; }
.acc-vivant { position: relative; z-index: 1; }

/* 3a. Ce mois-ci */
.acc-agenda { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1px solid var(--a-trait); }
.acc-agenda li { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--a-trait); }
.acc-agenda time { font: 700 13px/1.35 var(--a-mono); color: var(--a-lien); }
.acc-agenda time small { display: block; font-weight: 400; font-size: 13px; color: var(--a-pale); }
.acc-agenda time b { display: inline-block; margin-top: 4px; }
.acc-agenda time svg { display: block; width: 26px; height: 26px; margin-bottom: 6px; }
.acc-agenda h3 { font-size: 20px; line-height: 1.2; margin: 0 0 3px; }
.acc-agenda p { margin: 0; font-size: 16px; color: var(--a-pale); }
.acc-agenda p a { color: var(--a-lien); }
.acc-l-ombre { fill: var(--a-carte); stroke: currentColor; stroke-width: 1.2; }
.acc-l-lumiere { fill: currentColor; }
@media (min-width: 900px) {
  .acc-agenda { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; border-top: 0; }
  .acc-agenda li { grid-template-columns: 1fr; gap: 6px; border-top: 1px solid var(--a-trait); border-bottom: 0; padding-top: 16px; }
}

/* 3b. Derniers articles : couverture 16:9 (image si elle existe, sinon emplacement aux couleurs du site) */
.acc-cartes { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px 24px; grid-template-columns: minmax(0, 1fr); counter-reset: c; }
@media (min-width: 620px) { .acc-cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .acc-cartes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.acc-carte { position: relative; display: flex; flex-direction: column; counter-increment: c; min-width: 0; }
.acc-carte:focus-within .acc-couv { outline: 3px solid var(--a-focus); outline-offset: 3px; }
.acc-carte h3 { font-size: 20px; line-height: 1.25; margin: 0; }
.acc-carte h3 a { color: var(--a-texte); text-decoration: none; }
.acc-carte h3 a::after { content: ""; position: absolute; inset: 0; }
.acc-carte h3 a:focus-visible { outline: none; }
.acc-carte:hover h3 a { text-decoration: underline; }
.acc-meta { order: -1; display: flex; flex-wrap: wrap; gap: 4px 10px; font: 12px var(--a-mono); color: var(--a-pale); text-transform: uppercase; letter-spacing: .06em; margin: 12px 0 6px; }
.acc-rub { color: var(--a-lien); }
.acc-rub::before { content: counter(c, decimal-leading-zero) " · "; color: var(--a-pale); }
.acc-couv { order: -2; display: block; box-sizing: border-box; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: var(--a-rayon); border: 1px solid var(--a-trait); object-fit: cover; }
.acc-couv-attente { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 16px 18px 14px; background: var(--a-ouv-fond); color: var(--a-ouv-texte); }
.acc-couv-titre { font: 600 clamp(20px, 2.4vw, 26px)/1.15 var(--a-titre); max-width: 14ch; }
.acc-couv-titre::after { content: ""; display: block; width: 44px; height: 3px; border-radius: 2px; background: var(--a-accent); margin-top: 10px; }
.acc-couv-pied { font: 11px var(--a-mono); opacity: .85; }
.acc-tout-lire { margin: 26px 0 0; font: 14px var(--a-mono); }
@media (max-width: 619px) {  /* mobile : la plus récente en grand, les suivantes en liste à vignette */
  .acc-cartes { gap: 0; }
  .acc-carte + .acc-carte { display: grid; grid-template-columns: 116px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 14px; padding: 14px 0; border-top: 1px solid var(--a-trait); }
  .acc-carte:first-child { padding-bottom: 18px; }
  .acc-carte + .acc-carte .acc-couv { grid-column: 1; grid-row: 1 / span 2; border-radius: 6px; padding: 8px; }
  .acc-carte + .acc-carte .acc-couv-titre, .acc-carte + .acc-carte .acc-couv-pied { display: none; }
  .acc-carte + .acc-carte .acc-meta { grid-column: 2; margin: 0 0 4px; font-size: 11px; }
  .acc-carte + .acc-carte h3 { grid-column: 2; font-size: 17px; }
}

/* Texte de l'accueil (pages/index.md) et rubriques */
.acc-texte { max-width: 760px; }
.acc-texte h2 { font-size: clamp(24px, 3.2vw, 30px); margin: 34px 0 10px; max-width: none; }
.acc-texte > p:first-child { font-size: 20px; }
.acc-rubriques { display: grid; gap: 22px 32px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.acc-rubrique h3 { font-size: 20px; margin: 0 0 8px; }
.acc-rubrique h3 a { color: var(--a-texte); }
.acc-rubrique ul { list-style: none; margin: 0; padding: 0; font-size: 16px; }
.acc-rubrique li { padding: 4px 0; border-top: 1px solid var(--a-trait); }
.acc-rubrique li a { display: block; padding: 6px 0; }

/* 4. Confiance courte */
.acc-confiance { margin-top: 70px; border-top: 1px solid var(--a-trait); }
.acc-confiance .conteneur { max-width: 1160px; padding: 34px 18px; display: grid; gap: 22px 40px; }
@media (min-width: 900px) { .acc-confiance .conteneur { grid-template-columns: 1fr 1fr 1fr; } }
.acc-confiance h2 { font: 400 15px var(--a-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--a-etiquette); margin: 0 0 10px; }
.acc-qui { display: flex; gap: 14px; align-items: center; margin-bottom: 8px; }
.acc-qui img { width: 60px; height: 60px; flex: 0 0 60px; border-radius: 50%; }
.acc-qui strong { display: block; font: 600 21px var(--a-titre); }
.acc-qui span { font: 12px var(--a-mono); color: var(--a-pale); }
.acc-confiance p { font-size: 16px; margin: 0 0 8px; }
.acc-engagements { list-style: none; margin: 0; padding: 0; font-size: 16px; }
.acc-engagements li { padding: 6px 0 6px 22px; position: relative; }
.acc-honnete { border: var(--a-bord) dashed var(--a-accent); border-radius: var(--a-rayon); padding: 14px 16px; }

@media (prefers-reduced-motion: reduce) {
  .accueil *, .accueil *::before, .accueil *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Pas de bande vide entre le bloc confiance et le pied de page */
.acc-confiance ~ .pied { margin-top: 0; }

/* Soleil Compté — accueil « mélange » : le cadran solaire et le relevé de compteur (s'ajoute à usine/static/accueil.css).
   Ouverture sur le bleu cellule quadrillé avec la scène du balcon (soleil sur son arc, compteur qui défile), règle du cadran,
   situations en relevés, parcours en cartouche du bureau d'études, outils sur papier millimétré. */
.accueil, .acc-univers {
  --a-ouv-fond: transparent; --a-ouv-texte: var(--ardoise); --a-ouv-pale: var(--gris);
  --a-carte: var(--blanc); --a-trait: var(--ardoise); --a-texte: var(--ardoise); --a-pale: var(--gris); --a-etiquette: var(--terre-texte);
  --a-accent: var(--jaune); --a-lien: var(--cellule); --a-focus: var(--cellule);
  --a-titre: var(--titre); --a-mono: var(--mono); --a-rayon: 3px; --a-bord: 1.5px;
}
.acc-ouverture h1, .acc-ouverture h2, .acc-ouverture h3, .acc-bloc h2, .acc-bloc h3 { font-weight: 400; }

/* Ouverture : bleu cellule quadrillé, texte à gauche, balcon à droite (en dessous sur petit écran) */
.acc-tete { color: var(--papier); background-color: var(--cellule); background-image: var(--cellules); background-size: 42px 42px, 42px 42px, 126px 42px;
  display: grid; grid-template-columns: minmax(0, 1fr); }
.acc-tete > .conteneur { width: 100%; max-width: 1160px; justify-self: center; padding-top: 28px; padding-bottom: 10px; }
.acc-tete .acc-surtitre { color: #d8dee8; }
.acc-ouverture h1 { color: var(--papier); }
.acc-ouverture h1 em { color: var(--jaune); }
.acc-tete .acc-chapo { color: #eef1f5; }
.acc-balcon { order: 2; width: 100%; max-width: 440px; justify-self: center; box-sizing: border-box; padding: 6px 18px 0; }
.acc-balcon svg { display: block; width: 100%; height: auto; }
@media (min-width: 960px) {
  .acc-tete { grid-template-columns: minmax(18px, 1fr) minmax(0, 700px) minmax(0, 460px) minmax(18px, 1fr); align-items: end; }
  .acc-tete > .conteneur { grid-column: 2; grid-row: 1; max-width: none; padding-bottom: 34px; }
  .acc-balcon { grid-column: 3; grid-row: 1; order: 0; max-width: 460px; padding: 10px 18px 0 0; align-self: end; }
}
.acc-balcon .b-arc { fill: none; stroke: var(--soleil); stroke-width: 1.6; stroke-dasharray: 4 5; stroke-linecap: round; }
.acc-balcon .b-horizon { fill: none; stroke: var(--papier); stroke-opacity: .6; stroke-width: 1.2; }
.acc-balcon .b-soleil { offset-path: path("M50 214C110 30 310 30 370 214"); offset-rotate: 0deg; offset-distance: 50%; animation: b-course 48s linear infinite; }
.acc-balcon .b-soleil circle { fill: var(--jaune); stroke: var(--soleil); stroke-width: 2; }
.acc-balcon .b-rayons { fill: none; stroke: var(--jaune); stroke-width: 1.6; stroke-linecap: round; transform-box: fill-box; transform-origin: center; animation: co-rayons 24s linear infinite; }
.acc-balcon .b-facade { fill: var(--ardoise); }
.acc-balcon .b-fenetre { fill: var(--papier-2); stroke: var(--papier); stroke-width: 1.5; }
.acc-balcon .b-croisillon { fill: none; stroke: var(--ardoise); stroke-width: 2; }
.acc-balcon .b-boitier { fill: var(--papier-2); stroke: var(--papier); stroke-width: 1.5; }
.acc-balcon .b-ecran { fill: #0b1526; }
.acc-balcon .b-rouleau { font: 500 12px var(--mono); fill: var(--jaune); }
.acc-balcon .b-r3 { animation: b-roule 480s linear infinite; }
.acc-balcon .b-r4 { animation: b-roule 48s linear infinite; }
.acc-balcon .b-r5 { animation: b-roule 4.8s linear infinite; }
.acc-balcon .b-unite { font: 500 9px var(--mono); fill: var(--ardoise); letter-spacing: .08em; }
.acc-balcon .b-dalle { fill: var(--papier-2); stroke: var(--papier); stroke-width: 1.2; }
.acc-balcon .b-sous { fill: var(--ardoise-2); }
.acc-balcon .b-rail { fill: none; stroke: var(--papier); stroke-width: 2; stroke-linecap: round; }
.acc-balcon .b-panneau rect:first-child { fill: #142a47; stroke: var(--papier); stroke-width: 1.5; }
.acc-balcon .b-barre { fill: none; stroke: var(--papier); stroke-opacity: .55; stroke-width: 1.5; }
.acc-balcon .b-cable { fill: none; stroke: var(--soleil); stroke-width: 2; stroke-linecap: round; }
.acc-balcon .b-micro { fill: var(--ardoise); stroke: var(--papier); stroke-width: 1.5; }
.acc-balcon .b-prise { fill: var(--papier-2); stroke: var(--papier); stroke-width: 1.2; }
@keyframes b-course { from { offset-distance: 0%; } to { offset-distance: 100%; } }
@keyframes b-roule { to { transform: translateY(-160px); } }
@media (prefers-reduced-motion: reduce) { .acc-balcon .b-soleil, .acc-balcon .b-rayons, .acc-balcon .b-rouleau { animation: none; } }
.acc-ouverture .acc-chez { padding-top: 30px; padding-bottom: 34px; }
.acc-vous { margin-top: 0; margin-bottom: 16px; }
@media (min-width: 960px) { .acc-panneaux { position: sticky; top: 18px; } }

/* Situations : des relevés sur papier, un petit soleil au coin */
.acc-situations { display: grid; gap: 10px; }
.acc-situation { grid-template-columns: 54px minmax(0, 1fr); background: var(--blanc); border: 1.5px solid var(--ardoise); border-radius: 3px;
  padding: 8px 14px 8px 8px; position: relative; transition: background .15s, box-shadow .15s; }
.acc-situation::after { content: ""; position: absolute; right: -4px; top: -5px; width: 12px; height: 6px; border-radius: 12px 12px 0 0; background: var(--soleil); box-shadow: 0 1.5px 0 var(--ardoise); }
.acc-situation:hover { box-shadow: 3px 3px 0 var(--terre); }
.acc-situation[aria-expanded="true"] { background: #fff1bd; box-shadow: 4px 4px 0 var(--cellule); }
.acc-s-num { display: none; }
.acc-icone { width: 54px; height: 54px; border-radius: 2px; color: var(--papier); background-color: var(--cellule); background-image: var(--cellules); background-size: 14px 14px, 14px 14px, 42px 14px; box-shadow: inset 0 0 0 1.5px var(--ardoise); }
.acc-icone svg { width: 38px; height: 38px; }
.acc-s-indice { color: var(--gris); }

/* Parcours : le cartouche du bureau d'études (double filet), étapes numérotées dans des fenêtres de compteur */
.acc-parcours { border: 2px solid var(--ardoise); box-shadow: inset 0 0 0 4px var(--blanc), inset 0 0 0 5px var(--ardoise); padding: 22px 20px 20px; }
.acc-p-tete { color: var(--terre-texte); }
.acc-etapes::before { content: ""; position: absolute; left: 13px; top: 12px; bottom: 28px; border-left: 2px dashed var(--terre); opacity: .6; }
.acc-etapes > li { padding-left: 44px; }
.acc-etapes > li::before { content: "0" counter(e); position: absolute; left: 0; top: -2px; width: 28px; height: 26px; border-radius: 3px; box-sizing: border-box;
  background: var(--ardoise); border: 1.5px solid var(--cellule); box-shadow: inset 0 0 0 1px rgba(251,246,236,.18); font: 500 12px/23px var(--mono); text-align: center; color: var(--papier); }
.acc-e-titre { color: var(--gris); font-weight: 500; }
.acc-choix { background: var(--papier); border: 1.5px dashed var(--terre); }
.acc-cotes { gap: 6px; }
.acc-cotes li { font-size: 13px; font-weight: 500; letter-spacing: .04em; border: 1.5px solid var(--cellule); border-radius: 3px; padding: 1px 8px; background: var(--ardoise); color: var(--papier); }
.acc-choix-defaut b { color: var(--terre-texte); }
.acc-lien-fort { color: var(--cellule); }
.acc-bouton-second { display: inline-block; background: var(--cellule); color: var(--papier); }

/* Outils : chaque case sur papier millimétré */
.acc-outil { background-color: var(--blanc); background-image: linear-gradient(rgba(31,58,95,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(31,58,95,.07) 1px, transparent 1px); background-size: 16px 16px; }
.acc-outil h3 a:hover { text-decoration-color: var(--jaune); text-decoration-thickness: 4px; }
.acc-vers { color: var(--cellule); font-weight: 500; }
.o-production { box-shadow: 5px 5px 0 var(--cellule); }
@media (min-width: 640px) { .o-production, .o-echelle { grid-column: 1 / -1; } }
@media (min-width: 960px) {
  .o-production { grid-column: span 7; } .o-retour { grid-column: span 5; }
  .o-batterie, .o-orientation { grid-column: span 6; }
  .o-autonomie { grid-column: span 5; } .o-echelle { grid-column: span 7; }
}
.o-echelle .acc-vis { max-width: 520px; }
.acc-outil .acc-vis svg { display: block; width: 100%; height: auto; }
.acc-prod .p-arc { fill: none; stroke: var(--soleil); stroke-width: 1.4; stroke-dasharray: 3 5; stroke-linecap: round; }
.acc-prod .p-barres rect { fill: var(--cellule); stroke: var(--ardoise); stroke-width: 1; transform-box: view-box; transform-origin: 50% 96px; animation: p-pousse 1.2s cubic-bezier(.2,.8,.3,1) both; }
.acc-prod .p-barres rect:nth-child(n+2) { animation-delay: .05s; } .acc-prod .p-barres rect:nth-child(n+4) { animation-delay: .15s; }
.acc-prod .p-barres rect:nth-child(n+6) { animation-delay: .25s; } .acc-prod .p-barres rect:nth-child(n+8) { animation-delay: .35s; }
.acc-prod .p-barres rect:nth-child(n+10) { animation-delay: .45s; }
.acc-prod .p-barres rect:nth-child(6), .acc-prod .p-barres rect:nth-child(7) { fill: var(--soleil); }
.acc-prod .p-sol { stroke: var(--ardoise); stroke-width: 1.5; }
.acc-prod .p-mois text { font: 500 10px var(--mono); fill: var(--gris); text-anchor: middle; }
.acc-prod .p-note { font: 10px var(--mono); fill: var(--gris); }
@keyframes p-pousse { from { transform: scaleY(0); } }
.acc-retour .r-boitier { fill: var(--papier-2); stroke: var(--ardoise); stroke-width: 1.5; }
.acc-retour .r-ecran { fill: #0b1526; }
.acc-retour .r-rouleau { font: 500 22px var(--mono); fill: var(--jaune); }
.acc-retour .r-euros + .r-ecran ~ g .r-rouleau { fill: var(--papier); }
.acc-retour .r-r3 { animation: r-roule 340s linear infinite; }
.acc-retour .r-r4 { animation: r-roule 34s linear infinite; }
.acc-retour .r-r5 { animation: r-roule 3.4s linear infinite; }
.acc-retour .r-unite { font: 500 9px var(--mono); fill: var(--ardoise); letter-spacing: .06em; }
.acc-retour .r-fleche { fill: none; stroke: var(--terre); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@keyframes r-roule { to { transform: translateY(-340px); } }
.acc-batt .bt-prod { fill: var(--soleil); fill-opacity: .55; stroke: var(--terre); stroke-width: 1.5; }
.acc-batt .bt-surplus { stroke: none; }
.acc-batt .bt-conso { fill: none; stroke: var(--ardoise); stroke-width: 2; stroke-linecap: round; }
.acc-batt .bt-sol { stroke: var(--ardoise); stroke-width: 1.5; }
.acc-batt .bt-fleche { fill: none; stroke: var(--cellule); stroke-width: 1.5; stroke-dasharray: 3 3; }
.acc-batt .bt-txt { font: 500 10px var(--mono); fill: var(--gris); }
.acc-batt .bt-leg { fill: var(--cellule); }
.acc-orient { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 300px; border: 1.5px solid var(--ardoise); border-radius: 3px; overflow: hidden; margin-bottom: 10px; }
.acc-orient button { font: 500 13px/1.25 var(--mono); padding: 6px 8px; min-height: 40px; border: 0; background: var(--papier); color: var(--ardoise); cursor: pointer; text-align: center; }
.acc-orient button + button { border-left: 1.5px solid var(--ardoise); }
.acc-orient button[aria-pressed="true"] { background: var(--ardoise); color: var(--papier); }
.acc-rose { max-width: 300px; }
.acc-rose .ro-arc { fill: none; stroke: var(--soleil); stroke-width: 1.4; stroke-dasharray: 3 5; }
.acc-rose .ro-sol { stroke: var(--ardoise); stroke-width: 1.5; }
.acc-rose .ro-txt { font: 500 10px var(--mono); fill: var(--gris); }
.acc-rose .ro-soleil circle { fill: var(--jaune); stroke: var(--soleil); stroke-width: 2; }
.acc-rose .ro-soleil, .acc-rose .ro-panneau { transition: transform .4s ease; }
.acc-rose .ro-panneau path { fill: var(--cellule); stroke: var(--ardoise); stroke-width: 1.5; stroke-linejoin: round; }
.acc-rose .ro-panneau path + path { fill: none; stroke: var(--papier); stroke-opacity: .6; }
.acc-orient-leg { font: 13px/1.5 var(--mono); color: var(--ardoise); margin: 8px 0 0; min-height: 3.2em; }
.acc-auto .au-station { fill: var(--ardoise); stroke: var(--cellule); stroke-width: 1.5; }
.acc-auto .au-poignee { fill: none; stroke: var(--ardoise); stroke-width: 5; stroke-linecap: round; }
.acc-auto .au-ecran { fill: #0b1526; }
.acc-auto .au-jauge-fond { fill: var(--ardoise-2); }
.acc-auto .au-jauge { fill: var(--jaune); transform-box: fill-box; transform-origin: left; animation: au-vide 14s linear infinite; }
.acc-auto .au-prises rect { fill: var(--papier-2); stroke: var(--papier); stroke-width: 1; }
.acc-auto .au-fil { fill: none; stroke: var(--soleil); stroke-width: 1.5; }
.acc-auto .au-app path, .acc-auto .au-app rect { fill: var(--blanc); stroke: var(--ardoise); stroke-width: 1.5; stroke-linejoin: round; }
.acc-auto .au-txt { font: 500 10px var(--mono); fill: var(--gris); }
@keyframes au-vide { from { transform: scaleX(1); } 85% { transform: scaleX(.08); } to { transform: scaleX(1); } }
.acc-ech .ec-rail { fill: none; stroke: var(--ardoise); stroke-width: 1.5; stroke-linecap: round; }
.acc-ech .ec-dalle { stroke: var(--ardoise); stroke-width: 3; }
.acc-ech .ec-panneau rect { fill: var(--cellule); stroke: var(--ardoise); stroke-width: 1.5; }
.acc-ech .ec-panneau path { fill: none; stroke: var(--papier); stroke-opacity: .5; }
.acc-ech .ec-cote path { fill: none; stroke: var(--terre); stroke-width: 1.2; }
.acc-ech .ec-cote text, .acc-ech .ec-reste { font: 500 9px var(--mono); fill: var(--terre-texte); letter-spacing: .06em; }
.acc-ech .ec-reste { fill: var(--gris); }

/* Ce mois-ci : la colonne du relevé */
.acc-agenda { border-top: 2px solid var(--ardoise); }
.acc-agenda li { border-bottom: 1.5px dashed var(--terre); }
.acc-agenda time { color: var(--terre-texte); font-weight: 500; }
.acc-agenda time b { font: 500 14px var(--mono); background: var(--jaune); border: 1.5px solid var(--ardoise); padding: 0 6px; color: var(--ardoise); }
@media (min-width: 900px) { .acc-agenda { border-top: 0; } .acc-agenda li { border-top: 2px solid var(--ardoise); border-bottom: 0; } }

/* Derniers articles : bleu cellule, ou papier aux arcs */
.acc-couv { border: 1.5px solid var(--ardoise); }
.acc-couv-attente { color: var(--papier); background-color: var(--cellule); background-image: var(--cellules); background-size: 28px 28px, 28px 28px, 84px 28px; }
.acc-carte:nth-child(even) .acc-couv-attente { color: var(--ardoise); background-color: var(--blanc); background-image: var(--arcs); background-size: 360px 260px; background-position: center bottom; }
.acc-couv-titre::after { height: 6px; border-radius: 0; background: var(--soleil); border: 1.5px solid var(--ardoise); width: 66px; }
.acc-rub { color: var(--terre-texte); }
.acc-carte:hover h3 a { text-decoration-color: var(--jaune); text-decoration-thickness: 4px; }

/* Rubriques et confiance */
.acc-rubrique li { border-top: 1px dashed var(--terre); }
.acc-rubrique h3 a { text-decoration-color: var(--jaune); }
.acc-confiance { background: var(--papier-2); border-top: 2px dashed var(--terre); }
.acc-confiance h2 { color: var(--terre-texte); font-size: 14px; }
.acc-engagements li::before { content: ""; position: absolute; left: 0; top: 13px; width: 12px; height: 6px; border-radius: 12px 12px 0 0; background: var(--soleil); box-shadow: 0 1.5px 0 var(--ardoise); }
.acc-honnete { border: 2px solid var(--ardoise); background: var(--blanc); box-shadow: inset 0 0 0 3px var(--blanc), inset 0 0 0 4px var(--ardoise); }
.accueil .cadran { --x: max(18px, calc(50% - 562px)); }