.block-location {
  display: grid;
  grid-template-columns: subgrid;

  > div {
    grid-column: start / end;
    display: grid;
    row-gap: 2rem;
    column-gap: 2rem;

    @media (width > 650px) {
      grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
    }
  }
}

.block-location-map {
  margin: 0;
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  background-color: color-mix(in srgb, var(--color-bg), black 10%);
  padding: 0.5rem;
  border-radius: 1rem;

  iframe {
    width: 100%;
    height: 100%;
    min-height: 300px;
    border: none;
    outline: 0;
    border-radius: 0.5rem;
  }
  figcaption {
    flex: 0 0 auto;
    p {
      margin: 0;
    }
  }
}

.block-location-directions {
  display: grid;
  row-gap: 2em;

  ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    row-gap: 2em;
  }

  li {
    display: flex;
    column-gap: 1rem;
  }

  h3, p {
    margin: 0;
  }
  h3 {
    margin-bottom: 0.25rem;
  }
  p {
    margin-top: 0.25rem;
  }
  svg {
    width: 2em;
    height: 2em;
    flex: 0 0 auto;
  }
}
