@font-face {
    font-family: 'PPEditorialOld';
    src: url('../fonts/PPEditorialOld-UltralightItalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

body {
    font-family: 'Lato', sans-serif;
}

h1 {
    font-family: 'PPEditorialOld', serif;
}
h1, h2, h3, h4, h5, h6 {
    /* text-transform: uppercase; */
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;

}
html {
    overflow-x: hidden;
}
section.hero {
    background: url('../assets/hero-capa2.png')top center no-repeat;
    background-size: cover;
    width: 100vwvw;
    height: 45vw;
    height:
    95vh;
}
section.hero .container {
    width: 85%;
    margin: 0 auto;
    height: 100%;
}
section.hero .container .text {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
section.hero .container .text img {
    margin-bottom: 2vw;
    width: 29vw;
}

section.hero .container .text img + p {
    font-size: 5vw;
    color: #fff;
    display: flex;
    align-items: flex-start;
    position: relative;
    left: 1vw;
    flex-direction: column;
}
section.hero .container .text .vertical {
    display: inline-block;
    transform: rotate(-90deg);
    font-size: 1.1vw;
    position: absolute;
    left: -2.3vw;
    top: 2.5vw;
}
section.hero .container .text .serifada {
    font-family: 'PPEditorialOld', serif;
    font-style: italic;
    font-size: 4vw;
    font-size: 4.56vw;
    margin-top: -.8vw;
}
section.hero .container .text button {
    /* font-family: 'PPEditorialOld', serif; */
    background: #ffa3a6;
    background: #d0d4a4;
    color: #fff;
    text-decoration: none;
    display: flex;
    width: fit-content;
    padding: .5vw 1.4vw;
    border-radius: 999px;
    border-radius: 24px;
    font-size: 2vw;
    /* font-style: italic; */
    align-items: center;
    justify-content: center;

    background: #d0d4a4;
    text-decoration: none;
    color: #000;
    font-size: 1vw;
    width: 22vw;
    text-align: center;
    border-radius: 1vw;
    border: 0;
    font-size: 1.2vw;
    padding: 0.8vw;
    line-height: 130%;
    font-weight: 700;
    letter-spacing: .1041666667vw;
    margin: .5vw 0;
    text-transform: uppercase;
    transition: all .3s;
    cursor: pointer;
}
section.hero .container .text button:hover {
    background: #b9bd92;
}
section.hero .container .text button span {
}
section.hero .container .text button br {
    /* display: none; */
}
section.hero .container .text button + p {
    font-size: 1.2vw;
    color: #fff;
    width: 35%;
    margin-top: 1.2vw;
}





/*POPUP*/

/* Estilo básico do popup */
.popup {
    display: none; /* Inicialmente oculto */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Fundo semitransparente */
    justify-content: center;
    align-items: center;
    z-index: 1000; /* Fica sobre outros conteúdos */
  }
  
  /* Estilo do conteúdo do popup */
  .popup-content {
    background-color: white;
    padding: 2rem;
    border-radius: 8px;
    width: 36rem;
    text-align: center;
    position: relative;
  }
  
  /* Estilo do botão de fechar */
  .close-btn {
    font-size: 2rem;
    color: #000;
    cursor: pointer;
    position: absolute;
    top: 0rem;
    right: 1rem;
  }
  #sib-container {
    padding: 0;
  }
  
  .close-btn:hover {
    color: black;
  }
  
/*POPUP*/
.sib-form-block__button {
    background: #ffa3a6;
    background: #d0d4a4;
    color: #fff;
    text-decoration: none;
    display: flex;
    width: fit-content;
    padding: .5vw 1.4vw;
    border-radius: 999px;
    border-radius: 24px;
    font-size: 2vw;
    /* font-style: italic; */
    align-items: center;
    justify-content: center;

    background: #d0d4a4;
    text-decoration: none;
    color: #000;
    font-size: 1vw;
    /* width: 22vw; */
    text-align: center;
    border-radius: 1vw;
    border: 0;
    font-size: 1.2vw;
    padding: 0.8vw;
    line-height: 130%;
    font-weight: 700;
    letter-spacing: .1041666667vw;
    margin: .5vw 0;
    text-transform: uppercase;
    transition: all .3s;
    cursor: pointer;
}
.sib-form {
    padding: 0;
}



section.cadastro {}
section.cadastro .container {
    display: flex;
    /* align-items: flex-end; */
    background: #222222;
    background: #f2f2f2;
    background: #d0d4a4;
    align-items: center;
}
section.cadastro .container .form {
    display: flex;
    flex-direction: column;
    /* background: #F2F2F2; */
    width: 78.125vw;
    padding-left: 7.8125vw;
    padding-top: 6.9270833vw;
    padding-bottom: 5.2604166vw;
}
section.cadastro .container form {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 54.583333vw;
    gap: 2.0833333vw;
}
section.cadastro .container .form p {
    color: var(--preto, #232222);
    color: #fff;
    font-size: 1.8229166vw;
    
    font-weight: 700;
    letter-spacing: .1822916vw;
    text-transform: uppercase;
    width: 40.78125vw;
    width: 50vw;
    margin-bottom: 2.7083333vw;
}
section.cadastro .container label {
    font-weight: 500;
    font-size: 1.3020833vw;
    max-width: 100%;
   
    color: #222222;
    color: #fff;
}
section.cadastro .container input {
    -webkit-align-items: center;
    align-items: center;
    background: transparent;
    width: 100%;
    border: 0;
    margin: 0.25rem 0;
    font-size: 1vw;
    max-width: 100%;
    border-bottom: 0.1041666vw solid #fff;

    height: auto;
    padding: 0.5208333vw;
}

::placeholder {
    color: #fff;
}
section.cadastro .container button {
    min-height: auto;
    line-height: normal;
    margin-top: 1.5625vw;
    display: inline-flex;
    padding: .3645833vw 3.96875vw .5208333vw 3.96875vw;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    background: var(--preto, #232222);
    /* background: #ffa3a6; */
    color: var(--gray-6, #F2F2F2);
    font-size: 1.3vw;
    font-weight: 700;
    border-radius: 8px;
    /* border-color: #ffa3a6; */
}
section.cadastro .container .img {
    width: 30vw;
}
section.cadastro .container .img img {
    width: 100%;
    border-radius: 24px;
}
section.cadastro .container  {
    justify-content: center;
    /* display: flex; */
    padding: 3vw 0;
}
section.cadastro .container .card {
    background: #fff;
    padding: 1vw 3vw;
    border-radius: 1.5vw;
    display: flex
;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4vw;
}
section.cadastro .container .card h3 {
    font-size: 2.5vw;
    font-weight: bold;
}
section.cadastro .container .card .descricao {
    font-size: 1vw;
    margin: .4vw 0;
}
section.cadastro .container .card .flex {
    display: flex;
    font-style: italic;
    align-items: flex-end;
    gap: 1.4vw;
    font-family: 'PPEditorialOld', serif;
}
section.cadastro .container .card .flex .vezes {
       font-size: 1.7vw;
       font-size: 1.7vw;
    text-align: right;
}
section.cadastro .container .card .flex .price {
    font-size: 4.8vw;
    font-size: 5.2vw;
    margin-bottom: -1.1vw;
}
section.cadastro .container .card .desconto {
    font-size: .7vw;
}
section.cadastro .container .card a {
    background: #ffa3a6;
    text-decoration: none;
    color: #000;
    font-size: 1vw;
    width: 19vw;
    text-align: center;
    border-radius: 1vw;
    font-size: 1.2vw;
    padding: 0.8vw;
    line-height: 130%;
    font-weight: 700;
    letter-spacing: .1041666667vw;
    margin: .5vw 0;
    transition: all .3s;
}
section.cadastro .container .card a:hover {
    background: #e69295;
}
section.cadastro .container .card span {
    font-size: .7vw;
}














section.perguntas-frequentes {
    width: 100vw;
    padding: 5vw 0;
    /* height: 36vw; */
}
section.perguntas-frequentes .container {
    width: 85%;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
section.perguntas-frequentes .container h2 {
    width: fit-content;
    /* margin: 0 auto; */
    font-size: 2vw;
    margin-bottom: 2vw;
}
section.perguntas-frequentes .container .duvidas-frequenntes {
    width: 50%;
}
section.perguntas-frequentes .container .faq-container {
    width: 90%;  
    /* margin: 0 auto;   */
}

section.perguntas-frequentes .container .faq-item {
  border-bottom: 1px solid #ccc;
  margin-bottom: 10px;
}

section.perguntas-frequentes .container .faq-title {
  background-color: #fff;
  width: 100%;
  padding: 15px 0;
  text-align: left;
  font-size: 1.2vw;
  font-weight: bold;
  font-weight: 500;
  border: none;
  outline: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  color: #000;
}

section.perguntas-frequentes .container .arrow {
    font-size: 1.8vw;
    transition: transform 1.3s;
    min-width: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.icon {
    transition: transform 0.3s;
  }

section.perguntas-frequentes .container .faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
  padding: 0 15px;
  /* background: #f2f2f2; */
}

section.perguntas-frequentes .container .faq-content p {
  margin: 15px 0;
  line-height: 1.5;
  font-size: 1vw;
}

section.perguntas-frequentes .container .faq-item[aria-expanded="true"] .faq-content {
  max-height: 200px;
}

section.perguntas-frequentes .container .faq-item[aria-expanded="true"] .arrow {
  transform: rotate(180deg);
}

section.perguntas-frequentes .container .ficou-duvidas {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
section.perguntas-frequentes .container .ficou-duvidas h2 {}
section.perguntas-frequentes .container .ficou-duvidas h2 + p {
    font-size: 1vw;
}
section.perguntas-frequentes .container .ficou-duvidas a {
    flex-direction: column;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1;
    background-color: transparent;
    font-family: "Archia", Sans-serif;
    text-decoration: none;
    padding: 1.2vw;
    border-radius: 24px;
    width: 70%;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 2vw;

    color: #090909;
    padding: 0.7em 1.7em;
    font-size: 18px;
    border-radius: 0.5em;
    background: #f2f2f2;
    background: #f2f2f2;
    cursor: pointer;
    border: 1px solid #f9f5f5;
    border: 1px solid #000;
    transition: all 0.3s;
    /* box-shadow: 6px 6px 12px #c5c5c5, -6px -6px 12px #ffffff;
    box-shadow: 6px 6px 12px #f2f2f2, -6px -4px 8px #dedede; */
    border: 3px solid transparent;
    border: 3px solid #e8e8e8;

    gap: .5vw;
}

/* section.perguntas-frequentes .container .ficou-duvidas a:hover {
    color: #666;
    box-shadow: inset 10px 10px 30px #c5c5c5, inset -10px -10px 30px #ffffff;
} */

section.perguntas-frequentes .container .ficou-duvidas a:hover {
    border: 3px solid #e8e8e8;
    border: 3px solid white;
    box-shadow: 6px 6px 12px #f2f2f2, -6px -6px 12px #c5c5c5;
    box-shadow: 4px 4px 12px #c5c5c5, -4px -4px 12px #ffffff;
  }
  
  section.perguntas-frequentes .container .ficou-duvidas a:active {
  }

  
section.perguntas-frequentes .container .ficou-duvidas a svg {
    width: 3.125vw;
    height: 3.125vw;
    /* fill: #ffa3a6; */
}
section.perguntas-frequentes .container .ficou-duvidas a p  {
    font-size: 1.5vw;
    font-weight: 500;
}
section.perguntas-frequentes .container .ficou-duvidas a span {
    color: #ffa3a6;
    color: #000;
}
section.perguntas-frequentes .container .ficou-duvidas a small {
    font-size: .9vw;
}
section.perguntas-frequentes .container ul {
    
    padding-left: 1vw;
}
section.perguntas-frequentes .container ul li {}
section.perguntas-frequentes .container .faq-content p.modulo {
    font-weight: bold;
    
}
section.perguntas-frequentes .container .faq-content  ul + p.modulo {
    margin-top: 1.5vw;
    margin-bottom: 0;
}





section.quem-somos {
    background: #f2f2f2;
    background: #fff;
    padding: 4vw 0;
}
section.quem-somos .container {
    display: flex;
    align-items: center;
    width: 85%;
    margin: 0 auto;
    justify-content: space-between;
}
section.quem-somos .container .text {
    width: 50%;
    text-align: left;
    /* margin: 0 auto; */
}
section.quem-somos .container .text h2 {
    font-size: 2vw;
    margin-bottom: 3vw;
    font-weight: 500;
    text-transform: none;
}
section.quem-somos .container .text p {
    font-size: 1.1vw;
    line-height: 140%;
}
section.quem-somos .container .img {
    width: 30%;
}
section.quem-somos .container .img img {
    width: 100%;
    border-radius: 24px;
}

footer {
    background: #222;
    background: #fff;
    box-shadow: 0px -5px 14px -7px rgba(0, 0, 0, 0.25);
    /* height: 13vw; */
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
footer .container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* width: fit-content; */
    /* gap: 674.61px; */
    padding: .5vw;
}
footer .container .footer-logo {
    width: 2.145833vw;
    width: 10.416666vw;
    margin-right: 35.416666vw;
}
footer .container a {
    text-decoration: none;
    display: flex;
}
footer .container svg {
    width: 1.5625vw;
    margin-right: 7.8125vw;
}



@media screen and (max-width: 768px) {

    section.hero {
        background: url('../assets/hero-capa-mob.png') top center no-repeat;
        background-size: cover;
        width: 100vw;
        height: 222vw;
    }
    section.hero .container  {
        position: relative;
    }
    section.hero .container .text {
        height: auto;
        flex-direction: column;
        justify-content: unset;
        position: relative;
        top: 15vw;
    }
    section.hero .container .text img {
        margin-bottom: 6vw;
        width: 59vw;
    }
    section.hero .container .text img + p {
        font-size: 16vw;
        left: 4vw;
    }
    section.hero .container .text .vertical {
        transform: rotate(-90deg);
        font-size: 3.6vw;
        position: absolute;
        left: -7.3vw;
        top: 7.9vw;
    }
    section.hero .container .text .serifada {
        font-size: 4vw;
        font-size: 14.56vw;
        margin-top: -2.8vw;
    }
    section.hero .container .text button {
        /* font-family: 'PPEditorialOld', serif; */
        /* font-style: italic; */
        background: #ffa3a6;
        background: #d0d4a4;
        color: #000;
        text-decoration: none;
        display: flex;
        width: fit-content;
        padding: 2.5vw 9.4vw;
        border-radius: 999px;
        border-radius: 24px;
        font-size: 5vw;
        align-items: center;
        justify-content: center;
        margin-top: 3vw;
    }
    section.hero .container .text button br {
        display: block;
    }
    section.hero .container .text button + p {
        font-size: 4.5vw;
        color: #fff;
        width: 100%;
        margin-top: 6.2vw;
    }

    .popup-content {
        background-color: white;
        padding: 1rem;
        border-radius: 8px;
        width: 90vw;
        text-align: center;
        position: relative;
    }
    .sib-form-block__button {
        padding: 2.8vw 3.8vw;
    }

    section.quem-somos .container {
        flex-direction: column;
        padding: 13vw 0;
    }
    
    section.quem-somos .container .text {
        width: 100%;
    }
    section.quem-somos .container .text h2 {
        font-size: 5.6vw;
        margin-bottom: 7vw;
        font-weight: 500;
        text-transform: none;
    }
    section.quem-somos .container .text p {
        font-size: 3.72077vw;
        line-height: 140%;
    }




    section.cadastro .container  {
        padding: 16vw 0;
    }
    section.cadastro .container .card {
        background: #fff;
        padding: 8vw 6vw;
        border-radius: 24px;
        gap: 2.4vw;
    }
    section.cadastro .container .card h3 {
        font-size: 5.8vw;
        font-size: 7.8vw;
        font-weight: bold;
    }
    section.cadastro .container .card .descricao {
        font-size: 3.1vw;
        margin: 1.4vw 0;
    }
    section.cadastro .container .card .flex {
        gap: 4.4vw;
    }
    section.cadastro .container .card .flex .vezes {
        font-size: 6.5vw;
        font-size: 5.8vw;
    }
    section.cadastro .container .card .flex .price {
        font-size: 18.8vw;
        margin-bottom: -4.1vw;
    }
    section.cadastro .container .card .desconto {
        font-size: 2.3vw;
    }
    section.cadastro .container .card a {
        background: #ffa3a6;
        text-decoration: none;
        color: #000;
        font-size: 1vw;
        width: 74vw;
        width: 82vw;
        text-align: center;
        border-radius: 20px;
        font-size: 5vw;
        padding: 2.5vw;
        font-weight: 700;
        line-height: 120%;
        letter-spacing: 0.704167vw;
    }
    section.cadastro .container .card span {
        font-size: 2.7vw;
    }


    section.quem-somos .container .img {
        display: none;
    }
    section.perguntas-frequentes {
        width: 100vw;
        padding: 13vw 0;
    }
    section.perguntas-frequentes .container {
        flex-direction: column;
        gap: 10vw;
    }
    section.perguntas-frequentes .container .duvidas-frequenntes {
        width: 100%;
    }

    section.perguntas-frequentes .container h2 {
        width: fit-content;
        /* margin: 0 auto; */
        font-size: 5.6vw;
        margin-bottom: 7vw;
    }
    section.perguntas-frequentes .container .faq-title {
        font-size: 4.2vw;
    }
    section.perguntas-frequentes .container .faq-content p {
        margin: 15px 0;
        line-height: 1.5;
        font-size: 3.73vw;
    }
    section.perguntas-frequentes .container ul {
        padding-left: 4vw;
    }
    section.perguntas-frequentes .container .ficou-duvidas {
        width: 100%;
    }

    section.perguntas-frequentes .container .ficou-duvidas h2 + p {
        font-size: 4.2vw;
    }
    section.perguntas-frequentes .container .ficou-duvidas a {
        width: 100%;
        gap: 3vw;
        margin-top: 7vw;
    }
    section.perguntas-frequentes .container .ficou-duvidas a p {
        font-size: 3.73vw;
        font-weight: 500;
    }
    section.perguntas-frequentes .container .ficou-duvidas a svg {
        width: 7.125vw;
        height: 7.125vw;
        /* fill: #ffa3a6; */
    }
    section.perguntas-frequentes .container .ficou-duvidas a small {
        font-size: 2.9vw;
    }

    footer .container {
        display: flex;
        align-items: center;
        justify-content: center;
        /* width: fit-content; */
        gap: 6vw;
        padding: 4.5vw 0;
        width: 100vw;
    }
    footer .container .footer-logo {
        width: 2.145833vw;
        width: 35vw;
        margin-right: 0;
    }
    footer .container svg {
        width: 4.5625vw;
        margin-right: unset;
    }
}