*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#05060a;--bg2:#090b12;--surface:#0d1018;--surface2:#121620;
  --border:#1a1f2e;--border2:#242b3d;
  --text:#e8eaf2;--dim:#8a90a8;--faint:#39415c;--muted:#6b7290;
  --blue:#3d6fff;--blue-b:#5b86ff;--blue-dim:rgba(61,111,255,.1);--blue-glow:rgba(61,111,255,.22);
  --display:'Bebas Neue',sans-serif;--body:'DM Sans',sans-serif;--mono:'JetBrains Mono',monospace;
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--body);overflow-x:hidden;cursor:none;font-size:16px;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:inherit}

/* CURSOR */
#cur{position:fixed;width:6px;height:6px;background:var(--blue-b);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%)}
#cur-r{position:fixed;width:32px;height:32px;border:1px solid rgba(91,134,255,.28);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .3s,height .3s,border-color .3s}
#cur-r.big{width:56px;height:56px;border-color:var(--blue)}
#cur-r.play{width:70px;height:70px;border-color:#fff}
#cur-r.play::after{content:'PLAY';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:#fff}
body::before{content:'';position:fixed;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.025) 0,rgba(0,0,0,.025) 1px,transparent 1px,transparent 2px);pointer-events:none;z-index:9990}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:500;display:flex;align-items:center;justify-content:space-between;padding:22px 48px;transition:background .4s,padding .4s,border-color .4s;border-bottom:1px solid transparent}
nav.stuck{background:rgba(5,6,10,.96);backdrop-filter:blur(20px);padding:15px 48px;border-color:var(--border)}
.logo{font-family:var(--display);font-size:20px;letter-spacing:.06em;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:10px}
.logo-dot{width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 10px var(--blue-glow);flex-shrink:0}
.logo-sub{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--blue);padding:3px 7px;border:1px solid rgba(61,111,255,.28);border-radius:2px}
.nav-links{display:flex;gap:26px;list-style:none;align-items:center}
.nav-links a{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);text-decoration:none;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--text)}
.nav-links a.active{color:var(--blue)}
.nav-resume{display:inline-flex;align-items:center;gap:6px}
.nav-resume svg{fill:currentColor;width:8px}
.nav-hire{background:var(--blue)!important;color:#fff!important;padding:8px 18px;border-radius:3px;box-shadow:0 0 16px var(--blue-glow)}
.nav-hire:hover{box-shadow:0 0 28px rgba(61,111,255,.45)!important;color:#fff!important}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:none;padding:4px}
.burger span{display:block;width:22px;height:1.5px;background:var(--text);transition:.3s}

/* DRAWER */
.drawer{position:fixed;inset:0;z-index:490;background:var(--bg);display:flex;flex-direction:column;justify-content:center;padding:48px;transform:translateX(100%);transition:transform .5s cubic-bezier(.16,1,.3,1)}
.drawer.open{transform:translateX(0)}
.drawer ul{list-style:none}
.drawer ul a{font-family:var(--display);font-size:clamp(40px,9vw,72px);letter-spacing:.04em;color:var(--text);text-decoration:none;transition:color .2s;display:block;padding:8px 0;border-bottom:1px solid var(--border);line-height:1.1}
.drawer ul a:hover{color:var(--blue)}
.drawer ul a em{font-family:var(--mono);font-size:11.5px;color:var(--dim);letter-spacing:.12em;vertical-align:middle;margin-right:14px;font-style:normal}

/* PAGE HEADER (sub-pages) */
.page-head{padding:150px 48px 60px;border-bottom:1px solid var(--border);position:relative;overflow:hidden}
.page-head-blob{position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(61,111,255,.1) 0%,transparent 70%);top:-150px;right:-100px;pointer-events:none}
.page-eye{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);margin-bottom:16px;display:flex;align-items:center;gap:12px;position:relative;z-index:1}
.page-eye::before{content:'';width:22px;height:1px;background:var(--blue);box-shadow:0 0 5px var(--blue)}
.page-title{font-family:var(--display);font-size:clamp(48px,9vw,130px);letter-spacing:.03em;line-height:.9;position:relative;z-index:1;white-space:nowrap}
.page-title b{color:var(--blue);text-shadow:0 0 50px rgba(61,111,255,.35)}
.page-sub{font-size:15px;line-height:1.8;color:var(--dim);max-width:560px;margin-top:20px;font-weight:300;position:relative;z-index:1}

/* SHARED */
.wrap{padding:80px 48px}
.sh{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:48px;padding-bottom:18px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:12px}
.stag{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;gap:10px}
.stag-n{color:var(--blue)}.stag-line{width:14px;height:1px;background:var(--blue)}
.sh-title{font-family:var(--display);font-size:clamp(28px,4vw,44px);letter-spacing:.05em}
.sh-title b{color:var(--blue)}
.link-btn{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);text-decoration:none;border:1px solid var(--border2);padding:7px 14px;border-radius:2px;transition:border-color .2s,color .2s;white-space:nowrap;cursor:none;display:inline-flex;align-items:center;gap:6px}
.link-btn:hover{border-color:var(--blue);color:var(--blue)}
.link-btn::after{content:'↗'}

/* BUTTONS */
.btn-blue{display:inline-flex;align-items:center;gap:9px;background:var(--blue);color:#fff;padding:12px 22px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-radius:3px;cursor:none;white-space:nowrap;box-shadow:0 0 20px var(--blue-glow);transition:box-shadow .2s,transform .2s}
.btn-blue:hover{box-shadow:0 0 36px rgba(61,111,255,.5);transform:translateY(-1px)}
.btn-blue svg{fill:#fff;width:8px;flex-shrink:0}
.btn-ghost{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--border2);color:var(--text);padding:12px 22px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-radius:3px;cursor:none;white-space:nowrap;transition:border-color .2s,background .2s}
.btn-ghost:hover{border-color:var(--blue);background:var(--blue-dim)}
.btn-ghost svg{fill:currentColor;width:9px;flex-shrink:0}

/* MARQUEE */
.marquee{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:11px 0;overflow:hidden;background:var(--bg2)}
.mq-t{display:flex;animation:mqR 24s linear infinite;white-space:nowrap}
.mq-t:hover{animation-play-state:paused}
.mq-i{display:inline-flex;align-items:center;gap:13px;padding:0 22px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);flex-shrink:0}
.mq-d{width:3px;height:3px;border-radius:50%;background:var(--blue);flex-shrink:0;box-shadow:0 0 5px var(--blue)}
@keyframes mqR{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* FOOTER */
footer{padding:40px 48px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}
.f-left{display:flex;flex-direction:column;gap:6px}
.f-logo{font-family:var(--display);font-size:20px;letter-spacing:.06em}
.f-copy{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--faint)}
.f-nav{display:flex;gap:20px;flex-wrap:wrap}
.f-nav a{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-decoration:none;transition:color .2s}
.f-nav a:hover{color:var(--blue)}

/* REVEAL */
.r{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.r.in{opacity:1;transform:translateY(0)}
.r.d1{transition-delay:.07s}.r.d2{transition-delay:.14s}.r.d3{transition-delay:.21s}.r.d4{transition-delay:.28s}

/* ── LIGHTBOX (video) ── */
.lb{display:none;position:fixed;inset:0;z-index:3000;background:rgba(3,4,8,.97);align-items:center;justify-content:center;flex-direction:column}
.lb.open{display:flex}
.lb-wrap{position:relative;width:92vw;max-width:1120px}
.lb-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px}
.lb-title{font-family:var(--display);font-size:clamp(16px,2.5vw,26px);letter-spacing:.05em}
.lb-close{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);background:none;border:1px solid var(--border2);padding:7px 14px;cursor:none;border-radius:2px;transition:border-color .2s,color .2s}
.lb-close:hover{border-color:var(--blue);color:var(--text)}
.lb-screen{width:100%;aspect-ratio:16/9;background:#000;overflow:hidden;border:1px solid var(--border);margin:0 auto;transition:max-width .25s}
.lb-screen.doc{aspect-ratio:auto;height:82vh;max-width:1100px;background:#0d1018}
.lb-screen.portrait{aspect-ratio:9/16;max-width:min(420px,52vh)}
.lb-screen.square{aspect-ratio:1/1;max-width:min(620px,72vh)}
.lb-screen.p45{aspect-ratio:4/5;max-width:min(520px,64vh)}
.lb-screen iframe,.lb-screen video{width:100%;height:100%;border:none;display:block}
.lb-ph{width:100%;height:100%;background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:40px;text-align:center}
.lb-ph-ring{width:60px;height:60px;border-radius:50%;border:1px solid rgba(61,111,255,.4);display:flex;align-items:center;justify-content:center}
.lb-ph-ring svg{fill:var(--blue);width:18px;margin-left:3px}
.lb-ph-name{font-family:var(--display);font-size:clamp(18px,3vw,32px);letter-spacing:.05em}
.lb-ph-hint{font-family:var(--mono);font-size:11px;color:var(--dim);line-height:1.7}
.lb-ph-hint code{color:var(--blue-b)}
.lb-bot{padding-top:12px;display:flex;justify-content:space-between;align-items:center}
.lb-meta{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--dim)}
.lb-link{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);text-decoration:none}
.lb-esc{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}

/* MOBILE shared */
@media(max-width:960px){
  nav{padding:17px 22px}nav.stuck{padding:13px 22px}
  .nav-links{display:none}.burger{display:flex}
  .wrap{padding:56px 22px}
  .page-head{padding:120px 22px 48px}
  footer{padding:32px 22px}
  body{cursor:auto}#cur,#cur-r{display:none}
}

/* ── MINIMAL MOTION POLISH ── */
/* button sheen sweep on hover */
.btn-blue,.btn-ghost,.link-btn{position:relative;overflow:hidden}
.btn-blue::after,.btn-ghost::after{content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.16),transparent);transform:skewX(-20deg);transition:left .55s cubic-bezier(.16,1,.3,1)}
.btn-blue:hover::after,.btn-ghost:hover::after{left:130%}
.btn-blue:hover{transform:translateY(-2px);box-shadow:0 6px 28px var(--blue-glow)}
.btn-ghost:hover{border-color:var(--blue);background:rgba(61,111,255,.06);transform:translateY(-2px)}
.link-btn:hover{border-color:var(--blue);color:var(--blue-b)}

/* nav link underline slide */
.nav-links a{position:relative}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-4px;width:0;height:1px;background:var(--blue);transition:width .3s cubic-bezier(.16,1,.3,1)}
.nav-links a:hover::after{width:100%}

/* gentle float for accents */
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* card lift is per-page; universal image zoom smoothing */
img{backface-visibility:hidden}

/* section fade-up refinement (works with existing .r reveal) */
.r{will-change:transform,opacity}

/* subtle pulse on the hero scroll line already exists; add soft glow drift to page titles */
.page-title b{transition:text-shadow .4s}
.page-title:hover b{text-shadow:0 0 34px rgba(61,111,255,.45)}

/* ── FINAL POLISH ── */
/* scroll progress bar */
.scroll-progress{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,var(--blue),var(--blue-b));z-index:300;box-shadow:0 0 12px var(--blue-glow);transition:width .08s linear}

/* staggered hero line reveal */
.hero-t .t1,.hero-t .t2,.hero-t .t3{display:block;opacity:0;transform:translateY(40px);animation:lineUp .9s cubic-bezier(.16,1,.3,1) forwards}
.hero-t .t1{animation-delay:.15s}
.hero-t .t2{animation-delay:.32s}
.hero-t .t3{animation-delay:.49s}
@keyframes lineUp{to{opacity:1;transform:translateY(0)}}

/* gallery image fade-in on load */
.gc-bg{opacity:0;transition:opacity .6s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.gc-bg.loaded{opacity:1}

/* stat count-up base */
.ast-n{font-variant-numeric:tabular-nums}

/* breathing glow on accent words in big CTAs */
.cta-h b,.contact-h b{animation:glowPulse 3.5s ease-in-out infinite}
@keyframes glowPulse{0%,100%{text-shadow:0 0 40px rgba(61,111,255,.35)}50%{text-shadow:0 0 70px rgba(61,111,255,.65)}}

/* scrollable long-image deck viewer */
.deck-scroll{width:100%;height:100%;overflow-y:auto;overscroll-behavior:contain;background:#0d1018;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}
.deck-scroll::-webkit-scrollbar{width:6px}
.deck-scroll::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}