/* === Barra promocional: desktop estática, mobile fixa === */
.promo-top-bar {
  background: var(--cTarja);
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  font-family: Arimo, system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  padding: 6px 0;
  box-shadow: 0 2px 6px -2px rgba(0,0,0,0.25);
  width: 100%;
  box-sizing: border-box;
  display: flex;
  position: relative; /* desktop no fluxo */
  z-index: 9999;
}

.promo-inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
}

.promo-block {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.promo-icon {
  font-size: 16px;
  line-height: 1;
}

.promo-separator {
  position: relative;
  width: 4px;
  height: 4px;
  background: rgba(255,255,255,0.6);
  border-radius: 50%;
  margin: 0 10px;
  flex-shrink: 0;
}

.coupon-code {
  background: #ffffff;
  color: var(--cTarja);
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-left: 4px;
  white-space: nowrap;
}

/* prevenir overflow */
.promo-top-bar * {
  max-width: 100%;
  word-break: break-word;
}

@media (max-width: 992px) {
  /* deixa a barra fixa (já está no seu código) */
  .promo-top-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
  }

  /* === Novo bloco: empurra o carrossel para baixo da barra === */
  .promo-top-bar + .slick-slider {
    margin-top: 48px; /* ajuste conforme altura real da barra */
  }
}

  .promo-inner {
    padding: 0 12px;
    gap: 6px;
  }
  .promo-block {
    flex: 1 1 100%;
    justify-content: center;
    gap: 4px;
    display: flex;
    flex-wrap: wrap;
  }
  .promo-separator {
    display: none;
  }
  .coupon-code {
    margin-left: 2px;
  }
}








/* Diminuir a altura do header */
header {
    padding: 10px 0; /* Ajuste superior e inferior */
    height: auto; /* Deixa o height flexível */
}

/* Caso queira diminuir especificamente o logotipo */
header .logo img {
    max-height: 80px; /* Ajuste o valor conforme necessário */
}

/* Ajustar espaçamentos internos de menus, se necessário */
header nav ul li {
    padding: 5px 10px; /* Reduz o espaço dos itens do menu */
}

/* Ajustar altura da barra superior (se tiver) */
.top-bar {
    padding: 5px 0;
}

/* Ajuste responsivo para mobile também */
@media (max-width: 768px) {
    header {
        padding: 5px 0;
    }

    header .logo img {
        max-height: 40px;
    }
}
/* Diminuir a altura da tarja/banner (top-bar) */
.top-bar, .top-strip, .barra-superior {
    padding: 5px 0; /* Diminui o espaço interno vertical */
    height: auto; /* Deixa altura automática */
}

/* Diminuir ainda mais para banners muito altos */
.top-bar img, .top-strip img, .barra-superior img {
    max-height: 30px; /* Reduz o tamanho das imagens dentro da tarja */
}

/* Aproximar os ícones */
.top-bar .social-icons a,
.top-strip .social-icons a,
.barra-superior .social-icons a {
    margin: 0 5px; /* Deixa os ícones mais juntinhos */
}

/* Se os ícones estiverem em outro container */
.top-bar .icons a,
.top-strip .icons a,
.barra-superior .icons a {
    margin: 0 5px; /* Também aproxima */
}

/* Ajuste para dispositivos móveis */
@media (max-width: 768px) {
    .top-bar, .top-strip, .barra-superior {
        padding: 3px 0;
    }

    .top-bar img, .top-strip img, .barra-superior img {
        max-height: 20px;
    }

    .top-bar .social-icons a,
    .top-strip .social-icons a,
    .barra-superior .social-icons a {
        margin: 0 3px;
    }
}
/* Ajustar altura da faixa de benefícios */
.benefits-bar, .barra-beneficios, .vantagens {
    padding: 8px 0; /* Reduz espaço interno */
    height: auto; 
}

/* Diminuir o tamanho dos ícones */
.benefits-bar img,
.barra-beneficios img,
.vantagens img {
    max-height: 15px; /* Reduz a altura dos ícones */
}

/* Aproximar os ícones e textos */
.benefits-bar .benefit,
.barra-beneficios .benefit,
.vantagens .benefit {
    margin: 0 5px; /* Reduz espaço entre os blocos */
}

/* Ajustar alinhamento dos textos */
.benefits-bar .benefit p,
.barra-beneficios .benefit p,
.vantagens .benefit p {
    margin: 2px 0; /* Reduz espaço vertical entre título e subtítulo */
    font-size: 10px; /* Opcional: deixa o texto mais enxuto */
}

/* Responsividade para mobile */
@media (max-width: 768px) {
    .benefits-bar img,
    .barra-beneficios img,
    .vantagens img {
        max-height: 25px;
    }

    .benefits-bar .benefit,
    .barra-beneficios .benefit,
    .vantagens .benefit {
        margin: 0 5px;
    }
}


/* === Hierarquia de exibição das vitrines (atualizado) === */

/* 1. Wrapper flex em coluna */
#corpo {
  display: flex !important;
  flex-direction: column !important;
}

/* 2. Ordem das vitrines */
/* 1) Facas */
.listagem.vitrine-23625042 {
  order: 2 !important;
}
