/* =============================================
   WORKSHOP CARD IMAGE FULL-HEIGHT FIX
   ============================================= */

/* The parent card MUST have flex layout for children to stretch */
#workshops .grid.lg\:grid-cols-2 > div {
  display: flex !important;
  flex-direction: column !important;
}

/* Inner grid wrapper: flexes to fill card height */
#workshops .grid.lg\:grid-cols-2 > div > .grid {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* Image column container */
#workshops .grid.md\:grid-cols-\[200px_1fr\] > div:first-child {
  height: 280px !important;
  min-height: 280px !important;
  max-height: none !important;
  overflow: hidden !important;
  position: relative !important;
  display: block !important;
  flex: none !important;
}

/* The actual image */
#workshops .grid.md\:grid-cols-\[200px_1fr\] > div:first-child img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

/* Desktop */
@media screen and (min-width: 768px) {
  #workshops .grid.md\:grid-cols-\[200px_1fr\] {
    grid-template-columns: 200px 1fr !important;
    align-items: stretch !important;
    height: 100% !important;
    min-height: 380px !important;
  }
  
  #workshops .grid.md\:grid-cols-\[200px_1fr\] > div:first-child {
    height: 100% !important;
    min-height: 380px !important;
    grid-row: 1 / -1 !important;
  }
  
  #workshops .grid.md\:grid-cols-\[200px_1fr\] > div:first-child img {
    height: 100% !important;
    min-height: 380px !important;
  }
}