@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--paper:#f7f7f0;--ink:#172722;--muted:#68716c;--line:#d8ddd3;--accent:#c65329;--green:#d5e3cb}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Manrope','IBM Plex Sans Arabic',sans-serif;line-height:1.7}html[lang=ar] body{font-family:'IBM Plex Sans Arabic','Manrope',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.wrap{width:min(1200px,88%);margin:auto}header{width:100%;padding:20px 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(247,247,240,.96);position:sticky;top:0;z-index:10;gap:22px}.brand{display:flex;align-items:center;gap:12px;direction:ltr;font:800 13px/1.2 'Manrope',sans-serif;letter-spacing:2px}.brand small{font-size:9px;letter-spacing:2.6px}.mark{font-size:39px;letter-spacing:-5px;line-height:1}.mark span{color:var(--accent)}nav{display:flex;gap:34px;font-size:14px}.lang{border:1px solid var(--line);border-radius:40px;padding:7px 18px;background:transparent;min-width:75px}.hero{padding:80px 0 76px;display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}.eyebrow{font-size:12px;font-weight:600;letter-spacing:1px;color:var(--accent);margin:0 0 20px}h1{font-size:clamp(36px,4.4vw,62px);line-height:1.3;letter-spacing:-1.5px;margin:0 0 24px;font-weight:600}h1 em,h2 em{color:var(--accent);font-style:normal}p{margin:0 0 18px}.intro{font-size:17px;line-height:1.95;color:var(--muted);max-width:570px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 26px}.button{font-size:14px;padding:12px 22px;border-radius:5px;display:inline-block;font-weight:600}.primary{background:var(--ink);color:white}.outline{border:1px solid var(--line)}.button:hover{transform:translateY(-2px)}.location{font-size:12px;color:var(--muted)}.architecture{padding:28px;background:var(--ink);color:var(--paper);border-radius:5px;transform:rotate(-2deg);box-shadow:14px 18px 0 #e5e8dc;font-family:'Manrope',sans-serif}.art-top,.art-bottom{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1px;color:#b6c5bb}.dot{width:7px;height:7px;border-radius:50%;background:#d7e9b1}.art-title{font-size:27px;line-height:1.4;margin:26px 0}.art-title i{color:#bed5a8;font-weight:400}.node{display:flex;gap:10px}.node span{flex:1;text-align:center;padding:12px 6px;border:1px solid #5a6b61;border-radius:4px;font-size:10px;letter-spacing:1px}.connector{height:24px;width:1px;background:#75917a;margin:auto}.api{border:1px solid #abc599;background:#253c30;padding:20px;text-align:center;border-radius:4px}.api .small{font-size:8px;letter-spacing:2px;color:#b9cfad;display:block}.api strong{display:block;font-size:22px;margin:7px 0}.api b{color:#dc936c;padding:0 8px}.api code{font-size:11px;color:#b1c2b8}.art-bottom{padding-top:28px;font-size:8px}.stack{display:flex;justify-content:center;gap:5%;padding:22px 6%;border-block:1px solid var(--line);font-size:14px;font-weight:600;color:#5a655c;direction:ltr;flex-wrap:wrap}.section{padding:85px 0}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:36px}.section-heading p:last-child{max-width:340px;color:var(--muted);font-size:14px}h2{font-size:clamp(28px,3.1vw,43px);line-height:1.4;margin:0;font-weight:600;letter-spacing:-.7px}.section-heading .eyebrow{margin-bottom:9px}.filters{display:flex;gap:9px;margin-bottom:30px;flex-wrap:wrap}.filters button{padding:7px 18px;border:1px solid var(--line);border-radius:30px;background:transparent;font-size:13px}.filters button.active{background:var(--ink);color:white;border-color:var(--ink)}.projects{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}.project{min-width:0}.project.featured{grid-column:1/-1;display:grid;grid-template-columns:1.15fr 1fr;gap:36px;background:#e9eddf;border:1px solid #dce3d4;padding:30px}.project-art{min-height:200px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;border-radius:3px;background:#e7eade;color:#324d39;padding:30px;direction:ltr}.project-art:before{content:'';position:absolute;width:150px;height:150px;border:1px solid currentColor;border-radius:50%;opacity:.1;left:-40px;top:-30px}.project-art b{font-family:'Manrope',sans-serif;font-size:clamp(24px,3vw,42px);font-weight:800;letter-spacing:-1px}.project-art small{letter-spacing:4px;font-size:9px;margin-top:9px}.project-art .mini-line{display:flex;gap:20px;margin-top:25px;font-size:10px;opacity:.65}.art-1{background:#20392d;color:#d0e7b4;min-height:280px}.art-2{background:#f0e1d6;color:#6b4633}.art-3{background:#e0e8eb;color:#375864}.art-4{background:#e6e2ec;color:#585072}.art-5{background:#eee2d3;color:#805f3b}.art-6{background:#dfe7dd;color:#3f5c47}.art-7{background:#e9e4d5;color:#6b6146}.project-copy{padding:20px 0 6px}.project.featured .project-copy{align-self:center}.project .category{color:var(--accent);font-size:11px;letter-spacing:.5px;margin:0 0 5px}.project h3{font-family:'Manrope',sans-serif;font-size:25px;margin:0 0 10px;line-height:1.3}.project p{color:var(--muted);font-size:14px}.tags{display:flex;gap:8px;flex-wrap:wrap;direction:ltr;justify-content:flex-start}.tags span{font-size:10px;padding:4px 9px;border:1px solid #ccd4c8;border-radius:3px;color:#4b5c51}.details{border:0;border-bottom:1px solid var(--ink);background:transparent;padding:6px 0;margin-top:16px;font-size:13px}.work-note{font-size:12px;color:var(--muted);margin:30px 0 0;max-width:800px}.approach{background:var(--ink);color:#f6f6ed;padding:65px 0}.approach .eyebrow{color:#b8ce9d}.approach-inner{display:grid;grid-template-columns:1fr 1.6fr;gap:70px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.steps article{border-top:1px solid #617065;padding-top:15px}.steps span{color:#c2d5ad;font-size:13px}.steps h3{font-size:17px;font-weight:500;margin:20px 0 9px}.steps p{font-size:13px;color:#bdc8c1}.about-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:85px}.job{border-top:1px solid var(--line);padding:23px 0}.job .date{font-size:11px;color:var(--accent);direction:ltr;display:block}.job h3{margin:6px 0;font-size:19px;font-weight:600}.job p{font-size:14px;color:var(--muted);margin:5px 0}.job strong{font-size:13px;font-weight:500}aside{background:#eff1e7;padding:30px;align-self:start}aside h3{font-size:16px;margin:22px 0 12px}aside h3:first-child{margin-top:0}aside p{font-size:14px;color:var(--muted)}hr{border:0;border-top:1px solid var(--line);margin:27px 0}.contact{background:#e9eddf;padding:75px 0}.contact h2{font-size:clamp(32px,4.2vw,55px);margin-bottom:30px}.email{font-size:clamp(16px,2.2vw,28px);border-bottom:1px solid #82917d;direction:ltr;display:inline-block}.contact-links{display:flex;gap:26px;flex-wrap:wrap;align-items:center;font-size:13px;margin-top:28px;direction:ltr;justify-content:flex-start}.contact-links button{background:transparent;border:1px solid #bac5b3;padding:6px 14px;border-radius:4px;font-size:12px}#copy-status{font-size:12px;min-height:21px;margin-top:10px}footer{display:flex;justify-content:space-between;padding:23px 0;font-size:11px;color:var(--muted)}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:8px;max-width:700px;width:90%;padding:40px;max-height:85vh}dialog::backdrop{background:#10271fcc;backdrop-filter:blur(5px)}#close-dialog{position:absolute;inset-inline-end:15px;top:10px;background:transparent;border:0;font-size:28px}dialog h2{font-size:30px;margin:15px 0}dialog h3{font-size:16px;margin:25px 0 8px}dialog p,dialog li{font-size:15px;color:var(--muted)}dialog li{margin:8px 0}.skip{position:fixed;top:-60px;background:white;z-index:20;padding:10px}.skip:focus{top:0}@media(max-width:850px){.hero{grid-template-columns:1fr;padding:45px 0 60px;gap:28px}.architecture{max-width:560px;width:100%;justify-self:center}.hero h1{font-size:44px}.section-heading{display:block}.section-heading>p{margin-top:18px}.project.featured{grid-template-columns:1fr;gap:0}.about-grid,.approach-inner{grid-template-columns:1fr;gap:35px}.section{padding:60px 0}.stack{gap:22px}.art-title{font-size:25px}}@media(max-width:520px){header{padding:15px 6%;gap:12px}.brand{font-size:10px;gap:8px}.brand small{font-size:7px}.mark{font-size:32px}nav{gap:13px;font-size:12px}nav a:nth-child(2){display:none}.lang{padding:6px 10px;min-width:54px;font-size:12px}.hero h1{font-size:36px}.intro{font-size:16px}.projects{grid-template-columns:1fr;gap:28px}.project.featured{padding:18px}.project-art{min-height:180px}.art-1{min-height:220px}.steps{grid-template-columns:1fr;gap:12px}.steps h3{margin:8px 0}.steps article{padding-top:10px}.actions{gap:8px}.button{font-size:12px;padding:11px 15px}.architecture{transform:none;box-shadow:8px 10px 0 #e5e8dc;padding:22px}.contact-links{gap:18px}.section-heading h2{font-size:28px}dialog{padding:30px 22px}footer{font-size:10px}.tags span{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.header-controls{display:flex;align-items:center;gap:9px}.theme-toggle{min-width:42px;width:42px;padding:4px;font-size:23px;line-height:1.5}.project-link{display:inline-block;font-size:13px;color:var(--accent);margin-top:16px;margin-inline-end:22px;font-weight:600}.project-art b{text-align:center;line-height:1.25}.project-year{font-size:12px;color:var(--accent)}.link-note{font-size:12px!important;margin-top:10px}#project-count{margin:0 0 20px}.project-art small{text-align:center}.project .details{margin-inline-end:5px}
html[data-theme=dark]{color-scheme:dark;--paper:#111b18;--ink:#e7eee6;--muted:#a9b8ae;--line:#36473d;--accent:#f4a77e;--green:#263e30}html[data-theme=dark] header{background:#111b18f5}html[data-theme=dark] .primary,html[data-theme=dark] .filters button.active{background:#c6ddb5;color:#15271b}html[data-theme=dark] .architecture{background:#1d3126;color:#f5f5e9;box-shadow:14px 18px 0 #263b2d}html[data-theme=dark] .project.featured,html[data-theme=dark] aside,html[data-theme=dark] .contact{background:#1b2c22;border-color:#36473d}html[data-theme=dark] .approach{background:#0c1510;color:#e7eee6}html[data-theme=dark] .stack{color:#b8c9bc}html[data-theme=dark] .tags span{color:#c4d3c6;border-color:#485b4c}html[data-theme=dark] .project-art{filter:brightness(.8)}html[data-theme=dark] .skip{background:#1b2c22}body,header,aside,.contact,.project.featured{transition:background-color .2s,color .2s}@media(max-width:520px){.header-controls{gap:6px}.theme-toggle{min-width:32px;width:32px;font-size:20px}header{gap:9px}nav{gap:10px}.brand{letter-spacing:1px}.project-link{font-size:12px}.architecture{box-shadow:none!important}}
/* Portrait-led parallax edition */
:root{--paper:#f3f5f7;--ink:#10243b;--muted:#566b7c;--line:#d3dde4;--accent:#087e91;--green:#d9ebef}html[data-theme=dark]{--paper:#081321;--ink:#edf4fa;--muted:#a7bbcd;--line:#263c50;--accent:#36d8e4;--green:#143748}header{background:#f3f5f7f0}html[data-theme=dark] header{background:#081321ed}.parallax-hero{position:relative;isolation:isolate;min-height:780px;padding-block:45px 35px;gap:20px;grid-template-columns:1fr 1.05fr;overflow:clip}.hero-copy{z-index:2;position:relative}.parallax-hero h1{font-size:clamp(45px,5.5vw,78px);line-height:1.16;letter-spacing:-2px}.parallax-hero h1 em{position:relative;display:inline-block}.parallax-hero h1 em:after{content:'';display:block;height:5px;background:var(--accent);border-radius:100%;transform:rotate(-4deg);margin-top:7px}.hero-grid{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:70px 70px;opacity:.13;mask-image:linear-gradient(90deg,#000,transparent)}.portrait-scene{height:700px;position:relative;align-self:end;isolation:isolate}.portrait{position:absolute;height:100%;width:100%;object-fit:contain;object-position:center bottom;z-index:2;mask-image:linear-gradient(#000 87%,transparent);filter:drop-shadow(0 18px 28px #07152725)}.orbit{position:absolute;border:45px solid #dbe8ed;border-radius:50%;width:460px;height:590px;left:50%;top:55px;margin-left:-230px;rotate:24deg;z-index:0}.orbit-two{width:260px;height:260px;border:1px solid #239aa866;top:70px;margin-left:-130px;rotate:-20deg}.scene-label{position:absolute;top:18px;left:25px;font:500 10px 'Manrope',sans-serif;letter-spacing:3px;color:var(--muted)}.float-tag{position:absolute;z-index:3;background:#fffef4ed;border:1px solid #c5dce4;padding:13px 17px;display:flex;align-items:center;gap:12px;border-radius:8px;box-shadow:0 15px 40px #09223a14;font-family:'Manrope',sans-serif}.float-tag b{font-size:24px;color:var(--accent)}.float-tag span{font-size:12px;font-weight:700}.float-tag small{display:block;font-size:7px;letter-spacing:1.5px;margin-top:4px;color:var(--muted)}.tag-api{top:42%;left:-5%}.tag-data{bottom:17%;right:-1%}.portrait-caption{position:absolute;bottom:12px;width:100%;text-align:center;font-size:10px;color:var(--muted);z-index:4}.section-heading h2{max-width:650px}.project-art{transition:transform .4s}.project:hover .project-art{transform:translateY(-4px)}html[data-theme=dark] .orbit-one{border-color:#152d43}html[data-theme=dark] .float-tag{background:#0d2338ee;border-color:#31506a}html[data-theme=dark] .primary,html[data-theme=dark] .filters button.active{background:#39cfde;color:#071b2b}html[data-theme=dark] .project.featured,html[data-theme=dark] aside,html[data-theme=dark] .contact{background:#102235;border-color:#263c50}html[data-theme=dark] .approach{background:#050e19}html[data-theme=dark] .stack,html[data-theme=dark] .tags span{color:#b5cadb}.approach{background:#10243b}.approach .eyebrow{color:#62dce6}.steps span{color:#62dce6}.project.featured,aside,.contact{background:#e5edf2}.tags span{color:var(--muted);border-color:var(--line)}.motion-enabled .section-heading{animation:section-enter linear both;animation-timeline:view();animation-range:entry 0% entry 60%}@keyframes section-enter{from{opacity:.5;transform:translateY(25px)}to{opacity:1;transform:none}}@media(max-width:850px){.parallax-hero{grid-template-columns:1fr;min-height:0;padding-top:40px;gap:5px}.parallax-hero h1{font-size:58px}.portrait-scene{height:620px;width:min(550px,100%);margin:auto}.hero-copy{max-width:650px}.tag-api{left:0}.tag-data{right:0}.hero-grid{mask-image:linear-gradient(0deg,#000,transparent)}}@media(max-width:520px){.parallax-hero h1{font-size:46px;line-height:1.2}.portrait-scene{height:480px}.orbit-one{width:310px;height:390px;border-width:30px;margin-left:-155px;top:45px}.orbit-two{width:210px;height:210px;margin-left:-105px}.float-tag{padding:9px 11px;gap:8px}.float-tag span{font-size:10px}.float-tag small{font-size:6px}.float-tag b{font-size:20px}.tag-api{left:0;top:44%}.tag-data{bottom:16%}.scene-label{font-size:8px;letter-spacing:2px}.portrait-caption{font-size:9px}.parallax-hero{overflow:hidden}.hero .intro{font-size:15px}.hero .actions{margin:22px 0}.hero .location{margin-bottom:0}}@media(prefers-reduced-motion:reduce){[data-depth]{transform:none!important}.motion-enabled .section-heading{animation:none}.project:hover .project-art{transform:none}}

.tag-api{left:1%}

/* Editorial portfolio / original identity */
.original-portrait{margin:0;align-self:center;height:auto;transform:rotate(-2deg);padding:14px;border:1px solid var(--line);background:var(--paper);box-shadow:0 30px 70px #08132120}.original-photo{display:block;width:100%;height:auto;border-radius:2px}.original-portrait figcaption{font-size:12px;padding:12px 5px 0;color:var(--muted)}.professional-title{font-size:18px;font-weight:600;color:var(--accent)}.parallax-hero{gap:6%;min-height:780px;overflow:visible;padding-block:70px}.parallax-hero h1{font-size:clamp(44px,5.7vw,80px)}.introduction{max-width:900px;text-align:center}.introduction .intro{max-width:800px;margin:25px auto}.engineering{display:grid;grid-template-columns:1fr 1.35fr;gap:9%;align-items:start}.case-intro{position:sticky;top:120px}.case-intro>p{margin-block:24px;color:var(--muted)}.case-chapter{padding:38px;border-top:1px solid var(--line);background:var(--paper);margin-bottom:30px}.chapter-number{font:500 50px sans-serif;color:var(--accent);opacity:.45}.case-chapter h3{font-size:25px;margin:12px 0}.case-chapter p{font-size:16px;color:var(--muted);line-height:1.9}.case-chapter small{font-size:12px;color:var(--accent)}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:35px}.result-grid article{border-block:1px solid var(--line);padding:30px 0}.result-grid strong{display:block;font-size:clamp(23px,2.8vw,39px);font-family:Manrope,sans-serif;letter-spacing:-1px;color:var(--accent)}.result-grid p{margin-top:18px;font-size:15px;color:var(--muted)}.expertise-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:35px}.expertise-grid article{border-top:1px solid var(--line);padding:20px 0}.expertise-grid h3{font-size:23px}.expertise-grid p{color:var(--muted);font-size:16px}.downloads{display:flex;gap:25px;flex-wrap:wrap;margin-top:25px;font-size:14px}.downloads a{border-bottom:1px solid var(--accent)}.tags span{font-size:12px}.job .date,.project .category{font-size:13px}.project p{font-size:16px}.scroll-progress{position:fixed;inset:0 0 auto;height:3px;background:var(--accent);transform-origin:left;transform:scaleX(0);z-index:100}.case-chapter{scroll-margin-top:100px}.project-art small{letter-spacing:2px}.project-art{min-height:160px}.section{padding-block:90px}@media(max-width:850px){.engineering{grid-template-columns:1fr;gap:25px}.case-intro{position:static}.original-portrait{max-width:490px;margin:auto}.parallax-hero{gap:35px;min-height:0}.result-grid{grid-template-columns:1fr}.result-grid article{padding:20px 0}.result-grid strong{font-size:36px}.section{padding-block:55px}nav a[href="#engineering"]{display:none}}@media(max-width:520px){.expertise-grid{grid-template-columns:1fr;gap:15px}.case-chapter{padding:25px 5px}.original-portrait{width:100%;transform:none}.professional-title{font-size:16px}.parallax-hero h1{font-size:44px}.parallax-hero{padding-block:40px}.case-chapter h3{font-size:22px}}

.hero-copy>.eyebrow{font-size:15px;letter-spacing:0}.system-map{direction:ltr;text-align:center;padding:30px;background:var(--green);margin-bottom:30px;border:1px solid var(--line);border-radius:8px}.system-map>div{border:1px solid var(--line);padding:18px;font-size:15px;background:var(--paper)}.system-map>span{display:block;padding:12px;color:var(--accent)}.system-map p{font-size:12px;margin:20px 0 0;color:var(--muted)}@media(max-width:520px){nav a[href="#about"]{display:none}header{padding-inline:5%}.brand{flex-shrink:0}nav{font-size:11px}.header-controls{flex-shrink:0}.hero-copy>.eyebrow{font-size:13px}}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.case-flow{font-size:13px;padding:20px 0;border-block:1px solid #82918b55;overflow-wrap:anywhere}.skill-groups>div{padding:12px 0;border-bottom:1px solid #82918b44}.skill-groups h4{margin:0 0 8px}.skill-groups p{font-size:14px;line-height:1.8}.actions{flex-wrap:wrap}#intelligent .expertise-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:850px){.case-grid,#intelligent .expertise-grid{grid-template-columns:1fr}}

/* November portrait, evidence and motion refinement */
.original-portrait{max-width:430px;width:100%;margin-inline:auto;transform:none!important;border-radius:180px 180px 12px 12px;overflow:hidden;background:var(--surface)}
.original-portrait .original-photo{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;display:block;transform:none!important}
.original-portrait figcaption{padding:16px;text-align:center}
.result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.result-grid article{border-top:1px solid currentColor;padding:28px 0}.result-grid strong{display:block;font-size:clamp(2.5rem,5vw,4.5rem);direction:ltr;font-variant-numeric:tabular-nums}.result-grid p,.evidence-note{line-height:1.8}.evidence-note{font-size:.9rem;opacity:.8}
.project,.case-chapter,.expertise-grid article{transition:transform .3s ease,box-shadow .3s ease}.project:hover,.case-chapter:hover{transform:translateY(-6px)}
@media(max-width:700px){.result-grid{grid-template-columns:1fr}.original-portrait{max-width:330px}.result-grid article{padding:18px 0}}
@media(prefers-reduced-motion:reduce){.project,.case-chapter,.expertise-grid article{transition:none;transform:none!important}}
