:root{
  --bg:#080a14;
  --bg-2:#0d1020;
  --surface:#111526;
  --surface-2:#171d34;
  --text:#f4f3ee;
  --muted:#a6abc0;
  --muted-2:#686e88;
  --accent:#b8ff5a;
  --accent-2:#91a7ff;
  --line:rgba(244,243,238,.14);
  --line-soft:rgba(244,243,238,.08);
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in-out:cubic-bezier(.77,0,.175,1);
  --hamouda-deep:#102018;
  --taboun-deep:#241b14;
  --default-deep:#10172e;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{background:radial-gradient(ellipse 900px 620px at 12% -12%,#222e96 0%,transparent 63%),radial-gradient(ellipse 800px 620px at 92% 8%,#392078 0%,transparent 58%),var(--bg);color:var(--text);font-family:'Inter',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;cursor:none}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,black,transparent 85%);opacity:.26}
.noise{position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.035;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='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E")}
.display{font-family:'Space Grotesk',sans-serif}
::selection{background:var(--accent);color:#080a14}
a{color:inherit;cursor:none}
button{font:inherit}
.cursor-dot{position:fixed;top:0;left:0;width:14px;height:14px;border:1px solid var(--accent);border-radius:50%;pointer-events:none;z-index:999;transform:translate(-50%,-50%);transition:width .25s var(--ease-out),height .25s var(--ease-out),background .25s var(--ease-out),border-color .25s var(--ease-out),opacity .2s;opacity:0}
.cursor-dot.active{opacity:1}
.cursor-dot.grow{width:46px;height:46px;background:rgba(184,255,90,.14);border-color:rgba(184,255,90,.4)}

/* Navigation */
.topbar{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:25px 6vw;transition:background .35s var(--ease-out),backdrop-filter .35s var(--ease-out),padding .35s var(--ease-out)}
.topbar.scrolled{padding-top:16px;padding-bottom:16px;background:rgba(8,10,20,.78);backdrop-filter:blur(18px);border-bottom:1px solid var(--line-soft)}
.logo{text-decoration:none;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px;letter-spacing:.2px;white-space:nowrap}
.logo span{color:var(--accent)}.logo i{font-family:'DM Mono',monospace;font-size:8px;color:var(--muted-2);font-style:normal;margin-left:2px;vertical-align:top}
.top-nav{display:flex;align-items:center;gap:30px}.top-nav a{text-decoration:none;color:var(--text);font-size:13px;position:relative;opacity:.85;transition:opacity .2s,color .2s}.top-nav a:not(.cv-btn)::after{content:'';position:absolute;left:0;bottom:-7px;width:0;height:1px;background:var(--accent);transition:width .25s var(--ease-out)}.top-nav a:not(.cv-btn):hover{opacity:1;color:var(--accent)}.top-nav a:not(.cv-btn):hover::after{width:100%}
.cv-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:10px 16px;border-radius:999px;transition:background .25s,border-color .25s,transform .16s var(--ease-out)}.cv-btn b{color:var(--accent);font-size:15px;font-weight:400}.cv-btn:hover{border-color:var(--accent);background:rgba(184,255,90,.08);transform:translateY(-2px)}
.menu-toggle{display:none;background:transparent;border:0;color:var(--text);font-size:12px;letter-spacing:1px;text-transform:uppercase;cursor:pointer}.menu-toggle span{display:inline-block;width:18px;height:1px;background:var(--accent);margin-left:8px;vertical-align:middle;position:relative}.menu-toggle span::after{content:'';position:absolute;top:5px;left:4px;width:14px;height:1px;background:var(--accent)}

/* Hero */
.hero{min-height:100vh;display:flex;align-items:center;position:relative;gap:clamp(44px,8vw,130px);padding:120px 6vw 80px;isolation:isolate}.hero-text{flex:1;z-index:2;max-width:690px}.eyebrow{display:flex;align-items:center;gap:10px;font-family:'DM Mono',monospace;font-size:10px;color:var(--accent);letter-spacing:1.6px;text-transform:uppercase;margin-bottom:28px}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(184,255,90,.11);display:inline-block;flex-shrink:0}
h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(48px,7.5vw,108px);line-height:.98;letter-spacing:-4px;margin-bottom:32px}.line{display:block;overflow:hidden}.line>span{display:block;opacity:0;transform:translateY(110%);animation:riseIn .9s var(--ease-out) forwards}.line:nth-child(1)>span{animation-delay:.25s}.line:nth-child(2)>span{animation-delay:.42s}.accent-word{font-style:normal;background:linear-gradient(110deg,var(--accent),#e7ffb6 48%,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{font-size:16px;line-height:1.85;color:var(--muted);max-width:530px;margin-bottom:34px;font-weight:300;opacity:0;animation:riseIn .8s var(--ease-out) forwards .72s}.hero-cta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;opacity:0;animation:riseIn .8s var(--ease-out) forwards .86s}.btn{font-size:13px;font-weight:500;padding:14px 21px;border-radius:999px;border:1px solid var(--line);color:var(--text);background:rgba(255,255,255,.015);text-decoration:none;display:inline-flex;align-items:center;gap:14px;transition:transform .16s var(--ease-out),background .25s,border-color .25s,color .25s}.btn span{font-size:16px;color:var(--accent);transition:transform .25s var(--ease-out)}.btn:hover{border-color:var(--accent);transform:translateY(-3px)}.btn:hover span{transform:translate(3px,3px)}.btn:active,.clink:active,.cv-btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);color:#080a14;border-color:var(--accent);font-weight:600}.btn.primary span{color:#080a14}.btn.primary:hover{background:#d4ff91;box-shadow:0 12px 38px rgba(184,255,90,.22)}
.hero-meta{display:flex;gap:28px;flex-wrap:wrap;margin-top:54px;padding-top:18px;border-top:1px solid var(--line-soft);font-family:'DM Mono',monospace;font-size:9px;line-height:1.6;color:var(--muted-2);letter-spacing:.4px;opacity:0;animation:riseIn .8s var(--ease-out) forwards 1s}.hero-meta span{display:flex;flex-direction:column;gap:3px}.hero-meta b{color:var(--text);font-weight:400;text-transform:uppercase;letter-spacing:1.3px}
.hero-portrait-wrap{flex:0 0 min(36vw,490px);position:relative;height:min(70vh,670px);min-height:470px;opacity:0;animation:fadeScale 1.1s var(--ease-out) forwards .25s}.hero-portrait{height:100%;width:100%;position:relative;overflow:hidden;border-radius:180px 180px 18px 18px;border:1px solid var(--line);background:var(--surface);box-shadow:0 35px 90px rgba(0,0,0,.28)}.hero-portrait::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(150deg,rgba(80,105,255,.25),transparent 40%,rgba(184,255,90,.08));mix-blend-mode:screen;pointer-events:none}.hero-portrait::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,10,20,.66),transparent 38%);z-index:1}.hero-portrait img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(30%) contrast(1.06) brightness(.91);transition:transform 1s var(--ease-out),filter .7s var(--ease-out)}.hero-portrait:hover img{transform:scale(1.045);filter:grayscale(0%) contrast(1.08) brightness(1)}.portrait-index{position:absolute;top:-24px;right:0;font-family:'DM Mono',monospace;font-size:10px;color:var(--muted-2);letter-spacing:1px}.portrait-index span{color:var(--accent);margin:0 4px}.portrait-tag{position:absolute;bottom:20px;left:20px;z-index:2;padding:8px 12px;border:1px solid rgba(244,243,238,.27);border-radius:999px;backdrop-filter:blur(8px);background:rgba(8,10,20,.26);font-family:'DM Mono',monospace;font-size:10px;color:var(--text)}.portrait-tag i{font-style:normal;color:var(--accent);margin-left:8px}.portrait-note{position:absolute;right:-62px;bottom:22px;font-family:'DM Mono',monospace;color:var(--muted-2);font-size:9px;line-height:1.65;text-transform:uppercase;letter-spacing:1.2px;transform:rotate(-90deg);transform-origin:bottom right}.portrait-note strong{font-weight:400;color:var(--accent)}.scroll-hint{position:absolute;bottom:34px;left:6vw;display:flex;align-items:center;gap:12px;font-family:'DM Mono',monospace;font-size:9px;color:var(--muted-2);text-transform:uppercase;letter-spacing:1px;opacity:0;animation:riseIn .8s var(--ease-out) forwards 1.15s}.scroll-hint .stick{width:1px;height:35px;background:var(--muted-2);position:relative;overflow:hidden}.scroll-hint .stick::after{content:'';position:absolute;top:-100%;left:0;right:0;height:100%;background:var(--accent);animation:stickMove 1.8s ease-in-out infinite}
.hero-glow{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none;z-index:-1}.hero-glow-one{width:320px;height:320px;left:29%;top:20%;background:radial-gradient(circle,rgba(79,101,255,.17),transparent 68%);animation:float 8s ease-in-out infinite}.hero-glow-two{width:180px;height:180px;right:19%;bottom:8%;background:radial-gradient(circle,rgba(184,255,90,.12),transparent 68%);animation:float 6s ease-in-out infinite reverse}

/* Work */
.work{padding:150px 6vw 100px;position:relative}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:52px}.section-head .eyebrow{margin-bottom:16px}.section-head h2{font-size:clamp(42px,5.3vw,70px);line-height:.98;letter-spacing:-3px}.section-aside{max-width:330px}.section-aside p{color:var(--muted);font-size:13px;line-height:1.8;font-weight:300;margin-bottom:22px}.project-counter{font-family:'DM Mono',monospace;font-size:10px;color:var(--muted-2);letter-spacing:1px;text-transform:uppercase}.project-counter span{font-size:19px;color:var(--accent);margin-right:7px}
.stage{position:relative;min-height:430px;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--surface);transition:background .7s var(--ease-in-out),border-color .7s}.stage.tint-hamouda{background:var(--hamouda-deep);border-color:rgba(184,255,90,.18)}.stage.tint-taboun{background:var(--taboun-deep);border-color:rgba(255,186,105,.2)}.stage.tint-default{background:var(--default-deep)}.stage-grid{position:absolute;inset:0;pointer-events:none;opacity:.28;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black,transparent)}
.cards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);position:relative;z-index:1;transition:opacity .35s var(--ease-out),transform .6s var(--ease-out)}.stage.expanded .cards-grid{opacity:0;pointer-events:none;transform:scale(.985);position:absolute;inset:0}.proj-card{position:relative;height:570px;overflow:hidden;background:var(--surface);cursor:none}.proj-card .cover-img{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(.55) brightness(.52);transform:scale(1.005);transition:transform 1s var(--ease-out),filter .7s var(--ease-out)}.proj-card:hover .cover-img{transform:scale(1.07);filter:saturate(.92) brightness(.7)}.proj-card::after{content:'';position:absolute;inset:0;border:1px solid transparent;transition:border-color .4s;pointer-events:none}.proj-card:hover::after{border-color:rgba(184,255,90,.45)}.proj-card .overlay{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;padding:34px;background:linear-gradient(0deg,rgba(8,10,20,.9),rgba(8,10,20,.12) 63%,transparent)}.proj-card .p-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:auto}.proj-card .p-num{font-family:'DM Mono',monospace;font-size:11px;color:rgba(244,243,238,.55);letter-spacing:1px}.proj-card .p-cat{font-family:'DM Mono',monospace;font-size:9px;color:var(--accent);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:12px}.proj-card .p-name{font-weight:700;font-size:clamp(28px,3.4vw,49px);line-height:1;letter-spacing:-1.8px;margin-bottom:13px}.proj-card .p-desc{font-size:12.5px;color:rgba(244,243,238,.68);max-width:380px;line-height:1.7;margin-bottom:22px;font-weight:300}.proj-card .p-open{display:inline-flex;align-items:center;gap:9px;width:fit-content;font-family:'DM Mono',monospace;font-size:10px;color:var(--text);text-transform:uppercase;letter-spacing:1px}.proj-card .p-open::after{content:'↗';font-size:15px;color:var(--accent);transition:transform .3s var(--ease-out)}.proj-card:hover .p-open::after{transform:translate(4px,-4px)}
.empty-state{min-height:430px;display:grid;place-items:center;position:relative;z-index:1;color:var(--muted);font-family:'DM Mono',monospace;font-size:12px}
.expanded-view{display:none;padding:44px 44px 48px;position:relative;z-index:2}.stage.expanded .expanded-view{display:block;animation:expandIn .65s var(--ease-out) forwards}.exp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:25px;margin-bottom:38px}.exp-heading{display:flex;gap:18px;align-items:flex-start}.exp-number{font-family:'DM Mono',monospace;font-size:12px;color:var(--accent);padding-top:4px}.exp-cat{font-family:'DM Mono',monospace;font-size:9px;color:var(--accent);letter-spacing:1.4px;text-transform:uppercase;margin-bottom:13px}.exp-title{font-weight:700;font-size:clamp(30px,4.2vw,58px);line-height:.98;letter-spacing:-2px}.exp-desc{color:rgba(244,243,238,.62);font-size:13px;max-width:520px;line-height:1.8;margin-top:16px;font-weight:300}.close-btn{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;background:transparent;border:1px solid rgba(244,243,238,.25);color:var(--text);padding:11px 16px;border-radius:999px;font-size:11px;cursor:none;transition:background .25s,border-color .25s,transform .16s var(--ease-out)}.close-btn span{font-size:18px;line-height:0;color:var(--accent)}.close-btn:hover{border-color:var(--accent);background:rgba(184,255,90,.07);transform:translateY(-2px)}.filmstrip-label{display:flex;justify-content:space-between;gap:20px;padding-bottom:11px;border-bottom:1px solid var(--line-soft);font-family:'DM Mono',monospace;font-size:9px;color:var(--muted-2);letter-spacing:1px;text-transform:uppercase}.filmstrip-label span:last-child{color:var(--accent)}.filmstrip{display:flex;gap:15px;overflow-x:auto;padding:18px 0 16px;scroll-snap-type:x mandatory;scrollbar-color:rgba(184,255,90,.6) transparent;scrollbar-width:thin}.filmstrip::-webkit-scrollbar{height:5px}.filmstrip::-webkit-scrollbar-thumb{background:rgba(184,255,90,.6);border-radius:10px}.filmstrip img{height:450px;width:auto;max-width:82vw;object-fit:contain;border-radius:11px;flex-shrink:0;scroll-snap-align:start;box-shadow:0 22px 55px rgba(0,0,0,.45);opacity:0;transform:translateY(20px) rotate(var(--tilt));animation:filmIn .65s var(--ease-out) forwards;transition:transform .5s var(--ease-out),filter .4s}.filmstrip img:hover{filter:brightness(1.08);transform:translateY(-6px) rotate(0deg)}

/* About + contact */
.about{padding:105px 6vw 80px;border-top:1px solid var(--line-soft)}.about .eyebrow{margin-bottom:34px}.about-grid{display:grid;grid-template-columns:1.2fr .8fr 170px;gap:60px;align-items:end}.about h2{font-size:clamp(40px,5.2vw,72px);line-height:1;letter-spacing:-3px}.about-grid>p{color:var(--muted);font-size:14px;line-height:1.9;font-weight:300;max-width:380px}.about-stamp{width:145px;height:145px;border:1px solid rgba(184,255,90,.45);border-radius:50%;display:grid;place-items:center;position:relative;transform:rotate(-12deg);color:var(--accent);font-family:'DM Mono',monospace;font-size:9px;text-transform:uppercase;letter-spacing:1px}.about-stamp::before,.about-stamp::after{content:'';position:absolute;width:7px;height:7px;border-radius:50%;background:var(--accent)}.about-stamp::before{top:8px;left:50%;transform:translateX(-50%)}.about-stamp::after{bottom:8px;left:50%;transform:translateX(-50%)}.about-stamp span{position:absolute}.about-stamp span:nth-child(1){transform:translateY(-34px)}.about-stamp span:nth-child(2){transform:translate(35px,22px)}.about-stamp span:nth-child(3){transform:translate(-33px,22px)}
.contact{padding:80px 6vw 105px;position:relative}.contact-inner{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,rgba(35,50,136,.3),rgba(17,21,38,.9) 58%);padding:75px 6vw;text-align:center;isolation:isolate}.contact-inner::before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(184,255,90,.06),transparent 68%);transform:translateX(-100%);animation:sweep 7s ease-in-out infinite;z-index:-1}.contact-orb{position:absolute;width:400px;height:400px;right:-190px;bottom:-220px;border-radius:50%;background:radial-gradient(circle,rgba(184,255,90,.2),transparent 67%);pointer-events:none}.contact .eyebrow{justify-content:center;margin-bottom:22px}.contact h2{font-size:clamp(40px,6vw,82px);line-height:1;letter-spacing:-3px;margin-bottom:24px}.contact p.lead{max-width:480px;margin:0 auto 38px;color:var(--muted);font-size:14px;line-height:1.85;font-weight:300}.contact-links{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:48px}.clink{display:flex;align-items:center;gap:9px;padding:12px 17px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.025);text-decoration:none;font-size:12px;transition:background .25s,border-color .25s,transform .16s var(--ease-out)}.clink:hover{border-color:var(--accent);background:rgba(184,255,90,.08);transform:translateY(-3px)}.clink.primary{background:var(--accent);border-color:var(--accent);color:#080a14;font-weight:600}.clink.primary:hover{background:#d4ff91}.link-icon{color:var(--accent);font-size:15px}.clink.primary .link-icon{color:#080a14}.contact-meta{display:flex;justify-content:center;gap:46px;flex-wrap:wrap;padding-top:30px;border-top:1px solid var(--line-soft)}.cmeta-item{text-align:center}.cmeta-item .label{font-family:'DM Mono',monospace;font-size:9px;color:var(--muted-2);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px}.cmeta-item .value{font-size:13px;color:var(--text)}
footer{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:35px 6vw 45px;color:var(--muted-2);font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.6px;text-transform:uppercase}footer a{text-decoration:none;color:var(--accent);transition:opacity .2s}footer a:hover{opacity:.7}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}.reveal.in-view{opacity:1;transform:translateY(0)}
@keyframes riseIn{to{opacity:1;transform:translateY(0)}}@keyframes fadeScale{from{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes expandIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes filmIn{to{opacity:1;transform:translateY(0) rotate(var(--tilt))}}@keyframes stickMove{0%{top:-100%}60%{top:100%}100%{top:100%}}@keyframes float{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(16px,-20px,0)}}@keyframes sweep{0%,30%{transform:translateX(-100%)}65%,100%{transform:translateX(100%)}}

/* Services */
.services{padding:125px 6vw 105px;border-top:1px solid var(--line-soft)}.services-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:50px}.services-head h2{font-size:clamp(42px,5.3vw,70px);line-height:.98;letter-spacing:-3px}.services-head>p{max-width:345px;color:var(--muted);font-size:13px;line-height:1.85;font-weight:300;margin-bottom:3px}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--line)}.service-card{min-height:265px;padding:28px 30px 28px;position:relative;background:rgba(8,10,20,.72);display:flex;flex-direction:column;transition:background .35s var(--ease-out),transform .35s var(--ease-out)}.service-card:hover{background:rgba(30,39,78,.7);transform:translateY(-3px);z-index:1}.service-card:nth-child(-n+3){border-bottom:1px solid var(--line)}.service-card:not(:nth-child(3n)){border-right:1px solid var(--line)}.service-no{font-family:'DM Mono',monospace;color:var(--muted-2);font-size:10px;letter-spacing:1px}.service-arrow{position:absolute;right:28px;top:24px;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--accent);font-size:15px;transition:background .25s,border-color .25s,transform .35s var(--ease-out)}.service-card:hover .service-arrow{background:var(--accent);border-color:var(--accent);color:var(--bg);transform:translate(3px,-3px)}.service-card h3{font-family:'Space Grotesk',sans-serif;font-size:19px;letter-spacing:-.5px;margin-top:auto;margin-bottom:11px}.service-card p{color:var(--muted);font-size:12.5px;line-height:1.75;max-width:265px}.service-line{width:0;height:2px;background:var(--accent);margin-top:23px;transition:width .45s var(--ease-out)}.service-card:hover .service-line{width:42px}
/* Moving capabilities ribbon */
.skill-marquee{margin:28px -2vw 110px;overflow:hidden;border-top:1px solid rgba(8,10,20,.25);border-bottom:1px solid rgba(8,10,20,.25);background:var(--accent);color:var(--bg);transform:rotate(-1.25deg) scale(1.035);box-shadow:0 16px 50px rgba(184,255,90,.08)}.marquee-track{display:flex;align-items:center;gap:25px;width:max-content;padding:17px 0;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:1.7px;white-space:nowrap;animation:marquee 28s linear infinite}.marquee-track i{font-style:normal;font-size:16px}.skill-marquee:hover .marquee-track{animation-play-state:paused}
/* Toolkit */
.toolkit{padding:10px 6vw 120px}.toolkit-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:48px}.toolkit-head h2{font-size:clamp(42px,5.3vw,70px);line-height:.98;letter-spacing:-3px}.toolkit-head>p{max-width:350px;color:var(--muted);font-size:13px;line-height:1.85;font-weight:300;margin-bottom:2px}.toolkit-board{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:35px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.skill-column-title{display:flex;justify-content:space-between;color:var(--muted-2);font-family:'DM Mono',monospace;font-size:10px;letter-spacing:1.1px;text-transform:uppercase;margin-bottom:27px}.skill-column-title span{color:var(--accent)}.skill-row{margin-bottom:22px}.skill-label{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:10px;font-size:13px}.skill-label small{font-family:'DM Mono',monospace;font-size:9px;color:var(--muted-2);text-transform:uppercase;letter-spacing:1px}.skill-track{height:3px;background:rgba(244,243,238,.12);overflow:hidden}.skill-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--accent-2),var(--accent));transition:width 1.1s var(--ease-out)}.toolkit.in-view .skill-track span{width:var(--skill)}.toolkit-foot{display:flex;justify-content:space-between;gap:20px;padding-top:16px;font-family:'DM Mono',monospace;font-size:9px;color:var(--muted-2);letter-spacing:.5px}.toolkit-foot span:last-child{color:var(--accent)}
@keyframes marquee{to{transform:translateX(-50%)}}

@media (max-width:900px){.hero{gap:48px}.services-head,.toolkit-head{align-items:start}.services-grid{grid-template-columns:repeat(2,1fr)}.service-card:nth-child(-n+3){border-bottom:0}.service-card:nth-child(-n+4){border-bottom:1px solid var(--line)}.service-card:not(:nth-child(3n)){border-right:0}.service-card:nth-child(odd){border-right:1px solid var(--line)}.toolkit-board{gap:38px}.hero-portrait-wrap{flex-basis:min(39vw,390px);min-height:440px;height:62vh}.portrait-note{display:none}.about-grid{grid-template-columns:1fr 1fr}.about-stamp{grid-column:2;grid-row:1 / span 2;justify-self:end}}
@media (max-width:680px){body{cursor:auto}.services{padding:88px 5vw 75px}.services-head,.toolkit-head{display:block;margin-bottom:32px}.services-head h2,.toolkit-head h2{font-size:clamp(43px,13vw,64px);letter-spacing:-2.3px}.services-head>p,.toolkit-head>p{margin-top:24px;font-size:13px}.services-grid{grid-template-columns:1fr;border-radius:17px}.service-card{min-height:220px;padding:24px}.service-card:not(:nth-child(3n)),.service-card:nth-child(odd){border-right:0}.service-card:not(:last-child){border-bottom:1px solid var(--line)}.service-card h3{font-size:18px}.skill-marquee{margin:10px -3vw 80px}.marquee-track{font-size:9px;gap:17px;padding:14px 0}.toolkit{padding:0 5vw 85px}.toolkit-board{display:block;padding:27px 0}.skill-column+ .skill-column{padding-top:36px;margin-top:34px;border-top:1px solid var(--line)}.skill-label{font-size:12px}.toolkit-foot{display:block;line-height:1.7}.toolkit-foot span{display:block}.toolkit-foot span:last-child{margin-top:9px}a,.proj-card,.btn,.close-btn{cursor:pointer}.topbar{padding:20px 5vw}.topbar.scrolled{padding-top:14px;padding-bottom:14px}.menu-toggle{display:block;z-index:2}.top-nav{position:absolute;top:100%;left:0;right:0;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:8px 5vw 18px;background:rgba(8,10,20,.96);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);transform:translateY(-12px);opacity:0;pointer-events:none;transition:opacity .25s var(--ease-out),transform .25s var(--ease-out)}.top-nav.open{opacity:1;transform:translateY(0);pointer-events:auto}.top-nav a{padding:13px 0;border-bottom:1px solid var(--line-soft)}.top-nav .cv-btn{justify-content:center;margin-top:12px}.hero{display:block;padding:120px 5vw 65px;min-height:0}.hero-portrait-wrap{height:68vh;min-height:420px;width:100%;margin-bottom:56px}.hero-text{max-width:none}.hero h1{font-size:clamp(48px,15vw,80px);letter-spacing:-2.8px}.hero-sub{font-size:14px;line-height:1.8}.hero-meta{margin-top:40px;gap:15px 28px}.scroll-hint{display:none}.hero-glow-one{left:-20%;top:8%}.work{padding:95px 5vw 65px}.section-head{display:block;margin-bottom:34px}.section-head h2{font-size:clamp(43px,13vw,64px);letter-spacing:-2.3px}.section-aside{margin-top:25px;max-width:none}.section-aside p{font-size:13px}.stage{border-radius:17px;min-height:0}.cards-grid{grid-template-columns:1fr}.proj-card{height:440px}.proj-card .overlay{padding:25px}.proj-card .p-name{font-size:37px}.proj-card .p-desc{font-size:12px}.expanded-view{padding:28px 18px 30px}.exp-head{display:block;margin-bottom:28px}.exp-heading{gap:12px}.exp-title{font-size:39px;letter-spacing:-1.5px}.exp-desc{font-size:12.5px}.close-btn{margin-top:22px}.filmstrip-label{font-size:8px}.filmstrip{gap:11px}.filmstrip img{height:310px;border-radius:8px}.about{padding:80px 5vw 55px}.about-grid{display:block}.about h2{font-size:clamp(43px,13vw,64px);letter-spacing:-2.3px;margin-bottom:28px}.about-grid>p{font-size:13px}.about-stamp{margin:36px 0 0 auto}.contact{padding:55px 5vw 70px}.contact-inner{padding:55px 20px 30px;border-radius:17px}.contact h2{font-size:clamp(40px,12.5vw,66px);letter-spacing:-2px}.contact p.lead{font-size:13px}.contact-links{gap:8px}.clink{font-size:11px;padding:11px 13px}.contact-meta{gap:24px}.cmeta-item .value{font-size:11px}footer{padding:28px 5vw 35px;display:grid;grid-template-columns:1fr 1fr;font-size:8px}footer span:nth-child(2){text-align:right}footer a{grid-column:1 / -1;margin-top:8px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}