*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
    scrollbar-width: none;
    font-family: poppins, Arial, Helvetica, sans-serif;
    line-height: 1.2em;
}

.mobi{
    display: none;
}

html{
    overflow-y: scroll;
}

body{
    max-width: 1920px;
    margin: 0 auto;
}

::-webkit-scrollbar{
    width: none;
}

@font-face {
    font-family: poppins;
    src: url(assets/Poppins-Regular.ttf);
    font-display: swap;
}

@font-face {
    font-family: poppinsB;
    src: url(assets/Poppins-Bold.ttf);
    font-display: swap;
}

:root{
    --dourado: #cd9244;

    --verde: #00c400;

    --vermelho: #f70102;

    --branco: #f5f5f5;

}

section, div{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

section{
    padding: 4rem 10rem;
}

a{
    background: var(--verde);
    color: var(--branco);
    text-decoration: none;
    padding: .5em 1em;
    border-radius: 1em;
    animation: ease-in-out pulse 1s infinite alternate;
    font-size: 1.3rem;
}

h1, h1 strong{
    font-size: 2.3rem;
    font-family: poppinsB;
}

p{
    font-size: 1.1rem;
}

#home{
    background: #000 url(assets/bg-home.webp) no-repeat center/cover;
    padding-bottom: 0;
}

#home > div{
    flex-direction: column;
    align-items: flex-start;
    gap: .5em;
    width: 60%;
}

#home > div img{
    width: 50%;
    height: auto;
    max-width: 10rem;
    margin-bottom: 2rem;
}

#home h1{
    color: var(--branco);
}

#home h1:nth-of-type(2){
    color: var(--dourado);
    font-size: 2.6rem;
}

#home p{
    color: var(--branco);
    margin-top: 1rem;
}

#home a{
    margin-top: 2rem;
}

#home > img{
    width: 40%;
    height: auto;
}

#secao2{
    flex-direction: column;
}

#secao2 div{
    flex-direction: column;
    text-align: center;
    gap: 1rem;
    max-width: 700px;
}

#secao2 img{
    width: 100%;
    max-width: 800px;
    height: auto;
    margin: 4rem 0;
}

#secao2 > p{
    text-align: center;
    max-width: 700px;
}

#secao2 > div:last-of-type{
    max-width: unset;
    margin: 4rem 0;
    padding: 2rem;
    background: url(assets/bg-home.webp) no-repeat center/cover;
    color: var(--branco);
}

#secao2 div:last-of-type strong{
    color: var(--dourado);
}

#secao3{
    background: url(assets/bg-home.webp) no-repeat center/cover;
    flex-direction: column;
    color: var(--branco);
    text-align: center;
    gap: 2rem;
}

#secao3 video{
    width: 100%;
    max-width: 800px;
    height: auto;
    border-radius: 2rem;
}

#secao3 h1 strong{
    color: var(--dourado);
}

#secao4{
    flex-direction: column;
    text-align: center;
    gap: 3rem;
}

#secao4 > div{
    flex-wrap: wrap;
    gap: 1rem;
    align-items: stretch;
    overflow: visible;
}

.card{
    padding: 1rem;
    border: solid var(--dourado) 3px;
    border-radius: 1rem;
    width: 25%;
    padding-top: 2rem;
    margin: 2rem 0;
    overflow: visible;
}

.card::after{
    content: "";
    width: 4rem;
    height: 4rem;
    background: url(assets/check.webp) no-repeat center/contain;
    position: absolute;
    top: -3rem;
    filter: drop-shadow(#00000036 10px 10px 10px);
}

#secao5{
    background: url(assets/bg-home.webp) no-repeat center/cover;
}

#secao5 div{
    width: 60%;
    flex-direction: column;
    color: var(--branco);
    gap: 1rem;
    padding: 0 2rem 0 0;
}

#secao5 video{
    width: 100%;
    max-width: 800px;
    border-radius: 1REM;
}

#secao6{
    flex-direction: column;
    text-align: center;
    gap: 1rem;
}

#secao6 h1 strong{
    background: var(--vermelho);
    color: var(--branco);
}

#secao6 div{
    align-items: flex-start;
    flex-wrap: wrap;
    max-width: 900px;
    margin-top: 2rem;
}

#secao6 div img{
    width: 100%;
    max-width: 300px;
}

#secao6 :is(p, h1){
    max-width: 800px;
}

#secao6 span{
    font-weight: bold;
    margin: 2rem 0 0 0;
    font-size: 1.5rem;
    padding: 1em;
    background: var(--dourado);
    margin-bottom: -1rem;
    border-radius: 1em 1em 0 0;
    color: var(--branco);
}

#secao6 ul{
    background: url(assets/bg-home.webp) no-repeat center/cover;
    width: 100vw;
    max-width: 1920px;
    padding: 4rem;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1em;
    margin-bottom: 2rem;
}

#secao6 li{
    color: var(--branco);
    width: 100%;
    max-width: 700px;
}

#secao6 li > strong{
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1.3rem;
}

#secao6 li strong:first-of-type{
    color: var(--dourado);
}

#secao6 #frase{
    width: 100vw;
    max-width: 1920px;
    padding: 2rem;
    background: url(assets/bg-home.webp) no-repeat center/cover;
    color: var(--branco);
    gap: 1em;
}

#frase h2{
    max-width: 800px;
}

#frase h2:last-of-type{
    color: var(--dourado);
}

#secao7{
    flex-direction: column;
    text-align: center;
    gap: 1em;
}

#secao7 > :is(h1, p, h2, cite){
    max-width: 800px;
}

#secao7 h1{
    color: var(--branco);
    background: var(--vermelho);
    padding: .5em;
    border-radius: .5em;
}

#secao7 h2{
    font-family: poppinsB;
    font-size: 6rem;
    margin: 2rem 0;
    color: var(--dourado);
}

#secao7 div{
    padding: 1rem;
    gap: 1rem;
    background: url(assets/bg-home.webp) no-repeat center/cover;
    border-radius: 1rem;
    color: var(--branco);
    text-align: left;
}

#secao7 div img{
    width: 6rem;
    height: 6rem;
    object-fit: contain;
}

#secao7 div p{
    font-size: 1.5rem;
}

#secao8{
    flex-direction: column;
    gap: 2rem;
}

#secao8 h1{
    max-width: 800px;
    text-align: center;
}

#secao8 img{
    width: 100%;
    max-width: 800px;
    height: auto;
}

#secao8 img:last-of-type{
    margin-top: -4rem;
}

#secao9{
    gap: 2rem;
}

#secao9 > div{
    flex-direction: column;
    width: 50%;
    align-items: flex-start;
    gap: 2rem;
}

#secao9 > div span{
    display: flex;
    align-items: center;
    gap: .5em;
}

#secao9 div span img{
    width: 3rem;
    height: auto;
}

#secao9 div span p{
    font-size: 1.6rem;
    font-family: poppinsB;
}

#secao9 img{
    width: 50%;
    height: auto;
}

#secao10{
    flex-direction: column;
    gap: 2rem;
    text-align: center;
}

#secao10 :is(img, h1){
    width: 100%;
    max-width: 800px;
    height: auto;
}

#preco{
    flex-direction: column;
    background: url(assets/bg-home.webp) no-repeat center/cover;
}

#preco > div{
    gap: 2rem;
}

#preco > div > h1{
    width: 50%;
    color: var(--dourado);
}

.cardpreco{
    background: var(--branco);
    flex-direction: column;
    padding: 2rem;
    border-radius: 1em;
}

.cardpreco h1{
    color: var(--verde);
}

.cardpreco h1 strong{
    font-size: 5rem;
}

#secao11{
    flex-direction: column;
    gap: 2rem;
}

#secao11 h1{
    text-transform: uppercase;
}

#secao11 :is(h1, h2){
    max-width: 800px;
    text-align: center;
}

#secao11 ul{
    padding: 2rem;
    border-radius: 0 1rem 0 1rem;
    border: var(--dourado) solid 2px;
    list-style: none;
    max-width: 800px;
}

#secao11 ul li{
    font-size: 1.5rem;
    margin: .5em 0;
}

#secao11 ul li::first-letter{
    color: var(--verde);
}

#secao11 div{
    flex-direction: column;
    margin: 2rem 0;
    border-radius: 1rem;
    padding: 2rem;
    background: url(assets/bg-home.webp) no-repeat center/cover;
    color: var(--branco);
    gap: 1rem;
}

#secao12{
    flex-direction: column;
    gap: 2rem;
}

#secao12 :is(h1, h2, p){
    text-align: center;
    max-width: 800px;
}

#secao12 > img{
    width: 100%;
    max-width: 800px;
    height: auto;
}

#secao12 > h2{
    font-size: 1.8rem;
    margin-top: 1rem;
}

#secao12 .preco{
    padding: 2rem;
    background: var(--branco);
    box-shadow: #0000001f 10px 10px 10px;
    border-radius: 1em;
    font-size: 1.5rem;
}

#secao12 .preco strong{
    color: var(--verde);
}

#secao12 div:last-of-type{
    flex-direction: column;
    gap: 2rem;
    margin-top: 2rem;
    text-align: center;
}

#secao12 div:last-of-type img{
    width: 10rem;
    height: 10rem;
    object-fit: contain;
}

#faq{
    flex-direction: column;
    background: url(assets/bg-home.webp) no-repeat center/cover;
    gap: 2rem;
}

#faq h1{
    color: var(--branco);
}

#faq div{
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    max-width: 800px;
    gap: .5em;
}

#faq details{
    background: var(--branco);
    padding: 1rem;
    width: 100%;
    border-radius: 1em;
    transition: all ease-in-out .25s;
}

#faq summary{
    margin-bottom: .5em;
    font-size: 1.2rem;
    font-weight: bold;
}

#faq details[open]{
    background: var(--dourado);
    color: var(--branco);
}


footer{
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 2rem;
    align-items: center;
    justify-content: center;
}





























@keyframes pulse {
    to{
        scale: .9;
    }
}

.oculta{
    display: none;
}