/* Section 61 (8 column ad banners) – force full-width, no vertical white gap */

/* Generic selectors fallback because final wrapper id may vary; target section id if present */
#section-wrapper-61, [data-section-id="61"], section[id*="61"] {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#section-wrapper-61 .section-content-area,
[data-section-id="61"] .section-content-area,
section[id*="61"] .section-content-area {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* Remove extra space before/after title */
#section-wrapper-61 .homepage-section-title,
[data-section-id="61"] .homepage-section-title,
section[id*="61"] .homepage-section-title {
  margin: 0 !important;
  padding: 4px 0 6px 0 !important;
  line-height: 1.1 !important;
}

/* Ensure wrapper hugs its content */
#section-wrapper-61 .ad-grid-wrapper,
[data-section-id="61"] .ad-grid-wrapper,
section[id*="61"] .ad-grid-wrapper {
  margin: 0 auto !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  overflow: hidden;
}

/* Single-row flex mode spacing */
#section-wrapper-61 .ad-grid.single-row-8,
[data-section-id="61"] .ad-grid.single-row-8,
section[id*="61"] .ad-grid.single-row-8 {
  margin: 0 !important;
  padding: 0 4px !important; /* tiny side inset */
  gap: 8px !important;
  align-items: stretch;
}

/* Remove any accidental bottom gap created by line-height or stray blocks */
#section-wrapper-61 .ad-grid-wrapper:after,
[data-section-id="61"] .ad-grid-wrapper:after,
section[id*="61"] .ad-grid-wrapper:after {
  content: '';
  display: block;
  height: 0;
}

/* Tile styling */
#section-wrapper-61 .ad-grid-item,
[data-section-id="61"] .ad-grid-item,
section[id*="61"] .ad-grid-item {
  border-radius: 12px;
  background: transparent;
}
#section-wrapper-61 .ad-grid-item img,
[data-section-id="61"] .ad-grid-item img,
section[id*="61"] .ad-grid-item img {
  border-radius: 12px;
  display: block;
}

/* Smooth horizontal scroll (when overflow-x enabled by JS) */
#section-wrapper-61 .ad-grid-wrapper.is-carousel,
[data-section-id="61"] .ad-grid-wrapper.is-carousel,
section[id*="61"] .ad-grid-wrapper.is-carousel {
  scroll-behavior: smooth;
}

/* Collapse any inserted dotted break lines for this section */
#section-wrapper-61 .ad-grid-break,
[data-section-id="61"] .ad-grid-break,
section[id*="61"] .ad-grid-break { display: none !important; }

/* Remove margin to next section */
#section-wrapper-61 + .homepage-section,
[data-section-id="61"] + .homepage-section,
section[id*="61"] + .homepage-section { margin-top: 0 !important; }

/* Guard: ensure no unexpected min-height on the section container */
#section-wrapper-61, [data-section-id="61"], section[id*="61"] { min-height: 0 !important; }

/* --- Ultra Tight Mode: remove all extra vertical whitespace for section 61 --- */
#section-wrapper-61 .ad-grid-wrapper,
[data-section-id="61"] .ad-grid-wrapper,
section[id*="61"] .ad-grid-wrapper {
  display: block;
  line-height: 0 !important; /* collapse stray line height */
  font-size: 0 !important;   /* remove text node height */
}

#section-wrapper-61 .ad-grid-wrapper .ad-grid,
[data-section-id="61"] .ad-grid-wrapper .ad-grid,
section[id*="61"] .ad-grid-wrapper .ad-grid {
  margin: 0 !important;
  padding: 0 2px 0 2px !important;
  line-height: 0 !important;
  height: auto !important;
}

/* Remove enforced aspect-ratio so height = image intrinsic height - DESKTOP ONLY */
@media (min-width: 992px) {
    #section-wrapper-61 .ad-grid-item,
    [data-section-id="61"] .ad-grid-item,
    section[id*="61"] .ad-grid-item {
      aspect-ratio: auto !important;
      height: auto !important;
      padding: 0 !important;
      margin: 0 !important;
    }

    #section-wrapper-61 .ad-grid-item img,
    [data-section-id="61"] .ad-grid-item img,
    section[id*="61"] .ad-grid-item img {
      display: block;
      width: 100%;
      height: auto !important;
      object-fit: cover;
    }
}

/* Tighten title bar spacing further */
#section-wrapper-61 .homepage-section-title,
[data-section-id="61"] .homepage-section-title,
section[id*="61"] .homepage-section-title {
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* Remove vertical gap before next section completely */
#section-wrapper-61 + .homepage-section,
[data-section-id="61"] + .homepage-section,
section[id*="61"] + .homepage-section {
  margin-top: 2rem !important; /* can set to 0 if you want them touching */
  padding-top: 0 !important;
}

/* Safety: if any empty paragraph/div sneaks in, collapse it */
#section-wrapper-61 .ad-grid-wrapper *:empty { min-height: 0 !important; margin: 0 !important; padding: 0 !important; }

/* === SECTION 61 SINGLE ROW, 4 ITEMS PER FRAME === */
#section-wrapper-61 .ad-grid,
[data-section-id="61"] .ad-grid,
section[id*="61"] .ad-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-x !important;
  cursor: grab !important;
  scrollbar-width: none !important;
}

#section-wrapper-61 .ad-grid::-webkit-scrollbar,
[data-section-id="61"] .ad-grid::-webkit-scrollbar,
section[id*="61"] .ad-grid::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

#section-wrapper-61 .ad-grid-item,
[data-section-id="61"] .ad-grid-item,
section[id*="61"] .ad-grid-item {
  flex: 0 0 calc((100% - 24px) / 4) !important;
  width: calc((100% - 24px) / 4) !important;
  max-width: calc((100% - 24px) / 4) !important;
  min-width: calc((100% - 24px) / 4) !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
  scroll-snap-align: start !important;
}

#section-wrapper-61 .ad-grid-item img,
[data-section-id="61"] .ad-grid-item img,
section[id*="61"] .ad-grid-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  padding: 4px !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}
