/* Shared across index.html, contact.html, fit-match.html, and policy.html
   — previously identical copy-pasted blocks inside each page's own inline
   <style>. One linked, cacheable file instead of four inline copies (see
   server.js for the Cache-Control this gets served with).
   vault.html intentionally keeps its own version of the nav badge — it's
   wired into that page's own CSS custom-property theme (var(--gold) etc.)
   rather than these literal hex values, so it isn't a duplicate of this
   file, just a visually-matching equivalent. */

/* ===== Header cart badge ===== */
.nav-badge{
  display:none;position:absolute;top:-6px;right:-10px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:#C9A36B;color:#453C2E;
  font-size:.6rem;font-weight:800;line-height:16px;text-align:center;
}
.nav-badge.show{display:inline-block}

.font-aptos { font-family: 'Hanken Grotesk', sans-serif; }

/* ===== Logo ===== */
.logo-icon-container { width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; }
.logo-icon-img { width: 100%; height: 100%; object-fit: contain; }

/* ===== General reveal-on-scroll ===== */
.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}