/* ============================================================
   BRAND BADGE — JBS logo, used in nav, hero, footer.
   Nav + footer use the circular seal (jbs-logo.png mark inside an
   SVG ring/disc). Hero uses the full lockup (jbs-full.png, mark +
   "jakarta beat society" wordmark) as a plain image, shown in full —
   a circular crop doesn't suit a tall rectangular lockup with its
   own baked-in text, and the ring's rotating text would just repeat
   the wordmark already in the image.
   ============================================================ */
.brand-badge { overflow: visible; }
.brand-badge--nav { width: 40px; height: 40px; flex-shrink: 0; }
.brand-badge--hero {
  width: min(260px, 60vw);
  height: auto;
  /* Follows the logo's actual alpha silhouette (unlike box-shadow) —
     lifts the yellow wheat off the equally-yellow hero background. */
  filter:
    drop-shadow(0 2px 3px rgba(23,16,13,.35))
    drop-shadow(0 10px 22px rgba(23,16,13,.25));
}
.brand-badge--footer { width: 64px; height: 64px; flex-shrink: 0; }

.badge-ring { fill: none; stroke: var(--color-brass); stroke-width: 1.5; }
/* Neutral plate behind the logo mark — the mark itself is black +
   red + yellow, so it needs a light backdrop to stay legible on the
   dark nav/footer (black would vanish on ink) and to keep its yellow
   wheat from blending into the yellow hero. */
.badge-disc { fill: var(--color-paper); }
.badge-text {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 3px;
  fill: var(--color-paper);
  text-transform: uppercase;
}