:root{
  color-scheme:dark;
  --bg:#060707; --bg2:#0B0E0D; --panel:#111514; --ink:#DAD7CC; --ink2:#98A09B;
  --line:#242A28; --line2:#39413E; --tan:#C9AB6B; --tan2:#E3CB8F; --on-tan:#0A0C0B;
  --head:"Saira Condensed","Arial Narrow",Arial,sans-serif;
  --stencil:"Saira Stencil One","Saira Condensed","Arial Narrow",Arial,sans-serif;
  --body:"Barlow",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --mono:"Share Tech Mono",ui-monospace,Menlo,Consolas,monospace;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 76px);scroll-behavior:smooth;height:100%;background:var(--bg)}
html[lang="ar"]{--head:"Cairo","Segoe UI",Tahoma,sans-serif;--stencil:"Cairo","Segoe UI",Tahoma,sans-serif;--body:"Cairo","Segoe UI",Tahoma,sans-serif;--mono:"Cairo","Segoe UI",Tahoma,sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17.5px;line-height:1.65;-webkit-text-size-adjust:100%}
html[lang="ar"] body{line-height:1.9;font-size:17px}
h1,h2,h3{font-family:var(--head);font-weight:700;line-height:1.05;margin:0;letter-spacing:.03em;text-transform:uppercase}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{line-height:1.35;letter-spacing:0;text-transform:none}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--tan);outline-offset:3px}
.wrap{width:100%;max-width:1160px;margin-inline:auto;padding-inline:24px}

/* classification strip */
.strip{background:#000;border-bottom:1px solid var(--line);font:13px/1 var(--mono);letter-spacing:.06em;color:var(--ink2)}
html[lang="ar"] .strip{font-size:13px;letter-spacing:0}
.strip .wrap{display:flex;justify-content:space-between;align-items:center}
.strip .wrap>*{white-space:nowrap;display:flex;align-items:center;min-height:34px;padding-inline:14px;border-inline-start:1px solid var(--line);text-decoration:none}
.strip .wrap>*:first-child{border-inline-start:0;padding-inline-start:0}
.strip .wrap>*:last-child{padding-inline-end:0}
.strip a:hover{color:var(--tan)}
.strip b{font-weight:400;color:var(--ink);margin-inline-start:8px;direction:ltr}
.dot{width:7px;height:7px;border-radius:50%;background:var(--tan);margin-inline-end:9px;flex:none}
@media (prefers-reduced-motion:no-preference){.dot{animation:blink 2.4s ease-in-out infinite}@keyframes blink{50%{opacity:.25}}}
@media (max-width:640px){.m-hide{display:none!important}.strip{font-size:12px}.strip .wrap>*{padding-inline:10px}}

/* header */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(6,7,7,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line2)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:66px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand svg{width:34px;height:34px;flex:none}
.brand b{display:block;font-family:var(--stencil);font-weight:400;font-size:23px;letter-spacing:.08em;line-height:1}
html[lang="ar"] .brand b{font-size:19px;font-weight:700;letter-spacing:0}
.brand small{display:block;font:11px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tan);margin-top:5px}
html[lang="ar"] .brand small{letter-spacing:0;font-size:12px;text-transform:none}
nav.links{display:none;gap:30px}
nav.links a{text-decoration:none;font:14px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);padding:10px 0;border-bottom:2px solid transparent}
html[lang="ar"] nav.links a{font-size:15px;letter-spacing:0;text-transform:none}
nav.links a:hover{color:var(--ink);border-bottom-color:var(--tan)}
.lang{font:14px/1 var(--mono);letter-spacing:.08em;color:var(--ink);background:transparent;border:1px solid var(--line2);padding:0 16px;cursor:pointer;min-height:40px}
html[lang="ar"] .lang{font-family:"Barlow",sans-serif;letter-spacing:.02em}
.lang:hover{border-color:var(--tan);color:var(--tan)}
@media (min-width:900px){nav.links{display:flex}}

/* buttons: chamfered */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;font:700 17px/1 var(--head);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:0;background:var(--tan);color:var(--on-tan);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
html[lang="ar"] .btn{letter-spacing:0;font-size:17px;text-transform:none}
.btn:hover{background:var(--tan2)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line2)}
.btn.ghost:hover{color:var(--tan);box-shadow:inset 0 0 0 1.5px var(--tan);background:transparent}

/* hero */
.hero{position:relative;background:#040505;color:var(--ink);overflow:hidden;min-height:min(88vh,780px);display:flex;align-items:flex-end;padding:0}
.map{position:absolute;inset:0;width:100%;height:100%}
.map .grid line{stroke:rgba(218,215,204,.05);stroke-width:1}
.map .c{fill:none;stroke:rgba(218,215,204,.13);stroke-width:1;vector-effect:non-scaling-stroke}
.map .c.idx{stroke:rgba(201,171,107,.38);stroke-width:1.4}
.map .ring{fill:none;stroke:rgba(201,171,107,.22);stroke-width:1;vector-effect:non-scaling-stroke}
.map .ring.d{stroke-dasharray:3 7}
.map .wedge{fill:rgba(201,171,107,.10)}
.map .lead{stroke:rgba(201,171,107,.7);stroke-width:1.5;vector-effect:non-scaling-stroke}
.map .mk{fill:none;stroke:var(--tan);stroke-width:1.5;vector-effect:non-scaling-stroke}
.map .mkdot{fill:var(--tan)}
.map text{fill:var(--ink);font-family:var(--mono);font-size:19px;letter-spacing:.08em;text-transform:uppercase}
html[lang="ar"] .map text{font-size:19px;letter-spacing:0;text-transform:none}
.map .sub{fill:var(--tan);font-size:15px}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 70% 35%,transparent 30%,rgba(0,0,0,.65) 100%),linear-gradient(to top,#040505 6%,rgba(4,5,5,0) 58%);pointer-events:none}
.hud{position:absolute;inset:18px;z-index:3;pointer-events:none;
  background:
   linear-gradient(var(--tan),var(--tan)) 0 0/28px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 0 0/2px 28px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 100% 0/28px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 100% 0/2px 28px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 0 100%/28px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 0 100%/2px 28px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 100% 100%/28px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 100% 100%/2px 28px no-repeat;
  opacity:.75}
.hero .wrap{position:relative;z-index:2;padding-block:80px 72px}
.hero h1{font-family:var(--stencil);font-weight:400;font-size:clamp(38px,6.2vw,84px);line-height:1;letter-spacing:.02em;max-width:12ch}
html[lang="ar"] .hero h1{font-weight:700;font-size:clamp(34px,6vw,76px);line-height:1.3;max-width:15ch}
.hero p.lede{max-width:33em;margin-top:24px;font-size:clamp(17px,2.1vw,20px);color:var(--ink2)}
.cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
@media (prefers-reduced-motion:no-preference){
  .map .c{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.6s cubic-bezier(.3,.6,.2,1) forwards;animation-delay:calc(var(--i) * 45ms)}
  @keyframes draw{to{stroke-dashoffset:0}}
  .map .sweep{animation:spin 10s linear infinite}
  @keyframes spin{to{transform:rotate(360deg)}}
}

/* glance */
.glance{background:var(--bg2);border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.glance dl{margin:0;display:grid;grid-template-columns:1fr 1fr}
.glance div{padding:22px 20px;border-bottom:1px solid var(--line)}
.glance dt{font:12.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tan)}
html[lang="ar"] .glance dt{letter-spacing:0;font-size:14px;text-transform:none}
.glance dd{margin:8px 0 0;font:600 20px/1.2 var(--head);letter-spacing:.02em}
html[lang="ar"] .glance dd{font-size:17px;line-height:1.5}
@media (min-width:900px){
  .glance dl{grid-template-columns:repeat(3,1fr)}
  .glance div{border-bottom:0;border-inline-start:1px solid var(--line);padding:28px 28px}
  .glance div:first-child{border-inline-start:0;padding-inline-start:0}
}

.glance div:last-child:nth-child(odd){grid-column:1/-1}
@media (min-width:900px){.glance div:last-child:nth-child(odd){grid-column:auto}}

/* sections */
section{padding-block:92px}
section h2{font-size:clamp(34px,5vw,58px);max-width:17ch}
section h2::before{content:"";display:block;width:46px;height:4px;background:var(--tan);margin-bottom:20px}
html[lang="ar"] section h2{max-width:none}
.intro{max-width:36em;margin-top:18px;color:var(--ink2)}
.alt{background:var(--bg2);border-block:1px solid var(--line)}

/* about */
.about{display:grid;gap:44px}
.about .txt p+p{margin-top:18px}
.about .txt p{color:var(--ink2);max-width:36em}
.about .txt p:first-child{color:var(--ink);font-size:1.12em}
.mission{margin-top:34px;border:1px solid var(--line2);padding:22px 24px;max-width:30em;position:relative;background:var(--panel)}
.mission::before{content:"";position:absolute;top:-1px;inset-inline-start:-1px;width:22px;height:22px;border-top:3px solid var(--tan);border-inline-start:3px solid var(--tan)}
.mission b{font:13px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--tan);font-weight:400}
html[lang="ar"] .mission b{font-size:15px;letter-spacing:0;text-transform:none;font-weight:700}
.mission p{margin-top:10px;font-size:1.05em;color:var(--ink)}
@media (min-width:900px){.about{grid-template-columns:5fr 6fr;gap:76px}}

/* framed photos */
.feat figure,.card figure{position:relative;margin:0;overflow:hidden;background:#000;border:1px solid var(--line2)}
.feat figure::before,.card figure::before{content:"";position:absolute;inset:9px;z-index:3;pointer-events:none;
  background:
   linear-gradient(var(--tan),var(--tan)) 0 0/18px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 0 0/2px 18px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 100% 0/18px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 100% 0/2px 18px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 0 100%/18px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 0 100%/2px 18px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 100% 100%/18px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 100% 100%/2px 18px no-repeat}
.feat figure::after,.card figure::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0) 2px,rgba(0,0,0,.2) 3px),radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.55) 100%)}
.feat img,.card img{display:block;width:100%;filter:grayscale(1) contrast(1.15) brightness(.92)}

/* feature */
.feature{background:var(--bg);padding-block:84px}
.feat{display:grid;gap:40px;align-items:center}
.feat figure{max-width:640px}
.feat img{height:auto}
.feat h2{max-width:20ch;font-size:clamp(32px,4.8vw,54px)}
html[lang="ar"] .feat h2{max-width:24ch}
.feat p{margin-top:18px;max-width:32em;color:var(--ink2)}
@media (min-width:900px){.feat{grid-template-columns:6fr 5fr;gap:68px}}

/* panels */
.legend{display:grid;gap:26px;margin-top:46px}
.panel{position:relative;background:var(--panel);border:1px solid var(--line2);padding:34px 30px 30px}
.panel::before{content:"";position:absolute;top:-1px;inset-inline-start:-1px;width:24px;height:24px;border-top:3px solid var(--tan);border-inline-start:3px solid var(--tan)}
.panel::after{content:"";position:absolute;bottom:-1px;inset-inline-end:-1px;width:24px;height:24px;border-bottom:3px solid var(--tan);border-inline-end:3px solid var(--tan)}
.panel h3{font-size:clamp(26px,3.2vw,34px)}
.panel p{margin-top:12px;color:var(--ink2)}
.panel ul{list-style:none;margin:22px 0 0;padding:0;border-top:1px solid var(--line2)}
.panel li{position:relative;padding:12px 0 12px 26px;border-bottom:1px solid var(--line)}
html[dir="rtl"] .panel li{padding:12px 26px 12px 0}
.panel li::before{content:"";position:absolute;inset-inline-start:2px;top:1.15em;width:8px;height:8px;background:var(--tan)}
.panel .out{margin-top:18px;font:14.5px/1.5 var(--mono);color:var(--ink2);letter-spacing:.02em}
html[lang="ar"] .panel .out{font-size:15px;letter-spacing:0}
@media (min-width:900px){.legend{grid-template-columns:1fr 1fr}}

/* domains */
.cards{display:grid;gap:28px;margin-top:46px}
@media (min-width:640px){.cards{grid-template-columns:1fr 1fr}}
@media (min-width:1040px){.cards{grid-template-columns:repeat(4,1fr);gap:22px}}
.card figure{aspect-ratio:4/3;border-bottom:3px solid var(--tan)}
.card img{height:100%;object-fit:cover}
.card figure.cut{background:radial-gradient(ellipse at 50% 45%,rgba(201,171,107,.6),rgba(201,171,107,.14) 55%,#050606 88%)}
.card figure.cut img{filter:contrast(1.08) brightness(1.25)}
.card h3{font-size:26px;margin-top:18px}
.card p{margin-top:8px;color:var(--ink2);font-size:16px}
.fine{margin-top:34px;font:13.5px/1.5 var(--mono);color:var(--ink2);letter-spacing:.03em}
html[lang="ar"] .fine{font-size:14.5px;letter-spacing:0}

/* route */
.route{list-style:none;margin:50px 0 0;padding:0;display:grid;gap:0}
.route li{position:relative;padding-inline-start:66px;padding-bottom:36px}
.route li:last-child{padding-bottom:0}
.route li::before{content:"";position:absolute;inset-inline-start:21px;top:44px;bottom:-2px;width:1px;background:var(--line2)}
.route li:last-child::before{display:none}
.route .n{position:absolute;inset-inline-start:0;top:0;width:44px;height:44px;border:1.5px solid var(--tan);background:var(--bg2);display:grid;place-items:center;font:20px/1 var(--mono);color:var(--tan)}
.route h3{font-size:26px;padding-top:6px}
.route p{margin-top:8px;color:var(--ink2);max-width:30em}
@media (min-width:900px){
  .route{grid-template-columns:repeat(4,1fr);gap:28px}
  .route li{padding:70px 0 0}
  .route li::before{inset-inline-start:44px;inset-inline-end:-28px;width:auto;height:1px;top:22px;bottom:auto}
  .route li:last-child::before{display:none}
}

/* principles */
.pr{display:grid;margin-top:46px}
.pr div{padding:26px 0;border-top:1px solid var(--line2)}
.pr h3{font-size:28px}
.pr p{margin-top:10px;color:var(--ink2);max-width:32em}
@media (min-width:900px){
  .pr{grid-template-columns:repeat(3,1fr);gap:0}
  .pr div{border-top:3px solid var(--tan);padding:28px 32px 6px 0}
  html[dir="rtl"] .pr div{padding:28px 0 6px 32px}
  .pr div+div{margin-inline-start:0;padding-inline-start:0}
  .pr{column-gap:36px}
}

/* faq */
.faq{margin-top:42px;border-top:1px solid var(--line2);max-width:840px}
.faq details{border-bottom:1px solid var(--line2)}
.faq summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;position:relative;font:600 23px/1.25 var(--head);letter-spacing:.03em;text-transform:uppercase}
html[dir="rtl"] .faq summary{padding:22px 0 22px 44px}
html[lang="ar"] .faq summary{font-size:19px;line-height:1.5;letter-spacing:0;text-transform:none;font-weight:700}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;inset-inline-end:4px;top:50%;transform:translateY(-50%);font:400 30px/1 var(--mono);color:var(--tan)}
.faq details[open] summary::after{content:"\2212"}
.faq details[open] summary{color:var(--tan2)}
.faq details p{padding:0 0 24px;color:var(--ink2);max-width:38em}

/* contact */
.contact{display:grid;gap:46px}
@media (min-width:900px){.contact{grid-template-columns:5fr 6fr;gap:76px}}
.mail{display:inline-block;margin-top:28px;font:clamp(19px,3.4vw,28px)/1.2 var(--mono);letter-spacing:.02em;color:var(--tan2);text-decoration:none;direction:ltr;unicode-bidi:embed;border-bottom:1px dashed var(--tan);padding-bottom:4px;word-break:break-all}
.mail:hover{color:#fff}
.where{margin-top:16px;color:var(--ink2)}
form{display:grid;gap:18px}
label{display:grid;gap:8px;font:13px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tan)}
html[lang="ar"] label{font-size:15px;letter-spacing:0;text-transform:none;font-weight:600}
input,select,textarea{font:400 17px/1.4 var(--body);color:var(--ink);background:#040505;border:1px solid var(--line2);padding:14px 15px;width:100%;border-radius:0;letter-spacing:0;text-transform:none}
input:focus,select:focus,textarea:focus{border-color:var(--tan);outline:0;box-shadow:0 0 0 1px var(--tan)}
textarea{min-height:140px;resize:vertical}
.err{color:#E5917F;font-size:16px;min-height:1.2em}
.note{font-size:14.5px;color:var(--ink2)}
form .btn{width:100%}

footer{background:#000;border-top:1px solid var(--line2);color:var(--ink2);padding-block:38px;font-size:15px}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 32px;justify-content:space-between}
footer b{color:var(--ink);font-weight:600}
footer a{text-decoration:none;direction:ltr;unicode-bidi:embed;font-family:var(--mono)}
footer a:hover{color:var(--tan)}

/* six divisions + limits */
@media (min-width:760px){.legend.six{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.legend.six{grid-template-columns:repeat(3,1fr)}}
.legend.six .panel{padding:30px 26px 26px}
.legend.six .panel h3{font-size:clamp(24px,2.4vw,28px)}
.limits{display:grid;gap:18px;margin-top:46px}
@media (min-width:700px){.limits{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.limits{grid-template-columns:repeat(4,1fr)}}
.lim{border:1px solid var(--line2);background:var(--panel);padding:24px 22px 26px}
.lim .x{display:grid;place-items:center;width:34px;height:34px;border:1.5px solid var(--tan);color:var(--tan);font:22px/1 var(--mono)}
.lim h3{font-size:24px;margin-top:16px}
.lim p{margin-top:8px;color:var(--ink2);font-size:16px}

/* logo */
.brand svg{width:44px;height:44px}
.lockup{display:flex;flex-direction:column;align-items:center;text-align:center;padding:8px 24px 38px;margin-bottom:34px;border-bottom:1px solid var(--line)}
.lk-mark{width:96px;height:96px}
.lk-rule{display:flex;align-items:center;gap:20px;width:min(620px,100%);margin-top:16px}
.lk-rule i{flex:1;height:2px;background:linear-gradient(to right,transparent,var(--tan))}
.lk-rule i:last-child{background:linear-gradient(to left,transparent,var(--tan))}
.lk-rule b{font-family:"Saira Stencil One","Saira Condensed","Arial Narrow",Arial,sans-serif;font-weight:400;font-size:clamp(24px,5.4vw,40px);letter-spacing:.09em;color:var(--ink);white-space:nowrap}
.lk-sub{margin-top:10px;font:13px/1.3 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--tan)}
html[lang="ar"] .lk-sub{letter-spacing:0;text-transform:none;font-size:15px}
.lk-ar{margin-top:12px;font:600 18px/1.5 "Cairo","Segoe UI",Tahoma,sans-serif;color:var(--ink2)}

.lk-plate{position:relative;margin-top:0;width:min(640px,100%);border:1px solid var(--line2);background:#000;padding:14px}
.lk-plate img{display:block;width:100%;height:auto}
.lk-plate::before{content:"";position:absolute;inset:7px;pointer-events:none;
  background:
   linear-gradient(var(--tan),var(--tan)) 0 0/16px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 0 0/2px 16px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 100% 0/16px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 100% 0/2px 16px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 0 100%/16px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 0 100%/2px 16px no-repeat,
   linear-gradient(var(--tan),var(--tan)) 100% 100%/16px 2px no-repeat,linear-gradient(var(--tan),var(--tan)) 100% 100%/2px 16px no-repeat}

.lim .x::before{content:"";width:11px;height:11px;background:var(--tan);transform:rotate(45deg)}

@media (min-width:900px) and (max-width:1149px){nav.links{gap:18px}nav.links a{font-size:12.5px;letter-spacing:.05em}.brand small{letter-spacing:.06em}}