*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --black-ink:#0D0D0D;
  --charcoal:#1A1A1A;
  --dark-body:#2B2B2B;
  --mid-gray:#737373;
  --light-caption:#999999;
  --ghost-numeral:#D4D4D4;
  --whisper-rule:#E8E8E8;
  --paper:#F7F7F7;
}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--paper);
  color:var(--dark-body);
  line-height:1.75;
  font-size:15px;font-weight:400;
}
body::after{
  content:'';position:fixed;inset:0;
  background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAfElEQVQ4T2NkYPj/n4EBFTAiswEKGLFJMDIyMjAwMDD8//+fgZGRkRFdHCaOLoYszsDAIICuC2YITB5mEEwvCx4XooujiWOIgQxBFkMXJ8YQgr5EN4QYQ/C6kJBLCbqUkEuJcSmyS7ENIeRSgi4l5NJRQ0cNJWgoAQAJCi5zZ6gMRQAAAABJRU5ErkJggg==') repeat;
  opacity:0.02;mix-blend-mode:multiply;pointer-events:none;z-index:9999;
}

.noise-overlay{display:none}

.margin-ticks{
  position:fixed;left:3vw;top:0;bottom:0;z-index:10;
  pointer-events:none;
}
.tick{
  position:absolute;width:12px;height:1px;
  background:var(--ghost-numeral);
  transform:rotate(45deg);
}
@media(max-width:1400px){.margin-ticks{display:none}}

.classification-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:0;
  transition:opacity 0.4s ease;
}
.header-rule-full{
  width:100%;height:1px;background:var(--charcoal);
  margin-top:48px;
}
.header-content{
  margin-left:12vw;padding:12px 0 0;
  display:flex;align-items:center;gap:8px;
}
@media(max-width:1200px){.header-content{margin-left:auto;margin-right:auto;max-width:720px;padding-left:24px}}
.domain-label{
  font-weight:500;font-size:11px;text-transform:uppercase;
  letter-spacing:0.25em;color:var(--mid-gray);
  transition:color 0.3s cubic-bezier(0.25,0.46,0.45,0.94),transform 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
  transform-origin:left center;
}
.domain-label:hover{color:var(--black-ink);transform:scale(1.04)}
.header-slash{
  font-weight:200;font-size:14px;color:#ABABAB;
}
.header-date{
  font-family:'Space Mono',monospace;font-weight:400;font-size:10px;
  color:var(--light-caption);
}
.header-rule-thin{
  width:100%;height:0.5px;background:var(--whisper-rule);
  margin-top:8px;
}

.document{
  margin-left:12vw;max-width:720px;
  padding-top:15vh;padding-bottom:160px;
}
@media(max-width:1200px){
  .document{margin:0 auto;padding-left:24px;padding-right:24px}
}

.title-block{padding-bottom:64px}
.title-block h1{
  font-weight:300;font-size:clamp(3rem,7vw,5.5rem);
  line-height:1.05;letter-spacing:-0.02em;
  color:var(--black-ink);
  margin-bottom:32px;
}
.title-meta{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.meta-item{
  font-family:'Space Mono',monospace;font-size:10px;font-weight:400;
  color:var(--light-caption);line-height:1.6;
}
.meta-sep{color:var(--ghost-numeral);font-size:10px}

.section-chevron{
  display:flex;justify-content:center;
  padding:80px 0;
}

.content-section{
  position:relative;padding-bottom:0;
}
.ghost-number{
  display:block;font-weight:200;font-size:72px;
  color:var(--ghost-numeral);line-height:1;
  margin-bottom:8px;
}
.content-section h2{
  font-weight:600;font-size:18px;line-height:1.3;
  letter-spacing:0.01em;color:var(--charcoal);
  text-transform:uppercase;
  transform-origin:left center;
  transition:color 0.3s cubic-bezier(0.25,0.46,0.45,0.94),transform 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
  margin-bottom:24px;
}
.content-section h2:hover{color:var(--black-ink);transform:scale(1.02)}
.content-section p{
  max-width:65ch;margin-bottom:24px;
}

.terminal-section{
  display:flex;flex-direction:column;
  align-items:center;
  padding-top:160px;padding-bottom:80px;
}
.terminal-diagonal{
  transform-origin:center;
  transition:transform 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
}
.terminal-diagonal:hover{transform:scale(1.08)}
.terminal-end{
  margin-top:24px;
  font-size:9px;text-transform:uppercase;
  letter-spacing:0.5em;color:#ABABAB;
}
