.landing { max-width: 1040px; margin: 0 auto; padding: var(--sp-7) var(--sp-4) var(--sp-6); }
.hero { max-width: 680px; margin-bottom: var(--sp-7); }
.hero h1 { font-size: var(--fs-2xl); margin-bottom: var(--sp-4); }
.hero p { font-size: var(--fs-lg); }
.hero-actions { margin-top: var(--sp-5); }
.roles .card { padding: var(--sp-4); }
.landing-footer {
  display: flex; flex-wrap: wrap; gap: var(--sp-3); justify-content: space-between; align-items: center;
  max-width: 1040px; margin: 0 auto; padding: var(--sp-4);
  border-top: 1px solid var(--c-border);
}
@media (max-width: 560px) {
  .landing { padding-top: var(--sp-5); }
  .hero h1 { font-size: var(--fs-xl); }
  .hero p { font-size: var(--fs-md); }
}