﻿/* Page-specific styles for solution-financial-services-investment-stock-market-funds */
/* Add overrides here — never edit compat.css for page-specific changes */

/*
 * The shared compatibility layer also uses .swip, .items1, and .items2 for
 * unrelated card grids. On this page those classes only describe alternating
 * image/text rows, so reset the card treatment and restore a true two-column
 * layout.
 */
.stock-use-cases .swip {
  display: flex;
  grid-template-columns: none;
  align-items: flex-start;
  gap: 0;
}

.stock-use-cases .swip > .items1,
.stock-use-cases .swip > .items2 {
  display: block;
  width: 100%;
  min-width: 0;
  padding-block: 0;
  padding-inline: .75rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.stock-use-cases .swip > .items1:hover,
.stock-use-cases .swip > .items2:hover {
  border-color: transparent;
  box-shadow: none;
}

.stock-use-cases .swip > .items2 img {
  display: block;
  width: 100%;
  height: auto;
}

@media (min-width: 992px) {
  .stock-use-cases .swip > .items1,
  .stock-use-cases .swip > .items2 {
    width: 50%;
  }
}

@media (max-width: 991.98px) {
  .stock-use-cases .swip > .items1 {
    order: 1;
  }

  .stock-use-cases .swip > .items2 {
    order: 2;
  }
}
