/* Desktop density: approved components at 80%; original colors and mobile sizing. */
@media screen and (min-width:1101px){
/* styles.css */
@charset "UTF-8";
:root{color-scheme:dark;--bg:#222831;--surface:#1c2129;--raised:#29323e;--text:#f6f7fa;--muted:#b0bbc7;--line:#3b4653;--green:#40c6af;--green-ink:#102e2a;--aside-width:clamp(232px,22.4vw,296px);--main-left:calc(var(--aside-width) + clamp(56px,10.4vw,152px) + 19.2px);--ease:cubic-bezier(.22,1,.36,1);--modal-open-dur:250ms;--modal-close-dur:150ms;--modal-scale:.96;--modal-scale-close:.96;--modal-ease:var(--ease);--acc-expand:250ms;--acc-collapse:250ms;--acc-chevron:250ms;--acc-ease:var(--ease)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px;scrollbar-color:#424242 var(--bg);scrollbar-width:thin}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;font-size:12px;line-height:1.6;-webkit-font-smoothing:antialiased}body.dialog-open{overflow:hidden}::selection{background:var(--green);color:var(--green-ink)}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button,a,input{ -webkit-tap-highlight-color:transparent}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:1.6px solid var(--green);outline-offset:4px}button:active,.button:active{transform:scale(.96)}button[hidden],[hidden]{display:none!important}svg.icon{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}img{max-width:100%;display:block}p{margin:0 0 16px;text-wrap:pretty}h1,h2,h3,h4{font-family:Manrope,Arial,sans-serif;font-weight:400;text-wrap:balance;margin:0;letter-spacing:-.035em}h2{font-size:clamp(21.6px,1.96vw,28px);line-height:1.25}h3{font-size:21.6px;line-height:1.25}.accent{color:var(--green)}.sr-only{position:absolute;width:0.8px;height:0.8px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:6.4px;left:6.4px;transform:translateY(-150%);background:var(--green);color:var(--green-ink);padding:9.6px 16px;border-radius:6.4px;z-index:100}.skip-link:focus{transform:none}.button{display:inline-flex;align-items:center;justify-content:center;gap:11.2px;min-height:36.8px;padding:8.8px 18.4px;background:var(--green);color:var(--green-ink);border:0.8px solid transparent;border-radius:80px;font-size:10.4px;font-weight:600;transition:background-color 150ms,transform 150ms,color 150ms}.button:hover{background:#79dcc9}.button.secondary{background:transparent;color:var(--text);border-color:#474747}.button.secondary:hover{border-color:var(--green);color:var(--green);background:#263e3d}.button.small{min-height:33.6px;padding:6.4px 13.6px}.text-button{display:inline-flex;align-items:center;gap:6.4px;background:transparent;color:var(--muted);border:0;font-size:9.6px;min-height:35.2px}.text-button:hover{color:var(--green)}.text-button .icon{width:11.2px;height:11.2px}.mobile-header{display:none}
.profile-card{position:fixed;left:19.2px;top:22.4px;bottom:22.4px;width:var(--aside-width);max-height:800px;display:flex;flex-direction:column;z-index:20;padding:22.4px;border:0.8px solid #2c2c2c;border-radius:19.2px;background:#222831;overflow:hidden}.card-top{display:flex;align-items:flex-start;justify-content:space-between;position:relative;z-index:2}.wordmark{font-family:Manrope,Arial,sans-serif;font-size:17.6px;font-weight:800;letter-spacing:-.04em}.wordmark .accent{font-size:8px;vertical-align:top;margin-left:2.4px}.profile-socials{display:flex;flex-direction:column;gap:7.2px}.profile-socials a{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#29323e;color:#aaa;font-size:9.6px;font-weight:600;transition:color 150ms,background-color 150ms}.profile-socials a:hover{color:var(--green);background:#28453f}.profile-socials .icon{width:12.8px;height:12.8px}.profile-art{flex:1;position:relative;min-height:128px;display:flex;align-items:center;justify-content:center;margin:-28px -22.4px -22.4px;overflow:hidden}.profile-art>.personal-stamp{width:76%;max-width:216px;position:relative;z-index:1;transform:rotate(-10deg);opacity:.87}.profile-art>.orbit{position:absolute;width:128%;height:125%;color:#38786f;opacity:.5}.profile-art>.orbit ellipse{fill:none;stroke:currentColor;stroke-width:.7}.profile-art::after{content:'';position:absolute;inset:80% 0 0;background:linear-gradient(transparent,#222831)}.art-caption{position:absolute;bottom:25.6px;left:22.4px;font-size:8px;color:#939393;letter-spacing:.1em}.profile-info{position:relative;z-index:2;padding-top:19.2px;background:#222831}.profile-info h2{font-size:clamp(20px,2vw,28.8px);letter-spacing:-.04em;margin-bottom:11.2px}.profile-info p{font-size:10.4px;color:#aaa;line-height:1.7;max-width:30ch;margin-bottom:17.6px}.profile-bottom{display:flex;align-items:center;gap:12.8px;padding-top:16px;border-top:0.8px solid var(--line)}.pdf-link{display:flex;align-items:center;gap:4.8px;font-size:8.8px;color:#b6b6b6;white-space:nowrap;min-height:35.2px}.pdf-link:hover{color:var(--green)}.pdf-link .icon{width:12px;height:12px}.profile-location{display:flex;align-items:center;gap:5.6px;font-size:8px;letter-spacing:.04em;margin-top:16px;color:#b5b5b5}.status-dot{width:4.8px;height:4.8px;border-radius:50%;background:var(--green)}
.nav-rail{position:fixed;right:17.6px;top:50%;transform:translateY(-50%);z-index:30;display:flex;flex-direction:column;gap:4.8px;background:#1b1b1b;border:0.8px solid #292929;border-radius:80px;padding:8px 4.8px}.nav-rail a{width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:#9c9c9c;border-radius:50%;position:relative;transition:background-color 150ms,color 150ms}.nav-rail a:hover,.nav-rail a[aria-current]{background:#28453f;color:var(--green)}.nav-rail .icon{width:13.6px;height:13.6px}.nav-label{position:absolute;right:39.2px;background:#292929;color:#f6f7fa;font-size:8.8px;padding:4px 8px;border-radius:4.8px;white-space:nowrap;opacity:0;pointer-events:none;transform:translateX(3.2px);transition:opacity 150ms,transform 150ms}.nav-rail a:hover .nav-label,.nav-rail a:focus-visible .nav-label{opacity:1;transform:none}.main-column{width:calc(100% - var(--main-left) - 89.6px);max-width:720px;margin-left:var(--main-left);padding-top:52px}.hero{padding-bottom:51.2px}.hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:41.6px}.identity{display:flex;align-items:center;gap:9.6px}.mini-stamp{width:34.4px;flex-shrink:0}.identity p{font-size:10.4px;font-weight:500;margin:0 0 1.6px}.identity span:not(.mini-stamp){font-size:8.8px;color:var(--muted)}.local-time{font-size:8px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums;white-space:pre-line;line-height:1.6}.hero h1{font-size:clamp(34.4px,3.72vw,60.8px);line-height:1.14;letter-spacing:-.04em;font-weight:400;margin-left:-2.4px}.highlight{display:inline-block;background:var(--green);color:var(--green-ink);padding:0 12px 4px;border-radius:48px;line-height:1.08;white-space:nowrap}.dark-highlight{background:#242424;color:var(--green);padding-right:13.6px;padding-left:13.6px}.hero-description{color:var(--muted);font-size:10.4px;line-height:1.8;margin-top:20px}.ribbon-scene{height:clamp(192px,19.2vw,272px);position:relative;overflow:hidden;margin:12.8px -8px -4.8px;isolation:isolate}.ribbon{width:100%;height:100%;overflow:visible}.craft-seal{width:clamp(102.4px,9.84vw,144.8px);height:clamp(102.4px,9.84vw,144.8px);position:absolute;left:50%;top:38%;transform:translate(-50%,-50%) rotate(-20deg);background:#101010;border-radius:50%;box-shadow:0 7.2px 14.4px #0005}.craft-seal>svg{width:100%;height:100%;overflow:visible}.craft-seal text{font-family:Inter,sans-serif;fill:#d3d3d3;font-size:9.12px;letter-spacing:0.96px}.seal-lines{stroke:#bdbdbd;fill:none;stroke-width:.7}.hero-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;position:relative;border-bottom:0.8px solid var(--line);padding:24px 0 41.6px;gap:14.4px}.stat{display:flex;flex-direction:column;gap:4px}.stat strong{font-family:Manrope,sans-serif;font-size:33.6px;font-weight:500;line-height:1.1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.stat strong>span{color:var(--green);font-size:19.2px;margin-left:2.4px}.stat>span{font-size:8.8px;color:var(--muted)}.explore-link{display:flex;align-items:center;gap:6.4px;position:absolute;bottom:-10.4px;right:0;background:var(--bg);padding-left:12px;color:#aaa;font-size:8px;min-height:21.6px}.explore-link .icon{width:11.2px;height:11.2px}.explore-link:hover{color:var(--green)}.section-line{display:flex;align-items:center;justify-content:space-between;gap:17.6px;margin-bottom:24px}.section-line>span{font-size:8px;white-space:nowrap;color:var(--muted)}.section-line>.icon{color:var(--muted)}.clients-section{padding-bottom:80px}.clients-section h2{font-size:12.8px;letter-spacing:-.02em}.clients-section .section-line{margin-bottom:20.8px}.client-wordmarks{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:17.6px 19.2px;padding-bottom:19.2px;color:#d2d2d2;font-family:Manrope,sans-serif;font-size:14.4px;font-weight:600;letter-spacing:-.04em}.client-audi{font-size:19.2px}.client-reef{letter-spacing:.12em;font-family:Georgia,serif}.client-tadweer{font-weight:800}.client-42{font-size:23.2px;line-height:1;display:flex;align-items:center;gap:5.6px;font-weight:800}.client-42>span{font-family:Inter,sans-serif;font-size:4.8px;width:16px;line-height:1.4;letter-spacing:0}.quiet-note{color:#a0a0a0;font-size:8px;line-height:1.8;margin-bottom:0}.work-section,.about-section,.services-section,.tools-section{padding-bottom:88px;scroll-margin-top:32px}.section-intro{font-size:16px;line-height:1.5;color:#c6c6c6;font-family:Manrope,sans-serif;letter-spacing:-.02em;margin:0 0 24px}.project-total{font-variant-numeric:tabular-nums}.work-controls{display:flex;flex-direction:column;gap:14.4px;margin-bottom:11.2px}.filters{display:flex;flex-wrap:wrap;gap:4px}.filter-button{border:0.8px solid transparent;background:transparent;color:#b6b6b6;border-radius:40px;padding:7.2px 10.4px;font-size:8.8px;min-height:32px;white-space:nowrap;transition:background-color 150ms,color 150ms,border-color 150ms}.filter-button:hover{color:var(--green)}.filter-button[aria-pressed=true]{border-color:var(--green);color:var(--green);background:#263e3d}.filter-button>span{font-size:6.4px;vertical-align:super;margin-left:2.4px;opacity:.8}.search-field{border:0.8px solid var(--line);display:flex;gap:8px;align-items:center;max-width:212px;border-radius:80px;padding:0 12px;color:#aaa;height:32px}.search-field:focus-within{border-color:var(--green)}.search-field .icon{width:11.2px;height:11.2px}.search-field input{border:0;background:transparent;color:var(--text);font-size:8.8px;width:100%;height:30.4px;outline:none;caret-color:var(--green);min-width:0}.search-field input:focus-visible{outline:none}.search-field input::placeholder{color:#999}.work-results-bar{display:flex;align-items:center;justify-content:space-between;min-height:32px}.work-results-bar p{margin:0;font-size:8px;color:#a0a0a0}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25.6px 16px}.project-card{min-width:0;display:block}.project-image{aspect-ratio:1.55;overflow:hidden;border-radius:11.2px;background:#29323e;position:relative;isolation:isolate}.project-image>img{width:100%;height:100%;object-fit:cover;transition:transform 550ms var(--ease);outline:0.8px solid #ffffff12;outline-offset:-0.8px}.project-card:hover .project-image>img{transform:scale(1.035)}.project-arrow{position:absolute;right:11.2px;bottom:11.2px;background:#111e;color:#f3f3f3;display:grid;place-items:center;min-width:28px;min-height:28px;border-radius:50%;transition:background-color 150ms,color 150ms,transform 250ms}.project-card:hover .project-arrow{background:var(--green);color:var(--green-ink);transform:rotate(45deg)}.project-arrow .icon{width:12.8px;height:12.8px}.project-card-meta{display:flex;justify-content:space-between;gap:9.6px;margin-top:11.2px}.project-card-meta>div{min-width:0}.project-card h3{font-size:12.8px;letter-spacing:-.02em;line-height:1.5;font-weight:500}.project-card-meta p{font-size:8px;color:var(--muted);margin:2.4px 0 0;line-height:1.6}.project-year{font-size:8px;color:var(--muted);padding-top:3.2px;flex-shrink:0}.project-card.featured{grid-column:1/-1}.project-card.featured .project-image{aspect-ratio:1.7}.project-card.featured h3{font-size:18.4px}.project-card.featured .project-card-meta p{font-size:9.6px}.project-card.featured .project-year{font-size:9.6px}.project-card.featured .project-arrow{width:36px;height:36px}.load-more-wrap{text-align:center;margin-top:33.6px}.load-more-wrap .button{font-weight:400;font-size:9.6px;padding:8px 19.2px}.remaining-count{color:var(--muted);font-size:8px}.empty-state{padding:52px 16px;text-align:center;border:0.8px dashed var(--line);border-radius:12.8px}.empty-state h3{font-size:20px;margin-bottom:9.6px}.empty-state p{font-size:10.4px;color:var(--muted)}.about-copy h3{font-size:clamp(27.2px,2.64vw,39.2px);line-height:1.17;margin-bottom:24px}.about-copy p{color:#b8b8b8;font-size:11.2px;line-height:1.9;max-width:70ch}.about-footnote{display:flex;align-items:center;gap:16px;margin-top:27.2px;border-top:0.8px solid var(--line);padding-top:20px}.small-stamp{width:49.6px;flex-shrink:0;transform:rotate(-8deg)}.about-footnote p{font-size:9.6px;line-height:1.9;margin:0}.about-footnote p span{color:var(--muted);font-size:8.8px}.service{border-top:0.8px solid var(--line)}.service:last-child{border-bottom:0.8px solid var(--line)}.service .t-acc-head{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:67.2px;background:transparent;border:0;color:var(--text);text-align:left;font-family:Manrope,sans-serif;font-size:16px;letter-spacing:-.025em;gap:16px;padding:14.4px 0}.service .t-acc-head>span:first-child{display:flex;align-items:center;gap:12.8px}.service .service-mark{width:23.2px;display:grid;place-items:center;color:var(--muted)}.service .service-mark .icon{width:16.8px;height:16.8px}.service[data-open=true] .t-acc-head{color:var(--green)}.t-acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--acc-collapse) var(--acc-ease)}.t-acc[data-open=true] .t-acc-panel{grid-template-rows:1fr;transition:grid-template-rows var(--acc-expand) var(--acc-ease)}.t-acc-panel-inner{overflow:hidden;opacity:0;filter:blur(1.6px);transition:opacity var(--acc-collapse) var(--acc-ease),filter var(--acc-collapse) var(--acc-ease)}.t-acc[data-open=true] .t-acc-panel-inner{opacity:1;filter:blur(0);transition:opacity var(--acc-expand) var(--acc-ease),filter var(--acc-expand) var(--acc-ease)}.t-acc-chevron{display:inline-flex;transform:scaleY(1);transform-origin:center;transition:transform var(--acc-chevron) var(--acc-ease)}.t-acc-chevron path{vector-effect:non-scaling-stroke}.t-acc[data-open=true] .t-acc-chevron{transform:scaleY(-1)}.service-content{padding:0 0 20.8px 36px}.service-content p{color:var(--muted);font-size:10.4px;line-height:1.8;max-width:64ch;margin-bottom:12.8px}.service-content a{font-size:8.8px;display:inline-flex;align-items:center;gap:6.4px;color:var(--green);min-height:24px}.service-content a:hover{text-decoration:underline;text-underline-offset:4px}.service-content .icon{width:10.4px;height:10.4px}.tools-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:20.8px;align-items:center}.tools-layout h3{font-size:25.6px;margin-bottom:19.2px}.tools-layout p{font-size:9.6px;color:var(--muted);line-height:1.9}.tool-tags{display:flex;gap:5.6px;flex-wrap:wrap}.tool-tags span{font-size:8px;border:0.8px solid var(--line);border-radius:16px;padding:4.8px 9.6px;color:#b6b6b6}.interactive-figure{min-width:0}.interactive-figure>div{min-height:176px;aspect-ratio:5/4;--hairline-plate:#222831;--hairline-hi:#40c6af;--hairline-edge:#8b8b8b;--hairline-mid:#525252;--hairline-lo:#2b2b2b}.figure-hint{display:flex;align-items:center;justify-content:center;gap:6.4px;font-size:7.2px;color:var(--muted)}.figure-hint .icon{height:10.4px;width:10.4px}.contact-section{padding:32px 0 64px;border-top:0.8px solid var(--line)}.contact-section h2{font-size:clamp(41.6px,4.72vw,68.8px);line-height:1.04;margin-bottom:24px;letter-spacing:-.04em}.contact-section>p{font-size:11.2px;color:var(--muted);max-width:47ch;line-height:1.85;margin-bottom:21.6px}.contact-button{font-size:9.6px;padding:9.6px 17.6px}.contact-socials{display:flex;gap:12.8px 18.4px;flex-wrap:wrap;margin-top:36px}.contact-socials>a{display:flex;align-items:center;gap:5.6px;color:#bcbcbc;font-size:8.8px;min-height:32px}.contact-socials>a:hover{color:var(--green)}.contact-socials .icon{width:10.4px;height:10.4px}.footer{border-top:0.8px solid var(--line);padding:36px 0 28px}.footer-wordmark{font-family:Manrope,sans-serif;font-size:clamp(60px,9.36vw,141.6px);font-weight:800;line-height:1;letter-spacing:-.04em;display:block}.footer-wordmark>.accent{font-size:19.2px;vertical-align:top;display:inline-block;margin-top:11.2px;margin-left:4px}.footer>div{display:flex;justify-content:space-between;gap:16px;margin-top:28px;color:var(--muted);font-size:7.2px}.footer>div p{margin-bottom:0}.footer>div a{display:flex;align-items:center;gap:6.4px}.footer .icon{width:10.4px;height:10.4px}.footer-credit{font-size:7.2px;margin:8px 0 0;color:var(--muted)}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,16px);opacity:0;pointer-events:none;background:var(--text);color:var(--bg);padding:9.6px 18.4px;border-radius:24px;font-size:9.6px;z-index:90;transition:opacity 200ms,transform 200ms}.toast.visible{opacity:1;transform:translate(-50%,0)}
/* Standalone case studies */
.case-main{padding-top:46.4px}.case-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:8.8px;margin-bottom:44px}.back-link{display:flex;align-items:center;gap:7.2px;min-height:32px}.back-link:hover{color:var(--green)}.back-link .icon{width:12.8px;height:12.8px}.case-header h1{font-size:clamp(31.2px,3.72vw,54.4px);line-height:1.13;letter-spacing:-.04em;margin-bottom:16px}.case-title{font-size:16px;line-height:1.5;color:#c3c3c3;margin-bottom:22.4px}.case-overview{font-size:11.2px;color:var(--muted);line-height:1.85;margin-bottom:24px}.case-meta{display:grid;grid-template-columns:1fr 1fr;gap:18.4px 16px;padding:20px 0;border-top:0.8px solid var(--line);border-bottom:0.8px solid var(--line);margin-bottom:22.4px}.case-meta dt{font-size:8px;color:var(--muted);margin-bottom:4px}.case-meta dd{font-size:9.6px;margin:0}.case-external{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.case-external .button{font-size:8.8px;min-height:32px;padding:7.2px 14.4px}.case-external-note{font-size:8px;color:var(--muted);margin-top:-9.6px;margin-bottom:24px}.case-artwork{margin:0 0 21.6px}.artwork-zoom{padding:0;display:block;width:100%;background:#181818;border:0;position:relative;border-radius:9.6px;overflow:hidden;cursor:zoom-in}.artwork-zoom:active{transform:none}.artwork-zoom img{width:100%;height:auto;outline:0.8px solid #ffffff12;outline-offset:-0.8px}.zoom-affordance{position:absolute;right:9.6px;bottom:9.6px;display:flex;align-items:center;gap:4.8px;background:#101010dc;color:#f6f7fa;padding:4.8px 8px;border-radius:40px;font-size:7.2px;opacity:0;transition:opacity 150ms}.artwork-zoom:hover .zoom-affordance,.artwork-zoom:focus-visible .zoom-affordance{opacity:1}.zoom-affordance .icon{width:10.4px;height:10.4px}.case-artwork figcaption{font-size:7.2px;color:var(--muted);margin-top:5.6px}.case-thinking{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:36px 0 38.4px;padding-bottom:28px;border-bottom:0.8px solid var(--line)}.case-thinking h2{font-size:17.6px;margin-bottom:12px}.case-thinking p{font-size:9.6px;color:var(--muted);line-height:1.85}.case-navigation{display:flex;justify-content:space-between;align-items:center;gap:12.8px;padding:12px 0 36px}.case-navigation>a{display:flex;align-items:center;gap:10.4px;font-size:10.4px}.case-navigation>a:hover{color:var(--green)}.case-navigation small{display:block;font-size:7.2px;color:var(--muted);margin-bottom:2.4px}.case-footer{border-top:0.8px solid var(--line);padding:20.8px 0 28px;display:flex;align-items:center;justify-content:space-between;font-size:8px;color:var(--muted)}.case-footer .wordmark{font-size:14.4px;color:var(--text)}.source-note{font-size:7.2px;color:var(--muted);margin:28px 0 17.6px}.lightbox{width:min(76.8vw,1440px);max-width:76.8vw;height:min(92dvh,960px);max-height:92dvh;border:0;padding:0;background:#111;color:var(--text);border-radius:12.8px;overflow:hidden;box-shadow:0 20px 72px #0006}.lightbox::backdrop{background:#000e}.t-modal{transform-origin:center;transform:scale(var(--modal-scale));opacity:0;pointer-events:none;transition:transform var(--modal-open-dur) var(--modal-ease),opacity var(--modal-open-dur) var(--modal-ease);will-change:transform,opacity}.t-modal.is-open{transform:scale(1);opacity:1;pointer-events:auto}.t-modal.is-closing{transform:scale(var(--modal-scale-close));opacity:0;pointer-events:none;transition:transform var(--modal-close-dur) var(--modal-ease),opacity var(--modal-close-dur) var(--modal-ease)}.lightbox-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9.6px 14.4px;border-bottom:0.8px solid var(--line);font-size:9.6px;height:50.4px}.lightbox-toolbar{display:flex;align-items:center;gap:8px}.icon-button{height:32px;width:32px;display:grid;place-items:center;border:0.8px solid var(--line);background:#29323e;color:var(--text);border-radius:50%}.icon-button:hover{color:var(--green);border-color:var(--green)}.lightbox-stage{height:calc(100% - 50.4px);overflow:auto;display:grid;place-items:center;padding:16px;overscroll-behavior:contain}.lightbox-stage img{width:100%;height:100%;max-height:100%;object-fit:contain}.lightbox-stage.full-resolution{display:block}.lightbox-stage.full-resolution img{max-width:none;max-height:none;width:auto;height:auto;min-width:100%;object-fit:initial}.lightbox-page{color:var(--muted);font-size:8px;font-variant-numeric:tabular-nums}.case-mobile-title{display:none}
.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}
@media(min-width:1600px){.profile-card{left:32px;top:32px;bottom:32px}.main-column{padding-top:68px}.hero-top{margin-bottom:51.2px}.hero{padding-bottom:68px}.hero-bottom{padding-top:38.4px}}
@media(max-height:780px) and (min-width:1101px){.profile-card{padding:19.2px;top:14.4px;bottom:14.4px}.profile-art{margin:-32px -19.2px -25.6px;min-height:96px}.profile-art>.personal-stamp{max-width:184px}.profile-info{padding-top:14.4px}.profile-info h2{font-size:22.4px;margin-bottom:8px}.profile-info p{margin-bottom:11.2px;font-size:9.6px}.profile-bottom{padding-top:11.2px}.profile-location{margin-top:9.6px}}
@media(max-width:1100px){.profile-card{display:none}.main-column{margin-left:44px;width:calc(100% - 124px);max-width:680px;padding-top:80px}.mobile-header{display:flex;position:absolute;top:18.4px;left:44px;right:80px;align-items:center;justify-content:space-between}.hero-top{margin-bottom:36px}.hero h1{font-size:clamp(42.4px,5.2vw,60.8px)}.ribbon-scene{height:272px}.craft-seal{width:144px;height:144px}.case-main{padding-top:96px}.case-header h1{font-size:48px}.case-topbar{margin-bottom:28px}}
@media(max-width:700px){html{scroll-padding-top:20px}.mobile-header{left:17.6px;right:17.6px;top:17.6px}.mobile-header .wordmark{font-size:16.8px}.mobile-header .button{font-size:8.8px;min-height:31.2px}.main-column{margin-left:17.6px;width:calc(100% - 35.2px);padding-top:89.6px}.hero-top{margin-bottom:30.4px;gap:9.6px}.identity{gap:7.2px}.identity p{font-size:8px}.identity span:not(.mini-stamp){font-size:7.2px}.mini-stamp{width:26.4px}.local-time{font-size:6.4px}.hero h1{font-size:clamp(27.2px,6.64vw,45.6px);line-height:1.17;margin-left:0}.highlight{padding:0 8.8px 3.2px}.dark-highlight{padding-right:9.6px;padding-left:9.6px}.hero-description{font-size:9.6px;margin-top:18.4px}.ribbon-scene{height:196px;margin:9.6px -9.6px -4.8px}.craft-seal{width:104px;height:104px;top:39%}.hero-bottom{padding:16px 0 36px;gap:9.6px}.stat strong{font-size:28.8px}.stat strong>span{font-size:16px}.stat>span{font-size:7.2px}.hero{padding-bottom:43.2px}.clients-section{padding-bottom:60px}.client-wordmarks{gap:16px 18.4px;justify-content:flex-start;font-size:13.6px}.client-audi{font-size:18.4px}.client-wordmarks>span{flex:1 0 22%;text-align:center}.client-42{justify-content:center}.clients-section .section-line>span{font-size:7.2px}.section-line{gap:12px;margin-bottom:18.4px}.section-line h2{font-size:21.6px;line-height:1.25}.section-line .project-total{max-width:64px;white-space:normal;text-align:right;font-size:7.2px}.section-intro{font-size:14.4px;margin-bottom:18.4px}.work-section,.about-section,.services-section,.tools-section{padding-bottom:62.4px}.filters{gap:1.6px}.filter-button{font-size:8px;padding:6.4px 8px;min-height:32px}.filter-button>span{font-size:5.6px;margin-left:1.6px}.search-field{max-width:none;height:34.4px}.search-field input{height:32.8px;font-size:9.6px}.work-controls{gap:13.6px}.project-grid{gap:20.8px 10.4px}.project-image{aspect-ratio:1.25;border-radius:8px}.project-card-meta{gap:6.4px;margin-top:8px}.project-card h3{font-size:10.4px}.project-card-meta p{font-size:7.2px}.project-year{display:none}.project-card.featured .project-image{aspect-ratio:1.45}.project-card.featured h3{font-size:15.2px}.project-card.featured .project-card-meta p{font-size:8px}.project-card.featured .project-year{display:block;font-size:8px}.project-arrow{right:7.2px;bottom:7.2px;min-height:23.2px;min-width:23.2px}.project-arrow .icon{height:10.4px;width:10.4px}.project-card.featured .project-arrow{width:28.8px;height:28.8px}.about-copy h3{font-size:29.6px}.about-copy p{font-size:10.4px}.service .t-acc-head{font-size:14.4px;min-height:61.6px}.service-content{padding-left:0}.service-content p{font-size:9.6px}.service .t-acc-head>span:first-child{gap:9.6px}.tools-layout{grid-template-columns:1fr;gap:4px}.tools-layout h3{font-size:26.4px}.tools-layout h3 br:last-of-type{display:none}.tools-layout>div>p{max-width:45ch}.interactive-figure{max-width:264px;width:100%;margin:0 auto}.interactive-figure>div{min-height:188px}.contact-section{padding:24px 0 48px}.contact-section h2{font-size:49.6px}.contact-section>p{font-size:10.4px}.contact-socials{gap:8px 18.4px;margin-top:24px}.footer{padding-bottom:80px}.footer-wordmark{font-size:13.6vw}.footer-wordmark>.accent{font-size:12.8px;margin-top:6.4px}.footer>div{font-size:6.4px;margin-top:20px}.footer-credit{font-size:6.4px}.nav-rail{top:auto;bottom:11.2px;right:auto;left:50%;transform:translateX(-50%);flex-direction:row;padding:4px 6.4px;gap:4.8px;border-radius:80px;box-shadow:0 6.4px 24px #0007;background:#29323e}.nav-rail a{width:33.6px;height:33.6px}.nav-rail .icon{width:14.4px;height:14.4px}.nav-label{display:none}.case-main{padding-top:82.4px}.case-topbar{margin-bottom:21.6px}.case-header h1{font-size:36.8px;line-height:1.12}.case-title{font-size:14.4px}.case-overview{font-size:10.4px}.case-meta{gap:16px 12px}.case-meta dd{font-size:8.8px}.case-thinking{grid-template-columns:1fr;gap:16px;margin-top:24px}.case-thinking p{font-size:9.6px}.case-artwork{margin-bottom:16.8px}.artwork-zoom{border-radius:7.2px}.zoom-affordance{opacity:1;padding:4px 6.4px;font-size:6.4px;bottom:5.6px;right:5.6px}.case-navigation>a{font-size:8.8px;max-width:48%}.case-navigation .icon{width:12.8px;height:12.8px}.case-footer{padding-bottom:84px}.lightbox{width:80vw;max-width:80vw;height:100dvh;max-height:100dvh;border-radius:0}.lightbox-top{padding:9.6px;font-size:8.8px}.lightbox-top>span{max-width:64px;line-height:1.4}.lightbox-toolbar{gap:4px}.icon-button{width:28.8px;height:28.8px}.lightbox-stage{padding:6.4px}.toast{bottom:67.2px;width:max-content;max-width:72vw}}
@media(max-width:360px){.main-column{margin-left:14.4px;width:calc(100% - 28.8px)}.identity p{font-size:7.2px}.identity span:not(.mini-stamp){font-size:6.4px}.hero h1{font-size:24.8px}.nav-rail{gap:1.6px}.project-card h3{font-size:9.6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.t-modal{transition:none!important}.t-acc-panel,.t-acc-panel-inner,.t-acc-chevron{transition:none!important}}

.art-caption{z-index:3}

.brand-dot{display:inline-block;width:4px;height:4px;background:var(--green);border-radius:50%;vertical-align:top;margin-top:6.4px;margin-left:3.2px}.footer-wordmark>.brand-dot{width:9.6px;height:9.6px;margin-top:16px;margin-left:6.4px}@media(max-width:700px){.footer-wordmark>.brand-dot{width:5.6px;height:5.6px;margin-top:8px}}

.interactive-figure{overflow:hidden}
@media(max-width:700px){.filter-button{min-height:35.2px}.nav-rail a{min-width:35.2px;min-height:35.2px}}

/* identity.css */
/* MONGY, revision 3: black, the owner's lemon/teal palette, and one functional folder scene. */
:root{
  --bg:#101010;--surface:#171717;--raised:#202020;--text:#f6f7f5;--muted:#a8aaa6;--line:#343634;
  --accent:#e4e92d;--teal:#28b49b;--green:var(--accent);--green-ink:#171a08;
  --aside-width:clamp(224px,20vw,272px);--main-left:calc(var(--aside-width) + clamp(48px,6.4vw,100px) + 19.2px);
  --hairline-plate:#101010;--hairline-hi:#e4e92d;--hairline-edge:#b5b9b3;--hairline-mid:#70756e;--hairline-lo:#383d37;
}
html{scroll-behavior:auto;scroll-snap-type:none;scrollbar-color:#4c5047 var(--bg)}
body{background:var(--bg)}
.main-column{max-width:800px;padding-top:44px}
a,input{caret-color:var(--accent)}
.button:hover{background:#f0f36b}
.button.secondary:hover{background:#202217;border-color:var(--accent);color:var(--accent)}
.text-link{display:inline-flex;align-items:center;gap:7.2px;min-height:35.2px;color:var(--teal);font-size:9.6px}
.text-link:hover{text-decoration:underline;text-underline-offset:4px}
.text-link .icon{width:12px;height:12px}
.teal-text{color:var(--teal)}
.brand-identity{display:inline-flex;align-items:center;gap:9.6px}
.brand-symbol{width:39.2px;height:39.2px;flex:none;border-radius:50%;object-fit:cover}
.brand-name{font-family:Manrope,sans-serif;font-size:15.2px;font-weight:650;letter-spacing:-.035em}
.card-top>.wordmark{display:block;max-width:80%}
.profile-card{background:var(--bg);border:0.8px solid #30322e;border-radius:14.4px;box-shadow:none;padding:21.6px}
.profile-info{background:var(--bg);padding-top:12px}
.profile-info h2{font-size:clamp(20px,1.72vw,26.4px);line-height:1.18;margin-bottom:12.8px}
.profile-info p{font-size:9.6px;color:var(--muted);max-width:none}
.profile-note{flex:1;display:flex;align-items:center;padding:24px 0}
.profile-note p{font-family:Manrope,sans-serif;font-size:clamp(16.8px,1.6vw,22.4px);line-height:1.5;letter-spacing:-.025em;color:#a7aaa2;margin:0;max-width:16ch}
.profile-note p span{color:var(--text)}
.profile-bottom{gap:9.6px}
.profile-bottom .button{font-size:8.8px;padding:7.2px 12px}
.pdf-link{font-size:8px}
.profile-location{font-size:6.4px;letter-spacing:.025em;color:var(--muted);line-height:1.6}
.status-dot{background:var(--teal)}
.profile-socials a{background:#1d1f1b;color:#b3b5af}
.profile-socials a:hover{background:#29301d;color:var(--accent)}
.navigation-dock{position:fixed;right:17.6px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:10.4px;z-index:40}
.navigation-dock .nav-rail{position:relative;inset:auto;transform:none;padding:8px 4.8px;gap:3.2px;background:#1b1c1a;border-color:#353832;box-shadow:none}
.navigation-dock .nav-rail a:hover,.navigation-dock .nav-rail a[aria-current]{color:var(--accent);background:#30331a}
.back-to-top{width:36px;height:36px;border:0.8px solid #353832;border-radius:50%;display:grid;place-items:center;background:#1b1c1a;color:#b7bbb1;position:relative;transition:color 150ms,background-color 150ms,transform 250ms var(--ease)}
.back-to-top:hover{color:var(--accent);background:#30331a;transform:translateY(-2.4px)}
.back-to-top .icon{width:13.6px;height:13.6px}
.back-to-top:hover .nav-label,.back-to-top:focus-visible .nav-label{opacity:1;transform:none}
.nav-label{background:#30332c}
.reading-progress{position:fixed;top:0;left:0;width:100%;height:1.6px;background:var(--teal);transform:scaleX(var(--reading-progress,0));transform-origin:left;z-index:100;pointer-events:none}
.hero{padding-bottom:57.6px}
.hero-top{margin-bottom:48px;align-items:center}
.identity{display:flex;gap:9.6px}
.identity-symbol{width:34.4px;height:34.4px;border-radius:50%;object-fit:cover;flex:none}
.identity p{font-size:9.6px;color:var(--text);font-weight:400;margin-bottom:2.4px}
.identity span{font-size:8px;color:var(--muted)}
.hero-top .identity p,.hero-top .identity span{line-height:1}
.hero-top .identity>div>span{display:block}
.hero h1{font-size:clamp(35.2px,4.04vw,61.6px);line-height:1.14;letter-spacing:-.04em;font-weight:400;margin:0}
.hero-line{display:block;overflow:hidden;padding-bottom:.11em;margin-bottom:-.11em}
.hero-line>span{display:block;white-space:nowrap}
.hero h1 .highlight{font-style:normal;line-height:1.08;padding:0 12.8px 4px;border-radius:64px;background:var(--accent);color:#101010}
.hero h1 .dark-highlight{background:#252622;color:var(--teal)}
.hero-intro{display:flex;align-items:center;justify-content:space-between;gap:17.6px;margin-top:22.4px}
.hero-intro>p{font-size:10.4px;color:var(--muted);line-height:1.9;max-width:43ch;margin:0}
.hero-work-link{font-size:8.8px;display:inline-flex;align-items:center;gap:10.4px;white-space:nowrap}
.hero-work-link>span{width:34.4px;height:34.4px;background:var(--teal);color:#09231c;border-radius:50%;display:grid;place-items:center;transition:transform 250ms var(--ease)}
.hero-work-link:hover>span{transform:rotate(45deg)}
.hero-bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25.6px 17.6px;border-top:0.8px solid var(--line);padding:24px 0 28px;margin-top:36px}
.stat{gap:6.4px}
.stat strong{font-size:32px;line-height:1.1}
.stat strong>.count{font:inherit;color:var(--text);margin:0}
.stat strong>em{font-style:normal;color:var(--teal);font-size:20px;margin-left:2.4px}
.stat>span{font-size:8px;line-height:1.7;color:var(--muted)}
.clients-section .section-line h2{font-size:20.8px}
.client-motion{position:relative;overflow:hidden;margin:0 -8px;padding:3.2px 8px 28px;mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
.logo-marquee{overflow:hidden;margin-bottom:12.8px}
.logo-track{display:flex;width:max-content;animation:client-drift 70s linear infinite;will-change:transform}
.logo-marquee.reverse .logo-track{animation-direction:reverse;animation-duration:80s}
.logo-set{display:flex;align-items:center;gap:32px;padding-right:32px}
.client-logo{width:89.6px;height:62.4px;display:grid;place-items:center;flex:none}
.client-logo img{width:100%;height:42.4px;object-fit:contain}
.client-motion:hover .logo-track,.client-motion:focus-within .logo-track,.client-motion.is-paused .logo-track,.client-motion.is-offscreen .logo-track{animation-play-state:paused}
.logo-motion-control{position:absolute;bottom:0;right:12px;border:0;background:transparent;color:var(--muted);font-size:8px;min-height:25.6px;padding:4px}
.logo-motion-control:hover{color:var(--accent)}
@keyframes client-drift{to{transform:translateX(-50%)}}
.work-section,.about-section,.services-section,.tools-section,.experience-section{padding-bottom:92px;scroll-margin-top:28px}
.section-line h2{font-size:clamp(21.6px,2.24vw,30.4px)}
.filters{gap:6.4px}
.filter-button{border:0.8px solid #3b3f35;border-radius:5.6px;font-size:8px;padding:8px 9.6px;background:#171914}
.filter-button:hover{border-color:var(--teal);color:var(--text)}
.filter-button[aria-pressed=true]{border-color:var(--teal);color:#c6f4e9;background:#19362e}
.search-field{max-width:224px;border-radius:6.4px;border-color:#3b3f35}
.search-field input{font-size:8.8px;caret-color:var(--accent)}
.search-field input::placeholder{color:#a8aaa6}
.project-card{transform-origin:50% 20%}
.project-image{background:var(--surface);transform-origin:50% 70%;transition:scale 400ms var(--ease)}
.project-image::after{content:'';position:absolute;inset:0;border:0.8px solid #ffffff12;border-radius:inherit;pointer-events:none}
.project-card:hover .project-image{scale:1.008}
.project-card.is-revealing{pointer-events:none}
.load-more-wrap .button{border-radius:7.2px;padding:9.6px 20px}
.about-copy h3{font-size:clamp(28px,2.96vw,42.4px);line-height:1.17;font-weight:400}
.about-copy p{color:#c2c5bd;font-size:11.2px;line-height:1.95}
.discipline-lab{display:grid;grid-template-columns:.9fr 1.1fr;gap:33.6px;align-items:center;margin-top:27.2px;border-top:0.8px solid var(--line);padding-top:20px}
.about-insight{padding:16px 0}
.about-insight>p{font-size:8.8px;color:var(--teal);margin-bottom:12px}
.about-insight h4{font-size:24px;line-height:1.35;font-weight:400;max-width:18ch;min-height:100px;letter-spacing:-.03em}
.about-insight>.text-link{margin-top:9.6px}
.about-choices{border-bottom:0.8px solid var(--line)}
.about-choice{min-height:45.6px;display:flex;justify-content:space-between;align-items:center;gap:9.6px;border:0;border-top:0.8px solid var(--line);width:100%;background:transparent;color:#c7cabf;text-align:left;font-family:Manrope,sans-serif;font-size:11.2px;letter-spacing:-.02em;padding:9.6px 0;transition:color 180ms,padding 280ms var(--ease),background-color 180ms}
.about-choice>.icon{width:12.8px;height:12.8px;opacity:.4;transition:opacity 180ms,transform 280ms var(--ease)}
.about-choice:hover,.about-choice[aria-pressed=true]{color:var(--accent);padding-left:8px;background:#e4e92d05}
.about-choice:hover>.icon,.about-choice[aria-pressed=true]>.icon{opacity:1;transform:rotate(45deg)}
.about-footnote{justify-content:space-between;gap:19.2px}
.about-footnote>p{font-size:8.8px;line-height:1.8}
.about-footnote>p>span{font-size:8px}
.timeline{position:relative;padding-left:24px}
.timeline-track{position:absolute;left:3.2px;top:9.6px;bottom:24px;width:0.8px;background:#444a3c;overflow:hidden}
.timeline-track>span{display:block;width:100%;height:100%;background:var(--teal);transform-origin:top}
.timeline-entry{position:relative;padding:2.4px 0 22.4px;margin-bottom:5.6px;border-bottom:0.8px solid #34363480;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3.2px 12px;align-items:start}
.timeline-dot{position:absolute;left:-24px;top:8.8px;width:7.2px;height:7.2px;border:0.8px solid #7e8775;border-radius:50%;background:var(--bg);transform:translateX(0.4px)}
.timeline-entry.current .timeline-dot{background:var(--teal);border-color:var(--teal)}
.experience-date{font-size:8px;color:var(--muted);grid-column:2;grid-row:1;line-height:1.8;font-variant-numeric:tabular-nums;white-space:nowrap;padding-top:2.4px}
.timeline-entry h3{font-size:16px;line-height:1.4;letter-spacing:-.025em;grid-column:1;grid-row:1}
.timeline-entry>p{font-size:8.8px;color:var(--muted);margin:1.6px 0 0;grid-column:1;grid-row:2}
.current-role{font-size:7.2px;color:var(--teal);grid-column:2;grid-row:2;text-align:right}
.service .t-acc-head{color:var(--text);transition:color 180ms,padding 280ms var(--ease)}
.service .t-acc-head:hover{padding-left:6.4px;color:var(--accent)}
.service-content p{color:var(--muted)}
.craft-layout{display:grid;grid-template-columns:1fr 1.16fr;align-items:center;gap:27.2px}
.craft-copy h3{font-size:28px;line-height:1.3;margin:0 0 17.6px}
.craft-copy>p{font-size:9.6px;line-height:1.95;color:var(--muted);max-width:38ch;margin-bottom:17.6px}
.craft-categories{border-bottom:0.8px solid var(--line)}
.craft-category{min-height:34.4px;display:grid;grid-template-columns:1fr auto 12px;gap:8px;align-items:center;border-top:0.8px solid var(--line);font-size:9.6px;transition:color 160ms,padding 250ms var(--ease);padding:7.2px 0}
.craft-category small{font-size:7.2px;color:var(--muted)}
.craft-category .icon{width:10.4px;height:10.4px;opacity:.45}
.craft-category:hover,.craft-category.is-selected{color:var(--accent);padding-left:5.6px}
.craft-category:hover .icon{opacity:1}
.craft-browser{min-width:0}
.craft-browser>.line-figure{width:100%;height:272px;min-height:0;cursor:pointer;--hairline-plate:#101010}
.craft-preview{display:flex;align-items:center;justify-content:space-between;gap:12.8px;border-top:0.8px solid var(--line);padding:14.4px 0 0}
.craft-preview h4{font-size:16px;line-height:1.3;letter-spacing:-.025em}
.craft-preview p{font-size:8.8px;color:var(--muted);margin:4px 0 0}
.craft-preview .text-link{white-space:nowrap;font-size:8.8px;color:var(--accent)}
#craft-instructions{font-size:7.2px;color:var(--muted);line-height:1.8;margin:12px 0 0}
.contact-section{padding-top:40px}
.contact-section h2{font-size:clamp(38.4px,4.4vw,64px);line-height:1.09}
.contact-section>p{color:var(--muted);font-size:11.2px}
.email-link{display:flex;align-items:center;gap:12px;width:fit-content;margin:16px 0 21.6px;font-family:Manrope,sans-serif;font-size:clamp(13.6px,1.92vw,25.6px);letter-spacing:-.03em;color:var(--teal);word-break:break-word}
.email-link .icon{width:20px;height:20px;flex:none}
.email-link:hover{text-decoration:underline;text-underline-offset:6.4px}
.contact-actions{display:flex;align-items:center;gap:9.6px;flex-wrap:wrap}
.contact-socials>a,.case-overview,.case-thinking p{color:#c2c5bd}
.footer{overflow:hidden}
.footer-wordmark{letter-spacing:-.04em;font-size:clamp(61.6px,10.24vw,152px)}
.footer>div{color:var(--muted)}
.case-footer .wordmark{max-width:120px}
.lightbox{background:var(--surface)}
.lightbox-top{border-color:var(--line)}
.icon-button{background:var(--raised)}
@media(min-width:1600px){.main-column{padding-top:60px}.hero-top{margin-bottom:52px}.hero h1{font-size:63.2px}.craft-browser>.line-figure{height:320px}}
@media(max-height:780px) and (min-width:1101px){.profile-card{padding:18.4px}.profile-note{padding:16px 0}.profile-note p{font-size:16.8px}.profile-info h2{font-size:20px}.profile-info p{font-size:8.8px}.profile-location{margin-top:10.4px}.profile-bottom{padding-top:10.4px}.brand-symbol{width:33.6px;height:33.6px}.brand-name{font-size:13.6px}}
@media(max-width:1100px){.main-column{margin-left:38.4px;width:calc(100% - 117.6px);padding-top:100px}.mobile-header{left:38.4px;right:79.2px}.mobile-header>.wordmark{display:block}.hero-top{margin-bottom:38.4px}.hero h1{font-size:clamp(34.4px,4.96vw,60.8px)}.case-main{padding-top:100px}.navigation-dock{right:14.4px}.craft-layout{gap:19.2px}.craft-copy h3{font-size:24px}.craft-browser>.line-figure{height:240px}}
@media(max-width:700px){
 .main-column{margin-left:17.6px;width:calc(100% - 35.2px);padding-top:99.2px}.mobile-header{left:17.6px;right:17.6px;top:20px}.brand-symbol{width:32px;height:32px}.brand-name{font-size:13.6px}.brand-identity{gap:7.2px}.mobile-header>.button{min-height:32px;font-size:8.8px}
 .hero-top{margin-bottom:30.4px;gap:12px}.identity-symbol{display:none}.identity p{font-size:8.8px}.identity span{font-size:7.2px}.local-time{font-size:6.4px}.hero h1{font-size:clamp(24px,6.72vw,42.4px);line-height:1.19}.hero h1 .highlight{padding:0 8px 2.4px}.hero-intro{gap:12px;margin-top:19.2px;align-items:center}.hero-intro>p{font-size:9.6px;max-width:28ch}.hero-work-link{font-size:0;gap:0}.hero-work-link>span{width:32px;height:32px}.hero-bottom{gap:20px 9.6px;margin-top:25.6px;padding:20px 0 24px}.stat strong{font-size:25.6px}.stat strong>em{font-size:16.8px}.stat>span{font-size:7.2px;line-height:1.7}.hero{padding-bottom:48px}
 .clients-section{padding-bottom:60px}.clients-section .section-line h2{font-size:18.4px}.clients-section .section-line>span{font-size:7.2px;max-width:88px;white-space:normal;text-align:right;line-height:1.6}.logo-set{gap:20px;padding-right:20px}.client-logo{width:75.2px;height:57.6px}.client-logo img{height:36.8px}.client-motion{margin-left:-4.8px;margin-right:-4.8px}.logo-motion-control{font-size:7.2px}
 .section-line h2{font-size:22.4px}.section-intro{font-size:13.6px}.work-section,.about-section,.services-section,.tools-section,.experience-section{padding-bottom:64px}.filters{gap:7.2px 4.8px}.filter-button{font-size:8px;min-height:35.2px;padding:7.2px 8px}.search-field{max-width:none}.search-field input{font-size:9.6px}.project-card.featured .project-image{aspect-ratio:1.45}.project-card h3{font-size:11.2px}.project-card-meta p{font-size:8px}
 .about-copy h3{font-size:28px}.about-copy p{font-size:10.4px;line-height:1.95}.discipline-lab{grid-template-columns:1fr;gap:16px;margin-top:20px;padding-top:4px}.about-insight{padding:14.4px 0 0}.about-insight h4{font-size:21.6px;min-height:0;max-width:24ch}.about-insight>p{font-size:8.8px;margin-bottom:8px}.about-insight>.text-link{margin-top:8px}.about-choices{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;border-bottom:0}.about-choice{font-size:9.6px;line-height:1.5;min-height:50.4px;gap:6.4px}.about-choice>.icon{width:10.4px;height:10.4px}.about-choice:hover,.about-choice[aria-pressed=true]{padding-left:4px}.about-footnote{align-items:flex-start;flex-direction:column;gap:8px}.about-footnote p{font-size:8.8px}
 .experience-section .section-line{gap:10.4px}.experience-section .section-line>.text-link{font-size:8px;gap:4.8px;white-space:nowrap}.timeline{padding-left:20px}.timeline-entry{display:block;padding-bottom:18.4px;margin-bottom:14.4px}.timeline-dot{left:-20px;top:8px}.experience-date{font-size:8px;padding:0;margin-bottom:5.6px}.timeline-entry h3{font-size:15.2px;line-height:1.4}.timeline-entry>p{font-size:9.6px;margin-top:4.8px}.current-role{display:inline-block;text-align:left;margin-top:6.4px}
 .craft-layout{grid-template-columns:1fr;gap:8px}.craft-copy h3{font-size:23.2px;line-height:1.35;margin-bottom:13.6px;max-width:21ch}.craft-copy h3 br{display:none}.craft-copy h3 br::after{content:' '}.craft-copy>p{font-size:9.6px;max-width:44ch;margin-bottom:16px}.craft-categories{display:grid;grid-template-columns:1fr 1fr;gap:0 14.4px;border-bottom:0}.craft-category{grid-template-columns:1fr 9.6px;gap:3.2px 6.4px;min-height:45.6px;font-size:9.6px;line-height:1.4}.craft-category small{grid-column:1;font-size:7.2px}.craft-category .icon{grid-column:2;grid-row:1/3}.craft-browser>.line-figure{height:216px}.craft-preview h4{font-size:16.8px}.craft-preview p{font-size:8.8px}#craft-instructions{font-size:8px;line-height:1.8}
 .contact-section h2{font-size:36.8px}.contact-section>p{font-size:10.4px}.email-link{font-size:clamp(13.6px,4.08vw,20px);gap:8px}.email-link .icon{width:15.2px;height:15.2px}.contact-actions .button{font-size:8.8px;gap:8px;padding:8.8px 13.6px}
 .navigation-dock{top:auto;bottom:11.2px;left:50%;right:auto;transform:translateX(-50%);display:block;width:max-content;max-width:calc(100% - 16px)}.navigation-dock .nav-rail{inset:auto;transform:none;flex-direction:row;padding:4px 5.6px;gap:1.6px;box-shadow:0 4.8px 20px #0006;background:#1b1c1a}.navigation-dock .nav-rail a{width:30.4px;height:33.6px;min-width:30.4px;min-height:33.6px}.navigation-dock .nav-rail .icon{width:12.8px;height:12.8px}.back-to-top{position:fixed;right:0;bottom:54.4px;width:30.4px;height:30.4px;background:#1b1c1a}.back-to-top .nav-label{display:none}.navigation-dock .back-to-top{opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity 200ms,transform 250ms var(--ease)}.navigation-dock .back-to-top.is-needed{opacity:1;pointer-events:auto;transform:none}.footer-wordmark{font-size:13.6vw}.case-main{padding-top:99.2px}.reading-progress{height:1.6px}
}
@media(max-width:360px){.main-column{margin-left:14.4px;width:calc(100% - 28.8px)}.mobile-header{left:14.4px;right:14.4px}.brand-symbol{width:28px;height:28px}.brand-name{font-size:12.8px}.hero h1{font-size:23.2px}.hero h1 .highlight{padding:0 6.4px 2.4px}.hero-top{gap:8px}.identity p{font-size:8px}.hero-intro>p{font-size:8.8px}.stat strong{font-size:23.2px}.stat>span{font-size:6.4px}.navigation-dock .nav-rail a{width:28.8px;min-width:28.8px}.about-copy h3{font-size:24.8px}.contact-section h2{font-size:32px}.email-link{font-size:13.6px}.craft-preview h4{font-size:14.4px}}
@media(prefers-reduced-motion:reduce){.logo-track{animation:none!important;transform:none!important}.reading-progress{transition:none}.hero-line>span{transform:none!important;opacity:1!important}.timeline-track>span{transform:none!important}.logo-marquee{overflow:auto}.logo-set[aria-hidden=true]{display:none}.logo-motion-control{display:none}}
/* Keep the mobile top control beside the rail, clear of the folder's open action. */
@media(max-width:700px){
 .navigation-dock{display:flex;flex-direction:row;align-items:center;gap:5.6px}
 .navigation-dock .back-to-top{position:relative;inset:auto;width:27.2px;height:27.2px;flex:none;display:none;transform:none}
 .navigation-dock .back-to-top.is-needed{display:grid}
}
@media(max-width:360px){
 .navigation-dock{gap:4.8px}
 .navigation-dock .nav-rail a{width:24.8px;min-width:24.8px}
 .navigation-dock .back-to-top{width:25.6px;height:25.6px}
}

/* experience.css */
/* Revision 4 extends the approved identity: visitor controls and an immersive project viewer. */
:root{--action:var(--accent);--copy:#c2c5bd;--dock:#1b1c1a;--selected:#19362e;--selected-text:#c6f4e9;--subtle:#252622;color-scheme:dark}
:root[data-theme=light]{
 --bg:#f5f4ec;--surface:#eeeee5;--raised:#e3e5da;--text:#18231f;--muted:#58615b;--line:#c9cfc2;
 --accent:#d5db20;--teal:#087966;--green:var(--accent);--green-ink:#171a08;--action:#087966;--copy:#3e4d45;
 --dock:#eeeee5;--selected:#d9e9df;--selected-text:#175d4d;--subtle:#e3e5da;
 --hairline-plate:#f5f4ec;--hairline-hi:#087966;--hairline-edge:#354a40;--hairline-mid:#738576;--hairline-lo:#b5c0b0;
 color-scheme:light;
}
html{scrollbar-gutter:stable;scrollbar-color:var(--muted) var(--bg)}
body{transition:background-color 220ms,color 180ms}
.accent{color:var(--action)}
.profile-card{border-color:var(--line)}
.profile-note p,.filter-button,.search-field,.work-results-bar p,.about-footnote>p,.contact-socials>a{color:var(--muted)}
.quiet-note{color:var(--muted)}
.section-intro{color:var(--copy)}
.navigation-dock .nav-rail a{color:var(--muted)}
.service[data-open=true] .t-acc-head{color:var(--action)}
.profile-socials a,.navigation-dock .nav-rail,.back-to-top,.dock-button{background:var(--dock);border-color:var(--line);color:var(--muted)}
.profile-socials a:hover,.navigation-dock .nav-rail a:hover,.navigation-dock .nav-rail a[aria-current],.back-to-top:hover,.dock-button:hover{background:var(--selected);color:var(--action)}
.nav-label{background:var(--raised);color:var(--text);white-space:nowrap}
.profile-note p span{color:var(--text)}
.hero h1 .dark-highlight{background:var(--subtle)}
.filter-button{background:var(--surface);border-color:var(--line)}
.filter-button[aria-pressed=true]{background:var(--selected);color:var(--selected-text);border-color:var(--teal)}
.filter-button:hover{color:var(--text)}
.search-field,.search-field input::placeholder{color:var(--muted)}
.search-field{border-color:var(--line)}
.about-copy p,.case-overview,.case-thinking p{color:var(--copy)}
.about-choice{color:var(--copy)}
.about-choice:hover,.about-choice[aria-pressed=true],.craft-category:hover,.craft-category.is-selected,.craft-preview .text-link{color:var(--action)}
.timeline-track{background:var(--line)}
.timeline-entry{border-color:var(--line)}
.service-content a,.text-button,.source-note a,.case-navigation>a:hover{color:var(--action)}
.service .t-acc-head:hover{color:var(--action)}
.craft-browser>.line-figure{--hairline-plate:var(--bg)}
[data-theme=light] .country-stamp{filter:brightness(0) saturate(100%) opacity(.87)}
[data-theme=light] .button.secondary:hover{background:var(--selected);color:var(--action);border-color:var(--action)}
[data-theme=light] .button:hover{background:#e0e635}
[data-theme=light] .hero h1 .highlight{color:#171a08}
[data-theme=light] .hero h1 .dark-highlight{color:var(--teal)}
[data-theme=light] .project-image::after{border-color:#18231f10}
[data-theme=light] .client-logo img{filter:brightness(.5) saturate(.8)}
[data-theme=light] .artwork-zoom{background:var(--raised)}
[data-theme=light] .profile-bottom .pdf-link{color:var(--muted)}
[data-theme=light] .hero-work-link>span{color:#fff}
[data-theme=light] :focus-visible{outline-color:var(--action)}
[data-theme=light] input{caret-color:var(--action)}

/* The original, static country stamp sits in the hero's open top-right corner. */
.hero-heading-row{position:relative}
.country-stamp{position:absolute;top:-16px;right:0;width:clamp(67.2px,6.88vw,104px);height:auto;pointer-events:none}
.hero h1{font-size:clamp(35.2px,3.96vw,61.6px)}

/* All six source metrics, in one seamless row with independent pause control. */
.hero-bottom.stats-motion{display:block;margin-top:33.6px;padding:20px 0 19.2px;position:relative;overflow:hidden}
.stats-marquee{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent)}
.stats-track{display:flex;width:max-content;animation:client-drift 42s linear infinite;direction:ltr;will-change:transform}
.stats-set{display:flex;align-items:center;flex:none;gap:27.2px;padding-right:27.2px}
.stats-set .stat{display:flex;flex-direction:row;align-items:center;gap:9.6px;flex:none;min-width:116px;max-width:136px}
.stats-set .stat strong{font-size:30.4px;display:flex;align-items:baseline;font-weight:400;white-space:nowrap;font-variant-numeric:tabular-nums}
.stats-set .stat>span{max-width:68px;font-size:8px;line-height:1.6;color:var(--muted)}
.stats-motion.is-paused .stats-track,.stats-motion.is-offscreen .stats-track{animation-play-state:paused}
.stats-motion-control{float:right;min-height:25.6px;background:transparent;color:var(--muted);border:0;padding:5.6px 0;font-size:8px;margin-top:7.2px}
.stats-motion-control:hover{color:var(--action)}

/* Keep theme and language directly below the right navigation. */
.navigation-dock{gap:8.8px}
.dock-utilities{display:flex;flex-direction:column;align-items:center;gap:7.2px}
.dock-button{width:33.6px;height:33.6px;display:grid;place-items:center;padding:0;border:0.8px solid var(--line);border-radius:50%;position:relative}
.dock-button .icon{width:13.6px;height:13.6px}
.dock-button>span:not(.nav-label){display:grid;place-items:center}
.dock-button:hover .nav-label,.dock-button:focus-visible .nav-label{opacity:1;transform:none}
.dock-button.theme-toggle .theme-moon{display:none}
[data-theme=light] .theme-toggle .theme-sun{display:none}
[data-theme=light] .dock-button.theme-toggle .theme-moon{display:grid}
.language-mark{font-family:var(--font-ar);font-size:13.6px;line-height:1}
.dock-button[lang=ar],.dock-button [lang=ar]{font-family:var(--font-ar)}
html[lang=ar] .language-mark{font-family:Inter,sans-serif;font-size:8px}

.work-view-bar{display:flex;justify-content:space-between;align-items:center;gap:9.6px;margin:4px 0 5.6px;flex-wrap:wrap}
.view-controls{display:flex;gap:3.2px;border:0.8px solid var(--line);border-radius:7.2px;padding:3.2px;width:fit-content}
.view-button{display:flex;align-items:center;gap:6.4px;min-height:28.8px;padding:5.6px 8px;border:0;background:transparent;color:var(--muted);font-size:8px;border-radius:4px;white-space:nowrap}
.view-button .icon{width:12.8px;height:12.8px}
.view-button[aria-pressed=true]{background:var(--raised);color:var(--text)}
.view-button:hover{color:var(--action)}
.view-button:not([aria-pressed=true])>span{display:none}
.work-results-bar{margin-bottom:12px;gap:11.2px}
.open-hint{display:flex;align-items:center;gap:4.8px;color:var(--muted);font-size:7.2px;text-align:end}
.open-hint .icon{width:9.6px;height:9.6px}
.project-grid[data-view=compact]{grid-template-columns:repeat(3,minmax(0,1fr));gap:21.6px 12.8px}
.project-grid{overflow-anchor:none}
.project-grid[data-view=compact] .project-card.featured{grid-column:auto}
.project-grid[data-view=compact] .project-image{aspect-ratio:1.22}
.project-grid[data-view=compact] .project-card h3{font-size:11.2px}
.project-grid[data-view=compact] .project-card-meta p{font-size:8px}
.project-grid[data-view=compact] .project-year{display:none}
.project-grid[data-view=list]{grid-template-columns:1fr;gap:0}
.project-grid[data-view=list] .project-card{display:grid;grid-template-columns:144px 1fr;gap:22.4px;align-items:center;padding:18.4px 0;border-top:0.8px solid var(--line)}
.project-grid[data-view=list] .project-image{aspect-ratio:1.5}
.project-grid[data-view=list] .project-card-meta{margin-top:0;align-items:center;gap:14.4px}
.project-grid[data-view=list] .project-card h3{font-size:16px}
.project-grid[data-view=list] .project-card-meta p{font-size:8.8px;max-width:43ch}
.project-grid[data-view=list] .project-year{display:block;font-size:8.8px}
.project-grid[data-view=list] .project-arrow{width:24px;height:24px;min-width:24px;min-height:24px;right:7.2px;bottom:7.2px}
.project-grid[data-view=list] .project-arrow .icon{width:11.2px;height:11.2px}

/* Native modal: its own scrolling, focus boundary, artwork viewer and shareable URL. */
.project-dialog{padding:0;width:min(880px,73.6vw);max-width:73.6vw;height:92dvh;max-height:92dvh;overflow:hidden;border:0;border-radius:12.8px;background:var(--bg);color:var(--text);box-shadow:0 19.2px 72px #0008}
.project-dialog::backdrop{background:#000c}
.project-dialog-top{height:52.8px;display:flex;justify-content:space-between;align-items:center;gap:12.8px;padding:8px 19.2px;border-bottom:0.8px solid var(--line);background:var(--bg)}
.project-position{font-size:8.8px;color:var(--muted);font-variant-numeric:tabular-nums}
.project-dialog-tools{display:flex;align-items:center;gap:16px}
.project-dialog-tools .text-button{display:flex;align-items:center;gap:5.6px;font-size:8.8px;min-height:32px;color:var(--text)}
.project-dialog-tools .text-button .icon{width:12px;height:12px}
.project-link-field{position:absolute;z-index:2;top:48px;right:19.2px;width:min(336px,calc(100% - 38.4px));height:33.6px;padding:6.4px 9.6px;border:0.8px solid var(--teal);border-radius:5.6px;background:var(--raised);color:var(--text);font-size:8.8px;box-shadow:0 6.4px 20px #0003}
.project-content{height:calc(100% - 52.8px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:34.4px 36px 16px;outline:none}
.project-content .case-header{margin-bottom:28px}
.project-content .case-header>h2{font-size:clamp(28.8px,3.6vw,48px);line-height:1.15;max-width:18ch;outline:none;letter-spacing:-.035em}
.project-content .case-title{font-size:18.4px;margin-top:10.4px}
.case-title{color:var(--muted)}
.project-content .case-overview{font-size:11.2px;line-height:1.9;max-width:72ch;margin-top:17.6px}
.project-content .case-meta{margin-top:20.8px;padding-top:16px}
.project-content .case-meta dt{color:var(--muted)}
.project-content .case-meta dd{color:var(--text);font-size:9.6px}
.project-content .case-thinking{gap:32px}
.project-content .case-thinking p{font-size:10.4px;line-height:1.9}
.project-content .case-thinking h2{font-size:20px}
.project-step{display:flex;align-items:center;gap:10.4px;font-size:11.2px;max-width:46%;text-align:start;color:var(--text);background:transparent;border:0;padding:6.4px 0;min-height:40px}
.project-step:last-child{text-align:end}
.project-step small{display:block;font-size:8px;color:var(--muted);margin-bottom:3.2px}
.project-step:hover{color:var(--action)}
.lightbox-top{background:var(--surface)}
.lightbox .icon-button{color:var(--text)}
.icon-button{background:var(--raised)}
.project-content bdi{font-family:Manrope,Inter,sans-serif}

/* Arabic inherits the same artwork and identity, with real RTL typesetting. */
html[lang=ar] body,html[lang=ar] .about-choice{font-family:var(--font-ar);letter-spacing:0}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] h4{font-family:var(--font-ar-heading);letter-spacing:0}
html[lang=ar] body{direction:ltr}
html[lang=ar] .main-column,html[lang=ar] .profile-card,html[lang=ar] .mobile-header,html[lang=ar] .project-dialog,html[lang=ar] .lightbox{direction:rtl}
html[lang=ar] .profile-info p{font-size:9.6px;line-height:1.9}
html[lang=ar] .identity span{font-size:8.8px}
.stats-marquee,.client-motion{direction:ltr}
html[lang=ar] .hero h1{font-size:clamp(31.2px,3.52vw,52.8px);line-height:1.65;letter-spacing:0}
html[lang=ar] .hero-line{padding-bottom:.2em;margin-bottom:-.2em}
html[lang=ar] .hero h1 .highlight{padding:0 12.8px 4.8px;line-height:1.5}
html[lang=ar] .country-stamp{right:auto;left:0}
html[lang=ar] .profile-note p{font-family:var(--font-ar);font-size:18.4px;line-height:1.9;letter-spacing:0}
html[lang=ar] .profile-info h2{line-height:1.65}
html[lang=ar] .identity p{font-size:10.4px}
html[lang=ar] .stat>span{direction:rtl;text-align:right}
html[lang=ar] .stat strong{font-family:Manrope,sans-serif}
html[lang=ar] .hero-intro>p{max-width:45ch}
html[lang=ar] .about-choice,html[lang=ar] .craft-category,html[lang=ar] .project-step{text-align:right}
html[lang=ar] .about-choice:hover,html[lang=ar] .about-choice[aria-pressed=true]{padding-left:0;padding-right:8px}
html[lang=ar] .timeline{padding-left:0;padding-right:24px}
html[lang=ar] .timeline-track{left:auto;right:3.2px}
html[lang=ar] .timeline-dot{left:auto;right:-24px}
html[lang=ar] .experience-date,html[lang=ar] .current-role{text-align:left}
html[lang=ar] .filter-button>span{margin-left:0;margin-right:3.2px}
html[lang=ar] .project-content .case-header>h2{font-family:Manrope,sans-serif;letter-spacing:-.035em;text-align:start}
html[lang=ar] .brand-identity,html[lang=ar] .nav-rail,html[lang=ar] .dock-utilities,html[lang=ar] .footer-wordmark,html[lang=ar] .email-link{direction:ltr}
html[lang=ar] .about-copy h3,html[lang=ar] .contact-section h2{line-height:1.55}

@media(min-width:1600px){.hero h1{font-size:63.2px}.country-stamp{width:105.6px}}
@media(max-height:760px) and (min-width:701px){.navigation-dock .nav-rail{gap:0;padding:4.8px}.navigation-dock .nav-rail a{height:27.2px;min-height:27.2px}.dock-button,.back-to-top{width:28.8px;height:28.8px}.dock-utilities{gap:5.6px}.navigation-dock{gap:7.2px}}
@media(max-width:1100px){.hero h1{font-size:clamp(34.4px,4.88vw,60.8px)}.country-stamp{width:80px;top:-13.6px}}
@media(max-width:700px){
 .hero h1{font-size:clamp(24px,6.64vw,42.4px)}.country-stamp{width:49.6px;top:-12.8px;right:0}
 .hero-bottom.stats-motion{margin-top:24px;padding:16px 0 8px}.stats-set{gap:20px;padding-right:20px}.stats-set .stat{min-width:112px;gap:8px}.stats-set .stat strong{font-size:24.8px}.stats-set .stat>span{font-size:8px}.stats-motion-control{font-size:7.2px}
 .navigation-dock{display:flex;flex-direction:row;gap:4.8px;max-width:calc(100% - 14.4px);width:max-content;direction:ltr}
 .navigation-dock .nav-rail{padding:4px 4.8px;gap:1.6px}.navigation-dock .nav-rail a{width:24.8px;min-width:24.8px;height:32px;min-height:32px}
 .dock-utilities{flex-direction:row;gap:3.2px}.dock-button{width:24px;height:28.8px;flex:none}.dock-button .icon{width:12px;height:12px}.dock-button .nav-label{display:none}
 .navigation-dock .back-to-top{width:24px;height:28.8px;display:none}.navigation-dock .back-to-top.is-needed{display:grid}
 .language-mark{font-size:12px}
 .work-view-bar{gap:8px}.view-button{min-height:30.4px;padding:5.6px 7.2px;font-size:8px}.view-controls{gap:2.4px;padding:2.4px}
 .open-hint{display:none}.work-results-bar{margin-bottom:10.4px}
 .project-grid[data-view=compact]{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 10.4px}.project-grid[data-view=compact] .project-card h3{font-size:11.2px}.project-grid[data-view=compact] .project-card-meta p{font-size:8px}
 .project-grid[data-view=list] .project-card{grid-template-columns:80px 1fr;gap:12.8px;padding:13.6px 0}.project-grid[data-view=list] .project-card h3{font-size:12px}.project-grid[data-view=list] .project-card-meta p{font-size:8px}.project-grid[data-view=list] .project-year{display:none}.project-grid[data-view=list] .project-card-meta{gap:0}
 .project-grid[data-view=list] .project-arrow{display:none}
 .project-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border-radius:0}.project-dialog-top{height:49.6px;padding:8px 12px;gap:8px}.project-position{font-size:7.2px;max-width:45%;line-height:1.6}.project-dialog-tools{gap:9.6px}.project-dialog-tools .text-button{font-size:8px;gap:4px}.project-dialog-tools .text-button .icon{width:10.4px;height:10.4px}.project-dialog-top .icon-button{width:28.8px;height:28.8px}
 .project-content{height:calc(100% - 49.6px);padding:22.4px 15.2px 8px}.project-content .case-header>h2{font-size:28.8px;line-height:1.18}.project-content .case-title{font-size:15.2px;margin-top:8.8px}.project-content .case-overview{font-size:10.4px;line-height:1.85;margin-top:14.4px}.project-content .case-meta{gap:14.4px 9.6px}.project-content .case-meta dd{font-size:8.8px}.project-content .case-thinking{gap:18.4px}.project-content .case-thinking p{font-size:9.6px}.project-step{font-size:9.6px;gap:6.4px}.project-step .icon{width:12.8px;height:12.8px}
 html[lang=ar] .hero h1{font-size:clamp(23.2px,6.16vw,35.2px);line-height:1.65}html[lang=ar] .hero h1 .highlight{padding:0 8px 4px}html[lang=ar] .country-stamp{width:46.4px;top:-4px}html[lang=ar] .hero-intro>p{font-size:8.8px;max-width:32ch}html[lang=ar] .hero-top{gap:7.2px}html[lang=ar] .identity p{font-size:9.6px}
 html[lang=ar] .timeline{padding-right:20px}html[lang=ar] .timeline-dot{right:-20px}html[lang=ar] .experience-date{text-align:right}html[lang=ar] .current-role{text-align:right}
}
@media(max-width:360px){
 .hero h1{font-size:22.4px}.country-stamp{width:40.8px;top:-12px}
 .navigation-dock{gap:4px;max-width:calc(100% - 12.8px)}.navigation-dock .nav-rail a{width:19.2px;min-width:19.2px}.navigation-dock .nav-rail .icon{width:11.2px;height:11.2px}.dock-utilities{gap:3.2px}.dock-button,.navigation-dock .back-to-top{width:21.6px;height:27.2px}
 .project-grid[data-view=list] .project-card{grid-template-columns:68px 1fr;gap:10.4px}.project-grid[data-view=list] .project-card h3{font-size:11.2px}
 html[lang=ar] .hero h1{font-size:20.8px}html[lang=ar] .country-stamp{width:38.4px}
}
@media(prefers-reduced-motion:reduce){
 .stats-track{animation:none!important;transform:none!important}.stats-marquee{overflow-x:auto;mask-image:none}.stats-set[aria-hidden=true],.stats-set [data-stats-repeat]{display:none}.stats-motion-control{display:none}body{transition:none}
}

/* Revision 5: the owner's Zaatar family, real weight hierarchy, adjustable grid and discovery. */
:root{--font-ar:"IBM Plex Sans Arabic","Noto Arabic",Arial,sans-serif;--font-ar-heading:Zaatar,"IBM Plex Sans Arabic","Noto Arabic",sans-serif}
body{font-size:12px}h2,h3,h4{font-weight:600}
.hero h1{font-weight:400}.hero h1 .highlight{font-weight:600}
.profile-info h2{font-weight:600}.profile-note p{font-weight:500}.section-line h2{font-weight:600}
.about-copy h3,.craft-copy h3,.contact-section h2{font-weight:600}.about-insight h4{font-weight:500}
.filter-button,.text-link,.hero-work-link{font-weight:500}
.project-card h3{font-weight:600}.case-title{font-weight:500}
html[lang=ar] body{font-family:var(--font-ar);font-synthesis:none}
html[lang=ar] body{font-size:13.6px;line-height:1.8}
html[lang=ar] .hero h1{font-weight:900;font-size:clamp(32px,3.56vw,52px);line-height:1.48}
html[lang=ar] .hero h1 .highlight{font-weight:900;line-height:1.45;padding-bottom:1.6px}
html[lang=ar] .section-line h2{font-size:28.8px;font-weight:900;line-height:1.4}
html[lang=ar] .profile-note p{font-family:var(--font-ar);font-weight:700;font-size:22.4px;line-height:1.65}
html[lang=ar] .profile-info h2{font-weight:900;font-size:25.6px;line-height:1.45}
html[lang=ar] .profile-info p{font-size:12px;line-height:1.8}
html[lang=ar] .identity p{font-size:12.8px;font-weight:700}html[lang=ar] .identity span{font-size:10.4px}
html[lang=ar] .hero-intro>p{font-size:12.8px;line-height:1.75}
html[lang=ar] .about-copy h3,html[lang=ar] .craft-copy h3,html[lang=ar] .contact-section h2{font-weight:900;line-height:1.5}
html[lang=ar] .about-copy p,html[lang=ar] .contact-section>p{font-size:14.4px;line-height:1.9}
html[lang=ar] .about-insight h4{font-weight:700;font-size:27.2px}
html[lang=ar] .craft-copy>p,html[lang=ar] .service-content p{font-size:13.6px;line-height:1.8}
html[lang=ar] .craft-category{font-size:12.8px;font-weight:700}html[lang=ar] .craft-category small{font-size:10.4px;font-weight:400}
html[lang=ar] .filter-button,html[lang=ar] .text-link,html[lang=ar] .button{font-size:12px;font-weight:700}
html[lang=ar] .search-field input{font-size:12.8px}
html[lang=ar] .about-choice{font-size:13.6px;font-weight:700}
html[lang=ar] .stat>span{font-size:10.4px;line-height:1.6}
html[lang=ar] .timeline-entry h3{font-weight:700;font-size:20px}
html[lang=ar] .timeline-entry>p{font-size:11.2px}
html[lang=ar] .experience-date{font-size:10.4px}
html[lang=ar] .local-time{font-family:var(--font-ar);font-size:8px}
.density-control{width:min(100%,272px);padding:11.2px 0 7.2px}
.density-label{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:9.6px;margin-bottom:6.4px}
.density-label label{font-weight:600}.density-label output{color:var(--teal);font-variant-numeric:tabular-nums}
.density-control input{--density-progress:33.333%;appearance:none;display:block;width:100%;height:24px;margin:0;background:transparent;cursor:ew-resize;direction:ltr;border-radius:3.2px}
.density-control input::-webkit-slider-runnable-track{height:2.4px;border-radius:2.4px;background:linear-gradient(to right,var(--teal) var(--density-progress),var(--line) var(--density-progress))}
.density-control input::-moz-range-track{height:2.4px;background:var(--line);border-radius:2.4px}
.density-control input::-moz-range-progress{height:2.4px;background:var(--teal)}
.density-control input::-webkit-slider-thumb{appearance:none;width:14.4px;height:14.4px;border-radius:50%;background:var(--action);border:2.4px solid var(--bg);box-shadow:0 0 0 0.8px var(--action);margin-top:-6px}
.density-control input::-moz-range-thumb{width:11.2px;height:11.2px;border-radius:50%;background:var(--action);border:2.4px solid var(--bg)}
.density-scale{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-size:8px;margin-top:1.6px}
.project-grid{grid-template-columns:repeat(var(--project-columns,2),minmax(0,1fr));overflow-anchor:none;gap:25.6px 16px}
.project-grid .project-card.featured{grid-column:auto}
.project-grid .project-image,.project-grid .project-card.featured .project-image{aspect-ratio:1.5}
.project-grid .project-card h3,.project-grid .project-card.featured h3{font-size:16px;font-weight:600}
.project-grid .project-card-meta p,.project-grid .project-card.featured .project-card-meta p{font-size:9.6px;line-height:1.65}
.project-grid[data-columns="1"] .project-image{aspect-ratio:1.7}
.project-grid[data-columns="1"] .project-card h3{font-size:21.6px}
.project-grid[data-columns="3"] .project-card h3,.project-grid[data-columns="4"] .project-card h3{font-size:12.8px}
.project-grid[data-columns="3"] .project-card-meta p,.project-grid[data-columns="4"] .project-card-meta p{font-size:8.8px}
.project-grid[data-columns="3"] .project-year,.project-grid[data-columns="4"] .project-year{display:none}
.project-grid[data-columns="4"] .project-image{aspect-ratio:1.15}
.case-title-row{display:flex;direction:ltr;align-items:flex-start;justify-content:space-between;gap:19.2px}
.case-title-row>h1,.project-content .case-title-row>h2{font-size:clamp(27.2px,3.36vw,46.4px);line-height:1.12;font-weight:700;letter-spacing:-.035em;margin:0;min-width:0;max-width:19ch;outline:none;text-align:start}
.project-category{display:inline-flex;align-items:center;justify-content:center;gap:6.4px;max-width:144px;min-height:33.6px;flex:none;padding:8px 11.2px;border:0.8px solid var(--line);border-radius:7.2px;background:var(--surface);color:var(--action);font-size:9.6px;font-weight:600;line-height:1.5;text-align:center}
.project-category .icon{width:11.2px;height:11.2px}.project-category:hover{border-color:var(--action);background:var(--selected)}
.case-summary{display:grid;grid-template-columns:minmax(0,1fr) 76.8px;align-items:center;gap:27.2px;margin:19.2px 0 24px}
.case-summary .case-overview,.project-content .case-summary .case-overview{margin:0;font-size:12px;line-height:1.9;max-width:72ch}
.project-country-stamp{width:76.8px;height:76.8px;object-fit:contain;justify-self:end}
[data-theme=light] .project-country-stamp{filter:brightness(0) saturate(100%) opacity(.87)}
.project-content .case-title{font-size:19.2px;font-weight:500;margin:14.4px 0 0}
.related-projects{padding:30.4px 0 20px;border-top:0.8px solid var(--line);margin-top:24px}
.related-heading{display:flex;align-items:baseline;justify-content:space-between;gap:14.4px;margin-bottom:19.2px}
.related-heading h2,.related-heading h3{font-size:24px;font-weight:700;line-height:1.25}
.related-heading>span{font-size:9.6px;color:var(--muted)}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16.8px}
.related-card{min-width:0;display:block;border-radius:8px}
.related-image{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1.45;background:var(--surface)}
.related-image img{width:100%;height:100%;object-fit:cover;transition:transform 450ms var(--ease)}
.related-image>span{position:absolute;bottom:8px;right:8px;background:#101010d9;color:#fff;border-radius:50%;height:25.6px;width:25.6px;display:grid;place-items:center}
.related-image .icon{width:12px;height:12px}.related-card:hover img{transform:scale(1.04)}
.related-card h3,.related-card h4{font-family:Manrope,sans-serif;font-size:13.6px;font-weight:700;line-height:1.4;margin:10.4px 0 4px;letter-spacing:-.02em}
.related-card p{font-size:9.6px;line-height:1.6;color:var(--muted);margin:0}
html[lang=ar] .density-label{font-size:12.8px}html[lang=ar] .density-label label{font-weight:700}html[lang=ar] .density-scale{font-size:10.4px}
.density-scale{direction:ltr}
html[lang=ar] .section-intro{font-family:var(--font-ar);font-size:16px;line-height:1.8}
html[lang=ar] .service .t-acc-head{font-family:var(--font-ar-heading);font-weight:700;font-size:16.8px;letter-spacing:0}
html[lang=ar] .case-title-row>h1,html[lang=ar] .case-title-row>h2,html[lang=ar] .related-card h3,html[lang=ar] .related-card h4{font-family:Manrope,Inter,var(--font-ar);letter-spacing:-.02em}
html[lang=ar] .project-dialog-top .text-button,html[lang=ar] #project-position{font-size:11.2px}
html[lang=ar] .source-note,html[lang=ar] .case-artwork figcaption,html[lang=ar] .zoom-affordance{font-size:10.4px;line-height:1.8}
html[lang=ar] .project-category{font-family:var(--font-ar);font-weight:700;font-size:12.8px}
html[lang=ar] .case-title,html[lang=ar] .project-content .case-title{font-size:20.8px;font-weight:700;line-height:1.5}
html[lang=ar] .case-summary .case-overview,html[lang=ar] .project-content .case-summary .case-overview{font-size:15.2px;font-weight:400;line-height:1.85}
html[lang=ar] .project-content .case-thinking h2{font-family:var(--font-ar-heading);font-weight:900;font-size:24px}
html[lang=ar] .project-content .case-thinking p,html[lang=ar] .case-thinking p{font-size:14.4px;line-height:1.85}
html[lang=ar] .case-meta dt{font-size:11.2px}html[lang=ar] .case-meta dd,html[lang=ar] .project-content .case-meta dd{font-size:12.8px}
html[lang=ar] .related-heading h2,html[lang=ar] .related-heading h3{font-family:var(--font-ar-heading);font-weight:900;font-size:25.6px}
html[lang=ar] .related-heading>span,html[lang=ar] .related-card p{font-size:12px}
html[lang=ar] .project-grid .project-card-meta p{font-family:var(--font-ar);font-size:12px;line-height:1.5}
@media(max-width:1100px){html[lang=ar] .hero h1{font-size:clamp(30.4px,4.4vw,48px)}}
@media(max-width:700px){
 .density-control{width:100%;max-width:288px}.density-label{font-size:9.6px}
 .project-grid{gap:20px 10.4px}.project-grid .project-card h3,.project-grid .project-card.featured h3{font-size:12.8px}.project-grid .project-card-meta p,.project-grid .project-card.featured .project-card-meta p{font-size:8.8px}.project-grid .project-year{display:none}
 .project-grid[data-columns="1"] .project-card h3{font-size:18.4px}.project-grid[data-columns="1"] .project-year{display:block}
 .case-title-row{gap:11.2px}.case-title-row>h1,.project-content .case-title-row>h2{font-size:23.2px;line-height:1.17;letter-spacing:-.025em}
 .project-category{max-width:89.6px;padding:6.4px 8px;font-size:8px;gap:4px;min-height:30.4px}.project-category .icon{width:9.6px;height:9.6px}
 .project-content .case-title{font-size:15.2px;margin-top:12.8px}
 .case-summary{grid-template-columns:minmax(0,1fr) 48.8px;gap:14.4px;align-items:start;margin:16.8px 0 19.2px}
 .case-summary .case-overview,.project-content .case-summary .case-overview{font-size:10.4px;line-height:1.85}.project-country-stamp{width:48.8px;height:48.8px;margin-top:4px}
 .related-projects{padding-top:22.4px}.related-heading{display:block;margin-bottom:16px}.related-heading h2,.related-heading h3{font-size:20.8px}.related-heading>span{display:block;font-size:8.8px;margin-top:5.6px}
 .related-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17.6px 10.4px}.related-card h3,.related-card h4{font-size:12px;margin-top:8px}.related-card p{font-size:8.8px}
 html[lang=ar] .hero h1{font-size:clamp(24px,6.08vw,36px);line-height:1.6}html[lang=ar] .hero h1 .highlight{padding:0 7.2px 1.6px}
 html[lang=ar] .section-line h2{font-size:24px}html[lang=ar] .identity p{font-size:12px}html[lang=ar] .identity span{font-size:9.6px}
 html[lang=ar] .hero-intro>p{font-size:11.2px;line-height:1.7;max-width:30ch}
 html[lang=ar] .about-copy h3{font-size:28px}html[lang=ar] .about-copy p,html[lang=ar] .contact-section>p{font-size:13.6px}
 html[lang=ar] .craft-copy h3{font-size:24.8px}html[lang=ar] .craft-copy>p{font-size:12.8px}html[lang=ar] .about-choice{font-size:12px}html[lang=ar] .filter-button{font-size:11.2px}
 html[lang=ar] .project-category{font-size:11.2px}html[lang=ar] .case-title,html[lang=ar] .project-content .case-title{font-size:18.4px}
 html[lang=ar] .case-summary .case-overview,html[lang=ar] .project-content .case-summary .case-overview{font-size:13.6px;line-height:1.8}
 html[lang=ar] .project-content .case-thinking p,html[lang=ar] .case-thinking p{font-size:13.6px}
 html[lang=ar] .related-heading h2,html[lang=ar] .related-heading h3{font-size:23.2px}html[lang=ar] .related-card p{font-size:11.2px}
}
@media(max-width:360px){html[lang=ar] .hero h1{font-size:20.8px}.case-title-row>h1,.project-content .case-title-row>h2{font-size:20px}.project-category{max-width:84px}.case-summary{gap:10.4px}}

@media(min-width:901px){.project-content .case-meta,.case-main .case-meta{grid-template-columns:repeat(4,minmax(0,1fr));gap:17.6px}}

/* Revision 6: quiet colour atmosphere and an image-led, expandable project gallery. */
body{isolation:isolate}
.ambient-backdrop{position:fixed;inset:-72px;z-index:-1;overflow:hidden;pointer-events:none;contain:strict}
.ambient-field{position:absolute;display:block;width:min(800px,80vw);aspect-ratio:1;border-radius:50%;will-change:transform}
.ambient-teal{left:25%;top:-23%;background:radial-gradient(ellipse at center,rgba(40,180,155,.105),rgba(40,180,155,.035) 38%,transparent 69%);animation:ambient-teal 26s ease-in-out infinite alternate}
.ambient-lemon{right:-26%;bottom:-38%;background:radial-gradient(ellipse at center,rgba(228,233,45,.065),rgba(228,233,45,.018) 36%,transparent 70%);animation:ambient-lemon 32s ease-in-out infinite alternate}
@keyframes ambient-teal{from{transform:translate3d(-3%,0,0) scale(1)}to{transform:translate3d(10%,17%,0) scale(1.13)}}
@keyframes ambient-lemon{from{transform:translate3d(5%,7%,0) scale(1.03)}to{transform:translate3d(-13%,-12%,0) scale(1.14)}}
.ambient-backdrop[data-paused=true] .ambient-field,[data-ambient=paused] .ambient-field{animation-play-state:paused;will-change:auto}
[data-theme=light] .ambient-teal{opacity:.62}[data-theme=light] .ambient-lemon{opacity:.75}
.hero-time{display:grid;justify-items:end;gap:3.2px;max-width:139.2px;flex:none;text-align:end}
.ambient-toggle{display:inline-flex;gap:4px;align-items:center;justify-content:flex-end;min-height:24px;padding:3.2px 0;border:0;background:none;color:var(--muted);font-size:8px;line-height:1.5}
.ambient-toggle .icon{width:8.8px;height:8.8px}.ambient-toggle:hover{color:var(--action)}
.ambient-toggle[aria-pressed=true] .icon{transform:rotate(90deg)}
.project-gallery{margin:27.2px 0 36.8px;min-width:0}
.gallery-heading{display:flex;align-items:baseline;justify-content:space-between;gap:14.4px;margin:0 0 16px}
.gallery-heading h2{font-size:24px;font-weight:700;line-height:1.3;letter-spacing:-.025em}
.gallery-total{font-size:9.6px;color:var(--muted);white-space:nowrap}
.gallery-stage{position:relative;width:100%;min-width:0;aspect-ratio:1.8;max-height:48vh;background:var(--surface);border-radius:11.2px;overflow:hidden}
.gallery-stage>.artwork-zoom{display:block;width:100%;height:100%;border-radius:inherit;background:transparent}
.gallery-stage .gallery-main-image{display:block;width:100%;height:100%;max-height:none;object-fit:contain;transition:opacity 220ms ease-out}
.project-dialog .gallery-stage .gallery-main-image{object-fit:cover}
.gallery-stage .zoom-affordance{opacity:1;bottom:14.4px;right:14.4px;left:auto;background:#101010dc;color:#fff;max-width:calc(100% - 28.8px);font-size:8.8px}
.gallery-stage.is-loading .gallery-main-image{opacity:.45}
.gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14.4px;margin:10.4px 0 13.6px;min-height:33.6px}
.gallery-caption{display:flex;gap:12.8px;align-items:center;margin:0;font-size:9.6px;color:var(--muted);line-height:1.6}
.gallery-position{font-family:Inter,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text)}
.gallery-kind{font-size:8.8px}.gallery-actions{display:flex;align-items:center;gap:13.6px}.gallery-expand{gap:5.6px;font-size:8.8px;color:var(--copy);white-space:nowrap}.gallery-expand:hover,.gallery-expand:focus-visible{color:var(--action)}
.gallery-expand .icon{width:11.2px;height:11.2px}.gallery-arrows{display:flex;gap:6.4px}.gallery-arrows .icon-button{width:28.8px;height:28.8px;min-height:28.8px;background:var(--surface);border:0.8px solid var(--line);color:var(--text)}
.gallery-arrows .icon-button:hover:not(:disabled){color:var(--action);border-color:var(--action)}
.gallery-thumbs{display:flex;gap:8.8px;overflow-x:auto;padding:4.8px 4px 9.6px;margin:0 -4px;overscroll-behavior-x:contain;scrollbar-width:thin}
.gallery-thumb{position:relative;flex:0 0 82.4px;min-width:0;padding:0;border:0;border-radius:5.6px;overflow:hidden;background:var(--raised);aspect-ratio:1.35;opacity:.56;transition:opacity 200ms ease-out,box-shadow 200ms ease-out}
.gallery-thumb>img{width:100%;height:100%;object-fit:cover}.gallery-thumb>span{position:absolute;bottom:3.2px;right:4px;min-width:15.2px;height:15.2px;display:grid;place-items:center;background:#101010d9;color:#fff;border-radius:50%;font-family:Inter,sans-serif;font-size:7.2px;line-height:1}
.gallery-thumb:hover,.gallery-thumb[aria-pressed=true]{opacity:1}.gallery-thumb[aria-pressed=true]{box-shadow:0 0 0 1.6px var(--action)}
.project-gallery.is-expanded .gallery-thumbs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));overflow:visible}
.project-gallery.is-expanded .gallery-thumb{width:100%;aspect-ratio:1.35}
.gallery-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--surface);color:var(--text);padding:20px;text-align:center;gap:8px}.gallery-error p{font-size:11.2px;margin:0}
.case-enquiry{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 0;margin:14.4px 0 12px;border-bottom:0.8px solid var(--line)}
.case-enquiry p{font-size:10.4px;color:var(--muted);margin:0}.case-enquiry strong{display:block;font-family:Manrope,sans-serif;font-size:22.4px;font-weight:600;line-height:1.45;color:var(--text);margin-top:4px;letter-spacing:-.02em}
.case-enquiry .text-link{flex:none;font-size:9.6px;color:var(--teal)}.case-enquiry .text-link:hover{color:var(--action)}.case-enquiry .icon{width:13.6px;height:13.6px}
.case-topbar{flex-wrap:wrap}.case-topbar .ambient-toggle{margin-inline-start:auto}
html[lang=ar] .ambient-toggle{font-size:11.2px;font-weight:400;max-width:139.2px}
html[lang=ar] .gallery-heading h2{font-size:25.6px;font-weight:900;letter-spacing:0}
html[lang=ar] .gallery-total{font-size:12px}html[lang=ar] .gallery-kind,html[lang=ar] .gallery-expand{font-size:12px}
html[lang=ar] .gallery-error p{font-size:14.4px}html[lang=ar] .case-enquiry p{font-size:13.6px}
html[lang=ar] .case-enquiry strong{font-family:var(--font-ar);font-size:24px;font-weight:700;letter-spacing:0}
html[lang=ar] .case-enquiry .text-link{font-size:12.8px}
html[lang=ar] .project-card h3[lang=en]{font-family:Manrope,Inter,sans-serif}
html[lang=ar] .gallery-arrows{flex-direction:row-reverse}html[lang=ar] .gallery-arrows .icon{transform:scaleX(-1)}
@media(max-width:700px){
 .ambient-field{width:680px}.ambient-teal{left:-80%;top:-20%}.ambient-lemon{right:-150%;bottom:-20%;opacity:.5}
 .hero-time{max-width:116px}.ambient-toggle{font-size:7.2px;gap:2.4px;min-height:22.4px}.ambient-toggle .icon{width:8px;height:8px}
 .project-gallery{margin:20.8px 0 26.4px}.gallery-heading{margin-bottom:12px}.gallery-heading h2{font-size:19.2px}.gallery-total{font-size:8.8px}
 .gallery-stage{aspect-ratio:1.22;max-height:none;border-radius:8px}.gallery-stage .zoom-affordance{bottom:8px;right:8px;font-size:8px;max-width:calc(100% - 16px)}
 .gallery-toolbar{gap:8px;margin:8px 0 9.6px}.gallery-caption{gap:7.2px;font-size:8.8px}.gallery-kind{display:none}.gallery-actions{gap:8px}.gallery-expand{font-size:8px;gap:4px}.gallery-expand .icon{width:9.6px;height:9.6px}.gallery-arrows{gap:4px}.gallery-arrows .icon-button{height:25.6px;width:25.6px;min-height:25.6px}
 .gallery-thumbs{gap:7.2px}.gallery-thumb{flex-basis:59.2px}.gallery-thumb>span{height:13.6px;min-width:13.6px;font-size:6.4px}
 .project-gallery.is-expanded .gallery-thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}
 .case-enquiry{display:block;padding:19.2px 0;margin-top:22.4px}.case-enquiry strong{font-size:20px}.case-enquiry .text-link{margin-top:14.4px;display:inline-flex;gap:8px}
 html[lang=ar] .ambient-toggle{font-size:9.6px;max-width:116px}html[lang=ar] .gallery-heading h2{font-size:21.6px}
 html[lang=ar] .gallery-total,html[lang=ar] .gallery-kind,html[lang=ar] .gallery-expand{font-size:10.4px}
 html[lang=ar] .gallery-kind{max-width:60px}html[lang=ar] .case-enquiry strong{font-size:22.4px}
}
@media(prefers-reduced-motion:reduce){.ambient-field{animation:none!important;will-change:auto}.ambient-backdrop{transform:none!important}.gallery-main-image,.gallery-thumb{transition:none!important}}

/* client-logos.css */
.client-logo.client-logo-monochrome img{filter:brightness(0) invert(1)}
[data-theme=light] .client-logo.client-logo-monochrome img{filter:brightness(0)}
/* Blend the whole masked strip, including opaque black-backed artwork. */
.client-motion{mix-blend-mode:screen}
[data-theme=light] .client-motion{mix-blend-mode:multiply}
/* The three original opaque PNGs also need a luminance matte inside the strip's fade mask. */
.client-logo img[src*="/client-07.png"]{--logo-matte:url('/assets/logos/client-07.png')}
.client-logo img[src*="/client-15.png"]{--logo-matte:url('/assets/logos/client-15.png')}
.client-logo img[src*="/client-25.png"]{--logo-matte:url('/assets/logos/client-25.png')}
.client-logo img:is([src*="/client-07.png"],[src*="/client-15.png"],[src*="/client-25.png"]){mask-image:var(--logo-matte);mask-mode:luminance;mask-position:center;mask-repeat:no-repeat;mask-size:contain;filter:brightness(0) invert(1)}
[data-theme=light] .client-logo img:is([src*="/client-07.png"],[src*="/client-15.png"],[src*="/client-25.png"]){filter:brightness(0)}
@media(prefers-reduced-motion:reduce){.client-logo[data-client-repeat]{display:none!important}}

/* profile-image.css */
.brand-symbol[data-profile-mode=portrait],.identity-symbol[data-profile-mode=portrait]{object-fit:cover;border-radius:50%}
.brand-symbol[data-profile-mode=icon],.identity-symbol[data-profile-mode=icon]{object-fit:contain;border-radius:0}

/* refinements.css */
/* The original portfolio, with a fluid content area and one place for each story. */
:root{--aside-width:clamp(208px,17.6vw,272px);--main-left:calc(var(--aside-width) + clamp(30.4px,4.4vw,76.8px) + 19.2px);--content-right:clamp(80px,5.12vw,128px)}
.main-column{width:calc(100% - var(--main-left) - var(--content-right));max-width:1472px;margin-left:var(--main-left);padding-top:clamp(44px,3.28vw,70.4px)}
.hero h1{font-size:clamp(36px,4.12vw,83.2px)}
.hero-top{margin-bottom:clamp(40px,3.44vw,70.4px)}
.hero h1 .highlight{padding-inline:clamp(10.4px,0.92vw,19.2px)}
.hero-intro>p{font-size:clamp(10.4px,0.84vw,13.6px);max-width:49ch}
.hero-work-link{font-size:9.6px}.hero-bottom.stats-motion{margin-top:clamp(30.4px,2.96vw,52px)}
.about-copy{max-width:704px}.about-copy p{max-width:72ch}
.about-footnote{margin-top:28.8px;padding-top:20px;border-top:0.8px solid var(--line)}
.section-line h2{font-size:clamp(23.2px,2.12vw,38.4px)}
.section-intro{font-size:clamp(12.8px,1.16vw,17.6px);line-height:1.7}
.work-view-bar{border-block:0.8px solid var(--line);padding:5.6px 0 8px;margin:12.8px 0}
.density-control{width:min(100%,296px)}
.project-grid{gap:32px 20.8px}
.project-grid .project-image,.project-grid .project-card.featured .project-image{aspect-ratio:1.42;border-radius:9.6px}
.project-grid .project-card h3,.project-grid .project-card.featured h3{font-size:clamp(16px,1.28vw,22.4px)}
.project-grid .project-card-meta p,.project-grid .project-card.featured .project-card-meta p{font-size:clamp(9.6px,0.72vw,12px);line-height:1.8}
.project-grid[data-columns="1"] .project-image{aspect-ratio:1.8}
.project-grid[data-columns="1"] .project-card h3{font-size:clamp(19.2px,1.6vw,27.2px)}
.project-grid[data-columns="3"] .project-image{aspect-ratio:1.35}
.project-grid[data-columns="4"] .project-image{aspect-ratio:1.2}
.project-grid[data-columns="3"] .project-card h3,.project-grid[data-columns="4"] .project-card h3{font-size:clamp(13.6px,1vw,18.4px)}
.project-image .project-arrow{transition:background-color 200ms,color 200ms,transform 350ms var(--ease)}
.clients-section{padding-bottom:84px}.client-motion{padding-bottom:32px}
.logo-set{gap:clamp(22.4px,2.48vw,52px);padding-right:clamp(22.4px,2.48vw,52px)}
.client-logo{width:clamp(89.6px,7.2vw,132.8px);height:72px}.client-logo img{height:clamp(38.4px,2.72vw,52.8px)}
.logo-motion-control{font-size:8.8px;min-height:28.8px}

/* One glossy glass material across the floating navigation and contact control. */
.speak-float,.navigation-dock .nav-rail,:is(.navigation-dock,.mobile-actions) :is(.dock-button,.back-to-top){--glass-fill:color-mix(in srgb,var(--bg) 57%,transparent);background:var(--glass-fill);color:var(--text);backdrop-filter:blur(19.2px) saturate(1.45);-webkit-backdrop-filter:blur(19.2px) saturate(1.45);border:0.8px solid color-mix(in srgb,var(--text) 22%,transparent);box-shadow:inset 0 0.8px 0.8px #ffffff30,inset 0 -0.8px 0 #ffffff08,0 9.6px 28.8px #00000024;isolation:isolate;transition:transform 350ms var(--ease),border-color 220ms,color 220ms,opacity 220ms}
.speak-float{position:fixed;inset-inline-end:20.8px;bottom:20px;z-index:45;display:inline-flex;align-items:center;justify-content:center;gap:9.6px;padding:12px 15.2px;min-height:41.6px;border-radius:80px;font-size:9.6px;font-weight:500;line-height:1.5;overflow:hidden}
.glass-sheen{position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(120px circle at var(--glass-x,22%) var(--glass-y,0%),#ffffff29,transparent 76%),linear-gradient(135deg,#ffffff0d,transparent 50%,#ffffff05);opacity:.75;transition:opacity 250ms}
.speak-float:hover,.navigation-dock .nav-rail:hover,:is(.navigation-dock,.mobile-actions) :is(.dock-button,.back-to-top):hover{border-color:color-mix(in srgb,var(--teal) 60%,var(--line))}
.speak-float:hover>.glass-sheen,.navigation-dock .nav-rail:hover>.glass-sheen,:is(.navigation-dock,.mobile-actions) :is(.dock-button,.back-to-top):hover>.glass-sheen{opacity:1}
:is(.navigation-dock,.mobile-actions) :is(.dock-button,.back-to-top):hover{background:var(--glass-fill);color:var(--action)}
.navigation-dock .nav-rail a:hover,.navigation-dock .nav-rail a[aria-current]{background:color-mix(in srgb,var(--teal) 18%,transparent);box-shadow:inset 0 0.8px 0 #ffffff14;color:var(--action)}
.speak-float:hover{transform:translateY(-3.2px)}
.speak-float .icon{width:12px;height:12px;transition:transform 350ms var(--ease)}
.speak-float:hover .icon{transform:translate(1.6px,-1.6px)}
.speak-status{width:5.6px;height:5.6px;border-radius:50%;background:var(--teal);box-shadow:0 0 9.6px color-mix(in srgb,var(--teal) 45%,transparent);flex:none}
.speak-float.is-unneeded,.dialog-open .speak-float{opacity:0;pointer-events:none;transform:translateY(6.4px)}
html[lang=ar] .speak-float{font-family:var(--font-ar);font-size:12px;font-weight:600}
.mobile-actions{display:none}
.profile-card{max-height:none;min-height:0}
.profile-socials .linkedin-icon{fill:currentColor;stroke:none}

/* Pointer-led colour atmosphere. The fields move independently of the page. */
.ambient-backdrop{inset:0;transform:none!important;--ambient-x:44vw;--ambient-y:32vh}
.ambient-field{animation:none!important;transform:translate(-50%,-50%);will-change:left,top;width:max(720px,60vw)}
.ambient-teal{left:var(--ambient-x);top:var(--ambient-y);background:radial-gradient(ellipse at center,rgba(40,180,155,.14),rgba(40,180,155,.045) 38%,transparent 70%)}
.ambient-lemon{left:calc(100% - var(--ambient-x));top:calc(100% - var(--ambient-y));right:auto;bottom:auto;background:radial-gradient(ellipse at center,rgba(228,233,45,.085),rgba(228,233,45,.021) 38%,transparent 70%)}
.ambient-backdrop[data-paused=true] .ambient-field{will-change:auto}

/* One career journey: scroll-driven on large screens; swipeable on small ones. */
.section-eyebrow{display:block;color:var(--teal);font:500 8px/1.5 Inter,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.experience-topline{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:17.6px}
.experience-topline .text-link{font-size:9.6px}
.career-stage{position:relative;min-width:0;--career-progress:0}
.career-viewport{--career-edge-fade:25.6px;height:clamp(312px,57vh,536px);overflow-x:auto;overflow-y:hidden;border:0;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;direction:ltr;background:transparent;mask-image:linear-gradient(to right,transparent,#000 var(--career-edge-fade),#000 calc(100% - var(--career-edge-fade)),transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--career-edge-fade),#000 calc(100% - var(--career-edge-fade)),transparent)}
.career-viewport::-webkit-scrollbar{display:none}
.career-track{height:100%;display:flex;direction:ltr;will-change:transform}
.career-panel{position:relative;isolation:isolate;flex:0 0 100%;min-width:0;height:100%;overflow:hidden;display:flex;align-items:center;scroll-snap-align:start;scroll-snap-stop:always;padding:32px clamp(22.4px,3.2vw,59.2px);direction:ltr}
.career-panel-content{width:100%;position:relative;z-index:1}
.career-ghost{position:absolute;inset-inline-start:-3%;top:16%;width:max-content;font:800 clamp(72px,10.08vw,200px)/.92 Inter,sans-serif;letter-spacing:-.06em;color:var(--text);opacity:.045;pointer-events:none;z-index:-1;direction:ltr;user-select:none}
.career-panel:nth-child(even) .career-ghost{top:auto;bottom:8%;inset-inline-start:6%}
.career-kicker{font-size:8.8px;line-height:1.6;color:var(--teal);display:block;margin-bottom:17.6px}
.career-intro h2{font-family:Inter,sans-serif;font-size:clamp(41.6px,4.24vw,82.4px);font-weight:700;line-height:.99;letter-spacing:-.055em;margin:0 0 17.6px}
.career-intro h2 span{color:var(--action)}
.career-description{font-size:11.2px;line-height:1.8;color:var(--copy);max-width:42ch;margin:0 0 20px}
.career-start-date{font-size:8.8px;color:var(--muted);font-variant-numeric:tabular-nums}
.career-panel-top{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:9.6px 20px;margin-bottom:19.2px}
.career-company{font-size:10.4px;line-height:1.6;color:var(--teal);max-width:38ch}.career-period{font-size:8.8px;line-height:1.6;color:var(--muted);font-variant-numeric:tabular-nums}
.career-panel h3{font-size:clamp(29.6px,3.28vw,62.4px);font-family:Inter,sans-serif;font-weight:600;line-height:1.07;letter-spacing:-.05em;max-width:20ch;margin:0 0 27.2px}
.career-roles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17.6px;max-width:640px;margin:0}
.career-roles>div{border-top:0.8px solid var(--line);padding-top:10.4px}
.career-roles dt{font-size:10.4px;line-height:1.7;color:var(--text);font-weight:500}
.career-roles dd{font-size:8.8px;line-height:1.7;color:var(--muted);margin:5.6px 0 0}
.career-current{display:table;border:0.8px solid color-mix(in srgb,var(--teal) 40%,var(--line));border-radius:24px;padding:1.6px 6.4px;margin:4.8px 0 0;color:var(--teal);font-size:7.2px}
.career-bottom{display:flex;justify-content:space-between;align-items:center;gap:13.6px;padding:13.6px 0 12px}
.career-tabs{display:flex;gap:4.8px;overflow:auto;scrollbar-width:none;max-width:calc(100% - 120px);direction:ltr;padding-bottom:3.2px}
.career-tabs::-webkit-scrollbar{display:none}
.career-tab{background:transparent;border:0.8px solid transparent;color:var(--muted);font-size:8px;line-height:1.5;min-height:30.4px;padding:6.4px 8.8px;border-radius:4.8px;flex:none;white-space:nowrap;transition:background 200ms,color 200ms,border-color 200ms}
.career-tab:hover{color:var(--text)}.career-tab[aria-selected=true]{background:var(--selected);border-color:var(--line);color:var(--text)}
.career-step-controls{display:flex;align-items:center;gap:4.8px;direction:ltr;flex:none}
.career-counter{font:400 8px/1.5 Inter,sans-serif;color:var(--muted);margin-right:6.4px;white-space:nowrap}
.career-step-controls .icon-button{width:25.6px;height:25.6px;min-height:25.6px;border:0.8px solid var(--line);background:var(--surface)}
.career-step-controls .icon{width:10.4px;height:10.4px}
.career-progress{height:1.6px;background:var(--line);direction:ltr;overflow:hidden}
.career-progress>span{display:block;height:100%;background:var(--teal);transform-origin:left;transform:scaleX(var(--career-progress))}
.career-hint{font-size:8px;color:var(--muted);margin:9.6px 0 0;text-align:start}
.career-pinned .career-viewport{overflow:hidden;scroll-snap-type:none}
.career-pinned .career-viewport{height:calc(100svh - 192px);min-height:304px}

/* The services remain the single explanation of the six disciplines. */
.shape-layout{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(24px,3.2vw,64px);align-items:start}
.shape-intro{position:sticky;top:52px;padding-top:6.4px}
.shape-intro h2{font-size:clamp(28px,2.72vw,48.8px);line-height:1.17;letter-spacing:-.045em;font-weight:600;margin-bottom:20px}
.shape-word{display:block;color:var(--action)}
.shape-intro>p{max-width:32ch;font-size:clamp(10.4px,0.8vw,12.8px);line-height:1.9;color:var(--muted);margin:0 0 22.4px}
.practice-note{display:flex;align-items:baseline;gap:8px;border-top:0.8px solid var(--line);padding-top:17.6px;max-width:33ch}
.practice-note .status-dot{flex:none}.practice-note p{font-size:9.6px;line-height:1.8;color:var(--copy);margin:0}
.shape-stack{padding-bottom:36px;min-width:0;isolation:isolate}
.shape-card{position:sticky;top:calc(30.4px + var(--shape-order)*8.8px);padding-bottom:18.4px;scroll-margin-top:92px;z-index:var(--shape-layer)}
.shape-card:focus-within{z-index:20}
.shape-card-surface{background:var(--surface);border:0.8px solid var(--line);border-radius:11.2px;overflow:hidden;transform-origin:center top;box-shadow:0 -8px 22.4px color-mix(in srgb,var(--bg) 80%,transparent)}
.shape-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19.2px 20.8px 0}
.shape-card-number{font:500 8.8px/1.5 Inter,sans-serif;color:var(--teal);direction:ltr}.shape-card-head>.icon{width:13.6px;height:13.6px;color:var(--muted)}
.shape-card-copy{padding:12px 20.8px 19.2px}
.shape-card h3{font-size:clamp(19.2px,1.6vw,27.2px);line-height:1.35;font-weight:600;letter-spacing:-.03em;margin-bottom:9.6px}
.shape-card p{font-size:clamp(9.6px,0.76vw,12px);line-height:1.85;color:var(--copy);margin:0;max-width:65ch}
.shape-deliverables{display:flex;flex-wrap:wrap;gap:4.8px;list-style:none;padding:0;margin:14.4px 0 16px}
.shape-deliverables li{font-size:8px;line-height:1.5;color:var(--muted);border:0.8px solid var(--line);padding:4px 6.4px;border-radius:3.2px}
.shape-card .text-link{font-size:9.6px;min-height:32px;color:var(--action)}
.shape-project-preview{display:block;position:relative;margin-bottom:13.6px;border-radius:6.4px;overflow:hidden;background:var(--raised)}
.shape-project-preview img{display:block;width:100%;height:clamp(128px,11.6vw,216px);object-fit:cover;transition:transform 650ms var(--ease)}
.shape-project-preview:hover img{transform:scale(1.04)}
.shape-project-name{position:absolute;inset-inline:0;bottom:0;background:linear-gradient(transparent,#000d);padding:20px 10.4px 8.8px;font-size:8.8px;font-family:Inter,sans-serif;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:8px}
.shape-project-name .icon{width:11.2px;height:11.2px}
.shape-card:nth-child(3n+2) .shape-card-surface{background:var(--selected)}
.motion-heading-mask{display:inline-block;max-width:100%;vertical-align:bottom;overflow:clip;padding-bottom:.12em;margin-bottom:-.12em}
.motion-heading-inner{display:block}
.project-dialog{--modal-open-dur:340ms;--modal-scale:.985}

html[lang=ar] .hero h1{font-size:clamp(32px,3.6vw,70.4px);line-height:1.5}
html[lang=ar] .hero-intro>p{font-size:clamp(12.8px,0.976vw,16.8px)}
html[lang=ar] .section-eyebrow{font-family:var(--font-ar);font-size:10.4px;letter-spacing:0}
html[lang=ar] .career-panel{direction:rtl}
html[lang=ar] .career-intro h2{font-family:var(--font-ar-heading);font-size:clamp(38.4px,4vw,76.8px);line-height:1.5;letter-spacing:0}
html[lang=ar] .career-panel h3{font-family:var(--font-ar-heading);font-size:clamp(29.6px,3.04vw,56px);line-height:1.45;letter-spacing:0}
html[lang=ar] .career-kicker,html[lang=ar] .career-description{font-size:14.4px;line-height:1.8}
html[lang=ar] .career-company,html[lang=ar] .career-period{font-size:11.2px}
html[lang=ar] .career-roles dt{font-size:12.8px}html[lang=ar] .career-roles dd{font-size:10.4px}
html[lang=ar] .career-current{font-size:8.8px}html[lang=ar] .career-tab{font-family:var(--font-ar);font-size:9.6px}
html[lang=ar] .career-hint,html[lang=ar] .career-start-date{font-size:10.4px}
html[lang=ar] .shape-intro h2{font-size:clamp(31.2px,2.8vw,52px);line-height:1.5;letter-spacing:0}
html[lang=ar] .shape-intro>p{font-size:14.4px;line-height:1.9}.practice-note p{max-width:28ch}
html[lang=ar] .practice-note p{font-size:12px}
html[lang=ar] .shape-card h3{font-size:clamp(23.2px,1.92vw,33.6px);line-height:1.5;letter-spacing:0}
html[lang=ar] .shape-card p{font-size:13.6px;line-height:1.85}
html[lang=ar] .shape-deliverables li{font-size:9.6px}html[lang=ar] .shape-card .text-link{font-size:12px}

@media(min-width:1920px){.project-grid{gap:41.6px 27.2px}.hero{padding-bottom:70.4px}.about-copy h3{font-size:50.4px}}
@media(max-width:1100px){
 .main-column{margin-left:38.4px;width:calc(100% - 116px);padding-top:100px}.hero h1{font-size:clamp(36.8px,5.36vw,64px)}.hero-top{margin-bottom:40px}
 .shape-layout{gap:24px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.shape-intro h2{font-size:30.4px}.shape-project-preview img{height:140px}
 .career-panel{padding-inline:25.6px}.career-intro h2{font-size:52px}.career-panel h3{font-size:38.4px}
 .speak-float{inset-inline-end:17.6px;bottom:19.2px}
 html[lang=ar] .hero h1{font-size:clamp(32px,4.48vw,52px)}
}
@media(max-width:700px){
 .main-column{margin-left:17.6px;width:calc(100% - 35.2px);padding-top:99.2px}.hero h1{font-size:clamp(24px,6.64vw,43.2px)}.hero-top{margin-bottom:30.4px}.hero-intro>p{font-size:10.4px}.hero-work-link{font-size:0}
 .section-line h2{font-size:23.2px}.section-intro{font-size:12.8px}.hero-bottom.stats-motion{margin-top:25.6px}
 .clients-section{padding-bottom:61.6px}.client-logo{width:83.2px;height:60.8px}.client-logo img{height:38.4px}.logo-set{gap:22.4px;padding-right:22.4px}
 .project-grid{gap:23.2px 11.2px}.project-grid .project-image,.project-grid .project-card.featured .project-image{aspect-ratio:1.35;border-radius:8px}
 .project-grid[data-columns="1"] .project-image{aspect-ratio:1.38}.project-grid .project-card h3,.project-grid .project-card.featured h3{font-size:14.4px}.project-grid[data-columns="1"] .project-card h3{font-size:20px}
 .project-grid .project-card-meta p,.project-grid .project-card.featured .project-card-meta p{font-size:9.6px;line-height:1.8}.project-grid[data-columns="2"] .project-card h3{font-size:12.8px}.project-grid[data-columns="2"] .project-card-meta p{font-size:8.8px}
 .work-controls .filters{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:6.4px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.work-controls .filter-button{flex:none}
 .density-control{width:100%;max-width:288px}.work-view-bar{padding:6.4px 0;margin-top:11.2px}.density-scale{font-size:8px}.about-footnote{margin-top:20px}
 .speak-float{inset-inline-end:17.6px;bottom:67.2px;padding:9.6px 12.8px;min-height:36.8px;font-size:8.8px;gap:8px}.speak-float .icon{width:10.4px;height:10.4px}.speak-status{width:4.8px;height:4.8px}
 html[lang=ar] .speak-float{font-size:10.4px}
 .experience-topline{margin-bottom:12px}.experience-topline .text-link{font-size:8.8px}.section-eyebrow{font-size:7.2px}
 .career-viewport{height:392px;--career-edge-fade:11.2px}.career-panel{padding:22.4px 18.4px;align-items:center}.career-ghost{font-size:74.4px;top:12%;opacity:.04}
 .career-intro h2{font-size:44px;line-height:1.05}.career-description{font-size:10.4px;max-width:31ch}.career-kicker{font-size:8px;margin-bottom:17.6px}
 .career-panel-top{display:block;margin-bottom:20px}.career-company{font-size:9.6px;display:block;margin-bottom:5.6px}.career-period{font-size:8px}
 .career-panel h3{font-size:28px;line-height:1.13;margin-bottom:20px}.career-roles{grid-template-columns:1fr;gap:10.4px}.career-roles>div{padding-top:8px}.career-roles dt{font-size:9.6px}.career-roles dd{font-size:8px;margin-top:3.2px}.career-current{display:inline-block;margin:0 0 0 5.6px;font-size:6.4px}
 .career-bottom{flex-wrap:wrap;gap:6.4px;padding-top:8.8px}.career-tabs{max-width:100%;width:100%;padding-bottom:4px}.career-tab{font-size:8px;padding:5.6px 8px;min-height:32px}.career-step-controls{margin-inline-start:auto}.career-hint{font-size:7.2px;margin-top:7.2px}
 .shape-layout{display:block}.shape-intro{position:relative;top:auto;padding:0;margin-bottom:21.6px}.shape-intro h2{font-size:32px;max-width:17ch;margin-bottom:14.4px}.shape-word{display:inline}.shape-intro>p{font-size:11.2px;max-width:40ch;margin-bottom:14.4px}.practice-note{padding-top:12px}.practice-note p{font-size:8.8px}
 .shape-stack{padding:0;display:grid;gap:12.8px}.shape-card{position:relative;top:auto;padding:0;scroll-margin-top:84px}.shape-card-surface{box-shadow:none}.shape-card-head{padding:16px 16px 0}.shape-card-copy{padding:10.4px 16px 16px}.shape-card h3{font-size:20.8px}.shape-card p{font-size:10.4px}.shape-project-preview img{height:auto;aspect-ratio:1.65}.shape-card .text-link{font-size:9.6px}.shape-deliverables li{font-size:7.2px}
 html[lang=ar] .hero h1{font-size:clamp(24px,6.08vw,36px)}html[lang=ar] .hero-intro>p{font-size:11.2px}
 html[lang=ar] .career-intro h2{font-size:38.4px;line-height:1.55}html[lang=ar] .career-panel h3{font-size:27.2px;line-height:1.45}
 html[lang=ar] .career-description,html[lang=ar] .career-kicker{font-size:12px;line-height:1.8}html[lang=ar] .career-company{font-size:11.2px}html[lang=ar] .career-period{font-size:9.6px}
 html[lang=ar] .career-roles dt{font-size:11.2px}html[lang=ar] .career-roles dd{font-size:9.6px}html[lang=ar] .career-current{font-size:7.2px}html[lang=ar] .career-tab{font-size:8.8px}
 html[lang=ar] .shape-intro h2{font-size:31.2px}html[lang=ar] .shape-intro>p{font-size:13.6px}html[lang=ar] .shape-card h3{font-size:23.2px}html[lang=ar] .shape-card p{font-size:12.8px}html[lang=ar] .shape-deliverables li{font-size:8.8px}
}
@media(max-width:360px){.main-column{margin-left:14.4px;width:calc(100% - 28.8px)}.hero h1{font-size:22.4px}.career-panel{padding-inline:15.2px}.career-panel h3{font-size:24px}.career-intro h2{font-size:39.2px}.speak-float{inset-inline-end:14.4px}.career-viewport{height:404px}html[lang=ar] .hero h1{font-size:20.8px}}
/* On phones the bottom dock is navigation only; preferences live in the header. */
@media(max-width:700px){
 .mobile-header{position:fixed;top:calc(11.2px + env(safe-area-inset-top,0px));left:14.4px;right:14.4px;z-index:46;isolation:isolate;direction:ltr}
 .mobile-header>.wordmark,.mobile-header>.button{display:none}
 .mobile-header::before{content:"";position:absolute;inset:-16px -14.4px -16px;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,color-mix(in srgb,var(--bg) 92%,transparent),color-mix(in srgb,var(--bg) 60%,transparent) 55%,transparent)}
 .mobile-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:0;direction:ltr}
 .mobile-preferences{display:flex;align-items:center;gap:4.8px;flex:none}
 .mobile-actions .speak-float{position:relative;inset:auto;z-index:auto;min-height:36.8px;padding:8.8px 9.6px;gap:6.4px;font-size:9.6px;white-space:nowrap;flex:none;transform:none}
 .mobile-actions .speak-float:hover{transform:none}
 .mobile-actions .speak-float.is-unneeded{transform:translateY(-4.8px)}
 .mobile-actions .dock-button,.mobile-actions .back-to-top{position:relative;inset:auto;width:35.2px;height:35.2px;min-width:35.2px;min-height:35.2px;aspect-ratio:1;flex:0 0 35.2px;padding:0;border-radius:50%;transform:none}
 .mobile-actions .dock-button .icon,.mobile-actions .back-to-top .icon{width:15.2px;height:15.2px;flex:none}
 .mobile-actions .language-mark{font-size:14.4px}html[lang=ar] .mobile-actions .language-mark{font-size:9.6px}
 .mobile-actions .nav-label{display:none}
 .mobile-actions .back-to-top{display:none}
 .mobile-actions .back-to-top.is-needed{display:grid}
 .navigation-dock{position:fixed;top:auto;bottom:calc(11.2px + env(safe-area-inset-bottom,0px));left:50%;right:auto;transform:translateX(-50%);display:block;width:min(304px,calc(100% - 19.2px));max-width:none;direction:ltr}
 .navigation-dock .dock-utilities{display:none}
 .navigation-dock .nav-rail{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));width:100%;gap:0;padding:4.8px;border-radius:799.2px}
 .navigation-dock .nav-rail a{width:35.2px;height:35.2px;min-width:35.2px;min-height:35.2px;aspect-ratio:1;flex:none;justify-self:center;padding:0;border-radius:50%}
 .navigation-dock .nav-rail .icon{width:16px;height:16px;flex:none}
 .footer{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
 html{scroll-padding-top:calc(75.2px + env(safe-area-inset-top,0px))}
}
@media(max-width:340px){
 .mobile-header{left:9.6px;right:9.6px}.mobile-actions{gap:4.8px}.mobile-actions .speak-float{font-size:8.8px;padding-inline:8px}
 html[lang=ar] .mobile-actions .speak-float{font-size:9.6px}
 .navigation-dock{width:calc(100% - 12.8px)}
 .navigation-dock .nav-rail a{width:32px;height:32px;min-width:32px;min-height:32px}
 .navigation-dock .nav-rail .icon{width:15.2px;height:15.2px}
}
@media(min-width:701px) and (max-height:700px){.shape-card{position:relative;top:auto}.shape-card-surface{transform:none!important;opacity:1!important}.shape-intro{top:20px}.career-viewport{height:296px}.career-intro h2{font-size:48px}.career-panel h3{font-size:32px}.career-panel{padding-block:20px}.career-panel-top{margin-bottom:12.8px}.career-panel h3{margin-bottom:16px}.career-roles{gap:14.4px}}
@media(prefers-reduced-motion:reduce){
 .ambient-field{will-change:auto!important}.speak-float,.speak-float .icon,.navigation-dock .nav-rail,:is(.navigation-dock,.mobile-actions) :is(.dock-button,.back-to-top),.glass-sheen,.career-tab,.shape-project-preview img{transition:none!important}
 .shape-card{position:relative;top:auto}.shape-card-surface{transform:none!important;opacity:1!important;box-shadow:none}.career-track{will-change:auto}.career-viewport{scroll-snap-type:none}
 .motion-heading-inner{transform:none!important;opacity:1!important;filter:none!important}
}

/* project-showcase.css */
/* The full-image selection and the existing archive are two views of the work. */
.work-mode-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 0 16px}
.work-selection-label{display:flex;flex-direction:column;gap:5.6px}
.work-selection-label>span{font-size:8px;letter-spacing:.16em;font-weight:600;text-transform:uppercase;color:var(--muted)}
.work-selection-label>p{font-size:9.6px;margin:0;color:var(--muted)}
.work-mode-switch{display:flex;align-items:center;flex:none;gap:3.2px;padding:3.2px;border:0.8px solid var(--line);border-radius:80px;background:var(--bg)}
.work-mode-switch button{display:flex;align-items:center;justify-content:center;gap:6.4px;min-height:35.2px;padding:0 13.6px;border:0;border-radius:80px;background:transparent;color:var(--muted);font:inherit;font-size:9.6px;white-space:nowrap;transition:color 200ms,background-color 200ms}
.work-mode-switch button .icon{width:12.8px;height:12.8px}
.work-mode-switch button[aria-pressed="true"]{color:var(--green-ink);background:var(--green)}
.work-mode-switch button:hover:not([aria-pressed="true"]){background:color-mix(in srgb,var(--text) 7%,transparent);color:var(--text)}
.work-mode-switch button:focus-visible,.showcase-page:focus-visible{outline:1.6px solid var(--teal);outline-offset:2.4px}
.work-archive-count{font-size:8px;opacity:.7;font-variant-numeric:tabular-nums}
.showcase-viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;direction:ltr;border-radius:14.4px}
.showcase-viewport::-webkit-scrollbar{display:none}
.showcase-track{display:flex;direction:ltr}
.showcase-card{position:relative;isolation:isolate;flex:0 0 100%;min-width:0;display:block;height:clamp(304px,calc(100svh - 216px),608px);overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;color:#fff;background:#151715;border-radius:14.4px}
.showcase-card::after{position:absolute;content:"";inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#080a0824,transparent 40%,#080a0859 62%,#080a08f2 100%)}
.showcase-image-backdrop{position:absolute;inset:-20px;z-index:-3;width:calc(100% + 40px);height:calc(100% + 40px);object-fit:cover;filter:blur(24px);opacity:.42;pointer-events:none}
.showcase-artwork{position:absolute;inset:0;z-index:-2;display:flex;align-items:center;justify-content:center;padding:0}
.showcase-image{width:100%;height:100%;object-fit:cover;object-position:var(--showcase-focus,50% 50%);filter:drop-shadow(0 12.8px 24px #0003);transition:transform 700ms var(--ease)}
.showcase-card:hover .showcase-image{transform:scale(1.025)}
.showcase-topline{position:absolute;top:22.4px;inset-inline:25.6px;display:flex;justify-content:space-between;align-items:center;gap:14.4px;font-size:8.8px;text-shadow:0 0.8px 8px #0008}
.showcase-tag{display:inline-flex;align-items:center;gap:7.2px}
.showcase-tag::before{content:"";width:4.8px;height:4.8px;border-radius:50%;background:var(--teal);box-shadow:0 0 9.6px color-mix(in srgb,var(--teal) 55%,transparent)}
.showcase-copy{position:absolute;inset-inline:25.6px;bottom:22.4px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:16px;direction:inherit}
.showcase-copy h3{margin:0 0 6.4px;font-family:var(--font-display,inherit);font-weight:500;font-size:clamp(27.2px,2.8vw,54.4px);letter-spacing:-.04em;line-height:1.05;overflow-wrap:anywhere}
.showcase-copy p{margin:0;max-width:42ch;font-size:11.2px;line-height:1.6;color:#ffffffb8}
.showcase-open{display:flex;align-items:center;gap:9.6px;font-size:9.6px;white-space:nowrap}
.showcase-open>.icon{width:38.4px;height:38.4px;padding:12px;border:0.8px solid #ffffff45;border-radius:50%;transition:transform 350ms var(--ease),background-color 200ms,color 200ms}
.showcase-card:hover .showcase-open>.icon{background:var(--green);color:var(--green-ink);border-color:var(--green);transform:rotate(45deg)}
.showcase-card:focus-visible{outline:2.4px solid var(--green);outline-offset:-4px}
.showcase-footer{display:flex;justify-content:space-between;align-items:center;gap:14.4px;padding:11.2px 0 8px;direction:ltr}
.showcase-pagination{display:flex;gap:0.8px;align-items:center}
.showcase-page{position:relative;display:grid;place-items:center;width:28px;height:35.2px;border:0;background:none;color:var(--muted);font:inherit;font-size:8.8px;font-variant-numeric:tabular-nums}
.showcase-page::after{content:"";position:absolute;bottom:4px;width:3.2px;height:3.2px;border-radius:50%;background:currentColor;opacity:0;transition:opacity 200ms}
.showcase-page[aria-pressed="true"]{color:var(--action)}
.showcase-page[aria-pressed="true"]::after{opacity:1}
.showcase-controls{display:flex;align-items:center;gap:6.4px}
.showcase-counter{font-size:8.8px;font-variant-numeric:tabular-nums;color:var(--muted);margin-inline-end:7.2px}
.showcase-controls .icon-button{width:32px;height:32px;flex:none;background:transparent}
.showcase-controls .icon-button:disabled{opacity:.3;cursor:default}
.showcase-browse{min-height:35.2px;display:inline-flex;align-items:center;gap:8px;padding:0;border:0;color:var(--text);background:none;font:inherit;font-size:9.6px}
.showcase-browse .icon{width:12px;height:12px}
.showcase-browse:hover{color:var(--action)}
.showcase-progress{height:0.8px;background:var(--line);overflow:hidden}
.showcase-progress>span{height:100%;display:block;width:100%;transform-origin:left;transform:scaleX(var(--showcase-progress,0));background:var(--teal)}
.showcase-hint{font-size:8px;color:var(--muted);margin:8.8px 0 0;text-align:start;line-height:1.5}
.work-presentation-stage.is-pinned .showcase-viewport{overflow:hidden;scroll-snap-type:none}
.work-presentation-stage.is-pinned{display:flex;flex-direction:column;height:calc(100svh - 88px);min-height:0;will-change:transform}
/* Fill the pinned scene on tall screens while keeping its controls in view. */
.work-presentation-stage.is-pinned .work-mode-bar{flex:none}
.work-presentation-stage.is-pinned .project-showcase{display:flex;flex-direction:column;flex:1;min-height:0}
.work-presentation-stage.is-pinned .showcase-viewport{flex:1;min-height:0}
.work-presentation-stage.is-pinned .showcase-track,.work-presentation-stage.is-pinned .showcase-card{height:100%}
.work-presentation-stage.is-pinned :is(.showcase-footer,.showcase-progress,.showcase-hint){flex:none}
html[dir="rtl"] .showcase-copy,html[dir="rtl"] .showcase-topline{direction:rtl;text-align:right}
html[dir="rtl"] .showcase-copy h3{font-family:var(--arabic-display,inherit);letter-spacing:0;line-height:1.25}
@media(max-width:1100px){.work-mode-bar{gap:12.8px}.showcase-card{height:clamp(312px,65svh,544px)}.showcase-open>span{display:none}.showcase-artwork{padding:0}.showcase-copy{inset-inline:20.8px}.showcase-copy h3{font-size:30.4px}.showcase-topline{inset-inline:20.8px}}
@media(max-width:700px){
  .work-mode-bar{align-items:stretch;flex-direction:column;gap:12px;padding-bottom:14.4px}
  .work-selection-label{flex-direction:row;align-items:center;justify-content:space-between;gap:9.6px}
  .work-selection-label>span{font-size:7.2px;letter-spacing:.12em}.work-selection-label>p{font-size:8px;text-align:end;max-width:18ch;line-height:1.5}
  .work-mode-switch{width:100%;padding:3.2px}.work-mode-switch button{flex:1;min-height:35.2px;font-size:9.6px;padding-inline:9.6px}
  .showcase-viewport,.showcase-card{border-radius:10.4px}.showcase-card{height:clamp(296px,52svh,368px)}
  .showcase-artwork{padding:0}.showcase-topline{top:17.6px;inset-inline:16px;font-size:8px}
  .showcase-copy{inset-inline:16px;bottom:20px;gap:8px}.showcase-copy h3{font-size:27.2px;line-height:1.12}.showcase-copy p{font-size:9.6px;max-width:25ch}
  .showcase-open>.icon{width:35.2px;height:35.2px;padding:10.4px;flex:none}
  .showcase-footer{display:grid;grid-template-columns:1fr auto;gap:0 6.4px;padding:8px 0 4.8px}
  .showcase-pagination{gap:0}.showcase-page{width:24px;height:35.2px}.showcase-counter{font-size:8px;margin-inline-end:2.4px}
  .showcase-controls{gap:4px}.showcase-controls .icon-button{width:35.2px;height:35.2px}
  .showcase-browse{grid-column:1/-1;justify-content:space-between;direction:inherit;min-height:35.2px;font-size:9.6px}
  .showcase-hint{font-size:8px;margin-top:8px}
}
@media(max-width:360px){.showcase-footer{gap:0 3.2px}.showcase-page{width:20px}.showcase-counter{display:none}.showcase-copy h3{font-size:24px}.showcase-card{height:320px}}
@media(prefers-reduced-motion:reduce){.showcase-viewport{scroll-snap-type:none}.showcase-image,.showcase-open>.icon{transition:none}.showcase-card:hover .showcase-image{transform:none}}

.showcase-card[data-image-fit="contain"] .showcase-image{object-fit:contain}
@media(max-width:700px){.showcase-image{object-position:var(--showcase-mobile-focus,50% 50%)}}

}
