* {
  font-family: "Inter", sans-serif;
}

:root {
  --amarelo: #cb821f;
  --preto: #1b1b1a;
  --cinza: #4a4a4a;
  --branco: #f5f3f0;
  --sombra: 4px 4px 20px 2px #56596759;
}

.form-control:focus {
  box-shadow: none;
}

.btn-padrao-amarelo {
  color: var(--amarelo);
  font-size: 16px;
  font-weight: 500;
  border-radius: 6px;
  border: 1px solid var(--amarelo);
  padding: 10px 16px;
  transition: 300ms all ease-in-out;

  img {
    transform: rotate(-45deg);
    transition: 300ms all ease-in-out;
    margin-left: 8px;
  }

  &:hover {
    color: var(--branco);
    background-color: var(--amarelo);
    transition: 300ms all ease-in-out;

    img {
      transform: rotate(0deg);
      filter: invert(100%) sepia(7%) saturate(2%) hue-rotate(153deg)
        brightness(500%) contrast(100%);
    }
  }
}

.btn-padrao-branco {
  color: var(--branco);
  font-size: 16px;
  font-weight: 500;
  border-radius: 6px;
  border: 1px solid var(--branco);
  padding: 10px 16px;

  img {
    transform: rotate(-45deg);
    transition: 300ms all ease-in-out;
    margin-left: 8px;
  }

  &:hover {
    color: var(--branco);
    background-color: var(--amarelo);
    transition: 300ms all ease-in-out;

    img {
      transform: rotate(0deg);
      filter: invert(100%) sepia(7%) saturate(2%) hue-rotate(153deg)
        brightness(500%) contrast(100%);
    }
  }
}

.btn-padrao-ativo {
  color: var(--branco) !important;
  font-size: 16px;
  font-weight: 500;
  border-radius: 6px;
  border: 1px solid var(--amarelo);
  padding: 16px 32px;
  transition: 300ms all ease-in-out;
  background-color: var(--amarelo);

  img {
    transform: rotate(-45deg);
    transition: 300ms all ease-in-out;
    margin-left: 8px;
  }

  &:hover {
    color: var(--branco);
    background-color: var(--amarelo);
    transition: 300ms all ease-in-out;

    img {
      transform: rotate(0deg);
    }
  }
}

h1 {
  color: var(--branco);
  font-size: 64px;
  font-weight: 700;
  line-height: 110%;

  span {
    color: var(--amarelo);
  }
}

h2 {
  color: var(--preto);
  font-size: 40px;
  font-weight: 600;
  line-height: 120%;

  span {
    color: var(--amarelo);
    font-weight: 700;
  }
}

header {
  position: relative;
  margin-bottom: -120px;
  z-index: 1100;
  background: rgba(18, 18, 18, 0.6);

  .navbar-collapse li {
    display: flex;
    align-items: center;

    .nav-link {
      color: rgba(245, 243, 240, 0.8) !important;
      font-size: 16px;
      font-weight: 500;
      transition: 300ms all ease-in-out;
      line-height: 100px;

      &:hover {
        color: var(--amarelo) !important;
      }
    }
  }
  .nav-efeito {
    line-height: 20px;
    margin: 0 4px;
    display: flex;
    justify-content: center;
    position: relative;

    &:after {
      content: "";
      height: 3px;
      width: 0;
      background: var(--amarelo);
      position: absolute;
      bottom: 0px;
      transition: all 0.25s;
    }
  }
  .nav-efeito:hover::after {
    width: calc(100% - 20px);
  }

  .navbar-expand-xxl .navbar-nav {
    display: flex;
    align-items: center;
  }

  .marg-l-8 {
    margin-left: 8px;
  }

  .mobile-actions {
    gap: 12px;
  }

  .navbar-toggler {
    padding: 0;
    border: 0;
    box-shadow: none !important;

    .menu {
      width: 26px;
    }
  }

  .btn-insta-menu {
    width: 40px;
    height: 40px;
    border-radius: 80px;
    /* border: solid 1px var(--branco); */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 300ms all ease-in-out;

    img {
      width: 18px;
    }

    &:hover {
      border-color: var(--amarelo);
      background-color: var(--amarelo);
    }
  }

  .btn-close-menu {
    display: none;
    position: absolute;
    top: 100px;
    right: 24px;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    padding: 0;
    z-index: 1;

    span {
      position: absolute;
      top: 50%;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: var(--branco);

      &:first-child {
        transform: rotate(45deg);
      }

      &:last-child {
        transform: rotate(-45deg);
      }
    }
  }
}

/* MENU MOBILE/TABLET - TELA CHEIA COM FADE */
@media (max-width: 1399.98px) {
  h1 {
    font-size: 40px;
  }
  h2 {
    font-size: 32px;
  }
  header {
    padding: 20px 0;
    border-bottom: solid 2px var(--branco);
  }

  body:has(#navbarSupportedContent.show) {
    overflow: hidden;
  }

  header .btn-close-menu {
    display: block;
  }

  #navbarSupportedContent {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    background-color: var(--preto);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
      opacity 400ms ease-in-out,
      visibility 400ms ease-in-out;
    z-index: 1050;
    padding: 80px 32px 40px;
    overflow-y: auto;
    margin-left: 0 !important;
  }

  #navbarSupportedContent.collapsing {
    transition:
      height 0s,
      opacity 400ms ease-in-out,
      visibility 400ms ease-in-out !important;
  }

  #navbarSupportedContent.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  #navbarSupportedContent .alt-menu {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    gap: 8px;
  }

  #navbarSupportedContent .alt-menu .nav-item {
    margin: 0 !important;
    width: 100%;
    text-align: center;
  }

  #navbarSupportedContent li .nav-link {
    line-height: 140%;
    font-size: 20px;
    margin: 8px 0;
  }

  #navbarSupportedContent .d-flex {
    flex-direction: row;
    align-items: center;
    width: 100%;
    margin: 0 !important;
    gap: 8px;

    .social-menu,
    .social-central {
      width: 100%;
      margin-top: 24px;

      a {
        display: block;
        text-align: center;
      }
    }

    .marg-l-8 {
      margin-left: 0;
    }
  }
}

#banner {
  .swiper-slide {
    position: relative;
    overflow: hidden;
    min-height: 700px;
    display: flex;
    align-items: center;

    &::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(
        0deg,
        rgba(10, 10, 10, 0.85) 13.75%,
        rgba(10, 10, 10, 0.5) 61.57%,
        rgba(10, 10, 10, 0) 83.78%
      );
      mix-blend-mode: multiply;
      z-index: 2;
      pointer-events: none;
    }
  }

  .img-banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
  }

  .img-banner-mobile {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    display: none;
  }

  .container {
    position: relative;
    z-index: 3;
  }
}

#blog {
  .card-blog {
    .moldura {
      overflow: hidden;
      border-radius: 25px 25px 0 0;

      .img-blog {
        width: 100%;
        object-fit: cover;
        height: 250px;
        border-radius: 25px 25px 0 0;
        transition: transform 800ms ease-in-out;
      }
    }

    &:hover {
      .moldura .img-blog {
        transform: scale(1.08);
      }
    }

    .info-blog {
      border-radius: 0 0 25px 25px;
      padding: 24px;
      background: #1b1b1a;

      .cat-data {
        display: flex;
        justify-content: space-between;

        .categoria {
          color: var(--amarelo);
          font-size: 12px;
          font-weight: 500;
        }
        .data {
          color: #c8c8c8;
          font-size: 12px;
          font-weight: 500;
        }
      }
      h4 {
        color: var(--branco);
        font-size: 20px;
        font-weight: 600;
        line-height: 160%;
        min-height: 90px;
      }

      .btn-blog {
        color: var(--amarelo) !important;
        font-size: 14px;
        font-weight: 500;
        line-height: 160%;

        img {
          transform: rotate(-45deg);
          transition: 300ms all ease-in-out;
          margin-left: 8px;
        }
      }

      &:hover {
        transition: 300ms all ease-in-out;

        img {
          transform: rotate(0deg);
        }
      }
    }
  }
}

.myBlog .swiper-wrapper {
  padding-bottom: 30px;
}

#faixa {
  padding: 32px 0;
  border-top: 1px solid #282b2d;
  border-bottom: 1px solid #282b2d;
  background: #161616;

  .swiper-wrapper {
    transition-timing-function: linear !important;
    will-change: transform;
  }

  .item-faixa {
    text-align: center;
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;

    .nome-faixa {
      color: rgba(245, 243, 240, 0.8);
      font-size: 1.7rem;
      font-weight: 700;
      line-height: 160%;
      margin: 0;

      img {
        margin-left: 10%;
      }
    }

    /* &:after {
      background-color: #c58938;
      background-size: auto;
      display: inline-block;
      width: 16px;
      height: 16px;
      content: "";
      right: 0;
      top: 16px;
      border-radius: 16px;
      position: absolute;
      z-index: 0;
    } */
  }
}

.bullet-faixa {
  width: 20px;
  height: 20px;
  background: #ca811f;
  border-radius: 50%;
}

footer {
  padding: 60px 0 0;
  background-color: var(--preto);

  .central {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  h5 {
    color: rgba(245, 243, 240, 0.8);
    font-size: 14px;
    font-weight: 600;
    line-height: 160%;
    letter-spacing: 1.4px;
    margin-bottom: 24px;
    text-transform: uppercase;
  }

  .contato-footer {
    padding: 0;
    margin: 0;

    li {
      list-style-type: none;
      color: rgba(245, 243, 240, 0.8);
      font-size: 16px;
      font-weight: 500;
      line-height: 160%;
      margin-bottom: 14px;
      transition: 300ms all ease-in-out;

      img {
        margin-right: 8px;
      }

      &:hover {
        color: var(--amarelo);
      }
    }
  }

  .tit-inst-footer {
    padding: 0 0 0 30px;
  }

  .inst-footer {
    padding: 0 0 0 30px;
    margin: 0;
    position: relative;

    li {
      list-style-type: none;
      color: rgba(245, 243, 240, 0.8);
      font-size: 16px;
      font-weight: 500;
      line-height: 160%;
      margin-bottom: 14px;
      transition: 300ms all ease-in-out;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: solid 1px #303030;
      padding-bottom: 18px;

      img {
        transform: rotate(-45deg);
        transition: 300ms all ease-in-out;
        margin-left: 8px;
      }

      &:hover {
        color: var(--amarelo);
        transition: 300ms all ease-in-out;

        img {
          transform: rotate(0deg);
          filter: invert(36%) sepia(22%) saturate(1496%) hue-rotate(353deg)
            brightness(81%) contrast(96%);
        }
      }
    }

    &:after {
      background-color: #303030;
      background-size: auto;
      display: inline-block;
      width: 1px;
      height: 111%;
      content: "";
      top: 0px;
      left: -10px;
      position: absolute;
      z-index: 0;
    }
  }

  hr {
    border: solid 1px #303030;
  }

  .copy {
    color: rgba(245, 243, 240, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 160%;

    span {
      color: var(--amarelo);
    }

    .link-politica {
      color: rgba(245, 243, 240, 0.8);
      font-size: 14px;
      font-weight: 500;
      line-height: 160%;
      text-decoration-line: underline;
    }
  }
}

#sobre {
  background-color: var(--preto);
  position: relative;
  z-index: 1;

  .swiper-wrapper {
    justify-content: center;
  }

  .img-box-sobre {
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 24px;
  }

  .box-sobre {
    border-radius: 32px;
    background: var(--branco);
    padding: 60px;
    margin-top: -40px;

    .text-dest {
      color: var(--cinza);
      font-size: 18px;
      font-weight: 500;
      line-height: 160%;
    }
    .text {
      color: var(--cinza);
      font-size: 16px;
      font-weight: 400;
      line-height: 160%;
    }
    .titulo-numeros {
      color: var(--cinza);
      text-align: center;
      font-size: 18px;
      font-weight: 500;
      line-height: 120%;
      letter-spacing: 1.8px;
      text-transform: uppercase;
      margin: 50px 0 30px;
    }
  }

  .card-numeros {
    border-radius: 16px;
    background: #1b1b1a;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 150px;

    .numero {
      color: var(--branco);
      font-size: 24px;
      font-weight: 700;
      line-height: 120%;
      margin: 16px 0px 8px 0;
    }

    .text-numero {
      color: #c6c0b8;
      font-size: 14px;
      font-weight: 500;
      line-height: 120%;
      margin: 0;
    }
  }

  .swiper-pagination-bullet {
    border-radius: 80px;
    background: var(--cinza);
    width: 30px;
    opacity: 1;
    height: 5px;
  }
  .swiper-pagination-bullet-active {
    background: var(--amarelo);
  }
}

#cabecalho {
  min-height: 600px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;

  .filtro-cabecalho {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background: linear-gradient(163deg, rgba(10, 10, 10, 0.85) 13.75%, rgba(10, 10, 10, 0.50) 61.57%, rgba(10, 10, 10, 0.00) 83.78%); */
    background: linear-gradient(
      rgba(10, 10, 10, 0.85) 26.75%,
      rgba(10, 10, 10, 0.5) 100%,
      rgba(10, 10, 10, 0) 83.78%
    );
    mix-blend-mode: multiply;
    z-index: 1;
    pointer-events: none;
  }

  .container {
    position: relative;
    z-index: 2;
  }

  .migalhas {
    display: flex;
    padding: 0;
    margin: 0 0 30px 0;
    flex-direction: row;
    align-items: center;
    justify-content: center;

    li {
      color: var(--branco);
      font-size: 14px;
      font-weight: 400;
      list-style-type: none;

      img {
        margin: 0 10px 0 8px;
      }
    }

    .destaque {
      color: var(--amarelo);
      font-style: 500;
    }
  }

  h1 {
    color: #f5f3f0;
    font-weight: 700;
  }
}

/* ELEMENTOS ESPALHADOS PELO SITE */
.subtitulo {
  color: var(--amarelo);
  font-size: 14px;
  font-weight: 500;
}
.barra {
  height: 2px;
  width: 88px;
  background-color: var(--amarelo);
  margin: 20px 0 30px;
}
.ciclo-topo {
  position: absolute;
  right: 0;
  top: -60px;
  border: solid 1px var(--branco);
  border-radius: 30px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 300ms all ease-in-out;

  &:hover {
    border: solid 1px var(--amarelo);
    background-color: var(--amarelo);
  }
}
/* FIM ELEMENTOS ESPALHADOS PELO SITE */

/* TABLET */
@media (min-width: 768px) and (max-width: 1024px) {
  h1 {
    font-size: 40px;
  }
  h2 {
    font-size: 32px;
  }
  header {
    padding: 20px 0;
    border-bottom: solid 2px var(--branco);
  }
}

/* MOBILE */
@media all and (max-width: 767px) {
  #banner {
    .img-banner {
      display: none;
    }

    .img-banner-mobile {
      display: block;
    }
  }

  h1 {
    font-size: 40px;
  }

  h2 {
    font-size: 32px;
  }

  .btn-padrao-amarelo {
    display: block;
    width: 100%;
    padding: 16px;
    text-align: center;
  }

  .btn-padrao-branco {
    display: block;
    width: 100%;
    padding: 16px;
    text-align: center;
  }

  .btn-padrao-ativo {
    display: block;
    width: 100%;
    padding: 16px;
    text-align: center;
  }

  header {
    padding: 20px 0;
    border-bottom: solid 2px var(--branco);
  }

  footer {
    .central {
      margin: 30px 0;
    }
    .tit-inst-footer {
      padding: 0;
      margin: 30px 0px 0 0px;
    }
    .inst-footer {
      padding: 0;
      margin: 30px 0px 0 0px;
    }
    .copy {
      text-align: center;
    }
  }

  #cabecalho {
    min-height: 500px;
  }
}
/* Impede que o scrollIntoView do Fancybox (ao fechar) desloque o conteúdo interno dos sliders */
.swiper {
  overflow: hidden;
  overflow: clip;
}