:root {
  --ink: #0a0a0a;
  --paper: #f2f0e9;
  --acid: #c7ff37;
  --orange: #ff5c35;
  --muted: #a6a69f;
  --line: rgba(242, 240, 233, .18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--paper);
  background: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x: hidden;
}
body * { text-transform: lowercase !important; }
a { color: inherit; text-decoration: none; }
.wrap { width: min(1240px, calc(100% - 48px)); margin-inline: auto; }
.noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 20; opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
}
.spotlight {
  position: fixed; width: 550px; height: 550px; border-radius: 50%; z-index: -1;
  background: radial-gradient(circle, rgba(199,255,55,.09), transparent 68%);
  transform: translate(-50%,-50%); left: var(--x, 60%); top: var(--y, 25%);
}
.nav { height: 88px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.mark { font-weight: 800; letter-spacing: -.04em; font-size: 20px; }
.mark span { color: var(--acid); }
.nav nav { display: flex; gap: 30px; align-items: center; font-size: 14px; }
.nav nav > a:not(.nav-cta) { color: #c8c8c1; }
.nav nav > a:hover { color: var(--acid); }
.nav-cta { border: 1px solid var(--paper); border-radius: 100px; padding: 12px 18px; transition: .25s; }
.nav-cta:hover { background: var(--paper); color: var(--ink) !important; }

.hero { min-height: 760px; height: calc(100vh - 88px); max-height: 920px; position: relative; padding-top: clamp(80px, 11vh, 130px); overflow: hidden; }
.hero h1 { position: relative; z-index: 2; margin: 30px 0 0; font-size: clamp(68px, 10.7vw, 158px); line-height: .83; letter-spacing: -.075em; font-weight: 790; }
.hero h1 span { color: transparent; -webkit-text-stroke: 1.5px var(--paper); }
.hero-foot { position: absolute; left: 0; right: 0; bottom: 58px; z-index: 2; display: flex; justify-content: space-between; align-items: end; }
.hero-foot p { max-width: 490px; margin: 0; color: #b8b8b1; line-height: 1.55; font-size: clamp(16px, 1.5vw, 21px); }
.round-link { width: 64px; height: 64px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; font-size: 24px; transition: .25s; }
.round-link:hover { background: var(--acid); color: var(--ink); transform: rotate(-45deg); }
.orbit { position: absolute; border: 1px solid rgba(199,255,55,.16); border-radius: 50%; pointer-events: none; }
.orbit-one { width: 420px; height: 420px; right: 4%; top: 15%; }
.orbit-two { width: 680px; height: 680px; right: -7%; top: -1%; }

.ticker { border-block: 1px solid var(--line); overflow: hidden; background: var(--acid); color: var(--ink); transform: rotate(-1deg) scale(1.02); }
.ticker-track { width: max-content; display: flex; align-items: center; gap: 28px; padding: 16px 0; animation: ticker 24s linear infinite; font-size: 14px; font-weight: 800; letter-spacing: .14em; }
.ticker-track i { font-style: normal; }
@keyframes ticker { to { transform: translateX(-50%); } }

.work { padding-block: 150px; }
.section-head { display: grid; grid-template-columns: 1fr 2fr; align-items: end; margin-bottom: 64px; }
.section-head p, .section-label { margin: 0; text-transform: uppercase; letter-spacing: .16em; font-size: 11px; color: var(--muted); }
.section-head h2 { margin: 0; font-size: clamp(52px, 7vw, 96px); line-height: .9; letter-spacing: -.06em; }
.repo-intro { display:flex; align-items:center; justify-content:space-between; padding:0 0 22px; color:var(--muted); font-size:14px; }
.repo-intro p { margin:0; }
#repo-count { font:11px ui-monospace, SFMono-Regular, Menlo, monospace; text-transform:uppercase; letter-spacing:.1em; }
.repo-list { border-top:1px solid var(--line); }
.repo {
  display:grid; grid-template-columns:52px minmax(180px,.8fr) minmax(260px,1.5fr) 110px 100px 24px;
  align-items:center; gap:24px; min-height:92px; padding:18px 4px;
  border-bottom:1px solid var(--line); transition:background .2s, padding .2s;
}
.repo:hover { background:rgba(199,255,55,.045); padding-inline:14px; }
.repo-index, .repo-updated { color:var(--muted); font:11px ui-monospace, SFMono-Regular, Menlo, monospace; }
.repo-name { font-size:clamp(18px,2vw,25px); font-weight:700; letter-spacing:-.035em; overflow-wrap:anywhere; }
.repo-description { color:#aaa9a3; font-size:14px; line-height:1.45; }
.repo-language { color:#cfcec7; font-size:12px; }
.repo-language::before { content:""; display:inline-block; width:7px; height:7px; margin-right:8px; border-radius:50%; background:var(--language-color,var(--acid)); }
.repo-arrow { color:var(--acid); font-size:18px; transition:transform .2s; }
.repo:hover .repo-arrow { transform:translate(3px,-3px); }
.repo-loading, .repo-error { min-height:120px; display:grid; place-items:center; margin:0; color:var(--muted); font-size:14px; border-bottom:1px solid var(--line); }
.repo-error a { color:var(--paper); border-bottom:1px solid var(--paper); }
.github-link { margin:42px 0 0 auto; width:fit-content; display:flex; gap:42px; align-items:center; border-bottom:1px solid var(--paper); padding-bottom:7px; }
.github-link span { color:var(--acid); }

.about { padding-bottom: 160px; display:grid; grid-template-columns: .85fr 1.15fr; gap: clamp(55px,8vw,120px); align-items:center; }
.about-photo { position:relative; }
.about-photo::before { content:""; position:absolute; inset:25px -22px -22px 25px; border:1px solid var(--acid); border-radius:50%; z-index:-1; }
.about-photo img { display:block; width:100%; height:auto; border-radius:50%; filter:grayscale(1) contrast(1.08); }
.photo-label { position:absolute; right:-28px; top:30px; background:var(--acid); color:var(--ink); padding:11px 15px; font:700 12px ui-monospace,monospace; transform:rotate(4deg); }
.about-copy h2 { font-size:clamp(52px,7vw,98px); line-height:.9; letter-spacing:-.065em; margin:28px 0 48px; }
.about-copy .lede { color:var(--paper); font-size:clamp(20px,2vw,28px); line-height:1.4; max-width:670px; }
.about-copy > p:not(.section-label,.lede) { color:#aeadA6; max-width:620px; line-height:1.65; }
.facts { display:flex; gap:clamp(30px,6vw,80px); margin-top:55px; padding-top:28px; border-top:1px solid var(--line); }
.facts div { display:flex; flex-direction:column; gap:5px; }.facts strong { font-size:34px; }.facts span { color:var(--muted); font-size:12px; }

.contact { background:var(--paper); color:var(--ink); padding:130px 0; }
.contact .section-label { color:#666; }
.contact h2 { font-size:clamp(62px,10vw,144px); line-height:.78; letter-spacing:-.075em; margin:45px 0 100px; }
.contact h2 em { color:var(--orange); font-style:normal; }
.socials { border-top:1px solid #aaa; }
.socials a { display:grid; grid-template-columns:1fr 1fr auto; align-items:center; padding:25px 4px; border-bottom:1px solid #aaa; transition:.2s; }
.socials a:hover { padding-inline:18px; background:var(--acid); }
.socials span { font-size:clamp(25px,3vw,38px); font-weight:700; letter-spacing:-.04em; }
.socials small { color:#62625e; }.socials b { font-size:24px; }
footer { min-height:110px; display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:12px; }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }
@media (max-width: 800px) {
  .wrap { width:min(100% - 28px, 1240px); }
  .nav { height:70px; }.nav nav > a:not(.nav-cta) { display:none; }
  .hero { min-height:670px; height:calc(100svh - 70px); padding-top:90px; }
  .hero h1 { font-size:clamp(58px,18vw,100px); line-height:.87; }
  .hero-foot { bottom:35px; align-items:center; }.hero-foot p { max-width:78%; font-size:15px; }
  .round-link { width:50px;height:50px; }.orbit-one { right:-50%;top:24%; }.orbit-two { display:none; }
  .work { padding-block:100px; }.section-head { grid-template-columns:1fr;gap:25px; }
  .repo-intro { align-items:flex-end; gap:20px; }
  .repo { grid-template-columns:34px 1fr 22px; gap:10px; min-height:100px; }
  .repo-description { grid-column:2/4; }.repo-language, .repo-updated { display:none; }
  .about { grid-template-columns:1fr; padding-bottom:100px; }.about-photo { width:calc(100% - 20px); }
  .facts { justify-content:space-between;gap:10px; }.contact { padding:90px 0; }.contact h2 { margin-bottom:70px; }
  .socials a { grid-template-columns:1fr auto; }.socials small { display:none; }
  footer { flex-direction:column; justify-content:center; gap:4px; text-align:center; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }.ticker-track { animation:none; }.reveal { opacity:1; transform:none; transition:none; }
}