.direction-delivery {
  background: var(--color-surface-dark);
  color: var(--color-on-accent);
}

.direction-delivery__header {
  --container-max: 100%;
  --container-gutter: clamp(1.25rem, 4.8611vw, 5.625rem);
  padding-block: clamp(3rem, 4.1667vw, 4.75rem) clamp(2rem, 2.7778vw, 3.25rem);
}

.direction-delivery__heading {
  font-size: clamp(2rem, 3.3333vw, 3.75rem);
}

.direction-delivery__row {
  border-block: 1px solid var(--color-border-strong);
  padding-inline: clamp(var(--container-gutter), 3.4722vw, 3.125rem);
}

.direction-delivery__items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  background: var(--color-border-subtle);
  list-style: none;
}

.direction-delivery__item {
  min-width: 0;
  min-height: clamp(14.625rem, 16.25vw, 18.5625rem);
  padding: clamp(2rem, 2.2222vw, 2.5rem);
  background: var(--color-surface-dark);
}

.direction-delivery__icon {
  display: grid;
  place-items: center;
  width: clamp(var(--size-direction-icon), 3.3333vw, 3.8125rem);
  height: clamp(var(--size-direction-icon), 3.3333vw, 3.8125rem);
  margin-block-end: clamp(2rem, 2.45vw, 2.8125rem);
  color: var(--color-border-subtle);
}

.direction-delivery__icon svg {
  display: block;
  width: clamp(1.625rem, 1.8056vw, 2.0625rem);
  height: clamp(1.625rem, 1.8056vw, 2.0625rem);
}

.direction-delivery__copy { display: grid; gap: clamp(var(--space-xs), .5556vw, .625rem); }

.direction-delivery__title {
  max-width: 28rem;
  margin: 0;
  font-size: clamp(1.125rem, 1.5278vw, 1.75rem);
  font-weight: 274;
  line-height: var(--lh-description);
  letter-spacing: -.03em;
  overflow-wrap: anywhere;
}

.direction-delivery__description {
  margin: 0;
  color: var(--color-text-muted);
  font-size: clamp(var(--fs-body), 1.1111vw, 1.25rem);
  font-weight: 400;
  line-height: var(--lh-tight);
  letter-spacing: -.03em;
  overflow-wrap: anywhere;
}

@media (width < 64rem) {
  .direction-delivery__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .direction-delivery__item { min-height: 0; }
  .direction-delivery__item:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

@media (width <= 48rem) {
  .direction-delivery__header { padding-block: var(--space-xl) var(--space-lg); }
  .direction-delivery__items { grid-template-columns: minmax(0, 1fr); }
  .direction-delivery__item { padding: var(--space-lg) var(--space-sm); }
  .direction-delivery__item:last-child:nth-child(odd) { grid-column: auto; }
  .direction-delivery__icon { margin-block-end: var(--space-md); }
}