/* Styles used only by getting-started.html and ru/getting-started.html; loaded after site.css. */
.start-chapter { display: grid; grid-template-columns: .85fr 1.15fr; gap: var(--column-gap); border-top: 1px solid var(--line); }
.start-chapter h2 { font-size: clamp(28px, 3vw, 40px); max-width: 16ch; }
.start-chapter h2 span { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 18px; border: 1px solid var(--accent); border-radius: 50%; background: var(--peach); font-size: 16px; font-weight: 600; color: var(--accent); letter-spacing: 0; font-variant-numeric: tabular-nums; line-height: 1; }
.start-responsibilities { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 0; }
.start-responsibilities > div { padding: 22px 24px; border: 1px solid var(--line); border-radius: 12px; }
.start-responsibilities .side-us { background: var(--art-wash); border-color: transparent; }
.start-responsibilities dt { display: inline-flex; padding: 4px 12px; border-radius: 999px; font-size: 13px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.side-us dt { background: var(--accent); color: var(--paper); }
.side-you dt { background: var(--peach); color: var(--accent); }
.start-responsibilities dd { margin: 14px 0 0; font-size: 16px; text-wrap: pretty; }
.start-body h3 { margin-top: 28px; font-size: 14px; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; color: var(--accent); }
.checklist li { position: relative; padding-left: 34px; color: var(--muted); text-wrap: pretty; }
.start-note { margin-top: 24px; padding: 4px 0 4px 20px; border-left: 3px solid var(--line); color: var(--muted); font-size: 16px; }
.start-body > .secondary { margin-top: 24px; }
.start-next { border-top: 1px solid var(--line); padding-top: 32px; margin-top: 0; }
@media(max-width:760px) {
  .start-chapter { grid-template-columns: 1fr; gap: 24px; }
  .start-chapter h2 { max-width: none; }
  .start-chapter h2 span { width: 40px; height: 40px; margin-bottom: 12px; font-size: 15px; }
  .start-responsibilities { grid-template-columns: 1fr; gap: 12px; }
  .start-responsibilities > div { padding: 18px 20px; }
}
