/* Página "Sobre": conteúdo editorial no ritmo da home. O contêiner acompanha a home, mas
   o texto é limitado em ch — alinhamento sem perder a medida de leitura. */

.sobre h1 {
  font-size: var(--fs-title);
  font-weight: 600;
  color: var(--primary);
  margin: 10px 0 0;
  max-width: 46ch;
  text-wrap: balance;
}

.sobre p {
  color: var(--text);
  line-height: 1.7;
  max-width: 68ch;
}

.sobre p.sobre__lead {
  font-size: 0.98rem;
  color: var(--text-muted);
  margin: 12px 0 0;
  max-width: 64ch;
}

/* Filete no topo separa as seções — a mesma marcação de ritmo da faixa da home. */
.sobre__section {
  border-top: 1px solid var(--border);
  margin-top: clamp(28px, 5vw, 44px);
  padding-top: clamp(22px, 4vw, 34px);
}

.sobre__section h2 {
  font-size: var(--fs-section);
  font-weight: 600;
  color: var(--primary);
  margin: 10px 0 0;
  max-width: 48ch;
  text-wrap: balance;
}

.sobre code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 5px;
}

.sobre__steps {
  margin: 18px 0 0;
  padding-left: 22px;
  max-width: 68ch;
}

.sobre__steps li {
  line-height: 1.7;
  margin-bottom: 10px;
}

.sobre__steps li:last-child {
  margin-bottom: 0;
}

.sobre__steps li::marker {
  font-weight: 600;
  color: var(--text-muted);
}

.sobre__steps strong,
.sobre__features strong {
  font-weight: 600;
  color: var(--primary);
}

/* Recursos em linhas de filete: a lista de caixas competia com o texto ao lado. */
.sobre__features {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  max-width: 72ch;
  border-top: 1px solid var(--border);
}

.sobre__features li {
  padding: 12px 2px;
  border-bottom: 1px solid var(--border);
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--text-muted);
}

.sobre__cta {
  margin-top: clamp(26px, 5vw, 40px);
}