:root{--bg:#F4F5F1;--paper:#efeee7;--ink:#2a2622;--mute:#716b63;--line:#d8d0c4;--gold:#a8845a;--dark:#000000;--serif:"Old Standard TT",Georgia,serif;--sans:Inter,system-ui,-apple-system,sans-serif;--pad:clamp(1.1rem,5vw,5rem);--nav:68px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:var(--nav);-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.7 var(--serif);overflow-x:hidden}
img{max-width:100%;display:block}a{color:inherit}button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
h1,h2,h3,h4{font-weight:400;line-height:1.2;margin:0 0 .6em}h2{font-size:clamp(1.7rem,4.2vw,2.8rem)}h3{font-size:1.2rem}
p{margin:0 0 1em}section{padding:clamp(3rem,8vw,6rem) var(--pad)}
.label{font:500 .75rem var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 1rem}.label.light{color:#e8d6bb}
.btn{display:inline-flex;gap:.7rem;align-items:center;padding:.85rem 1.5rem;border:1px solid var(--gold);background:none;color:var(--ink);font:500 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:.2s}
.btn:hover{background:var(--ink);color:#fff;border-color:var(--ink)}.btn.light{color:#fff;border-color:rgba(255,255,255,.7)}.btn.light:hover{background:#fff;color:var(--ink)}.btn.solid{background:var(--ink);color:#fff;border-color:var(--ink);justify-content:center;width:100%}
/* nav */
.nav{position:fixed;inset:0 0 auto;height:var(--nav);z-index:30;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 var(--pad);padding-top:env(safe-area-inset-top);background:#ded4ca;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.9rem;height:100%;padding:.55rem 0}.brand img{height:100%;width:auto;max-height:58px;max-width:32vw;object-fit:contain}
.nav nav{display:flex;gap:clamp(1rem,2.2vw,2rem);font:.74rem var(--sans);letter-spacing:.1em;text-transform:uppercase}
.nav nav a{text-decoration:none;color:var(--mute);padding:.4rem 0;border-bottom:1px solid transparent}.nav nav a:hover,.nav nav a.on{color:var(--ink);border-color:var(--gold)}
.menu-btn{display:none;width:44px;height:44px;border:0;background:none;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}.menu-btn span{width:24px;height:2px;background:var(--ink);transition:.2s}
/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;color:#f6efe4;padding-top:calc(var(--nav) + 2rem);overflow:hidden;background:#2a1d12 url(images/hero-1.jpg?v=8) 62% center/cover no-repeat}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(25,16,9,.88) 15%,rgba(25,16,9,.25) 70%),linear-gradient(0deg,rgba(25,16,9,.5),transparent 35%)}
.hero-text{position:relative;z-index:2;max-width:42rem}.kicker{font:.78rem var(--sans);letter-spacing:.28em;text-transform:uppercase}
.hero h1{font:400 clamp(2.3rem,7vw,4.4rem)/1.1 var(--sans);margin:.4em 0 .5em}.lead{opacity:.9;margin-bottom:2rem}
/* about */
.about{background:linear-gradient(rgba(28,18,10,.72),rgba(28,18,10,.72)),var(--bg) center/cover;color:#f6efe4}.about h2{margin-bottom:2rem}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.cards article{background:var(--paper);color:var(--ink);padding:clamp(1.5rem,3vw,2.5rem)}.cards h3{font-size:1.45rem}.cards p{font:.95rem/1.7 var(--sans);margin:0;color:#3a342e}
/* clients */
.clients{padding:0;background:#f8f6f1}.c-head{background:#e0d7cb;padding:clamp(1.4rem,3vw,2rem) var(--pad) clamp(1rem,2vw,1.4rem)}.c-head h2{font:700 clamp(1.1rem,2.6vw,1.7rem) var(--serif);letter-spacing:.2em;text-transform:uppercase;margin:0}.c-head .label{color:var(--mute);margin-bottom:.4rem;letter-spacing:.2em}
.logos{display:grid;gap:clamp(1.2rem,2.6vw,2.2rem);padding:clamp(1.8rem,4vw,3rem) var(--pad)}.lrow{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.lrow img{width:calc(var(--w) * 1%);height:auto;max-height:calc(var(--h) * 1.4px);object-fit:contain;flex:0 1 auto}.lrow img[alt="NAD Nisreen Atari Design"]{background:#000;padding:7px;border-radius:2px}
.excellence{background:linear-gradient(90deg,rgba(236,229,217,.96) 35%,rgba(236,229,217,.3)),var(--bg) right center/cover}.excellence div{max-width:44rem}.excellence p{font-size:.98rem}
/* services */
.services-sec{background:var(--paper)}.services{display:grid;grid-template-columns:repeat(5,1fr);margin:1rem 0 3.5rem}
.svc{padding:1rem 1.2rem 1.4rem;text-align:center;display:flex;flex-direction:column;align-items:center}.svc+.svc{border-left:1px solid var(--line)}
.num{font:.8rem var(--sans);letter-spacing:.2em;color:var(--gold);margin-bottom:.6rem}.svc h3{font-size:1.1rem}.svc p{color:var(--mute);font-size:.92rem;flex:1}
.svc button{background:none;border:0;border-bottom:1px solid var(--gold);padding:.3rem 0;font:.75rem var(--sans);letter-spacing:.06em;color:var(--gold);cursor:pointer}.svc button:hover{color:var(--ink)}
.pitch{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(1.5rem,4vw,3rem);align-items:center}.pitch h2{font-size:clamp(1.5rem,3vw,2.1rem);color:var(--gold)}.pitch-text p{font:.95rem var(--sans)}
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;height:clamp(14rem,32vw,26rem)}.strip img{width:100%;height:100%;object-fit:cover}
/* slider */
.slider{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.stage{position:relative;aspect-ratio:3/2;background:#e4ddd1;overflow:hidden}.stage>img{width:100%;height:100%;object-fit:cover}
.cap{position:absolute;left:0;right:0;top:0;padding:1rem 1.2rem 2.5rem;color:#fff;font:600 clamp(1rem,2.2vw,1.5rem)/1.2 var(--sans);background:linear-gradient(rgba(0,0,0,.55),transparent);text-shadow:0 1px 3px rgba(0,0,0,.4)}
.stage .prev,.stage .next{position:absolute;top:50%;translate:0 -50%;width:56px;height:56px;border:0;border-radius:50%;background:rgba(255,255,255,.85);font-size:2.35rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 .15rem}.prev{left:.6rem}.next{right:.6rem}.stage button:hover{background:#fff}
.count{position:absolute;right:.7rem;bottom:.6rem;background:rgba(0,0,0,.55);color:#fff;font:.72rem var(--sans);padding:.15rem .55rem;border-radius:1rem}
.thumbs{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.3rem;scrollbar-width:thin}.thumbs button{flex:0 0 auto;width:clamp(64px,10vw,96px);aspect-ratio:4/3;padding:0;border:2px solid transparent;background:none;opacity:.6;cursor:pointer}.thumbs button.on{border-color:var(--gold);opacity:1}.thumbs img{width:100%;height:100%;object-fit:cover}
/* projects */
.projects>*,.contact>*,#svcBody>*{min-width:0}
.projects{display:grid;grid-template-columns:minmax(16rem,.8fr) 2fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:start;background:#fffdf9}.proj-intro p:not(.label){color:var(--mute)}
.ptabs{display:flex;flex-direction:column;gap:.3rem;margin-top:1.5rem}.ptabs button{text-align:left;background:#F4F5F1;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:3px;box-shadow:0 4px 12px rgba(0,0,0,.08);padding:.75rem .9rem;font:.85rem/1.3 var(--sans);color:var(--mute);cursor:pointer}.ptabs button.on{border-color:var(--gold);color:var(--ink);font-weight:600}
.proj-slider .stage{aspect-ratio:16/10}
/* vip */
.vip{background:var(--paper)}.vip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.vip-grid article{border:1px solid var(--line);padding:1.3rem;text-align:center;background:#fff}.vip-grid h3{font:600 1rem var(--sans);padding-bottom:.7rem;border-bottom:1px solid var(--line)}.vip-grid p{font:.85rem var(--sans);margin:.4rem 0;color:var(--mute)}
/* gallery */
.gallery .info3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin:1rem 0 2rem}.info3 h4{font:600 .72rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}.info3 p{color:var(--mute);font-size:.92rem}
.tools{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.5rem}.tools select,.tools input,.enquiry input,.enquiry textarea{font:.9rem var(--sans);padding:.65rem .9rem;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:0;max-width:100%}.tools input{margin-left:auto;min-width:12rem}
.stones{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem 1.2rem}.stone{background:none;border:0;padding:0;cursor:zoom-in;text-align:center}.stone img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:.2s}.stone:hover img{opacity:.85}.stone span{display:block;padding:.5rem 0;font-size:1rem}.none{grid-column:1/-1}
/* contact */
.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(1.5rem,5vw,4rem);align-items:start;background:#efece4}.c-info h2{font:700 clamp(2rem,5vw,3rem) var(--sans);text-transform:uppercase}.c-info ul{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:1.4rem;font-family:var(--sans)}.c-info li{display:grid;gap:.1rem;font-size:.95rem}.c-info li b{font-size:1.05rem;display:flex;align-items:center;gap:.55rem}.contact-symbol{display:inline-grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:50%;background:#ded4ca;color:#2a2622;font-size:1rem}.c-info a{text-decoration:none;color:var(--mute)}.c-info span{color:var(--mute)}
.enquiry{background:#fff;padding:clamp(1.3rem,3vw,2.2rem);box-shadow:0 10px 40px rgba(0,0,0,.08);display:grid;gap:1rem}.enquiry h3{font:600 1.1rem var(--sans);text-align:center;margin:0}.enquiry label{display:grid;gap:.35rem;font:.82rem var(--sans)}.enquiry input,.enquiry textarea{width:100%;font-size:1rem}.hp{position:absolute;left:-9999px}
#status{font:.9rem var(--sans);margin:0;min-height:1.4em}#status.ok{color:#2f6b3f}#status.err{color:#a3361f}
/* footer */
footer{background:var(--dark);color:#cfc7ba;padding:2.5rem var(--pad) calc(1.5rem + env(safe-area-inset-bottom));font:.82rem/1.6 var(--sans)}
.f-logos{display:flex;align-items:center;gap:1.4rem;margin-bottom:2rem}.f-logos img{height:42px;width:auto}
.f-cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}footer h4{font:600 .72rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#fff}footer p{margin:0 0 .4rem}footer a{text-decoration:none}footer a:hover{color:#fff}.copy{margin-top:2rem;opacity:.55;font-size:.75rem}
/* dialogs */
dialog{border:0;padding:0;background:var(--paper);color:var(--ink);max-width:min(72rem,94vw);width:100%;max-height:92svh;overflow:auto;overscroll-behavior:contain}dialog::backdrop{background:rgba(15,12,9,.75)}
.x{position:absolute;top:.5rem;right:.7rem;z-index:5;width:44px;height:44px;border:0;background:rgba(255,255,255,.85);border-radius:50%;font-size:1.8rem;line-height:1;cursor:pointer}
#svcBody{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(1.2rem,3vw,2.5rem);padding:clamp(1.3rem,3vw,2.5rem)}.svc-txt{font:.93rem/1.7 var(--sans)}.svc-txt h2{font:400 clamp(1.8rem,4vw,2.6rem) var(--serif)}.kick{font:italic 1.15rem var(--serif);color:var(--gold)}.lead2{font-weight:600}
.svc-txt ul{list-style:none;padding:0;margin:1.2rem 0}.svc-txt li{padding:.35rem 0 .35rem 1.4rem;position:relative;border-bottom:1px solid var(--line)}.svc-txt li::before{content:"◆";position:absolute;left:0;color:var(--gold);font-size:.6rem;top:.7rem}.close{font:600 .75rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.doc a{display:inline-block;margin-top:.4rem;padding:.55rem 1rem;border:1px solid var(--gold);color:var(--ink);text-decoration:none;font:500 .8rem var(--sans)}.doc a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.svc-slider .stage{aspect-ratio:4/3}.stone-dlg{width:auto;background:#111;text-align:center;padding:0}.stone-dlg img{max-height:80svh;margin:auto}.stone-dlg p{color:#fff;font:1.1rem var(--serif);margin:.8rem}
/* tablet */
@media(max-width:1100px){.nav nav{gap:.9rem;font-size:.68rem}.services{grid-template-columns:repeat(3,1fr);row-gap:1.5rem}.svc:nth-child(4){border-left:0}.stones{grid-template-columns:repeat(3,1fr)}.vip-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
 .menu-btn{display:flex}.nav nav{position:fixed;top:calc(var(--nav) + env(safe-area-inset-top));left:0;right:0;flex-direction:column;gap:0;padding:.5rem var(--pad) 1rem;background:rgba(245,243,238,.98);border-bottom:1px solid var(--line);font-size:.85rem;translate:0 -130%;visibility:hidden;transition:.25s}
 .nav nav.open{translate:0 0;visibility:visible}.nav nav a{padding:.9rem 0;border-bottom:1px solid var(--line)}
 .menu-btn[aria-expanded=true] span:nth-child(1){translate:0 7px;rotate:45deg}.menu-btn[aria-expanded=true] span:nth-child(2){opacity:0}.menu-btn[aria-expanded=true] span:nth-child(3){translate:0 -7px;rotate:-45deg}
 .cards,.pitch,.projects,.contact,#svcBody,.gallery .info3,.f-cols{grid-template-columns:minmax(0,1fr)}
 .ptabs{flex-direction:row;overflow-x:auto;gap:.5rem;padding-bottom:.4rem}.ptabs button{flex:0 0 auto;border:1px solid var(--line);white-space:nowrap}.ptabs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
 .excellence{background:linear-gradient(rgba(236,229,217,.94),rgba(236,229,217,.9)),var(--bg) center/cover}.hero::after{background:linear-gradient(0deg,rgba(25,16,9,.85) 30%,rgba(25,16,9,.35))}.hero{align-items:flex-end;padding-bottom:5rem}
 .svc-slider{order:-1}.c-info h2{margin-bottom:.4em}dialog{max-height:100svh;max-width:100vw;height:100svh}.stone-dlg{height:auto;max-height:92svh}
}
@media(max-width:600px){:root{--nav:60px}.brand img{max-height:36px}.brand{gap:.6rem}
 .services{grid-template-columns:1fr;margin-bottom:2.5rem}.svc{padding:1.3rem 0}.svc+.svc{border-left:0;border-top:1px solid var(--line)}
 .strip{grid-template-columns:1fr 1fr;height:auto}.strip img{aspect-ratio:3/4}.stones{grid-template-columns:repeat(2,1fr);gap:1rem .7rem}.stone span{font-size:.9rem}.vip-grid{grid-template-columns:1fr}
 .lrow{flex-wrap:wrap;justify-content:center;gap:1rem 1.6rem}.lrow img{width:auto;height:calc(var(--h) * .9px);max-width:44%;max-height:58px}.tools select,.tools input{flex:1 1 100%;margin:0}.proj-slider .stage,.svc-slider .stage{aspect-ratio:4/3}
 .stage .prev,.stage .next{width:38px;height:38px}.hero h1{font-size:2.3rem}.btn{width:100%;justify-content:center}.hero .btn{width:auto}.dots{left:var(--pad);right:auto}}

/* Page-style navigation: each menu item opens a concise page view. */
body.page-mode main>[data-page]{display:none}body.page-mode main>[data-page].page-active{display:block}body.page-mode main>[data-page="about"].page-active,body.page-mode main>[data-page="projects"].page-active{display:block}body.page-mode main>[data-page="services"].page-active{display:block}
.brand img{max-height:calc(var(--nav) - 10px)}.nav{background:#ded4ca}

/* Keep the site within the requested warm neutral palette. */
body{background:#F4F5F1}.clients,.projects,.services-sec,.vip{background:#efeee7}.contact{background:#F4F5F1}.c-head{background:#ded4ca}.nav{background:#ded4ca}.enquiry{background:#efeee7}.vip-grid article{background:#F4F5F1}.projects{background:#efeee7}
@media(max-width:900px){.nav nav{background:#ded4ca}}

.btn span{font-size:1.45em;font-weight:600;line-height:.8}.svc button{font-size:.82rem}.svc button::first-letter{font-size:1.15em}

/* =====================================================================
   Amendments (round 3)
   ===================================================================== */
:root{--nav:88px;--tan:#ded4ca}
@media(max-width:600px){:root{--nav:64px}}
/* header: logos fill the bar */
.nav{padding-top:0}
.brand{gap:clamp(.8rem,2vw,1.6rem);padding:0}
.brand img{height:calc(var(--nav) - 22px);width:auto;max-height:none;max-width:42vw;object-fit:contain}
@media(max-width:600px){.brand img{height:calc(var(--nav) - 24px);max-height:none;max-width:40vw}}
/* action arrows: long, bold, clearly visible */
.arr{display:inline-flex;align-items:center;font-size:1em;line-height:1}
.arr svg{width:3.1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.btn{gap:1rem;padding:.95rem 1.6rem}.btn span.arr{font-size:1.05em;font-weight:400;line-height:1}
.svc button{display:inline-flex;align-items:center;gap:.7rem;font-size:.82rem;padding:.4rem 0}.svc button::first-letter{font-size:1em}
.svc button .arr svg{width:2.8em;stroke-width:1.9}
/* hero + all cover blocks: nothing stretched */
.hero{padding-top:calc(var(--nav) + 2rem)}
/* clients */
.c-head h2.label-h{font:700 clamp(1.1rem,2.6vw,1.7rem) var(--serif);letter-spacing:.2em;text-transform:uppercase;margin:0;color:var(--ink)}
.lrow img[alt="NAD Nisreen Atari Design"]{background:#000;padding:0;border-radius:2px;max-height:none}
/* engineering excellence now sits on the About page, below the clients */
.excellence{background:linear-gradient(90deg,rgba(239,238,231,.96) 30%,rgba(239,238,231,.15) 75%),var(--bg) center/cover;min-height:clamp(15rem,19vw,19rem);display:flex;align-items:center}
/* photos keep their own proportions: contain, never cover */
.stage{aspect-ratio:16/10;background:#F4F5F1;border:1px solid var(--line)}
.stage>img{object-fit:contain;object-position:center;cursor:zoom-in}
.svc-slider .stage,.proj-slider .stage{aspect-ratio:4/3}
.proj-slider .stage{aspect-ratio:16/10}
.cap{right:auto;left:.8rem;top:.8rem;padding:.45rem .9rem;border-radius:2px;background:rgba(20,16,12,.72);font-size:clamp(.82rem,1.5vw,1.05rem);text-shadow:none;max-width:calc(100% - 1.6rem)}
.thumbs button{background:#F4F5F1;border:2px solid var(--line)}.thumbs button.on{border-color:var(--gold)}.thumbs img{object-fit:contain}
.stage .prev,.stage .next{font-size:2.9rem;width:60px;height:60px;padding:0 0 .25rem;background:rgba(255,255,255,.92);box-shadow:0 2px 10px rgba(0,0,0,.25)}
.strip{display:flex;gap:.5rem;height:auto;align-items:flex-start}
.strip img{width:auto;height:auto;min-width:0;object-fit:contain;cursor:zoom-in}
/* services page: no tall first image any more */
.services-sec{padding-top:clamp(5rem,9vw,7rem)}
/* projects: cover, then list on the left / slideshow on the right */
.pcover{min-height:calc(100svh - 0px);display:flex;align-items:center;padding-top:calc(var(--nav) + 2rem);background:#2a3a3a var(--bg) center/cover no-repeat;scroll-margin-top:0}
.pcover-card{max-width:30rem;background:rgba(244,245,241,.78);backdrop-filter:blur(2px);padding:clamp(1.4rem,3vw,2.2rem)}
.pcover-card h2{font-size:clamp(1.8rem,4vw,2.6rem)}.pcover-card p:not(.label){font:1rem/1.6 var(--sans);color:#3a342e}
.pcover-card .btn{margin-top:.6rem;background:rgba(244,245,241,.4)}
.projects{background:#efeee7;scroll-margin-top:var(--nav);grid-template-columns:minmax(17rem,.75fr) 2fr}
.ptabs{gap:.8rem;margin-top:1.4rem}
.ptabs button{background:#F4F5F1;border:1px solid var(--line);border-left:5px solid var(--gold);border-radius:3px;box-shadow:0 6px 16px rgba(60,48,36,.18);padding:.95rem 1.1rem;font:.9rem/1.35 var(--sans);color:var(--ink);transition:.2s}
.ptabs button:hover{transform:translateY(-1px);box-shadow:0 9px 20px rgba(60,48,36,.24)}
.ptabs button.on{background:#ded4ca;border-color:var(--gold);border-left-color:var(--ink);color:var(--ink);font-weight:600;box-shadow:0 10px 24px rgba(60,48,36,.3)}
@media(max-width:900px){.pcover{min-height:80svh}.ptabs{gap:.6rem;padding:.2rem .2rem .9rem}.ptabs button,.ptabs button.on{border-left-width:5px;white-space:nowrap}.ptabs button.on{background:#ded4ca;color:var(--ink);border-color:var(--gold);border-left-color:var(--ink)}}
/* marble gallery: full-proportion photos */
.stone .sph{display:block;aspect-ratio:4/3;background:#efeee7;border:1px solid var(--line);padding:0}
.stone .sph img{width:100%;height:100%;object-fit:contain;aspect-ratio:auto}
.stone .sn{display:block;padding:.5rem 0;font-size:1rem}.stone:hover .sph img{opacity:.88}
/* contact */
.contact{background:#F4F5F1;grid-template-columns:1fr 1.2fr;align-items:stretch}
.c-info{background:linear-gradient(rgba(18,14,10,.5),rgba(18,14,10,.66)),var(--bg) center 30%/cover;color:#f4f5f1;padding:clamp(1.8rem,4vw,3rem);min-height:34rem}
.c-info h2{color:#e2cba8;margin-bottom:.3em}.c-info>p{color:#f4f5f1}
.c-info a,.c-info span:not(.contact-symbol){color:#f4f5f1}
.c-info ul{margin-top:2.2rem;gap:1.6rem}.c-info li b{color:#e2cba8;gap:.9rem;font-size:1.1rem}
.contact-symbol{width:2.7rem;height:2.7rem;background:#ded4ca;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.contact-symbol svg{width:1.35rem;height:1.35rem;fill:#2a2622}
.c-info li>a,.c-info li>span{padding-left:3.6rem;font-size:.98rem}
.enquiry{background:#efeee7}
@media(max-width:900px){.contact{grid-template-columns:minmax(0,1fr)}.c-info{min-height:0}}
/* footer logos a little larger */
.f-logos img{height:52px}
/* lightbox */
dialog.lb{max-width:100vw;width:100vw;height:100svh;max-height:100svh;background:#0e0b08;color:#fff;overflow:hidden}
dialog.lb[open]{display:flex;align-items:center;justify-content:center}
.lb figure{margin:0;display:grid;justify-items:center;gap:.7rem;max-width:calc(100vw - 9rem)}
.lb img{max-width:100%;max-height:calc(100svh - 5.5rem);width:auto;height:auto;object-fit:contain}
.lb figcaption{font:1.05rem var(--serif);text-align:center;color:#f4f5f1}
.lb .x{position:fixed;top:1rem;right:1rem}
.lb-nav{position:fixed;top:50%;translate:0 -50%;width:60px;height:60px;border:0;border-radius:50%;background:rgba(255,255,255,.9);font-size:2.9rem;line-height:1;padding:0 0 .25rem;cursor:pointer;display:grid;place-items:center;color:#2a2622}
.lb-prev{left:1rem}.lb-next{right:1rem}.lb.single .lb-nav{display:none}.lb.single figure{max-width:calc(100vw - 2rem)}
@media(max-width:700px){.lb figure{max-width:100vw}.lb-nav{width:44px;height:44px;font-size:2.2rem;top:auto;bottom:1rem;translate:0 0}.lb img{max-height:calc(100svh - 9rem)}}
/* page-switching must not flatten grid/flex sections (this was what stacked the projects list above the photos) */
body.page-mode main>.projects.page-active,body.page-mode main>.contact.page-active{display:grid}
body.page-mode main>.hero.page-active,body.page-mode main>.pcover.page-active,body.page-mode main>.excellence.page-active{display:flex}
@media(max-width:900px){.projects,.contact{grid-template-columns:minmax(0,1fr)}}
/* first block of each page clears the fixed header */
.about,.gallery,.contact{padding-top:calc(var(--nav) + 2.5rem)}
.services-sec{padding-top:calc(var(--nav) + 2.5rem)}
@media(max-width:600px){.brand{min-width:0;flex:1 1 auto;gap:.5rem}.brand img{max-width:34vw;height:calc(var(--nav) - 26px)}}
.f-logos{flex-wrap:wrap}.f-logos img{max-width:44vw;height:auto;max-height:52px;object-fit:contain}

/* round 4 */
/* slide arrows: clean < > chevrons */
.stage .prev,.stage .next,.lb-nav{display:grid;place-items:center;padding:0;font-size:0;line-height:0}
.stage .prev svg,.stage .next svg,.lb-nav svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
/* four service photos: same height, flush, no gaps (web + mobile) */
.strip{display:flex;gap:0;align-items:stretch;height:auto}
.strip img{display:block;width:auto;height:auto;aspect-ratio:auto;min-width:0;margin:0;object-fit:cover}
@media(max-width:900px){.strip{display:flex;grid-template-columns:none;height:auto}.strip img{aspect-ratio:auto}}
/* marble gallery: photo fills its frame; pop-up scales the photo to the screen boundary */
.stone .sph img{object-fit:cover}
.lb.fit figure{max-width:none}
.lb.fit img{width:calc(100vw - 9rem);height:calc(100svh - 6.5rem);object-fit:contain}
@media(max-width:700px){.lb.fit img{width:calc(100vw - 1rem);height:calc(100svh - 9rem)}}
/* NAD logo: full black square as supplied */
.lrow img[alt="NAD Nisreen Atari Design"]{object-fit:contain;max-height:130px}
@media(max-width:600px){.lrow img[alt="NAD Nisreen Atari Design"]{width:84px;height:84px;max-width:none;max-height:84px}}
/* quarry banner: shown at its own proportions, never zoomed or stretched */
.excellence{background:linear-gradient(90deg,rgba(239,238,231,.92) 28%,rgba(239,238,231,0) 70%),var(--bg) center bottom/100% auto no-repeat #efeee7;min-height:0;display:flex;align-items:center;padding-bottom:calc(18.4vw + 1.5rem)}
body.page-mode main>.excellence.page-active{display:flex}
@media(max-width:700px){.excellence{background:var(--bg) center bottom/100% auto no-repeat #efeee7;padding-bottom:calc(18.4vw + 1.5rem)}}

/* round 5 */
/* header: same tan colour, see-through */
.nav{background:rgba(222,212,202,.74)!important;backdrop-filter:blur(10px) saturate(1.1);-webkit-backdrop-filter:blur(10px) saturate(1.1)}
/* NAD: logo as supplied (black on light), no black box */
.lrow img[alt="NAD Nisreen Atari Design"]{background:none;padding:0;border-radius:0;max-height:none;object-fit:contain}
@media(max-width:600px){.lrow img[alt="NAD Nisreen Atari Design"]{width:auto;height:calc(var(--h,24)*.9px);max-width:44%;max-height:58px}}
/* services: one single photo, full proportions */
.strip{display:block}.strip img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;cursor:zoom-in}
/* slide arrows: smaller, website colours */
.stage .prev,.stage .next,.lb-nav{width:46px;height:46px;background:rgba(244,245,241,.92);color:var(--gold);border:1px solid var(--line);box-shadow:0 2px 8px rgba(60,48,36,.2)}
.stage .prev svg,.stage .next svg,.lb-nav svg{width:20px;height:20px;stroke-width:2.4}
.stage .prev:hover,.stage .next:hover,.lb-nav:hover{background:#ded4ca;color:var(--ink)}
@media(max-width:700px){.lb-nav{width:40px;height:40px}}
/* marble gallery: one fixed rectangle (3:2) for the tile AND the pop-up, photo fills it */
.stone .sph{aspect-ratio:3/2;background:#efeee7;padding:0}
.stone .sph img{width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.lb.fit figure{width:min(calc(100vw - 9rem),calc((100svh - 8rem)*1.5));max-width:none;gap:.7rem}
.lb.fit img{width:100%;height:auto;aspect-ratio:3/2;max-height:none;object-fit:cover}
@media(max-width:700px){.lb.fit figure{width:calc(100vw - 1rem)}}

/* round 6: quarry photo is a true background layer behind the text, at its own proportions */
.excellence{position:relative;display:flex;align-items:center;min-height:18.4vw;padding:clamp(2rem,4vw,3.2rem) var(--pad,clamp(1.2rem,5vw,4.5rem));padding-bottom:clamp(2rem,4vw,3.2rem);background:linear-gradient(90deg,rgba(239,238,231,.88) 0%,rgba(239,238,231,.55) 45%,rgba(239,238,231,.1) 100%),var(--bg) center/100% auto no-repeat #efeee7}
body.page-mode main>.excellence.page-active{display:flex}
.excellence>*{position:relative;z-index:1}
@media(max-width:700px){.excellence{background:linear-gradient(rgba(239,238,231,.82),rgba(239,238,231,.7)),var(--bg) center/100% auto repeat-y #efeee7}}
/* quarry band = exactly the photo's own height at desktop; text sits on top of it */
.excellence{padding-top:0;padding-bottom:0;min-height:18.4vw}
.excellence h2{font-size:clamp(1.5rem,2.7vw,2.3rem);margin-bottom:.4em}
.excellence p{font-size:clamp(.85rem,1.1vw,.95rem);line-height:1.6;margin-bottom:0}
@media(max-width:900px){.excellence{padding-top:2.2rem;padding-bottom:2.2rem;background:linear-gradient(rgba(239,238,231,.8),rgba(239,238,231,.7)),var(--bg) center/auto 100% no-repeat #efeee7}.excellence h2{font-size:1.6rem}.excellence p{font-size:.95rem}}

/* ===== round 7: bilingual additions ===== */
ol.five{list-style:none;display:flex;flex-wrap:wrap;gap:.35rem 0;padding:0;margin:1.8rem 0 0;color:#f4f5f1;font:500 .82rem var(--sans);letter-spacing:.12em;text-transform:uppercase}
ol.five li+li::before{content:"\2192";margin:0 .7rem;color:var(--gold)}
.where{margin:1rem 0 0;max-width:38rem;font:.85rem/1.7 var(--sans);color:#efeee7;opacity:.92}
.nav nav a.lang{margin-inline-start:.4rem;padding:.25rem .7rem;border:1px solid var(--gold);border-radius:2px;color:var(--ink);font-size:.8rem;line-height:1.4}
.nav nav a.lang:hover{background:#ded4ca}
@media(max-width:900px){.nav nav a.lang{margin:.6rem 0 0;align-self:flex-start;padding:.5rem 1rem}}
.enquiry select{width:100%;font:1rem var(--sans);padding:.65rem .9rem;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:0}
.enquiry .btn.wa{width:100%;justify-content:center;margin-top:.6rem;background:transparent;border:1px solid var(--ink);color:var(--ink)}
.enquiry .btn.wa:hover{background:#ded4ca}

/* ===== Arabic / right-to-left ===== */
[lang=ar]{--serif:"Noto Naskh Arabic","Old Standard TT",Georgia,serif;--sans:"IBM Plex Sans Arabic",Inter,system-ui,-apple-system,sans-serif}
[lang=ar] *,[lang=ar] *::before,[lang=ar] *::after{letter-spacing:0!important;text-transform:none!important;font-style:normal!important}
[lang=ar] body{line-height:1.9}
[lang=ar] h1,[lang=ar] h2,[lang=ar] h3{line-height:1.45}
[lang=ar] .hero h1{font-weight:700}
[dir=rtl] a[href^="tel"],[dir=rtl] a[href^="mailto"]{direction:ltr;unicode-bidi:isolate;display:inline-block}
[dir=rtl] .arr svg{transform:scaleX(-1)}
[dir=rtl] ol.five li+li::before{content:"\2190"}
[dir=rtl] .hero::after{background:linear-gradient(270deg,rgba(25,16,9,.88) 15%,rgba(25,16,9,.25) 70%),linear-gradient(0deg,rgba(25,16,9,.5),transparent 35%)}
@media(min-width:901px){[dir=rtl] .excellence{background:linear-gradient(270deg,rgba(239,238,231,.88) 0%,rgba(239,238,231,.55) 45%,rgba(239,238,231,.1) 100%),var(--bg) center/100% auto no-repeat #efeee7}}
[dir=rtl] .svc+.svc{border-left:0;border-right:1px solid var(--line)}
[dir=rtl] .svc:nth-child(4){border-right:0}
@media(max-width:900px){[dir=rtl] .svc+.svc{border-right:0;border-top:1px solid var(--line)}}
[dir=rtl] .cap{left:auto;right:.8rem}
[dir=rtl] .stage .prev{left:auto;right:.6rem}[dir=rtl] .stage .next{right:auto;left:.6rem}
[dir=rtl] .stage .prev svg,[dir=rtl] .stage .next svg,[dir=rtl] .lb-nav svg{transform:scaleX(-1)}
[dir=rtl] .lb-prev{left:auto;right:1rem}[dir=rtl] .lb-next{right:auto;left:1rem}
[dir=rtl] .x{right:auto;left:.7rem}[dir=rtl] .lb .x{right:auto;left:1rem}
[dir=rtl] .ptabs button{text-align:right;border-left:1px solid var(--line);border-right:5px solid var(--gold)}
[dir=rtl] .ptabs button.on{border-right-color:var(--ink);border-left-color:var(--gold)}
[dir=rtl] .tools input{margin-left:0;margin-right:auto}
[dir=rtl] .svc-txt li{padding:.35rem 1.4rem .35rem 0}
[dir=rtl] .svc-txt li::before{left:auto;right:0}
[dir=rtl] .c-info li>a,[dir=rtl] .c-info li>span{padding-left:0;padding-right:3.6rem}
[dir=rtl] .pcover-card,[dir=rtl] .hero-text{text-align:right}

/* ===== separate service pages (/ar/services/...) ===== */
.svc-page{padding:calc(var(--nav) + 2.5rem) var(--pad) 3rem;max-width:78rem;margin:0 auto}
.svc-page .crumbs{font:.85rem var(--sans);color:var(--mute);margin-bottom:1.4rem}.svc-page .crumbs a{color:var(--mute)}
.svc-page h1{font:400 clamp(2rem,4.5vw,3.2rem) var(--serif);margin:0 0 .3em}
.svc-page .kick{font:1.25rem var(--serif);color:var(--gold);margin:0 0 .8rem}
.svc-page .lead2{font-weight:600;margin:0 0 1rem}
.svc-page .txt{max-width:46rem}.svc-page ul{list-style:none;padding:0;margin:1.2rem 0;max-width:34rem}
.svc-page li{padding:.45rem 1.4rem .45rem 0;position:relative;border-bottom:1px solid var(--line)}
.svc-page li::before{content:"\25C6";position:absolute;inset-inline-start:0;color:var(--gold);font-size:.6rem;top:.9rem}
[dir=rtl] .svc-page li{padding:.45rem 1.4rem .45rem 0}
.svc-page li{padding-inline-start:1.4rem;padding-inline-end:0}
.svc-page .close{font:600 .9rem var(--sans);color:var(--gold);margin:1.2rem 0}
.svc-page .btnrow{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.6rem 0 2.4rem}.svc-page .btnrow .btn{width:auto}
.svc-page .others{margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid var(--line);font:.95rem var(--sans)}.svc-page .others a{margin-inline-end:1.2rem;color:var(--ink)}
.svc-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:1rem;margin-top:1.6rem}
.svc-gallery a{display:block;background:#F4F5F1;border:1px solid var(--line)}.svc-gallery img{display:block;width:100%;height:auto}
.hp{position:absolute;left:auto;inset-inline-start:0;top:0;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}
.enquiry{position:relative}
[dir=rtl] .c-info li>a{display:block;text-align:right}