:root{--paper: #efece3;--ink: #23211d;--ink-soft: #46423b;--ink-faint: #6b6558;--pad: clamp(20px, 5vw, 64px);--name: #bd087f }*{box-sizing:border-box}html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Space Mono,ui-monospace,monospace;overflow-x:hidden}h1,h2,h3{font-family:Archivo Black,Helvetica,sans-serif;font-weight:400;margin:0}a{color:var(--ink);text-decoration:none}::selection{background:var(--ink);color:var(--paper)}.page{position:relative;min-height:100vh;overflow:hidden}.layer{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.grain{z-index:3;opacity:.5;mix-blend-mode:multiply;background-image:radial-gradient(#00000012 1px,transparent 1.1px),radial-gradient(#00000010 1px,transparent 1.1px);background-size:3px 3px,7px 7px;background-position:0 0,2px 3px}.grid{z-index:2;opacity:.85;background-image:linear-gradient(#23211d18 1px,transparent 1px),linear-gradient(90deg,#23211d18 1px,transparent 1px);background-size:38px 38px,38px 38px}.vignette{z-index:4;background:radial-gradient(120% 90% at 50% 40%,transparent 55%,#00000018 100%)}.pencil{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:20}.hero{position:relative;z-index:10;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:80px var(--pad) 80px}.sheet{transform-style:preserve-3d;will-change:transform}.tag{display:inline-block;margin:0 0 clamp(14px,2vw,26px);padding:6px 12px;border:2px solid var(--ink);font-size:clamp(11px,1.1vw,13px);font-weight:700;letter-spacing:.2em;text-transform:uppercase}.hero__title{font-size:clamp(52px,14vw,228px);line-height:1.05;letter-spacing:-.05em;text-transform:uppercase;text-wrap:balance}.mark{display:inline-block;line-height:.78;padding:.06em .08em .1em;background:var(--name);color:var(--paper)}.divider{position:relative;z-index:10;padding:0 var(--pad)}.divider svg{display:block;width:100%;height:40px;overflow:visible}.section{position:relative;z-index:10;padding:clamp(60px,9vw,130px) var(--pad) clamp(40px,6vw,90px)}.section__head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:clamp(30px,4vw,54px)}.section__head h2{font-size:clamp(30px,5.2vw,78px);line-height:.88;letter-spacing:-.04em;text-transform:uppercase}.section__head .tag{margin:0}.works{display:flex;flex-direction:column;border-top:3px solid var(--ink)}.work{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:clamp(14px,3vw,34px);padding:clamp(18px,2.4vw,30px) clamp(4px,1vw,12px);border-bottom:3px solid var(--ink);transition:background .15s,color .15s,padding-left .2s}.work:hover{background:var(--ink);color:var(--paper);padding-left:26px}.work__num{font-family:Archivo Black,Helvetica,sans-serif;font-size:clamp(13px,1.2vw,16px)}.work__name{font-family:Archivo Black,Helvetica,sans-serif;font-size:clamp(22px,4vw,54px);line-height:1;letter-spacing:-.035em;text-transform:uppercase}.work__meta{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.work__links{display:flex;gap:8px}.work__links a{padding:5px 10px;border:2px solid currentColor;color:var(--ink);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;transition:background .15s,color .15s}.work:hover .work__links a{color:var(--paper)}.work__links a:hover{background:var(--paper);color:var(--ink)}.work:hover .work__links a:hover{color:var(--ink)}.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:clamp(50px,8vw,110px);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8b8577}.draw path{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.1s cubic-bezier(.65,.02,.28,1)}.draw.is-drawn path{stroke-dashoffset:0}.draw path:nth-child(2){transition-delay:.16s}@keyframes rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.hero__title{animation:rise 1s .18s both ease-out}@media (max-width: 720px){.topbar{padding:14px 16px;gap:10px;flex-wrap:wrap}.hero{padding-top:110px}.work{grid-template-columns:auto 1fr auto}.work__meta{grid-column:2;font-size:10px}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}.draw path{stroke-dashoffset:0!important}}
