/* Alleviate Care: full-screen mobile menu (shared by the homepage and base.njk).
 * Pattern follows the agency's Oryn menu: fixed full-viewport overlay, large
 * numbered links with a staggered reveal, contact block, scroll lock, Esc to
 * close. Markup is built by menu.js from the page's own .navlinks, so the
 * desktop nav stays the single source of truth for the link list. */

.navtoggle{
  display:none;align-items:center;justify-content:center;
  width:44px;height:44px;padding:0;border-radius:100px;cursor:pointer;
  background:transparent;color:var(--teal,#2B435B);
  border:1px solid rgba(43,67,91,.28);
  transition:color .3s ease,border-color .3s ease,background .3s ease;
}
.navtoggle svg{display:block}
.navtoggle:focus-visible{outline:2px solid var(--mint,#6FC8B6);outline-offset:2px}
@media(max-width:900px){.navtoggle{display:inline-flex}}

.ac-menu{
  position:fixed;inset:0;z-index:200;
  display:grid;grid-template-rows:auto 1fr auto;gap:clamp(24px,5vh,48px);
  padding:max(18px,env(safe-area-inset-top)) var(--gutter,24px) max(28px,env(safe-area-inset-bottom));
  background:rgba(12,23,33,.97);
  -webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);
  color:#fff;overflow-y:auto;overscroll-behavior:contain;
  opacity:0;visibility:hidden;transform:scale(1.02);
  transition:opacity .45s cubic-bezier(.22,.61,.36,1),transform .5s cubic-bezier(.22,.61,.36,1),visibility 0s linear .5s;
}
.ac-menu.open{
  opacity:1;visibility:visible;transform:scale(1);
  transition:opacity .45s cubic-bezier(.22,.61,.36,1),transform .5s cubic-bezier(.22,.61,.36,1),visibility 0s linear 0s;
}
html.ac-menu-open,html.ac-menu-open body{overflow:hidden}

.ac-menu-top{display:flex;align-items:center;justify-content:space-between;min-height:56px}
.ac-menu-top img{height:34px;width:auto;filter:brightness(0) invert(1)}
.ac-menu-close{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:100px;cursor:pointer;
  background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55);
}
.ac-menu-close:focus-visible{outline:2px solid var(--mint,#6FC8B6);outline-offset:2px}

.ac-menu-links{display:flex;flex-direction:column;align-self:center;width:100%;max-width:720px;margin:0 auto}
.ac-menu-links a{
  display:flex;align-items:baseline;gap:18px;
  padding:clamp(10px,1.8vh,16px) 0;
  font-family:var(--serif,'Fraunces',Georgia,serif);font-weight:400;
  font-size:clamp(30px,8.5vw,52px);line-height:1.1;letter-spacing:-.01em;
  color:#fff;text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.14);
  opacity:0;transform:translateY(18px);
  transition:color .3s ease,padding-left .4s ease;
}
.ac-menu-links a::before{
  content:attr(data-num);min-width:26px;transform:translateY(-.55em);
  font-family:var(--sans,'IBM Plex Sans',system-ui,sans-serif);
  font-size:11px;font-weight:600;letter-spacing:.2em;color:var(--mint,#6FC8B6);
}
.ac-menu-links a:hover,.ac-menu-links a.on{color:var(--mint,#6FC8B6);padding-left:12px}
.ac-menu-links a:focus-visible{outline:2px solid var(--mint,#6FC8B6);outline-offset:4px}
.ac-menu.open .ac-menu-links a{opacity:1;transform:none}
.ac-menu.open .ac-menu-links a:nth-child(1){transition:opacity .5s .10s ease,transform .5s .10s ease,color .3s,padding-left .4s}
.ac-menu.open .ac-menu-links a:nth-child(2){transition:opacity .5s .16s ease,transform .5s .16s ease,color .3s,padding-left .4s}
.ac-menu.open .ac-menu-links a:nth-child(3){transition:opacity .5s .22s ease,transform .5s .22s ease,color .3s,padding-left .4s}
.ac-menu.open .ac-menu-links a:nth-child(4){transition:opacity .5s .28s ease,transform .5s .28s ease,color .3s,padding-left .4s}
.ac-menu.open .ac-menu-links a:nth-child(5){transition:opacity .5s .34s ease,transform .5s .34s ease,color .3s,padding-left .4s}
.ac-menu.open .ac-menu-links a:nth-child(6){transition:opacity .5s .40s ease,transform .5s .40s ease,color .3s,padding-left .4s}
.ac-menu.open .ac-menu-links a:nth-child(7){transition:opacity .5s .46s ease,transform .5s .46s ease,color .3s,padding-left .4s}

.ac-menu-foot{
  display:grid;gap:22px;width:100%;max-width:720px;margin:0 auto;
  opacity:0;transform:translateY(12px);
  transition:opacity .5s ease,transform .5s ease;
}
.ac-menu.open .ac-menu-foot{opacity:1;transform:none;transition:opacity .6s .35s ease,transform .6s .35s ease}
.ac-menu-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:15px 26px;border-radius:100px;white-space:nowrap;
  background:#fff;color:var(--teal,#2B435B);
  font-family:var(--sans,'IBM Plex Sans',system-ui,sans-serif);font-weight:600;font-size:16px;text-decoration:none;
}
.ac-menu-contact{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px 28px;
  font-family:var(--sans,'IBM Plex Sans',system-ui,sans-serif);font-size:15px;color:#c9d4dc;
}
.ac-menu-contact > div:last-child{grid-column:1/-1}
.ac-menu-contact .lbl{display:block;margin-bottom:4px;font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mint,#6FC8B6)}
.ac-menu-contact a{color:#fff;text-decoration:none}
.ac-menu-contact a:hover{text-decoration:underline}

@media(prefers-reduced-motion:reduce){
  .ac-menu,.ac-menu.open,.ac-menu-links a,.ac-menu.open .ac-menu-links a,.ac-menu-foot,.ac-menu.open .ac-menu-foot{transition:none !important;transform:none !important}
}
