/* --- CARD MARCHIO: uniforma dimensioni loghi, niente tagli --- */
.daleo-related-grid{display:flex;flex-direction:row;gap:25px;}

.daleo-marchio-card {
  position: relative;
  display: inline-block;
  max-width: 250px;

  /* Altezza uniforme per tutte le card */
  aspect-ratio: 1 / 1;       /* cambia se vuoi (es 1/1 per quadrate) */
  min-height: 140px;         /* fallback se aspect-ratio non supportato */

  /* Il logo è un background: vogliamo vederlo tutto */
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;

  /* Sfondo trasparente */
  background-color: transparent;

  /* “respiro” interno: evita che il logo tocchi i bordi */
  padding: 18px;

  /* estetica */
  box-shadow: 1px 1px 44px -20px rgba(0,0,0,0.7);
-webkit-box-shadow: 1px 1px 44px -20px rgba(0,0,0,0.7);
-moz-box-shadow: 1px 1px 44px -20px rgba(0,0,0,0.7);
  overflow: hidden;

  /* optional: micro-interazione */
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.daleo-marchio-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(0,0,0,0.10);
}

/* Overlay e titolo: per i marchi spesso il titolo non serve sempre visibile.
   Se vuoi tenerlo: lo metti in basso e appare al hover. */
.daleo-marchio-card .daleo-ambienti-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
  opacity: 0;
  transition: opacity .18s ease;
}

.daleo-marchio-card .daleo-ambienti-title {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  color: #fff;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .18s ease, transform .18s ease;
}

.daleo-marchio-card:hover .daleo-ambienti-overlay {
  opacity: 1;
}
.daleo-marchio-card:hover .daleo-ambienti-title {
  opacity: 1;
  transform: translateY(0);
}