/* CSE Election — styles
 * Repris du bloc <style> du Design Component « Site CSE Election.dc.html »,
 * complété par le méga-menu (survol, CSS pur) et le drawer mobile.
 */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Manrope',system-ui,sans-serif;color:#181225;background:#fff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
h1,h2,h3,h4{font-family:'Sora',sans-serif;margin:0;letter-spacing:-.02em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
::selection{background:#F3D9EC;color:#7A22E0}
details summary::-webkit-details-marker{display:none}
details summary::marker{content:''}
.lk{transition:color .15s}
.lk:hover{color:#7A22E0}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes barpulse{0%,100%{opacity:.55}50%{opacity:1}}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #7A22E0;outline-offset:2px}

/* ---------- méga-menu (survol, CSS pur) ---------- */
.nav-item{position:static;height:72px;display:flex;align-items:center}
.nav-item>a{display:flex;align-items:center;gap:5px;padding:9px 13px;border-radius:9px;font-size:14.5px;font-weight:600;color:#2C2440;background:transparent;transition:background .15s}
.nav-item:hover>a,.nav-item:focus-within>a{background:#F4EFFB}
.nav-item>a svg{transition:transform .15s}
.nav-item:hover>a svg,.nav-item:focus-within>a svg{transform:rotate(180deg)}
.mega-panel{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid #ECE6F6;box-shadow:0 24px 48px -24px rgba(24,18,37,.22);z-index:60}
.nav-item:hover .mega-panel,.nav-item:focus-within .mega-panel{display:block}

/* ---------- drawer mobile ---------- */
[data-burger]{display:none}
#mobile-menu[hidden]{display:none}
.silo-items{display:none}
.silo-block.open .silo-items{display:flex}
.silo-block.open .silo-caret{transform:rotate(180deg)}
.silo-caret{transition:transform .15s}

@media(max-width:1080px){
  [data-nav="desktop"]{display:none !important}
  [data-actions="desktop"]{display:none !important}
  [data-burger]{display:flex !important}
  [data-hero]{grid-template-columns:1fr !important;gap:40px !important;padding-top:46px !important}
  [data-sec="security"]{grid-template-columns:1fr !important;gap:32px !important}
  [data-grid="devis"]{grid-template-columns:1fr !important}
  [data-grid="article"]{grid-template-columns:1fr !important;gap:32px !important}
  [data-grid="article"] aside{position:static !important;order:2}
  [data-footer]{grid-template-columns:1fr 1fr !important;gap:28px !important}
}
@media(max-width:860px){
  [data-grid="benefits"],[data-grid="steps"],[data-grid="forwho"],[data-grid="hub"]{grid-template-columns:1fr 1fr !important}
  h1{font-size:36px !important}
}
@media(max-width:560px){
  [data-grid="benefits"],[data-grid="steps"],[data-grid="forwho"],[data-grid="hub"]{grid-template-columns:1fr !important}
  [data-footer]{grid-template-columns:1fr !important}
  h1{font-size:30px !important}
  h2{font-size:26px !important}
}
@media(max-width:860px){
  [data-info="stats"]{grid-template-columns:1fr 1fr !important;gap:18px !important}
  [data-info="proscons"]{grid-template-columns:1fr !important}
  [data-info="toc"]{grid-template-columns:1fr !important}
}
@media(max-width:560px){
  [data-info="stats"]{grid-template-columns:1fr 1fr !important}
  [data-info="table"] [style*="grid-template-columns:1.5fr 1fr 1fr"]{font-size:12px !important}
}