/* GLOSSÁRIO (/glossario/): índice A a Z, grupos e a página de cada termo, na
   marca do site desde 28/10/2026. Cores, letras, botões e o cabeçalho único
   vêm de brand/marca.css; aqui só o desenho das páginas do glossário.
   As páginas são geradas por tools/publicacao/gerar_glossario.py com o molde
   tools/publicacao/modelos/base-marca.html; este arquivo é feito à mão. */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-size: 18px; line-height: 1.6; }
img, svg { display: block; max-width: 100%; height: auto; }
.ic { display: inline-block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; }
[hidden] { display: none !important; }
.wrap { width: var(--gz-largura); margin-inline: auto; }
.skip { position: absolute; z-index: 200; top: 10px; left: 10px; padding: 10px 16px; border-radius: 12px; background: var(--text); color: var(--bg); transform: translateY(-200%); }
.skip:focus { transform: none; }

/* Letras de apoio */
.eyebrow, .caps { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-texto); }
.h-lg { font-family: var(--display); font-weight: 800; font-stretch: 86%; font-size: clamp(42px, 6vw, 84px); line-height: .94; letter-spacing: -.04em; text-wrap: balance; }
.h-md { font-family: var(--display); font-weight: 800; font-stretch: 88%; font-size: clamp(30px, 3.6vw, 46px); line-height: 1; letter-spacing: -.034em; }
.lead { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.55; color: var(--body); text-wrap: pretty; }

/* Página */
.pub { padding-bottom: 40px; }
.pub-col { max-width: 780px; margin-inline: auto; }
/* Na página do termo a trilha acompanha a coluna centralizada. */
.crumbs:has(+ .pub-col) { max-width: 780px; margin-inline: auto; }
/* A trilha fica só para buscador (JSON-LD): na tela ela parecia um terceiro menu.
   O caminho de volta mora no kicker da abertura e do termo. */
.crumbs { display: none; }
.eyebrow a { color: inherit; }
.eyebrow a:hover { text-decoration: underline; text-underline-offset: 3px; }
.gz-abre { margin-bottom: 8px; border-bottom: 2px solid var(--text); }
.gz-abre-meta a { color: var(--text); font-weight: 700; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; font-size: 13px; font-weight: 600; color: var(--muted); }
.crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--line-2); }
.crumbs a { color: var(--accent-texto); }
.crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }
.pub-head { padding: clamp(48px, 6vw, 84px) 0 clamp(24px, 3vw, 36px); margin-bottom: clamp(28px, 3vw, 44px); border-bottom: 2px solid var(--text); }
.pub-head h1 { max-width: 18ch; margin: 14px 0 18px; overflow-wrap: anywhere; }
.pub-head .lead { max-width: 60ch; margin-bottom: 16px; }
.byline { font-size: 14px; color: var(--muted); }
.byline a { color: var(--text); font-weight: 700; }

/* A definição: o bloco que se cita, em laranja. */
.def { margin-bottom: 26px; padding: clamp(22px, 3vw, 34px); border-radius: 24px; background: var(--accent); color: var(--sobre-acc); transform: rotate(-.6deg); }
.def .caps { margin-bottom: 8px; color: var(--sobre-acc); opacity: .75; }
.def p:last-child { font-family: var(--display); font-weight: 700; font-stretch: 92%; font-size: clamp(22px, 2.3vw, 28px); line-height: 1.25; letter-spacing: -.015em; text-wrap: pretty; }

.chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 22px; font-size: 14px; color: var(--muted); }
.chips ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; }
.chips li { padding: 4px 12px; border: 1px solid var(--line-2); border-radius: 999px; background: var(--cartao); color: var(--text); font-weight: 600; }

.ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; margin-bottom: clamp(36px, 4vw, 52px); overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--line); }
.ficha div { padding: 14px 18px; background: var(--cartao); }
.ficha dt { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ficha dd { margin-top: 4px; font-weight: 700; }
.ficha a { color: var(--accent-texto); }

/* Corpo em Markdown */
.prosa h2, .bloco > h2 { margin: 1.8em 0 .5em; font-family: var(--display); font-weight: 800; font-stretch: 88%; font-size: clamp(28px, 3vw, 40px); line-height: 1.02; letter-spacing: -.03em; color: var(--text); }
.prosa > h2:first-child { margin-top: 0; }
.prosa h3 { margin: 1.6em 0 .4em; font-family: var(--display); font-weight: 750; font-stretch: 92%; font-size: 22px; line-height: 1.2; letter-spacing: -.015em; }
.prosa p, .prosa li { font-size: 18px; line-height: 1.75; color: var(--body); text-wrap: pretty; }
.prosa p, .prosa ul, .prosa ol, .prosa blockquote, .tabela { margin-bottom: 1.1em; }
.prosa ul { padding-left: 1.3em; list-style: disc; }
.prosa ol { padding-left: 1.3em; list-style: decimal; }
.prosa li { margin-bottom: .35em; }
.prosa li::marker { color: var(--accent-texto); }
.prosa a { color: var(--accent-texto); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.prosa strong { font-weight: 700; color: var(--text); }
.prosa blockquote { margin-inline: 0; padding: 0; font-family: var(--display); font-weight: 700; font-stretch: 92%; font-size: 24px; line-height: 1.3; letter-spacing: -.012em; color: var(--text); }
.prosa blockquote::before { content: "C"; display: block; height: 30px; font-size: 64px; line-height: 1; color: var(--accent); }
.prosa code { padding: 1px 6px; border-radius: 6px; background: var(--surface); font-size: .92em; }
.tabela { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.prosa table { width: 100%; border-collapse: collapse; font-size: 16px; }
.prosa th, .prosa td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.prosa th { border-bottom: 2px solid var(--text); font-weight: 700; color: var(--text); }
mark.confirmar { padding: 0 4px; border-radius: 3px; background: var(--accent); color: var(--sobre-acc); }

/* Fim da página: perguntas, relacionados, palestra, vizinhos */
.bloco { margin-top: clamp(44px, 5vw, 68px); padding-top: clamp(24px, 3vw, 34px); border-top: 2px solid var(--text); }
.bloco > h2 { margin-top: 0; }
.faq h3 { margin: 26px 0 8px; font-family: var(--display); font-weight: 750; font-stretch: 92%; font-size: 21px; line-height: 1.25; letter-spacing: -.012em; }
.faq p { line-height: 1.7; color: var(--body); }

.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 14px; }
.card { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 22px; border: 1px solid var(--line-2); border-radius: 20px; background: var(--cartao); transition: border-color .2s, transform .35s var(--sai), box-shadow .35s var(--sai); }
a.card:hover { border-color: var(--accent); transform: translateY(-3px); box-shadow: 0 18px 34px -22px var(--sombra); }
.card small { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-texto); }
.card strong { font-family: var(--display); font-weight: 750; font-stretch: 92%; font-size: 21px; line-height: 1.12; letter-spacing: -.015em; overflow-wrap: anywhere; }
.card span { font-size: 15px; line-height: 1.55; color: var(--body); }
.card-sem-link { color: var(--muted); }

.cta-box { margin-top: clamp(44px, 5vw, 68px); padding: clamp(28px, 4vw, 48px); border-radius: 28px; background: var(--bloco); color: var(--sobre-bloco); }
[data-tema="escuro"] .cta-box { border: 1px solid var(--line-2); }
.cta-box .caps { color: var(--accent); }
.cta-box h2 { margin: 10px 0 12px; font-family: var(--display); font-weight: 800; font-stretch: 88%; font-size: clamp(28px, 3vw, 40px); line-height: 1.02; letter-spacing: -.03em; }
.cta-box p { max-width: 52ch; margin-bottom: 22px; color: var(--sobre-bloco-2); }
.cta-btn { display: inline-flex; align-items: center; gap: 10px; min-height: 50px; padding: 12px 24px; border-radius: 999px; background: var(--accent); color: var(--sobre-acc); font-size: 15px; font-weight: 700; transition: background-color .18s, color .18s; }
.cta-btn:hover { background: var(--sobre-bloco); color: var(--bloco); }

.pn { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: clamp(32px, 4vw, 48px); }
.pn a { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border: 1px solid var(--line-2); border-radius: 18px; transition: border-color .2s, background-color .2s; }
.pn a:hover { border-color: var(--text); background: var(--cartao); }
.pn small { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.pn span { font-family: var(--display); font-weight: 750; font-stretch: 92%; font-size: 19px; letter-spacing: -.01em; }
@media (min-width: 640px) { .pn { grid-template-columns: 1fr 1fr; } .pn-prox { grid-column: 2; text-align: right; } }

/* Índice: busca, letras e o A a Z */
/* Contador do índice: total grande à esquerda, clusters em colunas finas. */
.contador { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 48px; padding: 30px 0; border-bottom: 1px solid var(--line-2); }
.contador-total { display: flex; align-items: center; gap: 14px; }
.contador-total b { font-family: var(--display); font-weight: 800; font-stretch: 86%; font-size: clamp(64px, 7vw, 96px); line-height: .82; letter-spacing: -.05em; color: var(--accent); font-variant-numeric: tabular-nums; }
.contador-total span { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; line-height: 1.35; color: var(--text); }
.contador-clusters { display: flex; list-style: none; flex: 1; min-width: 0; }
.contador-clusters li { flex: 1 1 0; min-width: 0; border-left: 1px solid var(--line-2); }
.contador-clusters a { display: flex; flex-direction: column; gap: 4px; padding: 4px clamp(12px, 1.6vw, 22px); font-size: 14px; line-height: 1.3; color: var(--muted); transition: color .15s; }
.contador-clusters b { font-family: var(--display); font-weight: 800; font-size: 30px; line-height: 1; letter-spacing: -.03em; color: var(--text); font-variant-numeric: tabular-nums; transition: color .15s; }
.contador-clusters a:hover, .contador-clusters a:hover b { color: var(--accent-texto); }
.busca { margin: 40px 0 32px; }
.busca label { display: block; margin-bottom: 10px; }
.busca input { width: 100%; max-width: 620px; min-height: 56px; padding: 14px 22px; border: 1px solid var(--line-2); border-radius: 999px; background: var(--cartao); color: var(--text); font: inherit; font-size: 17px; }
.busca input::placeholder { color: var(--muted); }
.busca input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px rgb(255 106 31 / 18%); }
.busca-status { min-height: 1.4em; margin-top: 10px; font-size: 14px; color: var(--muted); }
.letras { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0 12px; }
.letras a { display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 8px; border: 1px solid var(--line-2); border-radius: 12px; font-family: var(--display); font-weight: 800; font-size: 17px; transition: background-color .15s, border-color .15s, color .15s; }
.letras a:hover { border-color: var(--accent); background: var(--accent); color: var(--sobre-acc); }
.az-letra { display: grid; grid-template-columns: clamp(68px, 8vw, 132px) minmax(0, 1fr); gap: 0 clamp(18px, 3vw, 40px); padding: clamp(16px, 2.2vw, 28px) 0 clamp(8px, 1.4vw, 16px); border-top: 2px solid var(--text); scroll-margin-top: 160px; }
.az-letra:last-of-type { border-bottom: 2px solid var(--text); }
.az-marca { position: sticky; top: 150px; align-self: start; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.az-letra h2 { margin: 0; font-family: var(--display); font-weight: 800; font-stretch: 86%; font-size: clamp(48px, 6vw, 80px); line-height: .8; letter-spacing: -.04em; color: var(--violeta-texto); }
.az-n { min-width: 26px; padding-top: 6px; border-top: 3px solid var(--accent); font-size: 12px; font-weight: 700; letter-spacing: .12em; color: var(--muted); font-variant-numeric: tabular-nums; }
.lista-termos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 0 clamp(20px, 3vw, 40px); list-style: none; }
.lista-termos a { display: flex; align-items: baseline; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 17px; font-weight: 600; letter-spacing: -.01em; transition: color .15s, padding-left .15s; }
.lista-termos a::after { content: "\2197"; margin-left: auto; color: var(--accent-texto); opacity: 0; transform: translateX(-5px); transition: opacity .15s, transform .15s; }
.lista-termos a:hover { padding-left: 6px; color: var(--accent-texto); }
.lista-termos a:hover::after { opacity: 1; transform: none; }
.cluster-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; margin: 56px 0 20px; }
.cluster-head h2 { margin: 0; }
.cluster-head a { font-size: 15px; font-weight: 700; color: var(--accent-texto); }
.vazio { padding: 28px; border: 1px dashed var(--line-2); border-radius: 20px; color: var(--body); }

/* Rodapé */
.g-rodape { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: 90px; padding-block: 28px 40px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.g-rodape .gz-logo { width: 78px; height: 54px; }
.g-rodape span { flex: 1; min-width: 200px; }
.g-rodape span a { color: var(--accent-texto); font-weight: 600; }
.g-rodape > a:last-child { display: inline-flex; align-items: center; gap: 6px; color: var(--text); font-weight: 600; }

@media (max-width: 700px) {
  .wrap { width: calc(100% - 40px); }
  .def { transform: none; border-radius: 20px; }
  .ficha { grid-template-columns: minmax(0, 1fr); }
  .ficha div { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 12px 16px; }
  .ficha dd { margin-top: 0; text-align: right; }
  .prosa p, .prosa li { font-size: 17px; }
  .az-letra { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .az-marca { position: static; flex-direction: row; align-items: baseline; gap: 10px; margin-bottom: 4px; }
  .az-letra h2 { font-size: 46px; }
  .az-n { padding-top: 0; border-top: 0; }
  .cta-btn { width: 100%; justify-content: center; }
  .contador { gap: 18px; }
  .contador-clusters { flex: 1 1 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 12px; }
  .contador-clusters li { border-left: 0; }
  .contador-clusters a { padding: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .card, .lista-termos a, .lista-termos a::after { transition: none; }
}

/* Letras do A a Z: a régua reta vira o traço à mão do site. */
.az-letra { position: relative; border-top: 0; }
.az-letra:last-of-type { border-bottom: 0; }
.az-letra::before { content: ''; position: absolute; left: 0; right: 0; top: -2px; height: 5px; background: var(--text); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 6' preserveAspectRatio='none'%3E%3Cpath d='M0 2.6C90 1.9 170 2.9 260 2.2S430 1.6 520 2.5 700 3.2 790 2.3 930 1.7 1000 2.4L1000 4.3C930 4.9 860 3.9 760 4.6S560 4.1 470 4.9 300 3.8 210 4.5 60 4.1 0 4.7Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 6' preserveAspectRatio='none'%3E%3Cpath d='M0 2.6C90 1.9 170 2.9 260 2.2S430 1.6 520 2.5 700 3.2 790 2.3 930 1.7 1000 2.4L1000 4.3C930 4.9 860 3.9 760 4.6S560 4.1 470 4.9 300 3.8 210 4.5 60 4.1 0 4.7Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.az-letra:nth-of-type(even)::before { transform: scaleX(-1); }