/* Legal documents — the same world, quieter. Made to be read. */
:root{
  --void:#08090A; --pit:#0B0C0D; --edge:#2A2C31;
  --bone:#F4F1EA; --dust:#A9A79F; --mute:#6F6D66;
  --red:#C2172B; --red-lit:#E0323F; --green-lit:#12A05A;
  --display:"Marcellus","Optima",Palatino,serif;
  --body:"Karla",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --arrive:cubic-bezier(0.16,1,0.3,1);
  --gut:clamp(1.25rem,5vw,3rem);
  color-scheme:dark;
}
*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0; background:var(--void); color:var(--bone);
  font-family:var(--body); font-weight:300;
  font-size:clamp(1rem,0.96rem+0.2vw,1.06rem); line-height:1.72;
  -webkit-font-smoothing:antialiased;
}
::selection{ background:var(--red); color:var(--bone); }
:focus-visible{ outline:1px solid var(--red-lit); outline-offset:3px; }
html{ scrollbar-color:var(--edge) var(--void); scrollbar-width:thin; }

.mono{ font-family:var(--mono); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; }

.doc__top{
  position:sticky; top:0; z-index:10;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.1rem var(--gut);
  background:color-mix(in srgb, var(--void) 88%, transparent);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--edge);
}
.doc__top .mono{ color:var(--red-lit); }
.doc__back{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--dust); text-decoration:none;
  transition:color 220ms ease;
}
@media (hover:hover) and (pointer:fine){ .doc__back:hover{ color:var(--bone); } }

.doc{
  max-width:38rem; margin-inline:auto;
  padding:clamp(3rem,9vh,6rem) var(--gut) clamp(4rem,10vh,7rem);
}
.doc h1{
  font-family:var(--display); font-weight:400;
  font-size:clamp(2.4rem,7vw,3.6rem); letter-spacing:-0.02em; line-height:1.05;
  margin:0 0 1.4rem;
}
.doc__lede{ font-size:1.14rem; line-height:1.62; color:var(--bone); margin:0 0 1.6rem; }
.doc__date{ color:var(--mute); margin:0 0 3rem; }

.doc h2{
  font-family:var(--display); font-weight:400;
  font-size:1.42rem; letter-spacing:-0.012em;
  margin:3rem 0 .9rem; padding-top:1.6rem;
  border-top:1px solid var(--edge);
}
.doc p{ margin:0 0 1.1rem; color:var(--dust); }
.doc p b{ color:var(--bone); font-weight:500; }
.doc ul{ margin:0 0 1.4rem; padding:0 0 0 1.1rem; list-style:none; }
.doc li{
  position:relative; margin-bottom:.55rem; color:var(--dust);
}
.doc li::before{
  content:""; position:absolute; left:-1.1rem; top:.72em;
  width:4px; height:4px; background:var(--red); border-radius:50%;
}
.doc li b{ color:var(--bone); font-weight:500; }
.doc a{ color:var(--bone); text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--red); }
@media (hover:hover) and (pointer:fine){ .doc a:hover{ color:var(--red-lit); } }
.doc code{
  font-family:var(--mono); font-size:.86em;
  background:var(--pit); border:1px solid var(--edge);
  padding:.1em .4em; border-radius:3px; color:var(--bone);
}

/* what still needs the client's answer, marked rather than invented */
.doc__note{
  margin:3rem 0 0; padding:1.4rem 1.5rem;
  background:var(--pit); border:1px solid var(--edge);
  border-left:2px solid var(--green-lit);
}
.doc__note .mono{ color:var(--green-lit); margin:0 0 .7rem; }
.doc__note p{ margin:0; font-size:.95rem; }

.doc__foot{ margin-top:3.4rem; padding-top:1.6rem; border-top:1px solid var(--edge); }