/*
 * DocMorris Markets & Brands Page Styles
 * Scope: markets/brands card layout and behavior.
 */

/* =========================================================
   20) MARKETS & BRANDS — Brand Cards (UPDATED as requested)
========================================================= */

/* --- Brand Cards --- */
.p-market-n-brand__brandCard{
  display: flex;
  flex-direction: column;
  align-items: center;

  border: 2px solid var(--e-global-color-border);
  border-radius: 1px;

  will-change: box-shadow;
  transition: box-shadow 300ms ease-in-out !important;

  padding: var(--e-global-spacing-40);
  text-decoration: none;
}

.p-market-n-brand__brandCard:hover{
  box-shadow: var(--e-global-shadow-main) !important;
}

.p-market-n-brand__brandCard .p-market-n-brand__brandLogo{
  filter: grayscale(100%) !important;
  transition: 300ms ease-in-out;
}

.p-market-n-brand__brandCard:hover .p-market-n-brand__brandLogo{
  filter: grayscale(0%) !important;
}

.p-market-n-brand__brandsTrack{
  transition: none !important;
}
.p-market-n-brand__brandCard { 
    transition: none !important; 
    aspect-ratio: 1/1 !important;
}

/* Mata el grid “2 filas 1fr” que crea el hueco */
.p-market-n-brand__brandsViewport.elementor-element {
  --e-con-grid-template-rows: auto !important;
  grid-template-rows: auto !important;
  grid-auto-rows: auto !important;
  align-content: start !important;

  height: auto !important;
  min-height: 0 !important;

  padding-bottom: 0 !important; /* por si Elementor mete 3rem */
}

.p-market-n-brand__brandsTrack{
  --card: clamp(140px, 22vw, 190px); /* tamaño estable (min - responsive - max) */
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(var(--card), 1fr)) !important;
  gap: clamp(12px, 3vw, 20px) !important;
  align-items: stretch !important;
}
.p-market-n-brand__brandsViewport{ overflow: hidden !important; }