/* Reset legacy production rules that conflict with the approved v2 interface. */
.hero {
  display: block;
  grid-template-columns: none;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 78px 0 92px;
}

.hero h1 {
  max-width: 650px;
  margin: 23px 0;
}

.section.shell {
  max-width: 1180px;
  padding-left: 0;
  padding-right: 0;
}

.course {
  padding: 0;
}

.course footer {
  padding: 15px 0 0;
  background: transparent;
  color: inherit;
}

.steps article {
  border: 0;
  border-bottom: 1px solid #ded7ca;
  border-radius: 0;
  background: transparent;
}

@media (min-width: 1280px) {
  .shell {
    width: min(1280px, calc(100% - 64px));
  }

  .section.shell {
    max-width: 1280px;
  }

  .hero-grid {
    gap: 92px;
  }

  .lesson {
    width: min(100%, 490px);
  }
}

@media (max-width: 620px) {
  .hero {
    padding: 46px 0 60px;
  }

  .section.shell {
    padding-left: 0;
    padding-right: 0;
  }
}