:root{--bg: #08080a;--bg-soft: #0d0d10;--bg-elev: #121216;--line: rgba(255, 255, 255, .1);--line-strong: rgba(255, 255, 255, .2);--fg: #f2f2f0;--fg-2: rgba(242, 242, 240, .6);--fg-3: rgba(242, 242, 240, .36);--accent: #5eead4;--accent-soft: rgba(94, 234, 212, .12);--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-mono: ui-monospace, "SF Mono", Consolas, "Liberation Mono", monospace;--max: 1180px;--pad-x: clamp(20px, 4vw, 48px);--sec-y: clamp(88px, 11vw, 168px);--gap: clamp(16px, 2vw, 28px);--r-pill: 999px;--r-lg: 20px;--r-md: 14px;--r-sm: 10px;--ease: cubic-bezier(.16, 1, .3, 1);--dur: .6s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}::selection{background:var(--accent);color:#04211d}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}img,svg{display:block;max-width:100%}:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:#ffffff24;border-radius:999px;border:3px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:#ffffff3d}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.013) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.013) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(ellipse 90% 55% at 50% 0%,black 15%,transparent 75%);mask-image:radial-gradient(ellipse 90% 55% at 50% 0%,black 15%,transparent 75%);pointer-events:none;z-index:0}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='0.55'/></svg>");background-size:180px 180px;opacity:.045;pointer-events:none;z-index:0}main{position:relative;z-index:1}.light-ribbons{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.glow-border{position:relative;isolation:isolate}.gb-layer{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none;overflow:hidden}.gb-layer.gb-ring{top:-1px;right:-1px;bottom:-1px;left:-1px;padding:1.5px;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}.gb-layer.gb-halo{top:-8px;right:-8px;bottom:-8px;left:-8px;filter:blur(10px);opacity:.55}.gb-spin{position:absolute;top:50%;left:50%;width:300%;aspect-ratio:1;background:conic-gradient(from 0deg,rgba(255,255,255,.95) 0deg,transparent 60deg,transparent 310deg,rgba(255,255,255,.95) 360deg);animation:gbTurn 2.5s linear infinite;will-change:transform}.gb-accent .gb-spin{background:conic-gradient(from 0deg,var(--accent) 0deg,transparent 60deg,transparent 310deg,var(--accent) 360deg)}@keyframes gbTurn{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@media (prefers-reduced-motion: reduce){.gb-spin{animation:none}}.cursor-trail{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999}.cursor-dot{position:fixed;left:0;top:0;width:12px;height:12px;border-radius:50%;background:#fffffff2;box-shadow:0 0 12px #ffffff59;mix-blend-mode:difference;pointer-events:none;z-index:9999;transition:width .25s var(--ease),height .25s var(--ease),opacity .25s,background .25s;will-change:transform}.cursor-dot.is-hover{width:40px;height:40px;background:#ffffff24;box-shadow:0 0 0 1.5px #ffffffe6}body.has-cursor-fx,body.has-cursor-fx a,body.has-cursor-fx button,body.has-cursor-fx [role=button],body.has-cursor-fx input,body.has-cursor-fx textarea,body.has-cursor-fx select,body.has-cursor-fx summary,body.has-cursor-fx label{cursor:none}@media (pointer: coarse){.cursor-dot{display:none}}.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad-x)}.section{padding:var(--sec-y) 0;position:relative;scroll-margin-top:84px}.section+.section{border-top:1px solid var(--line)}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2);padding:7px 14px;border:1px solid var(--line);border-radius:var(--r-pill);background:#ffffff05}.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:clamp(36px,5vw,64px);flex-wrap:wrap}.section-index{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;color:var(--fg-3);margin-bottom:14px}.section-title{font-size:clamp(30px,4vw,52px);line-height:1.15;letter-spacing:-.03em;font-weight:500}.section-desc{max-width:460px;font-size:clamp(14px,1.3vw,16px);line-height:1.85;color:var(--fg-2)}.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:var(--r-pill);font-size:14px;font-weight:500;letter-spacing:.01em;border:1px solid transparent;transition:transform .25s var(--ease),background .25s,border-color .25s,color .25s,box-shadow .25s;white-space:nowrap}.btn-primary{background:var(--fg);color:#08080a}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px #ffffff24}.btn-ghost{border-color:var(--line-strong);color:var(--fg);background:#ffffff05}.btn-ghost:hover{border-color:var(--fg-2);background:#ffffff0d;transform:translateY(-2px)}.btn .arrow{transition:transform .3s var(--ease)}.btn:active{transform:translateY(0) scale(.97)}.btn:hover .arrow{transform:translate(3px)}.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--delay, 0ms)}.reveal.is-in{opacity:1;transform:none}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.nav{position:fixed;inset:0 0 auto 0;z-index:50;padding:18px 0;transition:background .4s var(--ease),border-color .4s,padding .4s var(--ease),backdrop-filter .4s;border-bottom:1px solid transparent}.nav.is-scrolled{padding:12px 0;background:#08080ab8;backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border-bottom-color:var(--line)}.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(150deg,#1b1b20,#0c0c0f);border:1px solid var(--line-strong);font-size:14px;font-weight:600;letter-spacing:.02em;flex-shrink:0;transition:transform .5s var(--ease),border-color .3s}.brand:hover .brand-mark{transform:rotate(-10deg);border-color:#5eead466}.brand-text{display:flex;flex-direction:column;line-height:1.25;min-width:0}.brand-name{font-size:14px;font-weight:500;letter-spacing:.01em;white-space:nowrap}.brand-role{font-size:11px;color:var(--fg-3);letter-spacing:.06em;white-space:nowrap}.nav-links{display:flex;align-items:center;gap:4px;padding:5px;border:1px solid var(--line);border-radius:var(--r-pill);background:#ffffff08}.nav-links a{padding:8px 18px;border-radius:var(--r-pill);font-size:13px;color:var(--fg-2);overflow:hidden;white-space:nowrap}.nl{display:flex;flex-direction:column;height:1.5em;overflow:hidden;transition:transform .4s var(--ease)}.nl>span{display:block;height:1.5em;line-height:1.5em}.nl>.alt{color:var(--accent)}.nav-links a:hover .nl,.nav-links a:focus-visible .nl{transform:translateY(-1.5em)}.nav-links a:hover{color:var(--fg)}.nav-cta{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:var(--r-pill);font-size:13px;border:1px solid var(--line-strong);transition:border-color .25s,background .25s,transform .25s var(--ease);white-space:nowrap}.nav-cta .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}.nav-cta:hover{border-color:var(--fg-2);background:#ffffff0d;transform:translateY(-1px)}.menu-btn{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-strong);place-items:center}.menu-btn span{display:block;width:16px;height:1px;background:var(--fg);position:relative}.menu-btn span:before,.menu-btn span:after{content:"";position:absolute;left:0;width:16px;height:1px;background:var(--fg);transition:transform .3s var(--ease)}.menu-btn span:before{top:-5px}.menu-btn span:after{top:5px}.menu-btn.is-open span{background:transparent}.menu-btn.is-open span:before{transform:translateY(5px) rotate(45deg)}.menu-btn.is-open span:after{transform:translateY(-5px) rotate(-45deg)}.mobile-menu{position:fixed;top:0;right:0;bottom:0;left:0;z-index:45;background:#08080af7;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:100px var(--pad-x) 40px;display:flex;flex-direction:column;gap:8px;opacity:0;pointer-events:none;transition:opacity .3s var(--ease)}.mobile-menu.is-open{opacity:1;pointer-events:auto}.mobile-menu a{font-size:28px;font-weight:500;letter-spacing:-.02em;padding:16px 0;border-bottom:1px solid var(--line);color:var(--fg-2);transition:color .2s,padding-left .3s var(--ease)}.mobile-menu a:hover{color:var(--fg);padding-left:8px}.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:140px 0 60px;overflow:hidden}.hero-glow{position:absolute;top:38%;left:50%;width:min(900px,110vw);height:min(900px,110vw);transform:translate(-50%,-50%);background:radial-gradient(circle at center,rgba(94,234,212,.26) 0%,rgba(94,234,212,.1) 32%,transparent 62%);filter:blur(30px);pointer-events:none;z-index:0}.hero-ambience{position:absolute;top:44%;left:57%;width:min(1250px,135vw);height:min(1250px,135vw);transform:translate(-50%,-50%);background:radial-gradient(circle at center,rgba(94,234,212,.13) 0%,rgba(94,234,212,.05) 38%,transparent 66%);filter:blur(44px);pointer-events:none;z-index:0}.hero-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:26px}.hero-title{font-size:clamp(38px,6.6vw,88px);line-height:1.1;letter-spacing:-.045em;font-weight:500;max-width:13em}.hero-title em{font-style:normal;color:var(--accent)}.hero-sub{max-width:620px;font-size:clamp(15px,1.6vw,18px);line-height:1.8;color:var(--fg-2)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:6px}.hero-stats{display:flex;gap:clamp(28px,4vw,52px);flex-wrap:wrap;justify-content:center;margin-top:26px}.stat{display:flex;flex-direction:column;align-items:center;gap:2px}.stat b{font-family:var(--font-mono);font-size:clamp(19px,2vw,24px);font-weight:500;letter-spacing:-.01em;color:var(--fg)}.stat span{font-size:11.5px;color:var(--fg-3);letter-spacing:.04em}.scroll-cue{position:absolute;left:50%;bottom:28px;transform:translate(-50%);display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3);z-index:1}.scroll-cue i{display:block;width:1px;height:34px;background:linear-gradient(to bottom,var(--fg-3),transparent);animation:cueDrop 2.4s var(--ease) infinite}@keyframes cueDrop{0%,to{transform:scaleY(.35);opacity:.4;transform-origin:top}50%{transform:scaleY(1);opacity:1;transform-origin:top}}.projects{display:flex;flex-direction:column;gap:clamp(20px,3vw,36px)}.project{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(20px,2.6vw,32px);border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(160deg,#ffffff09,#ffffff02);text-align:left;width:100%;cursor:pointer;transition:border-color .35s,background .35s,transform .35s var(--ease)}.project:hover{border-color:var(--line-strong);background:linear-gradient(160deg,#ffffff0f,#ffffff04);transform:translateY(-3px)}.project:nth-child(2n) .project-visual{order:2}.project-visual{position:relative;aspect-ratio:16 / 10;border-radius:var(--r-md);overflow:hidden;background:radial-gradient(circle at 30% 20%,#17171c,#0b0b0e 70%);border:1px solid var(--line);display:grid;place-items:center;transition:transform .5s var(--ease)}.project:hover .project-visual{transform:scale(1.015)}.project-visual:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:radial-gradient(circle at 50% 50%,black 40%,transparent 85%);mask-image:radial-gradient(circle at 50% 50%,black 40%,transparent 85%);pointer-events:none}.project-visual svg{position:relative;width:100%;height:100%}.project-body{display:flex;flex-direction:column;gap:16px;padding:6px 4px}.project-kicker{display:flex;align-items:center;gap:12px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;color:var(--fg-3)}.project-kicker .sep{width:18px;height:1px;background:var(--line-strong)}.project-title{font-size:clamp(21px,2.4vw,30px);line-height:1.3;letter-spacing:-.02em;font-weight:500}.project-desc{font-size:14.5px;line-height:1.85;color:var(--fg-2)}.project-metrics{display:flex;gap:24px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.metric b{display:block;font-family:var(--font-mono);font-size:19px;font-weight:500;letter-spacing:-.01em}.metric span{font-size:11.5px;color:var(--fg-3)}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags i{font-style:normal;font-size:11.5px;padding:5px 11px;border-radius:var(--r-pill);border:1px solid var(--line);color:var(--fg-2);background:#ffffff05}.project-more{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--fg);margin-top:2px}.project-more .arrow{transition:transform .3s var(--ease)}.project:hover .project-more .arrow{transform:translate(5px)}.project-more:after{content:""}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#040406c7;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:flex-start;justify-content:center;padding:clamp(16px,5vh,64px) var(--pad-x);overflow-y:auto;animation:fadeIn .25s var(--ease)}@keyframes fadeIn{0%{opacity:0}}.modal{width:100%;max-width:820px;background:var(--bg-soft);border:1px solid var(--line-strong);border-radius:var(--r-lg);padding:clamp(24px,4vw,48px);position:relative;animation:modalIn .35s var(--ease)}@keyframes modalIn{0%{opacity:0;transform:translateY(18px) scale(.985)}}.modal-close{position:absolute;top:18px;right:18px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:18px;color:var(--fg-2);transition:border-color .2s,color .2s,background .2s}.modal-close:hover{border-color:var(--fg-2);color:var(--fg);background:#ffffff0d}.modal-kicker{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;color:var(--fg-3);margin-bottom:14px}.modal-title{font-size:clamp(24px,3.4vw,36px);line-height:1.25;letter-spacing:-.03em;font-weight:500;margin-bottom:10px;padding-right:48px}.modal-sub{font-size:13.5px;color:var(--fg-2);margin-bottom:26px}.modal-sections{display:flex;flex-direction:column;gap:24px}.modal-section h4{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);font-weight:500;margin-bottom:8px}.modal-section p{font-size:14.5px;line-height:1.9;color:var(--fg-2)}.modal-section ul{list-style:none;display:flex;flex-direction:column;gap:8px}.modal-section li{font-size:14.5px;line-height:1.8;color:var(--fg-2);padding-left:18px;position:relative}.modal-section li:before{content:"";position:absolute;left:0;top:.72em;width:6px;height:1px;background:var(--accent)}.stack-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}.stack-cell{background:var(--bg);transition:background .3s}.stack-cell:hover{background:var(--bg-soft)}.stack-item{padding:clamp(24px,3vw,38px);height:100%}.stack-num{font-family:var(--font-mono);font-size:11.5px;color:var(--fg-3);letter-spacing:.1em;margin-bottom:14px}.stack-title{font-size:19px;font-weight:500;letter-spacing:-.01em;margin-bottom:8px}.stack-desc{font-size:13.5px;line-height:1.8;color:var(--fg-2);margin-bottom:18px}.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(32px,6vw,80px);align-items:start}.about-copy p{font-size:clamp(15px,1.5vw,17px);line-height:1.95;color:var(--fg-2);margin-bottom:18px}.about-copy p strong{color:var(--fg);font-weight:500}.about-points{display:flex;flex-direction:column;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.about-point{background:var(--bg);padding:20px 0;display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:baseline}.about-point .n{font-family:var(--font-mono);font-size:11.5px;color:var(--fg-3)}.about-point h4{font-size:15px;font-weight:500;margin-bottom:4px}.about-point p{font-size:13px;line-height:1.7;color:var(--fg-2)}.contact{text-align:center;padding:clamp(80px,12vw,180px) 0}.contact-title{font-size:clamp(32px,5vw,64px);line-height:1.1;letter-spacing:-.04em;font-weight:500;margin:20px 0 18px}.contact-sub{font-size:clamp(14px,1.5vw,16px);color:var(--fg-2);margin-bottom:34px}.contact-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.contact-links{display:flex;gap:26px;justify-content:center;margin-top:40px;font-size:13px;color:var(--fg-3);flex-wrap:wrap}.contact-links a{transition:color .2s}.contact-links a:hover{color:var(--fg)}.footer{position:relative;z-index:1;border-top:1px solid var(--line);padding:28px 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--fg-3)}@media (min-width: 901px){.stack-cell:last-child{grid-column:span 2}}@media (max-width: 900px){.nav-links,.nav-cta{display:none}.menu-btn{display:grid}.project{grid-template-columns:1fr}.project:nth-child(2n) .project-visual{order:0}.stack-grid,.about-grid{grid-template-columns:1fr}}@media (max-width: 600px){.hero{padding-top:120px}.hero-stats{gap:18px}.project{padding:16px}.project-metrics{gap:18px}.footer{flex-direction:column;gap:8px}}
