
/* ==========================================================
   M3 TECHNOLOGY — MOBILE V2.5
   Refinamento visual do carrossel da Home — SOMENTE MOBILE
   Desktop permanece intacto.
   ========================================================== */

@media(max-width:760px){

  /* Card ativo ocupa mais espaço; apenas uma pequena faixa
     do próximo item permanece visível para sugerir swipe. */
  .catalog-section .product-grid{
    gap:10px!important;
    width:calc(100% + 12px)!important;
    margin-right:-12px!important;
    padding-right:12px!important;
    padding-bottom:10px!important;
  }

  .catalog-section .product-grid .product-card{
    flex:0 0 94%!important;
    width:94%!important;
  }

  /* Pequeno refinamento de presença do card */
  .catalog-section .product-grid .product-card{
    border-radius:16px!important;
    box-shadow:0 10px 24px rgba(6,28,52,.055)!important;
  }

  /* Mais respiro entre card e controles do carrossel */
  .m3-mobile-carousel-ui{
    gap:13px!important;
    margin-top:12px!important;
  }

  /* Hint discreto */
  .m3-carousel-hint{
    font-size:12px!important;
    color:#83909f!important;
  }

  .m3-carousel-hint .arrow{
    font-size:18px!important;
  }

  /* Indicadores mais evidentes */
  .m3-carousel-dots{
    gap:8px!important;
    min-height:12px!important;
  }

  .m3-carousel-dot{
    width:6px!important;
    height:6px!important;
    background:#d5dce5!important;
  }

  .m3-carousel-dot.is-active{
    width:24px!important;
    height:6px!important;
    background:#0b8ef3!important;
  }

  /* Botão "Ver todos" mais limpo */
  .m3-carousel-all{
    min-height:48px!important;
    border-radius:13px!important;
    font-size:13.5px!important;
    box-shadow:0 4px 12px rgba(8,30,52,.035)!important;
  }
}

@media(max-width:390px){
  .catalog-section .product-grid .product-card{
    flex-basis:95%!important;
    width:95%!important;
  }
}
