:root {
  --row-gap: 1.5rem;
  --column-gap: 0.5rem;
}

.gap-2x {
  gap: 2.5rem 2rem;
}

.flex-row\@lg {
  flex-direction: column;

  @media (width >= 64rem) {
    flex-direction: row;
  }
}

.items-baseline {
  align-items: baseline;
}

.text-indent-continued-lines {
  padding-left: 1rem;
  text-indent: -1rem;
}

.i-sm {
  max-width: 20rem;
}

.i-md {
  max-width: 35rem;
}

.i-lg {
  max-width: 50rem;
}

.grid {
  display: grid;
}

.grid-columns-2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid-columns-4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid-lines {
  column-gap: 0;

  > * {
    border-bottom: 1px solid #000000;
  }
}

.show-child-on-hover {
  .show-me {
    display: inline-block;
    opacity: 0;
  }

  &:hover {
    .show-me {
      opacity: 100;
    }
  }
}

.i-half {
  inline-size: 50%;
}