/* ReadySteps docs/design-language.md; shared tokens come from homepage.css. */
.marketing-get-started {
  --setup-heading-size: 28px;
  --setup-subheading-size: 21px;
  --setup-field-size: 24px;
  --setup-caption-size: 14px;
  --setup-lead-size: 20px;
  --setup-field-border: 2px;
  --setup-card-border: 1px;
  --setup-code-tracking: 0.12em;
}
.marketing-get-started h2 { font-size: var(--setup-heading-size); font-weight: 600; line-height: 1.15; }
.marketing-get-started h3 { margin-top: var(--space-lg); font-size: var(--setup-subheading-size); line-height: 1.3; }
.marketing-get-started .setup-intro { background: var(--sky); }
.marketing-get-started .setup-intro h1 + p { margin-top: var(--space-lg); max-width: var(--copy-width); font-size: var(--setup-lead-size); }
.marketing-get-started .getting-started-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-lg); }
.marketing-get-started .setup-content { display: grid; gap: var(--space-lg); }
.marketing-get-started .setup-content section { padding: var(--card-padding); border: var(--setup-card-border) solid var(--hairline); border-radius: var(--radius-card); background: var(--surface); }
.marketing-get-started .setup-content .clinic-code-panel { background: var(--teal-tint); border-color: transparent; }
.marketing-get-started .clinic-code-panel { margin-top: var(--space-lg); }
.marketing-get-started .clinic-code-panel h3 { margin-top: 0; color: var(--navy); }
.marketing-get-started .setup-content h2 + p { margin-top: var(--space-md); }
.marketing-get-started .setup-cta { margin-block: var(--space-md); }
.marketing-get-started .setup-note { max-width: var(--copy-width); margin-top: var(--space-md); padding: var(--space-md); border-radius: var(--radius-field); background: var(--sky); scroll-margin-top: var(--header-clearance); }
.marketing-get-started .setup-help { max-width: var(--copy-width); margin-top: var(--space-lg); padding-top: var(--space-md); border-top: var(--setup-card-border) solid var(--hairline); }
.marketing-get-started .setup-help summary { min-height: var(--tap-target); cursor: pointer; color: var(--navy); font-weight: 800; }
.marketing-get-started .setup-content :is(p,ol,ul) { max-width: var(--copy-width); }
.marketing-get-started .setup-content :is(ol,ul) { margin-block: var(--space-md) 0; padding-left: var(--space-lg); color: var(--ink-soft); }
.marketing-get-started .setup-content li + li { margin-top: var(--space-sm); }
.marketing-get-started .setup-content li::marker { color: var(--blue-deep); font-weight: 800; }
.marketing-get-started .setup-content :is(ol,ul) + p { margin-top: var(--space-md); }
.marketing-get-started strong { color: var(--navy); }
.marketing-get-started .getting-started a:not(.button) { color: var(--blue-deep); text-decoration: underline; text-underline-offset: var(--outline-width); }
.marketing-get-started #code-controls { margin-top: var(--space-lg); max-width: var(--copy-width); }
.marketing-get-started .clinic-code-panel label { display: block; margin-bottom: var(--space-xs); font-weight: 800; }
.marketing-get-started .clinic-code-panel input { display: block; max-width: 100%; width: 100%; min-height: var(--button-height); padding: var(--space-sm); margin-bottom: var(--space-sm); font-family: var(--font-body); font-size: var(--setup-field-size); font-weight: 800; letter-spacing: var(--setup-code-tracking); color: var(--navy); background: var(--surface); border: var(--setup-field-border) solid var(--hairline); border-radius: var(--radius-field); }
.marketing-get-started #copy-status { margin-top: var(--space-sm); color: var(--ink-muted); font-size: var(--setup-caption-size); }
.marketing-get-started .setup-links { font-size: var(--setup-caption-size); }
.marketing-get-started .site-footer { margin-top: var(--space-section); }
@media (max-width: 760px) {
  .marketing-get-started .getting-started-actions { flex-direction: column; }
  .marketing-get-started .getting-started-actions .button { width: 100%; }
  .marketing-get-started .setup-intro h1 + p { font-size: inherit; }
  .marketing-get-started .setup-content section { padding: var(--space-lg); }
}
