.directions-section {
  padding-block: var(--space-2xl);
  background: var(--color-footer-background);
  color: var(--color-on-accent);
}
.directions-section--listing {
  padding-block: 0;
  background: var(--color-surface-dark);
}
.directions-section__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  margin-block-end: var(--space-xl);
}
.directions-section__eyebrow {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: var(--fs-body-large);
  font-weight: 274;
  line-height: var(--lh-description);
  letter-spacing: -.03em;
}
.directions-section__title { font-weight: 510; }
.directions-section__grid { border-block: 1px solid var(--color-border-strong); }
.directions-section__grid-inner {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: var(--color-border-subtle);
  background-clip: content-box;
}
.directions-section__footer {
  display: flex;
  justify-content: center;
  margin-block-start: var(--space-xl);
}
.directions-section__more { width: min(100%, 17.3125rem); min-height: var(--size-direction-icon); }

@media (width < 64rem) {
  .directions-section__grid-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (width <= 48rem) {
  .directions-section { padding-block: var(--space-xl); }
  .directions-section--listing { padding-block: 0; }
  .directions-section__heading { margin-block-end: var(--space-lg); }
  .directions-section__eyebrow { font-size: var(--fs-body); }
  .directions-section__grid-inner { grid-template-columns: 1fr; }
  .directions-section__grid-inner.container { padding-inline: 0; }
  .directions-section__footer { margin-block-start: var(--space-lg); }
}
