/* Proposta A · Leitura: texto antes do número, espaço largo, linha curta. */
@layer app {
  .leitura { max-inline-size: 72ch; padding-block: var(--ds-space-7); }
  .leitura-topo { display: grid; gap: var(--ds-space-4); padding-block-end: var(--ds-space-7); border-bottom: 1px solid var(--ds-line); }
  .leitura-sobre { font: var(--ds-type-label) var(--ds-font-interface); color: var(--ds-brand); text-transform: uppercase; letter-spacing: 0.06em; }
  .leitura h1 { font: var(--ds-type-h1) var(--ds-font-marca); }
  .leitura-lide { font: var(--ds-type-legenda) var(--ds-font-interface); color: var(--ds-ink); }

  .leitura-grupo { display: grid; gap: var(--ds-space-3); padding-block: var(--ds-space-7); border-bottom: 1px solid var(--ds-line); }
  .leitura-grupo h2 { font: var(--ds-type-h2) var(--ds-font-marca); }
  .leitura-frase { font: var(--ds-type-corpo) var(--ds-font-interface); font-weight: 600; }
  .leitura-objetivo { font: var(--ds-type-corpo) var(--ds-font-interface); color: var(--ds-muted); }

  .leitura-lista { list-style: none; padding: 0; margin-top: var(--ds-space-3); display: grid; }
  .leitura-lista li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--ds-space-4);
    padding-block: var(--ds-space-3);
    border-top: 1px solid var(--ds-line);
    font: var(--ds-type-corpo) var(--ds-font-interface);
  }
}