/* The title bar (David, 24 Oct 2026: "change the top of the website to match the app - black with green
   box round the silhouette as the menu and make it permanent from the outset"): black, always there; the
   app's icon with "Menu" under it on the left, Who2Meet in the middle, Sign in and Request a trial on the
   right. Shared by every page of the site. */
:root{--bar:78px}
body{padding-top:calc(var(--bar) + env(safe-area-inset-top,0px))}
.topbar{
  position:fixed;left:0;right:0;top:0;z-index:60;height:calc(var(--bar) + env(safe-area-inset-top,0px));
  padding-top:env(safe-area-inset-top,0px);background:#000;color:#fff;
}
.topbar .row{height:var(--bar);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  max-width:var(--maxw);margin:0 auto;padding-inline:14px;gap:12px}
.burger{
  justify-self:start;height:61px;border:0;background:none;padding:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:4px;
  font:600 12px/13px Archivo,"Segoe UI",Arial,sans-serif;color:#e8ece7;
}
.burger .ico{flex:1 1 0;min-height:0;width:44px;overflow:visible;display:flex;justify-content:center}
.burger .ico img{width:74.3px;height:74.3px;max-width:none;margin:-17.7px -15px 0 -15.1px;display:block;clip-path:inset(0 15px 12.6px 15.1px)}
.logo{justify-self:center;display:block;line-height:0}
.logo img{height:40px;width:auto;display:block}
.bar-right{justify-self:end;display:flex;align-items:center;gap:16px}
.bar-signin{font-family:Archivo,"Segoe UI",Arial,sans-serif;font-weight:600;font-size:15px;color:#fff;text-decoration:none}
.bar-signin:hover{text-decoration:underline}
@media (max-width:520px){.bar-signin{display:none}.logo img{height:32px}}
@media (max-width:380px){.bar-cta{display:none}}

.menu{
  position:fixed;z-index:59;left:0;right:0;top:calc(var(--bar) + env(safe-area-inset-top,0px));
  background:var(--card);border-bottom:1px solid var(--line);box-shadow:0 18px 40px rgba(16,22,15,.10);
  transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .22s,transform .22s,visibility .22s;
}
.menu.open{opacity:1;transform:none;visibility:visible}
.menu nav{max-width:var(--maxw);margin:0 auto;padding:18px 24px 26px;
  display:grid;gap:2px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.menu a{
  display:block;padding:11px 12px;border-radius:8px;color:var(--ink);text-decoration:none;
  font-weight:500;font-size:16px;border-left:3px solid transparent;
}
.menu a:hover{background:var(--paper);border-left-color:var(--signal)}
section,[id]{scroll-margin-top:calc(var(--bar) + 10px)}