@font-face{font-family:'Cairo Premium';src:url('assets/fonts/Cairo-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Plex;src:url('assets/fonts/IBMPlexSansArabic-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Plex;src:url('assets/fonts/IBMPlexSansArabic-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
:root{--cream:#f5f3ed;--navy:#173d50;--copper:#a76d4e;--muted:#536974;--line:#cfd8d7}
body{font-weight:500;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,.proof .arabic{font-family:'Cairo Premium',Plex,sans-serif;font-weight:600;letter-spacing:0!important}
.title{font-size:clamp(60px,6.2vw,91px);line-height:1.42;margin:8px 0 0}
.intro{padding-top:34px;gap:7%;padding-bottom:18px}
.intro-side{padding-bottom:26px}.intro-side p{font-size:19px;color:#405d6d;line-height:1.95}
.kicker{font-size:13px;font-weight:600;letter-spacing:0;color:#986143}
.nav{font-size:15px}.contact-link,.round-link{font-weight:600;font-size:15px}
.section-heading h2{font-size:clamp(34px,3.4vw,48px);line-height:1.6}
.section-heading p,.supply p,.service p{color:#526b77;font-size:16px}
.service h3{font-size:22px}.service .num{font-size:14px}.proof div{font-size:13px;color:#526d7a}
.proof strong{font-weight:700}.proof .arabic{font-size:17px}
.story h2{font-size:clamp(34px,3.5vw,49px);line-height:1.6}.story p{font-size:17px;color:#ccdadf}
.client figcaption{font-size:12px;color:#526b77}.project figcaption{font-size:18px}.project figcaption small,.project-note{color:#526b77;font-size:13px}
.contact-grid h3{font-size:14px}.contact-grid p{font-size:15px;color:#526b77}
.landscape{height:490px;border-radius:65px 7px 7px 7px;background:#dce4e3;box-shadow:0 22px 45px -28px #173d5059}
.render-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 53%;display:block}
.landscape:after{display:none}.photo-mode .engineering-canvas{visibility:hidden}.landscape:not(.photo-mode)>.render-photo{visibility:hidden}
.photo-mode .orbit-hint,.photo-mode .orbit-controls{display:none}
.has-3d .scene-label{z-index:3;left:40px;top:28px;color:#173d50;font-weight:700;padding:8px 13px;background:#f5f3edec;border-radius:4px;letter-spacing:.1em}
.has-3d .caption{z-index:3;bottom:25px;right:25px;background:#f5f3edf2;color:#173d50;font-size:13px;padding:12px 16px;box-shadow:0 5px 20px #173d501a}
.has-3d .caption small{font-size:10px;letter-spacing:.05em}.scene-toggle{z-index:4;box-shadow:0 5px 25px #173d5026;padding:5px}.scene-toggle button{font-size:12px;font-weight:600;padding:10px 14px}
.project-art{height:335px;min-height:0;border-radius:7px;box-shadow:0 20px 35px -25px #173d5050}.project-art .render-photo{object-position:center;transition:transform .7s}.project-art:hover .render-photo{transform:scale(1.035)}
.projects{grid-template-columns:1.05fr .95fr;gap:30px}.project:nth-child(2){padding-top:55px}
@media(max-width:850px){.title{font-size:61px}.intro-side p{font-size:17px}.landscape{height:420px}.proof div{font-size:12px}.proof .arabic{font-size:16px}.scene-toggle button{font-size:11px;padding:8px 10px}.project-art{height:280px}}
@media(max-width:560px){.nav{font-size:12px;gap:13px}.intro{padding-top:27px;gap:16px}.title{font-size:53px;line-height:1.5}.intro-side{padding-bottom:0}.intro-side p{font-size:17px;line-height:1.9}.landscape,.landscape.has-3d{height:340px;border-top-left-radius:40px}.render-photo{object-position:43% center}.has-3d .scene-label{font-size:7px;left:26px;top:19px;padding:6px 10px}.has-3d .caption{font-size:10px;bottom:68px;right:12px;padding:8px 10px}.has-3d .caption small{font-size:8px}.scene-toggle{bottom:15px;left:10px;right:10px;justify-content:center}.scene-toggle button{font-size:10px;padding:8px 10px}.proof{gap:14px}.proof div{font-size:10px}.proof .arabic{font-size:14px}.section-heading h2,.story h2{font-size:30px}.service h3{font-size:20px}.section-heading p,.service p,.story p{font-size:15px}.projects{grid-template-columns:1fr}.project:nth-child(2){padding-top:0}.project-art{height:240px}.project figcaption{font-size:16px}.project figcaption small,.project-note{font-size:11px}.orbit-hint{top:52px}.supply h2{font-size:32px}.footer h2{font-size:27px}.footer-head .round-link{font-size:12px}.contact-grid p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.project-art .render-photo{transition:none}}
.concrete-section{padding-top:0}
.concrete-comparison{position:relative;aspect-ratio:1.5;width:100%;overflow:hidden;border-radius:9px;background:#d9ded9;direction:ltr;box-shadow:0 24px 50px -35px #173d5066}
.concrete-layer{position:absolute;inset:0;background-image:url('assets/concrete-four-storey-v2.webp');background-repeat:no-repeat;background-size:200% auto}
.concrete-before{background-position:left center;clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.concrete-after{background-position:right center}
.concrete-label{position:absolute;top:22px;padding:9px 14px;background:#f5f3edf2;border-radius:4px;direction:rtl;color:#173d50;font-size:13px;font-weight:600;pointer-events:none}
.label-before{left:22px}.label-after{right:22px}
.concrete-divider{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:white;box-shadow:0 0 12px #173d5040;transform:translateX(-50%);pointer-events:none}
.concrete-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;display:grid;place-items:center;border:2px solid white;border-radius:50%;background:#173d50;color:white;font:22px Manrope;box-shadow:0 6px 18px #173d5033}
.concrete-comparison input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:2;touch-action:pan-y}
.concrete-comparison:focus-within{outline:3px solid #a76d4e;outline-offset:4px}
.concrete-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:18px}.concrete-toolbar>span{font-size:13px;color:#526b77}.concrete-toolbar>div{display:flex;gap:5px;padding:4px;background:#e7ece8;border-radius:30px}
.concrete-toolbar button{border:0;border-radius:24px;background:none;color:#173d50;font-family:Plex,sans-serif;font-weight:600;font-size:13px;padding:8px 19px}.concrete-toolbar button[aria-pressed=true]{background:#173d50;color:white}
@media(max-width:560px){.concrete-comparison{aspect-ratio:1.5}.concrete-label{font-size:9px;padding:7px 8px;top:12px}.label-before{left:10px}.label-after{right:10px}.concrete-divider>span{width:38px;height:38px;font-size:18px}.concrete-toolbar{align-items:flex-start;gap:12px}.concrete-toolbar>span{font-size:10px;max-width:115px}.concrete-toolbar button{font-size:11px;padding:7px 12px}}
.client--dark{background:#173d50;border-color:#173d50}.client--dark figcaption{color:#e7eff1}.client figcaption{overflow-wrap:anywhere;line-height:1.65}.client figcaption small{display:block;font-family:Plex,sans-serif;font-size:10px;font-weight:500;margin-top:5px}.client img{max-width:100%}
.project-filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:12px}
.project-filters button{font:500 13px Plex,sans-serif;border:1px solid var(--line);color:var(--navy);background:transparent;border-radius:24px;padding:10px 18px;cursor:pointer}
.project-filters button[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.project-filters button:focus-visible,.real-project-image:focus-visible,.project-lightbox button:focus-visible{outline:3px solid var(--copper);outline-offset:4px}
.gallery-status{font-size:12px;color:var(--muted);margin:0 0 22px}
.real-project-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}
.real-project-card{margin:0;min-width:0}.real-project-card[hidden]{display:none}
.real-project-image{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:#e6e5df;border:1px solid #d8ded9}
.real-project-image img{width:100%;height:100%;object-fit:contain;display:block}
.real-project-number,.real-project-enlarge{position:absolute;bottom:12px;background:#f5f3edf0;color:var(--navy);border-radius:5px;line-height:1;padding:9px;font:500 12px Manrope,sans-serif}
.real-project-number{right:12px}.real-project-enlarge{left:12px;font-size:20px;padding:7px 10px}
.real-project-card figcaption{padding:17px 0 13px;border-bottom:1px solid var(--line)}
.real-project-card figcaption small{font-size:11px;color:#986143}.real-project-card h3{font-size:17px;line-height:1.7;margin:6px 0}.real-project-card figcaption p{font-size:12px;color:var(--muted);margin:0;line-height:1.8}
.project-lightbox{border:0;border-radius:12px;background:#f5f3ed;padding:48px 18px 14px;width:min(1100px,94vw);max-height:92dvh;overflow:auto;color:var(--navy)}
.project-lightbox::backdrop{background:#09202be8}.project-lightbox>img{display:block;width:100%;height:min(65dvh,700px);object-fit:contain;background:#e9e8e1}
.gallery-close{position:absolute;top:5px;left:12px;font-size:30px!important}.project-lightbox button{border:0;background:none;color:var(--navy);font:600 24px Plex,sans-serif;cursor:pointer;min-width:44px;min-height:44px}
.gallery-lightbox-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;text-align:center}.gallery-lightbox-footer p{font-size:14px;line-height:1.7;margin:0}.gallery-lightbox-footer span{font:12px Manrope,sans-serif;color:var(--muted)}
.gallery-modal-open{overflow:hidden}
.real-project-image img,.project-lightbox>img{user-select:none;-webkit-user-drag:none}
.project-photo-rights{font-size:12px;line-height:1.9;color:var(--muted);margin:12px 0 22px}
.footer .contact-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:28px 0 0}
.contact-card{min-width:0;background:#f8f8f3;border:1px solid #cbd5cf;border-radius:18px;padding:28px;box-shadow:0 10px 32px #173d5006}
.contact-card-heading{display:flex;align-items:center;gap:15px;margin-bottom:24px}
.contact-icon{display:grid;place-items:center;width:52px;height:52px;flex-shrink:0;border-radius:15px;background:#e8eeec;color:#173d50}
.contact-icon svg{width:27px;height:27px}.contact-card--whatsapp .contact-icon{background:#e3eee6;color:#2a6246}
.footer .contact-card h3{font-size:23px;font-weight:600;color:var(--navy);line-height:1.5;margin:0}
.footer .contact-card .contact-hours{font-size:15px;line-height:1.8;margin:4px 0 0;color:#5d716f}
.contact-actions{display:grid;gap:12px}
.footer .contact-action{display:grid;grid-template-columns:1fr auto 18px;gap:12px;align-items:center;min-height:60px;padding:12px 16px;border:1px solid #d0dad4;border-radius:11px;background:#fff;color:var(--navy);text-decoration:none;transition:background .2s,border-color .2s,transform .2s}
.contact-action-label{font-size:13px;font-weight:500;line-height:1.6}.contact-number{font-family:Manrope,sans-serif;font-size:17px;font-weight:600;white-space:nowrap;letter-spacing:.15px}.contact-action-arrow{color:var(--copper);font:20px Manrope,sans-serif}
.footer .contact-action:hover{background:#eef3ee;border-color:#82998c;transform:translateY(-2px)}
.contact-action:focus-visible,.contact-email:focus-visible{outline:3px solid var(--copper);outline-offset:4px}
.contact-holiday-note{display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;font-size:13px;color:#52675f;line-height:1.9;margin:18px 0 28px}
.contact-holiday-note>span{font-size:20px;flex-shrink:0}
.contact-details{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;border-top:1px solid #cbd5cf;padding:24px 0 12px}
.contact-details>div{min-width:0}.contact-details h3{font-size:13px;color:#805a43;margin:0 0 8px;font-weight:500}.contact-details p{font-size:14px;line-height:1.9;color:#526b77;margin:0}.contact-email{display:inline-block;font-size:14px;font-weight:600;line-height:1.9;overflow-wrap:anywhere;color:var(--navy)}
@media(max-width:1000px){.contact-card{padding:22px}.footer .contact-action{grid-template-columns:1fr 18px;gap:5px 12px}.contact-action-label{grid-column:1;grid-row:1}.contact-number{grid-column:1;grid-row:2;justify-self:start}.contact-action-arrow{grid-column:2;grid-row:1 / 3}}
@media(max-width:650px){.footer .contact-cards{grid-template-columns:1fr;gap:16px}.contact-card{padding:22px}.contact-card-heading{margin-bottom:18px}.footer .contact-card h3{font-size:21px}.contact-details{grid-template-columns:1fr;gap:20px}.contact-holiday-note{font-size:12px}.contact-number{font-size:17px}}
@media(prefers-reduced-motion:reduce){.footer .contact-action{transition:none}.footer .contact-action:hover{transform:none}}
.footer .contact-action--icon{display:flex;gap:14px;min-height:64px}.contact-action--icon .contact-button-icon{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;color:var(--navy)}.contact-button-icon svg{width:24px;height:24px}.contact-card--whatsapp .contact-button-icon{color:#2a6246}.contact-action--icon .contact-action-label{font-size:16px;font-weight:600}.contact-action--icon .contact-action-arrow{margin-inline-start:auto}
.title{font-size:clamp(36px,4.1vw,60px);line-height:1.6;overflow-wrap:normal}.intro>div,.intro-side,.footer-head>div{min-width:0}.footer-head h2{font-size:clamp(24px,2.8vw,38px);line-height:1.6}.proof{flex-wrap:wrap}.proof>div{min-width:0}.clients-top h2{line-height:1.7}.story h2{font-size:clamp(28px,2.8vw,40px)}
@media(max-width:850px){.title{font-size:clamp(28px,4.6vw,39px)}}
@media(max-width:560px){.title{font-size:clamp(28px,7.4vw,40px)}.footer-head{align-items:flex-start;flex-direction:column}.footer-head h2{font-size:25px}.clients-top h2{font-size:23px}}
@media(max-width:900px){.real-project-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.real-project-gallery{grid-template-columns:1fr;gap:24px}.project-filters{gap:7px}.project-filters button{font-size:11px;padding:9px 12px}.real-project-card h3{font-size:17px}.gallery-lightbox-footer p{font-size:11px}.project-lightbox{padding:44px 10px 10px}.project-lightbox>img{height:60dvh}}