.elementor-kit-5{--e-global-color-primary:#193129;--e-global-color-secondary:#D1A850;--e-global-color-text:#383838;--e-global-color-accent:#D6EDD6;--e-global-typography-primary-font-family:"Public Sans";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Public Sans";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Public Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:#091310;font-family:"Public Sans", Sans-serif;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   COLE ISSO EM: Elementor > Configurações do Site > CSS Personalizado
   OU em: Aparência > Personalizar > CSS Adicional
   ============================================================ */


/* --- 1. BLOQUEIA SCROLL LATERAL NA PÁGINA TODA --- */
html, body {
  overflow-x: hidden !important;
}


/* --- 2. FAZ A SEÇÃO DO ELEMENTOR NÃO CORTAR O CARROSSEL --- */
.elementor-section,
.elementor-container,
.e-container,
.e-con,
.elementor-column,
.elementor-column-wrap,
.elementor-widget-wrap {
  overflow: visible !important;
}


/* --- 3. O WIDGET DE CARROSSEL VIRA O "CONTROLADOR" DO PEEK --- */
.elementor-widget-media-carousel,
.elementor-widget-testimonial-carousel,
.elementor-widget-reviews,
.elementor-widget-loop-carousel {
  overflow: hidden !important;  /* só aqui corta */
}


/* --- 4. TRILHA INTERNA — mostra slides dos lados --- */
.elementor-widget-media-carousel .swiper-wrapper,
.elementor-widget-testimonial-carousel .swiper-wrapper,
.elementor-widget-reviews .swiper-wrapper,
.elementor-widget-loop-carousel .swiper-wrapper {
  align-items: center !important;
}


/* --- 5. SLIDE INATIVO — menor, escurecido, borda visível --- */
.elementor-widget-media-carousel .swiper-slide,
.elementor-widget-testimonial-carousel .swiper-slide,
.elementor-widget-reviews .swiper-slide,
.elementor-widget-loop-carousel .swiper-slide {
  transform: scale(0.88) !important;
  opacity: 0.5 !important;
  filter: brightness(0.55) !important;
  transition: transform 0.5s ease, opacity 0.5s ease, filter 0.5s ease !important;
  border-radius: 18px !important;
  overflow: hidden !important;
}


/* --- 6. SLIDE ATIVO — destaque total --- */
.elementor-widget-media-carousel .swiper-slide-active,
.elementor-widget-testimonial-carousel .swiper-slide-active,
.elementor-widget-reviews .swiper-slide-active,
.elementor-widget-loop-carousel .swiper-slide-active {
  transform: scale(1) !important;
  opacity: 1 !important;
  filter: brightness(1) !important;
  z-index: 2 !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
  border-radius: 18px !important;
}


/* --- 7. FUNDO ESCURO DA SEÇÃO (igual à foto) --- */
/* Adicione a classe CSS "carousel-section-dark" na sua seção do Elementor */
.carousel-section-dark {
  background-color: #1c1c1c !important;
  padding: 60px 0 !important;
}


/* --- 8. SETAS DE NAVEGAÇÃO --- */
.elementor-widget-media-carousel .elementor-swiper-button,
.elementor-widget-testimonial-carousel .elementor-swiper-button,
.elementor-widget-reviews .elementor-swiper-button,
.elementor-widget-loop-carousel .elementor-swiper-button {
  width: 48px !important;
  height: 48px !important;
  background: rgba(255,255,255,0.1) !important;
  border: 2px solid rgba(255,255,255,0.25) !important;
  border-radius: 50% !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.3s ease, border-color 0.3s ease !important;
  backdrop-filter: blur(6px) !important;
}

.elementor-widget-media-carousel .elementor-swiper-button:hover,
.elementor-widget-testimonial-carousel .elementor-swiper-button:hover,
.elementor-widget-reviews .elementor-swiper-button:hover,
.elementor-widget-loop-carousel .elementor-swiper-button:hover {
  background: rgba(245, 166, 35, 0.35) !important;
  border-color: #f5a623 !important;
}


/* --- 9. DOTS (bolinhas de navegação) --- */
.elementor-widget-media-carousel .swiper-pagination-bullet,
.elementor-widget-testimonial-carousel .swiper-pagination-bullet,
.elementor-widget-reviews .swiper-pagination-bullet,
.elementor-widget-loop-carousel .swiper-pagination-bullet {
  background: rgba(255,255,255,0.3) !important;
  opacity: 1 !important;
  transition: background 0.3s ease, transform 0.3s ease !important;
}

.elementor-widget-media-carousel .swiper-pagination-bullet-active,
.elementor-widget-testimonial-carousel .swiper-pagination-bullet-active,
.elementor-widget-reviews .swiper-pagination-bullet-active,
.elementor-widget-loop-carousel .swiper-pagination-bullet-active {
  background: #f5a623 !important;
  transform: scale(1.4) !important;
}


/* ============================================================
   RESPONSIVO
   ============================================================ */

/* Mobile */
@media (max-width: 767px) {
  .elementor-widget-media-carousel .swiper-slide,
  .elementor-widget-testimonial-carousel .swiper-slide,
  .elementor-widget-reviews .swiper-slide,
  .elementor-widget-loop-carousel .swiper-slide {
    transform: scale(0.85) !important;
    opacity: 0.45 !important;
  }

  .elementor-widget-media-carousel .swiper-slide-active,
  .elementor-widget-testimonial-carousel .swiper-slide-active,
  .elementor-widget-reviews .swiper-slide-active,
  .elementor-widget-loop-carousel .swiper-slide-active {
    transform: scale(1) !important;
    opacity: 1 !important;
  }

  .elementor-widget-media-carousel .elementor-swiper-button,
  .elementor-widget-testimonial-carousel .elementor-swiper-button,
  .elementor-widget-reviews .elementor-swiper-button,
  .elementor-widget-loop-carousel .elementor-swiper-button {
    width: 36px !important;
    height: 36px !important;
  }
}/* End custom CSS */