
/* Banners mobile corretos D3 */
@media (max-width: 768px){

  body{
    background:#fff !important;
    overflow-x:hidden !important;
  }

  /* INÍCIO: usa a arte mobile vertical somente no banner principal */
  body.d3-home-page .banner,
  body.d3-home-page section.banner,
  body.d3-home-page #inicio.banner{
    background-image:url('/frontend/assets/image/banner-home-mobile.png') !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:cover !important;
    min-height:100dvh !important;
    height:100dvh !important;
    max-height:none !important;
  }

  body.d3-home-page .banner .gold-line,
  body.d3-home-page .banner .parcerias{
    display:none !important;
  }

  /* SERVIÇOS: usa arte mobile no banner do Dia das Mães */
  .maes-banner{
    margin:0 !important;
    padding:0 !important;
    background:#0d0d0d !important;
    min-height:100dvh !important;
    height:100dvh !important;
    overflow:hidden !important;
  }

  .maes-banner-image{
    width:100% !important;
    height:100% !important;
    min-height:100dvh !important;
    margin:0 !important;
    border-radius:0 !important;
    overflow:hidden !important;
  }

  .maes-banner-image img{
    width:100% !important;
    height:100% !important;
    min-height:100dvh !important;
    display:block !important;
    object-fit:cover !important;
  }


  /* Trabalhe conosco sem imagem no fundo */
  body.trabalhe-page,
  body.work-page,
  body.career-page{
    background:linear-gradient(135deg,#0d0d0d 0%,#171717 100%) !important;
  }
}


/* Corrige espaço branco lateral no mobile */
@media (max-width:768px){
  html, body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
    margin:0 !important;
    padding:0 !important;
  }

  *{
    max-width:100vw;
    box-sizing:border-box;
  }

  body.d3-services-page,
  body.d3-home-page{
    min-width:0 !important;
  }

  .top-bar,
  .services-header,
  .header,
  .service-nav,
  .d3-services-catalog,
  .d3-services-grid,
  .maes-banner,
  .maes-banner-image,
  .maes-banner-image img,
  main,
  section{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .maes-banner{
    display:block !important;
  }

  .maes-banner-image{
    display:block !important;
    padding:0 !important;
  }

  .maes-banner-image img{
    display:block !important;
    margin:0 !important;
  }

  .services-header,
  .header{
    left:0 !important;
    right:0 !important;
  }

  .nav-menu{
    max-width:85vw !important;
  }

  .service-nav{
    display:flex !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }

  .service-nav-btn{
    flex:0 0 auto !important;
  }
}
