/* ==========================================================
   M3 TECHNOLOGY V6.3
   Acabamento desktop: hero, header e grade do catálogo.
   Não altera dados, marcas, painel ou estrutura PHP.
   ========================================================== */

/* 1. HERO — elimina o aspecto de corte vertical da V6.2.
   A transição passa a ser curta e suave, preservando KU e roteador. */
@media(min-width:761px){
  .project-hero-art{
    overflow:hidden !important;
  }

  .project-hero-art img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:60% center !important;
    transform:scale(1.008) !important;
    transform-origin:center center !important;
    filter:saturate(1.045) contrast(1.018) brightness(1.018) !important;
  }

  .project-hero-art::before{
    content:"" !important;
    position:absolute !important;
    inset:0 auto 0 0 !important;
    width:18% !important;
    height:100% !important;
    z-index:2 !important;
    pointer-events:none !important;
    background:linear-gradient(
      90deg,
      #04142a 0%,
      rgba(4,20,42,.84) 18%,
      rgba(4,20,42,.42) 48%,
      rgba(4,20,42,.12) 76%,
      rgba(4,20,42,0) 100%
    ) !important;
  }

  /* 2. HEADER — busca ligeiramente mais confortável sem pesar */
  .project-nav{
    grid-template-columns:150px auto minmax(390px,470px) 44px !important;
    gap:22px !important;
  }
  .project-search{
    min-width:0 !important;
    width:100% !important;
  }
  .project-search input{
    width:100% !important;
  }

  /* 3. CATÁLOGO — mais largura útil para formar grade elegante */
  .catalog-section .container{
    max-width:1240px !important;
  }
  .catalog-grid,
  .products-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:24px !important;
    align-items:start !important;
  }

  /* Mantém o card atual com proporção profissional quando houver poucos itens */
  .catalog-grid > *,
  .products-grid > *{
    min-width:0 !important;
  }
}

/* Em desktops muito largos, permite quatro produtos sem deixar cards enormes */
@media(min-width:1450px){
  .catalog-section .container{
    max-width:1360px !important;
  }
  .catalog-grid,
  .products-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}

/* Tablet: duas colunas, sem interferir no mobile já refinado na V6.2 */
@media(min-width:761px) and (max-width:1050px){
  .project-nav{
    grid-template-columns:130px auto minmax(260px,1fr) 44px !important;
    gap:14px !important;
  }
  .catalog-grid,
  .products-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* Não altera comportamento mobile da V6.2 */