.hero { background: var(--color-green); color: var(--color-white); }
.hero__inner { padding-block: var(--space-8) var(--space-9); align-items: center; }
@media (min-width: 56.25em) { .hero__inner { padding-block: 72px 104px; } }
.hero__copy { display: flex; flex-direction: column; gap: 30px; }
.hero__title { margin: 0; color: var(--color-white); }
.hero__lead { margin: 0; font-size: var(--text-xl); line-height: var(--leading-body); color: var(--color-on-dark-muted); max-width: 590px; }
.hero__actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.hero__note { margin: 0; font-size: var(--text-sm); color: var(--color-on-dark-muted); }
.hero__aside { display: flex; flex-direction: column; gap: 14px; }
@media (max-width: 56.24em) { .hero__aside { max-width: 480px; } }