/* exists.ch brand layer: logo B (three bars and a dot), wordmark tint, mobile safety.
   Loaded after spore-site.css on every page. Mint #34d399, dark green #041510, Inter stay. */

/* The decorative glows are 40rem wide and positioned against the page, not their section,
   so section overflow cannot clip them. Cap them at the viewport so phones never lay out
   wider than the screen (mobile Chrome was zooming out to 515px). clip keeps sticky working. */
.spore-glow { max-width: 100vw; }
html, body { overflow-x: clip; }

.brand-mark {
  background: url("/assets/brand/exists-mark.svg") center / 100% 100% no-repeat;
  border-radius: 0.6rem;
  box-shadow: 0 6px 20px rgba(52, 211, 153, 0.22);
}
.brand .brand-tld { color: var(--spore-accent, #34d399); }

/* Notched phones: keep the bar and footer clear of the rounded corners. */
.nav-inner,
.footer > .spore-container {
  padding-left: 0;
  padding-right: 0;
}
.footer { padding-bottom: max(2rem, env(safe-area-inset-bottom)); }

@media (forced-colors: active) {
  .brand-mark { forced-color-adjust: none; }
}

/* Phones: one tidy bar. The tagline and the duplicate "Check a handle" button go;
   the search is right below and the results board has its own sticky search. */
@media (max-width: 33.99rem) {
  .nav-inner { gap: 0.5rem; }
  .brand { gap: 0.55rem; }
  .brand small { display: none; }
  .brand strong { font-size: 1.1rem; }
  .nav-cta { white-space: nowrap; padding: 0.55rem 0.95rem; font-size: 0.9rem; }
  .nav-logout ~ a.nav-cta { display: none; }
}