/* ===========================
   HOME (escopado em .home)
   =========================== */
/* escopo do carrossel de destaques */
.highlights,                 /* se seu wrapper tiver essa classe */
.wc-block-grid,              /* blocos do Woo */
.wp-block-woocommerce-products {   /* variações de bloco */
  --swiper-navigation-color: #fff;   /* cor do ícone */
  --swiper-theme-color: #fff;        /* fallback */
  --swiper-navigation-size: 22px;    /* tamanho do ícone */
}

/* botões das setas */
.wc-block-grid .swiper-button-prev,
.wc-block-grid .swiper-button-next,
.wp-block-woocommerce-products .swiper-button-prev,
.wp-block-woocommerce-products .swiper-button-next,
.highlights .swiper-button-prev,
.highlights .swiper-button-next{
  background:#111 !important;
  color:#fff !important;               /* ícone usa currentColor */
  border:1px solid #242424 !important;
  width:44px; height:44px;
  border-radius:12px;
  top:50%; transform:translateY(-50%);
}

/* estado desabilitado */
.wc-block-grid .swiper-button-disabled,
.wp-block-woocommerce-products .swiper-button-disabled,
.highlights .swiper-button-disabled{
  opacity:.35 !important; cursor:default !important;
}

/* (opcional) hover para combinar com o tema */
.wc-block-grid .swiper-button-prev:hover,
.wc-block-grid .swiper-button-next:hover,
.wp-block-woocommerce-products .swiper-button-prev:hover,
.wp-block-woocommerce-products .swiper-button-next:hover,
.highlights .swiper-button-prev:hover,
.highlights .swiper-button-next:hover{
  filter: brightness(1.08);
}

/* ========== HERO (2 colunas) ========== */
.home .hero{
  max-width:1280px; margin:48px auto 24px; padding:0 16px;
  display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center;
}
.home .hero .hero-copy h1{ font:700 64px/1.1 "Times New Roman", serif; margin:0 0 14px; }
.home .hero .hero-copy p{ font:400 20px/1.6 "Times New Roman", serif; color:#333; margin:0 0 22px; }
.home .hero .btn{
  display:inline-block; background:#111; color:#fff; padding:12px 20px;
  border-radius:12px; text-decoration:none;
}
.home .hero .btn:hover{ opacity:.9; }
.home .hero .hero-art{
  min-height:360px; border-radius:24px;
  background:linear-gradient(180deg,#f3f4f6,#e7e8eb);
}
@media (max-width:900px){
  .home .hero{ grid-template-columns:1fr; gap:28px; }
  .home .hero .hero-copy h1{ font-size:48px; }
  .home .hero .hero-art{ min-height:280px; }
}

/* ========== SEÇÕES BASE ========== */
.home .home-section{ max-width:1280px; margin:60px auto; padding:0 16px; }
.home .section-head{ text-align:center; margin-bottom:22px; }
.home .section-head h2{ font:700 36px/1 "Times New Roman", serif; margin:0; }
.home .section-head p{ margin:8px 0 0; color:#4a4a4a; }

/* ============================
   NAVEGUE POR CATEGORIA (home-section.cats)
   ============================ */

/* wrapper */
.home-section.cats .cat-slider{
  max-width:1200px; margin:0 auto; padding:0 16px; position:relative;
}

/* viewport e trilha */
.home-section.cats .cat-viewport{ overflow:hidden; width:100%; }
.home-section.cats .cat-track{ list-style:none; margin:0; padding:0; }
.home-section.cats .cat-viewport,
.home-section.cats .cat-track{ height:auto; min-height:0; background:transparent; }

/* Fallback em GRID quando o slick NÃO estiver iniciado */
.home-section.cats .cat-track:not(.slick-initialized){
  display:flex; flex-wrap:wrap; gap:20px; justify-content:center;
}
.home-section.cats .cat-track:not(.slick-initialized) .cat-card{ flex:0 0 calc(16.66% - 20px); } /* 6 por linha */
@media (max-width:1280px){ .home-section.cats .cat-track:not(.slick-initialized) .cat-card{ flex-basis:calc(20% - 20px); } }   /* 5 */
@media (max-width:1024px){ .home-section.cats .cat-track:not(.slick-initialized) .cat-card{ flex-basis:calc(25% - 20px); } }   /* 4 */
@media (max-width:768px){  .home-section.cats .cat-track:not(.slick-initialized) .cat-card{ flex-basis:calc(33.33% - 20px); } } /* 3 */
@media (max-width:560px){  .home-section.cats .cat-track:not(.slick-initialized) .cat-card{ flex-basis:calc(50% - 20px); } }   /* 2 */

/* item */
.home-section.cats .cat-card{ list-style:none; text-align:center; }
.home-section.cats .cat-card__link{ display:block; color:inherit; text-decoration:none; }

/* bolinha */
.home-section.cats .cat-circle{
  width:150px; height:150px; border-radius:999px;
  background:#f2f5f3; box-shadow: inset 0 0 0 10px #eef2f0;
  display:grid; place-items:center; margin:0 auto; overflow:hidden;
}

/* imagem dentro da bolinha */
.home-section.cats .cat-img{
  width:110px; height:110px; object-fit:contain; display:block;
}

/* título */
.home-section.cats .cat-title{ display:block; margin-top:12px; font-weight:700; }

/* setas do carrossel (se usar slick) */
.home-section.cats .cat-arrow{
  position:absolute; top:42%; transform:translateY(-50%);
  width:42px; height:42px; border:0; border-radius:999px;
  background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.08); cursor:pointer;
}
.home-section.cats .cat-prev{ left:-10px; }
.home-section.cats .cat-next{ right:-10px; }
.home-section.cats .slick-track{ display:flex; align-items:stretch; }
.home-section.cats .slick-slide{ padding:0 10px; outline:0; }
.home-section.cats .cat-slider .slick-list{ margin:0 -10px; }

/* ========== DESTAQUES (grid OU carrossel) ========== */
.home .home-section.highlights{
  margin:48px auto; max-width:1200px; padding:0 16px;
}
.home .home-section.highlights .section-head h2{
  font-size:clamp(28px,4vw,44px); text-align:center; margin-bottom:24px; font-weight:800;
}

/* Grid (quando não usar carrossel) */
.home .products-grid{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:24px;
}
@media (max-width:1100px){ .home .products-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:820px){  .home .products-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){  .home .products-grid{ grid-template-columns:1fr; } }

/* Card do produto */
.home .product-card{
  background:#f6f9f7; border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column;
  transition: transform .2s ease, box-shadow .2s ease; height:100%;
}
.home .product-card:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,.06); }
.home .product-thumb{ position:relative; display:block; aspect-ratio:4/3; background:#fff; }
.home .product-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.home .badge-sale{
  position:absolute; top:12px; left:12px; background:#111; color:#fff;
  font-size:12px; letter-spacing:.04em; padding:6px 10px; border-radius:999px;
}
.home .product-info{ padding:14px 16px 18px; }
.home .product-title{ font-size:18px; line-height:1.3; margin:2px 0 8px; }
.home .product-title a{ color:#111; text-decoration:none; }
.home .product-title a:hover{ text-decoration:underline; }
.home .product-price{ margin-bottom:12px; }
.home .product-price .price{ font-size:16px; }
.home .product-price del{ opacity:.65; margin-right:8px; }
.home .product-price ins{ text-decoration:none; font-weight:700; color:#146b5a; }
.home .product-actions .button,
.home .product-actions .add_to_cart_button,
.home .product-actions .ajax_add_to_cart,
.home .product-actions .btn.add-to-cart{
  display:inline-block !important; width:100%; text-align:center; padding:10px 14px;
  border-radius:10px; background:#111; color:#fff !important; font-weight:600;
  border:none; cursor:pointer; transition:filter .2s ease, transform .02s;
}
.home .product-actions .button:hover{ filter:brightness(1.08); }
.home .product-actions .button:active{ transform:translateY(1px); }

/* Evita “imagens finas” nos produtos exibidos na HOME */
.home .woocommerce ul.products li.product a img{
  width:100%; height:auto; aspect-ratio:1/1; object-fit:contain;
}

/* =========================
   HERO – versão limpa/corrigida
   ========================= */

:root{ --wrap:1200px; }

/* ===== HERO — duas colunas reais no section ===== */
section.hero{
  max-width: var(--wrap);
  margin: 40px auto 24px;
  padding: 0 16px;
  display: grid;
  grid-template-columns: minmax(420px, 1.25fr) minmax(420px, 1fr);
  column-gap: 44px;
  align-items: center;
  box-sizing: border-box;
}

/* HERO_INNER não participa do layout (filhos entram no grid do section) */
section.hero .hero_inner{
  display: contents !important;
}

/* Limpeza básica de heranças do tema */
section.hero .hero_copy,
section.hero .hero_media{
  float: none !important;
  clear: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* Texto (coluna 1) */
section.hero .hero_copy{
  grid-column: 1 / 2 !important;
  max-width: clamp(520px, 52vw, 720px);
}
section.hero #hero-title{
  font: 700 clamp(34px, 5.5vw, 120px)/1.03 "Times New Roman", serif;
  margin: 0 0 18px;
}
section.hero #hero-sub{
  font-size: clamp(18px, 1.9vw, 22px);
  margin: 0 0 22px;
  color: #333;
}

/* Mídia (coluna 2) */
section.hero .hero_media{
  grid-column: 2 / 3 !important;
  justify-self: end;
  position: relative;
  border-radius: 26px;
  overflow: hidden;
  background: linear-gradient(#f3f5f8,#e6e8ec);
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
  aspect-ratio: 16 / 10;      /* proporção */
  min-height: 360px;          /* fallback de altura */
}
@supports (aspect-ratio: 1 / 1){
  section.hero .hero_media{ min-height: 0; }
}

/* Imagem sempre cobre o cartão */
section.hero .hero_media img,
section.hero #hero-img{
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ===== Mobile: empilha (imagem abaixo do texto) ===== */
@media (max-width: 900px){
  section.hero{
    grid-template-columns: 1fr;
    gap: 30px;
  }
  section.hero .hero_copy{
    grid-column: 1 / -1 !important;
    max-width: none;
  }
  section.hero .hero_media{
    grid-column: 1 / -1 !important;
    order: 2;
    justify-self: stretch;
    aspect-ratio: 16 / 10;
    min-height: 140px;
  }
}
@media (min-width: 901px){
  section.hero .hero_media img,
  #hero-img{
    opacity: 1 !important;
    visibility: visible !important;
  }
}
