/* Shared masthead/footer on the existing directory, pricing and portal pages. */
body.als-designed-page :is(.als-brand-header,.als-brand-footer) { background:var(--als-color-page); border-color:var(--als-color-border); color:var(--als-color-text); }
body.als-designed-page .als-brand-inner { max-width:calc(1360px + 2 * var(--als-design-gutter)); margin-inline:auto; }
body.als-designed-page .als-brand-header .als-brand-inner { padding-block:14px; gap:20px; flex-wrap:wrap; }
body.als-designed-page .als-brand-header .als-logo { width:108px; }
body.als-designed-page .als-brand-tagline { color:var(--als-color-muted); border-color:var(--als-color-border); font-size:12px; }
body.als-designed-page .als-brand-nav { flex-shrink:1; gap:12px 22px; }
body.als-designed-page .als-brand-nav a,
body.als-designed-page .als-brand-nav a:visited { display:inline-flex; align-items:center; min-height:44px; color:var(--als-color-text); font-size:14px; line-height:1.5; text-decoration:none; }
body.als-designed-page .als-brand-nav a:hover,
body.als-designed-page .als-brand-nav a[aria-current] { color:var(--als-color-heading); }
body.als-designed-page .als-brand-nav a[aria-current] { text-decoration:underline; text-decoration-color:var(--als-color-focus); text-underline-offset:7px; }
body.als-designed-page .als-brand-nav .als-brand-portal { background:var(--als-color-raised); border:1px solid var(--als-color-control); border-radius:999px; color:var(--als-color-heading); padding:10px 18px; }
body.als-designed-page .als-brand-nav .als-brand-portal:hover { background:var(--als-color-hover); border-color:var(--als-color-control-hover); }
body.als-designed-page .als-brand-staging { background:var(--als-color-raised); color:var(--als-color-link); border-color:var(--als-color-border); }
body.als-designed-page .als-brand-footer .als-logo { width:86px; }
body.als-designed-page .als-brand-footer :is(p,strong,span) { color:var(--als-color-muted); }
body.als-designed-page .als-brand-footer-links a,
body.als-designed-page .als-brand-footer-links a:visited { color:var(--als-color-link); font-size:14px; }
body.als-designed-page :is(.als-brand-header,.als-brand-footer) a:focus-visible { outline:3px solid var(--als-color-focus); outline-offset:4px; }
@media(max-width:600px) {
  body.als-designed-page .als-brand-header .als-brand-inner { align-items:flex-start; gap:12px; }
  body.als-designed-page .als-brand-header .als-logo { width:90px; }
  body.als-designed-page .als-brand-nav { justify-content:flex-start; gap:6px 16px; }
  body.als-designed-page .als-brand-nav a { font-size:13px; }
  body.als-designed-page .als-brand-staging { display:none; }
}