@font-face{font-family:Space;src:url(fonts/space.ttf);font-weight:300 700;font-display:swap}
@font-face{font-family:Alexandria;src:url(fonts/alexandria.ttf);font-weight:100 900;font-display:swap}
:root{--ink:#222720;--cream:#f1f0e9;--accent:#d9ebaa;--olive:#353e2e;--surface:#30382c;--line:#616b58;--muted:#cbd1c2;--pad:clamp(20px,5.2vw,92px);--snap:cubic-bezier(.19,1,.22,1);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:76px}body{margin:0;background:var(--ink);color:var(--cream);font:16px/1.55 Space,Arial,sans-serif}html[lang=ar] body{font-family:Alexandria,Arial,sans-serif}img{display:block;width:100%}a,button{color:inherit}a{text-decoration:none}button{font:inherit;cursor:pointer}h1,h2,h3,p,figure{margin:0}em{color:var(--accent);font-style:normal}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.mono,.section-index,.eyebrow,footer{font:600 11px/1.4 ui-monospace,monospace;letter-spacing:.1em}:lang(ar) :is(.mono,.section-index,.eyebrow,footer){font-family:Alexandria,sans-serif;letter-spacing:0}.wrap{width:min(100% - 2 * var(--pad),1530px);margin-inline:auto}.sr-only{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.skip{position:fixed;top:6px;left:6px;z-index:20;background:var(--cream);color:var(--ink);padding:12px;transform:translateY(-150%)}.skip:focus{transform:none}
.bar{height:72px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-inline:var(--pad);position:sticky;top:0;background:var(--ink);z-index:8;border-bottom:1px solid var(--line)}.motion-ready .bar{animation:nav-drop .75s var(--snap) both}.brand{display:flex;align-items:center;gap:9px;font:700 14px/1 Space,sans-serif;letter-spacing:.035em}.monogram{display:grid;place-items:center;width:42px;aspect-ratio:1;border:1px solid var(--line);font-size:21px;color:var(--accent);letter-spacing:-.1em}.bar nav{display:flex;align-items:center;gap:clamp(14px,3.4vw,52px);font-size:13px}.bar nav a,.bar nav button{position:relative;padding:9px 0}.bar nav a::after,.bar nav button::after{content:"";position:absolute;inset:auto 0 4px;height:1px;background:var(--accent);scale:0 1;transform-origin:right;transition:scale .38s var(--snap)}.bar nav :is(a,button):is(:hover,:focus-visible)::after{scale:1 1;transform-origin:left}#lang{background:none;border:0;color:var(--accent);font-size:12px}
.read-progress{position:fixed;inset:0 0 auto;height:2px;background:var(--accent);z-index:10;pointer-events:none;scale:var(--scroll,0) 1;transform-origin:left}html[dir=rtl] .read-progress{transform-origin:right}
.hero{isolation:isolate;position:relative;overflow:hidden;min-height:clamp(590px,calc(100svh - 72px),960px);display:grid;align-items:center;background:var(--olive);border-bottom:1px solid var(--line)}
.hero-grid{position:absolute;inset:-12px;background:linear-gradient(#f1f0e910 1px,transparent 1px),linear-gradient(90deg,#f1f0e910 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent 28%,#000 75%);translate:calc(var(--mx,0px) * .35) calc(var(--my,0px) * .35);pointer-events:none}
.hero-word{position:absolute;top:14%;left:50%;width:100%;text-align:center;transform:translateX(-50%);font:700 clamp(86px,17.3vw,340px)/.85 Space,sans-serif;letter-spacing:-.066em;color:var(--accent);white-space:nowrap;translate:calc(var(--mx,0px) * -.35) var(--depth,0px);animation:headline-slice 1.3s var(--snap) both;pointer-events:none}.hero-word:lang(ar){font:800 clamp(85px,13.2vw,270px)/1.35 Alexandria,sans-serif;letter-spacing:0;top:19%;transform:translateX(-50%) scaleX(1.13)}.hero-echo{position:absolute;inset:0;opacity:0;color:var(--cream)}.hero-word.signal-live .hero-echo{animation:headline-echo .52s steps(1,end)}
.hero-photo{position:absolute;z-index:2;left:54%;bottom:3%;height:86%;width:min(65vw,1040px);transform:translateX(-50%);translate:var(--mx,0px) calc(var(--my,0px) + var(--drift,0px));filter:drop-shadow(8px 15px 0 #1319107d);pointer-events:none;animation:subject-slice 1.65s var(--snap) both,subject-float 6.6s 1.65s ease-in-out infinite}.hero-photo:dir(rtl){left:46%}.hero-photo img{height:100%;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(#000 92%,transparent)}
.hero-index,.hero-bottom{position:absolute;z-index:4;inset-inline:var(--pad);display:flex;justify-content:space-between;gap:12px;animation:soft-in .9s .7s both}.hero-index{top:26px;color:var(--muted)}.hero-bottom{bottom:0;padding:16px 0;border-top:1px solid #f1f0e963}.hero-bottom:hover{color:var(--accent)}
.hero-copy{position:relative;z-index:3;margin:clamp(68px,10vh,140px) var(--pad) 0;max-width:min(30vw,340px);opacity:var(--fade,1)}.hero-copy h1{font-size:clamp(41px,5vw,86px);line-height:.88;letter-spacing:-.065em;white-space:pre-line;margin:14px 0;text-shadow:2px 3px var(--olive)}.hero-copy h1:lang(ar){font-size:clamp(38px,4.1vw,74px);letter-spacing:0;line-height:1.28}.hero-copy p{text-shadow:1px 2px var(--olive);margin-bottom:16px}.motion-ready .hero-copy>*{animation:line-rise .9s var(--snap) both}.motion-ready .hero-copy h1{animation-delay:.44s}.motion-ready .hero-copy p{animation-delay:.54s}.motion-ready .hero-copy .primary{animation-delay:.64s}
.primary,.outline{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:space-between;gap:15px;min-height:48px;padding:5px;border:1px solid var(--accent);padding-inline-start:17px;border-radius:999px;background:var(--accent);color:var(--ink);font-size:13px;font-weight:700;translate:var(--bx,0px) var(--by,0px);transition:translate .45s var(--snap),color .32s,background .32s,border-color .32s}.primary b,.outline b{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--cream);transition:rotate .55s var(--snap),scale .55s var(--snap)}.outline{background:transparent;border-color:var(--line);color:var(--cream)}.outline b{background:var(--surface)}.primary::before,.outline::before{content:"";position:absolute;inset:-1px;z-index:-1;background:var(--cream);border-radius:inherit;translate:0 106%;transition:translate .52s var(--snap)}.primary:hover,.outline:hover{color:var(--ink);border-color:var(--cream)}.primary:hover::before,.outline:hover::before,.primary:focus-visible::before,.outline:focus-visible::before{translate:0}.primary:hover b,.outline:hover b{rotate:-12deg;scale:.92}.primary:active,.outline:active{scale:.97}
.directory,.about{padding-block:clamp(58px,7vw,116px)}.section-index{position:relative;display:flex;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid var(--line);margin-bottom:27px;color:var(--muted)}.section-index::before{content:"";position:absolute;inset:-1px 0 auto;height:1px;background:var(--accent);transform-origin:left}.section-index:not(.is-waiting)::before{animation:line-trace 1.45s var(--snap) both}.section-index.is-waiting::before{scale:0 1}.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:27px}.section-head h2,.about h2{font-size:clamp(45px,8vw,124px);line-height:.9;letter-spacing:-.075em}.section-head h2:lang(ar),.about h2:lang(ar){font-size:clamp(32px,5.3vw,88px);letter-spacing:0;line-height:1.28}.section-head p,.about p{max-width:39ch;color:var(--muted)}
.floors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1.5vw,20px);align-items:start}.floor,.card{width:100%;min-width:0;padding:0;text-align:start;overflow:hidden;border:1px solid var(--line);background:var(--surface);border-radius:14px;transition:background .26s,color .26s,border-color .26s,translate .4s var(--snap)}.floor:hover{translate:0 -3px;border-color:var(--accent)}.floor[aria-pressed=true]{background:var(--accent);color:var(--ink);border-color:var(--accent)}.floor-cover,.card-img{display:block;aspect-ratio:1080/466;position:relative;isolation:isolate;overflow:hidden;background:var(--olive)}.floor-cover img,.card-img img{width:100%;height:100%;object-fit:cover}.floor-cover small{position:absolute;inset-block-start:8px;inset-inline-start:8px;padding:4px 7px;background:#222720ed;color:var(--cream);border:1px solid #f1f0e966}.floor-caption,.card-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;min-height:62px}.floor-caption strong{font-size:clamp(.78rem,1.25vw,1rem)}.floor-count,.card-meta i{display:grid;place-items:center;width:34px;height:34px;flex:none;border:1px solid currentColor;border-radius:50%;font-size:.75rem;font-style:normal}
.archive-tools{margin-top:22px}.archive{padding-top:28px}.archive h3{scroll-margin-top:16px;font-size:clamp(1.2rem,2.4vw,2rem);margin-bottom:12px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;align-items:start}.card{border-radius:13px}.card:hover,.card:focus-visible{border-color:var(--accent)}.card-meta{height:72px}.card-meta small{display:block;color:var(--muted);font-size:10px;margin-bottom:3px}.card-meta strong{font-size:15px;line-height:1.25;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.card-meta i{color:var(--accent);border-color:var(--line);transition:rotate .5s var(--snap),background .35s,color .35s}.card:is(:hover,:focus-visible) i{rotate:12deg;background:var(--accent);color:var(--ink)}.card-img::after,.floor-cover::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px var(--accent);opacity:0;transition:opacity .25s;pointer-events:none}.card:hover .card-img::after,.floor:hover .floor-cover::after{opacity:1}
.about{border-block:1px solid var(--line);background:var(--olive)}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.about p+p{margin-top:16px}footer{display:flex;justify-content:space-between;gap:12px;padding-block:18px;color:var(--muted)}footer a:hover{color:var(--accent)}
dialog{width:min(920px,100% - 24px);max-height:90dvh;background:var(--ink);color:var(--cream);border:1px solid var(--line);border-radius:15px;padding:0;overscroll-behavior:contain}dialog[open]{animation:dialog-rise .48s var(--snap) both}dialog::backdrop{background:#11170fdf;animation:soft-in .33s both}body:has(dialog[open]){overflow:hidden}.dialog-top{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--ink);padding:10px 16px;border-bottom:1px solid var(--line)}.dialog-top h2{font-size:clamp(22px,4vw,38px);line-height:1.3}.eyebrow,.dialog-top p{color:var(--muted)}.dialog-top button{width:44px;height:44px;flex:none;font-size:28px;line-height:1;border-radius:50%;background:none;border:1px solid var(--line);transition:rotate .35s var(--snap),background .3s,color .3s}.dialog-top button:hover{rotate:12deg;background:var(--cream);color:var(--ink)}.project-images{display:grid;gap:6px;padding:8px}.project-images img{height:auto}.project-images figcaption{padding:6px 8px;font-size:12px;color:var(--muted)}
.reveal.is-waiting:not(:focus-within){opacity:0;transform:translateY(38px);clip-path:inset(0 0 30%)}.reveal{clip-path:inset(0);transition:opacity .65s var(--snap),transform .95s var(--snap),clip-path .95s var(--snap);transition-delay:var(--reveal-delay,0ms)}.floor.reveal:not(.is-waiting){transition:background .26s,color .26s,border-color .26s,translate .4s var(--snap),opacity .65s var(--snap),transform .95s var(--snap),clip-path .95s var(--snap)}
.scan-grid{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden}.scan-grid i{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:2px;background:var(--accent);opacity:0;animation:scan var(--duration) var(--d) steps(1,end) infinite}.signal-live:is(.floor-cover,.card-img,.section-head)::before{content:"";position:absolute;inset:0;background:var(--accent);z-index:2;pointer-events:none;animation:frame-signal .5s steps(1,end) both}.section-head{position:relative}.pointer-aura{position:fixed;top:0;left:0;z-index:12;pointer-events:none;width:25px;height:25px;opacity:0;border:1px solid var(--accent);border-radius:50%;transform:translate3d(var(--px,-50px),var(--py,-50px),0) translate(-50%,-50%) scale(var(--ps,1));transition:opacity .2s,border-radius .25s}.pointer-aura.tracking{opacity:.55}.pointer-aura.action{--ps:1.43;border-radius:8px}.pointer-aura.action::after{content:"";position:absolute;inset:-5px;border:1px dashed var(--muted);border-radius:inherit}
@keyframes nav-drop{from{translate:0 -100%}to{translate:0}}@keyframes line-rise{from{opacity:0;transform:translateY(105%) skewY(4deg)}to{opacity:1;transform:none}}@keyframes soft-in{from{opacity:0}to{opacity:1}}@keyframes headline-slice{0%{opacity:0;clip-path:inset(50% 0 50%);translate:2% var(--depth,0px);scale:.97}17%{opacity:.65;clip-path:inset(48% 0 34%);translate:-2% var(--depth,0px)}30%{opacity:.95;clip-path:inset(14% 0 38%);translate:1% var(--depth,0px)}55%,100%{opacity:1;clip-path:inset(0)}}@keyframes subject-slice{0%{opacity:0;clip-path:inset(66% 0 23%);scale:.98}13%{opacity:.82;clip-path:inset(46% 0 34%)}23%{clip-path:inset(17% 0 29%)}33%{clip-path:inset(9% 0 12%)}62%,100%{opacity:1;clip-path:inset(0);scale:1}}@keyframes subject-float{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-9px)}}@keyframes headline-echo{0%,28%,61%,100%{opacity:0}12%,72%{opacity:.8;clip-path:inset(51% 0 39%);translate:14px 0}38%,82%{opacity:.65;clip-path:inset(16% 0 75%);translate:-12px 0}}@keyframes frame-signal{0%,16%,45%,71%,100%{opacity:0}8%{opacity:.5;clip-path:inset(28% 61% 69% 7%);translate:-5px 0}30%{opacity:.39;clip-path:inset(73% 9% 25% 56%);translate:7px 0}55%{opacity:.29;clip-path:inset(56% 34% 42% 38%)}82%{opacity:.34;clip-path:inset(12% 14% 87% 68%)}}@keyframes scan{0%,3%,6%,100%{opacity:0}2%{opacity:.55;translate:-7px 0}5%{opacity:.3;translate:8px 0}}@keyframes line-trace{0%{scale:0 1}62%{scale:1 1;opacity:1}100%{opacity:.28}}@keyframes dialog-rise{from{opacity:0;translate:0 22px;scale:.98}to{opacity:1;translate:0;scale:1}}
@media(max-width:780px){.floors,.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-photo{width:84vw;left:62%;bottom:7%}.hero-photo:dir(rtl){left:38%}.hero-word{top:21%}}
@media(max-width:540px){.bar{height:62px}.brand{font-size:11px}.monogram{width:30px;font-size:15px}.bar nav{gap:9px;font-size:11px}.hero{min-height:660px;align-items:end}.hero-index,.hero-bottom{font-size:9px}.hero-word,.hero-word:lang(ar){top:18%;font-size:18vw}.hero-photo,.hero-photo:dir(rtl){height:56%;width:95%;left:50%;bottom:30%}.hero-copy{margin:0 var(--pad) 61px;max-width:290px}.hero-copy h1,.hero-copy h1:lang(ar){font-size:38px;margin-block:8px}.hero-copy p{font-size:13px;margin-bottom:8px}.section-head{display:block}.section-head p{margin-top:14px}.cards{gap:8px}.card-meta,.floor-caption{padding:8px}.card-meta strong{font-size:12px}.floor-count,.card-meta i{width:27px;height:27px}.about-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal.is-waiting{opacity:1!important;transform:none!important;clip-path:none!important}.read-progress,.scan-grid,.pointer-aura{display:none}.hero-word,.hero-photo,.primary,.outline{translate:none}.hero-copy{opacity:1}}
.hero-word:lang(ar){top:22%;font-size:clamp(64px,10.5vw,205px);transform:translateX(-50%)}@media(max-width:540px){.hero-word:lang(ar){top:29%;font-size:11.2vw}}
.hero-word:lang(ar){transform:translateX(-50%) scaleX(1.29)}
.contact{padding-block:clamp(58px,7vw,116px);background:var(--olive);border-bottom:1px solid var(--line)}.contact-heading{margin-bottom:0}.contact-heading p{margin-top:18px}.contact-actions{display:grid;justify-items:start;gap:12px;min-width:min(32vw,300px)}.contact-number{font-size:14px;letter-spacing:.07em;color:var(--muted)}.contact-number:hover,.footer-social a:hover{color:var(--accent)}.footer-social{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.footer-social a{min-height:34px;display:inline-flex;align-items:center}.wa-float{position:fixed;inset-block-end:max(17px,env(safe-area-inset-bottom));inset-inline-end:clamp(14px,2.6vw,40px);z-index:9;width:56px;height:56px;border-radius:50%;border:1px solid var(--cream);background:var(--accent);color:var(--ink);display:grid;place-items:center;transition:scale .35s var(--snap)}.wa-float:hover{scale:1.1}.wa-float::before{content:"";position:absolute;inset:0;border:1px solid var(--accent);border-radius:inherit;animation:wa-ring 2.7s ease-out infinite;pointer-events:none}@keyframes wa-ring{0%{scale:1;opacity:.72}66%,100%{scale:1.38;opacity:0}}footer{padding-inline-end:46px;align-items:center;flex-wrap:wrap}@media(max-width:540px){.contact-actions{margin-top:22px}.wa-float{width:48px;height:48px}.wa-float svg{width:23px;height:23px}}
