/* ===============================
   BASE SWIPER
=============================== */

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-wrapper {
  display: flex;
}

.swiper-slide {
  flex-shrink: 0;
}

/* ===============================
   BANNER
=============================== */

.home-banner {
  position: relative;
  width: 100%;
}

/* 🔥 Altura mais comercial */
.banner-slide {
  height: 420px; /* Desktop menor */
  position: relative;
  overflow: hidden;
}

.banner-slide picture,
.banner-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

/* 🔥 REMOVIDO overlay escuro */

/* ===============================
   LINK CLICÁVEL
=============================== */

.banner-link {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  color: inherit;
  text-decoration: none;
}

/* ===============================
   CONTEÚDO (caso use)
=============================== */

.banner-content {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 6%;
  transform: translateY(-50%);
  max-width: 520px;
  color: #fff;
}

/* ===============================
   TAGS DO BANNER
=============================== */

.banner-tag {
  display: inline-block;
  padding: 8px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: 12px;
  color: #fff;
}

/* PROMOÇÕES */
.banner-tag-promocao {
  background: #f97316;
}

/* INSPIRAÇÕES */
.banner-tag-inspiracoes {
  background: #15803d;
}

/* INSTITUCIONAL */
.banner-tag-institucional {
  background: #7c4a1d;
}

/* ===============================
   TEXTO
=============================== */

.banner-content h2 {
  font-size: 2rem;
  line-height: 1.15;
  margin-bottom: 10px;
}

.banner-subtitle {
  margin-top: 6px;
  font-size: 16px;
  line-height: 1.3;
  color: #e5e7eb;
  max-width: 520px;
}

.banner-price {
  margin-top: 10px;
  font-size: 24px;
  font-weight: 700;
  color: #22c55e;
}

/* ===============================
   BOTÃO
=============================== */

.banner-btn {
  display: inline-block;
  margin-top: 14px;
  padding: 12px 24px;
  background: #2f7d32;
  color: #fff;
  border-radius: 8px;
  font-weight: 600;
  transition: 0.3s;
}

.banner-btn:hover {
  background: #256628;
}

/* ===============================
   MOBILE OTIMIZADO
=============================== */

@media (max-width: 768px) {

  .banner-slide {
    height: 360px;
  }

  .banner-content {
    left: 50%;
    top: 58%;
    transform: translate(-50%, -50%);
    text-align: center;
    padding: 0 18px;
    max-width: 100%;
  }

  .banner-tag {
    margin-bottom: 8px;
    padding: 6px 14px;
    font-size: 12px;
  }

  .banner-content h2 {
    font-size: 20px;
    line-height: 1.1;
    margin-bottom: 6px;
  }

  .banner-subtitle {
    font-size: 14px;
    margin-bottom: 6px;
  }

  .banner-price {
    font-size: 18px;
  }

  .banner-btn {
    padding: 10px 18px;
    font-size: 14px;
  }
}

/* ===============================
   OVERRIDE SWIPER (CORES)
=============================== */

.home-banner .swiper-button-prev,
.home-banner .swiper-button-next {
  color: #2f7d32 !important;
}

.home-banner .swiper-button-prev:hover,
.home-banner .swiper-button-next:hover {
  color: #1b5e20 !important;
}

.home-banner .swiper-pagination-bullet {
  background-color: #c8e6c9 !important;
  opacity: 1 !important;
}

.home-banner .swiper-pagination-bullet-active {
  background-color: #2f7d32 !important;
}
