/* Legal pages — Research light theme.
   The base tokens live in styles.css; this file adds the editorial column. */

body[data-page="legal"] { background: var(--bg); }

.legal-page {
  max-width: 780px;
  margin: 0 auto;
  padding: clamp(3rem, 7vh, 5rem) clamp(1.25rem, 5vw, 2rem) 5rem;
  position: relative;
}

.legal-head { margin-bottom: 2.4rem; }
.legal-h1 {
  font-family: var(--display);
  font-weight: 400;
  text-transform: capitalize;
  font-size: clamp(2rem, 4vw, 2.8rem);
  color: var(--ink);
  line-height: 1.04;
  letter-spacing: -0.01em;
  margin: .35rem 0 .5rem;
}
.legal-updated {
  font-family: var(--mono);
  font-size: .7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-mute);
}

.legal-doc { display: grid; gap: 2.4rem; }
.legal-doc h2 {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(1.2rem, 1.7vw, 1.35rem);
  text-transform: capitalize;
  color: var(--ink);
  margin-bottom: .7rem;
  letter-spacing: -0.005em;
}
.legal-doc p,
.legal-doc li {
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.65;
}
.legal-doc p + p { margin-top: .85rem; }
.legal-doc ul {
  margin: .7rem 0 .2rem;
  padding-left: 1.2rem;
  display: grid;
  gap: .5rem;
}
.legal-doc ul li::marker { color: var(--accent); }
.legal-doc a {
  color: var(--accent);
  border-bottom: 1px solid transparent;
  transition: border-color .2s var(--ease-out);
}
.legal-doc a:hover { border-bottom-color: var(--accent); }

.legal-meta {
  margin: 1.3rem 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem 2rem;
  border-top: 1px solid var(--line);
  padding-top: 1.4rem;
}
.legal-meta dt {
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: .3rem;
}
.legal-meta dd {
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1rem;
  color: var(--ink);
}

/* Show/hide active language */
body[data-active-lang="en"] [data-lang="es"] { display: none; }
body[data-active-lang="es"] [data-lang="en"] { display: none; }

.legal-back {
  margin-top: 3rem;
  font-family: var(--mono);
  font-size: .78rem;
  letter-spacing: 0.12em;
}
.legal-back a {
  color: var(--ink-soft);
  border-bottom: 1px solid var(--line);
  padding-bottom: 2px;
  transition: color .2s var(--ease-out), border-color .2s var(--ease-out);
}
.legal-back a:hover { color: var(--accent); border-bottom-color: var(--accent); }