/* muhkam.ae v7. Colour-block system: every section is one flat brand surface (orange / ink / paper).
   Square corners everywhere. One accent. Arabic never gets letter-spacing or a Latin mono face. */
:root{
  --o:#F0530C; --o-d:#C43F06; --k:#141110; --k2:#211C1A; --ch:#3A3330; --st:#6E6663; --p:#FAF7F5; --t:#F1EAE4; --ln:#E2D8D0;
  --ok:#2E7D4F;
  --disp:"Archivo","IBM Plex Sans",system-ui,sans-serif; --body:"IBM Plex Sans",system-ui,sans-serif; --numf:"Archivo","Alexandria",sans-serif;
  --pad:clamp(72px,9vw,128px); --gut:clamp(20px,4vw,48px); --ease:cubic-bezier(.16,1,.3,1);
}
html[lang=ar]{--disp:"Alexandria","IBM Plex Sans Arabic",system-ui,sans-serif; --body:"IBM Plex Sans Arabic",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:120px}
body{margin:0;background:var(--p);color:var(--k);font:400 17px/1.7 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}
html[lang=ar] body{font-size:17.5px;line-height:1.85}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:start}
:focus-visible{outline:3px solid var(--o);outline-offset:3px}
.b-orange :focus-visible{outline-color:var(--k)}
.wrap{max-width:1320px;margin-inline:auto;padding-inline:var(--gut)}
.num{font-family:var(--numf);font-feature-settings:"tnum";letter-spacing:-.01em}

/* type */
.d0,.d1,.d2{font-family:var(--disp);font-weight:700;letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
html[lang=ar] :is(.d0,.d1,.d2){font-weight:800;letter-spacing:0;line-height:1.28}
.d0{font-size:clamp(40px,4.7vw,66px);text-wrap:normal}
html[lang=ar] .d0{font-size:clamp(38px,5vw,74px)}
.d1{font-size:clamp(34px,4.6vw,64px)}
html[lang=ar] .d1{font-size:clamp(30px,4vw,56px)}
.d2{font-size:clamp(28px,3.2vw,44px)}
html[lang=ar] .d2{font-size:clamp(26px,2.9vw,40px)}
.lede{font-size:clamp(18px,1.55vw,22px);line-height:1.6;max-width:62ch}
html[lang=ar] .lede{line-height:1.8}
h3,h4{font-family:var(--disp);font-weight:700;letter-spacing:-.015em;line-height:1.25}
html[lang=ar] :is(h3,h4){letter-spacing:0;line-height:1.5}

/* surfaces */
.band{padding-block:var(--pad);position:relative}
.b-paper{background:var(--p)} .b-tint{background:var(--t)}
.b-ink{background:var(--k);color:var(--p)} .b-orange{background:var(--o);color:var(--k)}
.b-ink .lede{color:#D9D0CA} .b-paper .lede,.b-tint .lede{color:var(--ch)}
.sh{margin-block-end:clamp(40px,5vw,72px);display:grid;gap:22px}
.sh-row{grid-template-columns:1fr auto;align-items:end}
.sec-more{margin-block-start:clamp(36px,4vw,56px)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 24px;font:600 16px/1.2 var(--body);white-space:nowrap;border:2px solid transparent;transition:transform .25s var(--ease),background .2s,color .2s,box-shadow .25s var(--ease)}
.btn-xl{min-height:60px;padding:16px 32px;font-size:18px}
.btn-o{background:var(--o);color:var(--k)} .btn-o:hover{background:var(--p)}
.btn-k{background:var(--k);color:var(--p)} .btn-k:hover{box-shadow:6px 6px 0 var(--o)} .b-orange .btn-k:hover{box-shadow:6px 6px 0 var(--p)}
.btn-l{border-color:var(--k);color:var(--k)} .btn-l:hover{background:var(--k);color:var(--p)}
.btn:hover{transform:translate(-2px,-2px)} .btn:active{transform:translate(0,0);box-shadow:none}
.more{display:inline-flex;align-items:center;gap:10px;font-weight:600;border-block-end:2px solid var(--o);padding-block-end:3px;transition:gap .25s var(--ease)}
.more::after{content:"";inline-size:9px;block-size:9px;border-block-start:2px solid currentColor;border-inline-end:2px solid currentColor;transform:rotate(45deg)}
[dir=rtl] .more::after{transform:rotate(-45deg)}
.more:hover{gap:16px}
.tag{display:inline-block;font:600 14px/1 var(--body);padding:8px 12px;background:var(--k);color:var(--p);margin-block-end:22px}
html[lang=en] .tag{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em}

/* nav */
.nav{position:sticky;inset-block-start:0;z-index:50;background:var(--k);color:var(--p);border-block-end:1px solid #2E2825}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:70px}
.logo{display:inline-flex;align-items:center;gap:10px}
.logo-w{display:grid;line-height:1}
.logo-w b{font:700 25px/1.25 "Alexandria",sans-serif}
.logo-w i{font:600 9.5px/1 "Archivo",sans-serif;font-style:normal;letter-spacing:.43em;color:var(--o);margin-inline-end:-.43em;direction:ltr}
.nav-links{display:flex;align-items:center;gap:clamp(14px,2.2vw,32px);font-size:15.5px;font-weight:500}
.nav-links>a:not(.btn){padding-block:6px;border-block-end:2px solid transparent;color:#D9D0CA;transition:color .2s}
.nav-links>a:not(.btn):hover,.nav-links>a[aria-current]{color:var(--p);border-color:var(--o)}
.nav-links .lang{font-family:var(--numf)} html[lang=en] .nav-links .lang{font-family:"Alexandria",sans-serif}
.nv,.burger{display:none}

/* hero */
.hero{padding-block:clamp(48px,6vw,88px) clamp(56px,7vw,104px);overflow:clip}
.hero-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,64px);align-items:center;min-height:min(560px,calc(100dvh - 240px))}
.d0 em{font-style:normal;color:#fff;display:block}
.hero .lede{margin-block:28px 40px;font-weight:500;max-width:54ch}
.acts{display:flex;flex-wrap:wrap;gap:14px}
.iso{inline-size:100%;max-inline-size:600px;margin-inline:auto;overflow:visible}
@media (prefers-reduced-motion:no-preference){
  .iso-key{animation:set 1.5s .5s var(--ease) both}
  .iso-loose{animation:drift 7s ease-in-out infinite alternate}
  .iso-loose.f2{animation-duration:9s;animation-delay:-3s}.iso-loose.f3{animation-duration:8s;animation-delay:-5s}
  @keyframes set{from{transform:translateY(-190px)}to{transform:none}}
  @keyframes drift{from{transform:translateY(-10px)}to{transform:translateY(12px)}}
}
/* live Rubik's cube (built by site.js, replaces .iso when motion is allowed) */
.rk{position:relative;inline-size:100%;max-inline-size:600px;aspect-ratio:600/560;margin-inline:auto;--u:76px}
.rk-s,.rk-c{position:absolute;inline-size:0;block-size:0;transform-style:preserve-3d}
.rk-s{left:50%;top:42%} .rk-c{left:0;top:0}
.rk-f{position:absolute;box-sizing:border-box;inline-size:var(--u);block-size:var(--u);left:calc(var(--u)/-2);top:calc(var(--u)/-2);background:#F6BE9F;border:1.25px solid var(--o);outline:1.25px solid var(--o);backface-visibility:hidden}
.rk-f i{position:absolute;inset:0;background:#fff;opacity:0}
.ink .rk-f{background:#3A3330} .ink .rk-f i{background:#141110}
.rk-pz{transform:translateZ(calc(var(--u)/2))} .rk-nz{transform:rotateY(180deg) translateZ(calc(var(--u)/2))}
.rk-px{transform:rotateY(90deg) translateZ(calc(var(--u)/2))} .rk-nx{transform:rotateY(-90deg) translateZ(calc(var(--u)/2))}
.rk-ny{transform:rotateX(90deg) translateZ(calc(var(--u)/2))} .rk-py{transform:rotateX(-90deg) translateZ(calc(var(--u)/2))}

/* stats + logos */
.stats{padding-block:clamp(48px,5vw,72px)}
.stats-g{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,48px)}
.stats-g div{display:grid;gap:10px;align-content:start;border-inline-start:3px solid var(--o);padding-inline-start:20px}
.stats-g b{font-size:clamp(38px,4.4vw,64px);line-height:1;font-weight:700;color:var(--o);white-space:nowrap}
.stats-g span{color:#D9D0CA;font-size:16px;line-height:1.5;max-width:24ch}
.logos{margin-block-start:clamp(44px,5vw,72px);padding-block-start:36px;border-block-start:1px solid #2E2825}
.logos h2{font:500 15px/1.4 var(--body);color:#A89E97;margin-block-end:22px}
.logos-r{display:grid;grid-template-columns:repeat(5,1fr);border-block-start:1px solid #2E2825;border-inline-start:1px solid #2E2825}
.lg{display:flex;align-items:center;justify-content:center;gap:12px;min-block-size:112px;padding:22px 18px;border-block-end:1px solid #2E2825;border-inline-end:1px solid #2E2825;direction:ltr;transition:background .25s}
.lg:hover{background:var(--k2)}
.lg img{max-block-size:44px;max-inline-size:min(160px,100%);inline-size:auto;block-size:auto;object-fit:contain;opacity:.92}
.lg img[src*="beautyco"],.lg img[src*="emkangulf"]{max-block-size:62px;max-inline-size:min(200px,100%)}
.lg b{font:600 14px/1.25 "Archivo","Alexandria",sans-serif;color:var(--p);white-space:nowrap}

/* leaks bento: 5 items, 5 cells */
.leaks-g{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.leak{padding:clamp(26px,3vw,44px);display:grid;gap:16px;align-content:space-between;min-height:260px}
.leak:nth-child(1),.leak:nth-child(2){grid-column:span 3}
.leak:nth-child(n+3){grid-column:span 2}
.leak h3{font-size:clamp(22px,2.2vw,32px)}
.leak p{font-size:16.5px;max-width:48ch}
.k-ink{background:var(--k);color:var(--p)} .k-ink p{color:#D9D0CA}
.k-orange{background:var(--o)}
.k-line{background:var(--t)} .k-line p{color:var(--ch)}
.leaks-out{margin-block-start:36px;font:600 clamp(19px,1.8vw,24px)/1.5 var(--disp);max-width:40ch;border-inline-start:4px solid var(--o);padding-inline-start:20px}

/* build tabs */
.tabs{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,2fr);gap:clamp(20px,3vw,48px);align-items:start}
.tab-l{display:grid;border-block-start:1px solid #2E2825}
.tab-l button{display:grid;gap:3px;padding:16px 18px;border-block-end:1px solid #2E2825;border-inline-start:4px solid transparent;transition:background .2s,border-color .2s}
.tab-l button b{font:600 17.5px/1.4 var(--disp)} .tab-l button span{font-size:14px;color:#A89E97;line-height:1.45}
.tab-l button:hover{background:var(--k2)}
.tab-l button[aria-selected=true]{background:var(--o);color:var(--k);border-inline-start-color:var(--p)}
.tab-l button[aria-selected=true] span{color:var(--k)}
.tab-p>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:start;background:var(--k2);padding:clamp(24px,3vw,44px);min-height:100%}
.tab-p>div[hidden]{display:none}
.tp-t{display:grid;gap:18px;justify-items:start}
.tp-t h3{font-size:clamp(24px,2.4vw,34px);color:var(--o)}
.tp-t p{color:#E6DED8}
.tp-t ul{display:grid;gap:10px;margin-block:4px 8px}
.tp-t li,.ticks li{position:relative;padding-inline-start:30px;font-weight:500}
.tp-t li::before,.ticks li::before{content:"";position:absolute;inset-inline-start:2px;inset-block-start:.5em;inline-size:14px;block-size:8px;border-inline-start:3px solid var(--o);border-block-end:3px solid var(--o);transform:rotate(-45deg)}
[dir=rtl] :is(.tp-t li,.ticks li)::before{transform:scaleX(-1) rotate(-45deg)}

/* UI illustrations */
.ui{background:var(--p);color:var(--k);border:2px solid var(--k);box-shadow:10px 10px 0 var(--o);font-size:14.5px;line-height:1.5}
[dir=rtl] .ui{box-shadow:-10px 10px 0 var(--o)}
.ui figcaption{padding:10px 16px;border-block-start:1px solid var(--ln);font-size:12.5px;color:var(--st);line-height:1.5}
.ui-bar{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 16px;background:var(--k);color:var(--p);font-size:14px}
.ui-bar span{color:#D9D0CA;font-size:13px}
.chat{display:grid;gap:10px;padding:18px 16px}
.chat p{max-width:84%;padding:10px 14px} .chat .in{background:var(--t);justify-self:start} .chat .out{background:var(--k);color:var(--p);justify-self:end}
.chat small{display:block;margin-block-start:4px;font-size:12px;color:var(--o);font-weight:600}
.chat .sys{max-width:100%;justify-self:stretch;text-align:center;font-size:13px;font-weight:600;color:var(--ok);border:1px dashed var(--ok);padding:8px}
.kan{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px}
.kan h5{font:600 13px/1.3 var(--body);color:var(--st);margin-block-end:8px}
.kan p{display:grid;gap:2px;padding:10px;background:#fff;border:1px solid var(--ln);border-inline-start:3px solid var(--k);margin-block-end:8px;font-size:13.5px}
.kan div:last-child p{border-inline-start-color:var(--ok)} .kan p span{color:var(--st);font-size:12.5px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);border-block-end:1px solid var(--ln)}
.kpis div{padding:16px 12px;display:grid;gap:2px;border-inline-end:1px solid var(--ln)} .kpis div:last-child{border:0;background:var(--o)}
.kpis b{font-size:26px;line-height:1.1} .kpis span{font-size:13px}
.row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 16px;font-size:13.5px}
.row em{font-style:normal;font-weight:600;background:var(--k);color:var(--p);padding:6px 10px;font-size:12.5px}
.flow{display:grid;gap:26px;padding:24px 20px}
.node{position:relative;padding:14px 16px;border:2px solid var(--k);display:grid;gap:2px;background:#fff}
.node span{color:var(--ch);font-size:13.5px} .node.hot{background:var(--k);color:var(--p)} .node.hot span{color:#D9D0CA}
.node+.node::before{content:"";position:absolute;inset-block-end:100%;inset-inline-start:50%;block-size:26px;border-inline-start:2px dashed var(--o)}
.stages{display:grid;gap:9px;padding:18px 16px}
.stages p{display:grid;grid-template-columns:9.5em 1fr auto;gap:10px;align-items:center;font-size:13.5px}
.stages i{display:block;block-size:12px;background:var(--k)} .stages p:nth-child(n+4) i{background:var(--o)}
.funnel{display:grid;gap:8px;padding:18px 16px}
.funnel p{display:grid;gap:4px} .funnel i{display:block;background:var(--k);color:var(--p);padding:7px 12px;font-style:normal;min-inline-size:56px}
.funnel p:nth-child(2) i{background:var(--o);color:var(--k)} .funnel span{font-size:13.5px} .funnel em{font-style:normal;font-weight:700;color:var(--o-d);margin-inline-start:8px}
.ui-img img{inline-size:100%}

/* cases rail */
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:max(var(--gut),calc((100vw - 1320px)/2 + var(--gut)));padding-block:6px 18px;scrollbar-width:thin;scrollbar-color:var(--k) transparent}
.case{flex:0 0 min(420px,84vw);scroll-snap-align:start;scroll-margin-inline:var(--gut);background:var(--t);padding:30px;display:grid;gap:16px;align-content:start;border-block-start:6px solid var(--k);transition:transform .3s var(--ease),border-color .2s,background .2s}
.case:hover{transform:translateY(-6px);border-color:var(--o);background:#fff}
.case-s{font-weight:600;font-size:14.5px;color:var(--o-d)}
.case h3{font-size:25px} .case p{font-size:15.5px;color:var(--ch)}
.case .case-r{color:var(--k);font-weight:600;border-inline-start:3px solid var(--o);padding-inline-start:14px}
.case-c{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding-block-start:16px;border-block-start:1px solid var(--ln);font-size:14.5px;margin-block-start:auto}
.case-c i{font-style:normal;color:var(--st)}
.rail-nav{display:flex;gap:8px;direction:ltr}
.rail-nav button{inline-size:52px;block-size:52px;border:2px solid var(--k);display:grid;place-items:center;transition:background .2s}
.rail-nav button::before{content:"";inline-size:11px;block-size:11px;border-block-start:2.5px solid currentColor;border-inline-start:2.5px solid currentColor;transform:rotate(-45deg);margin-inline-start:5px}
.rail-nav button[data-rail="1"]::before{transform:rotate(135deg);margin-inline-start:-5px}
.rail-nav button:hover{background:var(--k);color:var(--p)}

/* sites */
.sites-g{display:grid;grid-template-columns:repeat(12,1fr);gap:28px 18px}
.site{grid-column:span 3;display:grid;gap:12px;align-content:start}
.site.big{grid-column:span 6;grid-row:span 2}
.sites-g .site:nth-child(n+6){grid-column:span 4}
.site img{inline-size:100%;aspect-ratio:1600/793;object-fit:cover;object-position:top;background:var(--k2);border:1px solid #2E2825;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.site:hover img{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--o)}
.site-c{display:grid;grid-template-columns:1fr auto;gap:2px 12px;font-size:14.5px;line-height:1.45}
.site-c b{font-size:16px} .site-c span{grid-column:1;color:#A89E97} .site-c i{grid-column:2;grid-row:1;font-style:normal;color:var(--o);font-weight:600}
.site.big .site-c b{font-size:20px}

/* steps */
.steps-g{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-block-start:clamp(40px,5vw,64px);counter-reset:s;border-block-start:3px solid var(--k)}
.steps-g li{counter-increment:s;padding:28px 24px 8px 0;padding-inline:0 24px;display:grid;gap:12px;align-content:start;border-inline-end:1px solid rgba(20,17,16,.28)}
.steps-g li+li{padding-inline-start:24px} .steps-g li:last-child{border:0}
.steps-g li::before{content:counter(s);font:700 64px/1 var(--numf);color:#fff}
.steps-g h3{font-size:22px} .steps-g p{font-size:16px}

/* voices */
.voices-g{display:grid;grid-template-columns:7fr 5fr;gap:18px;margin-block-start:clamp(36px,4vw,56px)}
.q-col{display:grid;gap:18px}
blockquote{padding:clamp(26px,3vw,44px);display:grid;gap:24px;align-content:space-between}
.q-big{background:var(--k);color:var(--p)} .q-big p{font:500 clamp(21px,2.1vw,29px)/1.55 var(--disp)}
html[lang=ar] .q-big p{line-height:1.8}
.q-sm{background:var(--t)} .q-sm:last-child{background:var(--o)} .q-sm p{font-size:17px;font-weight:500}
blockquote footer{display:grid;gap:2px;font-size:15px} blockquote footer span{opacity:.75}
.src{margin-block-start:18px;font-size:14px;color:var(--st)}

/* faq */
.faq-in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,5vw,80px);align-items:start}
.faq-in h2{position:sticky;inset-block-start:110px}
details{border-block-end:1px solid #CFC3BA}
details:first-child{border-block-start:3px solid var(--k)}
summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding-block:22px;font:600 clamp(18px,1.5vw,21px)/1.45 var(--disp)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:400 30px/1 var(--numf);color:var(--o-d);transition:transform .3s var(--ease)}
details[open] summary::after{transform:rotate(45deg)}
details p{padding-block-end:26px;max-width:68ch;color:var(--ch)}

/* cta + footer */
.cta-in{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end}
.cta .lede{margin-block-start:20px;font-weight:500}
.cta-act{display:grid;gap:16px;justify-items:start}
.cta-tel{font-weight:700;font-size:22px;border-block-end:2px solid var(--k)}
.foot{padding-block:clamp(56px,6vw,88px) 28px;font-size:15.5px}
.foot-in{display:grid;grid-template-columns:1.5fr 1.3fr .8fr 1fr;gap:clamp(24px,4vw,56px)}
.foot-a p{margin-block-start:18px;color:#BDB3AC;max-width:40ch} .foot-a .give{color:var(--p);border-inline-start:3px solid var(--o);padding-inline-start:14px}
.foot h6{font:600 14px/1 var(--body);color:#8E8783;margin-block-end:16px}
.foot-in>div:not(.foot-a) a{display:block;padding-block:5px;color:#D9D0CA} .foot-in>div:not(.foot-a) a:hover{color:var(--o)}
.foot [dir=ltr]{text-align:end;unicode-bidi:plaintext}
html[lang=en] .foot [dir=ltr]{text-align:start}
.foot-b{display:flex;justify-content:space-between;gap:16px;margin-block-start:56px;padding-block-start:22px;border-block-start:1px solid #2E2825;color:#8E8783;font-size:14px}

/* inner pages */
.phero{padding-block:clamp(64px,8vw,120px)}
.phero-in{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.phero .lede{margin-block-start:26px}
.phero-m svg{inline-size:clamp(120px,16vw,220px);block-size:auto}
.subnav{position:sticky;inset-block-start:71px;z-index:40;background:var(--o);color:var(--k)}
.subnav-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-block:0} .subnav-in::-webkit-scrollbar{display:none}
.subnav a{flex:none;padding:13px 14px;font-weight:600;font-size:14.5px;white-space:nowrap;transition:background .2s,color .2s} .subnav a:hover{background:var(--k);color:var(--p)}
.svc-top{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,80px);align-items:center}
.svc-top .btn{margin-block-start:30px}
.svc-prob{font:600 clamp(20px,2vw,27px)/1.45 var(--disp);color:var(--o-d);margin-block:16px 18px}
.h-sub{font:600 15px/1.2 var(--body);color:var(--st);margin-block:clamp(40px,5vw,64px) 20px;padding-block-end:12px;border-block-end:3px solid var(--k)}
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:30px clamp(24px,3vw,48px)}
.feats.f2{grid-template-columns:repeat(2,1fr);margin-block-start:28px}
.feats h4{font-size:18.5px;margin-block-end:6px;padding-inline-start:14px;border-inline-start:4px solid var(--o)} .feats p{font-size:16px;color:var(--ch)}
.svc-bot{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px)}
.runs{counter-reset:r;display:grid;gap:14px}
.runs li{counter-increment:r;display:grid;grid-template-columns:40px 1fr;gap:4px 14px;align-items:start}
.runs li::before{content:counter(r);grid-row:span 2;font:700 17px/40px var(--numf);inline-size:40px;block-size:40px;text-align:center;background:var(--k);color:var(--p)}
.runs.big li b{font:700 20px/1.4 var(--disp);grid-column:2} .runs li{padding-block-start:0}
.runs:not(.big) li{align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:8px} .chips li{padding:8px 14px;border:1.5px solid var(--k);font-size:15px;font-weight:500}
.proof{display:grid;gap:14px;justify-items:start}
.outro .lede{margin-block-start:22px}
.cs-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,88px);align-items:start}
.cs-a{position:sticky;inset-block-start:110px}
.cs-c{margin-block-start:26px;display:grid;gap:2px;border-inline-start:4px solid var(--o);padding-inline-start:16px} .cs-c b{font:700 22px/1.4 var(--disp)} .cs-c span{color:var(--st)}
.cs-b .h-sub:first-child{margin-block-start:0}
.big{font-size:clamp(18px,1.5vw,21px);line-height:1.7}
.cs-r{margin-block-start:36px;background:var(--k);color:var(--p);padding:28px 32px;box-shadow:10px 10px 0 var(--o)}
[dir=rtl] .cs-r{box-shadow:-10px 10px 0 var(--o)}
.cs-r h3{font:600 14.5px/1 var(--body);color:var(--o);margin-block-end:10px} .cs-r p{font:600 clamp(20px,1.9vw,26px)/1.5 var(--disp)}
.story-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,88px);align-items:start}
.story-in h2{position:sticky;inset-block-start:110px}
.prose{display:grid;gap:22px;font-size:clamp(18px,1.45vw,20.5px)} .prose p:first-child{font-weight:600;color:var(--k)} .prose p{color:var(--ch)}
.vals-g{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-block-start:clamp(36px,4vw,56px)}
.vals-g article{grid-column:span 2;padding:32px;background:var(--k2);display:grid;gap:12px;align-content:start;border-block-start:4px solid var(--o)}
.vals-g article:nth-child(-n+2){grid-column:span 3} .vals-g article:first-child{background:var(--o);color:var(--k);border-color:var(--p)}
.vals-g h3{font-size:23px} .vals-g p{color:#D9D0CA;font-size:16.5px} .vals-g article:first-child p{color:var(--k)}
.team-g{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-block-start:clamp(32px,4vw,52px)}
.team-g article{padding:30px;background:var(--t);display:grid;gap:6px;align-content:start}
.team-g .mono{font:800 40px/72px var(--disp);inline-size:72px;block-size:72px;text-align:center;background:var(--k);color:var(--o);margin-block-end:16px}
.team-g article.ai{background:var(--o)} .team-g article.ai b{color:var(--k)} .team-g article.ai p{color:var(--k)}
.team-g h3{font-size:24px} .team-g b{font-weight:600;color:var(--o-d);font-size:15.5px} .team-g p{color:var(--ch);margin-block-start:8px}
.facts{display:grid;grid-template-columns:repeat(4,1fr);margin-block-start:48px;border-block-start:3px solid var(--k)}
.facts div{padding:20px 20px 0 0;padding-inline:0 20px} .facts dt{font-size:14.5px;color:var(--st)} .facts dd{font:600 18px/1.5 var(--disp)}
.give-in{display:grid;gap:22px;border-inline-start:8px solid var(--o);padding-inline-start:clamp(20px,3vw,44px)}
.chans-g{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.chan{padding:clamp(28px,3vw,44px);background:var(--t);display:grid;gap:12px;align-content:start;min-height:250px;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.chan.hot{background:var(--o)} .chan:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--k)}
.chan h2{font:700 30px/1.3 var(--disp)} .chan b{margin-block-start:auto;font-size:21px;justify-self:start}
.prep-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,88px)} .prep-in h2{margin-block-end:28px}
.ticks{display:grid;gap:16px;font-size:18px} .ticks li{font-weight:400}

/* radar */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.post{display:grid;gap:14px;align-content:start;padding:30px;background:var(--t);border-block-start:6px solid var(--k);transition:transform .3s var(--ease),border-color .2s,background .2s}
.post:hover{transform:translateY(-6px);border-color:var(--o);background:#fff}
.post-d{font-weight:600;font-size:14.5px;color:var(--o-d)}
.post h3{font-size:22px} .post p{font-size:15.5px;color:var(--ch)} .post .more{justify-self:start;margin-block-start:6px;font-size:15px}
.on-ink .post{background:var(--k2);border-color:var(--o)} .on-ink .post:hover{background:#2B2523;border-color:var(--p)}
.on-ink .post-d{color:var(--o)} .on-ink .post p{color:#D9D0CA}
.rel-h{margin-block-end:32px}
.art-h .wrap{max-width:980px} .crumb{display:inline-block;font-weight:600;color:var(--o);margin-block-end:22px;border-block-end:2px solid var(--o)}
.art-h .d1 em{font-style:normal;color:var(--o)}
.art-m{display:flex;flex-wrap:wrap;gap:8px 26px;margin-block-start:30px;color:#A89E97;font-size:15px}
.art-in{max-width:820px;font-size:clamp(18px,1.4vw,20px)}
.art-in h2{font:700 clamp(25px,2.6vw,34px)/1.3 var(--disp);margin-block:56px 18px;padding-inline-start:16px;border-inline-start:6px solid var(--o)}
html[lang=ar] .art-in h2{line-height:1.5}
.art-in p,.art-in li{color:var(--ch);margin-block-end:20px} .art-in strong{color:var(--k);font-weight:600}
.art-in ul,.art-in ol{padding-inline-start:26px;margin-block-end:20px} .art-in ul{list-style:square} .art-in ol{list-style:decimal} .art-in li{margin-block-end:10px} .art-in li::marker{color:var(--o-d)}
.art-in a{color:var(--o-d);font-weight:600;text-decoration:underline;text-underline-offset:4px}
.art-in table{inline-size:100%;border-collapse:collapse;margin-block:24px;font-size:16px} .art-in th,.art-in td{border:1px solid var(--ln);padding:10px 12px;text-align:start} .art-in th{background:var(--k);color:var(--p)}

/* responsive */
@media (max-width:1080px){
  .tabs{grid-template-columns:1fr}
  .tab-l{display:flex;overflow-x:auto;border:0;gap:8px;scrollbar-width:none;margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut)} .tab-l::-webkit-scrollbar{display:none}
  .tab-l button{flex:none;border:1px solid #3A3330;padding:12px 16px} .tab-l button span{display:none}
  .foot-in{grid-template-columns:1fr 1fr}
  .team-g{grid-template-columns:1fr 1fr}
  .posts{grid-template-columns:1fr 1fr}
  .feats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .burger{display:grid;gap:5px;padding:12px;cursor:pointer} .burger i{display:block;inline-size:24px;block-size:2px;background:var(--p);transition:transform .3s var(--ease),opacity .2s}
  .nv{display:block;position:absolute;opacity:0;pointer-events:none}
  .nav-links{position:absolute;inset-inline:0;inset-block-start:100%;background:var(--k);flex-direction:column;align-items:stretch;gap:0;padding:8px var(--gut) 24px;border-block-end:3px solid var(--o);display:none}
  .nv:checked~.nav-links{display:flex}
  .nv:checked+.burger i:nth-child(1){transform:translateY(7px) rotate(45deg)} .nv:checked+.burger i:nth-child(2){opacity:0} .nv:checked+.burger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nv:focus-visible+.burger{outline:3px solid var(--o)}
  .nav-links>a:not(.btn){padding-block:14px;border-block-end:1px solid #2E2825;font-size:18px} .nav-links .btn{margin-block-start:18px}
  .hero-in{grid-template-columns:1fr;min-height:0} .hero-v{order:-1} .iso,.rk{max-inline-size:300px}
  .stats-g{grid-template-columns:1fr 1fr;gap:32px 20px} .logos-r{grid-template-columns:1fr 1fr} .lg{min-block-size:92px;padding:16px 10px} .lg img{max-block-size:36px} .lg b{font-size:13px;white-space:normal}
  .leak,.leak:nth-child(n){grid-column:1/-1;min-height:0}
  .tab-p>div,.svc-top,.svc-bot,.cs-in,.story-in,.faq-in,.prep-in,.voices-g,.cta-in,.phero-in{grid-template-columns:1fr}
  .cs-a,.story-in h2,.faq-in h2{position:static} .phero-m{display:none}
  .sh-row{grid-template-columns:1fr} .rail-nav{display:none}
  .site,.site.big,.sites-g .site:nth-child(n){grid-column:span 6;grid-row:auto} .site.big{grid-column:1/-1}
  .steps-g{grid-template-columns:1fr 1fr} .steps-g li,.steps-g li+li{padding-inline:0 20px;border:0;border-block-end:1px solid rgba(20,17,16,.28);padding-block-end:24px}
  .vals-g article,.vals-g article:nth-child(n){grid-column:1/-1} .team-g,.chans-g{grid-template-columns:1fr} .facts{grid-template-columns:1fr 1fr}
  .chan{min-height:0}
}
@media (max-width:600px){
  body,html[lang=ar] body{font-size:16.5px}
  .btn-xl{min-height:56px;padding:14px 22px;font-size:17px;flex:1 1 auto}
  .site,.sites-g .site:nth-child(n){grid-column:1/-1}
  .steps-g,.feats,.feats.f2,.foot-in,.posts{grid-template-columns:1fr}
  .kan{grid-template-columns:1fr} .kpis{grid-template-columns:1fr 1fr} .kpis div:nth-child(2){border-inline-end:0} .kpis div:nth-child(-n+2){border-block-end:1px solid var(--ln)}
  .stages p{grid-template-columns:7.5em 1fr auto} .ui,[dir=rtl] .ui,.cs-r,[dir=rtl] .cs-r{box-shadow:0 8px 0 var(--o)}
  .stats-g b{font-size:clamp(25px,8vw,34px)} .stats-g div{min-inline-size:0;padding-inline-start:12px} .stats-g{gap:28px 12px} .foot-b{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* SEO landing pages (2026-09-24) */
.lp-hero .svc-top{min-height:min(520px,calc(100dvh - 240px))}
.lp-hero .lede{margin-block:24px 34px;font-weight:500;max-width:56ch;color:var(--k)}
.lp-hero .crumb{color:var(--k);border-block-end-color:var(--k)}
.lp-hero .acts{align-items:center}
.lp-hero .lp-ext{color:var(--k)}

.art-in h3{font:700 clamp(20px,2vw,24px)/1.4 var(--disp);margin-block:36px 12px;color:var(--k)}
.feats h3.h4{font-size:18.5px;margin-block-end:6px;padding-inline-start:14px;border-inline-start:4px solid var(--o)}
.foot-g{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 22px;margin-block-start:40px}
.foot-g h6{margin:0 8px 0 0}
.foot-g a{color:#D9D0CA} .foot-g a:hover{color:var(--o)}

/* phone numbers inside Arabic text: keep "+971 50 ..." in order (2026-09-24) */
[dir=ltr],bdi{unicode-bidi:isolate}