@font-face{font-family:domain;src:url('./domain.ttf')}@font-face{font-family:canopee;src:url('./canopee.ttf')}
:root{--paper:#c5bdb4;--paper-light:#d8d0c7;--ink:#1c1c1a;--muted:#615d58;--accent:#b43b12;--line:rgba(28,28,26,.32)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:5rem}body{margin:0;background:var(--ink);color:var(--ink);font-family:domain,Georgia,serif}a{color:inherit}img{display:block;max-width:100%}button{font:inherit}#main{overflow:hidden;background:var(--paper)}.section-paper{background:var(--paper);padding:clamp(3.5rem,8vw,8rem) clamp(1.2rem,4.5vw,4.5rem)}
.hero{min-height:100svh;background:var(--paper);padding:0 clamp(1rem,2.5vw,2.5rem) 1.5rem;overflow:hidden}.hero #nav{height:5.5rem;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}.location,.eyebrow,.card-meta,.hero-bottom,.project-title span,.experience-date,.contact-footer,.sensor-label{font-family:'DM Mono',monospace;text-transform:uppercase;letter-spacing:.07em;font-size:.67rem}.location{width:30%;display:flex;align-items:center;gap:.6rem}.status-dot{width:7px;height:7px;border-radius:50%;background:#4b715c}.wordmark{font:2rem canopee,serif;text-decoration:none;text-align:center}.wordmark span{font: .65rem 'DM Mono',monospace;vertical-align:top}.menu-toggle{border:0;background:none;font-size:1.5rem;cursor:pointer;display:none}.nav-links{display:flex;gap:1.3rem;justify-content:flex-end;width:30%;font: .72rem 'DM Mono',monospace;text-transform:uppercase}.nav-links a{text-decoration:none;border-bottom:1px solid transparent;padding-bottom:4px}.nav-links a:hover{border-color:var(--ink)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,1.12fr) minmax(0,1fr);gap:clamp(1rem,3vw,3rem);align-items:center;padding:clamp(2rem,4vw,4rem) 1.5%;min-height:26rem}.feature-card{min-width:0}.image-frame{display:block;overflow:hidden;background:#b4aaa0;aspect-ratio:1.52}.image-frame img,.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1);filter:saturate(.78)}.image-frame:hover img,.project-image:hover img{transform:scale(1.045)}.card-heading,.project-title{display:flex;align-items:baseline;justify-content:space-between;gap:.7rem}.card-heading h2{font:1.5rem canopee,serif;margin:.75rem 0 .3rem}.pill{font: .58rem 'DM Mono',monospace;background:var(--accent);color:var(--paper);padding:.22rem .4rem;border-radius:2px}.feature-card p{font-size:1.03rem;line-height:1.3;color:var(--muted);margin:.35rem 0 .8rem}.card-meta{color:#6c655e;font-size:.58rem}.hero-center{text-align:center;padding:0 .5rem}.eyebrow{color:#716a63;margin:0 0 1rem}.hero-center h2{font:clamp(2.6rem,5vw,5.2rem)/.92 canopee,serif;letter-spacing:-.035em;margin:.5rem 0 1rem}.hero-center h2 em,.about h2 em,.experience h2 em,.contact h2 em{font-weight:400;color:var(--accent)}.hero-note{font-size:1.05rem;line-height:1.35;color:var(--muted);max-width:24rem;margin:0 auto 1.2rem}.text-link{font: .68rem 'DM Mono',monospace;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:.35rem}.text-link span{margin-left:.6rem}.hero-name{font:clamp(5.2rem,19.5vw,22rem)/.76 canopee,serif;letter-spacing:-.065em;white-space:nowrap;text-align:center;background:var(--ink);color:var(--paper);margin:0;padding:.08em .02em .13em;overflow:hidden}.hero-name span{font:clamp(.8rem,2vw,2rem) 'DM Mono',monospace;letter-spacing:0;vertical-align:top}.hero-bottom{display:flex;justify-content:space-between;gap:1rem;padding:1rem .3rem 0;color:#635e58;font-size:.58rem}
.about{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,7rem);border-top:1px solid var(--line)}.about h2,.experience h2,.contact h2{font:clamp(4rem,8vw,9rem)/.82 canopee,serif;letter-spacing:-.045em;margin:0 0 1.8rem}.portrait-frame{height:clamp(18rem,34vw,34rem);background:#f6f4f1;overflow:hidden;border:1px solid rgba(0,0,0,.12);padding:0}.portrait-frame img{height:100%;width:100%;object-fit:cover;object-position:center 30%;display:block}.about-text{font-size:clamp(1.25rem,2vw,1.9rem);line-height:1.28;max-width:38rem;margin:1.3rem 0 0}.about-detail{padding-top:3rem}.about-photo{height:clamp(18rem,35vw,36rem);background:#f6f4f1;overflow:hidden}.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center 40%;display:block}.about-detail h3{font:clamp(2rem,3.4vw,3.8rem)/.98 canopee,serif;max-width:35rem;margin:1.6rem 0}.small-copy{font-size:1.2rem;line-height:1.4;color:var(--muted);max-width:30rem}.education-stamp{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1rem 0;margin-top:2rem;display:grid;gap:.3rem}.education-stamp span{font: .62rem 'DM Mono',monospace;text-transform:uppercase;color:var(--muted)}.education-stamp strong{font:1.55rem canopee,serif}
.work{border-top:1px solid var(--line);padding-top:5rem}.section-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;margin-bottom:3rem}.section-heading .eyebrow{grid-column:1/-1}.section-heading h2{font:clamp(5rem,12vw,13rem)/.8 canopee,serif;letter-spacing:-.05em;margin:0}.arrow-mark{color:var(--accent);font-size:.5em;vertical-align:top}.section-intro{font-size:1.3rem;line-height:1.3;color:var(--muted);max-width:25rem;justify-self:end}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4rem 2.5rem}.project{min-width:0}.project-large{grid-column:1/-1;display:grid;grid-template-columns:1.35fr 1fr;column-gap:2rem;align-items:end}.project-large .project-image{grid-row:span 3}.project-image{display:block;position:relative;aspect-ratio:1.48;overflow:hidden;background:#aaa197}.project-image img{object-fit:cover}.image-arrow{position:absolute;right:1rem;top:1rem;background:var(--paper);width:2.5rem;height:2.5rem;border-radius:50%;display:grid;place-items:center;font:1.2rem 'DM Mono',monospace}.project-title{margin-top:.8rem;border-bottom:1px solid var(--line);padding-bottom:.5rem}.project-title h3{font:clamp(1.6rem,3vw,2.5rem) canopee,serif;margin:0}.project-title span{font-size:.58rem;color:var(--muted);white-space:nowrap}.project>p{font-size:1.1rem;line-height:1.35;color:var(--muted);margin:.65rem 0}.project-link{display:inline-block;font: .65rem 'DM Mono',monospace;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding:.25rem 0}.project-status{border:0;color:#756e66}.project-art{aspect-ratio:1.48;position:relative;overflow:hidden;display:grid;place-items:center;background:#282b2a;color:#d6cec4}.sensor-art{background:radial-gradient(circle at 50% 50%,#5c6b63 0 2%,transparent 2.5%),linear-gradient(135deg,#202725,#66766c)}.sensor-ring{width:42%;aspect-ratio:1;border:1px solid #c5bdb4;border-radius:50%;box-shadow:0 0 0 22px #c5bdb41a,0 0 0 52px #c5bdb414;position:relative}.sensor-ring:before,.sensor-ring:after{content:'';position:absolute;background:#c5bdb4}.sensor-ring:before{width:1px;height:160%;left:50%;top:-30%}.sensor-ring:after{height:1px;width:160%;top:50%;left:-30%}.sensor-label{position:absolute;bottom:1rem;left:1rem;color:#d5cec4;font-size:.58rem}.defense-art{background:radial-gradient(circle,#9e4b31 0 2px,transparent 3px),linear-gradient(140deg,#242321,#6b5146)}.target-ring{font:5rem 'DM Mono',monospace;border:1px solid #d0b9a7;border-radius:50%;width:35%;aspect-ratio:1;display:grid;place-items:center;box-shadow:0 0 0 22px #d0b9a71a,0 0 0 50px #d0b9a711}.snake-art{background:#222d29}.pixel-snake{font:clamp(2rem,5vw,5rem)/.72 'DM Mono',monospace;color:#b6d0a5;letter-spacing:.2em;text-align:center;transform:rotate(-15deg)}.orbit-image img{filter:grayscale(.4)}.lab-note{margin-top:4rem;border-top:1px solid var(--line);padding-top:1.5rem;display:grid;grid-template-columns:1fr 2fr;gap:2rem}.lab-note p{font-size:1.25rem;line-height:1.35;max-width:45rem;margin:0;color:var(--muted)}
.experience{border-top:1px solid var(--line);display:grid;grid-template-columns:.9fr 1.1fr;gap:2rem 6vw}.experience-title h2{font-size:clamp(4rem,7.5vw,8rem)}.experience-list{border-top:1px solid var(--line)}.experience-item{display:grid;grid-template-columns:9.5rem 1fr;gap:1.2rem;padding:1.5rem 0;border-bottom:1px solid var(--line)}.experience-date{color:#746d65;font-size:.6rem;padding-top:.5rem}.experience-item h3{font:2rem canopee,serif;margin:0}.experience-role{font: .68rem 'DM Mono',monospace;text-transform:uppercase;margin:.35rem 0 .8rem;color:var(--accent)}.experience-item p:last-child{font-size:1.08rem;line-height:1.35;color:var(--muted);margin:0}.skills-block{grid-column:1/-1;margin-top:2rem;border-top:1px solid var(--line);padding-top:1.5rem}.skill-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.skill-tags span{border:1px solid var(--line);border-radius:100px;padding:.55rem .85rem;font: .65rem 'DM Mono',monospace;text-transform:uppercase}
.contact{background:var(--ink);color:var(--paper);padding-top:5rem}.contact .eyebrow{color:#aaa198}.contact h2{font-size:clamp(5rem,12vw,13rem);margin:2rem 0}.contact h2 em{color:#c16a4c}.contact-email{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:1px solid #79736c;padding:1rem 0 1.5rem;font:clamp(1.4rem,4vw,4rem) canopee,serif;text-decoration:none}.contact-email span{font:1.5rem 'DM Mono',monospace}.contact-footer{display:flex;align-items:end;justify-content:space-between;gap:2rem;padding-top:3rem;font-size:.62rem;color:#c0b8af}.contact-footer p{line-height:1.7;text-align:center}.social-links{display:flex;gap:1rem;margin-top:.8rem}.social-links a,.back-top{color:var(--paper);text-decoration:none;border-bottom:1px solid #817970;padding-bottom:.25rem}.back-top{white-space:nowrap}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr 1.1fr;gap:2rem}.hero-center{grid-column:1/-1;grid-row:1;text-align:left;display:grid;grid-template-columns:1fr 1fr;align-items:end;column-gap:1rem}.hero-center .eyebrow{grid-column:1/-1}.hero-center h2{grid-row:2/4}.hero-note{margin:0 0 1rem}.text-link{justify-self:start}.feature-card-right{display:none}.hero-name{font-size:19vw}.about{gap:2rem}.about-detail{padding-top:2rem}.project-large{grid-template-columns:1fr 1fr}.experience{gap:2rem}.experience-title h2{font-size:6rem}}
@media(max-width:640px){.hero{padding:0 1rem 1rem}.hero #nav{height:4.5rem}.location{font-size:.56rem;width:auto}.wordmark{font-size:1.65rem}.menu-toggle{display:block;color:var(--ink)}.nav-links{display:none;position:absolute;top:4.5rem;left:0;width:100%;background:var(--ink);color:var(--paper);padding:1.2rem;flex-direction:column;gap:1rem}.nav-links.is-open{display:flex}.nav-links a{font-size:.8rem}.hero-grid{display:flex;flex-direction:column;align-items:stretch;padding:2rem .1rem 1.2rem;gap:1.8rem}.hero-center{display:block;text-align:left;order:-1}.hero-center h2{font-size:clamp(3.3rem,15vw,5.4rem)}.hero-note{margin:0 0 1rem;max-width:22rem}.feature-card{display:grid;grid-template-columns:42% 1fr;column-gap:1rem;align-items:start}.feature-card .image-frame{grid-row:span 4;aspect-ratio:1}.card-heading{display:block}.card-heading h2{font-size:1.3rem;margin:.1rem 0 .4rem}.feature-card p{font-size:.95rem}.card-meta{font-size:.5rem}.feature-card-right{display:grid}.hero-name{font-size:18.2vw;line-height:.85;letter-spacing:-.07em;padding:.15em 0}.hero-bottom{font-size:.5rem;flex-wrap:wrap}.hero-bottom span:nth-child(2){display:none}.section-paper{padding:3.5rem 1.2rem}.about{grid-template-columns:1fr;gap:1.5rem}.about h2,.experience h2,.contact h2{font-size:clamp(4rem,17vw,6rem)}.portrait-frame{height:23rem}.about-detail{padding-top:0}.about-photo{height:22rem}.about-detail h3{font-size:2.5rem}.about-text{font-size:1.25rem}.section-heading{display:block}.section-heading h2{font-size:clamp(5rem,20vw,8rem)}.section-intro{margin:1rem 0 0;font-size:1.15rem}.project-grid{grid-template-columns:1fr;gap:2.5rem}.project-large{grid-column:auto;display:block}.project-image,.project-art{aspect-ratio:1.35}.project-title h3{font-size:1.9rem}.project-title span{font-size:.52rem}.lab-note{grid-template-columns:1fr;gap:.8rem;margin-top:3rem}.lab-note p{font-size:1.1rem}.experience{grid-template-columns:1fr;gap:1rem}.experience-title h2{font-size:clamp(4rem,16vw,6rem)}.experience-item{grid-template-columns:1fr;gap:.5rem;padding:1.2rem 0}.experience-date{padding:0}.experience-item h3{font-size:1.8rem}.skills-block{margin-top:1rem}.skill-tags span{font-size:.58rem;padding:.5rem .7rem}.contact h2{font-size:clamp(4.5rem,17vw,7rem)}.contact-email{font-size:1.7rem}.contact-footer{align-items:flex-start;flex-direction:column;gap:1.8rem}.contact-footer p{text-align:left;margin:0}.social-links{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* Original project screenshots were template-demo assets, so these custom typographic panels avoid misrepresenting them as Abdul's work. */
.mockup{height:100%;width:100%;min-height:11rem;padding:1rem;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:transform .65s cubic-bezier(.2,.7,.2,1)}.project-mock-link:hover .mockup{transform:scale(1.035)}.mockup-top,.mockup-bottom{font: .58rem 'DM Mono',monospace;letter-spacing:.08em;display:flex;justify-content:space-between;gap:.5rem}.mockup strong{font:clamp(2.3rem,5vw,5.5rem)/.76 canopee,serif;letter-spacing:-.045em}.mockup-shop{background:#d9d1c7;color:#1d1d1b}.mockup-shop strong{font-size:clamp(3rem,6vw,6rem)}.mockup-physics{background:#243c47;color:#f2eee7}.mockup-physics strong{font-size:clamp(2.7rem,5vw,5.2rem)}.mockup-orbit{background:#b64c2d;color:#f4e9dc}.mockup-orbit strong{font-size:clamp(3rem,6vw,6rem)}.mockup-top small{font-size:inherit}.feature-card .mockup{aspect-ratio:1.52}.feature-card .mockup strong{font-size:clamp(2rem,3.4vw,4rem)}