:root{
  --bg:#0b0b0b; --cream:#f2efe8; --text:#c9c5bb; --muted:#8a8578; --line:#2a2823;
  --accent:#5b9bff;
  --serif:'Instrument Serif',Georgia,serif;
  --sans:'Inter',-apple-system,system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:400 16px/1.65 var(--sans);overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:min(1080px,100% - 48px);margin:0 auto}
::selection{background:var(--accent);color:#000}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:20px 28px;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.stuck{background:rgba(11,11,11,.88);backdrop-filter:blur(8px);border-color:var(--line)}
.name{font:500 15px var(--sans);color:var(--cream)}
.nav nav{display:flex;gap:26px;font-size:14px}
.nav nav a{color:var(--muted);transition:color .2s}
.nav nav a:hover{color:var(--cream)}

/* hero */
.hero{padding:140px 0 64px}
.hero-inner{width:min(1080px,100% - 48px);margin:0 auto}
h1{font:600 clamp(40px,6vw,64px)/1.1 var(--sans);letter-spacing:-.03em;color:var(--cream)}
.hero-sub{max-width:520px;margin-top:16px;font-size:18px}
.socials{display:flex;gap:18px;margin-top:24px}
.socials a{color:var(--muted);transition:color .2s}
.socials a:hover{color:var(--cream)}

/* sections */
.block{padding:110px 0;border-top:1px solid var(--line)}
.two{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:start}
h2{font:400 32px/1.15 var(--serif);color:var(--cream)}
.two p{max-width:640px;margin-bottom:16px}
h3{font:500 20px/1.3 var(--sans);color:var(--cream);margin-bottom:8px}
.list{display:flex;flex-direction:column}
.item{padding:0 0 36px;margin-bottom:36px;border-bottom:1px solid var(--line);max-width:640px}
.item:last-child{border:0;margin:0;padding:0}
.item p{margin-bottom:8px}
.meta{font-size:14px;color:var(--muted)}
.links{display:flex;gap:20px;font-size:14px}
.links a{color:var(--accent);border-bottom:1px solid transparent}
.links a:hover{border-color:var(--accent)}
.plain{list-style:none;margin-bottom:20px}
.plain li{padding:10px 0;border-bottom:1px solid var(--line);max-width:640px}
.plain li:first-child{border-top:1px solid var(--line)}

/* space images */
.pics{display:grid;grid-template-columns:.7fr 1fr 1fr;gap:16px;margin-top:56px;align-items:stretch}
.pics img{width:100%;height:100%;object-fit:cover;border:1px solid var(--line)}

/* sub pages */
.page{padding:140px 0 110px;min-height:100svh}
.nav nav a[aria-current]{color:var(--cream)}
code{font-size:.9em;color:var(--cream)}

/* contact */
.foot a{font:400 24px/1.3 var(--serif);color:var(--cream);transition:color .2s}
.foot a:hover{color:var(--accent)}
.foot p{margin-bottom:10px}

/* reveal */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

@media(max-width:800px){
  .two{grid-template-columns:1fr;gap:16px}
  .pics{grid-template-columns:1fr}
  .block{padding:72px 0}
  .nav nav{gap:16px}
  .nav nav a:nth-child(-n+3){display:none}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}
