/**
 * @file
 * Styles for divisions sub-section content — Partners grid + Video embed.
 * Self-contained, no dependency on legacy .imageWrap / .carou-slide / .crslHldr.
 */

/* Responsive 16:9 video container — works for <video> and <iframe>. */
.ekk-division-video {
  margin: 20px auto 30px;
  max-width: 900px;
  padding: 0 15px;
  box-sizing: border-box;
}
.ekk-division-video .ekk-division-video__frame {
  position: relative;
  aspect-ratio: 16 / 9;
  background: #000;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.ekk-division-video .ekk-division-video__frame > video,
.ekk-division-video .ekk-division-video__frame > iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
@media (max-width: 575px) {
  .ekk-division-video {
    margin: 14px auto 20px;
    padding: 0 10px;
  }
}

.ekk-division-partners {
  margin: 30px auto;
  text-align: center;
}

.ekk-division-partners h2.text-center.lined {
  margin-bottom: 25px;
}

/* Auto-flow grid: target 5-6 cards per row on a 1170px container by setting
   minmax(180px, 1fr). Cards naturally re-flow on narrower viewports. */
.ekk-partners-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 20px;
  max-width: 1170px;
  margin: 0 auto;
  padding: 0 15px;
  box-sizing: border-box;
}

.ekk-partner-card {
  text-align: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

/* Uniform image area: every logo shows in the same fixed-height box so the
   row of cards lines up visually regardless of native logo dimensions.
   object-fit: contain ensures no logo is ever cropped. */
.ekk-partner-card .ekk-partner-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 110px;
  padding: 12px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  border-radius: 2px;
  box-sizing: border-box;
  overflow: hidden;
}
.ekk-partner-card .ekk-partner-image a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border: 0;
}
.ekk-partner-card .ekk-partner-image img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border: 0;
}

/* Title is rendered in the paragraph markup but hidden from display until
   editors clean up the auto-derived names. Re-enable by deleting this rule. */
.ekk-partner-card .ekk-partner-title {
  display: none;
}

/* Tighten on tablet — still uniform but smaller box. */
@media (max-width: 991px) {
  .ekk-partners-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 15px;
  }
  .ekk-partner-card .ekk-partner-image {
    height: 90px;
    padding: 10px;
  }
}

/* Mobile — 2 per row, smaller box. */
@media (max-width: 575px) {
  .ekk-partners-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 0 10px;
  }
  .ekk-partner-card .ekk-partner-image {
    height: 80px;
    padding: 8px;
  }
}