/* =========================================================================
   globals.css — variáveis de tema + estilos custom que o Tailwind não cobre
   bem (gradientes, dividers ornamentais, pseudo-elementos ::before, sombras
   coloridas, filtros de logo).
   As cores abaixo são a FONTE ÚNICA de verdade: o tailwind.config.js aponta
   theme.extend.colors para estas variáveis, então mudar uma cor aqui
   atualiza todas as classes utilitárias (bg-brick, text-gold, etc.).
   ========================================================================= */
:root {
  --brick: #a8492a;
  --brick-deep: #82361e;
  --parchment: #f8f2e7;
  --parchment-2: #efe5d2;
  --sepia: #31241b;
  --gold: #c2954f;
  --line: rgba(49, 36, 27, 0.15);
}

html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
}

/* HERO — trama sutil de papel (repeating-linear-gradient) sobre o pergaminho */
.hero-bg {
  background:
    linear-gradient(var(--parchment), var(--parchment)),
    repeating-linear-gradient(0deg, rgba(168, 73, 42, 0.03) 0 1px, transparent 1px 8px);
}

/* Régua ornamental, como o papel timbrado de um antigo clube de comércio */
.orn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: var(--brick);
  margin: 0 auto;
}
.orn::before,
.orn::after {
  content: "";
  height: 1px;
  width: 70px;
  background: currentColor;
  opacity: 0.5;
}
.orn .dia {
  width: 8px;
  height: 8px;
  background: currentColor;
  transform: rotate(45deg);
}

/* Botões — sombras coloridas custom + hover lift */
.btn {
  box-shadow: 0 6px 16px rgba(168, 73, 42, 0.28);
  transition: background 0.25s, transform 0.2s, box-shadow 0.2s;
}
.btn:hover {
  transform: translateY(-2px);
}
.btn-outline {
  box-shadow: none;
}
/* Variante dourada (CTA da seção "história") */
.btn-gold {
  box-shadow: 0 6px 16px rgba(194, 149, 79, 0.3);
}

/* Cards de feature — hover lift + traço superior (::before) */
.feat-card {
  transition: transform 0.25s, box-shadow 0.25s;
}
.feat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 30px rgba(49, 36, 27, 0.09);
}
.feat-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 56px;
  height: 3px;
  background: var(--brick);
  border-radius: 0 0 3px 3px;
}

/* Lista de diferenciais (seção história) — marcador losango ❖ */
.why-list li::before {
  content: "❖";
  color: var(--gold);
  font-size: 11px;
}

/* Logo dentro do card "fachada" — renderizado em tom claro monocromático */
.facade-logo {
  filter: brightness(0) invert(0.94);
}

/* Footer — logo em branco via filtro */
.footer-logo {
  filter: brightness(0) invert(1);
}