/* Estilo automático para a página: home */
.hero {
  position: relative;
  height: 80svh;
  max-height: 750px;
  margin-top: 82px;

  &.cta {
    height: 64svh;
  }

  img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    filter: brightness(0.85);
  }

  .gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #43235e, #ed6a1b);
    opacity: 0.6;
    /* mix-blend-mode: multiply; */
  }

  @media (max-width: 992px) {
    margin-top: 56px;
  }

  .hero-content {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;

    h2 {
      font-size: 72px;
      color: #fff;
      font-weight: 600;
      line-height: 110%;
      margin: 0;
    }

    p {
      font-weight: 550;
      font-size: 22px;
      line-height: 140%;
      color: #fff;
      margin-top: 32px;
    }

    @media (max-width: 992px) {
      h2 {
        font-size: 24px;
      }

      p {
        font-size: 16px;
      }
    }
  }

  .swiper {
    height: -webkit-fill-available;
    margin-top: 0;

    .swiper-pagination {
      .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
        opacity: 1;
        background-color: #ffffff80;

        &.swiper-pagination-bullet-active {
          background-color: #ffffff;
        }
      }
    }
  }
}

section.filtro {
  /* background-color: #33142A; */
  min-height: 96px;
  align-content: center;
  position: absolute;
  left: 0;
  bottom: -55px;
  z-index: 30;
  width: 100%;

  @media (max-width: 992px) {
    bottom: -210px;
  }

  .navbar {
    background-color: var(--roxo);

    .tab {
      display: flex;
      width: fit-content;
      align-items: center;
      background-color: #e1e3e9;
      padding: 10px 24px;
      border-radius: 50px;
      color: var(--roxo);
      font-size: 16px;
      font-weight: 500;
      cursor: pointer;
      pointer-events: all;
      opacity: 0.8;
      transition: 300ms all ease-in-out;

      &.selected {
        opacity: 1;
      }

      @media (max-width: 768px) {
        font-size: 12px;
        padding: 6px 9px;
        flex: 0 0 30%;
        text-wrap-mode: nowrap;
      }
    }
  }

  p {
    color: var(--creme);
    font-size: 20px;
    font-weight: 500;
    text-wrap-mode: nowrap;
    margin: 0;
    /* margin-right: 16px; */
  }

  .selects {
    select {
      background-color: #e1e3e9;
      border: none;
      border-radius: 8px;
      padding: 8px 14px;
      font-size: 16px;
      color: var(--cinza);
      font-weight: 500;
      /* width: 208px; */
      max-width: 100%;
      /* max-height: 50px; */
      flex: 1;
    }

    a.cta {
      display: flex;
    }
  }
}

section.empreendimentos {
  .swiper {
    padding: 20px 0;

    .swiper-wrapper {
      align-items: baseline;
    }

    .swiper-slide {
      opacity: 0;
      user-select: none;
      transition: 150ms all ease-in-out;

      .card-emp {
        position: relative;
        opacity: 0.75;

        .card-thumb {
          position: relative;
          z-index: 0;
          height: 340px;
          overflow: hidden;

          .badge-holder {
            position: absolute;
            top: 20px;
            left: 28px;
            z-index: 2;

            .badge {
              background-color: #3d1d00;
              height: 36px;
              color: #ffd1a3;
              padding: 0;
              font-size: 16px;
              font-weight: 500;
              z-index: 2;
              display: flex;
              align-items: center;
              border-radius: 80px;

              .holder {
                background-color: #ffd1a3;
                border-radius: 50%;
                padding: 14px 7px;
                position: absolute;
                left: -12px;
                top: 50%;
                transform: translateY(-50%);

                svg path {
                  fill: #3d1d00;
                }
              }

              .outer {
                background-color: #3d1d00;
                height: 36px;
                align-content: center;
                padding-left: 38px;
                padding-right: 16px;
                border-radius: 80px;
              }
            }
          }
        }

        .price {
          width: 100%;
          display: flex;
          justify-content: center;
          align-items: center;
          gap: 8px;
          padding: 16px;
          transition: 300ms all ease-in-out;
          font-size: 18px;

          bold {
            font-size: 24px;
            font-weight: 600;
            line-height: 135%;
          }
        }

        .card-body {
          width: 100%;
          height: 50%;
          padding: 24px;
          z-index: 2;

          display: flex;
          flex-direction: column;
          justify-content: end;
          align-items: center;
          gap: 16px;

          box-shadow: 4px 4px 25px 2px #56596726;
          border-radius: 0 0 15px 15px;

          .title {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 8px;

            .loc {
              display: flex;
              align-items: center;
              gap: 8px;
              padding: 4px 12px;
              border-radius: 5px;
              outline: 0.6px solid #afafaf;
              color: #555866;
            }
          }

          h3 {
            color: #23252f;
            font-weight: 700;
            font-size: 26px;
            line-height: 135%;
          }

          .diferenciais {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 16px;

            .dif {
              flex: 1 1 calc(50% - 8px);
              padding: 14px 26px;
              border-radius: 5px;
              line-height: 16px;
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              gap: 12px;
              color: #555866;
              text-align: center;

              border: 1px solid var(--laranja);
              background-color: #ff6a001a;

              &.renda {
                flex: 2;
                flex-direction: row;
                gap: 16px;
                text-align: start;
                line-height: 110%;
                color: var(--cinza);
                font-size: 14px;

                bold {
                  font-weight: 600;
                  font-size: 22px;
                  line-height: 135%;
                  color: var(--laranja);
                }
              }
            }
          }

          a {
            color: var(--roxo);
          }
        }
      }

      .img-placeholder {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 316px;
        object-fit: cover;
        transition: 500ms all ease-in-out;

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          border-radius: 15px 15px 0 0;
        }
      }

      &.swiper-slide-active {
        opacity: 1;

        .card-emp {
          opacity: 1;

          .price {
            background-color: #ffd1a3;
            color: #3d1d00;
          }
        }

        .img-placeholder {
          height: 340px;
        }
      }

      &.swiper-slide-next {
        opacity: 1;

        .card-emp .price {
          background-color: #d9c8b2;
          color: #3f3d3b;
        }

        .card-emp .card-thumb .badge {
          color: #d9c8b2;

          .outer {
            background-color: #3f3d3b;
          }

          .holder {
            background-color: #d9c8b2;

            svg path {
              fill: #3f3d3b;
            }
          }
        }
      }

      &.swiper-slide-prev {
        opacity: 1;

        .card-emp .price {
          background-color: #ebebff;
          color: #441f5d;
        }

        .card-emp .card-thumb .badge {
          color: #ebebff;

          .outer {
            background-color: #441f5d;
          }

          .holder {
            background-color: #ebebff;

            svg path {
              fill: #441f5d;
            }
          }
        }
      }
    }

    .swiper-pagination {
      position: relative;
      bottom: 0 !important;
      margin-top: 48px;

      .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
        opacity: 1;
        background-color: #a9abb2;

        &.swiper-pagination-bullet-active {
          background-color: #555866;
        }
      }
    }
  }
}

section.simulacao {
  @media (max-width: 992px) {
    background: linear-gradient(to bottom,
        white 0%,
        white 20%,
        var(--roxo) 20%,
        var(--roxo) 98%,
        white 98%,
        white 100%);
  }

  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0 20px 20px 0;
    filter: brightness(0.7);
  }

  .thumb {
    height: 100%;

    svg {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      pointer-events: auto;
      cursor: pointer;
    }
  }

  .table {
    p {
      font-size: 20px;
      font-weight: 500;
      color: #fff;
      margin: 0;

      bold {
        font-size: 20px;
        font-weight: 600;
        background-color: transparent;
        background: none;
        color: #fff;
        border: none;
        padding: 0;
      }
    }
  }
}

section.mcmv {
  .thumb {
    height: 100%;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 25px;
    }
  }

  .tab {
    display: flex;
    border: 1px solid #facfb0;
    border-radius: 10px;
    overflow: hidden;
    flex: 1 1 calc(50% - 8px);

    .holder {
      background-color: #fff1e6;
      border-right: 1px solid #facfb0;
      padding: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 1;
    }

    .content {
      padding: 10px 16px;
      display: flex;
      flex: 4;
      background-color: #fffbfa;

      p {
        margin: 0;
      }
    }
  }

  .table {
    p {
      font-size: 20px;
      font-weight: 500;
      margin: 0;
      color: #23252f;

      bold {
        font-size: 20px;
        font-weight: 600;
        background-color: transparent;
        background: none;
        border: none;
        padding: 0;
        color: var(--laranja);
      }
    }
  }
}

section.blog {
  .swiper {
    padding: 20px 0;

    .swiper-wrapper {
      align-items: baseline;
    }

    .swiper-slide {
      opacity: 0;
      user-select: none;
      transition: 150ms all ease-in-out;

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 15px 15px 0 0;
        transition: 500ms all ease-in-out;
      }

      &.swiper-slide-active {
        opacity: 1;

        .price {
          background-color: #ffd1a3;
        }
      }

      &.swiper-slide-next {
        opacity: 1;

        .price {
          background-color: #d9c8b2;
        }
      }

      &.swiper-slide-prev {
        opacity: 1;

        .price {
          background-color: #ebebff;
        }
      }
    }

    .swiper-pagination {
      position: relative;
      bottom: 0 !important;
      margin-top: 48px;

      .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
        opacity: 1;
        background-color: #a9abb2;

        &.swiper-pagination-bullet-active {
          background-color: #555866;
        }
      }
    }
  }

  .card-blog {
    position: relative;

    .card-thumb {
      position: relative;
      z-index: 0;
      height: 250px;
      overflow: hidden;
    }

    .price {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      padding: 16px;
      transition: 300ms all ease-in-out;
    }

    .card-body {
      width: 100%;
      height: 50%;
      padding: 24px;
      z-index: 2;

      display: flex;
      flex-direction: column;
      justify-content: end;
      align-items: center;
      gap: 24px;

      box-shadow: 4px 4px 25px 2px #56596726;
      border-radius: 0 0 15px 15px;

      .title {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .loc {
          display: flex;
          align-items: center;
          gap: 8px;
        }
      }

      h3 {
        color: #23252f;
        font-weight: 600;
        font-size: 24px;
        line-height: 135%;
      }

      .diferenciais {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 16px;

        .dif {
          flex: 1 1 calc(50% - 8px);
          padding: 22px;
          border-radius: 5px;

          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          gap: 12px;

          text-align: center;

          border: 1px solid var(--laranja);
          background-color: #ff6a001a;

          &.renda {
            flex: 2;
            flex-direction: row;
            gap: 16px;
            text-align: start;
            line-height: 110%;
          }
        }
      }
    }
  }
}

section.video {
  background-color: var(--bg-2);
  padding: 56px 0;

  .swiper {
    padding: 20px 0;

    .swiper-wrapper {
      align-items: baseline;
    }

    .swiper-slide {
      opacity: 0;
      user-select: none;
      transition: 150ms all ease-in-out;

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 15px 15px 0 0;
        transition: 500ms all ease-in-out;
      }

      &.swiper-slide-active {
        opacity: 1;

        .price {
          background-color: #ffd1a3;
        }
      }

      &.swiper-slide-next {
        opacity: 1;

        .price {
          background-color: #d9c8b2;
        }
      }

      &.swiper-slide-prev {
        opacity: 1;

        .price {
          background-color: #ebebff;
        }
      }
    }

    .swiper-pagination {
      position: relative;
      bottom: 0 !important;
      margin-top: 48px;

      .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
        opacity: 1;
        background-color: #a9abb2;

        &.swiper-pagination-bullet-active {
          background-color: #555866;
        }
      }
    }
  }

  .card-video {
    position: relative;

    .card-thumb {
      position: relative;
      z-index: 0;
      height: 250px;
      overflow: hidden;

      img {
        filter: brightness(0.5);
      }

      svg {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        pointer-events: auto;
        cursor: pointer;
      }
    }

    .price {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      padding: 16px;
      transition: 300ms all ease-in-out;
    }

    .card-body {
      width: 100%;
      height: 50%;
      padding: 24px;
      z-index: 2;

      display: flex;
      flex-direction: column;
      justify-content: end;
      align-items: center;
      gap: 24px;

      box-shadow: 0px 4px 4px 0px #00000014;
      border-radius: 0 0 15px 15px;
      border: 1px solid #E4E4E4;
      background-color: transparent;

      .title {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .loc {
          display: flex;
          align-items: center;
          gap: 8px;
        }
      }

      h3 {
        color: #23252f;
        font-weight: 600;
        font-size: 24px;
        line-height: 135%;
      }

      .diferenciais {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 16px;

        .dif {
          flex: 1 1 calc(50% - 8px);
          padding: 22px;
          border-radius: 5px;

          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          gap: 12px;

          text-align: center;

          border: 1px solid var(--laranja);
          background-color: #ff6a001a;

          &.renda {
            flex: 2;
            flex-direction: row;
            gap: 16px;
            text-align: start;
            line-height: 110%;
          }
        }
      }
    }
  }
}

section.depoimentos {
  .swiper {
    padding: 20px 0;

    .swiper-slide {
      opacity: 0;
      transition: 50ms all ease-in-out;

      &.swiper-slide-next {
        opacity: 1;
      }

      &.swiper-slide-active {
        opacity: 1;
      }

      &.swiper-slide-prev {
        opacity: 0;
      }
    }
  }

  .card-depo {
    box-shadow: 6px 6px 25px 2px #56596726;

    .depo-info {
      h3 {
        font-size: 16px;
        font-weight: 600;
        color: var(--creme);
        margin: 0;
      }

      p {
        font-size: 14px;
        font-weight: 400;
        color: #e1e3e9;
        margin: 0;
      }
    }
  }
}

@media (max-width: 992px) {
  section.filtro {
    .selects {
      select {
        flex: 1 1 calc(50% - 10px);
      }

      a.cta {
        width: 100%;
        justify-content: center;
      }
    }
  }

  section.empreendimentos {
    .empreendimento-card {
      .diferenciais {
        .card-difs {
          width: 100%;
        }
      }
    }
  }

  /* section.simulacao {
        background-color: inherit;
        display: flex;
        flex-direction: column;

        img.destaque {
            width: 100%;
        }

        .content {
            position: relative;

            h2 {
                color: #472135;
            }

            a.cta {
                background-color: #472135;
                color: #F1E7D9;
            }

            .swiper-slide {
                padding: 28px;
            }

            .swiper-button-prev,
            .swiper-button-next {
                position: relative;
                left: auto;
                right: auto;
                top: auto;
                height: 50px;
                width: 50px;
                color: #FFF;

                &::after {
                    padding: 20px;
                    background-color: #C8AC78;
                    border-radius: 40px;
                    aspect-ratio: 1 / 1;
                    font-size: 20px;
                    line-height: 0;
                    align-content: center;
                }
            }
        }

        .bg-logo {
            display: none;
        }
    } */
}