/* ──────────────────────────────────────────────────────────────
   Páginas legales · La Ventaja Invisible

   El mismo mundo que la portada —negro, oro, serif— pero en modo
   lectura: columna estrecha, más interlineado y nada que distraiga.
   Una página legal que parece un anuncio no la lee nadie, y leerla
   es justo de lo que se trata.
   ────────────────────────────────────────────────────────────── */

:root{
  --tinta:#0B0A09;
  --tinta-alta:#13110E;
  --oro:#C9A227;
  --oro-luz:#E3C56B;
  --hueso:#F4F1EA;
  --gris:#9A948A;
  --gris-hondo:#5E584F;
  --linea:rgba(201,162,39,.22);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
  --borde:clamp(1.25rem,5vw,3rem);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}

body{
  font-family:var(--sans);font-weight:300;font-size:1rem;line-height:1.8;
  color:var(--hueso);background:var(--tinta);
}

.env{width:min(100% - 2rem,44rem);margin-inline:auto}

a{color:var(--oro-luz)}
a:focus-visible{outline:2px solid var(--oro);outline-offset:2px}
code{font-family:ui-monospace,Consolas,monospace;font-size:.88em;
  background:rgba(201,162,39,.1);padding:.1em .35em;border-radius:.2em;
  color:var(--oro-luz)}

/* ── Cabecera ──────────────────────────────────────────────────── */
.cab{border-bottom:1px solid rgba(255,255,255,.06);padding-block:1.3rem}
.cab__caja{display:flex;align-items:baseline;justify-content:space-between;
  gap:1rem;flex-wrap:wrap}
.cab__marca{text-decoration:none;color:var(--hueso)}
.cab__t{font-family:var(--serif);font-size:1.3rem;display:block;line-height:1.1}
.cab__s{font-size:.64rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--gris-hondo)}
.cab__volver{font-size:.8rem;text-decoration:none;color:var(--gris);
  white-space:nowrap}
.cab__volver:hover{color:var(--hueso)}

/* ── Título ────────────────────────────────────────────────────── */
.titulo{padding-block:clamp(2.5rem,7vw,4rem);
  border-bottom:1px solid rgba(255,255,255,.06);
  background:radial-gradient(70% 100% at 50% 0%,rgba(201,162,39,.07),transparent)}
.rotulo{font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--oro)}
.titulo h1{font-family:var(--serif);font-weight:300;
  font-size:clamp(2rem,1.5rem + 2.2vw,3rem);line-height:1.1;
  margin-block:.6rem .7rem}
.titulo p{color:var(--gris);font-size:.98rem}

/* ── Cuerpo ────────────────────────────────────────────────────── */
main{padding-block:clamp(2.5rem,6vw,4rem)}
main h2{font-family:var(--serif);font-weight:300;
  font-size:clamp(1.4rem,1.2rem + .8vw,1.9rem);color:var(--hueso);
  margin-block:2.4rem .8rem;line-height:1.2}
main h2:first-of-type{margin-top:0}
main p{margin-bottom:1rem;color:#D8D3C9}
main b,main strong{color:var(--hueso);font-weight:400}
main i{color:var(--oro-luz);font-style:italic}

/* ── Tablas ────────────────────────────────────────────────────── */
.tabla{width:100%;overflow-x:auto;margin-bottom:1.4rem}
table{width:100%;border-collapse:collapse;font-size:.94rem;
  min-width:min(100%,26rem)}
th,td{text-align:left;vertical-align:top;padding:.8rem .9rem;
  border-bottom:1px solid rgba(255,255,255,.07)}
thead th{color:var(--oro);font-weight:400;font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase}
tbody th{width:11rem;color:var(--gris);font-weight:300}

/* El dato que falta, imposible de pasar por alto */
.pendiente{display:inline-block;padding:.12rem .5rem;border-radius:.2rem;
  background:rgba(201,162,39,.16);color:var(--oro-luz);
  border:1px solid var(--oro);font-size:.82rem;letter-spacing:.1em}

/* ── Avisos ────────────────────────────────────────────────────── */
.nota{padding:1.1rem 1.3rem;border-radius:.25rem;background:var(--tinta-alta);
  border:1px solid var(--linea);margin-bottom:1.6rem;font-size:.95rem}
.nota p:last-child{margin-bottom:0}

/* ── Pie ───────────────────────────────────────────────────────── */
.pie{padding-block:2.5rem;border-top:1px solid rgba(255,255,255,.06);
  color:var(--gris-hondo);font-size:.84rem;line-height:1.8;margin-top:3rem}
.pie b{color:var(--gris)}
.pie__enlaces{display:flex;flex-wrap:wrap;gap:.4rem 1.3rem;margin-bottom:.9rem}