.hero {
  display: flex;
  align-items: center;
  min-height: calc(100vh - 74px);
  padding: 82px 0 92px;
}

.hero-copy { max-width: 760px; }

.feature,
.feature.reverse {
  display: block;
  padding: 72px 0;
  border-top: 1px solid var(--line);
}

.feature-copy {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  column-gap: 40px;
  max-width: 900px;
}

.feature:nth-of-type(even) .feature-copy { margin-left: auto; }
.feature-index { grid-row: 1 / 6; color: var(--muted); font-size: 13px; }
.feature-tag,
.feature-copy h2,
.feature-copy p,
.feature-copy ul,
.feature-copy .inline-link { grid-column: 2; }

.feature-note {
  margin-top: 24px !important;
  padding: 20px 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .025);
  color: var(--soft) !important;
  font-size: 15px !important;
}

@media (max-width: 900px) {
  .hero { min-height: auto; padding-top: 65px; }
  .feature,
  .feature.reverse { padding: 62px 0; }
  .feature-copy { max-width: 760px; }
}

@media (max-width: 600px) {
  .hero { padding: 58px 0 74px; }
  .feature,
  .feature.reverse { padding: 52px 0; }
  .feature-copy { display: block; }
  .feature-index { display: block; margin-bottom: 28px; }
}
