/* Keep images in the same grid cell while the two slides move horizontally. */
.hero { display: grid; overflow: hidden; }
.hero-slide { grid-area: 1 / 1; min-width: 0; }
.slide-controls { bottom: 10px; z-index: 2; gap: 10px; align-items: center; }
.slide-controls button {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
}
.slide-controls button[aria-pressed="true"] { background: #195fbc; }