/* ARTMÓVI V3.1 */

:root{
  --am-bege:#dfb078;
  --am-bege-claro:#ead1b5;
  --am-verde:#356f62;
  --am-verde-escuro:#234f46;
  --am-creme:#f7f3ea;
  --am-texto:#171717;
}

/* ===== ABERTURA ===== */

.doubt-hero{
  display:grid !important;
  grid-template-columns:43% 57% !important;
  min-height:610px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:var(--am-bege) !important;
}

.doubt-hero > img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:610px !important;
  margin:0 !important;
  object-fit:cover !important;
  object-position:center !important;
}

.doubt-hero > div{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  padding:65px 70px !important;
}

.doubt-hero h1{
  max-width:750px !important;
  margin:0 0 28px !important;
  color:#111 !important;
  font-size:clamp(38px,4.1vw,64px) !important;
  line-height:1.05 !important;
  font-weight:600 !important;
  letter-spacing:-1.4px !important;
}

.doubt-hero p{
  max-width:680px !important;
  margin:0 !important;
  color:#171717 !important;
  font-size:19px !important;
  line-height:1.65 !important;
}


/* ===== A VERDADE É QUE ===== */

.photo-band{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  min-height:620px !important;
  padding:65px 30px !important;

  background:
    linear-gradient(rgba(0,0,0,.06),rgba(0,0,0,.06)),
    url('/assets/img/duvidas-tapete.png') center center/cover no-repeat !important;

  overflow:hidden !important;
}

.photo-band > div{
  position:relative !important;
  z-index:2 !important;

  width:min(640px,84%) !important;
  padding:50px 55px !important;
  margin:0 auto !important;

  background:rgba(218,177,143,.94) !important;

  color:#151515 !important;
  font-size:19px !important;
  line-height:1.65 !important;

  box-shadow:0 20px 55px rgba(0,0,0,.16) !important;
}


/* ===== LINHAGEM ===== */

.lineage{
  display:grid !important;
  grid-template-columns:46% 54% !important;
  min-height:640px !important;

  padding:0 !important;
  margin:0 !important;

  overflow:hidden !important;
  background:var(--am-bege) !important;
}

.lineage-photo{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:640px !important;

  margin:0 !important;
  float:none !important;

  object-fit:cover !important;
  object-position:center !important;
}

.lineage-copy{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;

  padding:65px !important;
  margin:0 !important;

  color:#111 !important;
}

.lineage-copy h2{
  margin:0 0 28px !important;

  font-size:clamp(32px,3.2vw,48px) !important;
  line-height:1.12 !important;
  letter-spacing:-.8px !important;

  color:#111 !important;
}

.lineage-copy p{
  margin:0 !important;

  max-width:700px !important;

  font-size:18px !important;
  line-height:1.7 !important;

  color:#171717 !important;
}


/* ===== 5 MITOS ===== */

.myths-section{
  padding:75px 30px 80px !important;
  text-align:center !important;
  background:var(--am-creme) !important;
}

.myths-section h2{
  max-width:850px !important;

  margin:0 auto 45px !important;

  color:var(--am-verde-escuro) !important;

  font-size:clamp(34px,4vw,55px) !important;
  line-height:1.12 !important;
  letter-spacing:-1px !important;
}

.myths-art{
  width:min(850px,94%) !important;
  margin:0 auto !important;
}

.myths-art img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  margin:0 auto !important;

  box-shadow:0 18px 48px rgba(0,0,0,.10) !important;
}


/* ===== SESSÃO DE ALÍVIO ===== */

.doubt .cta{
  padding:80px 30px !important;

  text-align:center !important;

  background:var(--am-verde) !important;
  color:#fff !important;
}

.doubt .cta h2{
  max-width:900px !important;

  margin:0 auto 30px !important;

  color:#fff !important;

  font-size:clamp(34px,4vw,56px) !important;
  line-height:1.12 !important;
}

.doubt .cta p{
  max-width:820px !important;

  margin:0 auto 35px !important;

  color:#fff !important;

  font-size:18px !important;
  line-height:1.7 !important;
}


/* ===== VOCÊ TEM DUAS OPÇÕES ===== */

.choice-section{
  display:grid !important;
  grid-template-columns:54% 46% !important;

  min-height:700px !important;

  padding:0 !important;
  margin:0 !important;

  background:var(--am-bege-claro) !important;
  overflow:hidden !important;
}

.choice-copy{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;

  padding:70px 7vw !important;
}

.choice-copy h2{
  margin:0 0 38px !important;

  color:var(--am-verde-escuro) !important;

  font-size:clamp(40px,4.5vw,64px) !important;
  line-height:1.05 !important;
  letter-spacing:-1.2px !important;
}

.choice-option{
  max-width:650px !important;

  margin-bottom:25px !important;
  padding-bottom:22px !important;

  border-bottom:1px solid rgba(35,79,70,.20) !important;
}

.choice-option strong{
  color:var(--am-verde-escuro) !important;
  font-size:20px !important;
}

.choice-option p{
  margin:7px 0 0 !important;

  color:#222 !important;

  font-size:17px !important;
  line-height:1.6 !important;
}

.choice-final{
  margin:5px 0 28px !important;

  color:#111 !important;

  font-size:22px !important;
}

.choice-copy .btn{
  align-self:flex-start !important;
}

.choice-photo{
  min-height:700px !important;
  overflow:hidden !important;
}

.choice-photo img{
  display:block !important;

  width:100% !important;
  height:100% !important;
  min-height:700px !important;

  object-fit:cover !important;
  object-position:center !important;

  filter:grayscale(100%) contrast(1.03) !important;
}


/* ===== MOBILE ===== */

@media(max-width:800px){

  .doubt-hero{
    grid-template-columns:1fr !important;
  }

  .doubt-hero > img{
    min-height:400px !important;
    height:52vh !important;
    max-height:530px !important;
  }

  .doubt-hero > div{
    padding:42px 27px 48px !important;
  }

  .doubt-hero h1{
    font-size:38px !important;
    letter-spacing:-.7px !important;
  }

  .doubt-hero p{
    font-size:17px !important;
  }

  .photo-band{
    min-height:540px !important;
    padding:35px 20px !important;
  }

  .photo-band > div{
    width:100% !important;
    padding:34px 27px !important;
    font-size:17px !important;
  }

  .lineage{
    grid-template-columns:1fr !important;
  }

  .lineage-photo{
    min-height:480px !important;
    height:60vh !important;
    max-height:620px !important;
  }

  .lineage-copy{
    padding:45px 28px 52px !important;
  }

  .lineage-copy h2{
    font-size:33px !important;
  }

  .myths-section{
    padding:55px 20px !important;
  }

  .myths-section h2{
    font-size:35px !important;
    margin-bottom:32px !important;
  }

  .myths-art{
    width:100% !important;
  }

  .choice-section{
    grid-template-columns:1fr !important;
  }

  .choice-copy{
    padding:55px 28px !important;
  }

  .choice-copy h2{
    font-size:42px !important;
  }

  .choice-photo{
    min-height:520px !important;
  }

  .choice-photo img{
    min-height:520px !important;
    height:65vh !important;
  }
}

/* ==========================================================
   V3.1.1 — FOTO "A VERDADE É QUE"
   Foto livre + texto abaixo
   ========================================================== */

.photo-band{
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    align-items:stretch !important;

    min-height:760px !important;
    padding:0 !important;

    background-image:url('/assets/img/duvidas-tapete.png') !important;
    background-size:cover !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
}

.photo-band::before{
    display:none !important;
}

.photo-band > div{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:38px 9vw !important;

    background:#d9ad89 !important;

    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;

    color:#171717 !important;
    font-size:18px !important;
    line-height:1.65 !important;
}

/* limita a largura visual do texto sem cobrir a fotografia */
.photo-band > div{
    padding-left:max(9vw, calc((100% - 1050px)/2)) !important;
    padding-right:max(9vw, calc((100% - 1050px)/2)) !important;
}

@media(max-width:800px){
    .photo-band{
        min-height:650px !important;
        background-size:cover !important;
        background-position:center top !important;
    }

    .photo-band > div{
        padding:30px 26px !important;
        font-size:16px !important;
        line-height:1.6 !important;
    }
}

/* ==========================================================
   V3.1.2 — OS 5 MITOS
   ========================================================== */

.myths-section{
    padding:70px 30px 85px !important;
    background:#d5ad8e !important;
}

.myths-art{
    width:min(650px,92%) !important;
    margin:0 auto 55px !important;
}

.myths-art img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    box-shadow:none !important;
}

.myths-content{
    width:min(1050px,92%) !important;
    margin:0 auto !important;
    text-align:left !important;
}

.myths-content h2{
    max-width:none !important;
    margin:0 0 38px !important;

    color:#111 !important;

    font-size:clamp(34px,3.5vw,50px) !important;
    line-height:1.1 !important;
    font-weight:700 !important;
    letter-spacing:-1px !important;
}

.myth-item{
    padding:0 0 25px !important;
    margin:0 0 25px !important;

    border-bottom:1px solid rgba(0,0,0,.15) !important;
}

.myth-item:last-child{
    border-bottom:0 !important;
    margin-bottom:0 !important;
}

.myth-item h3{
    margin:0 0 8px !important;

    color:#111 !important;

    font-size:19px !important;
    line-height:1.4 !important;
    font-weight:700 !important;
}

.myth-item p{
    margin:0 !important;

    color:#171717 !important;

    font-size:17px !important;
    line-height:1.65 !important;
}

.myth-item p strong{
    color:#24584e !important;
    font-weight:800 !important;
}

@media(max-width:800px){

    .myths-section{
        padding:45px 20px 55px !important;
    }

    .myths-art{
        width:100% !important;
        margin-bottom:40px !important;
    }

    .myths-content{
        width:100% !important;
    }

    .myths-content h2{
        font-size:34px !important;
        margin-bottom:32px !important;
    }

    .myth-item h3{
        font-size:18px !important;
    }

    .myth-item p{
        font-size:16px !important;
    }
}
