/* Versicolor® · Privacidade, Resolução de litígios e 404 (dono: agente "contacto").
   As páginas legais leem-se em --osso, como um documento: índice à margem no PC, texto numa coluna de leitura,
   quase sem movimento. A 404 fica no escuro, com três saídas grandes como as do menu. */

/* ------------------------------------------------------------------ páginas legais */
/* v2: margens novas (DIRECAO-v2 §6), o documento começa logo abaixo do cabeçalho */
.lg { padding-top: calc(var(--cab) + clamp(28px, 4vw, 64px)); padding-bottom: var(--secao); }
.lg__grelha { align-items: start; row-gap: 0; }
.lg__cabeca { margin-bottom: clamp(32px, 4vw, 56px); }
.lg__sobre { margin-bottom: 16px; }
.lg__titulo { max-width: 16ch; font-size: var(--t-capitulo); }
.sem-quebra { white-space: nowrap; }
.lg__versao { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 20px; }
.lg__versao .aviso-provisorio { color: var(--tinta-2); }
.lg__entrada { margin-top: 20px; max-width: 34em; }

.lg-indice__titulo { margin-bottom: 14px; }
.lg-indice__lista { display: grid; border-top: 1px solid var(--linha); }
.lg-indice__ligacao { display: flex; align-items: baseline; gap: 14px; min-height: 44px; padding: 11px 0; border-bottom: 1px solid var(--linha);
  font-size: 14px; line-height: 1.4; color: var(--tinta-3); transition: color var(--t-curto) var(--ease); }
.lg-indice__ligacao .numeral--pequeno { flex: none; width: 2em; }
@media (hover: hover) and (pointer: fine) { .lg-indice__ligacao:hover { color: var(--tinta); } }

.lg-seccao { position: relative; display: grid; grid-template-columns: 3.2em minmax(0, 1fr); column-gap: 8px;
  padding: clamp(20px, 2.2vw, 30px) 0 clamp(24px, 2.8vw, 36px); scroll-margin-top: calc(var(--cab) + 24px); }
.lg-seccao__fio { position: absolute; top: 0; left: 0; right: 0; }
.lg-seccao__n { grid-column: 1; padding-top: .9em; }
.lg-seccao__titulo { grid-column: 2; font: 300 clamp(22px, 1.9vw, 28px)/1.15 var(--serif); letter-spacing: -.012em; margin-bottom: 12px; }
.lg-seccao__texto, .lg-seccao__ligacao { grid-column: 2; }
.lg-seccao__texto { max-width: 38rem; color: var(--tinta-3); }
.lg-seccao__texto a { word-break: break-word; }
.lg-seccao__ligacao { margin-top: 14px; }
.lg-seccao__ligacao .ligacao--seta { color: var(--tinta); position: relative; }
.lg-seccao__ligacao .ligacao--seta::after { content: ''; position: absolute; left: -4px; right: -4px; top: 50%; height: 48px; transform: translateY(-50%); }
.lg-seccao:target .lg-seccao__fio { background: var(--acento); }

.lg__entidade { display: grid; gap: 10px; margin-top: clamp(24px, 3vw, 40px); padding-top: 26px; border-top: 1px solid var(--linha-forte);
  font-size: 14px; line-height: 1.6; color: var(--tinta-3); }

@media (min-width: 1024px) {
  .lg__cabeca { grid-column: 2 / 12; }
  .lg-indice { grid-column: 2 / 5; position: sticky; top: calc(var(--cab) + 40px); }
  .lg__corpo { grid-column: 6 / 12; }
  .lg__entidade { padding-left: calc(3.2em + 8px); }
}
@media (max-width: 1023px) {
  .lg-indice { margin-bottom: 40px; }
  .lg-seccao { grid-template-columns: 2.6em minmax(0, 1fr); }
}

/* ------------------------------------------------------------------ 404 */
.nf { position: relative; display: grid; align-items: center; min-height: calc(100svh - 120px);
  padding-block: calc(var(--cab) + clamp(32px, 5vw, 80px)) var(--secao); }
.nf__grelha { align-items: end; row-gap: clamp(48px, 7vw, 88px); }
.nf__codigo { margin-bottom: 24px; }
.nf__titulo { font: 300 var(--t-capitulo)/1 var(--serif); letter-spacing: -.026em; max-width: 11ch; }
.nf__frase { margin-top: clamp(24px, 2.6vw, 36px); max-width: 26em; }
.nf__lista { display: grid; }
.nf__saida { position: relative; display: grid; grid-template-columns: 2.2em minmax(0, 1fr) auto; align-items: baseline; gap: 10px;
  min-height: 64px; padding: 20px 0 22px; font: 300 clamp(28px, 2.6vw, 42px)/1.1 var(--serif); letter-spacing: -.016em; }
.nf__saida .numeral--pequeno { align-self: center; }
.nf__saida .seta { font-size: 18px; color: var(--tinta-2); transition: transform var(--t-curto) var(--ease), color var(--t-curto) var(--ease); }
.nf__fio { position: absolute; top: 0; left: 0; right: 0; }
.nf__fio::after { content: ''; position: absolute; inset: 0; background: var(--luz); transform: scaleX(0); transform-origin: 0 50%;
  transition: transform .7s var(--ease-io); }
.nf__lista li:last-child .nf__saida { border-bottom: 1px solid var(--linha-forte); }
@media (hover: hover) and (pointer: fine) {
  .nf__saida:hover .nf__fio::after { transform: scaleX(1); }
  .nf__saida:hover .seta { transform: translateX(6px); color: var(--luz); }
}
.nf__saida:focus-visible .nf__fio::after { transform: scaleX(1); }
@media (min-width: 1024px) {
  .nf__texto { grid-column: 2 / 8; }
  .nf__saidas { grid-column: 8 / 13; }
}
@media (max-width: 1023px) {
  .nf { align-items: start; }
}
