@font-face{font-family:Arabic;src:url('assets/arabic.ttf') format('truetype');font-display:swap}
:root{--paper:#f4f3ef;--ink:#231f20;font-family:Arabic,Tahoma,Arial,sans-serif;color:var(--ink);background:#fff;font-synthesis:none;scroll-behavior:smooth}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{background:none;border:0}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #79452c;outline-offset:5px}button:hover,a:hover{opacity:.68}img{max-width:100%;display:block}p{margin:0}h1,h2{margin:0;font-weight:400}section,[id]{scroll-margin-top:30px}
.page{width:85.64%;max-width:1400px;margin:69px auto 0;background:var(--paper);padding-bottom:160px}.header{margin:0 10px;min-height:62px;border-bottom:1px solid var(--ink);display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;font-size:.875rem;gap:16px}.brand{justify-self:start}.brand img{width:91px;height:auto}.header nav{display:flex;gap:34px;justify-content:center;white-space:nowrap}.contact-link{justify-self:end;padding:12px 0;font-size:.875rem}.hero-intro{min-height:182px;padding:45px 8%;display:flex;align-items:center;justify-content:space-between;gap:32px}.hero h1 img{width:304px;height:auto}.hero-intro .pill{margin-left:10%}.pill{display:inline-flex;align-items:center;justify-content:center;min-width:136px;min-height:37px;padding:7px 22px;border:1px solid #8f8c87;border-radius:99px;font-size:.875rem;line-height:1.5;font-weight:400}.hero-image{width:100%;height:auto;aspect-ratio:877/363;object-fit:cover}.inset{margin-inline:8%}.projects{padding-top:55px}.projects h2 img{width:136px;height:auto}.project-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:62px}.project{padding:0;text-align:right;display:block;align-self:start}.project>img{width:100%;height:auto;aspect-ratio:180/229;object-fit:cover}.project>span{display:block;font-size:.875rem;line-height:1.5;margin-top:5px}.more-projects{display:flex;margin:44px auto 0}.split{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding-top:66px;align-items:start}.section-intro h2 img{width:137px;height:auto}.section-intro h2{margin-bottom:24px}.section-intro p{font-size:1rem;line-height:1.65}.section-intro .pill{display:flex;margin:25px auto 0}.accordion{margin-top:73px;font-size:1rem}.accordion details{border-top:1px solid var(--ink)}.accordion details:last-child{border-bottom:1px solid var(--ink)}summary{list-style:none;cursor:pointer;min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:5px 16px;font-size:1rem}summary::-webkit-details-marker{display:none}summary:after{content:'';width:12px;height:12px;border-left:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);flex-shrink:0}details[open]>summary:after{transform:rotate(-45deg)}details p{font-size:1rem;line-height:1.6;padding:3px 16px 16px}.inline-contact{font-size:.875rem;text-decoration:underline;margin:0 16px 15px}.content{padding-top:115px}.content .accordion{margin-top:4px}.content h2 img{width:131px}.secondary{color:#706d68;font-size:.875rem!important;margin-top:14px}dialog{border:1px solid var(--ink);background:var(--paper);color:var(--ink);padding:52px 35px 35px;max-width:min(540px,calc(100% - 32px));width:100%;max-height:90dvh;overflow:auto}dialog::backdrop{background:#1e1b18aa}dialog h2{font-size:1.6rem;margin-bottom:14px}dialog p{font-size:1rem;line-height:1.8}.close{position:absolute;top:6px;left:13px;font-size:2rem;width:40px;height:40px}.project-dialog{max-width:min(650px,calc(100% - 32px))}.project-dialog>img{max-height:52dvh;width:auto;max-width:100%;margin:0 auto 24px}.gallery-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:24px}.gallery-controls .pill{min-width:95px}body.modal-open{overflow:hidden}
@media(min-width:1200px){.page{margin-top:5vw}.header{min-height:80px}.hero-intro{min-height:240px}.hero h1 img{width:390px}.hero-intro .pill{min-width:170px}.projects{padding-top:65px}.projects h2 img{width:174px}.project-grid{margin-top:70px;gap:14px}.split{gap:40px;padding-top:80px}.section-intro h2 img{width:175px}.content h2 img{width:168px}.content{padding-top:130px}.accordion{margin-top:94px}.project>span{font-size:1rem}.header,.contact-link,.pill{font-size:1rem}}
@media(max-width:760px){.page{width:94%;margin-top:20px;padding-bottom:85px}.header{grid-template-columns:1fr 1fr;padding:12px 0;gap:14px}.brand img{width:85px}.header nav{grid-column:1/-1;grid-row:2;gap:22px;justify-content:space-between;font-size:.875rem;padding:10px 0 4px}.contact-link{grid-column:2;grid-row:1}.hero-intro{padding:35px 6%;min-height:185px;flex-direction:column;align-items:flex-start;gap:24px}.hero h1 img{width:304px}.hero-intro .pill{margin:0}.hero-image{aspect-ratio:1.5;object-position:center}.inset{margin-inline:6%}.projects{padding-top:35px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 12px;margin-top:30px}.project>span{font-size:.875rem}.more-projects{margin-top:30px}.split{grid-template-columns:1fr;padding-top:65px;gap:25px}.section-intro h2{margin-bottom:18px}.accordion,.content .accordion{margin-top:0}.section-intro .pill{margin-top:20px}.content{padding-top:65px}.section-intro p,details p{font-size:1rem}summary{min-height:46px}.projects h2 img{width:126px}.section-intro h2 img{width:126px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}}
[hidden]{display:none!important}.hero h1{font-size:clamp(2rem,3.8vw,3.6rem);line-height:1.45}.eyebrow{font-size:.875rem;margin-bottom:14px}.hero-intro{gap:40px;padding-block:50px}.hero-copy{max-width:660px;font-size:1rem;line-height:1.9;margin-top:20px}.hero-actions{display:flex;flex-direction:column;gap:20px;flex-shrink:0;text-align:center}.hero-intro .pill{margin:0}.text-link{text-decoration:underline;text-underline-offset:5px;font-size:1rem}.about{padding-top:70px;display:grid;grid-template-columns:1fr 1fr;gap:40px}.about p{font-size:1rem;line-height:1.95}h2{font-size:clamp(1.8rem,3vw,2.8rem);line-height:1.5}.split .accordion{margin-top:0}.section-copy{font-size:1rem;line-height:1.9;max-width:650px;margin-top:18px}.project-grid{margin-top:35px;row-gap:35px}.project>span{margin-top:12px;line-height:1.8}.project:hover{opacity:1}.project img{transition:filter .2s}.project:hover img{filter:brightness(.92)}summary{min-height:60px;padding:12px 5px}summary:after{transform:rotate(-45deg)}details[open]>summary:after{transform:rotate(135deg)}details p{line-height:1.9;padding-inline:5px}.contact{margin-top:60px;border-top:1px solid #aaa;padding-top:55px}.contact .whatsapp{margin:24px 0;display:inline-flex}.contact-details{display:flex;align-items:flex-start;flex-direction:column;gap:12px;font-family:Arial,sans-serif;font-size:1rem}.contact form{display:flex;flex-direction:column;gap:10px}.contact label{font-size:1rem}.contact input,.contact textarea{width:100%;border:1px solid #aaa;background:transparent;padding:12px;font:inherit;font-size:1rem;color:inherit;border-radius:0;margin-bottom:10px}.contact input:focus,.contact textarea:focus{outline:2px solid #79452c;outline-offset:2px}.contact input[type=email]{direction:ltr;text-align:right}.contact form .pill{align-self:flex-start}.form-note,#form-status{font-size:.875rem;line-height:1.8;color:#5a5650}footer{border-top:1px solid #aaa;margin-top:70px!important;padding-top:22px;font-size:.875rem}.page{padding-bottom:40px}.project-dialog{max-width:min(1050px,calc(100% - 24px));padding:45px 24px 24px}.project-dialog h2{font-size:1.4rem}.gallery-stage{height:48dvh;display:flex;align-items:center;justify-content:center}.gallery-stage img{max-height:100%;max-width:100%;object-fit:contain}.thumbnails{display:flex;justify-content:center;gap:10px;margin-top:18px}.thumbnails button{padding:3px;border:1px solid transparent;width:90px}.thumbnails button[aria-current=true]{border-color:var(--ink)}.thumbnails img{width:100%;height:60px;object-fit:cover}@media(max-width:760px){.about{grid-template-columns:1fr;gap:20px;padding-top:45px}.hero-actions{flex-direction:row;align-items:center;flex-wrap:wrap}.hero-intro{padding-block:35px}.hero-copy{line-height:1.85}.hero h1{font-size:2.1rem}.header nav{justify-content:center;gap:28px}.contact{margin-top:45px}.gallery-stage{height:40dvh}.gallery-controls .pill{min-width:80px}.thumbnails button{width:65px}.thumbnails img{height:45px}.contact-details a{overflow-wrap:anywhere}}@media(prefers-reduced-motion:reduce){.project img{transition:none}}
@font-face{font-family:PlexArabic;src:url('assets/ibm-plex-arabic-400.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:PlexArabic;src:url('assets/ibm-plex-arabic-500.ttf') format('truetype');font-weight:500;font-display:swap}@font-face{font-family:PlexArabic;src:url('assets/ibm-plex-arabic-600.ttf') format('truetype');font-weight:600;font-display:swap}
:root{font-family:PlexArabic,Tahoma,Arial,sans-serif;background:var(--paper)}.hero h1{font-size:clamp(2.15rem,4vw,3.75rem);font-weight:500;line-height:1.4}h2{font-weight:500}summary{font-weight:500}.hero-copy,.about p,.section-intro p{font-size:1.0625rem;line-height:1.85}.hero-actions .pill{min-width:170px;min-height:42px;font-size:1rem}.primary-cta{background:#111;color:#fff;border-color:#111}.hero-slide{position:relative;isolation:isolate;overflow:hidden}.hero-slide:after{content:'';position:absolute;inset:0;background:#0003;z-index:1;pointer-events:none}.hero-image{aspect-ratio:877/363;object-fit:cover;object-position:50% 62%;width:100%;height:auto}.hero-caption{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;z-index:2;color:white;text-align:center;font-size:clamp(1.65rem,3.3vw,3.2rem);font-weight:500;line-height:1.4;text-shadow:0 2px 15px #0009}.accordion details p{font-size:1rem;line-height:1.85}.article-drafts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:32px}.content>p{font-size:1.0625rem;line-height:1.85;max-width:650px;margin-top:16px}.article-drafts article{border-top:1px solid var(--ink);padding:20px 0}.article-drafts h3{font-size:1.2rem;font-weight:500;line-height:1.7;margin:12px 0}.article-label{font-size:.875rem;color:#655f58}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.project-dialog{background:#101010;color:white;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;padding:0;margin:0;overflow:hidden}.project-dialog[open]{display:flex;align-items:center;justify-content:center}.project-dialog::backdrop{background:#101010}.gallery-stage{position:relative;display:flex;align-items:center;justify-content:center;height:auto;max-width:100vw;max-height:100dvh}.gallery-stage img{display:block;width:100%;height:auto;max-height:100dvh;object-fit:contain}.project-dialog .close{position:fixed;z-index:5;top:max(14px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));width:46px;height:46px;background:#10101080;color:#fff;font:300 36px/1 Arial,sans-serif;border-radius:50%;display:grid;place-items:center}.gallery-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:48px;height:48px;display:grid;place-items:center;background:#10101066;color:#fff;border-radius:50%;padding:11px}.gallery-arrow svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}#previous{right:14px}#next{left:14px}.gallery-arrow:hover,.project-dialog .close:hover{opacity:1;background:#101010bb}.gallery-arrow:focus-visible,.project-dialog .close:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:760px){.hero h1{font-size:2.2rem}.hero-image{aspect-ratio:1.5;object-position:50% 62%}.hero-actions{gap:14px}.hero-actions .pill{min-width:155px}.header nav{gap:15px;flex-wrap:wrap}.article-drafts{grid-template-columns:1fr;gap:12px}.hero-caption{font-size:clamp(1.45rem,5.8vw,2rem)}.gallery-stage{height:auto}.gallery-arrow{width:44px;height:44px}#previous{right:8px}#next{left:8px}}
/* Portfolio identity: restrained monochrome ornaments in document flow. */
.marked-heading{display:flex;align-items:center;gap:16px;align-self:start;min-width:0}
.marked-heading h2{min-width:0}
.brand-mark{display:block;color:#231f20;flex:0 0 auto;pointer-events:none;user-select:none}
.mark-slash{width:38px;height:30px}
.mark-single{width:44px;height:24px}
.brand-divider{display:flex;justify-content:center;margin-bottom:32px;pointer-events:none;user-select:none}
.brand-divider svg{display:block;width:180px;height:20px;max-width:100%}
.contact-divider.inset{margin-top:65px;margin-bottom:0}
.contact-divider+.contact{border-top:0;margin-top:0;padding-top:32px}
.brand-reveal.is-waiting .brand-mark{opacity:0;transform:translateY(4px)}
.brand-reveal.is-waiting .mark-slash{transform:translateY(4px) rotate(-9deg)}
.brand-reveal .brand-mark{transition:opacity .65s ease,transform .65s ease;transform-origin:center}
.brand-reveal .divider-stroke{transform-box:fill-box;transform-origin:center;transition:transform .8s ease}
.brand-reveal.is-waiting .divider-stroke{transform:scaleX(0)}
@media(max-width:760px){.marked-heading{gap:10px}.mark-slash{width:28px;height:24px}.mark-single{width:32px;height:20px}.brand-divider svg{width:120px}.brand-divider{margin-bottom:24px}.contact-divider.inset{margin-top:45px}.contact-divider+.contact{padding-top:24px}}
@media(prefers-reduced-motion:reduce){.brand-reveal .brand-mark,.brand-reveal .divider-stroke{transition:none!important}.brand-reveal.is-waiting .brand-mark{opacity:1;transform:none}.brand-reveal.is-waiting .divider-stroke{transform:none}}
.accordion .service-image{display:block;width:calc(100% - 10px);height:auto;aspect-ratio:2 / 1;object-fit:cover;object-position:center;margin:18px 5px 22px;border-radius:0}
.accordion .service-engineering{object-position:50% 65%}
.accordion .service-interior{object-position:50% 60%}
@media(max-width:760px){.accordion .service-image{margin-block:14px 18px}}
@font-face{font-family:PlexArabic;src:url('assets/ibm-plex-arabic-300.ttf') format('truetype');font-weight:300;font-display:swap}
.hero-caption{font-weight:300}
.header{grid-template-columns:auto 1fr auto}
.header-actions{display:flex;align-items:center;gap:20px;justify-self:end;white-space:nowrap}
.language-switch{font-size:.875rem;border-inline-start:1px solid #aaa;padding-inline-start:18px;line-height:1.6}
html[lang=en] .header nav{gap:24px}
html[lang=en] .hero h1{font-size:clamp(2rem,3.4vw,3.25rem);line-height:1.2;max-width:760px}
html[lang=en] .hero-copy,html[lang=en] .about p,html[lang=en] .section-intro p,html[lang=en] details p{line-height:1.7}
html[lang=en] h2{font-size:clamp(1.8rem,2.7vw,2.55rem);line-height:1.25}
html[lang=en] .project{text-align:left}
html[lang=en] .hero-caption{font-size:clamp(1.5rem,3.1vw,3rem)}
html[lang=en] .hero-intro .pill{margin:0}
html[lang=en] .contact input[type=email]{text-align:left}
html[lang=en] #previous{right:auto;left:14px}
html[lang=en] #next{left:auto;right:14px}
html[lang=en] .gallery-arrow svg{transform:rotate(180deg)}
@media(max-width:1050px) and (min-width:761px){.header nav,html[lang=en] .header nav{gap:15px}.header-actions{gap:12px}.language-switch{padding-inline-start:12px}}
@media(max-width:760px){.header{grid-template-columns:1fr auto}.header-actions{grid-column:2;grid-row:1;gap:14px}.header-actions .contact-link{padding:8px 0}.header nav,html[lang=en] .header nav{gap:18px}.hero-actions{max-width:100%}html[lang=en] .hero h1{font-size:2.1rem}html[lang=en] .hero-caption{font-size:clamp(1.4rem,5.5vw,2rem)}html[lang=en] #previous{left:8px}html[lang=en] #next{right:8px}}

.office-location{margin-top:32px;min-width:0}.office-location h3{font-size:1.15rem;font-weight:500;margin:0 0 10px}.office-location address{font-style:normal;font-size:1rem;line-height:1.9;max-width:40ch}.office-location .directions{margin:18px 0 22px;font-size:.95rem}.office-location iframe{display:block;width:100%;height:260px;border:1px solid #aaa;background:transparent}@media(max-width:640px){.office-location{margin-top:26px}.office-location iframe{height:240px}}

/* Align the send action with the map's lower edge on wide screens. */
@media(min-width:761px){
  .contact{align-items:stretch;margin-bottom:130px}
  .contact form{position:relative;align-self:end}
  .contact form .form-note{position:absolute;inset-inline:0;top:calc(100% + 10px);margin:0}
  .contact form #form-status{position:absolute;inset-inline:0;top:calc(100% + 44px);margin:0}
}
