/* Estilos compartidos para paginas legales de Magic Route */
:root {
  --bg:      #06060F;
  --bg2:     #0B0B1D;
  --white:   #F2F2FC;
  --muted:   rgba(242,242,252,0.65);
  --muted2:  rgba(242,242,252,0.85);
  --brand:   #4F6EFF;
  --grad:    linear-gradient(90deg, #4F6EFF, #A066FF);
  --border:  rgba(255,255,255,0.08);
  --card:    rgba(255,255,255,0.03);
  --font:    'Space Grotesk', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--white);
  font-family: var(--font);
  line-height: 1.6;
  min-height: 100vh;
}

header.lp-header {
  background: linear-gradient(135deg, #2B3FD4 0%, #5B3FFF 50%, #7A2BC2 100%);
  padding: 36px 24px;
  color: #fff;
}
.lp-header-inner {
  max-width: 760px; margin: 0 auto;
}
.lp-back {
  display: inline-flex; align-items: center; gap: 6px;
  color: rgba(255,255,255,0.88);
  font-size: 13px; font-weight: 700;
  text-decoration: none;
  margin-bottom: 18px;
}
.lp-back:hover { color: #fff; }
.lp-title {
  font-size: clamp(26px, 4vw, 32px);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.lp-sub {
  font-size: 14px;
  opacity: 0.88;
  margin-top: 8px;
}
.lp-meta {
  font-size: 12px;
  opacity: 0.7;
  margin-top: 12px;
}

main.lp-main {
  max-width: 760px;
  margin: 0 auto;
  padding: 36px 24px 80px;
  font-size: 15px;
}

main.lp-main h2 {
  font-size: 22px; font-weight: 800;
  margin-top: 36px; margin-bottom: 12px;
  color: var(--white);
}
main.lp-main h2:first-child { margin-top: 0; }
main.lp-main h3 {
  font-size: 16px; font-weight: 700;
  margin-top: 24px; margin-bottom: 8px;
  color: var(--white);
}
main.lp-main p {
  margin: 12px 0;
  color: var(--muted2);
}
main.lp-main ul {
  margin: 12px 0 16px 22px;
  color: var(--muted2);
}
main.lp-main li { margin: 6px 0; }
main.lp-main a {
  color: var(--brand);
  text-decoration: underline;
  text-decoration-color: rgba(79,110,255,0.4);
}
main.lp-main a:hover { color: #A066FF; }
main.lp-main b, main.lp-main strong { color: var(--white); }

main.lp-main .note {
  background: rgba(43,63,212,.08);
  border: 1px solid rgba(43,63,212,0.22);
  border-radius: 12px;
  padding: 14px 16px;
  margin: 20px 0;
  font-size: 14px;
  color: var(--muted2);
}

main.lp-main .card {
  background: linear-gradient(135deg, rgba(79,110,255,0.06), rgba(160,102,255,0.06));
  border: 1px solid rgba(79,110,255,0.22);
  border-radius: 14px;
  padding: 20px 22px;
  margin: 16px 0 24px;
}
main.lp-main .card .label {
  font-size: 12px; font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 6px;
}
main.lp-main .card .email-big {
  font-size: 22px; font-weight: 800;
  color: var(--brand);
  text-decoration: none;
  word-break: break-all;
}

footer.lp-footer {
  border-top: 1px solid var(--border);
  background: #050510;
  padding: 24px;
}
.lp-footer-inner {
  max-width: 760px; margin: 0 auto;
  display: flex; flex-wrap: wrap; gap: 16px;
  font-size: 13px;
  color: var(--muted);
}
.lp-footer-inner a {
  color: var(--brand);
  text-decoration: none;
  font-weight: 600;
}
.lp-footer-inner a:hover { color: var(--white); }
.lp-footer-inner .spacer { flex: 1; }

@media (max-width: 600px) {
  main.lp-main { padding: 24px 18px 60px; font-size: 14px; }
  header.lp-header { padding: 28px 18px; }
  .lp-footer-inner { flex-direction: column; gap: 10px; }
}