:root { --bg:#101110; --panel:#171917; --muted:#949992; --text:#f1f3ed; --lime:#c7f34a; --line:rgba(241,243,237,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:var(--bg); font-family:'Space Grotesk', sans-serif; overflow-x:hidden; }
.cursor-dot,.cursor-ring { position:fixed; top:0; left:0; pointer-events:none; z-index:20; border-radius:50%; opacity:0; transform:translate(-50%,-50%); transition:opacity .2s, width .2s, height .2s, background .2s, border-color .2s; }
.cursor-dot { width:6px; height:6px; background:var(--lime); }.cursor-ring { width:34px; height:34px; border:1px solid rgba(199,243,74,.7); }.cursor-ring.cursor-hover { width:56px; height:56px; background:rgba(199,243,74,.1); border-color:var(--lime); }
.noise { position:fixed; inset:0; opacity:.035; pointer-events:none; z-index:5; 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='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.container { width:min(1120px, calc(100% - 64px)); margin:auto; }
.topbar { height:84px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; position:relative; width:100%; margin:0; padding:0 32px; }
.brand { color:var(--text); text-decoration:none; font-size:1.02rem; font-weight:700; letter-spacing:.16em; display:flex; align-items:center; gap:10px; }.brand-mark { color:var(--bg); background:var(--lime); width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font-size:.9rem; letter-spacing:0; }.dot,.lime { color:var(--lime); }
nav { display:flex; gap:34px; position:absolute; left:50%; transform:translateX(-50%); } nav a,.top-link,.text-link,.footer a { color:var(--muted); text-decoration:none; font:12px 'DM Mono', monospace; transition:color .2s; } nav a:hover,.top-link:hover,.footer a:hover { color:var(--lime); }.top-link { color:var(--text); }.top-link span,.text-link span { color:var(--lime); font-size:16px; margin-left:7px; }.top-actions { display:flex; align-items:center; gap:24px; margin-left:auto; }.language-switch { display:flex; align-items:center; gap:7px; color:var(--muted); font:10px 'DM Mono',monospace; }.language { border:0; padding:0; color:var(--muted); background:transparent; cursor:pointer; font:10px 'DM Mono',monospace; }.language.active { color:var(--lime); }
.hero { min-height:600px; display:grid; grid-template-columns:1.1fr .9fr; align-items:center; padding:70px 0 94px; }.eyebrow { color:var(--lime); font:11px 'DM Mono', monospace; letter-spacing:.1em; text-transform:uppercase; }.pulse { width:7px; height:7px; display:inline-block; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(199,243,74,.12); margin-right:10px; }.hero h1 { font-size:clamp(3.5rem, 7vw, 6.6rem); line-height:.95; letter-spacing:-.075em; margin:28px 0; font-weight:600; }.hero h1 em { font-style:normal; color:var(--lime); }.intro { max-width:380px; color:var(--muted); line-height:1.7; font-size:15px; }.hero-actions { display:flex; align-items:center; gap:28px; margin-top:38px; }.button { display:inline-flex; align-items:center; gap:25px; padding:16px 20px; text-decoration:none; font:12px 'DM Mono', monospace; transition:transform .2s, background .2s; }.button:hover { transform:translateY(-3px); }.button-primary { color:var(--bg); background:var(--lime); }.button-primary span,.button-light span { font-size:17px; }.text-link { color:var(--text); }
.hero-orbit { position:relative; width:min(390px, 80vw); aspect-ratio:1; margin:auto; border:1px solid var(--line); border-radius:50%; background:radial-gradient(circle at 50% 50%, rgba(199,243,74,.14), transparent 50%); }.orbit { position:absolute; inset:9%; border:1px dashed rgba(199,243,74,.38); border-radius:50%; transform:rotate(-28deg); }.orbit-two { inset:20%; border-color:rgba(241,243,237,.2); transform:rotate(45deg) scaleX(1.5); }.avatar { position:absolute; inset:31%; border-radius:50%; background:var(--lime); color:var(--bg); display:grid; place-items:center; align-content:center; box-shadow:0 0 65px rgba(199,243,74,.25); }.avatar span { font-size:5rem; font-weight:700; letter-spacing:-.1em; }.avatar small { font:10px 'DM Mono',monospace; }.orbital-label { position:absolute; color:var(--muted); font:10px 'DM Mono',monospace; letter-spacing:.08em; }.label-top { top:13%; right:10%; }.label-bottom { bottom:13%; left:10%; }.spark { position:absolute; color:var(--lime); font-size:24px; }.spark-one { top:19%; left:17%; }.spark-two { right:15%; bottom:21%; font-size:34px; }
.ticker { border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; white-space:nowrap; background:linear-gradient(90deg, var(--lime), #e2ff91, var(--lime)); color:var(--bg); transform:rotate(-1.2deg) scale(1.02); margin:8px 0; }.ticker-track { width:max-content; padding:15px 0; display:flex; align-items:center; gap:74px; animation:slide 23s linear infinite; font:700 15px 'DM Mono',monospace; letter-spacing:.22em; }.ticker-track span:nth-child(3n+2) { color:transparent; -webkit-text-stroke:1px var(--bg); } @keyframes slide { to { transform:translateX(-50%); } }
.about,.links-section { padding:112px 0 0; }.section-heading { display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }.section-heading .eyebrow { margin:0 0 16px; }.section-number { color:var(--muted); font:11px 'DM Mono',monospace; }.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; padding:54px 0 0; }.about h2,.contact h2 { margin:0; font-size:clamp(2.5rem,5vw,4.8rem); line-height:1; letter-spacing:-.07em; font-weight:500; }.about h2 span,.contact h2 span { color:var(--muted); }.about-copy { max-width:410px; color:var(--muted); line-height:1.75; font-size:15px; }.signature { display:block; margin-top:45px; color:var(--text); font:19px 'DM Mono',monospace; transform:rotate(-6deg); }.signature i { color:var(--lime); font-style:normal; }
.social-list { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; padding-top:28px; }.social-card { min-height:155px; background:var(--panel); color:var(--text); text-decoration:none; padding:24px; display:flex; align-items:flex-start; gap:18px; position:relative; overflow:hidden; opacity:0; transform:translateY(18px); transition:transform .25s, background .25s, opacity .5s ease; }.social-card.is-visible { opacity:1; transform:translateY(0); }.social-card:hover { transform:translateY(-5px); background:#20231e; }.social-card::after { content:''; position:absolute; width:130px; height:130px; right:-35px; bottom:-70px; border-radius:50%; border:1px solid rgba(255,255,255,.12); }.github,.kickstatz { grid-column:span 2; }.kickstatz { border:1px solid rgba(199,243,74,.35); }.card-icon { width:42px; height:42px; border:1px solid var(--line); display:grid; place-items:center; font-size:20px; flex:none; }.platform { color:var(--lime); font:10px 'DM Mono',monospace; text-transform:uppercase; }.social-card h3 { margin:10px 0 4px; font-size:23px; font-weight:500; }.social-card p { margin:0; color:var(--muted); font:11px 'DM Mono',monospace; }.arrow { position:absolute; right:24px; top:24px; color:var(--lime); font-size:21px; }
.contact { padding:112px 0 80px; }.contact-box { position:relative; overflow:hidden; background:var(--lime); color:var(--bg); padding:60px clamp(30px, 7vw, 86px); }.contact .eyebrow { color:var(--bg); opacity:.7; }.contact h2 span { color:#557018; }.button-light { color:var(--lime); background:var(--bg); margin-top:38px; }.contact-deco { position:absolute; right:7%; top:20%; font-size:150px; line-height:1; opacity:.15; transform:rotate(15deg); }.footer { border-top:1px solid var(--line); padding:24px 0 40px; display:flex; justify-content:space-between; color:var(--muted); font:10px 'DM Mono',monospace; }.footer b { color:var(--lime); }.footer a { font-size:10px; }
@media (max-width:700px) { .container { width:calc(100% - 36px); }.topbar { width:100%; height:70px; padding:0 18px; }.topbar nav { display:none; }.top-link { font-size:10px; }.top-actions { gap:12px; }.hero { display:flex; flex-direction:column; align-items:flex-start; padding:70px 0 80px; gap:60px; }.hero h1 { font-size:clamp(3.3rem, 15vw, 5rem); }.hero-orbit { align-self:center; width:min(310px, 82vw); }.about,.links-section { padding-top:80px; }.about-grid { grid-template-columns:1fr; gap:34px; padding-top:38px; }.social-list { grid-template-columns:1fr; }.github,.kickstatz { grid-column:auto; }.social-card { min-height:135px; }.contact { padding:80px 0 55px; }.contact-box { padding:40px 28px; }.contact-deco { font-size:90px; top:40%; }.footer { gap:15px; flex-wrap:wrap; }.footer span:nth-child(2) { order:3; width:100%; } }
@media (hover:hover) and (pointer:fine) { body,.button,a,button { cursor:none; }.cursor-dot,.cursor-ring { opacity:1; } }