/* ============================================
   Slider da Cotação - Bradesco / Assurê
   Mobile:  360px largura max × 280px altura
   Desktop: 1420px largura max × 570px altura
   ============================================ */

.cotacao-slider-section {
  width: 100%;
  overflow: hidden;
  background: #000;
}

/* ---------- Swiper wrapper ---------- */
.cotacao-swiper {
  width: 100%;
  height: 280px;
  position: relative;
}

@media (min-width: 768px) {
  .cotacao-swiper {
    height: 570px;
  }
}

/* ---------- Slide ---------- */
.cotacao-slide {
  width: 100%;
  height: 100%;
  background-image: var(--bg-mobile);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

@media (min-width: 768px) {
  .cotacao-slide {
    background-image: var(--bg-desktop);
  }
}

/* ---------- Inner (centralizador de largura) ---------- */
.cotacao-slide .slide-inner {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 1420px;
  margin: 0 auto;
}

/* ---------- Link de cobertura total ---------- */
.cotacao-slide .slide-link-cover {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: block;
}

/* ============================================
   Bloco de texto
   ============================================ */
.cotacao-slide .slide-text {
  position: absolute;
  z-index: 5;
  padding: 16px 20px;
  /* max-width controlado via inline style (campo ACF "Largura do Bloco de Texto") */
  max-width: 50%;
}

/* Horizontal */
.cotacao-slide .slide-text.pos-h-left   { left: 5%; right: auto; text-align: left; }
.cotacao-slide .slide-text.pos-h-center { left: 50%; transform: translateX(-50%); text-align: center; }
.cotacao-slide .slide-text.pos-h-right  { right: 5%; left: auto; text-align: right; }

/* Vertical */
.cotacao-slide .slide-text.pos-v-top    { top: 8%; bottom: auto; }
.cotacao-slide .slide-text.pos-v-middle { top: 50%; transform: translateY(-50%); }
.cotacao-slide .slide-text.pos-v-bottom { bottom: 8%; top: auto; }

/* Combinações de centro + meio */
.cotacao-slide .slide-text.pos-h-center.pos-v-middle {
  transform: translate(-50%, -50%);
}

/* Tipografia */
.cotacao-slide .slide-text h2 {
  margin: 0 0 8px;
  font-weight: 700;
  line-height: 1.2;
  font-size: clamp(1rem, 4vw, 2rem);
}

@media (min-width: 768px) {
  .cotacao-slide .slide-text h2 {
    font-size: clamp(1.4rem, 2.5vw, 2.8rem);
  }
}

.cotacao-slide .slide-text p {
  margin: 0;
  line-height: 1.4;
  font-size: clamp(0.85rem, 2.5vw, 1rem);
}

@media (min-width: 768px) {
  .cotacao-slide .slide-text p {
    font-size: clamp(1rem, 1.4vw, 1.3rem);
  }
}

/* ============================================
   Imagem na frente
   --img-offset-h : deslocamento da borda H (padrão 5%)
   --img-offset-v : deslocamento da borda V (padrão 0%)
   Ambos controlados via inline style (campos ACF)
   ============================================ */
.cotacao-slide .slide-front-image {
  position: absolute;
  z-index: 4;
  /* max-width controlado via inline style (campo ACF "Largura da Imagem da Frente") */
  max-width: 40%;
}

.cotacao-slide .slide-front-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* Horizontal — usa --img-offset-h com fallback de 5% */
.cotacao-slide .slide-front-image.pos-h-left   { left: var(--img-offset-h, 5%); right: auto; }
.cotacao-slide .slide-front-image.pos-h-center { left: 50%; transform: translateX(-50%); }
.cotacao-slide .slide-front-image.pos-h-right  { right: var(--img-offset-h, 5%); left: auto; }

/* Vertical — usa --img-offset-v com fallback de 0% */
.cotacao-slide .slide-front-image.pos-v-top    { top: var(--img-offset-v, 0%); bottom: auto; }
.cotacao-slide .slide-front-image.pos-v-middle { top: 50%; transform: translateY(-50%); }
.cotacao-slide .slide-front-image.pos-v-bottom { bottom: var(--img-offset-v, 0%); top: auto; }

/* Combinações — centro + meio */
.cotacao-slide .slide-front-image.pos-h-center.pos-v-middle {
  transform: translate(-50%, -50%);
}

/* ============================================
   Paginação e navegação
   ============================================ */
.cotacao-swiper .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.6);
  opacity: 1;
  transition: background 0.3s;
}

.cotacao-swiper .swiper-pagination-bullet-active {
  background: #fff;
}

.cotacao-swiper .swiper-button-prev,
.cotacao-swiper .swiper-button-next {
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.cotacao-swiper .swiper-button-prev::after,
.cotacao-swiper .swiper-button-next::after {
  font-size: 1.4rem;
}

@media (max-width: 480px) {
  .cotacao-swiper .swiper-button-prev,
  .cotacao-swiper .swiper-button-next {
    display: none;
  }
}