/* Brand lockup: the mark plus the product name, rendered as text.
   Keeping the name in HTML rather than inside an SVG is what makes renaming the
   company a config change instead of an asset redraw. */
.ks-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--ks-font-family-sans, 'Inter', system-ui, sans-serif);
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: -0.02em;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
}

.ks-brand__mark { display: block; width: 32px; height: 32px; flex: 0 0 auto; }

.ks-brand__word { color: var(--brand-ink, #101B3D); }
.ks-brand--light .ks-brand__word { color: #ffffff; }

/* The navbar shrinks the lockup on small screens rather than wrapping it: a
   two-line brand pushes the whole header down. */
@media (max-width: 480px) {
  .ks-brand { font-size: 1.05rem; gap: 8px; }
  .ks-brand__mark { width: 26px; height: 26px; }
}

/* The independence disclaimer sits above the copyright line: quiet, but present on
   every page. A tool that names a marketplace has to say it is not that marketplace. */
.ks-footer__disclaimer {
  margin: 24px 0 8px;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.55);
  max-width: 70ch;
}