.textmedia {
  display: grid;
  gap: var(--g-gap);
  grid-template-columns: 1fr;
}

.textmedia__image {
  overflow: hidden;
  min-height: auto;
  aspect-ratio: 3 / 2;
  margin-left: -4vw;
  margin-right: -4vw;

  & .gallery__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.textmedia__text {
  text-wrap: balance;
}

.textmedia__content {
  width: calc(100% - 20px);
  align-self: center;
  justify-self: center;
}


/* =============================================================================
   Media Queries
   ========================================================================== */

@media (min-width: 640px) {
  .textmedia__image {
    border-radius: var(--b-radius-s);
    margin-left: 0;
    margin-right: 0;
  }

  .textmedia__content {
    width: 90%;
  }
}

@media (min-width: 800px) {
  .textmedia {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    grid-auto-flow: dense;
  }

  .textmedia__content {
    width: 100%;
  }

  .textmedia__image {
    aspect-ratio: auto;
    min-height: 50vw;
  }

  .textmedia.-right {
    direction: rtl;
  }

  .textmedia.-left {
    text-align: right;
  }

  .textmedia.-left .textmedia__content {
    padding: 0 40px 0 0;
  }

  .textmedia.-right .textmedia__content {
    padding: 0 0 0 40px;
    direction: ltr;
  }
}

@media (min-width: 1280px) {
  .textmedia .textmedia__content {
    padding: var(--p) 4rem !important;
  }

  .textmedia__image {
    min-height: 570px;
  }
}

@media (min-width: 1700px) {
  .textmedia.-left .textmedia__image {
    margin-right: -120px;
  }

  .textmedia.-right .textmedia__image {
    margin-left: -120px;
  }
}