/* start.css — /get-started wizard layout. Tokens from /static/brand.css. */

.wrap { max-width: 560px; margin: 0 auto; padding: 0 20px; }
.skip-link {
  position: absolute; left: -999px; top: 0; background: var(--ink); color: var(--paper);
  padding: 10px 16px; z-index: 200;
}
.skip-link:focus { left: 12px; top: 12px; }

.start-header { border-bottom: 1px solid var(--line); padding: 14px 0; }
.start-header .wrap { display: flex; align-items: center; max-width: 720px; }

.start-wrap { padding: 32px 20px 80px; max-width: 560px; }

#progress-wrap { margin-bottom: 28px; }
.steps-label { margin: 0 0 8px; font-size: 12px; letter-spacing: .6px; }

.step h1 { margin-bottom: 6px; }
.step > p.muted { margin-bottom: 24px; }

.honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.review-list { margin: 0; }
.review-list dt { font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .6px; color: var(--muted); margin-top: 16px; }
.review-list dt:first-child { margin-top: 0; }
.review-list dd { margin: 2px 0 0; font-size: 15px; }
.calc-note { margin-top: 20px; padding: 12px 14px; background: var(--accent-soft); border-radius: var(--r); }

.form-error { color: var(--bad); background: var(--bad-soft); border-radius: var(--r); padding: 12px 14px; margin: 20px 0 0; }

.nav-row { margin-top: 32px; }

#use-case-chips .chip[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }

@media (max-width: 480px) {
  .start-wrap { padding-top: 20px; }
}