/* ================================
   BOTÃO COMPRAR – ALTO RELEVO
   Apenas página de produto
================================ */

/* botão principal */
.produto .botao-comprar,
.produto button.comprar,
.produto .btn-comprar {
  background: linear-gradient(180deg, #45c83d, #2fa52a);
  color: #ffffff !important;
  font-weight: 700;
  font-size: 18px;
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: 0 6px 0 #1f7d1c, 0 10px 20px rgba(0,0,0,0.25);
  transition: all 0.18s ease;
  position: relative;
}

/* efeito hover (desktop) */
.produto .botao-comprar:hover,
.produto button.comprar:hover,
.produto .btn-comprar:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 0 #1f7d1c, 0 14px 26px rgba(0,0,0,0.35);
  filter: brightness(1.05);
}


/* ==========================================
   FIX — caixas suspensas (carrinho/conta/contato)
   ficavam atrás do banner (Loja Integrada)
========================================== */

/* topo não pode cortar as caixas */
body.pagina-inicial #topo,
body.pagina-inicial #cabecalho,
body.pagina-inicial .cabecalho {
  overflow: visible !important;
  position: relative !important;
  z-index: 99999 !important;
}

/* caixas suspensas: fundo sólido e por cima */
body.pagina-inicial .carrinho-suspenso,
body.pagina-inicial .contato-content,
body.pagina-inicial .minha-conta .dropdown-menu,
body.pagina-inicial .atalhos-topo .dropdown-menu {
  position: absolute !important;
  z-index: 999999 !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.18) !important;
  border-radius: 12px !important;
  opacity: 1 !important;
}

/* garante que nada fique transparente/amarelo dentro */
body.pagina-inicial .carrinho-suspenso *,
body.pagina-inicial .contato-content *,
body.pagina-inicial .minha-conta .dropdown-menu *,
body.pagina-inicial .atalhos-topo .dropdown-menu * {
  background-color: #fff !important;
}

/* banner/slider fica abaixo */
body.pagina-inicial .banner,
body.pagina-inicial .secao-banners,
body.pagina-inicial .slides,
body.pagina-inicial .flex-viewport {
  position: relative !important;
  z-index: 1 !important;
}
/* efeito clique (pressionado) */
.produto .botao-comprar:active,
.produto button.comprar:active,
.produto .btn-comprar:active {
  transform: translateY(4px);
  box-shadow: 0 2px 0 #1f7d1c, 0 6px 12px rgba(0,0,0,0.2);
}

/* efeito foco (acessibilidade) */
.produto .botao-comprar:focus-visible {
  outline: none;
}

/* leve animação chamando atenção ao carregar */
@keyframes pulseComprar {
  0% { box-shadow: 0 6px 0 #1f7d1c, 0 10px 20px rgba(0,0,0,0.25); }
  50% { box-shadow: 0 8px 0 #1f7d1c, 0 14px 26px rgba(0,0,0,0.35); }
  100% { box-shadow: 0 6px 0 #1f7d1c, 0 10px 20px rgba(0,0,0,0.25); }
}

.produto .botao-comprar {
  animation: pulseComprar 1.6s ease-in-out 1;
}


/* =====================================================
   INÍCIO – VISUAL MODERNO HOME (CAZZA NOBRE)
   Objetivo: Melhorar cards, títulos e botões da vitrine
   Criado em: 2026
===================================================== */
 .botao-comprar {
   box-shadow: 0 0 0 4px rgba(69,200,61,0.35);
}

/* =========================
   VISUAL MODERNO - HOME
   (cards, títulos, espaçamento)
========================= */

/* 1) Compactar espaço entre seções */
.home .secao, 
.home .container,
.home main {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/* 2) Títulos das vitrines mais "fortes" */
.titulo,
.titulo-secao,
.secao-titulo,
h2.titulo {
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  font-size: 22px !important;
  margin: 10px 0 18px !important;
  text-transform: uppercase;
}

/* 3) Cards de produto */
.listagem-item,
.product-item,
.produto,
.vitrine-produto,
li[itemtype*="Product"] {
  border: 1px solid #eee !important;
  border-radius: 14px !important;
  padding: 14px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.06) !important;
}

/* =====================================================
   ✅ FIX REAL — CARDS UNIFORMES (HOME) | Loja Integrada
   Baseado no seu HTML: #listagemProdutos.listagem.borda-alpha
   (Lançamentos / Mais Vendidos / Destaques)
===================================================== */

/* 1) Faz o "item" do carrossel/vitrine esticar (quando existir) */
.pagina-inicial #listagemProdutos .listagem-linha > li,
.pagina-inicial #listagemProdutos .owl-stage .owl-item,
.pagina-inicial #listagemProdutos .owl-item {
  display: flex !important;
  align-items: stretch !important;
}

/* 2) O LI também precisa virar coluna e ocupar toda altura */
.pagina-inicial #listagemProdutos .listagem-linha > li {
  height: 600px !important; /* ajuste fino: 560–660 */
  flex-direction: column !important;
}

/* Se tiver OWL: garante altura do item do slider */
.pagina-inicial #listagemProdutos .owl-item > li,
.pagina-inicial #listagemProdutos .owl-item > div {
  height: 100% !important;
  display: flex !important;
}

/* 3) O card em si ocupa 100% e vira coluna */
.pagina-inicial #listagemProdutos .listagem-item,
.pagina-inicial #listagemProdutos .produto {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
}

/* 4) Box da imagem com altura fixa */
.pagina-inicial #listagemProdutos .imagem-produto,
.pagina-inicial #listagemProdutos .foto-produto,
.pagina-inicial #listagemProdutos .imagem {
  height: 270px !important; /* ajuste: 240–300 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 5) Imagem não pode “estourar” */
.pagina-inicial #listagemProdutos img {
  max-height: 270px !important;
  width: 100% !important;
  object-fit: contain !important;
}

/* 6) Área de infos vira coluna e ocupa o resto */
.pagina-inicial #listagemProdutos .info-produto,
.pagina-inicial #listagemProdutos .dados-produto,
.pagina-inicial #listagemProdutos .dados,
.pagina-inicial #listagemProdutos .info {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

/* 7) Título travado (até 3 linhas) */
.pagina-inicial #listagemProdutos .nome-produto,
.pagina-inicial #listagemProdutos h3 {
  min-height: 3.9em !important;
  line-height: 1.25 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* 8) Preço com altura mínima */
.pagina-inicial #listagemProdutos .produto-preco,
.pagina-inicial #listagemProdutos .preco,
.pagina-inicial #listagemProdutos .valor {
  min-height: 3.6em !important;
}

/* 9) Botão sempre no final */
.pagina-inicial #listagemProdutos .botao,
.pagina-inicial #listagemProdutos .botao-comprar,
.pagina-inicial #listagemProdutos button,
.pagina-inicial #listagemProdutos a[title*="Comprar"] {
  margin-top: auto !important;
}

/* 10) Mobile */
@media (max-width: 768px) {
  .pagina-inicial #listagemProdutos .listagem-linha > li {
    height: 560px !important;
  }
  .pagina-inicial #listagemProdutos .imagem-produto,
  .pagina-inicial #listagemProdutos .foto-produto,
  .pagina-inicial #listagemProdutos .imagem {
    height: 240px !important;
  }
  .pagina-inicial #listagemProdutos img {
    max-height: 240px !important;
  }
}

/* =====================================================
   FUNDO AMARELO -> BRANCO (HOME) | degradê começa no "Mais Vendidos"
===================================================== */

body.pagina-inicial{
  background: linear-gradient(
    180deg,
    #004AAD 0%,
    #004AAD 20%,   /* aaul desce mais */
    #ffffff 50%,   /* começa a clarear por volta do "Mais Vendidos" */
    #ffffff 100%
  ) !important;
  background-repeat: no-repeat !important;
}

/* garante que nada “pinte” de branco por cima do degradê */
body.pagina-inicial #corpo,
body.pagina-inicial .conteiner-principal,
body.pagina-inicial .secao-principal,
body.pagina-inicial .conteiner,
body.pagina-inicial .pagina {
  background: transparent !important;
}

/* =====================================================
   HEADER AMARELO (HOME) — estilo marketplace
===================================================== */

/* Topo/cabeçalho (variações comuns na Loja Integrada) */
body.pagina-inicial #topo,
body.pagina-inicial #cabecalho,
body.pagina-inicial .cabecalho,
body.pagina-inicial .header {
  background: #FFE600  !important;
  border-bottom: 0 !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.08) !important;
}

/* Barras do topo (onde costuma ficar “Compra 100% segura…”) */
body.pagina-inicial .barra-inicial,
body.pagina-inicial .barra-topo,
body.pagina-inicial .barra-newsletter,
body.pagina-inicial .superior {
  background:#FFE600  !important;
  border: 0 !important;
}

/* Menu / navegação */
body.pagina-inicial .menu.superior,
body.pagina-inicial .menu-superior,
body.pagina-inicial .navegacao,
body.pagina-inicial .nav {
  background: #004AAD !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/* Links do menu em preto (ML) */
body.pagina-inicial .menu.superior a,
body.pagina-inicial .menu-superior a,
body.pagina-inicial .navegacao a,
body.pagina-inicial .nav a {
  color: #111 !important;
  font-weight: 600 !important;
}

/* Hover discreto (sem “roxo” para ficar bem ML) */
body.pagina-inicial .menu.superior a:hover,
body.pagina-inicial .menu-superior a:hover,
body.pagina-inicial .navegacao a:hover,
body.pagina-inicial .nav a:hover {
  opacity: .75 !important;
}

/* Campo de busca com cara “premium” */
body.pagina-inicial input[type="search"],
body.pagina-inicial input[name="busca"],
body.pagina-inicial .busca input {
  border-radius: 8px !important;
  border: 1px solid rgba(0,0,0,.18) !important;
  background: #fff !important;
}
/*
body.pagina-inicial #topo *,
body.pagina-inicial #cabecalho * {
  background-color: transparent;
}
*/


/* =====================================================
   SUBCATEGORIAS (DROP-DOWN) — visual premium
   (melhora o menu ao passar o mouse)
===================================================== */

/* Garantir que o menu “mãe” tenha referência p/ posicionar o drop */
body.pagina-inicial .menu.superior,
body.pagina-inicial .menu-superior,
body.pagina-inicial .navegacao,
body.pagina-inicial .nav {
  position: relative !important;
  z-index: 2000 !important;
}

/* Caixa do drop-down (UL/Div que abre) */
body.pagina-inicial .menu.superior ul ul,
body.pagina-inicial .menu-superior ul ul,
body.pagina-inicial .navegacao ul ul,
body.pagina-inicial .nav ul ul,
body.pagina-inicial .menu.superior .submenu,
body.pagina-inicial .menu-superior .submenu {
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.18) !important;
  padding: 8px !important;
  min-width: 220px !important;
  margin-top: 10px !important; /* descola da faixa/linha */
  z-index: 3000 !important;
}

/* Itens do drop-down */
body.pagina-inicial .menu.superior ul ul a,
body.pagina-inicial .menu-superior ul ul a,
body.pagina-inicial .navegacao ul ul a,
body.pagina-inicial .nav ul ul a {
  display: block !important;
  padding: 10px 12px !important;
  color: #111 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  border-radius: 8px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

/* Hover do item (cinza claro estilo ML) */
body.pagina-inicial .menu.superior ul ul a:hover,
body.pagina-inicial .menu-superior ul ul a:hover,
body.pagina-inicial .navegacao ul ul a:hover,
body.pagina-inicial .nav ul ul a:hover {
  background: rgba(0,0,0,.06) !important;
  color: #111 !important;
}

/* Remove “fundos amarelos” herdados de algum tema no drop */
body.pagina-inicial .menu.superior ul ul,
body.pagina-inicial .menu-superior ul ul,
body.pagina-inicial .navegacao ul ul,
body.pagina-inicial .nav ul ul {
  background-clip: padding-box !important;
}

/* Opcional: pequeno “ponteiro” no topo do drop (bem sutil) */
body.pagina-inicial .menu.superior ul ul:before,
body.pagina-inicial .menu-superior ul ul:before,
body.pagina-inicial .navegacao ul ul:before,
body.pagina-inicial .nav ul ul:before {
  content: "";
  position: absolute;
  top: -7px;
  left: 18px;
  width: 12px;
  height: 12px;
  background: #fff;
  border-left: 1px solid rgba(0,0,0,.12);
  border-top: 1px solid rgba(0,0,0,.12);
  transform: rotate(45deg);
}

body.pagina-inicial .menu.superior ul ul li,
body.pagina-inicial .menu-superior ul ul li,
body.pagina-inicial .navegacao ul ul li,
body.pagina-inicial .nav ul ul li{
  background: transparent !important;
}

/* =====================================================
   SUBCATEGORIAS — AJUSTES MOBILE (sem hover)
===================================================== */
@media (max-width: 768px) {

  /* drop-down ocupa a largura e fica “plano” (sem sombra exagerada) */
  body.pagina-inicial .menu.superior ul ul,
  body.pagina-inicial .menu-superior ul ul,
  body.pagina-inicial .navegacao ul ul,
  body.pagina-inicial .nav ul ul,
  body.pagina-inicial .menu.superior .submenu,
  body.pagina-inicial .menu-superior .submenu {
    position: static !important;     /* evita estourar pra fora */
    width: 100% !important;
    min-width: 0 !important;
    margin-top: 6px !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.12) !important;
  }

  /* remove o “ponteiro” no mobile */
  body.pagina-inicial .menu.superior ul ul:before,
  body.pagina-inicial .menu-superior ul ul:before,
  body.pagina-inicial .navegacao ul ul:before,
  body.pagina-inicial .nav ul ul:before {
    display: none !important;
  }

  /* itens maiores para toque */
  body.pagina-inicial .menu.superior ul ul a,
  body.pagina-inicial .menu-superior ul ul a,
  body.pagina-inicial .navegacao ul ul a,
  body.pagina-inicial .nav ul ul a {
    padding: 14px 14px !important;
    font-size: 15px !important;
  }
}
/* =====================================================
   MOBILE — PADRONIZAR CARDS DO CARROSSEL (HOME)
   (sobrescreve o li inline width:310px)
===================================================== */
@media (max-width: 768px) {

  /* 1) Força largura do item do carrossel no celular (mesmo com inline) */
  body.pagina-inicial .home ul.produtos-carrossel > li {
    width: 240px !important;     /* ajuste: 220–260 */
    margin-right: 12px !important;
  }

  /* 2) Card menor e mais “harmônico” no mobile */
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item {
    height: 520px !important;    /* ajuste: 480–540 */
    border-radius: 12px !important;
  }

  /* 3) Área da imagem menor */
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .imagem-produto {
    height: 200px !important;    /* ajuste: 180–220 */
  }
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .imagem-produto img {
    max-height: 200px !important;
  }

  /* 4) Tipografia mais compacta (título e preço) */
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .nome-produto,
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item h3 {
    min-height: 3.2em !important;
    line-height: 1.15 !important;
    font-size: 13px !important;
  }

  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .produto-preco,
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .preco,
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .valor {
    min-height: 3.2em !important;
  }

  /* 5) Botão ocupa toda largura e fica alinhado */
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .acoes-produto,
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .botao-comprar,
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .botao {
    margin-top: auto !important;
  }

  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .botao,
  body.pagina-inicial .home ul.produtos-carrossel .listagem-item .botao-comprar {
    width: 100% !important;
    display: block !important;
    padding: 10px 12px !important;
  }
}

/* =====================================================
   FIX DEFINITIVO (Loja Integrada) — CARRINHO SUSPENSO
   ficar por cima do banner e com fundo sólido
===================================================== */

/* Cabeçalho não pode cortar dropdown */
body.pagina-inicial #topo,
body.pagina-inicial #cabecalho,
body.pagina-inicial .cabecalho,
body.pagina-inicial .conteudo-topo {
  overflow: visible !important;
  position: relative !important;
  z-index: 999999 !important;
}

/* “Pai” do carrinho vira referência e sobe na pilha */
body.pagina-inicial .carrinho,
body.pagina-inicial .carrinho.vazio {
  position: relative !important;
  z-index: 9999999 !important;
}

/* Caixa do carrinho (varia por tema) — sempre acima e branca */
body.pagina-inicial .carrinho-suspenso,
body.pagina-inicial .carrinho-interno,
body.pagina-inicial .carrinho-interno-ajax,
body.pagina-inicial .minicart-placeholder {
  position: absolute !important;
  z-index: 99999999 !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.20) !important;
  border-radius: 12px !important;
  opacity: 1 !important;
}

/* Força os “filhos” a não herdarem transparência */
body.pagina-inicial .carrinho-suspenso *,
body.pagina-inicial .carrinho-interno *,
body.pagina-inicial .carrinho-interno-ajax *,
body.pagina-inicial .minicart-placeholder * {
  background-color: #fff !important;
}

/* Banner/slider fica abaixo */
body.pagina-inicial .banner,
body.pagina-inicial .secao-banners,
body.pagina-inicial .slides,
body.pagina-inicial .flex-viewport {
  position: relative !important;
  z-index: 1 !important;
}


/* =====================================================
   MENU SUPERIOR — TEXTO BRANCO / HOVER PRETO
===================================================== */

/* Texto normal das categorias */
.menu.superior .nivel-um > li > a,
.menu.superior .nivel-um > li > a strong,
.menu.superior .titulo.fundo-principal {
  color: #ffffff !important;
}

/* Remove aquele roxo herdado */
.menu.superior .nivel-um > li > a {
  background: transparent !important;
}

/* Hover: texto preto */
.menu.superior .nivel-um > li:hover > a,
.menu.superior .nivel-um > li:hover > a strong {
  color: #000000 !important;
}

/* Submenu (dropdown) mantém texto escuro */
.menu.superior .nivel-dois a {
  color: #222 !important;
}

/* =====================================================
   TÍTULO "NAVEGUE PELAS MARCAS" BRANCO
===================================================== */

body .titulo-categoria strong,
body .titulo-categoria .titulo,
body .vitrine-marcas .titulo-categoria strong {
  color: #000000 !important;
}

/* ==========================================
   COR PERSONALIZADA REDES SOCIAIS
========================================== */

#rodape .institucional .lista-redes li a i {
   color: #FFE600 !important; /* escolha sua cor */
}

/* Hover */
#rodape .institucional .lista-redes li a:hover i {
   color: #000 !important;
}

/* ==========================================
   TARJA SUPERIOR AMARELA
========================================== */

.barra-frase {
  background: #FFE600 !important;
  color: #000 !important;
}

.barra-frase * {
  color: #000 !important;
}

/* =====================================================
   CATEGORIA VELAS & AROMAS (ID 24163226)
===================================================== */

body.categoria-id-24163226 {
  background: linear-gradient(180deg,#f7f0ea 0%,#efe3d8 40%,#ffffff 100%) !important;
}

body.categoria-id-24163226 #cn-product-trust{
  display:none !important;
}

/* título */
body.categoria-id-24163226 h1,
body.categoria-id-24163226 .titulo,
body.categoria-id-24163226 .titulo-categoria{
  text-align:center !important;
  font-size:34px !important;
  color:#5c3b2e !important;
  font-weight:700 !important;
}

/* descrição */
body.categoria-id-24163226 .descricao,
body.categoria-id-24163226 .categoria-descricao{
  max-width:900px;
  margin:auto;
  text-align:center;
  color:#6e5649;
  font-size:18px;
}

/* cards */
body.categoria-id-24163226 .listagem-item{
  background:#fff;
  border-radius:18px;
  border:1px solid rgba(160,120,90,.2);
  box-shadow:0 10px 30px rgba(90,60,40,.08);
  transition:.2s;
}

body.categoria-id-24163226 .listagem-item:hover{
  transform:translateY(-5px);
  box-shadow:0 20px 40px rgba(90,60,40,.12);
}

/* nome produto */
body.categoria-id-24163226 .nome-produto{
  color:#5b4032;
  font-weight:700;
}

/* preço */
body.categoria-id-24163226 .preco-promocional{
  color:#9b5f35;
  font-size:26px;
  font-weight:800;
}
/* botão apenas dos produtos da categoria */
body.categoria-id-24163226 .listagem-item .botao-comprar,
body.categoria-id-24163226 .produto .botao-comprar {
  background: linear-gradient(180deg, #8b5e3c, #6f472b) !important;
  border-radius: 12px !important;
  color: #fff !important;
  font-weight: 700 !important;
  border: none !important;
}

/* banner exclusivo velas */

.banner-alma-luz{
  width:100%;
  max-width:1920px;
  margin:20px auto 40px auto;
  display:block;
}

.banner-alma-luz img{
  width:100%;
  height:auto;
  display:block;
  border-radius:6px;
}

/* esconder banner padrão somente nessa categoria */

body.categoria-id-24163226 .flexslider,
body.categoria-id-24163226 .secao-banners{
  display:none !important;
}

/* box de confiança produto */

.produto .seguranca,
.produto .beneficios-produto{
    background:#faf7f4;
    border:1px solid #e7ded7;
    border-radius:12px;
    padding:18px;
    margin-top:15px;
    box-shadow:0 6px 18px rgba(0,0,0,0.05);
}

.produto .seguranca li,
.produto .beneficios-produto li{
    font-size:14px;
    color:#4a3b32;
    margin-bottom:10px;
    line-height:1.5;
}

.produto .seguranca i,
.produto .beneficios-produto i{
    color:#9b6a45;
}

/* remover box de confiança na categoria Velas & Aromas */

body.pagina-categoria #cn-product-trust {
    display: none !important;
}

/* =====================================================
LANDING PAGE — ALMA DE LUZ
VERSÃO COMPATÍVEL LOJA INTEGRADA
===================================================== */

.alma-luz-landing{
  max-width:1280px;
  margin:40px auto;
  padding:0 20px;
}

/* HERO */
.alma-luz-hero{
  margin-bottom:30px;
}

.alma-luz-hero img{
  width:100%;
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.08);
  display:block;
}

/* INTRO */
.alma-luz-intro{
  text-align:center;
  max-width:900px;
  margin:0 auto 40px auto;
}

.alma-luz-intro h2{
  font-size:40px;
  color:#5c3b2e;
  margin-bottom:15px;
}

.alma-luz-intro p{
  font-size:18px;
  color:#6e5649;
  line-height:1.8;
}

/* BENEFÍCIOS */
.alma-luz-beneficios{
  margin-bottom:40px;
  text-align:center;
}

.alma-luz-beneficios .beneficio{
  display:inline-block;
  width:18%;
  min-width:160px;
  margin:0 0.8% 15px 0.8%;
  padding:14px;
  background:#fff;
  border-radius:12px;
  border:1px solid rgba(160,120,90,.2);
  font-weight:700;
  color:#6a4632;
  vertical-align:top;
  box-sizing:border-box;
}

/* FRAGRÂNCIAS */
.alma-luz-fragrancias{
  margin-bottom:40px;
  text-align:center;
}

.alma-luz-fragrancias .frag-card{
  display:inline-block;
  width:18%;
  min-width:210px;
  margin:0 0.8% 18px 0.8%;
  background:#fff;
  border-radius:18px;
  padding:25px 20px;
  border:1px solid rgba(160,120,90,.2);
  text-align:center;
  box-shadow:0 10px 25px rgba(0,0,0,.05);
  transition:.2s;
  vertical-align:top;
  box-sizing:border-box;
}

.alma-luz-fragrancias .frag-card:hover{
  transform:translateY(-4px);
  box-shadow:0 15px 35px rgba(0,0,0,.08);
}

.alma-luz-fragrancias .frag-card h3{
  font-size:28px;
  color:#6a4632;
  margin-bottom:10px;
}

.alma-luz-fragrancias .frag-nota{
  color:#5f483a;
  font-weight:600;
  margin-bottom:10px;
}

.alma-luz-fragrancias .frag-momento{
  font-style:italic;
  color:#a06a45;
  margin-bottom:8px;
}

.alma-luz-fragrancias .frag-sensacao{
  font-weight:600;
  color:#4e3b31;
}

/* FRASE FINAL */
.alma-luz-frase-final{
  text-align:center;
  font-size:26px;
  font-style:italic;
  color:#6d4a35;
  margin-bottom:40px;
}

/* MOBILE */
@media (max-width:1100px){

  .alma-luz-beneficios .beneficio{
    width:46%;
    margin:0 1% 15px 1%;
  }

  .alma-luz-fragrancias .frag-card{
    width:46%;
    margin:0 1% 18px 1%;
  }
}

@media (max-width:768px){

  .alma-luz-intro h2{
    font-size:30px;
  }

  .alma-luz-intro p{
    font-size:16px;
    line-height:1.7;
  }

  .alma-luz-beneficios .beneficio{
    width:100%;
    min-width:auto;
    margin:0 0 12px 0;
  }

  .alma-luz-fragrancias .frag-card{
    width:100%;
    min-width:auto;
    margin:0 0 14px 0;
  }

  .alma-luz-frase-final{
    font-size:20px;
  }
}
/* =====================================================
   V3 — CORES DAS FRAGRÂNCIAS / ALMA DE LUZ
   Cole no final do CSS
===================================================== */

/* base mais refinada para todos os cards */
.alma-luz-fragrancias .frag-card {
  border-width: 1px !important;
  box-shadow: 0 12px 28px rgba(86, 57, 38, 0.06) !important;
  position: relative;
  overflow: hidden;
}

.alma-luz-fragrancias .frag-card:before {
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 18px 18px 0 0;
}

/* =========================
   SERENO
========================= */
.alma-luz-fragrancias .frag-card:nth-child(1) {
  background: #f6f0fb !important;
  border: 1px solid #d8c7e8 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(1):before {
  background: #b79ad6 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(1) h3 {
  color: #6b4f91 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(1) .frag-momento {
  color: #8a6bb3 !important;
}

/* =========================
   AURORA
========================= */
.alma-luz-fragrancias .frag-card:nth-child(2) {
  background: #fbf6e8 !important;
  border: 1px solid #eadca9 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(2):before {
  background: #d9b95f !important;
}

.alma-luz-fragrancias .frag-card:nth-child(2) h3 {
  color: #9b7a1d !important;
}

.alma-luz-fragrancias .frag-card:nth-child(2) .frag-momento {
  color: #b38d28 !important;
}

/* =========================
   RAIZ
========================= */
.alma-luz-fragrancias .frag-card:nth-child(3) {
  background: #edf3ec !important;
  border: 1px solid #b9ceb5 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(3):before {
  background: #5e7f57 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(3) h3 {
  color: #496543 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(3) .frag-momento {
  color: #6b8b65 !important;
}

/* =========================
   ÂMBAR
========================= */
.alma-luz-fragrancias .frag-card:nth-child(4) {
  background: #fbf1e7 !important;
  border: 1px solid #e5c2a0 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(4):before {
  background: #c78643 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(4) h3 {
  color: #9a5d22 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(4) .frag-momento {
  color: #b06e30 !important;
}

/* =========================
   COLHEITA
========================= */
.alma-luz-fragrancias .frag-card:nth-child(5) {
  background: #faf0ea !important;
  border: 1px solid #ddb7a0 !important;
}

.alma-luz-fragrancias .frag-card:nth-child(5):before {
  background: #b76a3f !important;
}

.alma-luz-fragrancias .frag-card:nth-child(5) h3 {
  color: #99532d !important;
}

.alma-luz-fragrancias .frag-card:nth-child(5) .frag-momento {
  color: #b26b44 !important;
}

/* texto geral continua elegante */
.alma-luz-fragrancias .frag-nota {
  font-weight: 600 !important;
}

.alma-luz-fragrancias .frag-sensacao {
  font-weight: 600 !important;
}

/* hover mais sofisticado */
.alma-luz-fragrancias .frag-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 36px rgba(86, 57, 38, 0.10) !important;
}
/* =====================================================
   V3.1 — REFINO PREMIUM / ALMA DE LUZ
===================================================== */

/* título principal da seção */
.alma-luz-intro h2 {
  position: relative;
  padding-bottom: 18px;
  margin-bottom: 18px !important;
  letter-spacing: -0.5px;
}

.alma-luz-intro h2:after {
  content: "";
  display: block;
  width: 140px;
  height: 2px;
  margin: 18px auto 0 auto;
  background: linear-gradient(90deg, #b98a5a, #e4c79d, #b98a5a);
  border-radius: 999px;
}

/* texto introdutório mais leve e luxuoso */
.alma-luz-intro p {
  max-width: 900px !important;
  color: #70584a !important;
}

/* benefícios mais premium */
.alma-luz-beneficios .beneficio {
  border-radius: 999px !important;
  background: linear-gradient(180deg, #fffdfb 0%, #f4ebe3 100%) !important;
  border: 1px solid rgba(181, 141, 105, 0.28) !important;
  box-shadow: 0 8px 18px rgba(82, 55, 38, 0.05) !important;
  color: #6c4934 !important;
  font-size: 15px !important;
  letter-spacing: 0.2px;
}

/* cards com acabamento mais sofisticado */
.alma-luz-fragrancias .frag-card {
  box-shadow:
    0 14px 30px rgba(86, 57, 38, 0.06),
    inset 0 1px 0 rgba(255,255,255,0.35) !important;
  border-radius: 20px !important;
}

/* nome das fragrâncias mais nobres */
.alma-luz-fragrancias .frag-card h3 {
  letter-spacing: -0.3px;
  margin-bottom: 12px !important;
}

/* notas */
.alma-luz-fragrancias .frag-nota {
  font-size: 18px !important;
  line-height: 1.45 !important;
}

/* momento */
.alma-luz-fragrancias .frag-momento {
  font-size: 19px !important;
  margin-top: 8px !important;
  margin-bottom: 10px !important;
}

/* sensação */
.alma-luz-fragrancias .frag-sensacao {
  font-size: 17px !important;
  line-height: 1.55 !important;
}

/* frase final com mais presença */
.alma-luz-frase-final {
  max-width: 980px;
  margin: 12px auto 48px auto !important;
  padding: 18px 10px 0 10px;
  font-size: 30px !important;
  color: #6a4735 !important;
}

.alma-luz-frase-final:before {
  content: "";
  display: block;
  width: 160px;
  height: 2px;
  margin: 0 auto 18px auto;
  background: linear-gradient(90deg, #b98a5a, #ebd0a8, #b98a5a);
  border-radius: 999px;
}

/* leve refinamento no hero */
.alma-luz-hero img {
  border: 1px solid rgba(181, 141, 105, 0.22) !important;
}

/* produtos abaixo da landing mais alinhados com a coleção */
body.categoria-id-24163226 .listagem-item {
  border-radius: 20px !important;
  box-shadow: 0 12px 26px rgba(86, 57, 38, 0.06) !important;
}

body.categoria-id-24163226 .listagem-item .nome-produto {
  color: #5f4031 !important;
}

body.categoria-id-24163226 .preco-promocional,
body.categoria-id-24163226 .preco-venda,
body.categoria-id-24163226 .preco {
  color: #9b6038 !important;
}

/* botão da vitrine mais premium */
body.categoria-id-24163226 .listagem-item .botao-comprar,
body.categoria-id-24163226 .produto .botao-comprar {
  background: linear-gradient(180deg, #a06d45 0%, #7b5032 100%) !important;
  box-shadow: 0 10px 20px rgba(87, 56, 35, 0.14) !important;
}

/* responsivo */
@media (max-width: 768px) {
  .alma-luz-intro h2 {
    padding-bottom: 14px;
  }

  .alma-luz-intro h2:after {
    width: 100px;
    margin-top: 14px;
  }

  .alma-luz-frase-final {
    font-size: 22px !important;
  }

  .alma-luz-frase-final:before {
    width: 110px;
  }
}
/* =====================================================
V3.2 — ACABAMENTO PREMIUM
===================================================== */

/* hover mais elegante */
.alma-luz-fragrancias .frag-card:hover{
transform:translateY(-8px);
box-shadow:0 20px 45px rgba(80,55,35,0.12);
}

/* centralizar melhor o último card */
.alma-luz-fragrancias .frag-card:last-child{
margin-left:auto;
margin-right:auto;
}

/* espaçamento melhor da seção */
.alma-luz-fragrancias{
margin-top:20px;
margin-bottom:60px;
}

/* divisor elegante */
.alma-luz-intro:after{
content:"";
display:block;
width:220px;
height:2px;
margin:35px auto;
background:linear-gradient(90deg,#d9c5a6,#b98a5a,#d9c5a6);
opacity:0.5;
}

/* frase final mais sofisticada */
.alma-luz-frase-final{
font-size:32px !important;
font-style:italic;
letter-spacing:0.4px;
margin-top:50px;
}

/* =====================================================
   AJUSTE V3.2 — PADRONIZAR CARDS DAS FRAGRÂNCIAS
===================================================== */

.alma-luz-fragrancias {
  text-align: center;
}

.alma-luz-fragrancias .frag-card {
  min-height: 290px !important;
  padding: 28px 20px !important;
  vertical-align: top !important;
}

/* nome */
.alma-luz-fragrancias .frag-card h3 {
  min-height: 42px !important;
  display: block !important;
  margin-bottom: 12px !important;
}

/* nota olfativa */
.alma-luz-fragrancias .frag-nota {
  min-height: 58px !important;
  display: block !important;
  line-height: 1.4 !important;
  margin-bottom: 10px !important;
}

/* momento */
.alma-luz-fragrancias .frag-momento {
  min-height: 36px !important;
  display: block !important;
  margin-bottom: 10px !important;
}

/* sensação */
.alma-luz-fragrancias .frag-sensacao {
  min-height: 52px !important;
  display: block !important;
  line-height: 1.5 !important;
}

/* ajuste fino específico do Aurora */
.alma-luz-fragrancias .frag-card:nth-child(2) .frag-nota {
  min-height: 58px !important;
}

.alma-luz-fragrancias .frag-card:nth-child(2) .frag-sensacao {
  min-height: 52px !important;
}

/* =====================================================
   AJUSTE V3.2 — PADRONIZAR CARDS DAS FRAGRÂNCIAS
===================================================== */

.alma-luz-fragrancias {
  text-align: center;
}

.alma-luz-fragrancias .frag-card {
  min-height: 290px !important;
  padding: 28px 20px !important;
  vertical-align: top !important;
}

/* nome */
.alma-luz-fragrancias .frag-card h3 {
  min-height: 42px !important;
  display: block !important;
  margin-bottom: 12px !important;
}

/* nota olfativa */
.alma-luz-fragrancias .frag-nota {
  min-height: 58px !important;
  display: block !important;
  line-height: 1.4 !important;
  margin-bottom: 10px !important;
}

/* momento */
.alma-luz-fragrancias .frag-momento {
  min-height: 36px !important;
  display: block !important;
  margin-bottom: 10px !important;
}

/* sensação */
.alma-luz-fragrancias .frag-sensacao {
  min-height: 52px !important;
  display: block !important;
  line-height: 1.5 !important;
}

/* ajuste fino específico do Aurora */
.alma-luz-fragrancias .frag-card:nth-child(2) .frag-nota {
  min-height: 58px !important;
}

.alma-luz-fragrancias .frag-card:nth-child(2) .frag-sensacao {
  min-height: 52px !important;
}

/* =====================================================
   SEÇÃO VISUAL — COLEÇÃO 01 / ALMA DE LUZ
   Subcategoria LI: 24172736
===================================================== */

.colecao-bloco{
  max-width: 1320px;
  margin: 26px auto 50px auto;
  padding: 28px 24px 34px 24px;
  background: linear-gradient(180deg, #fcf8f4 0%, #f6eee7 100%);
  border: 1px solid rgba(181,141,105,0.18);
  border-radius: 28px;
  box-shadow: 0 18px 40px rgba(82,55,38,0.06);
}

.colecao-cabecalho{
  text-align: center;
  margin: 0 auto 26px auto;
}

.colecao-kicker{
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 700;
  color: #9b6a45;
  margin-bottom: 8px;
}

.colecao-titulo{
  margin: 0 0 10px 0;
  font-size: 40px;
  line-height: 1.15;
  color: #5c3b2e;
  font-weight: 700;
}

.colecao-link{
  display: inline-block;
  padding: 10px 18px;
  border-radius: 999px;
  background: linear-gradient(180deg, #fffdfb 0%, #f4ebe3 100%);
  border: 1px solid rgba(181,141,105,0.26);
  color: #6c4934 !important;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 8px 18px rgba(82,55,38,0.05);
}

.colecao-link:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 22px rgba(82,55,38,0.09);
}

/* a landing e os produtos ficam dentro da mesma seção */
.colecao-bloco .alma-luz-landing{
  margin-top: 0 !important;
  margin-bottom: 26px !important;
  max-width: 100% !important;
}

/* título da vitrine de produtos da coleção */
.colecao-bloco #listagemProdutos > .titulo,
.colecao-bloco #listagemProdutos h1,
.colecao-bloco #listagemProdutos .titulo.cor-secundaria{
  text-align: center !important;
  color: #6a4632 !important;
  font-size: 30px !important;
  margin-top: 24px !important;
  margin-bottom: 20px !important;
}

/* produtos da coleção dentro da seção */
.colecao-bloco #listagemProdutos{
  background: transparent !important;
  margin-top: 10px !important;
}

/* divisória sutil após o slogan e antes da vitrine */
.colecao-bloco #listagemProdutos:before{
  content: "";
  display: block;
  width: 180px;
  height: 2px;
  margin: 10px auto 30px auto;
  background: linear-gradient(90deg, rgba(185,138,90,0), rgba(185,138,90,0.9), rgba(185,138,90,0));
  border-radius: 999px;
}

/* responsivo */
@media (max-width: 768px){
  .colecao-bloco{
    margin: 18px auto 36px auto;
    padding: 18px 12px 24px 12px;
    border-radius: 20px;
  }

  .colecao-titulo{
    font-size: 30px;
  }

  .colecao-link{
    font-size: 14px;
    padding: 9px 14px;
  }
}
/* ===== VITRINE HORIZONTAL DA COLEÇÃO ALMA DE LUZ ===== */

.colecao-wrapper #listagemProdutos{
overflow:hidden!important;
margin-top:18px!important;
}

/* container de rolagem */
.colecao-wrapper .colecao-scroll{
overflow-x:auto;
overflow-y:hidden;
white-space:nowrap;
padding-bottom:12px;
scroll-behavior:smooth;
-webkit-overflow-scrolling:touch;
}

/* scrollbar elegante */
.colecao-wrapper .colecao-scroll::-webkit-scrollbar{
height:8px;
}

.colecao-wrapper .colecao-scroll::-webkit-scrollbar-track{
background:#efe6de;
border-radius:999px;
}

.colecao-wrapper .colecao-scroll::-webkit-scrollbar-thumb{
background:#c6a483;
border-radius:999px;
}

/* card do produto */
.colecao-wrapper .colecao-scroll .listagem-item{
display:inline-block!important;
vertical-align:top!important;

width:230px!important;
min-width:230px!important;
max-width:230px!important;

margin-right:16px!important;

background:#fffdfb;
border-radius:18px;
border:1px solid rgba(173,132,97,0.18);
box-shadow:0 12px 24px rgba(60,40,30,0.08);

min-height:620px!important;

padding-bottom:18px;
white-space:normal!important;
}

/* área da imagem */
.colecao-wrapper .colecao-scroll .imagem-produto{
height:250px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
padding:12px!important;
overflow:hidden!important;
}

.colecao-wrapper .colecao-scroll .imagem-produto img{
max-height:210px!important;
width:auto!important;
max-width:100%!important;
object-fit:contain!important;
}

/* bloco de informações */
.colecao-wrapper .colecao-scroll .info-produto{
padding:0 16px!important;
display:flex!important;
flex-direction:column!important;
min-height:240px!important;
}

/* nome produto altura fixa */
.colecao-wrapper .colecao-scroll .nome-produto,
.colecao-wrapper .colecao-scroll .produto-nome{
font-size:17px!important;
font-weight:700!important;
color:#5f4031!important;

min-height:90px!important;
max-height:90px!important;

overflow:hidden!important;
line-height:1.2!important;

margin-bottom:12px!important;
}

/* preço */
.colecao-wrapper .colecao-scroll .preco-promocional,
.colecao-wrapper .colecao-scroll .preco-venda,
.colecao-wrapper .colecao-scroll .preco{
font-size:25px!important;
font-weight:800!important;
color:#9b6038!important;
}

/* botão comprar alinhado */
.colecao-wrapper .colecao-scroll .acoes-produto{
margin-top:auto!important;
padding:0 16px!important;
}

.colecao-wrapper .colecao-scroll .botao-comprar{
width:100%!important;
text-align:center!important;
padding:14px!important;

background:linear-gradient(180deg,#a06d45,#7b5032)!important;
color:#fff!important;

border-radius:12px!important;
border:none!important;

font-weight:700!important;
}

/* esconder trust da vitrine */
.colecao-wrapper #cn-product-trust{
display:none!important;
}

/* ===== RESPONSIVO ===== */

@media(max-width:900px){

.colecao-wrapper .colecao-scroll .listagem-item{
width:210px!important;
min-width:210px!important;
}

}

@media(max-width:768px){

.colecao-wrapper .colecao-scroll .listagem-item{
width:180px!important;
min-width:180px!important;
min-height:560px!important;
}

.colecao-wrapper .colecao-scroll .imagem-produto{
height:200px!important;
}

.colecao-wrapper .colecao-scroll .nome-produto{
font-size:15px!important;
min-height:80px!important;
max-height:80px!important;
}

.colecao-wrapper .colecao-scroll .preco-promocional{
font-size:22px!important;
}

}
/* =====================================================
   ajuste fino vitrini / ALMA DE LUZ
   Subcategoria LI: 24172736
===================================================== */


.colecao-wrapper .colecao-scroll .listagem-item{
margin-right:6px!important;
}

.colecao-wrapper .colecao-scroll .acoes-produto,
.colecao-wrapper .colecao-scroll .acoes-produto-responsiva{
padding:0 12px!important;
text-align:center!important;
}

.colecao-wrapper .colecao-scroll .botao-comprar,
.colecao-wrapper .colecao-scroll .botao{
display:block!important;
width:100%!important;
margin:0 auto!important;
text-align:center!important;
padding:14px 12px!important;
box-sizing:border-box!important;
}

.colecao-wrapper .colecao-scroll .listagem-item .info-produto{
align-items:stretch!important;
}


.colecao-wrapper .colecao-scroll{
font-size:0!important;
}

.colecao-wrapper .colecao-scroll .listagem-item{
margin-right:6px!important;
width:210px!important;
min-width:210px!important;
max-width:210px!important;
}

.colecao-wrapper .colecao-scroll .listagem-item:last-child{
margin-right:0!important;
}
.colecao-wrapper .colecao-scroll{
display:flex!important;
flex-wrap:nowrap!important;
gap:8px!important;
align-items:stretch!important;
white-space:normal!important;
font-size:initial!important;
}

.colecao-wrapper .colecao-scroll .listagem-item{
flex:0 0 210px!important;
width:210px!important;
min-width:210px!important;
max-width:210px!important;
margin:0!important;
}

.colecao-wrapper .colecao-scroll .listagem-item:last-child{
margin-right:0!important;
}
/* ===== Botão comprar ajuste ===== */

.colecao-wrapper .colecao-scroll .botao-comprar,
.colecao-wrapper .colecao-scroll .botao,
.colecao-wrapper .colecao-scroll .acoes-produto a.botao-comprar,
.colecao-wrapper .colecao-scroll .acoes-produto a.botao{
transform:none!important;
transition:background .2s ease, box-shadow .2s ease!important;
position:static!important;
top:auto!important;
bottom:auto!important;
left:auto!important;
right:auto!important;
}

.colecao-wrapper .colecao-scroll .botao-comprar:hover,
.colecao-wrapper .colecao-scroll .botao:hover,
.colecao-wrapper .colecao-scroll .acoes-produto a.botao-comprar:hover,
.colecao-wrapper .colecao-scroll .acoes-produto a.botao:hover{
transform:none!important;
margin-top:0!important;
top:auto!important;
bottom:auto!important;
left:auto!important;
right:auto!important;
}
.colecao-wrapper .colecao-scroll .botao-comprar:hover,
.colecao-wrapper .colecao-scroll .botao:hover{
filter:brightness(1.03)!important;
box-shadow:0 10px 20px rgba(87,56,35,0.16)!important;
}
    
.colecao-wrapper .colecao-scroll .listagem-item:hover{
transform:none!important;
}

.colecao-wrapper .colecao-scroll .acoes-produto,
.colecao-wrapper .colecao-scroll .acoes-produto:hover,
.colecao-wrapper .colecao-scroll .acoes-produto-responsiva,
.colecao-wrapper .colecao-scroll .acoes-produto-responsiva:hover{
position:static!important;
transform:none!important;
margin-top:auto!important;
top:auto!important;
bottom:auto!important;
left:auto!important;
right:auto!important;
}

.colecao-wrapper .colecao-scroll .acoes-produto a,
.colecao-wrapper .colecao-scroll .acoes-produto a:hover,
.colecao-wrapper .colecao-scroll .acoes-produto .botao,
.colecao-wrapper .colecao-scroll .acoes-produto .botao:hover,
.colecao-wrapper .colecao-scroll .acoes-produto .botao-comprar,
.colecao-wrapper .colecao-scroll .acoes-produto .botao-comprar:hover{
position:static!important;
display:block!important;
transform:none!important;
margin:0!important;
top:auto!important;
bottom:auto!important;
left:auto!important;
right:auto!important;
}


















