/* AI Solutions · Páginas legais (/politica-privacidade/ e /termos-de-servico/, ficheiro igual nas duas).
   Índice com âncoras (fixo ao lado no ecrã largo, recolhido no telemóvel) + texto em .prosa (prosa.css).
   Proposta para o sistema: passar .legal e .indice para prosa.css (servem também posts longos e casos). */
.hero-sub--legal { padding-bottom: clamp(4px, 1.5vh, 16px); }
.hero-sub--legal .hero-sub__luz { margin-bottom: 0; }

.legal { display: grid; grid-template-columns: minmax(200px, 250px) minmax(0, 72ch); gap: clamp(32px, 5vw, 88px); align-items: start; padding: clamp(24px, 4vh, 40px) var(--margem) var(--sec-y); }
.legal__texto > h2:first-child { margin-top: 0; }
.legal__texto h2 { scroll-margin-top: calc(var(--nav-h) + 20px); }
.legal__contactos { padding: 14px 16px; border-radius: 14px; border: 1px solid var(--traco); background: rgba(243, 240, 255, .03); font-variant-numeric: tabular-nums; }

/* índice: a linha vertical é o fio; o item atual acende como a linha de luz */
.indice { position: sticky; top: calc(var(--nav-h) + 24px); }
.indice__caixa > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; list-style: none; cursor: pointer; padding: 2px 0 12px; font: 600 .78rem/1.2 var(--f-texto); letter-spacing: .08em; text-transform: uppercase; color: var(--texto-3); }
.indice__caixa > summary::-webkit-details-marker { display: none; }
.indice__caixa > summary::after { content: ""; width: 7px; height: 7px; margin-right: 4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s var(--ease-out); }
.indice__caixa[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }
.indice ol { margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--traco); }
.indice li { margin: 0; }
.indice a { position: relative; display: block; margin-left: -1px; padding: 6px 0 6px 16px; border-left: 1.5px solid transparent; color: var(--texto-2); font-size: .92rem; line-height: 1.35; text-decoration: none; transition: color .2s, border-color .2s; }
.indice a:hover { color: var(--luz); }
.indice a[aria-current="true"] { color: var(--luz); border-left-color: #E4DCFF; }
.indice a[aria-current="true"]::before { content: ""; position: absolute; left: -4px; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: #fff; box-shadow: 0 0 8px 2px rgba(143, 125, 255, .9); }

@media (max-width: 900px) {
  .legal { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .indice { position: static; }
  .indice__caixa { border: 1px solid var(--traco); border-radius: 16px; background: rgba(243, 240, 255, .03); }
  .indice__caixa > summary { min-height: 48px; padding: 0 16px; }
  .indice__caixa ol { margin: 0 16px 14px; }
  .indice a { padding: 8px 0 8px 14px; }
}
.reduce .indice__caixa > summary::after, .reduce .indice a { transition: none; }
