/*
  Estilos compartidos de las páginas legales de Aulitek.
  Sistema "Deep Space Calm" — openspec/specs/ux_ui_specification.md §2
  Consumido por: terminos.html · privacidad.html · acceso-anticipado.html
*/

:root{
  --bg:#0D1B2A;
  --surface:#1B2A3A;
  --surface-2:#162335;
  --border:#1E3248;
  --border-active:#1E4A7A;
  --accent:#1E8EF0;
  --accent-soft:rgba(30,142,240,.12);
  --mint:#4ECDC4;
  --text:#E8F0F8;
  --muted:#8FA9C4;      /* ver nota de contraste en landing-early-access.html */
  --muted-deep:#5A7A99;
  --maxw:42rem;
}

*,*::before,*::after{box-sizing:border-box}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

.page{max-width:var(--maxw);margin:0 auto;padding:0 1.5rem 5rem}

/* ── Cabecera de la página legal ─────────────────────── */
header.doc-header{
  padding:1.5rem 0 1.25rem;
  border-bottom:1px solid var(--border);
  margin-bottom:2rem;
}
header.doc-header a.back{
  display:inline-flex;align-items:center;gap:.375rem;
  color:var(--accent);text-decoration:none;font-size:.9375rem;font-weight:600;
}
header.doc-header a.back:hover{text-decoration:underline}
.doc-meta{
  margin-top:1rem;
  color:var(--muted);
  font-size:.9375rem;
}
.doc-meta .badge{
  display:inline-block;
  background:var(--accent-soft);
  border:1px solid var(--border-active);
  color:var(--accent);
  border-radius:8px;
  padding:.25rem .625rem;
  font-size:.8125rem;font-weight:600;
  margin-right:.5rem;
}

/* ── Tipografía del cuerpo (viene de pandoc) ─────────── */
main h1{font-size:1.75rem;font-weight:700;line-height:1.25;letter-spacing:-.02em;margin:0 0 .5rem}
main h2{font-size:1.3125rem;font-weight:700;margin:2.25rem 0 .875rem;letter-spacing:-.01em}
main h3{font-size:1.0625rem;font-weight:600;margin:1.5rem 0 .625rem}
main p{margin:0 0 1rem}
main ul,main ol{margin:0 0 1rem;padding-left:1.25rem}
main li{margin-bottom:.375rem}
main strong{font-weight:600;color:var(--text)}
main a{color:var(--accent)}
main a:focus-visible{outline:3px solid var(--mint);outline-offset:2px;border-radius:2px}
main hr{border:0;border-top:1px solid var(--border);margin:2rem 0}
main code{
  background:var(--surface-2);border:1px solid var(--border);border-radius:4px;
  padding:.05rem .35rem;font-size:.9em;
}

main blockquote{
  border-left:3px solid var(--accent);
  background:var(--accent-soft);
  border-radius:0 8px 8px 0;
  margin:0 0 1.25rem;
  padding:.875rem 1rem;
  color:var(--muted);
}
main blockquote p:last-child{margin-bottom:0}

.table-wrap{overflow-x:auto;margin:0 0 1.25rem;border-radius:12px;border:1px solid var(--border)}
main table{
  width:100%;border-collapse:collapse;font-size:.9375rem;background:var(--surface);
}
main th,main td{
  text-align:left;padding:.625rem .875rem;border-bottom:1px solid var(--border);
  white-space:normal;
}
main th{color:var(--muted);font-weight:600;background:var(--surface-2)}
main tr:last-child td{border-bottom:0}

/* ── Pie de página ────────────────────────────────────── */
footer.doc-footer{
  margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--border);
  font-size:.9375rem;color:var(--muted);
}
footer.doc-footer nav{margin-bottom:.75rem;line-height:1.9}
footer.doc-footer nav a{margin-right:.25rem}

@media (min-width:48rem){
  body{font-size:1.125rem}
  main h1{font-size:2.125rem}
  main h2{font-size:1.5rem}
}