/* =====================================================
   Audaxco — Product Cards
   Applies to .audaxco-product-card (archive/busca pages)
   AND to .audaxco-destaques-grid .bt_bb_grid_item (Post Grid da homepage destaques)
   Para o Post Grid: adicione a classe "audaxco-destaques-grid" no campo
   "Custom CSS Class" do elemento no Bold Builder.
   ===================================================== */

/* Espaçamento do container da grade antes do footer */
.bt_bb_css_post_grid {
margin-bottom: 60px;
}

.audaxco-product-card,
.audaxco-destaques-grid .bt_bb_grid_item {
background: #ffffff;
border: 1px solid #e0e4ea;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.audaxco-product-card:hover,
.audaxco-destaques-grid .bt_bb_grid_item:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.13);
transform: translateY(-4px);
}

/* Área da imagem */
.audaxco-product-card .bt_bb_grid_item_post_thumbnail,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_thumbnail {
	display: block;
	height: 220px !important;
	max-height: 220px !important;
	overflow: hidden;
}

.audaxco-product-card .bt_bb_grid_item_post_thumbnail a,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_thumbnail a {
display: block;
height: 100%;
}

/* Bold Builder renderiza a imagem como background CSS no <a> — forçar contain */
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_thumbnail a {
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: center !important;
}

.audaxco-product-card .bt_bb_grid_item_post_thumbnail img,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_thumbnail img {
width: 100%;
height: 100%;
object-fit: contain;
display: block;
transition: transform 0.3s ease;
}

.audaxco-product-card:hover .bt_bb_grid_item_post_thumbnail img,
.audaxco-destaques-grid .bt_bb_grid_item:hover .bt_bb_grid_item_post_thumbnail img {
transform: scale(1.04);
}

/* Área de texto */
.audaxco-product-card .bt_bb_grid_item_post_content,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_content {
padding: 14px 16px 18px;
}

/* Categorias — tags pill centralizadas */
.audaxco-product-card .bt_bb_grid_item_category,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_category {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 5px;
margin-bottom: 8px;
}

.audaxco-product-card .bt_bb_grid_item_category a,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_category a {
font-size: 10px;
line-height: 1.3;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.4px;
text-align: center;
color: #0e51ac;
text-decoration: none;
background-color: #eaf0fa;
border-radius: 20px;
padding: 3px 10px;
transition: background-color 0.2s ease, color 0.2s ease;
}

.audaxco-product-card .bt_bb_grid_item_category a:hover,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_category a:hover {
background-color: #0e51ac;
color: #ffffff;
}

/* Título do produto */
.audaxco-product-card .bt_bb_grid_item_post_title,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_title {
font-size: 15px;
line-height: 1.4;
margin: 4px 0 0;
text-align: center;
}

.audaxco-product-card .bt_bb_grid_item_post_title a,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_title a {
color: #1a1a1a;
text-decoration: none;
transition: color 0.2s;
}

.audaxco-product-card .bt_bb_grid_item_post_title a:hover,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_title a:hover {
color: #0e51ac;
}

/* Descrição curta do produto */
.audaxco-product-card .bt_bb_grid_item_post_excerpt,
.audaxco-destaques-grid .bt_bb_grid_item .bt_bb_grid_item_post_excerpt {
font-size: 13px;
line-height: 1.5;
color: #666e7a;
text-align: center;
margin-top: 6px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}

/* Fix: o style.css do Bold Builder tem uma media query @max-width:1400px que força
   width:25% nos bt_bb_grid_item via .bt_bb_grid_container.bt_bb_columns_6 (0,3,0).
   No HTML real, audaxco-destaques-grid, bt_bb_grid_container e bt_bb_columns_6
   ficam no mesmo elemento. Por isso o seletor precisa combinar as classes no
   mesmo nó, não como descendentes. */
@media screen and (max-width: 1400px) {
  .bt_bb_css_post_grid.audaxco-destaques-grid.bt_bb_columns_6 .bt_bb_css_post_grid_content > .bt_bb_grid_item {
    width: 100% !important;
  }
}


