/* =========================================================
   Component — Showcase row

   Copy on one side, a drawn stage on the other. The flipped
   variant swaps them, so a page of several rows makes the eye
   cross it instead of running down one gutter.
   ========================================================= */
.showcase__inner {
  display: grid;
  gap: var(--space-12);
  align-items: center;
}
.showcase__copy .section-head__title { margin-bottom: var(--space-4); }

.showcase__stage {
  position: relative;
  padding-block-end: var(--space-16);
}

@media (min-width: 980px) {
  .showcase__inner { grid-template-columns: 1fr 1.1fr; }
  .showcase--flip .showcase__copy { order: 2; }
  .showcase--flip .showcase__stage { order: 1; }
}