/* ============================================================
   Página: Informações de Suporte / Termos / LGPD (artboard 07)
   Faixas: hero 0–467 (grad) · SLA 467–904 (branco) ·
           Termos 904–3932 (escuro) · LGPD 3933–6691 (branco) · footer
   ============================================================ */

/* tipografia legal: corpo pequeno, mínimo 14px */
.sla, .tos, .lgpd {
  --legal-fs: clamp(.875rem, .7453vw, .8944rem);
}

/* coluna de leitura confortável */
.legal-body,
.tos .container > *,
.lgpd .container > * {
  max-width: 75rem;
}

/* ---------- hero ---------- */
.hero-suporte { --hero-shift: clamp(.25rem, .52vw, .63rem); }

/* ---------- listas ---------- */
.dot-list { display: grid; }
.dot-list li {
  position: relative;
  padding-left: 1em;
  font-size: var(--legal-fs);
  font-weight: 300;
  line-height: 1.6;
}
.dot-list li::before {
  content: '•';
  position: absolute;
  left: 0;
}
.num-list { display: grid; }
.num-list li {
  font-size: var(--legal-fs);
  font-weight: 300;
  line-height: 1.6;
}

/* ---------- SLA (faixa branca) ---------- */
.sla { padding-block: clamp(2.5rem, 3.3vw, 4rem); }
.sla p {
  font-size: var(--legal-fs);
  font-weight: 300;
  line-height: 1.6;
  color: var(--ink-soft);
}
.sla p + p,
.sla ul + p { margin-top: 1.1em; }
.sla strong { font-weight: 500; color: var(--ink); }
.sla .dot-list li { color: var(--ink-soft); }
.sla__subhead { letter-spacing: .01em; }

/* ---------- Termos de uso (faixa escura) ---------- */
.tos { padding-block: clamp(2.8rem, 3.3vw, 4rem) clamp(5rem, 10vw, 12rem); }
.tos__heading {
  font-size: var(--fs-h2);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: .01em;
}
.tos__sec--first { margin-top: clamp(1.2rem, 1.7vw, 2rem); }
.tos__sec + .tos__sec { margin-top: clamp(2.6rem, 4.4vw, 5.3rem); }
.tos__title {
  font-size: clamp(1.45rem, 1.875vw, 2.25rem);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .01em;
  margin-bottom: clamp(.7rem, .95vw, 1.15rem);
}
.tos__sub { margin-top: clamp(1.4rem, 1.85vw, 2.2rem); }
.tos__subtitle {
  font-size: clamp(1.05rem, 1.15vw, 1.375rem);
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: .5em;
}
.tos__subtitle--gap { margin-top: clamp(1.4rem, 1.9vw, 2.3rem); }
.tos p {
  font-size: var(--legal-fs);
  font-weight: 300;
  line-height: 1.6;
  color: #e3e3e3;
}
.tos .dot-list li { color: #e3e3e3; }
.tos p + .dot-list { margin-top: .1em; }
.tos__after { margin-top: 1.1em; }
.tos a { color: inherit; text-decoration: none; }
.tos a:hover { color: var(--blue-bright); }

/* aviso destacado (seção 6 — bloqueio emergencial) */
.tos .tos__callout {
  margin-top: clamp(1.2rem, 1.8vw, 2.2rem);
  font-size: var(--fs-lead);
  font-weight: 300;
  line-height: 1.45;
  color: #fff;
  max-width: 60em;
}

/* ---------- Política de privacidade — LGPD (faixa branca) ---------- */
.lgpd { padding-block: clamp(3rem, 4.2vw, 5rem) clamp(3.5rem, 5.8vw, 7rem); }
.lgpd__heading {
  font-size: var(--fs-h2);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: .01em;
  color: var(--ink);
}
.lgpd__intro { margin-top: 1.4em; }
.lgpd__sec--first { margin-top: clamp(1.8rem, 2.5vw, 3rem); }
.lgpd__sec + .lgpd__sec { margin-top: clamp(2.2rem, 3.4vw, 4.1rem); }
.lgpd__title {
  font-size: clamp(1.2rem, 1.36vw, 1.625rem);
  font-weight: 400;
  line-height: 1.25;
  color: var(--ink);
  margin-bottom: .7em;
}
.lgpd p {
  font-size: var(--legal-fs);
  font-weight: 300;
  line-height: 1.6;
  color: var(--ink-soft);
}
.lgpd p + p { margin-top: .35em; }
.lgpd .dot-list li,
.lgpd .num-list li { color: var(--ink-soft); }
.lgpd p + .dot-list,
.lgpd p + .num-list,
.lgpd .dot-list + p,
.lgpd .num-list + p { margin-top: .35em; }
.lgpd .lgpd__subtitle {
  font-weight: 500;
  color: var(--ink);
  margin-bottom: .2em;
}
.lgpd a { color: inherit; }
.lgpd a:hover { color: var(--blue-bright); }

/* ---------- responsivo ---------- */
/* 921–1536: a seção é mais alta que a arte (texto legal reflui) e o `cover`
   amplia a onda, empurrando os tracejados da margem esquerda para trás do
   texto — recua a arte e atenua o que sobra na coluna de leitura */
@media (min-width: 921px) and (max-width: 1536px) {
  .tos .wave {
    translate: -6vw 0;
    opacity: .6;
  }
}
