/**
 * Belmaq design tokens — fonte única de identidade.
 * Usado por home, catálogo, produto, links e 404.
 */
:root {
  --bf-orange: #f26c49;
  --bf-orange-hover: #ce5c3e;
  --bf-green: #0a6e4c;
  --bf-ink: #1a120c;
  --bf-mute: #6b5e52;
  --bf-sand: #fffaf5;
  --bf-soft: #feece4;
  --bf-well: #fff1eb;
  --bf-wash-green: #eaf4ef;
  --bf-blob-green: #c2d7cb;
  --bf-blob-orange: #fcd6ca;
  --bf-ring-green: #a9c9ba;
  --bf-ring-orange: #fac8b9;
  --bf-focus: #fde5db;
  --bf-wa: #25d366;
  --bf-footer: #1a120c;

  /* aliases (404 / links legados) */
  --ink: var(--bf-ink);
  --mute: var(--bf-mute);
  --sand: var(--bf-sand);
  --olive: var(--bf-orange);
  --brand: var(--bf-green);
  --thread: var(--bf-orange);

  --bf-radius-card: 1.75rem;
  --bf-radius-pill: 9999px;
  --bf-header-h: 4rem;
  --bf-header-h-md: 5rem;
  --bf-input-h: 3rem;
}

/* Chrome compartilhado: CTA canto (home = catálogo = produto) */
.bf-header-cta {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 60;
  align-items: center;
  gap: 0.5rem;
  background: var(--bf-orange);
  color: #fff;
  padding: 1rem 2rem;
  border-bottom-left-radius: 40px;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: background 0.2s ease;
}
.bf-header-cta:hover {
  background: var(--bf-orange-hover);
}
@media (min-width: 768px) {
  .bf-header-cta {
    display: inline-flex;
  }
}

/* Barra de navegação — mesmas medidas em todas as páginas do shell */
.bf-site-header-inner {
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  height: var(--bf-header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .bf-site-header-inner {
    padding-left: 2rem;
    padding-right: 2rem;
    height: var(--bf-header-h-md);
  }
}

.bf-logo-mark {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  object-fit: contain;
}
@media (min-width: 768px) {
  .bf-logo-mark {
    width: 2.75rem;
    height: 2.75rem;
  }
}

.bf-nav-desktop {
  display: none;
  align-items: center;
  gap: 2rem;
  font-size: 0.875rem;
  color: var(--bf-mute);
  margin-right: 10rem; /* espaço do CTA canto */
}
@media (min-width: 768px) {
  .bf-nav-desktop {
    display: flex;
  }
}
.bf-nav-desktop a {
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease;
}
.bf-nav-desktop a:hover,
.bf-nav-desktop a.is-active {
  color: var(--bf-ink);
  font-weight: 500;
}