/* Paginas de texto: informacion, privacidad y contacto.
   Una sola hoja para las tres: es el mismo objeto —una columna de prosa— y
   tener tres archivos casi iguales garantiza que se separen con el tiempo. */

.wrap{max-width:720px;margin:0 auto;padding:14px 14px 70px}

.volver{
  display:inline-block;text-decoration:none;color:var(--faint);
  font-size:15px;margin-bottom:12px
}
.volver:hover,.volver:focus-visible{color:var(--accent);outline:none}

/* El titulo NO lleva la palabra "documentacion" ni "pagina": nombra la cosa. */
.doc h1{
  font-size:30px;line-height:1.2;margin:8px 0 4px;font-weight:600
}

/* La bajada dice de que se trata en una linea, para el que no va a leer todo. */
.doc .bajada{
  color:var(--faint);font-size:18px;margin:0 0 26px
}

.doc h2{
  font-size:20px;font-weight:600;margin:34px 0 10px;
  padding-top:14px;border-top:1px solid var(--line)
}

.doc h3{font-size:17px;font-weight:600;margin:22px 0 6px}

.doc p{margin:0 0 14px}

.doc ul{margin:0 0 14px;padding-left:20px}
.doc li{margin:0 0 7px}

.doc a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--line)}
.doc a:hover,.doc a:focus-visible{border-bottom-color:var(--accent);outline:none}

.doc code{
  font-family:ui-monospace,"Cascadia Code",Consolas,monospace;
  font-size:.9em;background:var(--sunk);padding:1px 5px;border-radius:4px
}

/* Bloque destacado: se usa para lo que alguien va a venir a buscar puntualmente
   —la regla del corte, lo que no se puede pedir— y no debe quedar sepultado
   en un parrafo mas. */
.doc .marco{
  border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:6px;padding:14px 16px;margin:0 0 18px;background:var(--sunk)
}
.doc .marco p:last-child{margin-bottom:0}
.doc .marco h3{margin-top:0}

/* Tabla de datos sueltos. Con scroll propio: en movil una tabla no puede
   ensanchar la pagina entera. */
.doc .tabla-cont{overflow-x:auto;margin:0 0 18px}
.doc table{border-collapse:collapse;width:100%;font-size:15px}
.doc th,.doc td{
  text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);
  vertical-align:top
}
.doc th{color:var(--faint);font-weight:600;white-space:nowrap}

.doc .correo{
  font-family:ui-monospace,"Cascadia Code",Consolas,monospace;
  font-size:19px
}

.pie-ctl{
  display:flex;justify-content:center;align-items:center;gap:10px;
  margin-top:40px
}

@media(max-width:620px){
  .doc h1{font-size:25px}
  .doc .bajada{font-size:17px}
}