#section_categories {
  padding: 5rem 1rem;

  & .grid_categories {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 1.25rem;
    column-gap: 0.625rem;
  }
}

#section-products {
  padding: 4rem 2rem 4.875rem;
  text-align: center;
  border-top: 1px solid #eaeaea;

  & h2 {
    font-weight: 500;
    font-size: 2rem;
  }

  & .product_card {
    background-color: #fff;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
    border-radius: 10px;

    padding: 2rem 1.625rem 1.75rem;

    height: 100%;

    & img {
      width: 100%;
      height: 200px;
      margin-bottom: 2.25rem;
      object-fit: contain;
    }

    & .product_title {
      font-weight: 500;
      font-size: 1.5rem;
      margin-bottom: 1.375rem;
      height: 100px;
    }

    & .btn_product {
      display: block;
      max-width: 15rem;
      margin: 0 auto;
      background-color: #b9b9b9;
      border-radius: 3px;
      padding: 1.25rem 3.75rem;
      font-size: 1rem;
      color: #fff;
      transition: background-color 0.3s ease; /* suave */
    }

    & .btn_product:hover {
      background-color: #1c7810; /* verde */
    }
  }

  & .productsSwiper {
    padding-top: 3.5rem;
    padding-bottom: calc(3.5rem + 1rem); /* padding + tamanho do bullet*/
  }

  & .swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    bottom: 0;

    & .swiper-pagination-bullet {
      width: 1rem;
      height: 1rem;
      background: #d9d9d9;
      opacity: 1;
      margin: 0;
    }

    & .swiper-pagination-bullet-active {
      background: var(--green-100);
    }
  }
}

.tax-categoria_produto #section-products,
.page-id-282 #section-products {
  padding: 8rem 2rem 4.875rem;

  & .category_name {
    margin-bottom: 2rem;
  }
}

#section_banner {
  background-color: #2e6543;
  color: var(--white-200);
  padding: 8rem 1rem;

  & .banner_box_image {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;

    & .galeria {
      display: flex;
      gap: 8px;

      & img {
        width: 110px;
        height: 110px;
        object-fit: cover;
        cursor: pointer;
        opacity: 0.7;
        transition: opacity 0.2s;

        &:hover,
        &.active {
          opacity: 1;
          border: 2px solid var(--green-100);
        }
      }
    }

    & .destaque {
      & img {
        width: 100%;
        height: 358px;
        object-fit: cover;
      }
    }
  }

  & .banner_content {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-top: 2rem;
    text-align: center;

    & .banner_header {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;

      & h1 {
        font-weight: bold;
        font-size: 3.125rem;
        line-height: 1.08;
      }

      & span {
        font-weight: bold;
        font-size: 2rem;
        line-height: 1.08;
      }
    }

    & .banner_info {
      display: flex;
      flex-direction: column;
      gap: 1rem;

      & p {
        font-weight: 500;
        font-size: 1.125rem;
      }
    }
  }
}

#section_informacoes {
  /* padding: 35px 194px 80px 312px; */
  display: flex;
  flex-direction: column;
  gap: 3.25rem;

  & .nav-tabs {
    gap: 1rem;
    border-bottom: 1px solid #1d791133;

    & .nav-link {
      font-size: 1.5rem;
      color: var(--gray-200);
      border-radius: 0;

      &.active {
        background-color: var(--green-300);
        color: var(--white-200);
        border-color: var(--green-300);
      }
    }
  }

  & p {
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.4;
    margin-bottom: 40px;

    & strong {
      color: var(--green-300);
    }
  }

  & h2 {
    font-weight: bold;
    font-size: 2rem;
    color: var(--green-300);
    margin-bottom: 1.5rem;
  }

  & #TabinfoContent {
    padding: 0 1rem;
  }

  & #description {
    & > div {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 70px;
    }

    & .description_content {
      max-width: 632px;
    }

    & .description_image {
      padding: 10px;

      & img {
        width: 100%;
        height: auto;
        object-fit: cover;
      }
    }
  }

  & #description ul,
  #specifications ul {
    display: flex;
    flex-direction: column;
    gap: 1rem;

    font-size: 1rem;
  }

  & #video {
    & iframe {
      width: 100%;
      height: 300px;
    }
  }

  & #manuals {
    & .card_manual {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color: var(--white-200);
      border: 1px solid var(--gray-100);
      border-radius: 10px;
      padding: 1rem 2rem;

      & > div {
        display: flex;
        align-items: center;
        gap: 12px;

        & i {
          font-size: 2rem;
        }

        & h4 {
          font-weight: bold;
          font-size: 1rem;
        }
      }

      & a {
        &:hover {
          color: var(--green-300);
        }
      }
    }
  }
}

#section_proposta {
  /* background-image: url("/wp-content/uploads/2025/11/bkg_proposta-O.webp");
  background-repeat: no-repeat;
  background-size: cover; */
  background-color: #2e6543;
  color: var(--white-200);
  padding: 2rem;
  /* padding-block: 100px; */

  & .box_content {
    text-align: center;
    & h2 {
      font-weight: bold;
      font-size: 38px;
      line-height: 1.08;
      margin-bottom: 1.25rem;
    }

    & > p {
      font-weight: 500;
      font-size: 1.5rem;
      line-height: 1.4;
      margin-bottom: 50px;
    }
  }
}

@media (min-width: 768px) {
  #section_categories {
    /* padding: 3.25rem 7rem 5.75rem; */
    padding: 2rem;

    & .grid_categories {
      grid-template-columns: repeat(4, 1fr);
      gap: 4.25rem;
    }
  }

  #section_informacoes {
    & #video {
      & iframe {
        height: 500px;
      }
    }

    & #manuals {
      & .card_manual {
        & > div {
          & h4 {
            font-size: 1.5rem;
          }
        }
      }
    }
  }
}

@media (min-width: 992px) {
  #section-products {
    padding: 7rem 5rem 9.5rem;

    & .products_title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0;
    }

    & .product_card {
      & .product_title {
        font-size: 1.25rem;
      }
      & .btn_product {
        padding: 1.25rem;
      }
    }

    & .swiper-button-prev {
      left: calc(-1.875rem - 1.375rem);
      color: #d8d8d8;
    }

    & .swiper-button-next {
      right: calc(-1.875rem - 1.375rem);
      color: #d8d8d8;
    }

    & .productsSwiper {
      padding-top: 4.625rem;
    }
  }

  .tax-categoria_produto #section-products,
  .page-id-282 #section-products {
    padding: 3rem 2rem 5rem;
  }

  #section_banner {
    /* padding: 6.25rem 18.75rem 6.25rem 12.5rem; */
    padding: 4rem 12.5rem 4rem;

    & .banner_box_image {
      & .galeria {
        & img {
          width: 133px;
          height: 122px;
        }
      }

      & .destaque {
        & img {
          width: 514px;
          height: 469px;
          object-fit: contain;
        }
      }
    }

    & .banner_content {
      & .banner_header {
        & h1 {
          font-weight: bold;
          font-size: 5rem;
          line-height: 1.08;
        }

        & span {
          font-weight: bold;
          font-size: 2.375rem;
          line-height: 1.08;
        }
      }
    }
  }

  #section_informacoes {
    & .nav-tabs {
      justify-content: center;
    }
  }
}

@media (min-width: 1400px) {
  #section_categories {
    padding: 3.25rem 7rem 5.75rem;
  }

  #section_banner {
    padding: 6.25rem 4rem 6.25rem;

    & .banner_box_image {
      flex-direction: row;

      & .galeria {
        flex-direction: column;
      }
    }

    & .banner_content {
      text-align: start;
    }
  }

  #section_informacoes {
    /* padding: 35px 2rem 80px 312px; */
    padding: 2rem 2rem 4rem;

    & .nav-tabs {
      justify-content: start;
      /* gap: 6.5rem; */
      gap: 3rem;
    }

    & #TabinfoContent {
      padding: initial;
    }

    & #description {
      & > div {
        flex-direction: row;
      }
    }

    & #video {
      & iframe {
        height: 650px;
      }
    }
  }

  #section_proposta {
    background-image: url("/wp-content/uploads/2025/11/bkg_proposta-O.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-color: transparent;

    & .box_content {
      text-align: start;
    }
  }
}

@media (min-width: 1600px) {
  #section-products {
    padding: 7rem 11.5rem 9.5rem;

    & .product_card {
      & .product_title {
        font-size: 1.5rem;
      }
    }
  }

  #section_banner {
    padding: 6.25rem 18.75rem 6.25rem 12.5rem;
  }

  #section_informacoes {
    padding: 35px 200px 80px 312px;
    & #video {
      & iframe {
        height: 800px;
      }
    }
  }
}
/*  */
/* --- 1. ESTILOS GERAIS --- */
.banner_box_image {
  display: flex;
  gap: 15px;
  width: 100%;
}

.galeria-container-custom {
  position: relative;
  overflow: hidden;
}

.item-thumb {
  flex-shrink: 0;
}

.thumb-custom {
  object-fit: contain;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 5px;
  cursor: pointer;
}

.thumb-custom.active {
  border-color: #00b0ff !important;
}

/* --- 2. FORÇAR SCROLL VISÍVEL (O CORAÇÃO DO AJUSTE) --- */

/* Chrome, Safari, Edge e Android */
.galeria-scroll-vertical::-webkit-scrollbar {
  display: block !important;
  background-color: #1a422a !important; /* Cor do trilho (verde escuro) */
}

.galeria-scroll-vertical::-webkit-scrollbar-track {
  background: rgba(
    0,
    0,
    0,
    0.3
  ) !important; /* Fundo do trilho sempre visível */
  border-radius: 10px;
}

.galeria-scroll-vertical::-webkit-scrollbar-thumb {
  background-color: #ffffff !important; /* Azul aceso sempre visível */
  border-radius: 10px;
  border: 1px solid #ffffff; /* Borda branca para destacar no fundo verde */
}

/* Firefox */
.galeria-scroll-vertical {
  scrollbar-width: thin !important;
  scrollbar-color: #ffffff rgba(0, 0, 0, 0.3) !important;
}

/* --- 3. MOBILE (Telas menores que 1399px) --- */
@media (max-width: 1399px) {
  .banner_box_image {
    flex-direction: column-reverse;
    align-items: center;
  }

  .galeria-container-custom {
    width: 100%;
    padding-bottom: 15px; /* Espaço para a barra não cobrir a foto */
  }

  .galeria-scroll-vertical {
    display: flex;
    flex-direction: row;
    gap: 10px;
    overflow-x: scroll !important; /* Força scroll horizontal sempre */
    overflow-y: hidden;
    padding: 10px 5px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  /* Altura da barra no mobile para ficar bem visível */
  .galeria-scroll-vertical::-webkit-scrollbar {
    height: 10px !important;
  }

  .thumb-custom {
    width: 75px;
    height: 75px;
  }

  .destaque img {
    width: 100%;
    max-width: 400px;
    height: auto;
  }
}

/* --- 4. DESKTOP (Telas maiores que 1400px) --- */
@media (min-width: 1400px) {
  .banner_box_image {
    flex-direction: row;
    align-items: flex-start;
    max-height: 500px;
  }

  .galeria-container-custom {
    width: 110px; /* Aumentado um pouco para acomodar a barra ao lado */
  }

  .galeria-scroll-vertical {
    display: flex;
    flex-direction: column;
    height: 500px;
    overflow-y: scroll !important; /* Força scroll vertical sempre */
    overflow-x: hidden;
    gap: 12px;
    padding-right: 12px; /* Espaço para a barra */
    scroll-snap-type: y mandatory;
  }

  .galeria-scroll-vertical::-webkit-scrollbar {
    width: 10px !important; /* Largura da barra no desktop */
  }

  .thumb-custom {
    width: 80px;
    height: 80px;
  }
}
