/* dp-top-bar.css: THE TOP BAR (views/partials/dp-top-bar.ejs). One look on every public page: 44px round menu button, the wordmark,
 * then the page's links and its one white button. Clear on the page, the page's violet once scrolled; a page on another colour sets --dpt-solid. */
.dpt {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900; box-sizing: border-box;
  padding-top: env(safe-area-inset-top);
  font-family: 'DM Sans', 'Inter', system-ui, -apple-system, sans-serif;
  transition: background 0.25s ease, box-shadow 0.25s ease;
}
.dpt--sticky { position: sticky; }
.dpt.is-solid, .dpt--solid {
  background: var(--dpt-solid, rgba(106, 64, 240, 0.92)); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.dpt__in {
  box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 14px;
  width: 100%; max-width: 1180px; height: 72px; margin: 0 auto; padding: 0 16px;
}
.dpt__left, .dpt__right { display: flex; align-items: center; min-width: 0; }
.dpt__left { flex: 0 1 auto; gap: 14px; }
.dpt__right { flex: none; gap: 14px; }
.dpt__menu {
  flex: none; width: 44px; height: 44px; margin: 0 0 0 -6px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
  display: grid; place-items: center; background: rgba(255, 255, 255, 0.12); color: #fff;
  transition: background 160ms cubic-bezier(0.22, 1, 0.36, 1), transform 160ms cubic-bezier(0.22, 1, 0.36, 1);
}
.dpt__menu:hover { background: rgba(255, 255, 255, 0.18); }
.dpt__menu:active { transform: scale(0.94); }
.dpt__menu svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
/* A long button takes its room from the wordmark, never the other way round. */
.dpt__brand { display: inline-flex; align-items: center; min-width: 0; min-height: 44px; }
.dpt__text { display: block; height: 15px; width: auto; min-width: 0; max-width: 100%; object-fit: contain; object-position: left center; }
.dpt__icon { display: none; width: 28px; height: 28px; }
.dpt__nav { display: none; align-items: center; gap: 28px; }
.dpt__nav a { color: rgba(255, 255, 255, 0.82); text-decoration: none; font-weight: 600; font-size: 15px; white-space: nowrap; }
.dpt__nav a:hover, .dpt__nav a.is-on { color: #fff; }
.dpt__cta {
  flex: none; display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border: 0; border-radius: 999px; cursor: pointer;
  background: #fff; color: #4f27d4; font: 800 15px/1 'DM Sans', 'Inter', system-ui, -apple-system, sans-serif;
  text-decoration: none; white-space: nowrap; transition: transform 0.15s ease;
}
.dpt__cta:hover { transform: translateY(-1px); }
@media (min-width: 720px) { .dpt__in { padding: 0 32px; } }
@media (min-width: 980px) { .dpt__nav { display: flex; } }
@media (max-width: 380px) { .dpt__text { display: none; } .dpt__icon { display: block; } }

/* The Menu it opens wears the page's violet, not the portal pages' black, and covers the bar. */
.dpt-on .pp-ov { z-index: 1100; --su-bg: #6a40f0; background: #6a40f0; }
@media print { .dpt { display: none; } }