/* ═══════════════════════════════════════════════════════════════════════════
   Vitalise — phone app-shell (≤720px): a native-app bottom tab bar + slide-up
   sheet menu. Desktop is untouched. Themes via the shared tokens (light/dark).
   ═══════════════════════════════════════════════════════════════════════════ */
.mtabs{display:none}
.msheet[hidden]{display:none}

@media (max-width:720px){
  /* leave room for the fixed tab bar (+ iOS home indicator) */
  body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
  /* the top bar becomes a slim app-bar — the bottom tabs own navigation now */
  .nav-burger,.nav-cta{display:none!important}

  /* ── bottom tab bar ── */
  .mtabs{position:fixed;left:0;right:0;bottom:0;z-index:70;
    display:grid;grid-template-columns:repeat(5,1fr);
    background:rgba(var(--veil),.93);backdrop-filter:blur(20px) saturate(1.05);
    -webkit-backdrop-filter:blur(20px) saturate(1.05);
    border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .mtab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    padding:9px 3px 8px;min-height:60px;background:none;border:0;cursor:pointer;text-decoration:none;
    font:600 9.5px/1.1 var(--sans);letter-spacing:.03em;text-transform:uppercase;
    color:var(--grey);transition:color .25s var(--ease)}
  .mtab svg{width:21px;height:21px;display:block}
  .mtab[aria-current="page"]{color:var(--champ-ink)}
  .mtab.rdv{color:var(--champ-ink)}
  .mtab:active{color:var(--char)}

  /* ── slide-up sheet ── */
  .msheet{position:fixed;inset:0;z-index:80}
  .msheet[hidden]{display:none}
  .msheet-bg{position:absolute;inset:0;background:rgba(8,6,4,.5);opacity:0;transition:opacity .3s var(--ease)}
  .msheet.open .msheet-bg{opacity:1}
  .msheet-panel{position:absolute;left:0;right:0;bottom:0;max-height:84vh;overflow:auto;
    background:var(--ivory);border-radius:22px 22px 0 0;
    padding:8px 22px calc(22px + env(safe-area-inset-bottom));
    transform:translateY(101%);transition:transform .36s var(--ease);
    box-shadow:0 -18px 46px rgba(8,6,4,.3)}
  .msheet.open .msheet-panel{transform:none}
  .msheet-grip{width:40px;height:4px;border-radius:4px;background:var(--line);margin:8px auto 6px}
  .msheet-x{position:absolute;top:12px;right:16px;width:34px;height:34px;border:0;background:none;
    color:var(--grey);font-size:24px;line-height:1;cursor:pointer}
  .msh-sub{font-size:11px;color:var(--champ-ink);text-transform:uppercase;letter-spacing:.16em;
    font-weight:600;padding:18px 2px 6px}
  .msh-link{display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:15px 2px;border-bottom:1px solid var(--line);color:var(--char);text-decoration:none;
    font-family:var(--serif);font-size:20px}
  .msh-link:last-of-type{border-bottom:0}
  .msh-link .chev{color:var(--champ);font-family:var(--sans);font-size:15px}
  .msh-info{display:flex;flex-wrap:wrap;gap:10px 22px;padding:12px 2px 4px}
  .msh-info a{color:var(--grey);text-decoration:none;font-size:14px;border-bottom:1px solid var(--line)}
  .msh-cta{display:flex;align-items:center;justify-content:center;margin:18px 0 4px;padding:16px;
    background:var(--char);color:var(--ivory);border-radius:3px;text-decoration:none;
    font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:13px}
}
html.dark .msh-cta{background:var(--champ-ink);color:#17130E}

@media (min-width:721px){.mtabs,.msheet{display:none!important}}
