/*
Theme Name: Halteia
Theme URI: https://halteia.com
Description: Tema filho (child theme) do Storefront, com identidade visual própria da HALTEIA — preto, dourado e rosé nude. Criado para loja WooCommerce com automações manuais via hooks.
Author: HALTEIA
Template: storefront
Version: 1.5.0
Text Domain: halteia
*/

/* =========================================================
   1. VARIÁVEIS DE MARCA
   Troque só aqui se precisar ajustar a paleta no futuro
   ========================================================= */
:root {
  /* =======================================================
     SISTEMA DE CORES DA MARCA — preto, dourado, vermelho
     -------------------------------------------------------
     Lógica de marketing por trás da hierarquia:

     PRETO (~80-85% da superfície visual): é o "silêncio" da marca —
     luxo, exclusividade, sofisticação. Quanto mais preto domina, mais
     o dourado e o vermelho se destacam por contraste (é o preto que
     faz o dourado parecer valioso, não o contrário).

     DOURADO (uso constante, ~10-15%): a cor "sempre presente" da marca
     — títulos, bordas, links, ícones. Comunica aspiração, conquista,
     status. É a cor que a cliente associa à HALTEIA em qualquer parte
     do site, por isso aparece em variações (mais clara pra hover/links,
     mais escura/bronze pra bordas e estados discretos).

     VERMELHO (uso cirúrgico, <5-8%): é a cor de AÇÃO e URGÊNCIA — usada
     de propósito só onde queremos gerar decisão rápida (botão de
     comprar, preço com desconto, item em destaque num menu). Se o
     vermelho aparecer em tudo, ele perde a força de "isso é importante,
     aja agora" — por isso ele é a cor mais rara da paleta, não a mais
     usada.
     ======================================================= */
  --halteia-black: #0D0D0D;        /* fundo base do site */
  --halteia-black-soft: #1A1A1A;   /* cards, painéis, seções elevadas */
  --halteia-black-elevado: #232323; /* submenus, hover de painel, 3ª camada */

  --halteia-gold: #C9A227;         /* títulos, bordas, ícones — cor "sempre visível" da marca */
  --halteia-gold-light: #E4C77A;   /* links, hover, texto dourado sobre fundo escuro */
  --halteia-gold-deep: #8C6B12;    /* bordas discretas, estados inativos/pressionados */

  --halteia-red: #C81E2B;          /* detalhe de botão, borda de ação */
  --halteia-red-deep: #7A1620;     /* hover/pressed do vermelho — tom "vinho", premium */
  --halteia-red-bright: #FF3B30;   /* alerta/urgência: preço com desconto, selo de oferta, item ativo */

  --halteia-yellow: #F2C200;       /* fundo do botão de ação principal (comprar, enviar) */

  --halteia-accent: #C99A82; /* rosé nude - cor de destaque pontual (Home) */
  --halteia-white: #FAF7F2;
  --halteia-gray: #6E6E6E;

  --halteia-font-title: "Playfair Display", Georgia, serif;
  --halteia-font-body: "Poppins", Arial, sans-serif;

  /* Avisa o navegador que o site é propositalmente escuro, pra ele não
     tentar "ajudar" invertendo cores de elementos sem estilo próprio
     (o que causava texto escuro sobre fundo escuro em páginas como
     Política de Privacidade, Contato, etc.) */
  color-scheme: dark;
}

/* Seleção de texto com a identidade da marca (detalhe fino, sem
   afetar estrutura nenhuma) */
::selection {
  background-color: var(--halteia-gold);
  color: var(--halteia-black);
}

/* =========================================================
   2. BASE
   ========================================================= */
body {
  background-color: var(--halteia-black);
  color: var(--halteia-white);
  font-family: var(--halteia-font-body);
}

h1, h2, h3, h4,
.site-title,
.woocommerce-loop-product__title {
  font-family: var(--halteia-font-title);
  color: var(--halteia-white);
  letter-spacing: 0.02em;
}

a {
  color: var(--halteia-gold-light);
  transition: color 0.2s ease;
}

a:hover {
  color: var(--halteia-gold);
}

/* =========================================================
   2.1 PÁGINAS PADRÃO DO WORDPRESS (Política de Privacidade,
   Contato, Entrega e Prazos, posts do blog, busca, 404 etc.)
   Essas páginas usam o template genérico do Storefront, que nunca
   tinha recebido nenhum estilo nosso — só a Home, cabeçalho e rodapé.
   Por isso ficavam com o texto escuro padrão do tema pai sobre o novo
   fundo escuro do body, quase ilegível.
   ========================================================= */
#page, #content, .site-content, #primary, #main, .content-area {
  background-color: var(--halteia-black);
  color: var(--halteia-white);
}

.entry-title, .page-title,
.entry-content, .entry-content p, .entry-content li, .entry-content span,
.entry-summary, .page-content {
  color: var(--halteia-white);
}

.entry-content a, .entry-summary a, .page-content a {
  color: var(--halteia-gold-light);
}

/* Trilha (breadcrumb) do WooCommerce */
.woocommerce-breadcrumb {
  color: var(--halteia-gray);
}
.woocommerce-breadcrumb a {
  color: var(--halteia-gold-light);
}

/* Barra lateral (widgets: Posts recentes, Comentários, Arquivos, Categorias) */
.widget-area, .widget {
  color: var(--halteia-white);
}
.widget-title {
  color: var(--halteia-gold);
  font-family: var(--halteia-font-title);
  margin-bottom: 12px;
}
.widget a {
  color: var(--halteia-gold-light);
}
.widget ul {
  list-style: none;
  padding-left: 0;
}
.widget_search .search-field,
.search-form .search-field {
  background-color: var(--halteia-white);
  color: var(--halteia-black);
  border: 1px solid var(--halteia-gold);
  padding: 8px 10px;
}

/* Comentários (se algum dia usados em posts) */
.comments-area, .comment-content, .comment-author, .comment-metadata {
  color: var(--halteia-white);
}
.comments-area a {
  color: var(--halteia-gold-light);
}

/* Produtos e páginas do WooCommerce em geral (loja, categoria, produto único) */
.woocommerce div.product .product_title,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce table.shop_table,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td,
.woocommerce-tabs, .woocommerce-Tabs-panel,
.woocommerce-Reviews, #reviews {
  color: var(--halteia-white);
}
.woocommerce div.product span.price ins {
  color: var(--halteia-red-bright);
  font-weight: 700;
  text-decoration: none;
}
.woocommerce div.product span.price del {
  color: var(--halteia-gray);
  opacity: 0.8;
}
/* Selo "Promoção" do WooCommerce (.onsale) — vermelho vivo de propósito,
   é o único elemento da loja com essa função (chamar atenção pra oferta) */
.woocommerce span.onsale {
  background-color: var(--halteia-red-bright) !important;
  color: var(--halteia-white) !important;
  font-weight: 700;
}
.woocommerce table.shop_table {
  border-color: rgba(255,255,255,0.15);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  border-color: rgba(255,255,255,0.1);
}
.woocommerce-tabs ul.tabs li a {
  color: var(--halteia-gold-light);
}
.woocommerce-tabs ul.tabs li.active a {
  color: var(--halteia-white);
}

/* =========================================================
   3. CABEÇALHO / LOGO
   Usamos o ID real do Storefront (#masthead) em vez de só a classe
   ".site-header" — ID tem mais força de especificidade no CSS, então
   combinado com !important garante que nada do tema pai consiga
   sobrescrever de volta pra cor escura padrão. Isso cobre nome do
   site, descrição, menu, submenu, busca, carrinho e ícones, tanto no
   desktop quanto na barra mobile (que fica fora do #masthead).
   ========================================================= */
#masthead,
.storefront-primary-navigation,
.storefront-handheld-footer-bar {
  background-color: var(--halteia-black) !important;
}

#masthead {
  border-bottom: 2px solid var(--halteia-gold) !important;
}

.custom-logo {
  max-width: 320px;
  height: auto;
}

/* Símbolo da HALTEIA no cabeçalho, com área de respiro dourada sutil
   (a silhueta é preta, então precisa de algo além do fundo preto puro
   pra não desaparecer) */
.halteia-logo-link {
  display: inline-flex;
  align-items: center;
}

.halteia-logo-simbolo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201,162,39,0.22) 0%, rgba(201,162,39,0.06) 65%, transparent 80%);
  border: 1px solid rgba(201,162,39,0.35);
  padding: 8px;
  box-sizing: border-box;
}

.halteia-logo-simbolo .custom-logo {
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  display: block;
}

@media (max-width: 600px) {
  .halteia-logo-simbolo {
    width: 44px;
    height: 44px;
    padding: 6px;
  }
}

/* Regra ampla: qualquer texto dentro do cabeçalho fica branco por
   padrão (nome do site, descrição, itens de menu, carrinho, contador) */
#masthead .site-title,
#masthead .site-title a,
#masthead .site-description,
#masthead a,
#masthead li,
#masthead span,
#masthead p,
.storefront-handheld-footer-bar a,
.storefront-handheld-footer-bar span {
  color: var(--halteia-white) !important;
}

/* Botão "Menu" (mobile/tablet) — é um <button>, não um <a>, então a
   regra genérica acima não o alcança. Precisa de seletor próprio. */
#masthead button,
#masthead .menu-toggle,
#masthead .toggle-button {
  color: var(--halteia-white) !important;
  background-color: transparent !important;
  border: 1px solid var(--halteia-gold) !important;
  border-radius: 3px !important;
}

#masthead button:hover,
#masthead .menu-toggle:hover {
  color: var(--halteia-gold) !important;
  border-color: var(--halteia-gold-light) !important;
}

#masthead button svg,
#masthead .menu-toggle svg,
#masthead button .icon,
#masthead .menu-toggle .icon {
  fill: var(--halteia-white) !important;
}

/* Exceção: o campo de busca continua com fundo branco e texto escuro,
   porque é um input — trocar a cor do texto ali o deixaria ilegível */
#masthead input.search-field {
  color: var(--halteia-black) !important;
}

#masthead input.search-field::placeholder {
  color: var(--halteia-gray) !important;
}

/* Hover e item de menu ativo em dourado */
#masthead a:hover,
#masthead li.current-menu-item > a,
.storefront-handheld-footer-bar a:hover {
  color: var(--halteia-gold) !important;
}

/* Ícones (busca, carrinho, hambúrguer) usam fill, não color */
#masthead svg,
#masthead .icon,
.storefront-handheld-footer-bar svg,
.storefront-handheld-footer-bar .icon {
  fill: var(--halteia-white) !important;
}

/* Menu aberto no mobile: garante fundo escuro mesmo se o tema pai
   forçar fundo claro só na versão responsiva do dropdown */
#masthead .main-navigation ul.nav-menu {
  background-color: var(--halteia-black) !important;
}

/* Submenus (dropdown) — camada mais elevada que o cabeçalho, com
   borda dourada discreta. Hover em vermelho: item de menu é a única
   "ação" que existe num dropdown (ir pra outra página), então usamos
   a cor de urgência da marca aqui de propósito, com força. */
#masthead ul.sub-menu,
#masthead ul.children {
  background-color: var(--halteia-black-elevado) !important;
  border-color: var(--halteia-gold-deep) !important;
}

#masthead ul.sub-menu a,
#masthead ul.children a {
  color: var(--halteia-gold-light) !important;
  border-left: 2px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

#masthead ul.sub-menu a:hover,
#masthead ul.children a:hover {
  color: var(--halteia-white) !important;
  background-color: rgba(200,30,43,0.12) !important;
  border-left-color: var(--halteia-red-bright) !important;
}

/* =========================================================
   4. BOTÕES (checkout, adicionar ao carrinho, etc.)
   Amarelo para chamar atenção como cor de ação, com borda vermelha
   como detalhe — hover inverte as duas (fundo vermelho, texto claro)
   pra dar feedback claro de clique.
   ========================================================= */
.button,
a.button,
button.button,
input.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  background-color: var(--halteia-yellow);
  color: var(--halteia-black);
  border: 2px solid var(--halteia-red);
  border-radius: 2px;
  font-family: var(--halteia-font-body);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 12px 28px;
}

.button:hover,
a.button:hover,
button.button:hover,
input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background-color: var(--halteia-red);
  border-color: var(--halteia-red);
  color: var(--halteia-white);
}

.added_to_cart,
.woocommerce-message {
  border-top-color: var(--halteia-yellow) !important;
  background-color: var(--halteia-black-soft) !important;
  color: var(--halteia-white) !important;
}

/* =========================================================
   5. BANNERS / SEÇÕES DE LINHA (Florescer, Transformar, Legado)
   Estrutura pronta para receber banner-hero-halteia.webp,
   colecao-florescer.webp, colecao-transformar.webp, colecao-legado.webp
   ========================================================= */
.halteia-banner-principal {
  width: 100%;
  height: auto;
  display: block;
}

.halteia-linhas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: 60px 0;
}

.halteia-linha-card {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}

.halteia-linha-card img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.4s ease;
}

.halteia-linha-card:hover img {
  transform: scale(1.04);
}

.halteia-linha-card .halteia-linha-titulo {
  position: absolute;
  bottom: 20px;
  left: 20px;
  color: var(--halteia-white);
  font-family: var(--halteia-font-title);
  font-size: 1.5rem;
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
}

@media (max-width: 768px) {
  .halteia-linhas {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   6. RODAPÉ
   ========================================================= */
.site-footer {
  background-color: var(--halteia-black) !important;
  color: var(--halteia-white) !important;
}

.site-footer a,
.site-footer .footer-widget a,
.halteia-footer__coluna a,
.halteia-footer__coluna li,
.halteia-footer__coluna span,
.halteia-footer__coluna p {
  color: var(--halteia-gold-light) !important;
  text-decoration: none;
}

.site-footer a:hover,
.halteia-footer__coluna a:hover {
  color: var(--halteia-gold) !important;
  text-decoration: underline;
}

/* Texto de atendimento (não é link) continua branco puro, pra diferenciar
   visualmente de item clicável */
.halteia-footer__coluna li:not(:has(a)) {
  color: var(--halteia-white) !important;
}

.site-footer .footer-logo {
  max-width: 180px;
  margin-bottom: 16px;
}

.halteia-footer__topo {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 32px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px 40px;
}

.halteia-footer__coluna h4 {
  color: var(--halteia-gold) !important;
  font-family: var(--halteia-font-title);
  margin-bottom: 16px;
}

.halteia-footer__coluna ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.halteia-footer__coluna li {
  margin-bottom: 10px;
  line-height: 1.5;
}

.halteia-selo {
  font-family: var(--halteia-font-title);
  font-style: italic;
  color: var(--halteia-gold-light) !important;
  font-size: 0.95rem;
}

.halteia-footer__base {
  border-top: 1px solid rgba(255,255,255,0.15);
  text-align: center;
  padding: 20px;
  font-size: 0.85rem;
  color: var(--halteia-white) !important;
  opacity: 0.75;
}

@media (max-width: 900px) {
  .halteia-footer__topo {
    grid-template-columns: 1fr 1fr;
    gap: 36px 24px;
  }
}

@media (max-width: 560px) {
  .halteia-footer__topo {
    grid-template-columns: 1fr;
    gap: 32px;
    text-align: center;
    padding: 48px 24px 32px;
  }

  .halteia-footer__marca {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .halteia-footer__coluna h4::after {
    content: "";
    display: block;
    width: 32px;
    height: 1px;
    background-color: var(--halteia-gold);
    margin: 8px auto 0;
  }
}

/* =========================================================
   7. HOME - BANNER PRINCIPAL (HERO)
   Banner limpo, sem texto sobreposto — a imagem já traz a marca.
   O link em volta (ver front-page.php) leva pra loja; aqui só
   cuidamos de exibir a imagem em largura total com um leve
   destaque de opacidade/hover pra indicar que é clicável.
   ========================================================= */
.halteia-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--halteia-black);
}

.halteia-hero__img {
  width: 100%;
  height: auto;
  max-height: 85vh;
  object-fit: cover;
  display: block;
  opacity: 0.95;
  transition: opacity 0.2s ease;
}

.halteia-hero a:hover .halteia-hero__img {
  opacity: 1;
}

/* =========================================================
   8. SEÇÕES GERAIS DA HOME
   ========================================================= */
.halteia-secao {
  max-width: 1200px;
  margin: 0 auto;
  padding: 70px 24px;
}

.halteia-secao__titulo {
  text-align: center;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  margin-bottom: 40px;
  position: relative;
}

.halteia-secao__titulo::after {
  content: "";
  display: block;
  width: 60px;
  height: 2px;
  background-color: var(--halteia-gold);
  margin: 14px auto 0;
}

/* Avisos visíveis só pra admin logado (ver current_user_can no front-page.php).
   Propositalmente discretos: fonte pequena, opacidade reduzida, com um
   rótulo "ADMIN" pra deixar claro que aquilo não é conteúdo do site. */
.halteia-nota-admin {
  text-align: center;
  font-size: 0.72rem;
  opacity: 0.6;
  margin: 14px auto 0;
  padding: 6px 10px;
  border: 1px dashed currentColor;
  border-radius: 3px;
  display: table;
}

.halteia-linhas-secao .halteia-nota-admin {
  color: var(--halteia-gray);
}

.halteia-clube .halteia-nota-admin {
  color: var(--halteia-gold-light) !important;
}

/* Linha (Florescer / Transformar / Legado) - complementa regras do item 5 */
.halteia-linha-card {
  display: block;
  position: relative;
}

.halteia-linha-card img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* Sobre a marca / Clube HALTEIA - layout em duas colunas */
.halteia-sobre,
.halteia-clube {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.halteia-clube {
  background-color: var(--halteia-black-soft);
  border-radius: 4px;
  color: var(--halteia-white);
}

.halteia-clube .halteia-secao__titulo,
.halteia-clube p {
  color: var(--halteia-white) !important;
}

.halteia-sobre__imagem img,
.halteia-clube__imagem img {
  width: 100%;
  height: auto;
  border-radius: 4px;
  display: block;
}

.halteia-clube__cta {
  display: inline-block;
  margin-top: 8px;
}

.halteia-sobre p {
  line-height: 1.7;
  color: var(--halteia-white);
}

.halteia-clube p {
  line-height: 1.7;
}

@media (max-width: 820px) {
  .halteia-sobre,
  .halteia-clube {
    grid-template-columns: 1fr;
  }

  .halteia-clube__imagem {
    order: -1;
  }
}

/* Seções complementares (ecos das linhas Transformar/Legado) —
   mesmo padrão de duas colunas, mas alternando o lado da imagem
   pra dar ritmo visual à Home em vez de repetir o mesmo layout. */
.halteia-complementar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.halteia-complementar__imagem img {
  width: 100%;
  height: auto;
  border-radius: 4px;
  display: block;
}

.halteia-complementar p {
  line-height: 1.7;
}

.halteia-complementar--inverso .halteia-complementar__imagem {
  order: 2;
}

@media (max-width: 820px) {
  .halteia-complementar,
  .halteia-complementar--inverso {
    grid-template-columns: 1fr;
  }

  .halteia-complementar--inverso .halteia-complementar__imagem {
    order: -1;
  }
}

/* Produtos em destaque - garante que os cards do WooCommerce sigam a identidade */
.halteia-produtos ul.products li.product .price {
  color: var(--halteia-gold);
  font-weight: 600;
}
.woocommerce ul.products li.product .price ins {
  color: var(--halteia-red-bright);
  text-decoration: none;
}
.woocommerce ul.products li.product .price del {
  color: var(--halteia-gray);
  opacity: 0.75;
}

/* =========================================================
   9. GATE DE PRONTIDÃO - aviso em produto ainda não liberado
   ========================================================= */
.halteia-aguardando {
  background-color: #FFF8E8;
  border: 1px solid var(--halteia-gold);
  color: var(--halteia-black);
  padding: 12px 16px;
  border-radius: 4px;
  font-size: 0.9rem;
}

/* =========================================================
   10. OFERTAS DO CLUBE HALTEIA (CPT halteia_oferta)
   ========================================================= */
.halteia-clube-ofertas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.halteia-oferta-card {
  display: block;
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  text-decoration: none;
}

.halteia-oferta-card img {
  width: 100%;
  height: auto;
  display: block;
}

.halteia-oferta-titulo {
  display: block;
  background-color: var(--halteia-black);
  color: var(--halteia-white);
  padding: 12px;
  font-family: var(--halteia-font-title);
  text-align: center;
}

@media (max-width: 768px) {
  .halteia-clube-ofertas {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   11. REFINAMENTOS RESPONSIVOS GERAIS (revisão final)
   ========================================================= */

/* Tablet: respiro um pouco menor entre seções */
@media (max-width: 900px) {
  .halteia-secao {
    padding: 56px 24px;
  }
}

/* Mobile: hero mais baixo (85vh fica alto demais em telas estreitas),
   seções com menos respiro vertical, títulos um pouco menores */
@media (max-width: 600px) {
  .halteia-hero__img {
    max-height: 60vh;
  }

  .halteia-secao {
    padding: 40px 20px;
  }

  .halteia-secao__titulo {
    margin-bottom: 28px;
  }

  .halteia-linhas {
    gap: 16px;
  }

  .halteia-complementar,
  .halteia-complementar--inverso {
    gap: 24px;
  }

  .halteia-sobre,
  .halteia-clube {
    gap: 24px;
    padding: 32px 20px;
  }

  .halteia-clube__cta {
    width: 100%;
    text-align: center;
  }
}

/* =========================================================
   12. PADRONIZAÇÃO GLOBAL DAS PÁGINAS INTERNAS (V2)
   Remove variações de sidebar/widgets e cria um banner único
   para páginas internas, loja, carrinho, checkout e conta.
   ========================================================= */

/* some o ruído visual do tema pai */
#secondary,
.secondary,
.widget-area,
.right-sidebar .widget-area,
.left-sidebar .widget-area,
aside.widget,
.widget_product_search,
.widget_recent_entries,
.widget_recent_comments,
.widget_archive,
.widget_categories,
.hentry .edit-link,
.post-edit-link,
.storefront-breadcrumb,
.woocommerce-breadcrumb,
.site-header-cart,
.site-branding + .site-search .widget,
.header-widget-region,
.header-widget-region * {
  display: none !important;
}

/* força conteúdo principal full width */
#primary,
#main,
.site-main,
.content-area,
.page-template-default #primary,
.page-template-default .content-area,
.page-template-default .site-main,
.right-sidebar .content-area,
.left-sidebar .content-area,
.woocommerce-page #primary,
.woocommerce-page .content-area,
.post-type-archive-product #primary,
.post-type-archive-product .content-area {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

/* títulos duplicados do Storefront somem: o banner novo assume esse papel */
body:not(.home) .entry-header,
body:not(.home) .page-header,
body:not(.home) .woocommerce-products-header,
body:not(.home) .archive-header,
body:not(.home) .page-title,
body:not(.home) .entry-title {
  display: none !important;
}

.halteia-page-main {
  background: var(--halteia-black);
}

.halteia-page-shell {
  max-width: 1200px;
  margin: 0 auto;
  padding: 56px 24px 80px;
}

.halteia-page-content {
  width: 100%;
  color: var(--halteia-white);
}

.halteia-page-content p,
.halteia-page-content li,
.halteia-page-content span,
.halteia-page-content label,
.halteia-page-content legend,
.halteia-page-content th,
.halteia-page-content td,
.halteia-page-content h2,
.halteia-page-content h3,
.halteia-page-content h4,
.halteia-page-content h5,
.halteia-page-content h6,
.halteia-page-content .woocommerce,
.halteia-page-content .woocommerce p,
.halteia-page-content .woocommerce li,
.halteia-page-content .woocommerce label,
.halteia-page-content .woocommerce strong,
.halteia-page-content .woocommerce small {
  color: var(--halteia-white) !important;
}

.halteia-page-content input,
.halteia-page-content select,
.halteia-page-content textarea {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1px solid var(--halteia-gold) !important;
}

.halteia-page-content .quantity input.qty {
  min-height: 44px;
}

/* Banner de páginas internas — REGRA DO PROJETO: título nunca fica
   sobreposto na imagem. Imagem limpa em cima, faixa preta com borda
   dourada abaixo carregando título e subtítulo. */
.halteia-page-hero {
  position: relative;
  width: 100%;
  background: var(--halteia-black);
  overflow: hidden;
}

.halteia-page-hero__media {
  position: relative; /* fluxo normal, não mais fundo absoluto */
  width: 100%;
}

.halteia-page-hero__media img {
  width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: cover;
  object-position: center center;
  display: block;
}

/* A faixa de título fica ABAIXO da imagem, com fundo próprio — o texto
   nunca depende do que a imagem tem atrás pra ser legível */
.halteia-page-hero__faixa {
  background: var(--halteia-black);
  border-top: 2px solid var(--halteia-gold);
  border-bottom: 1px solid rgba(201,162,39,0.35);
  text-align: center;
  padding: 28px 24px 30px;
}

.halteia-page-hero__title {
  margin: 0 0 8px;
  color: var(--halteia-white) !important;
  font-size: clamp(1.7rem, 4vw, 3rem);
  line-height: 1.1;
}

.halteia-page-hero__subtitle {
  max-width: 680px;
  margin: 0 auto;
  color: var(--halteia-gold-light) !important;
  font-size: clamp(0.95rem, 1.6vw, 1.1rem);
  line-height: 1.6;
}

/* Cards da página Documentos (hub de políticas) */
.halteia-docs-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: 36px 0;
}

.halteia-doc-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--halteia-black-soft);
  border: 1px solid rgba(201,162,39,0.4);
  border-radius: 4px;
  padding: 26px 22px;
  text-decoration: none !important;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.halteia-doc-card:hover {
  border-color: var(--halteia-gold);
  transform: translateY(-3px);
}

.halteia-doc-card__nome {
  font-family: var(--halteia-font-title);
  font-size: 1.25rem;
  color: var(--halteia-gold) !important;
}

.halteia-doc-card__desc {
  color: var(--halteia-white) !important;
  font-size: 0.92rem;
  line-height: 1.5;
}

.halteia-doc-card__cta {
  margin-top: auto;
  color: var(--halteia-gold-light) !important;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transition: color 0.2s ease;
}

.halteia-doc-card:hover .halteia-doc-card__cta {
  color: var(--halteia-red-bright) !important;
}

@media (max-width: 820px) {
  .halteia-docs-cards {
    grid-template-columns: 1fr;
  }

  .halteia-page-hero__media img {
    max-height: 260px;
  }
}

/* cards e blocos woo com fundo coerente */
.halteia-page-content .woocommerce ul.products li.product,
.halteia-page-content .cart-collaterals,
.halteia-page-content .shop_table,
.halteia-page-content .woocommerce-checkout-review-order,
.halteia-page-content .woocommerce-form,
.halteia-page-content .woocommerce-MyAccount-content,
.halteia-page-content .woocommerce-MyAccount-navigation {
  background: var(--halteia-black-soft);
  border: 1px solid var(--halteia-gold-deep);
  border-radius: 4px;
}

.halteia-page-content .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.halteia-page-content .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid rgba(201,162,39,0.15);
}

.halteia-page-content .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 12px 16px;
  color: var(--halteia-gold-light) !important;
  border-left: 3px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

.halteia-page-content .woocommerce-MyAccount-navigation li a:hover {
  color: var(--halteia-white) !important;
  background-color: var(--halteia-black-elevado);
  border-left-color: var(--halteia-gold) !important;
}

/* Item ativo ("você está aqui") — vinho, mais discreto que o
   vermelho vivo dos botões, mas ainda claramente a cor de destaque
   da marca sinalizando "seção atual" */
.halteia-page-content .woocommerce-MyAccount-navigation li.is-active a {
  color: var(--halteia-white) !important;
  background-color: rgba(122,22,32,0.35);
  border-left-color: var(--halteia-red-deep) !important;
  font-weight: 600;
}

.halteia-page-content .shop_table,
.halteia-page-content .shop_table th,
.halteia-page-content .shop_table td {
  border-color: rgba(255,255,255,0.12) !important;
}

.halteia-page-content .shop_table thead th,
.halteia-page-content .cart_totals h2,
.halteia-page-content .woocommerce-checkout-review-order-table th,
.halteia-page-content #order_review_heading,
.halteia-page-content .woocommerce-billing-fields h3,
.halteia-page-content .woocommerce-additional-fields h3,
.halteia-page-content .woocommerce-account .addresses .title h3 {
  color: var(--halteia-white) !important;
}

/* botões conforme direção visual mais forte */
.button,
a.button,
button.button,
input.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.halteia-page-content button,
.halteia-page-content input[type="submit"] {
  background-color: var(--halteia-gold) !important;
  color: var(--halteia-red) !important;
  border: 1px solid var(--halteia-gold-light) !important;
}

.button:hover,
a.button:hover,
button.button:hover,
input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.halteia-page-content button:hover,
.halteia-page-content input[type="submit"]:hover {
  background-color: var(--halteia-gold-light) !important;
  color: var(--halteia-red) !important;
}

/* pequenos ajustes do cabeçalho */
.site-header .site-search .widget_product_search form,
.site-header .site-search .widget_search form {
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  .halteia-page-shell {
    padding: 40px 20px 64px;
  }
}


/* =========================================================
   13. PÁGINAS INTERNAS — LAYOUT ESTÁVEL (versão consolidada)
   Substitui as antigas "V3/V4/V5" que se sobrescreviam entre si e
   causavam formatos diferentes em cada página. Regra do projeto:
   o título NUNCA fica sobreposto na imagem do banner (ver bloco
   .halteia-page-hero mais acima, na seção de banner interno).
   ========================================================= */

/* Cabeçalho com logo horizontal (alternativa ao símbolo circular) */
#masthead .custom-logo-link.halteia-logo-link--horizontal,
.halteia-logo-link--horizontal {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  max-width: 260px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#masthead .halteia-logo-horizontal,
.halteia-logo-horizontal {
  display: block !important;
  width: auto !important;
  max-width: 260px !important;
  max-height: 74px !important;
  height: auto !important;
  object-fit: contain !important;
  border: 0 !important;
  background: transparent !important;
}

/* Sem barra lateral/widgets de blog nas páginas internas — conteúdo em
   largura total, sem "caixas fantasmas" de Recent Posts/Archives etc. */
body:not(.home) #secondary,
body:not(.home) .secondary,
body:not(.home) .widget-area,
body:not(.home) aside,
body:not(.home) .widget,
body:not(.home) .header-widget-region,
body:not(.home) .storefront-product-section,
body:not(.home) .site-info,
body:not(.home) .edit-link,
body:not(.home) .post-edit-link {
  display: none !important;
}

body:not(.home) #primary,
body:not(.home) #main,
body:not(.home) .content-area,
body:not(.home) .site-main {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

body:not(.home) .site-content .col-full,
body:not(.home) .col-full,
.halteia-page-shell {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Esconde o valor/contador solto do carrinho no topo do menu
   (o item "Carrinho" do menu principal já cumpre esse papel) */
#masthead .site-header-cart,
#masthead .cart-contents,
#masthead .amount,
#masthead .count,
.storefront-handheld-footer-bar {
  display: none !important;
}

/* Conteúdo das páginas internas sempre com o padrão preto/branco */
.halteia-page-shell {
  padding-top: 44px !important;
}

.halteia-page-content,
.halteia-page-article,
body:not(.home) article,
body:not(.home) .entry-content {
  background: var(--halteia-black) !important;
  color: var(--halteia-white) !important;
}

@media (max-width: 768px) {
  #masthead .halteia-logo-horizontal,
  .halteia-logo-horizontal {
    max-width: 180px !important;
    max-height: 56px !important;
  }
}

/* =========================================================
   14. MENU PRINCIPAL LIMPO (desktop e mobile)
   ========================================================= */
#masthead .main-navigation ul.halteia-menu-principal,
#masthead .main-navigation ul.nav-menu.halteia-menu-principal {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#masthead .main-navigation ul.halteia-menu-principal li,
#masthead .main-navigation ul.nav-menu.halteia-menu-principal li {
  margin: 0 !important;
  padding: 0 !important;
}

#masthead .main-navigation ul.halteia-menu-principal a,
#masthead .main-navigation ul.nav-menu.halteia-menu-principal a {
  display: block !important;
  padding: 12px 18px !important;
  color: var(--halteia-white) !important;
  font-weight: 600 !important;
}

#masthead .main-navigation ul.halteia-menu-principal a:hover,
#masthead .main-navigation ul.nav-menu.halteia-menu-principal a:hover {
  color: var(--halteia-gold) !important;
}

@media (max-width: 768px) {
  #masthead .main-navigation.toggled ul.halteia-menu-principal,
  #masthead .main-navigation.toggled ul.nav-menu.halteia-menu-principal {
    max-height: none !important;
    overflow: visible !important;
    border-top: 1px solid rgba(201,162,39,0.55) !important;
    border-bottom: 1px solid rgba(201,162,39,0.55) !important;
  }

  #masthead .main-navigation ul.halteia-menu-principal a,
  #masthead .main-navigation ul.nav-menu.halteia-menu-principal a {
    padding: 13px 0 !important;
    font-size: 1rem !important;
  }
}

/* =========================================================
   15. NOSSAS COLEÇÕES — cards das linhas na página da loja
   ========================================================= */
.halteia-colecoes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  padding: 44px 24px 8px;
  max-width: 1200px;
  margin: 0 auto;
}

@media (max-width: 820px) {
  .halteia-colecoes-grid {
    grid-template-columns: 1fr;
    padding: 32px 20px 4px;
  }
}