/* ==========================================================================
   Cross-browser stability layer
   Loaded last to keep the landing consistent in Chromium-based browsers,
   Firefox, Safari, and Linux deployments.
   ========================================================================== */

.header-section,
.navbar-fixed-top.header-section,
#cookie-banner {
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  backdrop-filter: blur(18px) saturate(1.2);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .header-section,
  .navbar-fixed-top.header-section,
  #cookie-banner {
    background: rgba(255, 255, 255, 0.98) !important;
  }
}

.header-section {
  contain: layout paint;
}

.header-section .navbar,
.header-section .container,
.menu-wrap,
.mainmenu,
.header-section ul.nav {
  min-width: 0;
}

.header-section ul.nav {
  justify-content: flex-end;
}

.header-section ul.nav > li > a {
  text-transform: none;
}

#home.initial-carousel {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  background: #cfecef !important;
  height: 100vh !important;
  height: 100svh !important;
  min-height: 560px;
}

#home.initial-carousel .initial-carousel-slide {
  min-width: 100%;
  background: #cfecef !important;
}

#home.initial-carousel .initial-carousel-media {
  min-width: 100%;
  height: 100% !important;
}

#home.initial-carousel .initial-carousel-slide img,
#home.initial-carousel .initial-carousel-slide video {
  display: block;
  max-width: none;
}

#home.initial-carousel .initial-carousel-slide .initial-carousel-gif {
  object-fit: contain !important;
  object-position: center center !important;
  background: #cfecef !important;
  max-width: 100% !important;
}

.about-wrap,
.cards-price .content-wrapper,
.cards-part-mes,
.cards-part-tri,
.cards-part-ano,
.footer-content {
  min-width: 0;
}

.about-heading-container,
.about-content,
.wrapper-audio,
.text-container,
.animated-text,
.phone-about,
.card,
.card-price,
.faq-question,
.faq-answer {
  min-width: 0;
}

.animated-text,
.card p,
.card-price,
.faq-question,
.faq-answer,
.portal-top h2,
.portal-top-right p,
.titulo-mensagem,
.footer-content {
  overflow-wrap: anywhere;
}

.phone-about {
  display: flex;
  justify-content: center;
}

.phone-content,
.img-phone {
  width: 100%;
}

.portal-container {
  width: 100%;
  overflow: hidden !important;
}

.portal-top {
  width: 100%;
}

.portal-center {
  left: auto !important;
  right: auto !important;
}

.portal-mockup {
  position: relative;
}

.portal-video {
  display: block;
  object-fit: cover;
}

.carousel-container {
  min-width: 0;
}

.carousel-wrapper {
  min-width: 0;
  will-change: transform;
}

.carousel-item {
  min-width: 0;
  overflow: visible;
}

.carousel-item img {
  max-width: 100%;
}

#cookie-banner {
  z-index: 10000;
}

@media (min-width: 768px) and (max-width: 1200px) {
  .navbar-brand.logo-com-nome,
  .logo-com-nome {
    min-width: 150px !important;
  }

  .nome-logo {
    font-size: 22px !important;
  }

  .header-section ul.nav > li > a,
  .navbar-fixed-top.header-section ul.nav > li > a {
    padding-left: 5px !important;
    padding-right: 5px !important;
    font-size: 10px !important;
  }
}

@media (max-width: 991px) {
  .menu-wrap {
    display: none !important;
  }

  .header-section .slicknav_menu {
    display: block !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    margin-left: auto;
    width: auto !important;
  }

  .header-section .slicknav_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 999px;
    background: rgba(15, 97, 52, 0.9) !important;
  }

  .header-section .slicknav_nav {
    position: fixed;
    top: var(--header-height, 74px);
    left: 12px;
    right: 12px;
    width: auto;
    max-height: calc(100vh - var(--header-height, 74px) - 24px);
    overflow-y: auto;
    border-radius: 14px;
    padding: 8px;
  }

  .header-section .slicknav_nav a {
    color: var(--onzap-green-dark, #0f6134) !important;
    font-size: 14px;
    line-height: 1.3;
  }

  #home.initial-carousel {
    height: 72vh !important;
    height: 72svh !important;
    min-height: 430px;
  }

  .about-wrap {
    flex-wrap: nowrap;
  }

  .phone-about {
    width: min(100%, 390px) !important;
  }
}

@media (max-width: 767px) {
  :root {
    --onzap-pad-x: 18px;
  }

  .navbar-brand.logo-com-nome,
  .logo-com-nome {
    min-width: 0 !important;
  }

  .logo-com-nome img {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
  }

  .nome-logo {
    font-size: 22px !important;
  }

  #home.initial-carousel {
    height: 64vh !important;
    height: 64svh !important;
    min-height: 390px;
  }

  .initial-carousel-button {
    width: 42px !important;
    height: 42px !important;
  }

  .about-section .container-fluid,
  .card-section,
  .container-flux-phone,
  #products,
  .price-section,
  .faq-section {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  #about .wrapper-audio {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
  }

  #about .global-sound-waves {
    display: none;
  }

  .phones-container-flux {
    transform: none !important;
  }

  .portal-top {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .portal-center {
    width: calc(100% - 36px) !important;
  }

  .card-price {
    width: 100%;
    max-width: 360px;
  }

  #cookie-banner {
    width: calc(100% - 24px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .carousel-wrapper,
  .initial-carousel-slide {
    transition: none !important;
  }
}