/* ═══════════════════════════════════════════════════════════════
   IDATA Chile — legal.css
   Estilos para páginas legales: Política de Privacidad y Términos
═══════════════════════════════════════════════════════════════ */

/* ─── Hero legal ─────────────────────────────────────────────── */
.legal-hero {
  padding-top: calc(var(--navbar-height) + 4rem);
  padding-bottom: 3rem;
  background: linear-gradient(180deg, var(--idata-bg-dark) 0%, var(--idata-bg-section) 100%);
  border-bottom: 1px solid var(--idata-border);
}

.legal-hero .hero-badge {
  display: inline-block;
  padding: 0.3rem 1rem;
  background: rgba(30, 107, 255, 0.12);
  border: 1px solid rgba(30, 107, 255, 0.3);
  border-radius: 2rem;
  color: var(--idata-blue-light);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.legal-updated {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 1rem;
  background: var(--idata-surface);
  border: 1px solid var(--idata-border);
  border-radius: 2rem;
  color: var(--idata-muted);
  font-size: 0.82rem;
}

.legal-updated i {
  color: var(--idata-cyan);
}

/* ─── Contenido ──────────────────────────────────────────────── */
.legal-content {
  padding: 3rem 0 5rem;
  background: var(--idata-bg-section);
}

/* ─── Card principal ─────────────────────────────────────────── */
.legal-card {
  background: var(--idata-surface);
  border: 1px solid var(--idata-border);
  border-radius: var(--radius-card);
  padding: 2.5rem 2.5rem 2rem;
}

@media (max-width: 576px) {
  .legal-card {
    padding: 1.5rem 1.25rem;
  }
}

/* ─── Índice de contenidos ───────────────────────────────────── */
.legal-toc {
  background: rgba(30, 107, 255, 0.06);
  border: 1px solid var(--idata-border);
  border-left: 3px solid var(--idata-blue);
  border-radius: 0.75rem;
  padding: 1.25rem 1.5rem;
  margin-bottom: 2.5rem;
}

.legal-toc h6 {
  color: var(--idata-blue-light);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

.legal-toc ol {
  margin: 0;
  padding-left: 1.25rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.25rem 1.5rem;
}

.legal-toc ol li {
  font-size: 0.88rem;
  color: var(--idata-muted);
}

.legal-toc ol li a {
  color: var(--idata-muted);
  text-decoration: none;
  transition: color 0.2s;
}

.legal-toc ol li a:hover {
  color: var(--idata-blue-light);
}

/* ─── Títulos de sección ─────────────────────────────────────── */
.legal-section-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--idata-white);
  margin-top: 2.25rem;
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--idata-border);
}

/* ─── Tipografía del cuerpo ──────────────────────────────────── */
.legal-card p {
  color: var(--idata-muted);
  font-size: 0.93rem;
  line-height: 1.8;
  margin-bottom: 0.85rem;
}

.legal-card ul,
.legal-card ol:not(.legal-toc ol) {
  color: var(--idata-muted);
  font-size: 0.93rem;
  line-height: 1.8;
  padding-left: 1.4rem;
  margin-bottom: 1rem;
}

.legal-card ul li,
.legal-card ol:not(.legal-toc ol) li {
  margin-bottom: 0.4rem;
}

.legal-card a {
  color: var(--idata-blue-light);
  text-decoration: none;
  transition: color 0.2s;
}

.legal-card a:hover {
  color: var(--idata-cyan);
  text-decoration: underline;
}