/* CSS MOBILE FIRST 
   Padrão: Mobile (iPhone)
   Breakpoints: Tablet (min-width: 768px) e Desktop (min-width: 1081px)
*/

/* --- ESTILOS BASE (MOBILE) --- */
html, body { margin: 0; padding: 0; width: 100%; background-color: #ffffff; overflow-x: hidden !important;}

.logo { width: 94%; margin: 0 auto; }
.container { width: 100%; margin: 0 auto; }
.inner-container { width: 94%; max-width: 640px; margin: 0 auto; padding: 0px; display: flex; flex-wrap: wrap; justify-content: space-between; }
.column { width: 100% !important; text-align: center !important; }

.inner-container-head { width: 90%; max-width: 640px; margin: 0 auto; }
.inner-container-subhead { width: 98%; max-width: 680px; margin: 0 auto; }
.inner-container-andre { width: 90%; max-width: 640px; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
.inner-container-detalhes { width: 94%; max-width: 640px; margin: 0 auto; }


/*.iframe { text-align: center; }
.iframe iframe { width: 88%; max-width: 620px; height: calc(88vw * 8.7 / 16); }*/


.iframe { text-align: center; width: 100%; margin: 20px 0; }
.video-facade { position: relative; width: 88%; max-width: 620px; margin: 0 auto; aspect-ratio: 16 / 9; background-color: #000; cursor: pointer; border-radius: 8px; overflow: hidden; display: block;}
.video-facade img { width: 100%;  height: 100%;  object-fit: cover;  display: block;}


.container-cont { width: 90%; max-width: 300px; margin: 0 auto; text-align: center; display: flex; justify-content: space-between; padding-top: 30px; }
.column-cont { width: 100px; max-width: 100px; }

.container-bonus { width: 95%; max-width: 960px; margin: 0 auto; text-align: center; display: flex; justify-content: space-between; flex-wrap: wrap; }
.column-bonus { width: 94%; max-width: 380px; margin: 0 auto; }

.container-midia { width: 90%; max-width: 380px; margin: 0 auto; text-align: center; display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: 30px; }
.column-midia { width: 200px; max-width: 200px; margin: 0 auto; text-align: center; padding-top: 0px; }

.container-dep { margin: 0 auto; text-align:center; width: 80%; max-width: 580px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.column-dep { width: 100%; margin-bottom: 40px; }

.inner-container-benef { width: 85%; max-width: 380px; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
.column-benef { width: 100%; margin-top: 20px; margin-bottom: 20px; }

.container-tit { width: 100%; }
.inner-container-tit { width: 90%; max-width: 580px; margin: 0 auto; text-align: center; }

.container-faq { width: 92%; max-width: 420px; margin: 0 auto; }
.inner-container-faq { width: 84%; margin: 0 auto; }

.inner-container-quad { width: 95%; max-width: 380px; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
.column-quad { width: 100%; margin-top: 20px; margin-bottom: 20px; }
.column-andre { width: 100%; margin-top: 20px; margin-bottom: 20px; }


/* Imagens Mobile */
img { outline: none; text-decoration: none; border: none; -ms-interpolation-mode: bicubic; }
.img-desktop { display: none; }
.img-mobile { display: block; margin: 0 auto; }

.img-logo { text-align: center; } .img-logo img { width: 300px; height: auto; max-width: 60%; }
.img-infos { text-align: center; } .img-infos img { width: 420px; height: auto; max-width: 85%; }
.img-cta { text-align: center; } .img-cta img { width: 550px; height: auto; max-width: 90%; }
.img-1200alunas { text-align: center; } .img-1200alunas img { width: 350px; height: auto; max-width: 65%; }

.img-midia { text-align: center; } .img-midia img { width: 200px; height: auto; max-width: 98%; }
.img-espere { text-align: center; } .img-espere img { width: 500px; height: auto; max-width: 100%; }
.img-paraquem { text-align: center; } .img-paraquem img { margin: 0 auto; width: 94%; height: auto; max-width: 540px; }
.img-prova { text-align: center; } .img-prova img { width: 80px; height: auto; max-width: 30%; }
.img-capa { text-align: center; } .img-capa img { width: 600px; height: auto; max-width: 100%; }
.img-valor { text-align: center; } .img-valor img { width: 380px; height: auto; max-width: 85%; }
.img-bonus { text-align: center; } .img-bonus img { width: 200px; height: auto; max-width: 40%; } /* Prioridade mobile original era 40% */
.img-garantia { text-align: center; } .img-garantia img { width: 300px; height: auto; max-width: 70%; }
.img-provas2 { text-align: center; } .img-provas2 img { width: 210px; height: auto; max-width: 100%; }
.img-contato { text-align: center; } .img-contato img { width: 120px; height: auto; max-width: 98%; }
.img-aspas { text-align: left; } .img-aspas img { width: 85px; height: auto; max-width: 25%; }
.img-quadrada { text-align: center; } .img-quadrada img { width: 320px; height: auto; max-width: 100%; }
.img-redes { text-align: center; } .img-redes img { width: 45px; height: auto; max-width: 80%; }

/* Tipografia Mobile */
p { margin: 0px 0px !important; font-size: 20px; line-height: 25px; text-align: center; padding: 10px 15px 15px 15px; }
.img-1200alunas .proof-scale { font-size: 14px; line-height: 1.4; margin-top: 0; text-align: center; color: #888; }
a { color: #000; text-decoration: none !important; margin: 0; }
a strong { font-weight: 700; }

h1 { margin: 0px 0px !important; font-size: 20px; padding: 5px; line-height: 26px; color: #5E2129; font-weight: 400; text-align: center; }
h1 strong { font-weight: 700; font-size: 22px; }

h2 { margin: 0px 0px !important; font-size: 14px; line-height: 21px; font-weight: 400; color: #7A4A4A; text-align: center; padding: 15px 15px 15px 15px; }
h2 strong { font-weight: 700; font-size: 14.5px; color: #7A4A4A; }

h3 { margin: 0px 0px !important; font-size: 18px; color: #494949; text-align: center; line-height: 26px; font-weight: 400; }
h3 strong { font-weight: 600; }

h4 { margin: 0px 0px !important; font-size: 15px; line-height: 34px; color: #ABABAB; font-weight: 400; }
h4 strong { font-weight: 700; font-size: 16px; color: #FFA500; }

h5 { margin: 0px 0px !important; font-size: 15px; line-height: 21px; font-weight: 400; color: #FFFFFF; text-align: center; padding: 8px; }
h5 strong { font-weight: 700; font-size: 16px; }

h6 { margin: 0px 0px !important; font-size: 14px; font-weight: 400; color: #707070; text-align: center; line-height: 21px; padding: 0 10px 25px 10px; }
h6 strong { font-weight: 700; font-size: 14px; }

h7 { margin: 0px 0px !important; font-size: 16px; color: #000; line-height: 22px; text-align: center; }
h7 strong { font-size: 17px; }



/* --- TABLET (Break Point 0.2) --- */
@media (min-width: 768px) {
    .container { width: 100%; margin: 0 auto; }
    .inner-container { width: 100%; max-width: 640px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
    .column { width: 100%; max-width: 640px; margin-bottom: 60px; }
    .logo { width: 800px; margin: 0 auto; }
    .inner-container-head { width: 80%; max-width: 640px; margin: 0 auto; }
    .inner-container-subhead { width: 80%; max-width: 640px; margin: 0 auto; }
    .container-cont { width: 55%; max-width: 400px; margin: 0 auto; text-align: center; display: flex; justify-content: space-between; padding-top: 30px; }
    .column-cont { width: 90px; max-width: 90px; }
    .container-dep { max-width: 580px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
    .column-dep { width: 100%; margin-bottom: 40px; }
    .inner-container-benef { max-width: 600px; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
    .column-benef { width: 100%; margin-top: 20px; margin-bottom: 20px; }
    .inner-container-tit { width: 100%; margin: 0 auto; text-align: center; }
    .container-faq { width: 80%; max-width: 640px; margin: 0 auto; }
    .inner-container-faq { width: 90%; margin: 0 auto; }
    .inner-container-quad { max-width: 600px; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
    .column-quad { width: 100%; margin-top: 20px; margin-bottom: 20px; }
    .inner-container-andre { width: 640px; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; }
    .column-andre { width: 100%; margin-top: 20px; margin-bottom: 20px; }
    
    h3 { padding-top: 5px; padding-bottom: 20px; padding-left: 120px; }
    h6 { font-size: 14px; }
}

/* --- DESKTOP (Break Point 0.1) --- */
@media (min-width: 1081px) {
    .logo { width: 1200px; }
    .inner-container { width: 95%; max-width: 1280px; }
    .column { width: calc(33.33% - 40px); margin-bottom: 60px; }
    .inner-container-head { width: 860px; max-width: 860px; padding: 0px; }
    .inner-container-subhead { width: 1080px; max-width: 1080px; padding: 0px; }
    .inner-container-andre { width: 980px; max-width: 980px; }
    .inner-container-detalhes { width: 960px; max-width: 80%; }
    
    /*.iframe iframe { width: 620px; height: 349px; }*/
    .video-facade { width: 620px; height: 349px; }
	
	
    .container-cont { width: 35%; max-width: 350px; padding-top: 0; }
    .column-cont { width: 120px; max-width: 120px; }
    .column-bonus { width: 220px; max-width: 220px; }
    
    .container-provas2 { width: 100%; max-width: 1080px; margin: 0 auto; text-align: center; display: flex; justify-content: space-between; flex-wrap: wrap; }
    .column-provas2 { width: 250px; max-width: 250px; margin: 0 auto; }
    
    .container-midia { width: 70%; max-width: 700px; display: flex; justify-content: space-between; padding-top: 0; }
    .column-midia { width: 200px; margin: 0; }
    
    .container-dep { max-width: 980px; }
    .column-dep { width: calc(33.33% - 30px); margin-bottom: 55px; }
    
    .inner-container-benef { width: 1080px; max-width: 1080px; display: flex; }
    .column-benef { width: calc(33.33% - 30px); margin-bottom: 30px; margin-top: 0; }
    
    .inner-container-tit { width: 75%; }
    .container-faq { width: 70%; max-width: none; }
    
    .inner-container-quad { width: 800px; max-width: 800px; }
    .column-quad { width: calc(50% - 20px); margin-top: 30px; margin-bottom: 30px; }
    .column-andre { width: calc(50% - 20px); margin-top: 30px; margin-bottom: 30px; }

    .img-desktop { display: block; }
    .img-mobile { display: none; }
    
    .img-bonus img { max-width: 75%; }
    .img-garantia img { max-width: 100%; height: 248px; }
    
    h1 { font-size: 22px; line-height: 28px; padding-bottom: 10px; }
    h1 strong { font-size: 26px; }
    
    h2 { font-size: 15px; line-height: 20px; padding-top: 20px; }
    h2 strong { font-size: 15px; font-weight: 600; }
    
    h3 { font-size: 19px; padding-left: 0; padding-bottom: 0; }
    h4 { font-size: 19px; line-height: 36px; color: #FFFFFF; }
    h4 strong { font-size: 23px; color: #FFF000; }
    h5 { font-size: 16px; padding-top: 10px; padding-left: 6px; padding-right: 6px; }
    h6 { font-size: 15px; line-height: 22px; padding-bottom: 0; }
    h7 { font-size: 19px; line-height: 23px; }
    h7 strong { font-size: 19px; }
}