.tela{
    width: 100vw; height: 100dvh ;
}

body { background: #F0EDE6; display: flex; justify-content: center; font-family: Arial, Helvetica, sans-serif;
}

.tamanho_video_final { width: 240px ; height: 312px;}

.tela_1, .tela_2 { display: flex; flex-direction: column; justify-content: space-between;}
.mobile-container { width: 360px;  
  height: 100dvh;
  /* height: 94dvh; */
  overflow: hidden;
}

.mb-3 {
    margin-bottom: 1dvh !important;
}
 
#video {
    /* max-width: 70%; */
    width: auto;
    height: 43dvh;
    border: 3px solid #FDB813; border-radius: 4px;
}
.video_container { position:relative ;     width: fit-content;    margin: auto; }
.video_container.mutado::before{ 
  width:20px;
  height:20px;
  content:"";
  display:block;
  background-image:url(./img/mute.png);
  background-size:contain;
  background-repeat:no-repeat;
  position:absolute;
  top: 5px;
  right: 5px ;
  z-index:2;
   overflow:visible;
}

@media(min-width: 260px) and (max-width: 390px)
{
  #video {
    /* max-width: 70%; */
      width: auto;
      height: 38dvh;
  }
}

 


.compartilhar_padding {
  padding: 4dvh;
  /* height: 20dvh; */
  position: absolute;
  bottom: 0;  
}

.compartilhar_padding .submit_btn_limpo{
  margin-top: 0px!important;
}


.mensagem_inspiradora {
  
    padding: 2dvh 0px;
}


.texto_baixo { padding: 3dvh 0px 2dvh 0px; }


.mensagem_inspiradora, .texto_baixo {
    font-size: 2.1dvh; line-height: 2.4dvh; 
}

.titulo_ultima_pagina { 
  font-size: 3.5dvh ; padding-top: 1dvh; padding-bottom: 1dvh; margin-bottom: 0px!important;
}
 
.full_height .mobile-container ,
.samsung-browser .mobile-container {
   height: 100dvh;
   /* height: 100dvh; */
   min-height: 100dvh;
}
 
@media(min-width: 1000px){

 .mobile-container { 
  
    overflow: auto;  height: auto; min-height: 100%;
    height: 100dvh;
    width: auto;
    /* aspect-ratio: calc(9 / 16); */
    aspect-ratio: 1 / 2.166;;
}

}
.textarea, input{ background-color: #E3E0D9;     padding: 3.5dvh 2dvh; border-radius: 8px; width: 100%;
    border: 0px ; height: 50px; margin-bottom: 10px;     font-size: 2.0dvh; }

.submit_btn_limpo{
    cursor: pointer;
}

.margen_negativa { margin-top: -50px ;}

.voltar_btn { border: 3px solid var(---866695); background: #866695CC 0% 0% no-repeat padding-box; 
    border: 3px solid #866695; border-radius: 90px; opacity: 1; backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px); color: white; width: fit-content; padding: 3px 10px; font-weight: bold;
    left: 30px;     position: absolute;  top: 9dvh; letter-spacing: 0.5px; z-index: 2;

    font-size: 2dvh;
}
.voltar_btn:hover{ 
    color:white; 
}

.submit_btn_limpo { padding: 0px; border:none; }

.quiz-form {
    padding: 1dvh 0dvh;
}

.quiz-options {
  display: flex; flex-direction: column;   gap: 1.5dvh;
}

.option { 
    display: flex;
    align-items: center;
    border-radius: 30px;
    padding: 1.45dvh 14px;
    gap: 1.2dvh;
    cursor: pointer;
    border: 2px solid transparent;
    margin-bottom: -8px;
    margin-bottom: -6px;
    background-color: #ffbc00;
    font-size: 2.1dvh;
    color: white;
    font-weight: bold;
}
.option svg { fill: #fff!important; }

.hide { display:none}

.option-2 { 
  background-color: #008b9a;
}
.option-3 {
  background-color: #d22737;
}
.option-4 {
  background-color: #dc7a00;
}
.option-5 {
  background-color: #8e5796;
}
.option-6 {
  background-color: #104a72;
}

.option-7 {
  background-color: #cf87ab;
}
.option-8 {
  background-color: #4d9480;
}



@media(max-width: 640px){
    .mobile-container {  width: 100%; }
}

/* Sessão 1 */
.section-hero {
    /* background: url("./img/bg-top.png") #F0EDE6;
    background-size: contain; background-repeat:  no-repeat;
    background-position-y: -120px; ;
    padding: 20px 20px 30px;
    text-align: center;
    flex-grow: 1; */
    /* background: url(./img/bg-top.png) #F0EDE6; */
    /* background-size: contain; */
    /* background-repeat: no-repeat; */
    /* background-position-y: -26dvh; */
    /* padding: 20px 20px 30px; */
    text-align: center;
    flex-grow: 1;
    position:relative; 
}
.section-hero::before {
  width: 100%; height: 47dvh;  background: url("./img/bg-top.png") #F0EDE6; content: " "; display:block; position:absolute;
  background-size: cover; background-repeat: no-repeat; z-index: 0; background-position-y: bottom; 
}
.section-hero > * { 
  z-index: 1; position:relative;    ;
}
.logo {
    /* width: 60px; */
    width: auto;
    height: 10dvh;
    padding-top: 3dvh;
    margin: 0 auto 12px; display: block;
}

.flor-img {
    max-width: 100%;  margin: 10px auto;  display: block;
}

.title-main { 
    font-weight: 600; color: #333;
}

/* Sessão 2 */
.section-cta {
    background: url("./img/bg-yellow.webp") center/cover no-repeat;  
    /* padding: 30px 20px 40px;  */
    padding: 5dvh 4dvh 3dvh;
    text-align: center;

    height: 34dvh;
    display: flex;
    flex-direction: column;
    justify-content: center;

}

.section-cta h3 {
    font-size: 18px;  font-weight: 500;   
}

.section-cta p {
    font-size: 14px;  margin-bottom: 18px;
}

.btn-img {
    max-width: 100%;  display: inline-block;    filter: brightness(0.92);
}