@font-face { font-family:'Archivo Black'; src:url('assets/archivo-black.woff2') format('woff2'); font-weight:100 900; font-style:normal; font-display:swap; }
:root { --ink:#0B0B0C; --volt:#C8FF1E; --paper:#F5F5F2; --grey:#8a8a86; }
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--ink); color:var(--paper); font-family:'Inter',system-ui,sans-serif; overflow-x:hidden; min-height:100svh; }
::selection { background:var(--volt); color:var(--ink); }
.arch { font-family:'Archivo Black','Arial Black',sans-serif; font-style:italic; }

/* grain */
body::after { content:''; position:fixed; inset:0; pointer-events:none; opacity:.05; z-index:99;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E"); }

/* nav */
nav { position:fixed; top:0; left:0; right:0; z-index:50; display:flex; justify-content:space-between; align-items:center; padding:26px 4vw; }
nav .logo { font-family:'Archivo Black',sans-serif; font-style:italic; font-size:17px; color:var(--paper); text-decoration:none; }
nav .logo em { color:var(--volt); font-style:italic; }
nav .links { display:flex; gap:30px; }
nav .links a { color:var(--grey); text-decoration:none; font-size:13px; font-weight:600; letter-spacing:1px; text-transform:uppercase; transition:color .25s; }
nav .links a:hover, nav .links a.active { color:var(--paper); }

main { padding:0 4vw; }

/* big page titles */
.pagehead { padding-top:22vh; margin-bottom:8vh; }
.pagehead .kicker { font-size:12px; letter-spacing:3px; text-transform:uppercase; color:var(--volt); margin-bottom:14px; }
.pagehead h1 { font-family:'Archivo Black',sans-serif; font-style:italic; font-size:clamp(44px,8vw,110px); line-height:1; }

/* underline link */
.ulink { color:var(--paper); text-decoration:none; position:relative; }
.ulink::after { content:''; position:absolute; left:0; bottom:-4px; height:2px; width:100%; background:var(--volt); transform:scaleX(0); transform-origin:right; transition:transform .35s cubic-bezier(.2,.7,.2,1); }
.ulink:hover::after { transform:scaleX(1); transform-origin:left; }

/* reveal */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity:1; transform:none; }

footer { padding:60px 4vw 30px; display:flex; justify-content:space-between; align-items:flex-end; font-size:12px; color:#555; flex-wrap:wrap; gap:10px; }
footer a { color:#555; text-decoration:none; }
footer a:hover { color:var(--paper); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01s !important; transition-duration:.01s !important; }
}

@media (max-width:600px) {
  nav { padding:20px 5vw; }
  nav .logo { font-size:13px; white-space:nowrap; }
  nav .links { gap:12px; }
  nav .links a { font-size:10px; letter-spacing:.5px; }
  .pagehead { padding-top:16vh; }
}