/* =========================================================
   ASD PALLAVOLO CINECITTÀ
   SQUADRE DINAMICHE - GRAFICA COMPATTA V1.1
   Sostituire interamente: assets/css/squadre-dinamiche.css
   ========================================================= */

.squadre-grid{
  align-items:stretch;
  gap:24px;
}

.squadra-card{
  overflow:hidden;
  padding:0;
  display:flex;
  flex-direction:column;
  min-height:0;
  border-radius:16px;
  background:#fff;
}

.squadra-image-wrap{
  width:100%;
  height:165px;
  padding:16px;
  background:#f7f9fc;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-bottom:1px solid #e7ebf1;
}

.squadra-image{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  background:transparent;
}

.squadra-card-body{
  padding:20px 22px 22px;
  display:flex;
  flex-direction:column;
  flex:1;
}

.squadra-category{
  display:inline-block;
  width:max-content;
  margin:0 0 7px;
  font-size:.76rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.045em;
  color:#0b3578;
}

.squadra-card h3{
  margin:0 0 10px;
  color:#2358c7;
  font-size:1.28rem;
  line-height:1.2;
}

.squadra-description{
  margin:0;
  color:#17233b;
  line-height:1.5;
  font-size:.96rem;
}

.squadra-details{
  border-top:1px solid #e1e7f0;
  padding-top:12px;
  margin-top:16px;
}

.squadra-detail{
  margin:5px 0;
  color:#17233b;
  font-size:.9rem;
  line-height:1.4;
}

.squadra-detail strong{
  color:#091f46;
}

.squadra-loading{
  grid-column:1/-1;
  min-height:auto;
}

/* Card senza immagine: niente spazio vuoto artificiale */
.squadra-card:not(:has(.squadra-image-wrap)) .squadra-card-body{
  min-height:220px;
}

/* Card con immagine: struttura più compatta e bilanciata */
.squadra-card:has(.squadra-image-wrap) .squadra-card-body{
  min-height:0;
}

/* Desktop */
@media (min-width:1100px){
  .squadre-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

/* Tablet */
@media (min-width:701px) and (max-width:1099px){
  .squadre-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Mobile */
@media (max-width:700px){
  .squadre-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  .squadra-image-wrap{
    height:150px;
    padding:14px;
  }

  .squadra-card-body{
    padding:18px;
  }

  .squadra-card:not(:has(.squadra-image-wrap)) .squadra-card-body{
    min-height:0;
  }

  .squadra-card h3{
    font-size:1.18rem;
  }

  .squadra-detail{
    font-size:.88rem;
  }
}