/* =========================================================
   Erasmus — sidebar menu (all pages, including the home page)
   Uses the theme tokens each page already defines
   (--splash, --mint, --on-splash …). Built by /assets/site.js.
   ========================================================= */
.menu-toggle{
  width:38px;height:38px;flex:none;display:grid;place-items:center;margin-right:-8px;
  background:transparent;border:1px solid var(--hair-splash);border-radius:8px;color:var(--on-splash);cursor:pointer;
  transition:border-color .2s ease,background .2s ease;
}
.menu-toggle:hover{border-color:var(--mint);background:rgba(79,216,184,.08)}
.menu-toggle svg{width:18px;height:18px}

.drawer-scrim{position:fixed;inset:0;z-index:190;background:rgba(5,16,13,.55);
  opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s}
.drawer{
  position:fixed;top:0;left:0;bottom:0;z-index:200;width:min(380px,88vw);
  background:var(--splash-3);color:var(--on-splash);border-right:1px solid var(--hair-splash);
  display:flex;flex-direction:column;font-family:"Poppins","Segoe UI",system-ui,-apple-system,sans-serif;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
  transform:translateX(-100%);visibility:hidden;transition:transform .38s cubic-bezier(.2,.7,.2,1),visibility .38s;
}
body.drawer-open .drawer{transform:none;visibility:visible}
body.drawer-open .drawer-scrim{opacity:1;visibility:visible}
body.drawer-open{overflow:hidden}

.drawer-head{height:var(--nav-h,68px);flex:none;display:flex;align-items:center;justify-content:space-between;
  padding:0 20px 0 26px;border-bottom:1px solid var(--hair-splash)}
.drawer-head .brand{display:flex;align-items:center;gap:10px;color:var(--on-splash);text-decoration:none;font-weight:600;letter-spacing:.14em;font-size:.95rem}
.drawer-head .brand .logo{width:22px;height:22px}
.drawer-head .menu-toggle{margin-right:0}

.drawer-body{flex:1;overflow-y:auto;padding:18px 0 26px}
.drawer-nav{list-style:none;margin:0;padding:0}
.drawer-nav>li{border-bottom:1px solid var(--hair-splash)}
.drawer-row{display:flex;align-items:stretch}
.drawer-link{flex:1;display:block;text-decoration:none;padding:16px 26px;position:relative;transition:background .2s ease}
.drawer-link:hover{background:rgba(79,216,184,.06)}
.drawer-link .t{display:block;font-size:1.2rem;font-weight:600;line-height:1.25;color:var(--on-splash)}
.drawer-link .d{display:block;margin-top:3px;font-size:.82rem;color:var(--on-splash-muted)}
.drawer-link[aria-current="page"]::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:0 3px 3px 0;background:var(--mint)}
.drawer-link[aria-current="page"] .t{color:var(--mint)}

.sub-toggle{width:56px;flex:none;background:transparent;border:0;border-left:1px solid var(--hair-splash);
  color:var(--on-splash-muted);cursor:pointer;display:grid;place-items:center;transition:color .2s ease,background .2s ease}
.sub-toggle:hover{color:var(--mint);background:rgba(79,216,184,.06)}
.sub-toggle svg{width:16px;height:16px;transition:transform .25s ease}
.sub-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}

.drawer-sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.drawer-sub>div{min-height:0;overflow:hidden}
.drawer-sub.open{grid-template-rows:1fr}
.drawer-sub .sub-inner{padding:2px 0 12px}
.drawer-sub a{display:flex;gap:12px;align-items:baseline;text-decoration:none;padding:8px 26px 8px 42px;
  font-size:.88rem;color:var(--on-splash-muted);transition:color .2s ease}
.drawer-sub a:hover,.drawer-sub a[aria-current="page"]{color:var(--mint)}
.drawer-sub a .meta{margin-left:auto;flex:none;font-size:.74rem;color:var(--mint-dim)}
.drawer-sub .sub-empty{padding:8px 26px 12px 42px;font-size:.84rem;color:var(--on-splash-muted)}

.drawer-foot{flex:none;padding:20px 26px 24px;border-top:1px solid var(--hair-splash);
  font-size:.84rem;display:flex;flex-direction:column;gap:6px}
.drawer-foot a{color:var(--mint);text-decoration:none;align-self:flex-start}
.drawer-foot a:hover{text-decoration:underline}

@media (prefers-reduced-motion: reduce){
  .drawer,.drawer-scrim,.drawer-sub,.sub-toggle svg{transition:none}
}