/* Sprint 3.16 — correção do Hero da Home da Revista em mobile e em navegadores móveis
   com “Site para computador”. Carregado por último para neutralizar grids desktop. */

@media (max-width:1100px){
  .revista-hero-s21{
    padding:28px 0 38px !important;
    overflow:hidden;
  }

  .revista-hero-s21 .revista-hero-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:28px !important;
    align-items:stretch !important;
    width:100% !important;
    min-width:0 !important;
  }

  .revista-hero-s21 .revista-hero-copy,
  .revista-hero-s21 .revista-hero-carousel,
  .revista-hero-s21 .revista-slide,
  .revista-hero-s21 .revista-slide.is-active,
  .revista-hero-s21 .revista-slide-copy{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .revista-hero-s21 .revista-hero-carousel{
    min-height:0 !important;
  }

  .revista-hero-s21 .revista-slide,
  .revista-hero-s21 .revista-slide.is-active{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    min-height:0 !important;
    border-radius:22px !important;
    overflow:hidden !important;
  }

  .revista-hero-s21 .revista-slide:not(.is-active){
    display:none !important;
  }

  .revista-hero-s21 .revista-slide img{
    grid-row:1 !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:clamp(220px,42vw,340px) !important;
    min-height:0 !important;
    object-fit:contain !important;
    padding:12px !important;
  }

  .revista-hero-s21 .revista-slide-copy{
    grid-row:2 !important;
    display:block !important;
    padding:26px 26px 30px !important;
  }

  .revista-hero-s21 .revista-slide-copy > span{
    display:block !important;
    width:auto !important;
    max-width:100% !important;
  }

  .revista-hero-s21 .revista-slide-copy h2{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:10px 0 12px !important;
    font-size:clamp(1.7rem,4.6vw,2.35rem) !important;
    line-height:1.08 !important;
    letter-spacing:-.025em !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
    hyphens:none !important;
    writing-mode:horizontal-tb !important;
  }

  .revista-hero-s21 .revista-slide-copy p,
  .revista-hero-s21 .revista-slide-copy a{
    width:auto !important;
    max-width:100% !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
  }
}

@media (max-width:680px){
  .revista-hero-s21{
    padding:20px 0 32px !important;
  }

  .revista-hero-s21 .revista-hero-grid{
    gap:22px !important;
  }

  .revista-hero-s21 .revista-slide,
  .revista-hero-s21 .revista-slide.is-active{
    border-radius:18px !important;
  }

  .revista-hero-s21 .revista-slide img{
    height:190px !important;
    padding:8px !important;
  }

  .revista-hero-s21 .revista-slide-copy{
    padding:20px 20px 24px !important;
  }

  .revista-hero-s21 .revista-slide-copy h2{
    font-size:clamp(1.42rem,7vw,1.85rem) !important;
    line-height:1.1 !important;
  }

  .revista-hero-s21 .revista-slide-copy p{
    font-size:.92rem !important;
    line-height:1.5 !important;
  }

  .revista-hero-s21 .revista-carousel-prev,
  .revista-hero-s21 .revista-carousel-next{
    display:none !important;
  }
}

@media (max-width:680px){
 .revista-hero-s21 .revista-hero-copy h1{
   font-size:clamp(2.7rem,10vw,3.8rem)!important;
   line-height:.95!important;
   letter-spacing:-.03em!important;
   margin:12px 0 18px!important;
   max-width:92%!important;
 }
 .revista-hero-s21 .revista-hero-copy p{font-size:1.02rem!important;line-height:1.55!important;margin-bottom:20px!important;max-width:92%!important}
 .revista-hero-s21 .revista-hero-actions{gap:14px!important}
 .revista-hero-s21 .btn-primary{padding:16px 22px!important}
}

/* Sprint 3.18 — alinhamento lateral do Hero apenas no mobile.
   Mantém o conteúdo alinhado à esquerda e cria o mesmo respiro lateral dos demais heros. */
@media (max-width:680px){
  .revista-hero-s21 .revista-hero-grid{
    padding-left:22px !important;
    padding-right:22px !important;
    box-sizing:border-box !important;
  }

  .revista-hero-s21 .revista-hero-copy{
    margin:0 !important;
    padding:0 !important;
    text-align:left !important;
  }

  .revista-hero-s21 .revista-kicker,
  .revista-hero-s21 .revista-hero-copy h1,
  .revista-hero-s21 .revista-hero-copy p{
    margin-left:0 !important;
    margin-right:0 !important;
    max-width:100% !important;
    text-align:left !important;
  }

  .revista-hero-s21 .revista-hero-actions{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}

@media (max-width:374px){
  .revista-hero-s21 .revista-hero-grid{
    padding-left:18px !important;
    padding-right:18px !important;
  }
}