.topline{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  font-size:0.72rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  margin-bottom:1.6rem;
}

.topline .back{
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid rgba(27,23,54,0.35);
  padding-bottom:2px;
}

.header h1{ font-size:3rem; margin-bottom:0.6rem; }
.strap{ font-size:1.1rem; margin-bottom:1.3rem; }

.meta{
  display:flex;
  gap:1.2rem;
  flex-wrap:wrap;
  font-size:0.72rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  opacity:0.9;
  margin-bottom:1.2rem;
}

.rule{
  border:0;
  border-top:1px solid rgba(27,23,54,0.25);
  margin: 0 0 2rem 0;
}

.section{ margin-bottom:2.4rem; }
.section h2{
  font-size:1.25rem;
  margin-bottom:0.7rem;
}

.index{
  display:flex;
  flex-direction:column;
  gap:0.65rem;
  margin-top:0.2rem;
}

.index a{
  color:var(--ink);
  text-decoration:none;
  display:inline-block;
  width:fit-content;
  border-bottom:1px solid rgba(27,23,54,0.25);
  padding-bottom:2px;
}

.footer{
  margin-top:2.5rem;
  font-size:0.75rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  opacity:0.75;
}
/* RESET */
*{margin:0;padding:0;box-sizing:border-box;}

/* LOCKED COLOURS */
:root{
  --void:#332105;
  --paper:#e1ebc2;
  --ink:#1b1736;
}

/* VOID */
body{
  background:var(--void);
  color:var(--ink);
  font-family: serif;
  line-height:1.65;
}

/* CONTENT BOX (normal rectangle, no tricks) */
.paper{
  position:relative;
  max-width:780px;
  margin:4rem auto;
  padding:3rem 3.5rem;
}

/* PARCHMENT OBJECT (drawn behind, so it can be irregular) */
.paper::before{
  content:"";
  position:absolute;
  inset:-18px;              /* gives you a natural edge margin */
  background:var(--paper);
  z-index:-1;

  /* lift */
  box-shadow: 0 26px 46px rgba(0,0,0,0.52);

  /* irregular edge shape (doesn't affect text) */
  clip-path: polygon(
    2% 1%, 8% 0%, 16% 1%, 24% 0%,
    33% 1%, 41% 0%, 50% 1%, 59% 0%,
    67% 1%, 76% 0%, 84% 1%, 92% 0%,
    98% 2%, 99% 10%, 98% 18%, 99% 26%,
    98% 35%, 99% 44%, 98% 53%, 99% 62%,
    98% 71%, 99% 80%, 98% 89%,
    96% 98%, 88% 99%, 80% 98%, 72% 99%,
    64% 98%, 56% 99%, 48% 98%, 40% 99%,
    32% 98%, 24% 99%, 16% 98%, 8% 99%,
    3% 97%, 1% 90%, 2% 82%, 1% 74%,
    2% 66%, 1% 58%, 2% 50%, 1% 42%,
    2% 34%, 1% 26%, 2% 18%, 1% 10%
  );
}

/* GRAIN (on the parchment layer only) */
.paper::after{
  content:"";
  position:absolute;
  inset:-18px;
  z-index:-1;
  pointer-events:none;

  opacity:0.08;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  clip-path: inherit;
}

/* TYPE */
.header h1{
  font-size:2rem;
  font-weight:normal;
  margin-bottom:2rem;
}
.content p{margin-bottom:1.25rem;}
.references{margin-top:3rem;}
.references p{font-size:0.95rem;margin-bottom:0.55rem;}