/* Páginas institucionais: Sobre Nós, Quem Somos, Seja Membro, Por Que GB.
   Só blocos que o site.css não tem. Usa os tokens de :root. */

/* .roster: equipe em linhas tipográficas (nome à esquerda, cargo + texto à direita). */
.roster { border-top: 1px solid var(--c-line); }
.roster__item { display: grid; gap: var(--sp-2); padding-block: var(--sp-4); border-bottom: 1px solid var(--c-line-soft); }
.roster__item .title { margin: 0; }
.roster__role { font-family: var(--f-mono); font-size: var(--fs-ui); letter-spacing: .12em; color: var(--c-ink-2); line-height: 1.7; margin: 0 0 var(--sp-2); }
.roster__item p:last-child { margin: 0; line-height: 1.85; }
@media (min-width: 60rem) { .roster__item { grid-template-columns: 1fr 1.6fr; gap: var(--sp-5); } }

/* .lineage: parede do legado, nome grande + descrição. */
.lineage { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--c-line); }
.lineage li { display: grid; gap: var(--sp-1); padding-block: var(--sp-3); border-bottom: 1px solid var(--c-line-soft); line-height: 1.85; }
.lineage .title { margin: 0; }
@media (min-width: 60rem) { .lineage li { grid-template-columns: 1fr 1.6fr; gap: var(--sp-5); align-items: baseline; } }

/* .tri: três colunas curtas (visão, missão, valores). */
.tri { display: grid; gap: var(--sp-4); }
.tri > div { border-top: 1px solid var(--c-line); padding-top: var(--sp-3); }
.tri .title { margin-bottom: var(--sp-2); }
.tri p { margin: 0; line-height: 1.85; }
@media (min-width: 48rem) { .tri { grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); } }

/* Tabelas: célula vazia e versão que empilha no celular (planos). */
.table td.is-empty { color: var(--c-ink-2); }
.table--grade { min-width: 52rem; }
.table--grade th, .table--grade td { padding: .8rem .75rem; }
.table small { display: block; color: var(--c-ink-2); letter-spacing: var(--ls-ui); }
.table tr.is-featured td, .table tr.is-featured th { border-bottom-color: var(--c-line); }
.badge { display: inline-block; margin-left: .5rem; padding: .1rem .5rem; background: var(--c-accent); color: #fff; font-size: var(--fs-ui); letter-spacing: .1em; line-height: 1.6; }

@media (max-width: 47.99rem) {
  .plans-wrap { border: 0; overflow: visible; }
  .table--plans { min-width: 0; display: block; }
  .table--plans thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .table--plans tbody, .table--plans tr, .table--plans th, .table--plans td { display: block; }
  .table--plans tr { border: 1px solid var(--c-line); margin-bottom: var(--sp-2); padding: var(--sp-2) var(--sp-3); }
  .table--plans th { font-family: var(--f-display); font-size: var(--fs-h3); font-weight: 400; padding: .25rem 0; border: 0; white-space: normal; }
  .table--plans td { padding: .25rem 0; border: 0; }
  .table--plans td::before { content: attr(data-label) ": "; color: var(--c-ink-2); }
}

/* .countries: lista de países em fluxo corrido. */
.countries { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.1rem; line-height: 1.6; }
.countries li { white-space: nowrap; }
.countries li:not(:last-child)::after { content: "·"; margin-left: 1.1rem; color: var(--c-accent); }

/* .facts--two: duas colunas (legenda das turmas). */
@media (min-width: 48rem) { .facts.facts--two { grid-template-columns: repeat(2, 1fr); } }

.table-wrap { position: relative; } /* contém os .visually-hidden das células */

.section--dark .quote cite { color: rgba(255, 255, 255, .8); }
.lineage { margin-top: var(--sp-5); }