:root {
  --laranja: #ff6a00;
  --roxo: #441f5d;
  --rosa: #f72d53;
  --creme: #ffeecc;
  --cinza: #555866;
  --titulos: #23252f;
  --bg-1: #f7f5f8;
  --bg-2: #f8f6f5;
  --sombra: 4px 4px 20px 2px #56596759;
}

.loading {
  position: fixed;
  height: 100%;
  width: 100%;
  z-index: 99999999;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  background: rgb(234, 234, 234);
  color: white;
}

html,
body {
  height: 100%;
  margin: 0;
  font-family: "Flama" !important;
  /* font-weight: 500 !important; */
}

p,
ul,
ol {
  margin: 0;
  padding: 0;
}

ol ol,
ul ul,
ul ol,
ol ul {
  margin: 0.4em 0;
}

a:hover,
a:focus,
a:visited,
a:active {
  text-decoration: none;
  color: inherit;
}

a[href],
input[type="submit"],
input[type="image"],
label[for],
select,
button {
  cursor: pointer;
  text-decoration: none;
}

input[type="text"],
textarea {
  display: inline-block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  margin: 0;
  font-family: "Flama";
}

div,
ul,
li,
a,
span,
label,
p {
  font-family: "Flama";
  font-weight: 500;
}

h2 {
  font-size: 40px;
}

section {
  margin-bottom: 72px;

  h2 {
    color: var(--laranja);
    font-weight: 600;
    font-size: 40px;
    line-height: 100%;
  }

  p {
    color: var(--cinza);
    font-size: 18px;
    line-height: 160%;
  }

  @media (max-width: 992px) {
    margin-bottom: 45px;

    h2 {
      font-size: 28px;
    }

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

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  @media (max-width: 992px) {
    padding-right: calc(var(--bs-gutter-x) * 1.6) !important;
    padding-left: calc(var(--bs-gutter-x) * 1.6) !important;
  }
}

bold {
  font-weight: 600;
  background: none;
}

header {
  position: fixed;
  top: auto;
  z-index: 40;
  box-shadow: 0px 4px 6px 3px #5659670f;

  a.cta {
    color: var(--laranja);
    outline: 1px solid var(--roxo);
    font-size: 16px;
    font-weight: 600;
  }

  #buscador {}

  #busca {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    pointer-events: none;
    transition:
      opacity 0.25s ease,
      transform 0.25s ease,
      visibility 0.25s;

    &.active {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      pointer-events: auto;
    }

    h4 {
      color: var(--titulos);
      font-weight: 600;
      font-size: 16px;
      margin-bottom: 20px;
    }

    .badge {
      font-size: 14px;
      font-weight: 500;
      font-family: "Flama";
      padding: 8px 26px;

      &:nth-child(1) {
        color: var(--laranja);
        background-color: #fef1e9;
      }

      &:nth-child(2) {
        color: var(--roxo);
        background-color: #f2ebfc;
      }

      &:nth-child(3) {
        color: var(--rosa);
        background-color: #ffeaee;
      }
    }

    .info {
      h5 {
        color: var(--roxo);
        font-size: 14px;
        font-weight: 600;
        line-height: 100%;
      }
    }
  }

  #menu {
    nav {
      ul {
        list-style: none;
        padding: 0;

        h5 {
          font-size: 16px;
          font-weight: 600;
          margin-bottom: 24px;
          color: var(--laranja);
        }

        li {
          a {
            color: var(--cinza);
            font-size: 16px;
            font-weight: 500;
            line-height: 200%;

            @media (max-width: 992px) {
              color: var(--creme);

              &.active {
                color: var(--laranja);
                border-bottom: 1.5px solid;
              }
            }
          }
        }
      }
    }
  }
}

section.hero {
  position: relative;

  .hero-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

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

    a,
    p {
      color: #fff;
    }
  }

  &.interna {
    margin-top: 60px;
    height: 50svh;

    @media (max-width: 768px) {
      height: 64svh;
      margin-top: 60px;
    }

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

    .hero-content {
      text-align: center;
      top: 0;
      left: 0;
      transform: none;

      a,
      p {
        color: #fff;
      }

      h2 {
        font-size: 64px;
        text-align: start;
        line-height: 110%;

        @media (max-width: 768px) {
          font-size: 32px;
        }
      }

      p {
        margin: 0;
        text-decoration: underline;
      }
    }
  }
}

.swiper-container {
  position: relative;
}

.swiper-controls {
  position: absolute;
  display: flex;
  width: 100%;
  justify-content: space-between;
  top: 50%;

  .swiper-button-prev {
    left: -64px;
  }

  .swiper-button-next {
    right: -64px;
  }

  .swiper-button-prev,
  .swiper-button-next {
    position: relative;
    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;
    }
  }
}

.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;
    }
  }
}

a.cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  gap: 8px;
  border-radius: 80px;
  font-weight: 600;
  background-color: var(--laranja);
  font-size: 16px;
  line-height: 100%;
  padding: 18px 36px;
  color: #fff;

  @media (max-width: 992px) {
    width: 100%;
  }
}

button.cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  gap: 8px;
  border-radius: 80px;
  font-weight: 600;
  background-color: var(--laranja);
  font-size: 16px;
  line-height: 100%;
  padding: 18px 36px;
  color: #fff;

  &.roxo {
    background-color: var(--roxo);
  }
}

.form-label {
  font-size: 15px;
  font-weight: 500;
  color: var(--roxo);
}

.select-arrow {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%20fill%3D%22none%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M6.23521%206.69486L10.8146%201.43148C10.9692%201.25256%2011.043%201.02263%2011.0198%200.792058C10.9967%200.561484%2010.8786%200.349053%2010.6913%200.201283C10.5041%200.053513%2010.2629%20-0.0175523%2010.0207%200.00364937C9.77848%200.024851%209.55492%200.136592%209.39898%200.314402L5.52342%204.76908L1.62235%200.336718C1.46562%200.159121%201.24124%200.0480522%200.998519%200.0279088C0.755795%200.00776544%200.514574%200.0801954%200.327843%200.229288C0.141112%200.37838%200.0241428%200.591942%200.00263107%200.82306C-0.0188806%201.05418%200.0568237%201.28395%200.213115%201.4619L4.82276%206.69892C4.90941%206.79711%205.01765%206.87599%205.13984%206.92998C5.26202%206.98397%205.39517%207.01175%205.52989%207.01136C5.6646%207.01098%205.79759%206.98243%205.91946%206.92774C6.04133%206.87305%206.14912%206.79356%206.23521%206.69486Z%22%20fill%3D%22%23FF6A00%22/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 12px;
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  font-size: 1rem;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
  outline: none;
}

.search {
  appearance: none;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='23' height='23' viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.4111 18.8334L16.2059 14.6282C17.2183 13.2804 17.7648 11.6399 17.763 9.95415C17.763 5.64838 14.2599 2.14529 9.95412 2.14529C5.64834 2.14529 2.14526 5.64838 2.14526 9.95415C2.14526 14.2599 5.64834 17.763 9.95412 17.763C11.6398 17.7649 13.2804 17.2183 14.6282 16.2059L18.8334 20.4111C19.0463 20.6014 19.3239 20.703 19.6093 20.695C19.8947 20.687 20.1662 20.57 20.3681 20.3682C20.57 20.1663 20.687 19.8947 20.6949 19.6093C20.7029 19.3239 20.6014 19.0463 20.4111 18.8334ZM4.37637 9.95415C4.37637 8.85098 4.7035 7.77258 5.31639 6.85532C5.92928 5.93806 6.80041 5.22315 7.81961 4.80098C8.83881 4.37881 9.96031 4.26835 11.0423 4.48357C12.1243 4.69879 13.1181 5.23002 13.8982 6.01008C14.6783 6.79015 15.2095 7.78401 15.4247 8.86599C15.6399 9.94797 15.5295 11.0695 15.1073 12.0887C14.6851 13.1079 13.9702 13.979 13.053 14.5919C12.1357 15.2048 11.0573 15.5319 9.95412 15.5319C8.47535 15.5301 7.05766 14.9419 6.01201 13.8963C4.96637 12.8506 4.37814 11.4329 4.37637 9.95415Z' fill='%23441F5D'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
  background-size: 22px;
  display: block;
  width: 100%;
  padding: 0.75rem 0.75rem 0.75rem 3rem;
  font-size: 1rem;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out;
  outline: none;
  color: var(--cinza);

  &.purple {
    background-image: url("data:image/svg+xml,%0A%3Csvg width='19' height='19' viewBox='0 0 19 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.2658 16.6881L14.0606 12.4829C15.073 11.1351 15.6196 9.49456 15.6177 7.80886C15.6177 3.50308 12.1146 0 7.80886 0C3.50308 0 0 3.50308 0 7.80886C0 12.1146 3.50308 15.6177 7.80886 15.6177C9.49456 15.6196 11.1351 15.073 12.4829 14.0606L16.6881 18.2658C16.901 18.4561 17.1786 18.5577 17.464 18.5497C17.7494 18.5417 18.021 18.4248 18.2229 18.2229C18.4248 18.021 18.5417 17.7494 18.5497 17.464C18.5577 17.1786 18.4561 16.901 18.2658 16.6881ZM2.2311 7.80886C2.2311 6.70568 2.55823 5.62728 3.17112 4.71002C3.78402 3.79277 4.65514 3.07785 5.67434 2.65568C6.69355 2.23352 7.81505 2.12306 8.89703 2.33828C9.979 2.5535 10.9729 3.08473 11.7529 3.86479C12.533 4.64485 13.0642 5.63871 13.2794 6.72069C13.4947 7.80267 13.3842 8.92417 12.962 9.94337C12.5399 10.9626 11.825 11.8337 10.9077 12.4466C9.99044 13.0595 8.91203 13.3866 7.80886 13.3866C6.33009 13.3848 4.9124 12.7966 3.86675 11.751C2.8211 10.7053 2.23288 9.28763 2.2311 7.80886Z' fill='%23FFEECC'/%3E%3C/svg%3E%0A");
    color: var(--creme);
    background-size: 18px;
  }
}

.checkbox-custom {
  position: relative;
  display: inline-flex;
  align-items: center;

  input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  label {
    width: 20px;
    height: 20px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    transition: all 0.2s ease;
    color: #fff;
  }

  svg {
    width: 14px;
    height: 14px;
    opacity: 0;
    color: var(--laranja);
    fill: var(--laranja);
    transition: opacity 0.2s ease;
  }

  input:checked+label {
    background: #fff;
    border-color: #fff;
  }

  input:checked+label svg {
    opacity: 1;
  }
}

footer {
  background-color: var(--roxo);
  color: #fff;

  hr {
    margin-top: 64px !important;
  }

  nav {
    &>div {
      @media (max-width: 992px) {
        flex: 0 0 50%;

        &:nth-child(1) {
          flex: 1 1 auto;
        }
      }

      @media (max-width: 768px) {
        flex: 0 0 100%;
        display: flex;
        justify-content: center;
      }
    }

    ul {
      list-style: none;
      padding: 0;
      max-width: 375px;

      @media (max-width: 992px) {
        text-align: center;
      }

      h4 {
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 24px;
        color: var(--creme);
      }

      li {
        a {
          color: #fff;
          font-size: 16px;
          font-weight: 500;
          line-height: 200%;
        }
      }
    }
  }
}