.content-section {
  margin-block-end: var(--space-section);
}

.content-section:last-child {
  margin-block-end: 0;
}

.content-section__media {
  margin-block: var(--space-h2-text);
  border-radius: var(--radius);
  overflow: hidden;
}

.content-section__media img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.content-section__body > *:first-child {
  margin-block-start: 0;
}

/* Two-column data blocks (e.g. Android / iOS) */
.split-grid {
  display: grid;
  gap: var(--space-card-gap);
  margin-block: var(--space-h2-text);
}

.split-grid__col {
  background: var(--color-bg-dark);
  border-radius: var(--radius);
  padding: var(--space-card-padding);
  min-width: 0; /* allow the column to shrink so inner tables can scroll */
}

.split-grid__head {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-block-end: var(--space-h3-text);
}

.split-grid__icon {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border-radius: var(--radius);
  object-fit: contain;
  background: rgba(255, 255, 255, 0.04);
  padding: 6px;
}

.split-grid__col h3 {
  margin: 0;
}

/* Compatibility tables inside the two-column grid fill the column and wrap
   instead of forcing a horizontal scroll on small screens. */
.split-grid .table-scroll .data-table {
  min-width: 0;
}

@media (min-width: 768px) {
  .split-grid {
    grid-template-columns: 1fr 1fr;
  }
}