.cargo-types-home {
  padding-block: var(--space-2xl);
  background: var(--color-surface-dark);
  color: var(--color-on-accent);
}

.cargo-types-home__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-md);
  margin-block-end: calc(var(--space-2xl) + var(--space-sm));
}

.cargo-types-home__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: minmax(8.75rem, auto);
}

.cargo-types-home__tile { min-width: 0; }
.cargo-types-home__tile--image { position: relative; overflow: hidden; }
.cargo-types-home__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cargo-types-home__tile--text {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-md);
  border-block-end: 1px solid var(--color-border-subtle);
}
.cargo-types-home__icon { width: var(--space-md); height: var(--space-md); color: var(--color-border-subtle); }
.cargo-types-home__content {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: calc(var(--space-sm) / 2);
}
.cargo-types-home__card-title,
.cargo-types-home__description { margin: 0; overflow-wrap: anywhere; }
.cargo-types-home__card-title {
  font-size: var(--fs-transport-card-title);
  font-weight: 274;
  line-height: var(--lh-tight);
  letter-spacing: -.03em;
}
.cargo-types-home__description {
  color: var(--color-text-muted);
  font-size: var(--fs-body);
  line-height: var(--lh-tight);
  letter-spacing: -.03em;
}

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

@media (width <= 48rem) {
  .cargo-types-home { padding-block: var(--space-xl); }
  .cargo-types-home__heading { gap: var(--space-sm); margin-block-end: var(--space-xl); }
  .cargo-types-home__grid { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; }
  .cargo-types-home__tile--image { min-height: 11rem; }
  .cargo-types-home__tile--text { min-height: 8rem; padding-inline: var(--space-sm); }
}