:root {
  /* PALETA OFICIAL ARMAS SUMATRA */
  --preto-tatico: #0D0D0D;
  --fundo-profundo: #1B0E0A;
  --marrom-sumatra: #542E1E;
  --laranja-fogo: #DA771C;
  --laranja-hover: #E8600F;
  --laranja-brilho: #FF7A00;
  --bege-tatico: #C3AA93;
  --off-white: #F6EFE8;
  --cinza-tatico: #7D5E4E;
  --borda-tatica: #2A1D17;
}

/* RESET TÁTICO */
* { box-sizing: border-box; }
body {
  background-color: var(--preto-tatico);
  color: var(--off-white);
  font-family: 'Inter', 'Source Sans Pro', sans-serif;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}

/* CONTAINER PRINCIPAL - LOJA INTEGRADA */
.conteiner-principal .conteiner,
.conteiner {
  max-width: 1280px;
  margin: 0 auto;
  background: transparent;
}

/* BARRA TOPO - CONTATO */
#barraTopo {
  background: var(--fundo-profundo);
  color: var(--bege-tatico);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  border-bottom: 1px solid var(--borda-tatica);
  padding: 8px 0;
}
#barraTopo a { color: var(--bege-tatico); }
#barraTopo a:hover { color: var(--laranja-fogo); }

/* CABEÇALHO PRINCIPAL */
#cabecalho {
  background: var(--preto-tatico);
  border-bottom: 1px solid var(--borda-tatica);
  padding: 18px 0 14px;
  position: sticky;
  top: 0;
  z-index: 100;
}
#cabecalho .logo a {
  display: inline-block;
  filter: brightness(1.1);
}
#cabecalho .logo img {
  max-height: 52px;
  object-fit: contain;
}

/* BARRA INICIAL - BUSCA / CARRINHO */
.barra-inicial {
  background: transparent;
  display: flex;
  align-items: center;
  gap: 24px;
}
.busca {
  background: #17100C;
  border: 1px solid var(--borda-tatica);
  border-radius: 4px;
  overflow: hidden;
}
.busca input[type="text"] {
  background: transparent;
  color: var(--off-white);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  padding: 12px 16px;
  border: none;
  width: 100%;
}
.busca input::placeholder { color: var(--cinza-tatico); }
.busca .botao-busca {
  background: var(--marrom-sumatra);
  color: var(--off-white);
  border: none;
  padding: 0 18px;
}
.busca .botao-busca:hover { background: var(--laranja-fogo); }

/* CARRINHO E ATENDIMENTO */
.carrinho, .minha-conta {
  color: var(--bege-tatico);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.carrinho .quantidade {
  background: var(--laranja-fogo);
  color: var(--preto-tatico);
  font-weight: 800;
}

/* MENU SUPERIOR - NAVEGAÇÃO TÁTICA */
.menu.superior {
  background: var(--preto-tatico);
  border-top: 1px solid var(--borda-tatica);
  border-bottom: 1px solid var(--borda-tatica);
}
.menu.superior .nivel-um > li > a {
  color: var(--off-white);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  padding: 18px 22px;
  display: block;
  position: relative;
  transition: all 0.2s ease;
}
.menu.superior .nivel-um > li > a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 22px;
  right: 22px;
  height: 2px;
  background: var(--laranja-fogo);
  transform: scaleX(0);
  transition: transform 0.25s ease;
}
.menu.superior .nivel-um > li:hover > a,
.menu.superior .nivel-um > li > a:hover {
  color: var(--laranja-fogo);
}
.menu.superior .nivel-um > li:hover > a:after { transform: scaleX(1); }

/* DROPDOWN */
.menu.superior .nivel-dois,
.menu.superior .nivel-tres {
  background: var(--fundo-profundo);
  border: 1px solid var(--borda-tatica);
  box-shadow: 0 20px 40px rgba(0,0,0,0.6);
}
.menu.superior .nivel-dois a {
  color: var(--bege-tatico);
  font-size: 12px;
  letter-spacing: 0.04em;
  padding: 10px 18px;
}
.menu.superior .nivel-dois a:hover {
  background: var(--marrom-sumatra);
  color: var(--off-white);
}

/* SEÇÃO BANNERS */
.secao-banners, .banner.cheio, .banner.mini-banner {
  background: transparent;
}
.banner img {
  border-radius: 4px;
  border: 1px solid var(--borda-tatica);
}
.mini-banner .modulo {
  border: 1px solid var(--borda-tatica);
  background: #12100E;
  transition: border-color 0.2s;
}
.mini-banner .modulo:hover { border-color: var(--marrom-sumatra); }

/* TÍTULO CATEGORIA */
.titulo-categoria, .titulo {
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: 22px;
  color: var(--off-white);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border-left: 4px solid var(--laranja-fogo);
  padding-left: 16px;
  margin: 32px 0 20px;
  background: none;
  border-bottom: none;
}

/* LISTAGEM DE PRODUTOS - VITRINE TÁTICA */
.listagem .listagem-linha { background: transparent; }
.listagem .listagem-item {
  background: #15110F;
  border: 1px solid var(--borda-tatica);
  border-radius: 6px;
  overflow: hidden;
  transition: all 0.3s ease;
}
.listagem .listagem-item:hover {
  border-color: var(--marrom-sumatra);
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.5);
}
.listagem .produto-imagem img { mix-blend-mode: lighten; }
.listagem .nome-produto {
  color: var(--off-white);
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 1.4;
  min-height: 36px;
}
.listagem .preco-produto .preco-venda,
.preco-produto strong {
  color: var(--laranja-fogo) !important;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: 18px;
}
.preco-produto .preco-promocional { color: var(--bege-tatico) !important; }
.preco-produto .preco-parcelado { color: var(--cinza-tatico); font-size: 11px; }

/* BOTÕES - CTA LARANJA FOGO */
.botao.principal, .botao.comprar, .acao .botao, .btn-cta-sumatra {
  background: var(--laranja-fogo);
  color: var(--preto-tatico) !important;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  border: none;
  border-radius: 4px;
  padding: 14px 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: all 0.2s ease;
  box-shadow: 0 0 0 1px var(--laranja-fogo) inset;
}
.botao.principal:hover, .botao.comprar:hover, .btn-cta-sumatra:hover {
  background: var(--laranja-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(218,119,28,0.35);
}
.botao.secundario {
  background: transparent;
  color: var(--bege-tatico) !important;
  border: 1px solid var(--borda-tatica);
}

/* BADGES E SELOS */
.selo-novo, .selo-promocao, .bandeira {
  background: var(--laranja-fogo);
  color: var(--preto-tatico);
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 2px;
}

/* BREADCRUMB */
.breadcrumbs, .caminhos {
  background: transparent;
  color: var(--cinza-tatico);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.breadcrumbs a { color: var(--bege-tatico); }
.breadcrumbs a:hover { color: var(--laranja-fogo); }

/* RODAPÉ - FUNDO PROFUNDO */
#rodape {
  background: var(--fundo-profundo);
  color: var(--bege-tatico);
  border-top: 1px solid var(--borda-tatica);
  margin-top: 60px;
}
#rodape .institucional,
#rodape .contato,
#rodape .pagamento,
#rodape .seguranca {
  background: transparent;
}
#rodape .titulo-rodape,
#rodape h4 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  color: var(--off-white);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin-bottom: 16px;
  border: none;
}
#rodape a, #rodape li {
  color: var(--bege-tatico);
  font-size: 13px;
  line-height: 1.8;
}
#rodape a:hover { color: var(--laranja-fogo); }

/* BARRA FINAL RODAPÉ - CNPJ */
#rodape .barra-final,
.rodape-barra-final {
  background: var(--preto-tatico);
  border-top: 1px solid var(--borda-tatica);
  color: var(--cinza-tatico);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-align: center;
  padding: 18px 0;
}
#rodape .barra-final strong { color: var(--bege-tatico); font-weight: 600; }

/* PÁGINA PRODUTO */
.produto .nome-produto {
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  color: var(--off-white);
  text-transform: uppercase;
}
.produto .preco-produto .preco-venda { font-size: 28px; }

/* RESPONSIVO TÁTICO */
@media (max-width: 768px) {
  #cabecalho { padding: 12px 0; }
  .menu.superior .nivel-um > li > a { padding: 14px 16px; font-size: 11px; }
  .titulo-categoria { font-size: 18px; }
}