/* Estilos de las páginas legales. Comparten paleta con la portada pero van en fichero
   aparte: son documentos largos y necesitan otro ritmo de lectura.
   La paleta sale del logotipo original de APTEN (navy #4c5270, rosa, turquesa, oro). */
:root{
  --navy:#4c5270; --navy-hondo:#3c4159;
  --turquesa:#36eee0; --turquesa-hondo:#0e7c74;
  --rosa:#be5290; --oro:#f8ca62;
  --tinta:#252838; --tinta-suave:#575c78; --papel:#ffffff; --borde:#e4e6ef;
  --ancho:min(760px, 92vw);
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--papel); color:var(--tinta);
  font:400 17px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.caja{width:var(--ancho); margin:0 auto}
a{color:var(--turquesa-hondo)}

/* El cuadrado del logotipo comparte fondo con la barra, así que encaja sin costura. */
.barra{background:var(--navy-hondo); padding:.7rem 0}
.marca{display:inline-flex; align-items:center; gap:.55rem; text-decoration:none}
.marca img.pi{width:34px; height:34px; border-radius:8px; display:block}
.marca img.letras{height:22px; width:auto; display:block}

.documento{padding:3rem 0 4rem}
.documento h1{font-size:clamp(1.9rem,5vw,2.6rem); font-weight:800; letter-spacing:-.02em; margin:0 0 .3em}
.documento h2{font-size:1.2rem; font-weight:700; margin:2.2rem 0 .6rem; letter-spacing:-.01em}
.documento p{margin:0 0 1.1em}
.fecha{color:var(--tinta-suave); font-size:.95rem; margin-bottom:2rem}

.datos{padding-left:1.2rem; margin:0 0 1.2em}
.datos li{margin-bottom:.45rem}

/* El hueco tiene que cantar: si esto llega publicado, se ve desde lejos. */
.hueco{
  background:#fff3cd; color:#7a5b00; border:1px dashed #d9a400;
  padding:.1em .5em; border-radius:5px; font-weight:700; font-size:.92em;
}
.pendiente{
  background:#fdecea; border:2px solid #d93025; color:#8b1a12;
  padding:1rem 1.2rem; border-radius:10px; margin-bottom:2.5rem; font-size:.95rem;
}
.pendiente code{background:rgba(0,0,0,.06); padding:.1em .4em; border-radius:4px}

.tabla{border-collapse:collapse; width:100%; margin:0 0 1.4em; font-size:.94rem}
.tabla th,.tabla td{border:1px solid var(--borde); padding:.6rem .7rem; text-align:left; vertical-align:top}
.tabla th{background:#f5f7fb; font-weight:700}

.nota{
  border-left:4px solid var(--rosa); padding-left:1rem;
  color:var(--tinta-suave); font-size:.94rem; font-style:italic; margin-top:2.5rem;
}

.pie{background:var(--navy-hondo); color:#b4b8cf; padding:1.6rem 0; font-size:.9rem}
.pie a{color:#e2e5f4}

/* En móvil, que la tabla no rompa el ancho de la página. */
@media (max-width:560px){
  .tabla{display:block; overflow-x:auto; white-space:nowrap}
}