.landing {
  padding-top: 28px;
}
.breadcrumbs {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
}
.breadcrumbs a:hover,
.inline-link,
.landing-project a,
.landing-related a,
.landing-grid article > a {
  color: var(--lime);
  text-decoration: underline;
  text-underline-offset: 5px;
}
.landing-hero {
  padding: 72px 0 80px;
  max-width: 1000px;
}
.landing-hero h1 {
  font-size: clamp(36px, 5.6vw, 76px);
  margin: 24px 0;
}
.landing-lead {
  max-width: 790px;
  color: var(--muted);
  font-size: clamp(17px, 2vw, 22px);
}
.landing-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 16px;
  margin-top: 32px;
}
.landing-price strong {
  font-size: 32px;
  color: var(--lime);
  font-weight: 500;
}
.landing-note {
  color: var(--muted);
  font-size: 13px;
  max-width: 690px;
  margin: 16px 0 24px;
}
.landing-section {
  padding: 60px 0;
  border-top: 1px solid var(--border);
}
.landing-section > .eyebrow {
  margin-bottom: 20px;
}
.landing-section h2 {
  max-width: 940px;
  font-size: clamp(30px, 3.5vw, 48px);
  margin-bottom: 32px;
}
.landing-section p {
  color: var(--muted);
  max-width: 900px;
}
.landing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}
.landing-grid-two,
.landing-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 36px;
}
.landing-grid h3,
.landing-panel h3,
.landing-steps h3 {
  font-size: 23px;
  margin-bottom: 16px;
}
.landing-grid article > a {
  display: inline-block;
  margin-top: 20px;
}
.landing-panel {
  padding: 28px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  align-self: start;
}
.landing-columns ul {
  padding-left: 20px;
  margin-top: 24px;
}
.landing-columns li {
  padding: 6px 0;
}
.landing-project img {
  width: 100%;
  height: auto;
  border-radius: var(--radius);
  margin-bottom: 24px;
}
.landing-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px 56px;
  padding-left: 25px;
}
.landing-steps li::marker {
  color: var(--lime);
}
.landing-related {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 32px;
  margin-top: 36px;
}
.landing-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-top: 28px;
}
.landing .faq-list {
  max-width: 950px;
}
.nav [aria-current="page"] {
  color: var(--lime);
}
@media (max-width: 800px) {
  .landing-grid {
    grid-template-columns: 1fr;
  }
  .landing-grid-two,
  .landing-columns {
    grid-template-columns: 1fr;
  }
  .landing-hero {
    padding: 48px 0;
  }
  .landing-section {
    padding: 40px 0;
  }
}
@media (max-width: 500px) {
  .landing-steps {
    grid-template-columns: 1fr;
  }
  .landing-price {
    flex-direction: column;
    gap: 4px;
  }
  .landing-panel {
    padding: 22px;
  }
  .landing-actions .button {
    width: 100%;
    font-size: 14px;
  }
}