/* ALCDC, charte : ardoise, Arve, béton, store */
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/atkinson-400-normal.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible";font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/atkinson-400-italic.woff2) format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/atkinson-700-normal.woff2) format("woff2")}

:root{
  --ardoise:#1c2a35;
  --ardoise-2:#27394a;
  --arve:#2d6a6e;
  --arve-fonce:#1f4f52;
  --beton:#e8edee;
  --beton-2:#d3dadc;
  --store:#e3a92f;
  --store-clair:#fbecc6;
  --texte:#1c2a35;
  --texte-2:#4d5b64;
  --blanc:#fff;
  --erreur:#a8322a;
  --ok:#256b3f;
  --mesure:68ch;
  --r:6px;
  font-size:112.5%;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Atkinson Hyperlegible",Verdana,system-ui,sans-serif;line-height:1.6;color:var(--texte);background:var(--blanc);-webkit-text-size-adjust:100%}
img,svg{max-width:100%;display:block}
a{color:var(--arve);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--arve-fonce);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--store);outline-offset:2px}
h1,h2,h3{line-height:1.15;margin:0 0 .6em;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,4.6vw,3.3rem)}
h2{font-size:clamp(1.5rem,2.6vw,1.95rem)}
h3{font-size:1.22rem}
p,ul,ol,dl{margin:0 0 1em}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
.prose{max-width:var(--mesure)}
.prose h2{margin-top:2em}
.prose h3{margin-top:1.6em}
.lead{font-size:1.18rem;color:var(--texte-2);max-width:60ch}
.skip{position:absolute;left:-9999px;top:0;background:var(--store);color:var(--ardoise);padding:.6rem 1rem;z-index:10}
.skip:focus{left:1rem}

/* En-tête */
.site-header{background:var(--blanc);border-bottom:1px solid var(--beton-2);position:sticky;top:0;z-index:5}
.header-inner{display:flex;align-items:center;gap:1.5rem;min-height:78px}
.brand img{width:220px;height:auto}
.site-nav{display:flex;align-items:center;gap:1.25rem;margin-left:auto}
.site-nav ul{display:flex;gap:1.1rem;list-style:none;margin:0;padding:0}
.site-nav ul a{white-space:nowrap;color:var(--texte);text-decoration:none;padding:.35rem 0;border-bottom:2px solid transparent;font-size:.95rem}
.site-nav ul a:hover{border-color:var(--beton-2)}
.site-nav ul a[aria-current="page"]{border-color:var(--arve);color:var(--arve-fonce)}
.nav-actions{display:flex;gap:.5rem}
.nav-toggle{display:none;margin-left:auto;font:inherit;background:none;border:1px solid var(--beton-2);border-radius:var(--r);padding:.45rem .9rem;color:var(--texte);cursor:pointer}

/* Boutons */
.btn{display:inline-block;white-space:nowrap;font:inherit;font-weight:700;font-size:.95rem;text-decoration:none;padding:.62rem 1.15rem;border-radius:var(--r);border:2px solid transparent;cursor:pointer;line-height:1.2}
.btn-primary{background:var(--arve);color:var(--blanc)}
.btn-primary:hover{background:var(--arve-fonce);color:var(--blanc)}
.btn-accent{background:var(--store);color:var(--ardoise)}
.btn-accent:hover{background:#cf9722;color:var(--ardoise)}
.btn-ghost{border-color:var(--beton-2);color:var(--texte)}
.btn-ghost:hover{border-color:var(--arve);color:var(--arve-fonce)}
.btn-light{border-color:rgba(255,255,255,.55);color:var(--blanc)}
.btn-light:hover{border-color:var(--blanc);color:var(--blanc);background:rgba(255,255,255,.08)}
.btn-danger{background:var(--erreur);color:var(--blanc)}
.btn-small{padding:.35rem .7rem;font-size:.85rem}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}

/* Hero : la silhouette des immeubles au crépuscule */
.hero{background:var(--ardoise);color:var(--blanc);position:relative;overflow:hidden;padding-top:clamp(3rem,7vw,5.5rem)}
.hero h1{max-width:17ch}
.hero .lead{color:#c9d3d8}
.hero-text{position:relative;z-index:1;padding-bottom:1rem}
.skyline{width:100%;height:clamp(180px,26vw,300px);margin-top:1rem}
.skyline .slab{fill:var(--ardoise-2)}
.skyline .win{fill:#223342}
.skyline .win.on{fill:var(--store);opacity:0;animation:allume .6s ease-out forwards}
.skyline .crest{fill:var(--arve-fonce)}
@keyframes allume{to{opacity:1}}
@media (prefers-reduced-motion:reduce){.skyline .win.on{animation:none;opacity:1}html{scroll-behavior:auto}}

/* En-tête de page intérieure */
.page-head{background:var(--beton);padding:clamp(2.2rem,5vw,3.5rem) 0 2rem;border-bottom:4px solid var(--arve)}
.page-head h1{margin-bottom:.35em}
.page-head .lead{margin:0}

/* Sections */
.section{padding:clamp(2.5rem,6vw,4.5rem) 0}
.section-beton{background:var(--beton)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(1.5rem,5vw,4rem);align-items:start}
.missions{list-style:none;padding:0;margin:0;display:grid;gap:0}
.missions li{padding:1.1rem 0;border-top:1px solid var(--beton-2)}
.missions li:last-child{border-bottom:1px solid var(--beton-2)}
.missions strong{display:block;font-size:1.08rem;margin-bottom:.2rem}
.missions span{color:var(--texte-2)}

/* Bandeau signalement */
.band{background:var(--store-clair);border-left:8px solid var(--store);padding:1.6rem 1.8rem;border-radius:0 var(--r) var(--r) 0;display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
.band p{margin:0;max-width:56ch}
.band h2{font-size:1.4rem;margin-bottom:.3em}

/* Actualités */
.news-list{list-style:none;margin:0;padding:0}
.news-list li{padding:1.3rem 0;border-top:1px solid var(--beton-2)}
.news-list time{color:var(--texte-2);font-size:.9rem}
.news-list h3{margin:.15em 0 .4em}
.tag{display:inline-block;font-size:.78rem;font-weight:700;background:var(--ardoise);color:var(--blanc);padding:.1rem .5rem;border-radius:3px;margin-left:.5rem;vertical-align:.1em}
article.news{max-width:var(--mesure);padding:1.6rem 0;border-top:1px solid var(--beton-2)}
article.news:first-child{border-top:0}

/* Fiches droits */
.fiche{max-width:var(--mesure);border-top:1px solid var(--beton-2);padding:.4rem 0}
.fiche summary{cursor:pointer;font-weight:700;font-size:1.12rem;padding:.8rem 0;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.fiche summary::-webkit-details-marker{display:none}
.fiche summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--arve)}
.fiche[open] summary::after{content:"−"}
.fiche .delai{display:inline-block;background:var(--beton);border-left:4px solid var(--arve);padding:.35rem .7rem;margin-bottom:.8rem;font-size:.95rem}

/* Formulaires */
form.form{max-width:640px}
.field{margin-bottom:1.15rem}
.field label,.field legend{display:block;font-weight:700;margin-bottom:.3rem}
.field .hint{display:block;font-weight:400;color:var(--texte-2);font-size:.9rem}
.field input[type=text],.field input[type=email],.field input[type=tel],.field input[type=password],.field input[type=number],.field input[type=file],.field select,.field textarea{width:100%;font:inherit;padding:.6rem .7rem;border:1px solid #9aa7ad;border-radius:var(--r);background:var(--blanc);color:var(--texte)}
.field textarea{min-height:9rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid var(--store);outline-offset:1px;border-color:var(--arve)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.check{display:flex;gap:.6rem;align-items:flex-start;margin-bottom:.8rem}
.check input{margin-top:.35rem;width:1.1rem;height:1.1rem;flex:none}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.cf-turnstile{margin:1rem 0}
.notice{padding:.9rem 1.1rem;border-radius:var(--r);margin:1.2rem 0;border-left:6px solid}
.notice-ok{background:#e4f2e8;border-color:var(--ok)}
.notice-err{background:#f8e4e2;border-color:var(--erreur)}
.notice-info{background:var(--beton);border-color:var(--arve)}
.errors{margin:0;padding-left:1.2rem}

/* Contenu à fournir */
.a-completer{border:2px dashed var(--store);background:#fffaf0;padding:.8rem 1rem;border-radius:var(--r);color:#6b4a07;max-width:var(--mesure)}

/* Comité */
.comite{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem 2rem}
.comite li{border-top:3px solid var(--arve);padding-top:.7rem}
.comite span{display:block;color:var(--texte-2)}

/* Espace membres et comité */
.dash{display:grid;grid-template-columns:220px minmax(0,1fr);gap:2.5rem;align-items:start}
.side-nav{list-style:none;margin:0;padding:0;border-left:3px solid var(--beton-2)}
.side-nav a{display:block;padding:.45rem 1rem;text-decoration:none;color:var(--texte);margin-left:-3px;border-left:3px solid transparent}
.side-nav a[aria-current="page"]{border-color:var(--arve);color:var(--arve-fonce);font-weight:700}
.side-nav .sep{margin-top:1rem;padding:.3rem 1rem;color:var(--texte-2);font-size:.85rem}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--beton-2);vertical-align:top}
th{background:var(--beton);font-weight:700}
.statut{font-size:.8rem;font-weight:700;padding:.1rem .45rem;border-radius:3px;background:var(--beton);white-space:nowrap}
.statut-en_attente,.statut-nouveau{background:var(--store-clair)}
.statut-actif,.statut-resolu{background:#e4f2e8}
.statut-refuse,.statut-suspendu{background:#f8e4e2}
.inline{display:inline}
.muted{color:var(--texte-2)}

/* Pied de page */
.site-footer{background:var(--ardoise);color:#c9d3d8;margin-top:0;padding:2.5rem 0 1.2rem;font-size:.95rem}
.site-footer a{color:var(--blanc)}
.footer-inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem}
.footer-name{color:var(--blanc);font-weight:700;margin-bottom:.3rem}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{margin-bottom:.35rem}
.footer-base{border-top:1px solid #34495a;margin-top:1.5rem;padding-top:1rem;font-size:.85rem}
.footer-base p{margin:0}

/* Responsive */
@media (max-width:1180px){
  .nav-toggle{display:block}
  .site-nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--blanc);border-bottom:1px solid var(--beton-2);flex-direction:column;align-items:stretch;padding:1rem 1.25rem 1.4rem;margin:0}
  .site-nav.open{display:flex}
  .site-nav ul{flex-direction:column;gap:0}
  .site-nav ul a{display:block;padding:.65rem 0;border-bottom:1px solid var(--beton)}
  .site-nav ul a[aria-current="page"]{border-bottom-color:var(--arve)}
  .nav-actions{margin-top:.8rem}
  .header-inner{position:relative}
}
@media (max-width:760px){
  .split,.dash{grid-template-columns:1fr}
  .row{grid-template-columns:1fr}
  .brand img{width:180px}
  .side-nav{display:flex;flex-wrap:wrap;border-left:0;border-bottom:1px solid var(--beton-2);padding-bottom:.5rem}
  .side-nav a{border-left:0;padding:.35rem .7rem}
  .side-nav .sep{width:100%;padding:.3rem .7rem 0}
}
@media print{.site-header,.site-footer,.skyline,.actions{display:none}}