@font-face{font-family:"General Sans";src:url(../fonts/GeneralSans-Light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"General Sans";src:url(../fonts/GeneralSans-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"General Sans";src:url(../fonts/GeneralSans-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--navy:#12395C; --navy-2:#1B4A74; --ink:#0C1B2A; --ink-2:#112436; --ink-3:#18304A; --void:#07121D;
  --text:#1F1F26; --graphite:#35353F; --mist:#64686C;
  --silver:#F1F1F4; --panel:#F8F8FA; --line:#E3E3E9; --white:#fff;
  --navy-200:#A9BCD0; --navy-100:#D5DFEA;
  --sans:"General Sans","Readex Pro","Helvetica Neue",Arial,sans-serif; /* Readex Pro carries any Arabic text, in both languages. */
  --mono:"Geist Mono","Readex Pro",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --fs-display:clamp(3rem,8.6vw,9.5rem);
  --fs-h1:clamp(2.5rem,5.8vw,6rem);
  --fs-h2:clamp(2rem,4vw,4.1rem);
  --fs-h3:clamp(1.45rem,2.3vw,2.15rem);
  --fs-lead:clamp(1.12rem,1.5vw,1.45rem);
  --fs-body:1.0625rem; --fs-label:.75rem;
  --gutter:clamp(16px,4vw,48px); --gap:16px; --max:1680px;
  --r-ui:2px; --r-card:12px;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-inout:cubic-bezier(.65,0,.35,1);
  --t1:160ms; --t2:280ms; --t3:450ms; --t4:700ms;
  --bg:var(--silver); --fg:var(--text); --fg-2:var(--graphite); --fg-3:var(--mist); --rule:var(--line); --accent:var(--navy); --focus:var(--navy);
  color-scheme:light;}
[data-surface="silver"]{--bg:var(--silver);--fg:var(--text);--fg-2:var(--graphite);--fg-3:var(--mist);--rule:var(--line);--accent:var(--navy);--focus:var(--navy)}
[data-surface="panel"]{--bg:var(--panel);--fg:var(--text);--fg-2:var(--graphite);--fg-3:var(--mist);--rule:var(--line);--accent:var(--navy);--focus:var(--navy)}
[data-surface="white"]{--bg:#fff;--fg:var(--text);--fg-2:var(--graphite);--fg-3:var(--mist);--rule:var(--line);--accent:var(--navy);--focus:var(--navy)}
[data-surface="ink"]{--bg:var(--ink);--fg:#EEF2F6;--fg-2:#B9C6D4;--fg-3:#8497AB;--rule:rgba(169,188,208,.16);--accent:var(--navy-200);--focus:var(--navy-200)}
[data-surface="void"]{--bg:var(--void);--fg:#EEF2F6;--fg-2:#B9C6D4;--fg-3:#8497AB;--rule:rgba(169,188,208,.16);--accent:var(--navy-200);--focus:var(--navy-200)}
[data-surface="navy"]{--bg:var(--navy);--fg:#fff;--fg-2:#D5DFEA;--fg-3:#A9BCD0;--rule:rgba(255,255,255,.18);--accent:#fff;--focus:#fff}
[data-surface]{background:var(--bg);color:var(--fg)}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important} /* A class selector otherwise outranks the browser's own [hidden] rule. */
html{scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--silver);color:var(--text);font-family:var(--sans);font-size:var(--fs-body);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
::selection{background:var(--navy);color:#fff}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}
h1,h2,h3,h4,h5{margin:0;font-weight:500;letter-spacing:-.025em;line-height:1.02;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0;list-style:none}
dl,dd,figure{margin:0}
.skip{position:fixed;right:16px;top:-60px;z-index:300;background:var(--navy);color:#fff;padding:10px 14px;border-radius:6px;transition:top var(--t2)}
.skip:focus{top:16px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.label{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);line-height:1.4}
.lead{font-size:var(--fs-lead);line-height:1.4;color:var(--fg-2);max-width:42ch}
.muted{color:var(--fg-2)}
.sec{padding-block:clamp(88px,12vw,176px)}
.sec-head{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:end;margin-bottom:clamp(40px,6vw,88px)}
.sec-head .label{grid-column:1/4}
.sec-head h2{grid-column:4/11;font-size:var(--fs-h2)}
.sec-head .more{grid-column:11/13;justify-self:end}
@media (max-width:900px){
.sec-head{grid-template-columns:1fr}
.sec-head>*{grid-column:1/-1!important;justify-self:start!important}
}
.req{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 8px;border-radius:4px;background:#FFF4D6;color:#6B4E00;vertical-align:middle;white-space:nowrap;line-height:1.3}
.req::before{content:"";width:6px;height:6px;border-radius:50%;background:#E0A93B}
.link{display:inline-flex;align-items:center;gap:.6em;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--fg);padding-block:10px;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 6px)/0 1px no-repeat;transition:background-size var(--t3) var(--ease-out)}
.link:hover,.link:focus-visible{background-size:100% 1px}
.link svg{width:14px;height:14px;transition:transform var(--t3) var(--ease-out)}
.link:hover svg{transform:translateX(-4px)}
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:12px;min-height:50px;padding:0 24px;border-radius:999px;background:var(--navy);color:#fff;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;isolation:isolate;transition:transform var(--t2) var(--ease-out)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--navy-2);transform:translateY(101%);transition:transform var(--t3) var(--ease-out)}
.btn:hover::before{transform:none}
.btn svg{width:14px;height:14px;transition:transform var(--t3) var(--ease-out)}
.btn:hover svg{transform:translateX(-4px)}
.btn.light{background:#fff;color:var(--ink)}
.btn.light::before{background:var(--navy-100)}
.btn.ghost{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1px var(--rule)}
.btn.ghost::before{background:var(--rule)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:6px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule);color:var(--fg-2)}
.art{position:relative;background:var(--ink-2) center/cover no-repeat;overflow:hidden;border-radius:var(--r-card)}
.art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out),filter var(--t4)}
a:hover .art>img,a:focus-visible .art>img{transform:scale(1.035)}
[data-lit] .w,[data-msg] .w{opacity:.26;transition:opacity 120ms linear}
.statement{font-size:var(--fs-h2);line-height:1.08;letter-spacing:-.03em;font-weight:500;max-width:22ch}
.nav{position:fixed;inset:0 0 auto 0;z-index:100;pointer-events:none;padding-top:calc(14px + env(safe-area-inset-top,0px));display:flex;justify-content:center}
.pill{pointer-events:auto;position:relative;z-index:2;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:6px;width:340px;height:52px;padding:0 14px 0 6px;border-radius:999px;color:#EEF2F6;background:rgba(12,27,42,.62);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 10px 30px -12px rgba(12,27,42,.5);transition:transform var(--t3) var(--ease-out),background var(--t3),color var(--t3),box-shadow var(--t3),height var(--t3) var(--ease-out)}
.pill-logo{display:flex;align-items:center;height:100%}
.pill-logo svg{width:40px;height:21px;fill:currentColor;transition:width var(--t3) var(--ease-out),height var(--t3) var(--ease-out)}
.ticker{position:relative;height:18px;overflow:hidden;text-align:center;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#B9C6D4}
.ticker span{position:absolute;inset:0;white-space:nowrap;transition:transform var(--t3) var(--ease-out),opacity var(--t3)}
.ticker span.out{transform:translateY(-110%);opacity:0}
.ticker span.in{transform:translateY(110%);opacity:0}
.pill-btn{display:flex;align-items:center;gap:10px;height:40px;padding:0 14px;border-radius:999px;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(255,255,255,.08);transition:background var(--t2),box-shadow var(--t3)}
.pill-btn:hover{background:rgba(255,255,255,.16)}
.pill-btn .ico{position:relative;width:16px;height:10px}
.pill-btn .ico i{position:absolute;right:0;left:0;height:1.5px;background:currentColor;transition:transform var(--t3) var(--ease-out),top var(--t3) var(--ease-out),width var(--t3) var(--ease-out)}
.pill-btn .ico i:first-child{top:1px}
.pill-btn .ico i:last-child{top:7px;width:70%;right:auto}
.pill-btn:hover .ico i:last-child{width:100%}
.nav.open .pill-btn .ico i:first-child{top:4px;transform:rotate(-45deg)}
.nav.open .pill-btn .ico i:last-child{top:4px;width:100%;transform:rotate(45deg)}
.progress{position:absolute;right:22px;left:22px;bottom:0;height:1px;background:rgba(255,255,255,.08);overflow:hidden;border-radius:1px}
.progress i{position:absolute;inset:0;background:var(--navy-200);transform-origin:100% 50%;transform:scaleX(var(--p,0))}
.panel{pointer-events:auto;position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:50%;width:min(1000px,calc(100vw - 32px));transform:translateX(50%);z-index:1;border-radius:22px;background:rgba(12,27,42,.95);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);color:#EEF2F6;padding:84px 28px 22px;clip-path:inset(0 calc(50% - 170px) calc(100% - 52px) calc(50% - 170px) round 26px);visibility:hidden;transition:clip-path var(--t3) var(--ease-inout),visibility 0s var(--t3)}
.nav.open .panel{clip-path:inset(0 0 0 0 round 22px);visibility:visible;transition:clip-path var(--t3) var(--ease-inout),visibility 0s}
.panel>*{opacity:0;transform:translateY(8px);transition:opacity var(--t2),transform var(--t3) var(--ease-out)}
.nav.open .panel>*{opacity:1;transform:none;transition-delay:180ms}
.ip{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:40px}
.ip-item{grid-column:1;display:flex;align-items:baseline;gap:18px;padding:8px 0;font-size:clamp(1.6rem,2.6vw,2.4rem);letter-spacing:-.025em;line-height:1.1;color:#8497AB;transition:color var(--t2),transform var(--t3) var(--ease-out)}
.ip-item[aria-current],.ip-item.on,.ip-item:hover,.ip-item:focus-visible{color:#fff}
.ip-item.on{transform:translateX(-8px)}
.ip-pane{grid-column:2;grid-row:1/span 6;align-self:start;display:none;border-right:1px solid rgba(169,188,208,.16);padding-right:32px;min-height:100%}
.ip-pane.on{display:block;animation:pane var(--t3) var(--ease-out)}
@keyframes pane{from{opacity:0;transform:translateX(-10px)}}
.ip-pane .label{color:#8497AB;margin-bottom:18px}
.ip-sub{display:grid}
.ip-sub a{display:grid;gap:4px;padding:12px 0;border-bottom:1px solid rgba(169,188,208,.12)}
.ip-sub a strong{font-weight:500;font-size:1.05rem;transition:color var(--t2)}
.ip-sub a small{color:#8497AB;font-size:.85rem;line-height:1.35}
.ip-sub a:hover strong{color:var(--navy-200)}
body.world-tech .pill{background:rgba(7,18,29,.78);box-shadow:0 0 0 1px rgba(169,188,208,.22) inset}
body.world-tech .ticker{color:var(--navy-200)}
body.world-tech .panel{background:rgba(7,18,29,.97) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M32 0H0v32' fill='none' stroke='%23A9BCD0' stroke-opacity='.07'/%3E%3C/svg%3E")}
@media (max-width:767px){
.nav{inset:auto 0 0 0;padding:0 12px calc(12px + env(safe-area-inset-bottom,0px))}
.nav .pill{width:100%;max-width:440px;height:56px;padding:0 16px 0 6px;background:rgba(12,27,42,.84);box-shadow:0 12px 30px -10px rgba(12,27,42,.6)}
.panel{position:fixed;inset:0;top:0;right:0;width:100%;height:100%;transform:none;border-radius:0;padding:calc(28px + env(safe-area-inset-top,0px)) 20px calc(96px + env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;clip-path:inset(100% 0 0 0);display:block}
.nav.open .panel{clip-path:inset(0 0 0 0)}
.ip{display:block}
.ip-item{font-size:2rem;padding:12px 0;border-bottom:1px solid rgba(169,188,208,.12)}
.ip-item.on{transform:none}
.ip-pane{border:0;padding:6px 0 18px}
}
.amal{position:fixed;left:max(20px,env(safe-area-inset-left,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:90}
.amal-card{position:relative;display:block;width:216px;height:252px;border-radius:22px;overflow:hidden;background:var(--ink);color:#fff;text-align:right;box-shadow:0 0 0 1px rgba(169,188,208,.18),0 24px 50px -20px rgba(12,27,42,.6);transition:width var(--t4) var(--ease-out),height var(--t4) var(--ease-out),border-radius var(--t4) var(--ease-out),transform var(--t3) var(--ease-out),opacity var(--t2)}
.amal-card:hover{transform:translateY(-3px)}
.amal-card img,.amal-card .bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;transform:scale(1.02);transition:transform 1.2s var(--ease-out)}
.amal-card:hover img,.amal-card:hover .bgv{transform:scale(1.07)}
.amal-card .shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(12,27,42,.97) 10%,rgba(12,27,42,.25) 55%,rgba(12,27,42,0));transition:opacity var(--t3)}
.amal-card .glow{position:absolute;right:-20%;left:-20%;bottom:-40%;height:60%;background:radial-gradient(closest-side,rgba(116,160,206,.5),transparent);filter:blur(10px)}
.amal-card .info{position:absolute;right:16px;left:16px;bottom:14px;display:grid;gap:2px;transition:opacity var(--t2),transform var(--t3) var(--ease-out)}
.amal-card .info strong{font-weight:500;font-size:1.2rem;letter-spacing:-.01em}
.amal-card .info .label{color:#A9BCD0;font-size:.6rem}
.amal-card .cta{margin-top:10px;display:flex;align-items:center;justify-content:space-between;padding-top:10px;border-top:1px solid rgba(169,188,208,.22);font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase}
.amal-card .cta svg{width:14px;height:14px;transition:transform var(--t3) var(--ease-out)}
.amal-card:hover .cta svg{transform:translateX(-4px)}
@keyframes ring{from{transform:scale(.85);opacity:1}to{transform:scale(1.35);opacity:0}}
.eq{display:flex;align-items:center;gap:2px;height:14px}
.eq i{width:2px;border-radius:2px;background:#fff;height:40%;animation:eq 1.1s ease-in-out infinite}
.eq i:nth-child(2){animation-delay:.15s}
.eq i:nth-child(3){animation-delay:.3s}
.eq i:nth-child(4){animation-delay:.45s}
@keyframes eq{0%,100%{height:30%}50%{height:100%}}
.amal.compact .amal-card{width:76px;height:76px;border-radius:24px;box-shadow:none}
.amal-card::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(169,188,208,.24);pointer-events:none} /* Frame drawn inside the card. */
.amal.compact .amal-card .info{opacity:0;transform:translateY(10px)}
/* The scrim and the glow exist to carry the name and role. Compact hides those, so
   on a 76px thumbnail they only muddy the portrait. They come back with the card. */
.amal.compact .amal-card .shade{opacity:0}
.amal.compact .amal-card .glow{opacity:.25}
@media (hover:hover){
.amal.compact .amal-card:focus-visible{width:216px;height:252px;border-radius:22px}
.amal.compact .amal-card:focus-visible .info{opacity:1;transform:none}
.amal.compact .amal-card:focus-visible .shade{opacity:1}
.amal.compact .amal-card:focus-visible .glow{opacity:1}
/* Touch screens keep :hover after a tap; expanding there would leave the large card over the page. */
@media (hover:hover){
.amal.compact .amal-card:hover{width:216px;height:252px;border-radius:22px}
.amal.compact .amal-card:hover .info{opacity:1;transform:none}
.amal.compact .amal-card:hover .shade{opacity:1}
.amal.compact .amal-card:hover .glow{opacity:1}
}
}
@media (max-width:767px){
.amal{left:12px;bottom:calc(84px + env(safe-area-inset-bottom,0px))}
/* Phones get the same portrait card as a desktop, scaled down: the name and the invitation while the visitor is
   still at the top of the page, small once they scroll. The bar layout this replaces cut "of DBU" off the role. */
.amal-card{width:132px;height:154px;border-radius:16px}
.amal-card .info{right:10px;left:10px;bottom:9px}
.amal-card .info strong{font-size:.8rem}
.amal-card .info .label{font-size:.44rem;letter-spacing:.04em}
.amal-card .cta{margin-top:7px;padding-top:7px;font-size:.5rem}
.amal-card .cta svg{width:11px;height:11px}
.amal.compact .amal-card{width:64px;height:64px;border-radius:20px}
}
.view{min-height:100vh}
.opening{position:relative;background:var(--ink)}
.opening-bg{position:sticky;top:0;height:100vh;height:100svh;margin-bottom:-100vh;margin-bottom:-100svh;overflow:hidden;z-index:0}
.opening-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;filter:grayscale(.35) contrast(1.05);transform:scale(calc(1.1 - var(--p,0) * .1))}
.opening-bg .tint{position:absolute;inset:0;background:linear-gradient(-180deg,rgba(12,27,42,.55),rgba(12,27,42,.3) 40%,rgba(12,27,42,.92)),rgba(18,57,92,.35)}
.opening-bg .dim{position:absolute;inset:0;background:var(--ink);opacity:var(--dim,0)}
.hero-b{position:relative;z-index:1;min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;padding-top:clamp(110px,12vw,150px);padding-bottom:36px;color:#fff}
.hero-b h1{align-self:end;font-size:clamp(3.4rem,10.5vw,11.5rem);line-height:.88;letter-spacing:-.055em;font-weight:500;padding-bottom:clamp(28px,4vw,56px)}
.hero-b h1 span{display:block}
.hero-b h1 .soft{color:rgba(255,255,255,.45);font-weight:400}
.hero-b .base{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:end;padding-top:22px;border-top:1px solid rgba(255,255,255,.2)}
.hero-b .base p{grid-column:1/6;color:#D5DFEA;font-size:var(--fs-lead);line-height:1.4;max-width:40ch}
.hero-b .base .ctas{grid-column:6/10;display:flex;flex-wrap:wrap;gap:10px}
.hero-b .base .cue{grid-column:11/13;justify-self:end;display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:#B9C6D4}
.a-opening .a-label{color:#B9C6D4;align-self:start}
/* About: the photograph fills the opening and stops with it (Home's scrolling background is not used here). */
.a-opening .opening-bg{position:absolute;inset:0;height:auto;margin:0}
.a-opening .hero-b{padding-bottom:clamp(40px,5vw,64px)}
.a-opening + .sec{padding-top:clamp(56px,7vw,96px)}
.a-opening .base .intro{grid-column:1/7;display:grid;gap:14px}
.a-opening .base .intro p{max-width:52ch}
.cue-line{width:1px;height:44px;background:rgba(255,255,255,.2);position:relative;overflow:hidden}
.cue-line::after{content:"";position:absolute;right:0;top:-40%;width:1px;height:40%;background:#fff;animation:cue 2s var(--ease-inout) infinite}
@keyframes cue{to{top:100%}}
.hero-b .btn.ghost{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.hero-b .btn.ghost::before{background:rgba(255,255,255,.12)}
@media (max-width:900px){
.hero-b .base{grid-template-columns:1fr;gap:24px}
.hero-b .base>*{grid-column:1/-1!important;justify-self:start!important}
.hero-b .base .cue{display:none}
}
.statements{position:relative;z-index:1;height:320vh;color:#fff}
.statements .stage{position:sticky;top:0;height:100vh;height:100svh;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-content:center;row-gap:40px}
.statements .rule{grid-column:1/-1;height:1px;background:rgba(255,255,255,.18);position:relative}
.statements .rule i{position:absolute;inset:0;background:#fff;transform-origin:100% 50%;transform:scaleX(var(--p,0))}
.statements .side{grid-column:1/4;display:grid;gap:10px;align-content:start}
.statements .side .label{color:#B9C6D4}
.statements .count{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;color:#8497AB}
.statements .count b{color:#fff;font-weight:400}
.statements .msgs{grid-column:4/12;display:grid;min-height:3.6em;font-size:clamp(1.8rem,3.7vw,3.7rem);line-height:1.1}
.statements .msg{grid-area:1/1;letter-spacing:-.03em;font-weight:500;max-width:24ch;will-change:transform,opacity}
@media (max-width:767px),(prefers-reduced-motion:reduce){
.statements{height:auto;padding-block:72px 96px}
.statements .stage{position:relative;height:auto;grid-template-columns:1fr}
.statements .stage>*{grid-column:1/-1!important}
.statements .msgs{gap:40px;overflow:visible}
.statements .msg{grid-area:auto;font-size:clamp(1.7rem,7.4vw,2.4rem)}
.statements .count{display:none}
.opening-bg img{transform:none}
}
/* At a glance, as an index. The words are tabs; picking one opens its headline and line beside it, and
   the four facts sit along the bottom. Words and panes both start from the rule under the eyebrow. */
.glance{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);row-gap:clamp(40px,5vw,72px)}
.glance>.label{grid-column:1/-1;margin:0;font-weight:400;padding-bottom:18px;border-bottom:1px solid var(--rule)}
.gl-words{grid-column:1/6;display:grid;align-content:start}
/* Unpicked words sit back in a pale grey so the chosen one reads as the answer; the navy stroke under it
   grows in from the reading edge (rtlcss flips it for Arabic). */
.gl-w{position:relative;display:block;width:fit-content;text-align:start;font-weight:500;font-size:clamp(2.8rem,6.2vw,6.4rem);line-height:.98;letter-spacing:-.05em;color:#B7BAC2;padding-block:.02em .1em;transition:color .5s var(--ease-out)}
.gl-w::after{content:"";position:absolute;right:0;bottom:.02em;height:2px;width:0;background:var(--navy);transition:width .6s var(--ease-out)}
.gl-w:hover{color:var(--fg-2)}
.gl-w[aria-selected="true"]{color:var(--fg)}
.gl-w[aria-selected="true"]::after{width:1.2em}
.gl-panes{grid-column:7/13;align-self:start;padding-top:.6em;min-height:15em}
.gl-pane{display:grid;gap:22px;animation:rise .7s var(--ease-out) both}
.gl-pane .label{color:var(--navy)}
.gl-pane h3{font-weight:300;font-size:clamp(1.8rem,3.2vw,3rem);line-height:1.08;letter-spacing:-.035em;max-width:17ch}
.gl-pane p{font-size:clamp(1.05rem,1.25vw,1.2rem);line-height:1.5;color:var(--fg-2);max-width:44ch}
.gl-facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);border-top:1px solid var(--rule);padding-top:22px;margin:0}
.gl-facts>div{display:grid;gap:8px;align-content:start}
.gl-facts dd{margin:0;font-size:1rem;line-height:1.45;max-width:24ch}
@media (max-width:900px){
.gl-words,.gl-panes{grid-column:1/-1}
.gl-panes{min-height:0;padding-top:0}
.gl-facts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}
}
@media (max-width:420px){.gl-facts{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.gl-pane{animation:none}.gl-w,.gl-w::after{transition:none}}
.ind{position:relative;height:calc(var(--n,6) * 55vh + 100vh);color:#EEF2F6;background:var(--ink)}
.ind .stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:var(--gap)}
.atms{position:absolute;inset:0}
.atms{overflow:hidden}
.atm{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity 1.1s var(--ease-inout)}
.atm.on{opacity:1}
.atm-img,.atm .bgv{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transform:scale(1.08)} /* Scaled so blurred edges stay outside the section. */
/* Background videos sit over their image (the image is the fallback); none with reduced motion. */
.opening-bg .bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;filter:grayscale(.35) contrast(1.05)}
@media (prefers-reduced-motion:reduce){.bgv{display:none}}
.atm-0{background:radial-gradient(70% 60% at 85% 20%,rgba(43,92,136,.55),transparent 70%),linear-gradient(-160deg,#0E2338,#0A1826)}
.atm-1{background:repeating-linear-gradient(0deg,rgba(169,188,208,.045) 0 1px,transparent 1px 28px),radial-gradient(60% 60% at 70% 70%,rgba(27,74,116,.5),transparent 70%),#0B1B2B}
.atm-2{background:linear-gradient(rgba(169,188,208,.05) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(-90deg,rgba(169,188,208,.05) 1px,transparent 1px) 0 0/64px 64px,radial-gradient(60% 70% at 25% 85%,rgba(76,120,166,.45),transparent 70%),#0C1D2F}
.atm-3{background:radial-gradient(55% 55% at 75% 65%,rgba(120,124,140,.32),transparent 70%),radial-gradient(40% 40% at 20% 20%,rgba(53,53,63,.8),transparent 70%),#131722}
.atm-4{background:radial-gradient(70% 50% at 60% 10%,rgba(169,188,208,.2),transparent 70%),radial-gradient(60% 60% at 90% 90%,rgba(27,74,116,.55),transparent 70%),#0D2031}
.atm-5{background:radial-gradient(circle,rgba(169,188,208,.12) 1px,transparent 1.5px) 0 0/22px 22px,radial-gradient(60% 60% at 80% 50%,rgba(18,57,92,.6),transparent 70%),#07121D}
.ind .head{position:absolute;top:clamp(96px,11vw,130px);right:var(--gutter);left:var(--gutter);display:flex;justify-content:space-between;align-items:baseline;z-index:2}
.ind .head .label{color:#8497AB}
.ind .bar{position:absolute;right:var(--gutter);left:var(--gutter);bottom:32px;height:1px;background:rgba(169,188,208,.18);z-index:2}
.ind .bar i{position:absolute;inset:0;background:var(--navy-200);transform-origin:100% 50%;transform:scaleX(var(--p,0));transition:transform var(--t4) var(--ease-out)}
.wheel-wrap{position:relative;height:100%;z-index:1}
.wheel{position:absolute;top:50%;right:0;width:min(84vh,820px);aspect-ratio:1;transform:translate(50%,-50%)}
.wheel-rot{position:absolute;inset:0;transform:rotate(calc(-1*(var(--a,0) * -1deg)));transition:transform 900ms var(--ease-out)}
.wheel-item{position:absolute;right:50%;top:50%;transform-origin:100% 50%;transform:rotate(calc(-1*(var(--i) * var(--step,16) * 1deg))) translateX(calc(-1*(min(42vh,410px) * .44)));white-space:nowrap;font-size:clamp(1.5rem,2.4vw,2.6rem);letter-spacing:-.035em;line-height:1;padding:10px 0;margin-top:-.7em;color:#fff;opacity:var(--o,.25);filter:blur(var(--b,0px));transition:opacity var(--t4),filter var(--t4)}
.wheel-item[aria-selected="true"]{font-weight:500}
.ind .ctx{position:relative;z-index:1;display:grid;max-width:620px;padding-left:var(--gutter)}
/* All six panels share one grid cell: the cell is as tall as the tallest, so switching industry never resizes the section. */
.ind .ipanel{grid-area:1/1;display:grid;gap:26px;align-content:start;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity var(--t3),transform var(--t4) var(--ease-out),visibility 0s var(--t4)}
.ind .ipanel.on{opacity:1;visibility:visible;transform:none;transition:opacity var(--t3),transform var(--t4) var(--ease-out)}
.ind .ctx .t{font-size:clamp(2.2rem,4.4vw,4.6rem);line-height:.98;letter-spacing:-.04em}
.ind .ctx .lead{color:#D5DFEA;max-width:34ch}
.ind .ctx .link{color:#fff}
.ind .skip-ind{position:absolute;right:var(--gutter);bottom:48px;z-index:2;color:#B9C6D4}
@media (max-width:1023px),(prefers-reduced-motion:reduce){
.ind{height:auto}
.ind .stage{position:relative;height:auto;grid-template-columns:minmax(0,1fr);padding-block:clamp(96px,12vw,140px) 72px;overflow:visible;align-items:start}
.ind .head{position:relative;top:auto;right:auto;left:auto;padding-inline:var(--gutter);margin-bottom:20px}
.wheel-wrap{height:auto;padding-inline:var(--gutter)}
.wheel{position:relative;top:auto;right:auto;width:auto;aspect-ratio:auto;transform:none}
.wheel-rot{position:relative;transform:none!important;display:flex;flex-wrap:wrap;gap:8px}
.wheel-item{position:relative;right:auto;top:auto;margin:0;transform:none;font-size:1rem;letter-spacing:0;opacity:1;filter:none;padding:12px 16px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(169,188,208,.3);color:#B9C6D4;transition:background var(--t2),color var(--t2)}
.wheel-item[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:none;font-weight:400}
.ind .ctx{max-width:none;padding-inline:var(--gutter);margin-top:36px}
.ind .skip-ind,.ind .bar{display:none}
}
@media (max-width:767px){
.wheel-rot{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scrollbar-width:none}
.wheel-rot::-webkit-scrollbar{display:none}
.wheel-item{flex:none;scroll-snap-align:start}
}
.hero-ed{padding-top:clamp(140px,18vw,220px);padding-bottom:clamp(56px,7vw,96px)}
.hero-ed .label{margin-bottom:28px}
.hero-ed h1{font-size:var(--fs-display);line-height:.92;letter-spacing:-.045em;font-weight:500;max-width:14ch}
.hero-ed h1 em{font-style:normal;color:var(--fg-3);font-weight:400}
.hero-ed .row{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);margin-top:clamp(48px,6vw,96px);padding-top:20px;border-top:1px solid var(--rule);align-items:start}
.hero-ed .row .lead{grid-column:1/6}
@media (max-width:900px){
.hero-ed .row{grid-template-columns:1fr;gap:28px}
.hero-ed .row>*{grid-column:1/-1!important;justify-self:start!important}
}
@keyframes mq{to{transform:translateX(50%)}}
.tech{--fg-grid:rgba(169,188,208,.07);background:var(--void);color:#EEF2F6;--bg:var(--void);--fg:#EEF2F6;--fg-2:#B9C6D4;--fg-3:#8497AB;--rule:rgba(169,188,208,.18);--accent:var(--navy-200);--focus:var(--navy-200)}
.tech .grid-bg{background-image:linear-gradient(var(--fg-grid) 1px,transparent 1px),linear-gradient(-90deg,var(--fg-grid) 1px,transparent 1px);background-size:32px 32px}
.tech h1,.tech h2,.tech h3{font-weight:500;letter-spacing:-.035em}
.mod-id{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;color:var(--navy-200);text-transform:uppercase;display:flex;gap:14px;align-items:center}
.mod-id::before{content:"";width:8px;height:8px;background:var(--navy-200);box-shadow:0 0 12px var(--navy-200)}
.mod-id i{flex:1;height:1px;background:rgba(169,188,208,.2)}
.t-hero{position:relative;min-height:100vh;min-height:100svh;display:grid;align-content:end;padding-bottom:110px;overflow:hidden}
.t-hero canvas{position:absolute;inset:0;width:100%;height:100%}
.t-hero .veil{position:absolute;inset:0;background:radial-gradient(80% 70% at 30% 70%,rgba(7,18,29,.9),rgba(7,18,29,.2) 70%)}
.t-hero .wrap{position:relative;display:grid;gap:36px}
.t-hero h1{font-size:clamp(2.8rem,7.2vw,7.8rem);line-height:.94;max-width:14ch}
.t-hero h1 .mono{font-family:var(--mono);font-weight:400;font-size:.36em;letter-spacing:.02em;color:var(--navy-200);vertical-align:.9em;margin-left:.3em}
.t-hero .spec{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(169,188,208,.2)}
.t-hero .spec div{padding:16px 0 0 16px;display:grid;gap:6px}
.t-hero .spec b{font-weight:500;font-size:1.05rem}
.coord{position:fixed;z-index:5;pointer-events:none;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;color:var(--navy-200);opacity:0;transition:opacity var(--t2)}
.tech:hover .coord{opacity:.8}
@media (max-width:900px){
.t-hero .spec{grid-template-columns:1fr 1fr;gap:12px}
}
@media (hover:none){
.coord{display:none}
}
.t-pos{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
.t-pos .mod-id{grid-column:1/-1;margin-bottom:48px}
.t-pos h2{grid-column:1/8;font-size:var(--fs-h2)}
.t-pos .col{grid-column:9/13;display:grid;gap:24px;align-content:end;color:#B9C6D4}
@media (max-width:900px){
.t-pos{grid-template-columns:1fr}
.t-pos>*{grid-column:1/-1!important}
}
.specs{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);border:1px solid rgba(169,188,208,.18)}
.spec-list{border-left:1px solid rgba(169,188,208,.18)}
.spec-tab{display:grid;grid-template-columns:64px 1fr 20px;align-items:center;width:100%;text-align:right;padding:20px;border-bottom:1px solid rgba(169,188,208,.12);color:#8497AB;transition:color var(--t1) steps(2),background var(--t1) steps(2)}
.spec-tab:last-child{border-bottom:0}
.spec-tab .n{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em}
.spec-tab strong{font-weight:500;font-size:1.1rem}
.spec-tab::after{content:"";width:8px;height:8px;border:1px solid currentColor;justify-self:end}
.spec-tab[aria-selected="true"]{color:#fff;background:rgba(169,188,208,.06)}
.spec-tab[aria-selected="true"]::after{background:var(--navy-200);border-color:var(--navy-200);box-shadow:0 0 10px var(--navy-200)}
.spec-body{padding:clamp(20px,3vw,40px);display:grid;gap:28px;align-content:start}
.spec-body h3{font-size:var(--fs-h3);max-width:22ch}
.flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch}
.flow>div{border:1px solid rgba(169,188,208,.2);padding:14px;display:grid;gap:8px;align-content:start}
.flow>div ul{display:grid;gap:4px;color:#B9C6D4;font-size:.92rem}
.flow>i{width:36px;align-self:center;height:1px;background:repeating-linear-gradient(-90deg,var(--navy-200) 0 4px,transparent 4px 8px);animation:dash 1s steps(4) infinite}
@keyframes dash{to{background-position:right 8px top 0}}
.flow .core{background:rgba(169,188,208,.06);border-color:rgba(169,188,208,.4)}
.kv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(169,188,208,.14)}
.kv div{padding:14px 0 0 14px;display:grid;gap:4px}
.kv b{font-weight:500}
@media (max-width:900px){
.specs{grid-template-columns:1fr}
.spec-list{border-left:0;border-bottom:1px solid rgba(169,188,208,.18);display:flex;overflow-x:auto;scrollbar-width:none}
.spec-tab{flex:none;width:auto;grid-template-columns:auto auto;gap:10px;border-bottom:0;border-left:1px solid rgba(169,188,208,.12)}
.spec-tab::after{display:none}
.flow{grid-template-columns:1fr}
.flow>i{width:1px;height:24px;justify-self:center;background:repeating-linear-gradient(-180deg,var(--navy-200) 0 4px,transparent 4px 8px)}
.kv{grid-template-columns:1fr}
}
.arch{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center;color:#EEF2F6}
.layers{display:grid;gap:10px;perspective:1400px}
.layer{position:relative;display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:12px;padding:20px 22px;text-align:right;border:1px solid rgba(169,188,208,.2);background:linear-gradient(-90deg,rgba(169,188,208,.05),rgba(169,188,208,0));transform:rotateX(18deg) translateX(calc(-1*(var(--d) * 14px)));transform-origin:50% 100%;transition:transform var(--t3) var(--ease-out),border-color var(--t1),background var(--t1)}
.layer .n{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;color:#8497AB}
.layer strong{font-weight:500;font-size:clamp(1.05rem,1.4vw,1.3rem)}
.layer .st{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;color:#8497AB}
.layer.on,.layer:hover,.layer:focus-visible{border-color:var(--navy-200);background:linear-gradient(-90deg,rgba(169,188,208,.16),rgba(169,188,208,.02));transform:rotateX(0) translateX(calc(-1*(var(--d) * 14px + 10px)))}
.layer.on .st{color:var(--navy-200)}
.arch-detail{border-right:1px solid rgba(169,188,208,.2);padding-right:clamp(20px,3vw,40px);min-height:300px;display:grid;align-content:center}
.arch-detail .sw{display:grid;gap:18px;transition:opacity var(--t1) steps(3)}
.arch-detail h3{font-size:var(--fs-h3)}
.arch-detail.fade .sw{opacity:0}
.arch-detail .chip{color:#B9C6D4;box-shadow:inset 0 0 0 1px rgba(169,188,208,.25)}
@media (max-width:900px){
.arch{grid-template-columns:1fr}
.layer{transform:none!important}
.arch-detail{border-right:0;padding-right:0;border-top:1px solid rgba(169,188,208,.2);padding-top:24px;min-height:0}
}
.tlist{border-top:1px solid rgba(169,188,208,.18)}
.tlist a{display:grid;grid-template-columns:140px minmax(0,1fr) 140px 24px;gap:var(--gap);align-items:baseline;padding:22px 0;border-bottom:1px solid rgba(169,188,208,.18);transition:padding var(--t1) steps(2),background var(--t1) steps(2)}
.tlist a:hover{background:rgba(169,188,208,.05);padding-inline:12px}
.tlist strong{font-weight:500;font-size:clamp(1.1rem,1.6vw,1.45rem)}
.tlist svg{width:16px;height:16px}
@media (max-width:767px){
.tlist a{grid-template-columns:1fr 24px}
.tlist a .label:nth-of-type(2){display:none}
}
.a-hero{padding-top:clamp(140px,16vw,200px)}
.a-hero .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:end}
.a-hero h1{grid-column:1/9;font-size:var(--fs-display);line-height:.9;letter-spacing:-.05em}
.a-hero h1 span{display:block}
.a-hero h1 span+span{color:var(--fg-3);font-weight:400}
.a-hero .intro{grid-column:9/13;display:grid;gap:18px;color:var(--fg-2)}
.a-hero .photo{margin-top:clamp(48px,6vw,88px);aspect-ratio:21/8;border-radius:16px}
.a-hero .photo img{object-position:50% 45%}
@media (max-width:900px){
.a-hero .grid{grid-template-columns:1fr}
.a-hero .grid>*{grid-column:1/-1}
.a-hero .photo{aspect-ratio:4/3}
}
.who{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
.who>.label{grid-column:1/4}
.who .statement{grid-column:4/12;max-width:20ch}
.who .mission{grid-column:4/10;margin-top:40px;font-size:var(--fs-lead);color:var(--fg-2);line-height:1.45}
.who .pillars{grid-column:1/-1;margin-top:clamp(56px,7vw,100px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule)}
.who .pillars div{padding:22px 0 0 20px;display:grid;gap:12px;align-content:start}
.who .pillars div+div{padding-right:20px;border-right:1px solid var(--rule)}
.who .pillars h3{font-size:1.35rem}
.who .pillars p{color:var(--fg-2);font-size:.95rem}
@media (max-width:900px){
.who{grid-template-columns:1fr}
.who>*{grid-column:1/-1!important}
.who .pillars{grid-template-columns:1fr 1fr;gap:24px 0}
.who .pillars div+div{border-right:0;padding-right:0}
.who .pillars div:nth-child(even){padding-right:20px;border-right:1px solid var(--rule)}
}
.princ{border-top:1px solid var(--rule)}
.princ li{display:grid;grid-template-columns:80px minmax(0,5fr) minmax(0,6fr);gap:var(--gap);padding:clamp(22px,3vw,40px) 0;border-bottom:1px solid var(--rule);align-items:baseline}
.princ .n{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;color:var(--fg-3)}
.princ h3{font-size:clamp(1.8rem,3.4vw,3.4rem);font-weight:400;letter-spacing:-.04em}
.princ p{color:var(--fg-2);max-width:48ch}
@media (max-width:767px){
.princ li{grid-template-columns:40px 1fr}
.princ p{grid-column:2}
}
.chamber h1{font-weight:300;letter-spacing:-.05em}
.frame{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule)}
.frame div{padding:22px 0 0 20px;display:grid;gap:10px;align-content:start}
.frame div+div{padding-right:20px;border-right:1px solid var(--rule)}
.frame b{font-weight:500;font-size:1.25rem}
.frame p{color:var(--fg-2);font-size:.95rem}
@media (max-width:767px){
.frame{grid-template-columns:1fr 1fr;gap:24px 0}
.frame div+div{border-right:0;padding-right:0}
.frame div:nth-child(even){padding-right:20px;border-right:1px solid var(--rule)}
}
.arg{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);padding-block:clamp(40px,5vw,72px);border-top:1px solid var(--rule)}
.arg>.label{grid-column:1/4;padding-top:.5em}
.arg .body{grid-column:4/11;display:grid;gap:24px}
.arg .body>p{font-size:var(--fs-lead);line-height:1.5;color:var(--fg-2);max-width:56ch}
.dash{display:grid;gap:12px;font-size:1.1rem}
.dash li{display:grid;grid-template-columns:28px 1fr}
.probs{counter-reset:q;display:grid}
.probs li{counter-increment:q;display:grid;grid-template-columns:72px 1fr;padding:22px 0;border-bottom:1px solid var(--rule);font-size:clamp(1.25rem,2vw,1.8rem);letter-spacing:-.02em;line-height:1.2;font-weight:300}
.probs li::before{content:counter(q,decimal-leading-zero);font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;color:var(--fg-3);padding-top:.5em}
@media (max-width:900px){
.arg{grid-template-columns:1fr}
.arg>*{grid-column:1/-1!important}
}
.empty{padding:48px 0;color:var(--fg-2)}
.cd-hero{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:end;color:#fff;overflow:hidden}
.cd-hero .art{position:absolute;inset:0;border-radius:0}
.cd-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(12,27,42,.95) 8%,rgba(12,27,42,.2) 70%)}
.cd-hero .wrap{position:relative;z-index:2;padding-bottom:40px}
.cd-hero h1{font-size:clamp(2.4rem,5.6vw,5.8rem);line-height:.98;letter-spacing:-.045em;max-width:18ch;margin:20px 0 clamp(40px,5vw,72px)}
.cd-hero .label{color:#A9BCD0}
.cd-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.22)}
.cd-summary div{padding:16px 0 0 16px;display:grid;gap:6px;align-content:start}
.cd-summary b{font-weight:500}
@media (max-width:900px){
.cd-summary{grid-template-columns:1fr 1fr;gap:12px}
}
.outcomes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.outcomes div{padding:28px 0 28px 24px;display:grid;gap:12px;align-content:start;border-bottom:1px solid var(--rule)}
.outcomes div:not(:nth-child(3n+1)){padding-right:24px;border-right:1px solid var(--rule)}
.outcomes .n{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;color:var(--fg-3)}
.outcomes h3{font-size:1.5rem;letter-spacing:-.02em}
.outcomes p{color:var(--fg-2)}
@media (max-width:900px){
.outcomes{grid-template-columns:1fr}
.outcomes div:not(:nth-child(3n+1)){padding-right:0;border-right:0}
}
.cd-media .art{aspect-ratio:21/9;border-radius:0}
.cd-media figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:12px}
.ahead{padding-top:clamp(130px,15vw,190px);display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
/* The link is an inline-flex box with its own min-height; the plain spans next
   to it stretched to that height and sat their text on the top edge, so
   "JOURNAL" and "/ INSIGHT" rode on different baselines. */
.ahead .crumbs{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ahead h1{grid-column:1/11;font-size:clamp(2.4rem,5.4vw,5.6rem);line-height:.98;letter-spacing:-.045em;margin-top:28px}
.ahead .dek{grid-column:1/9;font-size:var(--fs-lead);color:var(--fg-2);line-height:1.45;margin-top:28px}
.ahead .byline{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:18px clamp(40px,6vw,88px);margin-top:40px;padding-block:22px;border-block:1px solid var(--rule)}
.ahead .byline div{display:grid;gap:6px;min-width:0}
.a-figure{margin-block:clamp(32px,4vw,56px)}
.a-figure .art{aspect-ratio:2/1;border-radius:14px}
.a-figure figcaption{margin-top:12px}
/* A vertical film (9:16) plays in a tall frame of its own, centred. In the 2:1 frame it would be a strip between
   wide black bars. On a phone it fills the width, as it would in the visitor's own feed. */
.a-figure.is-portrait .vwrap{width:min(440px,100%);margin-inline:auto}
.a-figure.is-portrait .art{aspect-ratio:9/16}
.abody{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);padding-bottom:clamp(80px,10vw,140px)}
.toc{grid-column:1/4;position:sticky;top:110px;align-self:start;display:grid;gap:4px}
.toc a{font-size:.92rem;color:var(--fg-3);padding:6px 14px 6px 0;border-right:1px solid var(--rule);transition:color var(--t2),border-color var(--t2)}
.toc a.on,.toc a:hover{color:var(--fg);border-color:var(--navy)}
.prose{grid-column:4/10;font-size:1.18rem;line-height:1.7;max-width:68ch}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:1.9rem;letter-spacing:-.025em;line-height:1.15;margin-top:2em;scroll-margin-top:110px}
.prose blockquote{margin:1.8em 0;padding:0;font-size:clamp(1.6rem,2.6vw,2.4rem);line-height:1.2;letter-spacing:-.025em;font-weight:500}
.prose blockquote::before{content:"";display:block;width:48px;height:2px;background:var(--navy);margin-bottom:20px}
.prose ul{display:grid;gap:8px}
/* Editor lists carry inline markup (a bold lead-in, a link, a <br>). As a grid
   every element child became its own grid item, so the text after a <strong>
   dropped into the 24px marker column and wrapped one word per line. The item
   stays a normal block and the marker is positioned out of flow. */
.prose ul li{display:block;position:relative;padding-right:24px}
.aside{grid-column:10/13;align-self:start;position:sticky;top:110px;display:grid;gap:16px;padding-right:20px;border-right:1px solid var(--rule)}
.aside p{font-size:.92rem;color:var(--fg-2)}
@media (max-width:1023px){
.toc,.aside{display:none}
.prose{grid-column:1/-1;font-size:1.1rem}
}
@media (max-width:900px){
.ahead>*{grid-column:1/-1!important}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
[data-lit] .w,[data-msg] .w{opacity:1!important}
}
@media (forced-colors:active){
.pill,.panel,.amal-card{border:1px solid CanvasText}
}
.ind .stage>*{min-width:0}
.pill{width:360px}
.ticker{min-width:0;margin-inline:6px}
.ticker span{overflow:hidden;text-overflow:ellipsis;padding-inline:2px}
.nav.open .ticker{opacity:0;transition:opacity var(--t2)}
.ip-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:26px;padding-top:18px;border-top:1px solid rgba(169,188,208,.14)}
.ip-links{display:flex;gap:22px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:#8497AB}
.ip-links a{transition:color var(--t2)}
.ip-links a:hover{color:#fff}
@media (max-width:767px){
.ip-foot{flex-direction:row}
.ip-links{gap:16px}
}
.hero-b{grid-template-rows:1fr auto auto}
.ind .ipanel{gap:22px}
.ind .ctx .t{font-size:clamp(2.6rem,5vw,5.4rem)}
.ind .ctx .lead{font-size:clamp(1.25rem,1.8vw,1.7rem);color:#EEF2F6;max-width:30ch}
.ind .ctx .sub{color:#8FA3B8;max-width:44ch}
.ttease{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:center;overflow:hidden;background:radial-gradient(60% 70% at 72% 50%,#0F2740,#07121D 70%);color:#EEF2F6}
.ttease canvas{position:absolute;top:0;left:-8vw;width:min(78vw,1100px);height:100%}
.ttease .wrap{position:relative;display:grid;gap:30px;justify-items:start;padding-block:120px}
.ttease h2{font-size:clamp(3rem,7.4vw,8rem);line-height:.9;letter-spacing:-.055em;max-width:10ch}
.rot-line{font-family:var(--mono);font-size:clamp(.8rem,1vw,.95rem);letter-spacing:.12em;text-transform:uppercase;color:#8497AB;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.rot{position:relative;display:inline-block;height:1.4em;overflow:hidden;min-width:20ch;color:#EEF2F6}
.rot span{display:block;transition:transform var(--t4) var(--ease-out),opacity var(--t3)}
.rot span.out{transform:translateY(-110%);opacity:0;position:absolute;top:0;right:0}
.rot span.in{transform:translateY(110%);opacity:0}
.enter{display:inline-flex;align-items:center;gap:22px;margin-top:12px;padding:22px 34px 22px 30px;border-radius:999px;background:#fff;color:var(--ink);font-size:clamp(1.1rem,1.4vw,1.35rem);letter-spacing:-.01em;transition:gap var(--t3) var(--ease-out),transform var(--t3) var(--ease-out),box-shadow var(--t3)}
.enter svg{width:20px;height:20px;transition:transform var(--t3) var(--ease-out)}
.enter:hover{gap:30px;box-shadow:0 0 0 8px rgba(169,188,208,.14)}
.enter:hover svg{transform:translateX(-4px)}
@media (max-width:767px){
.ttease canvas{left:-30vw;width:130vw;opacity:.55}
.ttease .wrap{padding-block:96px}
}
.drow{position:relative}
.track{position:relative;display:flex;gap:clamp(16px,2vw,32px);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding-inline:var(--gutter);scroll-padding-inline:var(--gutter);padding-block:8px 4px;cursor:grab;-webkit-user-select:none;user-select:none}
.track::-webkit-scrollbar{display:none}
.track.drag{cursor:grabbing;scroll-snap-type:none}
.track:focus-visible{outline-offset:-2px}
.track img{pointer-events:none}
.row-ctrl{display:flex;align-items:center;gap:12px;margin-top:36px}
.row-ctrl button{width:54px;height:54px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rule);display:grid;place-items:center;transition:background var(--t2),color var(--t2),transform var(--t3) var(--ease-out)}
.row-ctrl button:hover{background:var(--fg);color:var(--bg)}
.row-ctrl button:active{transform:scale(.94)}
.row-ctrl button:disabled{opacity:.3;pointer-events:none}
.row-ctrl button svg{width:16px;height:16px}
.row-ctrl .bar{flex:1;height:1px;background:var(--rule);position:relative;margin-inline:12px}
.row-ctrl .bar i{position:absolute;top:0;bottom:0;right:0;background:var(--fg);width:calc(100% / var(--n,1));transform:translateX(calc(-1*(var(--i,0) * 100%)));transition:transform var(--t4) var(--ease-out)}
.row-ctrl .count{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;color:var(--fg-3);font-variant-numeric:tabular-nums}
.drag-cursor{position:fixed;z-index:120;right:0;top:0;width:88px;height:88px;margin:-44px -44px 0 0;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;pointer-events:none;transform:scale(0);transition:transform var(--t3) var(--ease-out);mix-blend-mode:normal;box-shadow:0 10px 30px -10px rgba(12,27,42,.5)}
.drag-cursor.on{transform:scale(1)}
.drag-cursor.down{transform:scale(.82)}
@media (hover:none){
.drag-cursor{display:none}
.track{cursor:auto}
}
.gal .track{padding-inline:calc(50% - var(--cw) / 2);--cw:clamp(300px,58vw,1000px)}
.gcard{position:relative;flex:none;width:var(--cw);scroll-snap-align:center;display:grid;gap:22px;align-content:start;opacity:.34;transform:scale(.93);transform-origin:50% 30%;transition:opacity var(--t4) var(--ease-out),transform var(--t4) var(--ease-out)}
.gcard.on{opacity:1;transform:none}
/* 3/2, not 16/9: the row carries photography, not video, and the wider ratio made
   the strip read short against the section headline. */
.gcard .art{aspect-ratio:3/2;border-radius:18px}
.gcard .meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 32px;align-items:start}
.gcard .type{display:flex;gap:14px;align-items:center;grid-column:1/-1}
.tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;padding:6px 11px;border-radius:999px;background:var(--fg);color:var(--bg)}
.tag[data-k="case-study"]{background:#fff;color:var(--ink)}
[data-surface="silver"] .tag[data-k="case-study"],[data-surface="panel"] .tag[data-k="case-study"]{background:var(--navy);color:#fff}
.tag[data-k="news"],.tag[data-k="article"],.tag[data-k="insight"]{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1px var(--rule)}
.gcard h3{font-size:clamp(1.5rem,2.6vw,2.6rem);line-height:1.08;letter-spacing:-.035em;max-width:24ch}
.gcard h3 a::after{content:"";position:absolute;inset:0}
.gcard .dek{color:var(--fg-2);max-width:52ch;grid-column:1}
.gcard .go{grid-column:2;grid-row:2/4;align-self:end;display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);transition:color var(--t2),gap var(--t3) var(--ease-out)}
.gcard .go svg{width:14px;height:14px}
.gcard.on:hover .go{color:var(--fg);gap:14px}
.journal-strip{padding-block:clamp(100px,12vw,180px)}
@media (max-width:767px){
.gal .track{--cw:84vw;padding-inline:var(--gutter)}
.gcard{scroll-snap-align:start;transform:none;opacity:.6}
.gcard.on{opacity:1}
.gcard .art{aspect-ratio:4/5}
.gcard .meta{grid-template-columns:1fr}
.gcard .go{grid-column:1;grid-row:auto}
.row-ctrl .bar{display:none}
}
.a-photo{margin-top:clamp(48px,6vw,88px);aspect-ratio:21/8;border-radius:18px}
.a-photo img{object-position:50% 45%}
@media (max-width:900px){
.a-photo{aspect-ratio:4/3}
}
.journey{position:relative;height:calc(var(--n,6) * 75vh + 100vh);background:var(--ink);color:#EEF2F6}
.jbar{position:sticky;top:0;z-index:5;height:0}
.jbar>*{position:absolute;top:clamp(90px,10vw,112px)}
.amal-intro{right:var(--gutter);display:flex;align-items:center;gap:14px;max-width:420px;transition:opacity var(--t3)}
.amal-intro img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 12%;box-shadow:0 0 0 1px rgba(169,188,208,.35)}
.amal-intro .label{color:var(--navy-200)}
.amal-intro p{font-size:1.02rem;color:#D5DFEA;line-height:1.3;margin-top:2px}
.jctrl{right:50%;transform:translateX(50%);display:flex;gap:10px;align-items:center}
.jbtn{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 18px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(169,188,208,.25);font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#fff;transition:background var(--t2)}
.jbtn:hover{background:rgba(255,255,255,.16)}
.jbtn svg{width:18px;height:18px}
.jbtn[aria-pressed="true"]{background:#fff;color:var(--ink)}
.journey.speaking .jprog{left:var(--gutter);display:flex;align-items:center;gap:14px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;color:#8497AB}
.jprog b{color:#fff;font-weight:400}
.jprog .line{width:clamp(80px,10vw,180px);height:1px;background:rgba(169,188,208,.25);position:relative}
.jprog .line i{position:absolute;inset:0;background:#fff;transform-origin:100% 50%;transform:scaleX(var(--p,0));transition:transform var(--t4) var(--ease-out)}
.journey .stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.skies{position:absolute;right:0;left:0;bottom:0;height:48%;pointer-events:none}
.sky{position:absolute;inset:0;opacity:0;transition:opacity 1s var(--ease-inout);transform:translateY(calc(var(--sp,0) * -18px))}
.sky.on{opacity:1}
.sky svg{position:absolute;right:0;left:0;bottom:0;width:100%;height:100%}
.sky svg *{fill:none;stroke:rgba(169,188,208,.26);stroke-width:1.1;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.sky svg .gnd{stroke:rgba(169,188,208,.3)}
.skies::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(12,27,42,.85),rgba(12,27,42,0) 40%)}
.orbit{position:absolute;top:44%;right:0;width:min(88vh,820px);aspect-ratio:1;transform:translate(64%,-50%);opacity:.9}
.orbit svg{width:100%;height:100%;overflow:visible}
/* The Arabic mirror is done in journey.js. */
.orbit .rot{transform-origin:500px 500px;transform:rotate(calc(var(--a,0) * 1deg));transition:transform 1.2s var(--ease-out)}
.orbit .tick{stroke:rgba(169,188,208,.26)}
.orbit .tick.maj{stroke:rgba(169,188,208,.8)}
.orbit .ring{fill:none;stroke:rgba(169,188,208,.14)}
.orbit .band{fill:none;stroke:rgba(169,188,208,.05)}
.orbit .yr{fill:#6F849B;font-family:var(--mono);font-size:15px;letter-spacing:.1em}
.orbit .yr.on{fill:#fff}
.orbit .yr{pointer-events:auto;cursor:pointer;transition:fill var(--t2)}
.orbit .yr:not(.on):hover{fill:#B9C6D4}
.orbit .ptr{stroke:#fff}
.orbit .ptrdot{fill:var(--navy);stroke:var(--navy-200)}
.jyear{position:absolute;top:22%;right:40%;left:var(--gutter);display:grid;justify-items:start;gap:10px}
.yearbox{position:relative;font-size:clamp(5.5rem,14vw,14.5rem);height:1em;width:100%;overflow:hidden;font-weight:300;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
/* A year that is a word (Today, اليوم) has descenders: it is set smaller in the same box, so nothing is cut and the
   layout does not move. journey.js adds .word. */
.jyear.word .yearbox{font-size:calc(clamp(5.5rem,14vw,14.5rem) * .7);height:calc(1em / .7);line-height:1.32}
.year{position:absolute;right:0;top:0;transition:transform var(--t4) var(--ease-out),opacity var(--t3)}
.year.out{transform:translateY(-100%);opacity:0}
.year.in{transform:translateY(100%);opacity:0}
.jyear .label{color:var(--navy-200);font-size:.8rem}
.jcopy{position:absolute;right:40%;left:var(--gutter);top:calc(22% + clamp(5.5rem,14vw,14.5rem) + 56px);display:grid;gap:14px;max-width:640px;z-index:2}
.jcopy h3{font-size:clamp(2rem,3.6vw,3.6rem);letter-spacing:-.04em;line-height:.98;text-transform:uppercase}
.jcopy .s{font-size:clamp(1.05rem,1.4vw,1.3rem);color:#B9C6D4;max-width:40ch}
.jcopy .s .w{opacity:1;transition:opacity 200ms linear,color 200ms}
.journey.speaking .jcopy .s .w{opacity:.35}
.journey.speaking .jcopy .s .w.lit{opacity:1;color:#fff}
.jcopy details{margin-top:6px}
.jcopy summary{cursor:pointer;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:#8497AB;list-style:none;display:inline-flex;gap:8px}
.jcopy summary::-webkit-details-marker{display:none}
.jcopy summary::before{content:"+"}
.jcopy details[open] summary::before{content:"–"}
.jcopy details p{margin-top:10px;color:#B9C6D4;font-size:.95rem;line-height:1.55;max-height:26vh;overflow:auto;padding-left:8px}
.jcopy>*{transition:opacity var(--t3),transform var(--t4) var(--ease-out)}
.jcopy.fade>*{opacity:0;transform:translateY(12px)}
/* Desktop: the list stays readable by screen readers (the stage above is the visual version). */
.jlist{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:1023px),(prefers-reduced-motion:reduce){
.journey{height:auto;padding-bottom:clamp(64px,10vw,120px)}
.journey .stage{display:none}
.jbar{position:sticky;top:0;height:auto;padding:16px var(--gutter);display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;background:rgba(12,27,42,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(169,188,208,.14)}
.jbar>*{position:static;transform:none}
.amal-intro{max-width:none;flex:1 1 100%}
.jprog{display:none}
.jlist{display:grid;gap:0;padding-inline:var(--gutter);padding-top:48px;position:static!important;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal}
.jstep{position:relative;display:grid;gap:12px;padding:40px 0 48px;border-top:1px solid rgba(169,188,208,.14)}
.jstep .sky{position:relative;inset:auto;height:150px;opacity:.9;transform:none}
.jstep .y{font-size:clamp(4rem,18vw,7rem);font-weight:300;letter-spacing:-.06em;line-height:.9}
.jstep .label{color:var(--navy-200)}
.jstep h3{font-size:clamp(1.8rem,7vw,2.6rem);text-transform:uppercase;letter-spacing:-.03em;line-height:1}
.jstep .s{color:#B9C6D4;font-size:1.05rem}
.jstep.active .y{color:#fff}
.jstep{transition:opacity var(--t3)}
.jlist:has(.active) .jstep:not(.active){opacity:.35} /* The chapter Amal is on stays lit, the rest step back. */
.jstep details summary{cursor:pointer;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:#8497AB}
.jstep details p{margin-top:10px;color:#B9C6D4}
}
.opmodel{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,96px);align-items:center}
.opmodel.paused .om-steps button.on::after{animation-play-state:paused}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:900px){
.opmodel{grid-template-columns:1fr}
.om-node{width:clamp(88px,26vw,130px)}
}
.leaders{padding-bottom:clamp(88px,10vw,140px)}
.people .track{--pw:clamp(280px,27vw,440px)}
.pcard{position:relative;flex:none;width:var(--pw);scroll-snap-align:start;display:grid;gap:18px}
.pcard .ph{position:relative;aspect-ratio:3/4;border-radius:18px;overflow:hidden;background:#1a1d24}
.pcard .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 16%;filter:grayscale(.85) contrast(1.04);transform:scale(1.02);transition:filter var(--t4) var(--ease-out),transform 1.4s var(--ease-out)}
.pcard:hover .ph img,.pcard.open .ph img,.pcard:focus-within .ph img{filter:none;transform:scale(1.05)}
/* The scrim lives on ::before, not on .rev itself. A backdrop-filter applies
   evenly across the whole box, so it used to cut a hard blurred/unblurred edge
   across the portrait while the gradient behind it faded to nothing. Masking
   the pseudo-element fades its blur and its gradient together, so the scrim
   ends over the text with no line anywhere. */
/* Opacity only. A backdrop-filter cannot fade with the gradient: it applies evenly
   across the whole box and always cuts a visible edge across the portrait. A
   pseudo-element hanging above the panel does not work either, because `.rev`
   scrolls and `overflow` clips it back to the panel edge, which draws the same
   line. So the runway is panel HEIGHT, not padding: `min-height` gives the
   gradient room to reach full transparency, the bio stays bottom aligned on the
   opaque part, and padding is left alone so long bios are not squeezed. */
.pcard .rev{position:absolute;right:0;left:0;bottom:0;min-height:66%;max-height:100%;overflow:auto;overscroll-behavior:contain;padding:clamp(20px,2vw,28px);display:grid;gap:10px;align-content:end;color:#EEF2F6;background:linear-gradient(to top,rgba(9,20,32,.97),rgba(9,20,32,.97) 38%,rgba(9,20,32,.86) 52%,rgba(9,20,32,.62) 66%,rgba(9,20,32,.34) 80%,rgba(9,20,32,.12) 91%,rgba(9,20,32,0));transform:translateY(101%);transition:transform var(--t4) var(--ease-out)}
.pcard .rev p{font-size:.95rem;line-height:1.55;color:#DDE6F0;text-wrap:pretty}
.pcard .rev .label{color:var(--navy-200)}
@media (hover:hover){
.pcard:hover .rev{transform:none}
}
.pcard.open .rev,.pcard:focus-within .rev{transform:none}
.pcard .nm{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start}
.pcard .nm strong{display:block;font-weight:500;font-size:clamp(1.3rem,1.8vw,1.75rem);letter-spacing:-.025em;line-height:1.1}
.pcard .nm .label{display:block;margin-top:8px}
.pcard .plus{width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rule);display:grid;place-items:center;transition:transform var(--t3) var(--ease-out),background var(--t2),color var(--t2);flex:none}
.pcard .plus svg{width:14px;height:14px}
.pcard .plus:hover{background:var(--fg);color:var(--bg)}
.pcard.open .plus{transform:rotate(-45deg);background:var(--navy);color:#fff;box-shadow:none}
.people .track:hover .pcard:not(:hover):not(.open){opacity:.6}
.pcard{transition:opacity var(--t3)}
@media (max-width:767px){
.people .track{--pw:80vw}
.people .track:hover .pcard:not(:hover):not(.open){opacity:1}
}
.xstack{padding-block:clamp(40px,5vw,72px) clamp(88px,10vw,140px);display:grid;gap:4vh}
.xcard{position:sticky;top:calc(96px + var(--i) * 22px);min-height:min(78vh,760px);border-radius:24px;padding:clamp(28px,4vw,64px);display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-content:space-between;background:var(--xbg);color:var(--xfg);box-shadow:0 -24px 60px -40px rgba(12,27,42,.45);transform-origin:50% 0;transform:scale(var(--s,1));transition:transform 120ms linear}
.xcard .xn{grid-column:1/5;font-size:clamp(5rem,12vw,12rem);font-weight:300;letter-spacing:-.07em;line-height:.8;color:var(--xmute)}
.xcard .xtop{grid-column:5/13;display:flex;justify-content:space-between;gap:16px;align-items:start}
.xcard .xtop .label{color:var(--xmute)}
.xcard h2{grid-column:1/9;font-size:clamp(2.4rem,5.4vw,5.6rem);letter-spacing:-.05em;line-height:.95;font-weight:400}
.xcard .xs{grid-column:1/7;font-size:var(--fs-lead);line-height:1.4;color:var(--xfg2)}
.xcard .xa{grid-column:8/13;display:grid;border-top:1px solid var(--xline);align-self:end}
.xcard .xa li{padding:12px 0;border-bottom:1px solid var(--xline);display:flex;justify-content:space-between;gap:12px;color:var(--xfg2)}
.xcard .xa li span{font-family:var(--mono);font-size:.68rem;color:var(--xmute)}
.xcard .link{color:var(--xfg)}
@media (max-width:900px){
.xcard{grid-template-columns:1fr;min-height:0;top:calc(84px + var(--i) * 14px)}
.xcard>*{grid-column:1/-1!important}
.xcard .xn{font-size:4.5rem}
}
.m2{padding-block:clamp(88px,10vw,140px)}
.m2-head{margin-bottom:40px}
.m2 .specs{border-right:0;border-left:0;min-height:88vh;grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.m2 .spec-tab{padding:clamp(22px,2.4vw,34px) var(--gutter);grid-template-columns:80px 1fr 20px}
.m2 .spec-tab strong{font-size:clamp(1.2rem,1.8vw,1.7rem)}
.m2 .spec-body{padding:clamp(28px,4vw,72px);gap:clamp(28px,3vw,48px);align-content:center}
.m2 .spec-body h3{font-size:clamp(2rem,3.6vw,3.6rem);max-width:20ch}
.m2 .flow>div{padding:clamp(16px,1.8vw,26px);min-height:180px}
.m2 .flow>div ul{font-size:1.05rem}
.m2 .flow .core b{font-size:1.25rem}
@media (max-width:900px){
.m2 .specs{min-height:0;grid-template-columns:1fr}
.m2 .spec-tab{padding:18px 20px}
}
.deps .track{--dw:min(92vw,1400px)}
.dep{flex:none;width:var(--dw);scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(20px,3vw,48px);align-items:stretch}
.dep .art{height:min(74vh,720px);border-radius:18px}
.dep .sheet{display:grid;gap:22px;align-content:end;padding-bottom:8px}
.dep h3{font-size:clamp(1.8rem,2.8vw,2.8rem);letter-spacing:-.035em}
.dep dl{display:grid;grid-template-columns:auto 1fr;border-top:1px solid rgba(169,188,208,.14)}
.dep dt,.dep dd{padding:12px 0;border-bottom:1px solid rgba(169,188,208,.14)}
.dep dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:#8497AB;padding-left:24px}
.dep .metric{display:flex;gap:32px}
.dep .metric b{display:block;font-size:clamp(2.6rem,4.4vw,4.2rem);font-weight:500;letter-spacing:-.045em;line-height:1}
.m4 .row-ctrl{padding-inline:var(--gutter)}
@media (max-width:900px){
.deps .track{--dw:86vw}
.dep{grid-template-columns:1fr}
.dep .art{height:auto;aspect-ratio:4/3}
}
.journey .stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 45% at 62% 52%,rgba(12,27,42,.75),transparent 75%)}
.jcopy,.jyear{z-index:3}
.req{white-space:normal}
.specs>*,.contact>*,.m2 .specs>*{min-width:0}
@media (max-width:900px){
.m2 .specs{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
.tlist a{grid-template-columns:minmax(0,1fr);gap:6px}
.tlist a svg{display:none}
}
:root{--max:1920px;--gutter:clamp(20px,4.4vw,72px)}
.sec-head{grid-template-columns:minmax(0,1fr) auto;gap:18px 32px}
.sec-head .label{grid-column:1;grid-row:1}
.sec-head h2{grid-column:1;grid-row:2;max-width:20ch}
.sec-head .more{grid-column:2;grid-row:2;align-self:end}
@media (max-width:900px){
.sec-head{grid-template-columns:1fr}
.sec-head .more{grid-row:3}
}
.dash li::before,.prose ul li::before{content:"";width:12px;height:1px;background:var(--fg-3);margin-top:.8em}
.prose ul li::before{position:absolute;right:0;top:0;margin-top:.8em}
.dash li{align-items:start}
.statements .side{grid-column:1/-1;display:flex;gap:24px;align-items:baseline}
.statements .msgs{grid-column:1/11}
.nav{gap:10px}
.panel{width:min(1040px,calc(100vw - 32px))}
.ip-item{font-size:clamp(1.7rem,2.7vw,2.6rem)}
.ip-sub a{grid-template-columns:1fr auto;align-items:center;padding:14px 0}
.ip-sub a strong{font-size:1.15rem}
.ip-sub a::after{content:"";width:14px;height:14px;background:currentColor;opacity:.4;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1 8h13M9 3l5 5-5 5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1 8h13M9 3l5 5-5 5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat;transition:opacity var(--t2),transform var(--t3) var(--ease-out)}
.ip-sub a:hover::after{opacity:1;transform:translateX(-4px)}
@media (max-width:767px){
}
.gtease{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:center;overflow:hidden;background:#F8F8FA;color:var(--text)}
.gtease canvas{position:absolute;inset:0;width:100%;height:100%}
.gtease .wrap{position:relative;display:grid;gap:30px;justify-items:start;padding-block:120px}
.gtease h2{font-size:clamp(3rem,7.4vw,8rem);line-height:.9;letter-spacing:-.055em;max-width:11ch}
.gtease .rot-line{color:var(--mist)}
.gtease .rot{color:var(--text)}
.gtease .enter{background:var(--navy);color:#fff}
.gtease .enter:hover{box-shadow:0 0 0 8px rgba(18,57,92,.1)}
.worlds-label{display:flex;gap:14px;align-items:center;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.worlds-label::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--navy);box-shadow:0 0 0 5px rgba(18,57,92,.12)}
.growth{background:#F8F8FA;color:var(--text)}
.g-entry{position:relative;height:420vh}
.g-entry .stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#F8F8FA}
.g-entry canvas{position:absolute;inset:0;width:100%;height:100%}
.g-entry .g-title{position:absolute;right:var(--gutter);bottom:clamp(40px,7vh,80px);display:grid;gap:18px;max-width:900px;transition:opacity var(--t4),transform var(--t4) var(--ease-out)}
.g-entry .g-title h1{font-size:clamp(4rem,12vw,13rem);line-height:.82;letter-spacing:-.065em}
.g-entry .g-title p{font-size:var(--fs-lead);color:var(--graphite);max-width:36ch}
.g-entry .g-top{position:absolute;top:clamp(96px,11vw,120px);right:var(--gutter);left:var(--gutter);display:flex;justify-content:space-between;align-items:center}
.g-entry .g-lines{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);max-width:min(560px,44vw);display:grid}
.g-entry .g-line{grid-area:1/1;font-size:clamp(2rem,3.6vw,3.6rem);line-height:1.05;letter-spacing:-.035em;opacity:0;transform:translateY(20px);transition:opacity var(--t4),transform var(--t4) var(--ease-out)}
.g-entry .g-line.on{opacity:1;transform:none}
.g-entry .g-sig{position:absolute;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);opacity:0;transition:opacity var(--t3);pointer-events:none;white-space:nowrap}
.g-entry .g-sig.on{opacity:1}
.g-entry .g-bar{position:absolute;right:var(--gutter);left:var(--gutter);bottom:24px;height:1px;background:rgba(18,57,92,.14)}
.g-entry .g-bar i{position:absolute;inset:0;background:var(--navy);transform-origin:100% 50%;transform:scaleX(var(--p,0))}
.g-entry.dark .g-top .label,.g-entry.dark .g-bar{opacity:0}
@media (max-width:767px),(prefers-reduced-motion:reduce){
.g-entry{height:auto}
.g-entry .stage{position:relative;height:100svh;min-height:620px}
.g-entry .g-lines{top:auto;bottom:220px;transform:none;max-width:none;left:var(--gutter)}
.g-entry .g-line{font-size:1.7rem}
.g-entry .g-bar{display:none}
}
.g-pos{background:var(--navy);color:#fff;padding-block:clamp(100px,12vw,180px)}
.g-pos .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}
.g-pos .label{grid-column:1/-1;color:var(--navy-200);margin-bottom:28px}
.g-pos h2{grid-column:1/10;font-size:clamp(2.6rem,5.8vw,6.4rem);line-height:.95;letter-spacing:-.05em}
.g-pos p{grid-column:1/7;margin-top:40px;font-size:var(--fs-lead);color:#D5DFEA;line-height:1.45}
.g-pos .roles{grid-column:8/13;margin-top:40px;display:grid;gap:0;border-top:1px solid rgba(255,255,255,.2);align-self:end}
.g-pos .roles div{display:grid;grid-template-columns:120px 1fr;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.g-pos .roles b{font-family:var(--mono);font-weight:400;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy-200);padding-top:.3em}
@media (max-width:900px){
.g-pos .grid{grid-template-columns:1fr}
.g-pos .grid>*{grid-column:1/-1!important}
}
.g-caps{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:center;min-height:86vh}
.g-list{display:grid;border-top:1px solid var(--line)}
.g-list button{display:grid;grid-template-columns:52px 1fr;align-items:baseline;gap:8px;text-align:right;padding:16px 0;border-bottom:1px solid var(--line);font-size:clamp(1.3rem,2.1vw,2.1rem);letter-spacing:-.025em;color:var(--mist);transition:color var(--t2),padding var(--t3) var(--ease-out)}
.g-list button .n{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em}
.g-list button[aria-selected="true"]{color:var(--text);padding-right:10px}
.g-list button:hover{color:var(--text)}
.g-field{position:relative;aspect-ratio:1.15;width:100%;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--line);overflow:hidden}
.g-field canvas{position:absolute;inset:0;width:100%;height:100%}
.g-field .cap{position:absolute;right:clamp(18px,2.4vw,32px);left:clamp(18px,2.4vw,32px);bottom:clamp(18px,2.4vw,28px);display:grid;gap:6px;transition:opacity var(--t3),transform var(--t4) var(--ease-out)}
.g-field .cap.fade{opacity:0;transform:translateY(8px)}
.g-field .cap strong{font-size:clamp(1.4rem,2.2vw,2.2rem);font-weight:500;letter-spacing:-.03em}
.g-field .cap p{color:var(--graphite);max-width:44ch}
.g-field .cap .label{color:var(--navy)}
@media (max-width:900px){
.g-caps{grid-template-columns:1fr;min-height:0}
.g-list{display:flex;overflow-x:auto;border:0;gap:8px;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}
.g-list button{flex:none;display:block;border:0;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);padding:10px 16px;font-size:1rem}
.g-list button .n{display:none}
.g-list button[aria-selected="true"]{background:var(--navy);color:#fff;padding-right:16px;box-shadow:none}
}
.g-think{position:relative;height:calc(4 * 70vh + 100vh);background:#fff}
.g-think .stage{position:sticky;top:0;height:100vh;height:100svh;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:center;padding-inline:var(--gutter);overflow:hidden}
.g-think canvas{width:100%;height:78vh}
.g-think .steps4{display:grid;gap:0;border-top:1px solid var(--line)}
.g-think .s4{display:grid;grid-template-columns:52px 1fr;gap:8px;padding:18px 0;border-bottom:1px solid var(--line);color:var(--mist);transition:color var(--t3)}
.g-think .s4 .n{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em}
.g-think .s4 strong{font-weight:500;font-size:clamp(1.4rem,2.3vw,2.3rem);letter-spacing:-.03em;display:block}
.g-think .s4 p{grid-column:2;max-height:0;overflow:hidden;opacity:0;transition:max-height var(--t4) var(--ease-out),opacity var(--t3);color:var(--graphite);max-width:40ch}
.g-think .s4.on{color:var(--text)}
.g-think .s4.on p{max-height:8em;opacity:1;margin-top:8px}
.g-think .head{display:grid;gap:14px;margin-bottom:28px}
.g-think .head h2{font-size:clamp(2rem,3.6vw,3.6rem)}
@media (max-width:1023px),(prefers-reduced-motion:reduce){
.g-think{height:auto;padding-block:96px}
.g-think .stage{position:relative;height:auto;grid-template-columns:1fr}
.g-think canvas{height:56vh}
.g-think .s4 p{max-height:none;opacity:1;margin-top:8px}
.g-think .s4{color:var(--text)}
}
.g-flow{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,4fr);gap:0;align-items:stretch;border-radius:22px;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#fff}
.g-flow .side{padding:clamp(24px,3vw,48px);display:grid;gap:18px;align-content:space-between}
.g-flow .side h3{font-size:clamp(2rem,3.4vw,3.4rem);letter-spacing:-.045em}
.g-flow .side ul{display:grid;border-top:1px solid var(--rule)}
.g-flow .side li{padding:11px 0;border-bottom:1px solid var(--rule);color:var(--fg-2)}
.g-flow .mid{position:relative;min-height:380px;background:#F8F8FA}
.g-flow .mid canvas{position:absolute;inset:0;width:100%;height:100%}
.g-flow .mid .label{position:absolute;right:20px;left:20px;bottom:16px;text-align:center}
.g-flow .side.mo{background:var(--ink);color:#EEF2F6;--fg-2:#B9C6D4;--fg-3:#8497AB;--rule:rgba(169,188,208,.18);--fg:#fff}
.g-flow .side.mo .link{color:#fff}
@media (max-width:900px){
.g-flow{grid-template-columns:1fr}
.g-flow .mid{min-height:220px}
}
.g-cta{background:#F8F8FA;padding-block:clamp(100px,12vw,180px)}
.g-cta .row{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:end}
.g-cta h2{font-size:clamp(2.6rem,6vw,6.4rem);letter-spacing:-.055em;line-height:.92;max-width:14ch}
@media (min-width:901px){.m3 .arch{grid-template-columns:minmax(0,8fr) minmax(0,4fr)}}
.m3 .layer{padding:clamp(22px,2.2vw,32px) clamp(22px,2.4vw,36px)}
.m3 .layer strong{font-size:clamp(1.2rem,1.8vw,1.8rem)}
.deps .track{gap:clamp(32px,4vw,72px)}
.dep{opacity:.35;transition:opacity var(--t4) var(--ease-out)}
.dep.on{opacity:1}
.dep .art{transition:transform var(--t4) var(--ease-out)}
.dep:not(.on) .art{transform:scale(.96)}
.sysg{position:relative;height:clamp(460px,48vw,640px);border:1px solid rgba(169,188,208,.16);background-image:linear-gradient(rgba(169,188,208,.05) 1px,transparent 1px),linear-gradient(-90deg,rgba(169,188,208,.05) 1px,transparent 1px);background-size:32px 32px}
.sysg svg{position:absolute;inset:0;width:100%;height:100%}
.sysg .wire{fill:none;stroke:rgba(169,188,208,.22);stroke-width:1.2;vector-effect:non-scaling-stroke}
.sysg .wire.on{stroke:var(--navy-200);stroke-dasharray:6 6;animation:flow 1.2s linear infinite}
@keyframes flow{to{stroke-dashoffset:-12}}
.sysg .bus{fill:none;stroke:rgba(169,188,208,.4);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:2 4}
.snode{position:absolute;transform:translate(50%,-50%);width:clamp(170px,15vw,230px);padding:16px 18px;border:1px solid rgba(169,188,208,.24);background:rgba(7,18,29,.92);text-align:right;display:grid;gap:6px;transition:border-color var(--t1) steps(2),background var(--t1) steps(2)}
.snode{transform:translate(-50%,-50%)} /* Placed by script with left/top: keep the centring unmirrored. */
.snode .n{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;color:#8497AB}
.snode strong{font-weight:500;font-size:1.02rem;line-height:1.2}
.snode p{font-size:.85rem;color:#8497AB;line-height:1.35}
.snode .st{position:absolute;top:10px;left:12px;width:8px;height:8px;border:1px solid #8497AB}
.snode.on{border-color:var(--navy-200);background:rgba(18,57,92,.55)}
.snode.on .st{background:var(--navy-200);border-color:var(--navy-200);box-shadow:0 0 10px var(--navy-200)}
.snode.on p{color:#D5DFEA}
.sysg .team{position:absolute;right:24px;bottom:18px;left:24px;display:flex;justify-content:space-between}
@media (max-width:900px){
.sysg{height:auto;padding:24px 44px 60px 20px;display:grid;gap:14px}
.sysg svg{display:none}
.sysg::before{content:"";position:absolute;right:22px;top:30px;bottom:60px;width:1px;background:rgba(169,188,208,.3)}
.snode{position:relative;transform:none;right:auto!important;top:auto!important;width:auto}
.snode{left:auto!important} /* Resets the script's left position on phones, in both directions. */
.snode::before{content:"";position:absolute;right:-27px;top:22px;width:9px;height:9px;border-radius:50%;background:#0C1B2A;box-shadow:0 0 0 1px var(--navy-200)}
.snode.on::before{background:var(--navy-200)}
}
.arm{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:center;border-top:1px solid rgba(169,188,208,.18);padding-top:40px}
.arm h2{font-size:clamp(2.2rem,4.4vw,4.6rem);letter-spacing:-.045em}
.arm .pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:0}
.arm .pair>div{border:1px solid rgba(169,188,208,.22);padding:clamp(20px,2.4vw,32px);display:grid;gap:14px;align-content:start}
.arm .pair>div strong{font-size:clamp(1.6rem,2.6vw,2.6rem);letter-spacing:-.04em;font-weight:500}
.arm .pair ul{display:grid;gap:6px;color:#B9C6D4}
.arm .pair>i{width:56px;align-self:center;height:1px;background:repeating-linear-gradient(-90deg,var(--navy-200) 0 4px,transparent 4px 8px);animation:dash 1s steps(4) infinite}
.arm .pair .ex{background:rgba(169,188,208,.06)}
@media (max-width:900px){
.arm{grid-template-columns:1fr}
.arm .pair{grid-template-columns:1fr}
.arm .pair>i{width:1px;height:28px;justify-self:center;background:repeating-linear-gradient(-180deg,var(--navy-200) 0 4px,transparent 4px 8px)}
}
.sky svg *{stroke:rgba(213,223,234,.55);stroke-width:1.4}
.sky svg .gnd{stroke:rgba(169,188,208,.4)}
.skies{height:44%}
.skies::after{background:linear-gradient(to top,rgba(12,27,42,.55),rgba(12,27,42,0) 30%)}
.journey .stage::after{background:radial-gradient(40% 36% at 60% 44%,rgba(12,27,42,.8),transparent 80%)}
.jcopy{top:calc(20% + clamp(5.5rem,14vw,14.5rem) + 64px)}
.jyear{top:20%}
.people .track{--pw:clamp(300px,30vw,480px)}
.om-vis .armline{stroke:var(--line);stroke-dasharray:3 5}
.om-node{width:clamp(104px,12vw,146px)}
.om-sat{position:absolute;transform:translate(50%,-50%);font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);padding:6px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);background:var(--silver);white-space:nowrap;transition:color var(--t3),box-shadow var(--t3)}
.om-sat{transform:translate(-50%,-50%)} /* Placed by script with left/top: keep the centring unmirrored. */
.om-sat.on{color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.netmap{position:relative}
.nm-map{position:relative;aspect-ratio:1000/869;width:min(100%,1300px);margin-inline:auto;max-height:86vh}
.nm-map canvas,.nm-links{position:absolute;inset:0;width:100%;height:100%}
.nm-links path{fill:none;stroke:rgba(169,188,208,.3);stroke-width:1;stroke-dasharray:3 5;vector-effect:non-scaling-stroke}
.nm-links path.on{stroke:rgba(213,223,234,.9);stroke-dasharray:none}
.nm-dot{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;display:grid;place-items:center}
.nm-dot i{width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(169,188,208,.22),0 0 26px 6px rgba(169,188,208,.55);transition:transform var(--t3) var(--ease-out),background var(--t3)}
.nm-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;box-shadow:0 0 0 1px rgba(169,188,208,.6);animation:ring 2.6s var(--ease-out) infinite}
.nm-dot.on i{transform:scale(1.4);background:var(--navy-200)}
.nm-dot span{position:absolute;white-space:nowrap;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:#D5DFEA;left:36px;top:50%;transform:translateY(-50%);pointer-events:none}
.nm-dot[data-k="manama"] span{left:auto;right:36px;top:10%}
.nm-dot[data-k="riyadh"] span{left:auto;right:36px;top:90%}
.nm-dot[data-k="doha"] span{top:85%}
.nm-card{position:absolute;left:0;bottom:6%;width:min(380px,calc(100% - 32px));padding:24px 26px;border-radius:18px;background:rgba(12,27,42,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1px rgba(169,188,208,.2);display:grid;gap:8px}
#nmInfo>*{transition:opacity var(--t3),transform var(--t4) var(--ease-out)}
#nmInfo.fade>*{opacity:0;transform:translateY(8px)}
.nm-card h3{font-size:clamp(2rem,3.4vw,3.2rem);letter-spacing:-.045em}
.nm-card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin-top:8px;color:#B9C6D4}
.nm-card dt{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:#8497AB;padding-top:.3em}
@media (max-width:767px){
.nm-dot span{display:none}
.nm-card{position:relative;bottom:auto;width:auto;margin-top:16px}
.nm-map{max-height:none}
}
.eco{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);max-width:1400px;margin-inline:auto}
.eco-card{border-radius:20px;padding:clamp(24px,2.6vw,40px);display:grid;gap:20px;align-content:space-between;min-height:clamp(300px,34vh,380px);background:#fff;box-shadow:0 0 0 1px var(--line);transition:transform var(--t4) var(--ease-out),box-shadow var(--t3)}
.eco-card:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--navy),0 30px 60px -40px rgba(12,27,42,.45)}
.eco-card:nth-child(2){background:var(--ink);color:#EEF2F6;--fg-2:#B9C6D4;--fg-3:#8497AB;--fg:#fff;--rule:rgba(169,188,208,.2)}
.eco-card strong{font-size:clamp(2.6rem,5vw,5rem);line-height:.9;letter-spacing:-.06em;font-weight:500}
.eco-card p{color:var(--fg-2);font-size:1.05rem;max-width:40ch}
.eco-card .role{display:flex;justify-content:space-between;gap:12px;padding-top:14px;border-top:1px solid var(--rule)}
.eco-head{display:grid;justify-items:center;text-align:center;gap:14px;margin-bottom:clamp(40px,5vw,64px)}
.eco-root{display:grid;justify-items:center;gap:8px;padding:18px 28px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule)}
.eco-root svg{width:72px;height:auto;fill:var(--fg)}
.eco-sub{max-width:60ch;color:var(--fg-2);font-size:1.05rem}
@media (max-width:767px){
.eco{grid-template-columns:1fr}
}
.xstack{max-width:none;padding-inline:var(--gutter)}
.xcard{--xfg:#EEF2F6;--xfg2:#B9C6D4;--xmute:#7D90A5;--xline:rgba(169,188,208,.2);min-height:min(76vh,760px)}
.xcard[data-t="0"]{--xbg:#253241}
.xcard[data-t="1"]{--xbg:#1E3348}
.xcard[data-t="2"]{--xbg:#12395C}
.xcard[data-t="3"]{--xbg:#172A3E}
.xcard[data-t="4"]{--xbg:#0F2031}
.xcard[data-t="5"]{--xbg:#0A1622}
.xcard .world{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:#fff;color:var(--ink)}
.flagships{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.flag{position:relative;min-height:clamp(420px,56vh,600px);border-radius:24px;overflow:hidden;padding:clamp(28px,3.4vw,56px);display:grid;align-content:space-between;gap:24px}
.flag canvas{position:absolute;inset:0;width:100%;height:100%}
.flag>*:not(canvas){position:relative}
.flag h3{font-size:clamp(3rem,6vw,6.4rem);letter-spacing:-.06em;line-height:.88}
.flag p{max-width:36ch;font-size:1.1rem}
.flag.g{background:#F8F8FA;color:var(--text);box-shadow:0 0 0 1px var(--line)}
.flag.g p{color:var(--graphite)}
.flag.t{background:var(--void);color:#EEF2F6}
.flag.t p{color:#B9C6D4}
.flag .go{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.flag .go svg{width:14px;height:14px;transition:transform var(--t3) var(--ease-out)}
.flag:hover .go svg{transform:translateX(-6px)}
@media (max-width:900px){
.flagships{grid-template-columns:1fr}
}
.jpills{display:flex;flex-wrap:wrap;gap:8px}
.jpills.sm button{min-height:36px;padding:0 14px;font-size:.64rem;background:transparent}
.jpills.sm button[aria-pressed="true"]{background:var(--navy)}
.jfilters{display:grid;gap:12px;margin-bottom:clamp(36px,4vw,56px);padding-block:14px;border-bottom:1px solid var(--line)}
.jfoot{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:clamp(40px,5vw,64px);padding-top:20px;border-top:1px solid var(--rule)}
.jlead-c{position:relative;display:grid;min-height:min(78vh,780px);border-radius:22px;overflow:hidden;color:#fff;align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.jlead-c .art{position:absolute;inset:0;border-radius:0}
.jlead-c::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(12,27,42,.92),rgba(12,27,42,.05) 65%)}
.jlead-c .in{position:relative;z-index:2;padding:clamp(24px,4vw,56px);display:grid;gap:16px;max-width:1100px}
.jlead-c h2{font-size:clamp(2rem,4.2vw,4.4rem);line-height:1;letter-spacing:-.045em}
.jlead-c p{color:#D5DFEA;font-size:var(--fs-lead);max-width:52ch}
.jlead-c .tag{background:#fff;color:var(--ink);box-shadow:none}
.jgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,56px) clamp(16px,1.6vw,28px)}
.jgrid.two{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:clamp(36px,4vw,56px)}
.jcard{display:grid;gap:14px;align-content:start}
.jcard .art{aspect-ratio:4/3;border-radius:16px}
.jgrid.two .jcard .art{aspect-ratio:16/10}
.jcard .type{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.jcard h3{font-size:clamp(1.1rem,1.35vw,1.4rem);line-height:1.2;letter-spacing:-.02em;transition:color var(--t2);max-width:32ch}
.jgrid.two .jcard h3{font-size:clamp(1.3rem,1.8vw,1.9rem)}
.jcard p{color:var(--fg-2);font-size:.95rem;max-width:48ch}
.jcard:hover h3{color:var(--accent)}
.jcard.enter{animation:rise var(--t4) var(--ease-out) both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
@media (max-width:1100px){
.jgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
.jgrid,.jgrid.two{grid-template-columns:1fr}
}
.j-hero{padding-top:clamp(130px,15vw,190px);padding-bottom:clamp(28px,3vw,40px)}
.j-hero h1{font-size:clamp(4.4rem,15vw,16rem);line-height:.8;letter-spacing:-.07em}
.next-case{position:relative;display:grid;min-height:92vh;min-height:92svh;align-items:end;color:#fff;overflow:hidden}
.next-case .art{position:absolute;inset:0;border-radius:0;transition:transform 1.4s var(--ease-out)}
.next-case:hover .art{transform:scale(1.03)}
.next-case::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(12,27,42,.94),rgba(12,27,42,.2) 70%)}
.next-case .wrap{position:relative;z-index:2;padding-bottom:clamp(40px,5vw,72px);display:grid;gap:22px}
.next-case .label{color:#A9BCD0}
.next-case h2{font-size:clamp(2.6rem,6vw,6.6rem);line-height:.95;letter-spacing:-.05em;max-width:18ch}
.next-case .bar{height:2px;background:rgba(255,255,255,.2);position:relative;overflow:hidden}
.next-case .bar i{position:absolute;inset:0;background:#fff;transform-origin:100% 50%;transform:scaleX(.08);transition:transform 1.2s var(--ease-out)}
.next-case:hover .bar i{transform:scaleX(1)}
.c-hero{padding-top:clamp(140px,16vw,210px);padding-bottom:clamp(32px,4vw,56px)}
.c-hero h1{font-size:clamp(3rem,7.4vw,8rem);line-height:.9;letter-spacing:-.055em;max-width:15ch;margin-top:24px}
.c-hero h1 em{font-style:normal;color:var(--mist);font-weight:400}
.c-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-block:1px solid var(--line);margin-bottom:clamp(48px,6vw,88px)}
.c-row div{padding:22px 0 22px 20px;display:grid;gap:4px;align-content:start}
.c-row div+div{padding-right:20px;border-right:1px solid var(--line)}
.c-row strong{font-weight:500;font-size:clamp(1.2rem,1.6vw,1.5rem);letter-spacing:-.02em;text-transform:uppercase}
.c-row span{color:var(--graphite)}
.c-row .hq{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-top:6px}
@media (max-width:900px){
.c-row{grid-template-columns:repeat(3,minmax(0,1fr))}
.c-row div:nth-child(4){border-right:0;padding-right:0}
.c-row div:nth-child(n+4){border-top:1px solid var(--line)}
}
@media (max-width:520px){
.c-row{grid-template-columns:1fr 1fr}
.c-row div{padding-right:0!important;border-right:0!important;border-top:1px solid var(--line)}
}
.contact{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(40px,6vw,120px);padding-bottom:clamp(88px,10vw,140px)}
.c-left{display:grid;gap:28px;align-content:start;position:sticky;top:110px}
.c-left .lead{color:var(--graphite)}
.c-mail{display:grid;gap:6px;font-size:clamp(1.3rem,2vw,1.8rem);letter-spacing:-.02em}
.c-mail:hover{color:var(--navy)}
form.cf{display:grid;gap:clamp(28px,3vw,40px);padding:clamp(24px,3.4vw,52px);border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line),0 40px 80px -60px rgba(12,27,42,.35)}
.cf-step{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:22px 20px}
.cf-step legend{padding:0;margin-bottom:18px;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.fld{display:grid;gap:8px;position:relative}
.fld.full{grid-column:1/-1}
.fld label,.fld .lbl{font-size:1rem;font-weight:500;color:var(--text)}
.fld label small{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mist);margin-right:8px;font-weight:400}
.fld input,.fld select,.fld textarea{font:inherit;font-size:1.08rem;color:var(--text);background:#F8F8FA;border:1px solid #C7CDD6;border-radius:12px;padding:15px 16px;min-height:54px;transition:border-color var(--t2),box-shadow var(--t2),background var(--t2);-webkit-appearance:none;appearance:none}
.fld select{background:#F8F8FA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%2335353F' stroke-width='1.6'/%3E%3C/svg%3E") left 16px center/14px no-repeat;padding-left:44px}
.fld textarea{min-height:170px;resize:vertical;line-height:1.5}
.fld input::placeholder,.fld textarea::placeholder{color:var(--mist)}
.fld input:hover,.fld select:hover,.fld textarea:hover{border-color:#8C98A8}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;background:#fff;border-color:var(--navy);box-shadow:0 0 0 4px rgba(18,57,92,.16)}
.fld .count{justify-self:end;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;color:var(--mist)}
.err{color:#A1231B;font-size:.92rem;font-weight:500;display:none}
.fld.bad input,.fld.bad select,.fld.bad textarea{border-color:#A1231B;background:#FFF7F6}
.fld.bad .err,.consent-err.show{display:block}
.seg-pick{display:flex;flex-wrap:wrap;gap:8px}
.consent{display:flex;gap:14px;align-items:flex-start;color:var(--graphite);font-size:1rem}
.consent input{width:24px;height:24px;accent-color:var(--navy);margin-top:1px;flex:none}
.send{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--line)}
.cf .btn{min-height:60px;padding:0 32px;font-size:.8rem}
.cf .btn .spin{display:none;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .8s linear infinite}
.cf.loading .btn .spin{display:block}
.cf.loading .btn svg{display:none}
.cf.loading{pointer-events:none}
.cf.loading .cf-step{opacity:.55}
@keyframes spin{to{transform:rotate(-360deg)}}
.cf-summary,.cf-err{padding:18px 20px;border-radius:14px;background:#FCEEEE;color:#8C1D18;display:grid;gap:6px}
.cf-summary a,.cf-err a{text-decoration:underline}
.cf-done{display:grid;gap:18px;align-content:start;padding:clamp(28px,4vw,56px);border-radius:24px;background:var(--navy);color:#fff;--fg-2:#D5DFEA;--fg-3:#A9BCD0;--fg:#fff}
.cf-done h2{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.055em}
@media (max-width:900px){
.contact{grid-template-columns:minmax(0,1fr)}
.c-left{position:static}
.cf-step{grid-template-columns:1fr}
}
.foot{padding-top:clamp(88px,10vw,150px);padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
.foot .top{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:start}
.foot .c1{grid-column:1/6;display:grid;gap:18px;justify-items:start}
.foot .c1 .big{font-size:clamp(2.6rem,5vw,5rem);line-height:.95;letter-spacing:-.05em}
.foot .mail{font-size:clamp(1.1rem,1.5vw,1.35rem);display:inline-flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:6px;transition:border-color var(--t2),gap var(--t3) var(--ease-out)}
.foot .mail:hover{border-color:#fff;gap:16px}
.foot .mail svg{width:16px;height:16px}
.foot .mail2{color:var(--fg-3);font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;display:inline-flex;align-items:center;min-height:24px}
.foot .col{display:grid;gap:12px;align-content:start}
.foot .col a{font-size:1.2rem;justify-self:start;transition:color var(--t2),transform var(--t3) var(--ease-out)}
.foot .col a:hover{color:var(--navy-200);transform:translateX(-4px)}
.foot .c2{grid-column:7/9}
.foot .c3{grid-column:9/11}
.foot .c4{grid-column:11/13}
.foot .wm{margin-top:clamp(80px,10vw,160px);padding-block:clamp(40px,5vw,72px) clamp(28px,3vw,40px);border-top:1px solid var(--rule);display:grid;gap:32px}
.foot .mark{width:100%;height:auto;fill:#fff;display:block}
.foot .wm .line{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.foot .base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:18px;border-top:1px solid var(--rule)}
.foot .base a:hover{color:#fff}
@media (max-width:900px){
.foot .top{grid-template-columns:1fr 1fr 1fr;gap:40px 16px}
.foot .top>*{grid-column:auto!important}
.foot .c1{grid-column:1/-1!important}
.foot{padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))}
}
@media (max-width:480px){
.foot .top{grid-template-columns:1fr 1fr}
}
.journey .stage::after{display:none}
.skies{height:40%;bottom:0}
.skies::after{background:linear-gradient(to bottom,rgba(12,27,42,1),rgba(12,27,42,0) 18%)}
.sky svg{height:calc(100% - 34px);bottom:34px}
.sky svg *{stroke:rgba(223,231,240,.82);stroke-width:1.6}
.sky svg .gnd{stroke:rgba(169,188,208,.5)}
.sky .cap{position:absolute;right:var(--gutter);left:var(--gutter);bottom:10px;display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:#8FA3B8;opacity:0;transition:opacity 1s var(--ease-out) .8s}
.sky.on .cap{opacity:1}
.sky{transform:translateY(calc(var(--sp,0) * -10px)) scale(calc(1.02 - var(--sp,0) * .02));transform-origin:50% 100%}
@media (max-height:760px){
.jcopy details{display:none}
}
@media (max-width:767px){
.g-entry{height:300vh}
.g-entry .stage{position:sticky;height:100svh;min-height:0}
.g-entry .g-lines{top:auto;bottom:210px;transform:none;max-width:none;left:var(--gutter)}
.g-entry .g-line{grid-area:1/1;font-size:1.7rem}
.g-entry .g-title h1{font-size:4.6rem}
}
@media (prefers-reduced-motion:reduce){
.g-entry{height:auto}
.g-entry .stage{position:relative;height:100svh}
.g-entry .g-line{grid-area:auto;opacity:1;transform:none;font-size:1.5rem}
.g-entry .g-lines{gap:10px}
}
.pill{background:rgba(12,27,42,.84)}
.om-vis{position:relative;aspect-ratio:1;max-width:680px;width:100%;justify-self:center}
.om-vis svg{position:absolute;inset:0;width:100%;height:100%}
.om-vis .ring{fill:none;stroke:var(--line)}
.om-vis .ring2{fill:none;stroke:rgba(18,57,92,.12);stroke-dasharray:2 8}
.om-vis .arc{fill:none;stroke:var(--navy);stroke-width:2;stroke-linecap:round}
.om-vis .tri{fill:none;stroke:rgba(18,57,92,.14)}
.om-vis .pulse{fill:var(--navy)}
.om-vis .halo{fill:rgba(18,57,92,.12)}
.om-core{position:absolute;right:50%;top:50%;transform:translate(50%,-50%);text-align:center;display:grid;gap:6px;width:40%}
.om-core strong{font-size:clamp(1.1rem,1.8vw,1.6rem);font-weight:500;letter-spacing:-.02em;line-height:1.1}
.om-node{position:absolute;transform:translate(50%,-50%);width:clamp(110px,15vw,160px);aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;gap:4px;background:#fff;box-shadow:0 0 0 1px var(--line),0 20px 40px -24px rgba(12,27,42,.35);transition:background var(--t3),color var(--t3),box-shadow var(--t3),transform var(--t4) var(--ease-out)}
.om-node{transform:translate(-50%,-50%)} /* Placed by script with left/top: keep the centring unmirrored. */
.om-node strong{font-size:clamp(1rem,1.5vw,1.3rem);font-weight:500}
.om-node .label{font-size:.6rem}
.om-node.on{background:var(--navy);color:#fff;box-shadow:0 0 0 8px rgba(18,57,92,.12),0 30px 60px -24px rgba(12,27,42,.5);transform:translate(50%,-50%) scale(1.06)}
.om-node.on{transform:translate(-50%,-50%) scale(1.06)} /* Placed by script with left/top: keep the centring unmirrored. */
.om-node.on .label{color:var(--navy-200)}
.om-detail{display:grid;gap:18px}
.om-detail>*{transition:opacity var(--t3),transform var(--t4) var(--ease-out)}
.om-detail.fade>*{opacity:0;transform:translateY(10px)}
.om-detail .verb{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.055em;line-height:.9;font-weight:500}
.om-detail h3{font-size:var(--fs-h3)}
.om-detail p{color:var(--fg-2);font-size:1.1rem;max-width:46ch}
.om-detail ul{display:grid;border-top:1px solid var(--rule)}
.om-detail li{padding:12px 0;border-bottom:1px solid var(--rule);display:flex;gap:12px}
.om-steps{display:flex;gap:8px}
.om-steps button{flex:1;height:24px;padding:10.5px 0;background:var(--rule);background-clip:content-box;border-radius:2px;position:relative;overflow:hidden}
.om-steps button.on::after{content:"";position:absolute;inset:10.5px 0;background:var(--navy);transform-origin:100% 50%;animation:fill var(--om-t,4s) linear forwards}
@media (max-width:900px){
.opmodel{grid-template-columns:1fr}
.om-node{width:clamp(88px,26vw,130px)}
}
.om-vis .armline{stroke:var(--line);stroke-dasharray:3 5}
.om-node{width:clamp(104px,12vw,146px)}
.om-sat{position:absolute;transform:translate(50%,-50%);font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);padding:6px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);background:var(--silver);white-space:nowrap;transition:color var(--t3),box-shadow var(--t3)}
.om-sat{transform:translate(-50%,-50%)} /* Placed by script with left/top: keep the centring unmirrored. */
.om-sat.on{color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.om-detail li::before{content:"";width:12px;height:1px;background:var(--fg-3);margin-top:.8em;flex:none}
:root{--edge:max(var(--gutter),calc((100vw - var(--max)) / 2 + var(--gutter)))}
.track{padding-inline:var(--edge);scroll-padding-inline:var(--edge)}
@media (max-width:767px){
.gal .track{padding-inline:var(--edge)}
}
.ind .head,.ind .bar{right:var(--edge);left:var(--edge)}
.ind .skip-ind{right:var(--edge)}
.g-entry .g-title,.g-entry .g-lines{right:var(--edge)}
.g-entry .g-top,.g-entry .g-bar{right:var(--edge);left:var(--edge)}
.g-think .stage{padding-inline:var(--edge)}
.xstack{padding-inline:var(--edge)}
.m2 .spec-tab{padding-right:var(--edge)}
.m2 .spec-body{padding-left:max(clamp(28px,4vw,72px),var(--edge))}
.amal-intro{right:var(--edge)}
.jprog{left:var(--edge)}
.jyear,.jcopy{left:var(--edge)}
.sky .cap{right:var(--edge);left:var(--edge)}
.pill{width:392px;height:58px;grid-template-columns:50px 1fr auto;padding:0 16px 0 7px}
.pill-logo svg{width:46px;height:24px}
.pill-btn{height:46px;padding:0 16px;font-size:.74rem}
.ticker{font-size:.74rem}
@media (min-width:768px){
.panel{padding-top:94px;clip-path:inset(0 calc(50% - 196px) calc(100% - 58px) calc(50% - 196px) round 29px)}
}
.nav.open .pill,body.world-tech .nav.open .pill{background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.nav.open .progress{opacity:0}
@media (max-width:767px){
.nav .pill{height:60px;max-width:460px}
}
@media (max-width:767px){
.amal{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
}
.xcard[data-t]{--xbg:#0F2031;box-shadow:inset 0 1px 0 rgba(169,188,208,.16),0 -28px 60px -34px rgba(7,18,29,.75)}
.jlead-c .in{gap:14px;max-width:960px}
.jlead-c h2{font-size:clamp(1.55rem,2.4vw,2.6rem);line-height:1.08;letter-spacing:-.03em;max-width:28ch}
.jlead-c p{font-size:clamp(1rem,1.1vw,1.1rem);line-height:1.5;max-width:56ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Card summaries stay at the demo's two lines; the full summary is still the page's description. */
.jcard p,.gcard .dek{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nm-map{aspect-ratio:auto;width:100%;height:clamp(440px,66vh,780px);max-height:none;margin-inline:0}
@media (min-width:768px){.nm-map{width:100vw;margin-inline:calc(50% - 50vw)}.sec:has(.netmap){overflow-x:clip}} /* Edge to edge: dots across the whole band (clip hides a scrollbar's width). */
.nm-card{left:0;bottom:0}
@media (max-width:1023px){
.nm-map{height:clamp(380px,56vh,620px)}
}
@media (max-width:767px){
.nm-map{height:auto;aspect-ratio:1/1.05}
.nm-card{left:auto}
}
.sky svg{clip-path:inset(0 100% 0 0);transition:clip-path 2.2s var(--ease-inout)}
.sky.on svg{clip-path:inset(0 0 0 0)}
.jstep .sky svg{clip-path:none;transition:none}
@media (prefers-reduced-motion:no-preference){
/* Each page's headline rises in once as the page opens. */
main h1{animation:rise .9s var(--ease-out) both}
main h1 .soft{animation:rise .9s var(--ease-out) .12s both}
/* Journey story (phones, tablets): a chapter draws its skyline and brings in its text the first time it is scrolled
   into view; scrolling back shows it as it is. journey.js adds .reveal and .seen. */
.jlist.reveal .jstep .sky svg{clip-path:inset(0 100% 0 0);transition:clip-path 1.8s var(--ease-inout)}
.jlist.reveal .jstep.seen .sky svg{clip-path:inset(0 0 0 0)}
.jlist.reveal .jstep>:not(.sky){opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.jlist.reveal .jstep.seen>:not(.sky){opacity:1;transform:none}
.jlist.reveal .jstep.seen>:nth-child(3){transition-delay:.1s}
.jlist.reveal .jstep.seen>:nth-child(4){transition-delay:.2s}
.jlist.reveal .jstep.seen>:nth-child(n+5){transition-delay:.3s}
}
.sky svg circle{fill:rgba(223,231,240,.82);stroke:none}
.skies{height:36%}
.sky svg *{stroke:rgba(213,223,234,.6)}
.sky svg .gnd{stroke:rgba(169,188,208,.4)}
.sky svg circle{fill:rgba(213,223,234,.6)}
.jbar>*{transition:opacity var(--t3),visibility 0s linear var(--t3)}
.journey:not(.live) .jbar>*{opacity:0;visibility:hidden}
.journey.live .jbar>*{transition:opacity var(--t3),visibility 0s}
@media (max-width:1023px),(prefers-reduced-motion:reduce){
.jbar{transition:opacity var(--t3),visibility 0s linear var(--t3)}
.journey:not(.live) .jbar{opacity:0;visibility:hidden}
.journey.live .jbar{transition:opacity var(--t3),visibility 0s}
}
@media (min-width:768px) and (max-width:1023px){
.jbar{top:84px}
}
@media (max-height:860px) and (min-width:1024px){
.jcopy details{display:none}
}
.eco{max-width:none}
.eco-head{justify-items:start;text-align:right;gap:18px}
.eco-head h2{font-size:var(--fs-h2);max-width:20ch}
.eco-root{display:flex;align-items:center;gap:16px;padding:14px 24px}
.eco-root svg{width:88px}
.eco-sub{max-width:62ch}
.ahead .byline .share{display:flex;margin-right:auto}
.share{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sh{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule);font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg);transition:background var(--t2),color var(--t2),box-shadow var(--t2)}
.sh:hover{background:var(--fg);color:var(--bg);box-shadow:none}
.sh svg{width:12px;height:12px}
.sh-msg{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);opacity:0;transition:opacity var(--t2)}
.share.ok .sh-msg{opacity:1}
.share.end{margin-top:2.6em;padding-top:22px;border-top:1px solid var(--rule)}
@media (max-width:900px){
.ahead .byline .share{margin-right:0;width:100%}
}
@media (max-width:1023px),(prefers-reduced-motion:reduce){
.ind .head{right:auto;left:auto}
}
.xstack>*{min-width:0}
.xcard h2{overflow-wrap:break-word;hyphens:auto}
@media (max-width:480px){
.om-sat{font-size:.56rem;padding:5px 8px}
}
@media (max-width:767px){
.panel{width:100%}
}
/* ======================= PRODUCTION (WordPress) ======================= */
@font-face{font-family:"Geist Mono";src:url(../fonts/GeistMono-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../fonts/GeistMono-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@media (min-width:768px){.admin-bar .nav{top:var(--wp-admin--admin-bar--height,32px)}}

/* utilities used by blocks (replace prototype inline styles) */
.mod-id.mb28{margin-bottom:28px}.mod-id.mb40{margin-bottom:40px}.mod-id.mb48{margin-bottom:48px}
.framework .wrap{padding-bottom:clamp(56px,7vw,100px)}
.frame-label{margin-bottom:24px}
.a-label{margin-bottom:28px}
.arm-text{color:#B9C6D4;margin-top:20px;max-width:44ch}
.arch-detail .lead{color:#B9C6D4}
.flow .core b{font-weight:500}
.statement.light{font-weight:300}
.j-archive{padding-bottom:clamp(88px,12vw,176px)}
.j-archive #jBody{transition:opacity var(--t2)}
.j-archive.loading #jBody{opacity:.45}
.jlead-c .meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.jlead-c .meta .label{color:#D5DFEA}
.jlead-c .link{color:#fff}
.g-proof .jlead-c{margin:0}
.next-case .link,.cf-done .link{color:#fff}
.jfoot [aria-busy="true"]{opacity:.6;pointer-events:none}

/* Journal filters are links */
.jpills a{display:inline-flex;align-items:center;font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;min-height:44px;padding:0 18px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);color:var(--graphite);background:#fff;transition:background var(--t2),color var(--t2),box-shadow var(--t2)}
.jpills a:hover{box-shadow:inset 0 0 0 1px var(--navy);color:var(--navy)}
.jpills a[aria-current]{background:var(--ink);color:#fff;box-shadow:none}
.jpills.sm a{min-height:40px;padding:0 14px;font-size:.64rem;background:transparent}
.jpills.sm a[aria-current]{background:var(--navy);color:#fff}

/* ---------- Navigation: rows with sub-link toggles (toggles and sheet head are phone-only) ---------- */
.ip-row{grid-column:1;display:flex;align-items:center}
.ip-row .ip-item{flex:1}
.ip-pane{grid-row:1/span var(--rows,6)}
.sheet-head,.ip-tog,.nav-scrim{display:none}
@media (max-width:767px){
  /* Bottom sheet: a navigation layer over the page, as tall as its content, up to 85% of the screen. */
  .nav-scrim{display:block;position:fixed;inset:0;z-index:99;background:rgba(7,18,29,.46);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity 320ms var(--ease-out)}
  .nav-scrim.on{opacity:1}
  .panel{position:fixed;inset:auto 0 0 0;top:auto;right:0;left:0;bottom:0;width:100%;height:auto;max-height:min(85vh,85dvh);transform:translateY(105%);clip-path:none;border-radius:24px 24px 0 0;padding:0 20px calc(18px + env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;visibility:hidden;z-index:3;background:rgba(12,27,42,.97);box-shadow:0 -1px 0 rgba(169,188,208,.16),0 -24px 60px -24px rgba(0,0,0,.55);transition:transform 420ms var(--ease-out),visibility 0s linear 420ms,height 320ms var(--ease-out)}
  .nav.open .panel{transform:none;visibility:visible;clip-path:none;transition:transform 420ms var(--ease-out),visibility 0s,height 320ms var(--ease-out)}
  .panel.dragging{transition:none}
  .panel>*,.nav.open .panel>*{opacity:1;transform:none;transition:none}
  .sheet-head{display:flex;position:sticky;top:0;z-index:2;justify-content:center;align-items:center;height:52px;margin:0 -20px 4px;background:inherit;border-radius:24px 24px 0 0;touch-action:none}
  .grab{width:40px;height:4px;border-radius:2px;background:rgba(169,188,208,.4)}
  .sheet-close{position:absolute;left:10px;top:4px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#EEF2F6;background:rgba(255,255,255,.07)}
  .sheet-close svg{width:14px;height:14px}
  .ip{display:block}
  .ip-row{border-bottom:1px solid rgba(169,188,208,.12)}
  .ip-item{font-size:1.5rem;padding:11px 0;min-height:48px;border-bottom:0;color:#D5DFEA}
  .ip-item[aria-current]{color:#fff}
  .ip-tog{display:grid;place-items:center;width:48px;height:48px;margin-left:-10px;position:relative;color:#8497AB}
  .ip-tog::before,.ip-tog::after{content:"";position:absolute;width:14px;height:1.5px;background:currentColor;transition:transform var(--t3) var(--ease-out)}
  .ip-tog::after{transform:rotate(-90deg)}
  .ip-tog[aria-expanded="true"]{color:#fff}
  .ip-tog[aria-expanded="true"]::after{transform:rotate(0)}
  .ip-pane,.ip-pane.on{display:none;border:0;padding:2px 0 12px;animation:none}
  .ip-pane.open{display:block}
  .ip-pane .label{display:none}
  .ip-sub a{padding:11px 14px 11px 0;border-bottom:0;min-height:44px}
  .ip-sub a strong{font-size:1rem;color:#B9C6D4}
  .ip-sub a::after{display:none}
  .ip-foot{margin-top:18px;padding-top:14px;flex-wrap:wrap;gap:10px 18px;border-top:1px solid rgba(169,188,208,.1)}
  .ip-links{gap:18px;font-size:.64rem;color:#6F849B}
  .ip-links a{padding:8px 0}
}

/* ---------- Amal card when the plugin panel is open ---------- */
.amal{transition:opacity var(--t2),visibility 0s}
.amal.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--t2),visibility 0s linear var(--t2)}
.amal-card:not(:has(img)){background:radial-gradient(80% 80% at 50% 20%,#1B4A74,#0C1B2A)}

/* ---------- Leadership without a photo or biography ---------- */
.pcard .ph.empty{display:grid;place-items:center;background:linear-gradient(-160deg,#18304A,#0C1B2A)}
.pcard .mono{font-size:clamp(3rem,6vw,5rem);font-weight:300;letter-spacing:-.05em;color:rgba(213,223,234,.5)}
.pcard .rev p+p{margin-top:.6em}

/* ---------- Contact ---------- */
.seg{border:0;margin:0;padding:0;min-width:0}
.seg legend{padding:0;margin-bottom:10px;font-family:var(--sans);font-size:1rem;font-weight:500;letter-spacing:0;text-transform:none;color:var(--text)}
.seg-pick label{position:relative;display:inline-flex}
.seg-pick input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.seg-pick span{display:inline-flex;align-items:center;min-height:48px;padding:12px 16px;border-radius:999px;border:1px solid #C7CDD6;background:#F8F8FA;color:var(--text);font-size:1rem;transition:background var(--t2),color var(--t2),border-color var(--t2)}
.seg-pick label:hover span{border-color:var(--navy)}
.seg-pick input:checked+span{background:var(--navy);color:#fff;border-color:var(--navy)}
.seg-pick input:focus-visible+span{outline:2px solid var(--navy);outline-offset:3px}
.hp{position:absolute!important;right:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.c-row{grid-template-columns:repeat(var(--n,5),minmax(0,1fr))}
@media (max-width:900px){.c-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:520px){.c-row{grid-template-columns:1fr 1fr}}
.cf .btn[disabled]{opacity:.75;cursor:progress}
.cf-err{outline:none}

/* ---------- Simple pages, search, 404 ---------- */
.hero-ed.simple{padding-bottom:clamp(32px,4vw,56px)}
.hero-ed.simple h1,.hero-ed.nf h1{font-size:var(--fs-h1);max-width:18ch}
.simple-body{padding-bottom:clamp(88px,10vw,140px)}
.simple-body .prose{max-width:72ch}
.prose a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prose img,.prose video,.prose iframe{max-width:100%;height:auto;border-radius:12px}
.prose figure{margin:1.8em 0}
.prose figcaption{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);margin-top:10px}
.prose h3{font-size:1.4rem;letter-spacing:-.02em;margin-top:1.8em}
.prose ol{list-style:decimal;padding-right:1.3em}
.prose table{width:100%;border-collapse:collapse;font-size:1rem}
.prose th,.prose td{border-bottom:1px solid var(--rule);padding:10px 8px;text-align:right}
.prose .wp-block-embed__wrapper{position:relative}
.prose .wp-block-quote{margin:1.8em 0;padding:0}
/* Tables in posts get the site's hairlines. WordPress core puts a 1px currentColor border on every cell and 3px under
   the head, which read as heavy black lines against everything else on the page. */
.prose .wp-block-table{margin-block:1.8em;overflow-x:auto}
.prose .wp-block-table table{border-collapse:collapse;width:100%}
.prose .wp-block-table :is(th,td){border:0;border-bottom:1px solid var(--rule);padding:14px 0 14px 16px;text-align:start;vertical-align:top;font-size:1rem}
.prose .wp-block-table :is(thead,tfoot){border:0}
.prose .wp-block-table th{font-family:var(--mono);font-size:var(--fs-label);font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);border-bottom-color:var(--fg-3)}
/* FAQ: Rank Math's FAQ block, which also writes the FAQPage data that search and AI assistants read. Laid out as the
   site's question-and-answer rows between hairlines, not as a stack of headings. */
.prose .rank-math-list{display:grid;border-top:1px solid var(--rule)}
.prose .rank-math-list-item{display:block;border-bottom:1px solid var(--rule)}
.prose .rank-math-list-item>summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(18px,2vw,26px) 0;cursor:pointer;list-style:none}
.prose .rank-math-list-item>summary::-webkit-details-marker{display:none}
.prose .rank-math-list-item>summary svg{flex:none;width:18px;height:18px;color:var(--fg-3);transition:transform var(--t2) var(--ease-out),color var(--t2)}
.prose .rank-math-list-item[open]>summary svg{transform:rotate(-45deg);color:var(--fg)}
.prose .rank-math-list-item>summary:hover .rank-math-question{color:var(--accent)}
.prose .rank-math-list-item>summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.prose .rank-math-question{margin:0;font-size:clamp(1.1rem,1.4vw,1.3rem);font-weight:500;letter-spacing:-.02em;line-height:1.3;transition:color var(--t2)}
.prose .rank-math-answer{color:var(--fg-2);font-size:1.05rem;line-height:1.6;padding-bottom:clamp(18px,2vw,26px);max-width:62ch}
.prose .rank-math-answer p{margin:0}
/* Numbered points (dbu/points) inside a post: the outcomes grid, two across in the reading column. */
.prose .points{grid-template-columns:repeat(2,minmax(0,1fr));margin-block:1.6em}
.prose .points div{padding:24px 0 24px 20px;border-right:0}
.prose .points div:nth-child(2n){padding-right:20px;border-right:1px solid var(--rule)}
.prose .points h3{margin:0;font-size:1.2rem;line-height:1.25}
.prose .points p{margin:0;font-size:1rem;line-height:1.55}
@media (max-width:640px){.prose .points{grid-template-columns:1fr}.prose .points div:nth-child(2n){padding-right:0;border-right:0}}
.abody.no-toc .prose{grid-column:1/10}
@media (max-width:1023px){.abody.no-toc .prose{grid-column:1/-1}}
.searchform{display:flex;gap:8px;width:100%;max-width:560px;margin-top:28px;min-width:0}
.searchform input{flex:1;min-width:0;min-height:50px;border-radius:999px;border:1px solid #C7CDD6;padding:0 20px;font:inherit;background:#fff;color:var(--text)}
.searchform input:focus{outline:2px solid var(--navy);outline-offset:2px}
.nf-links{display:flex;flex-wrap:wrap;gap:12px}
.hero-ed.nf .row{grid-template-columns:1fr;gap:24px}
.hero-ed.nf .row>*{grid-column:1/-1}
.results li a{display:grid;gap:6px;padding:22px 0;border-bottom:1px solid var(--rule)}
.results strong{font-weight:500;font-size:clamp(1.2rem,1.8vw,1.6rem);letter-spacing:-.02em}
.results .dek{color:var(--fg-2)}
.pager .nav-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px}
.pager .page-numbers{display:inline-flex;align-items:center;min-width:44px;min-height:44px;justify-content:center;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule);font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}
.pager .page-numbers.current{background:var(--ink);color:#fff;box-shadow:none}
.sr-only,.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Case study (optional parts) ---------- */
.cd-args .arg[data-label="Summary"] .statement{font-size:var(--fs-h3);font-weight:400;max-width:34ch}
.cd-quote{margin:0}
.cd-quote p{font-size:clamp(1.6rem,2.6vw,2.4rem);line-height:1.2;letter-spacing:-.025em;font-weight:500;max-width:30ch}
.cd-quote p::before{content:"";display:block;width:48px;height:2px;background:var(--navy);margin-bottom:20px}
.cd-quote cite{display:block;margin-top:16px;font-style:normal;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3)}
.crumbs-l a,.ahead .crumbs a{color:inherit;display:inline-flex;align-items:center;min-height:24px}
.cd-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px 32px;margin-bottom:clamp(40px,5vw,64px)}
.cd-metrics b{display:block;font-size:clamp(2.6rem,5vw,4.6rem);font-weight:500;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums;margin-bottom:10px}
.cd-extra .wrap{display:grid;gap:32px}
.cd-video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:var(--ink)}
.cd-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cd-gallery img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
.cd-gallery figcaption{margin-top:8px}
@media (max-width:767px){.cd-gallery{grid-template-columns:1fr}}

/* ---------- Footer entities without a link ---------- */
.foot .col span{font-size:1.2rem}
.foot .legal a{transition:color var(--t2)}

/* ---------- Map labels near the right edge sit on the left ---------- */
.nm-dot.lbl-left span{left:auto;right:36px}
.nm-dot.lbl-up span{top:10%}
.nm-dot.lbl-down span{top:90%}

@media (forced-colors:active){.jpills a[aria-current],.seg-pick input:checked+span{border:2px solid Highlight}}
a.topic{display:inline-block;min-height:24px;line-height:24px}
.nm-step{display:none}
@media (max-width:767px){.nm-step{display:flex;margin-top:18px}.nm-step button{width:44px;height:44px;color:#fff}}

/* Journal video: poster + play button; the player takes the poster's place. */
.vwrap{position:relative;overflow:hidden;border-radius:16px}
.gcard .vwrap{border-radius:18px}
.jlead-c .vwrap{border-radius:0}
.gcard.has-video h3 a::after{content:none}
.vwrap>.art{border-radius:0}
.jlead-c .vwrap{position:absolute;inset:0}
.vplay{position:absolute;inset:0;display:grid;place-items:center;border-radius:inherit;cursor:pointer}
.vbtn{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 10px 30px -10px rgba(7,18,29,.6);transition:transform var(--t3) var(--ease-out),background var(--t2)}
.vbtn svg{width:22px;height:22px;margin-right:3px}
.vplay:hover .vbtn,.vplay:focus-visible .vbtn{transform:scale(1.08);background:#fff}
.vplay:focus-visible{outline:2px solid #fff;outline-offset:-6px}
.vplayer{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:inherit;background:#000;object-fit:contain}
.jlead-c.has-video .in{pointer-events:none}
.jlead-c.has-video .in a{pointer-events:auto}
.has-video h3 a,.has-video h2 a{color:inherit}
.has-video h3 a:hover,.has-video h2 a:hover{color:var(--accent)}
@media (max-width:767px){.vbtn{width:56px;height:56px}}
.a-figure .vwrap{border-radius:14px}
.cd-video .vwrap,.cd-video .vwrap>.art{position:absolute;inset:0;border-radius:0}

/* ---------- Language switch (EN | AR): at the exact centre of the menu's bottom row, with the social links and the
   group entities balanced either side (desktop); at the top of the bottom sheet on phones ---------- */
.lang{display:flex;align-items:center;gap:2px;height:34px;padding:3px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(169,188,208,.24);font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;line-height:1}
.lang a,.lang span{min-width:34px;height:28px;padding:0 9px;display:grid;place-items:center;border-radius:999px;color:#9FB0C2;transition:color var(--t2),background var(--t2)}
.lang a:hover{color:#fff;background:rgba(255,255,255,.08)}
.lang .on{color:#0C1B2A;background:#fff}
.lang .off{opacity:.45;cursor:not-allowed}
@media (min-width:768px){
  /* Same columns as the menu above, so EN | AR sits centred on the divider line between the two menu columns. */
  .ip-foot:has(.lang-foot){display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:40px;align-items:center}
  .ip-foot:has(.lang-foot) .ip-links:first-child{grid-column:1;grid-row:1}
  .ip-foot:has(.lang-foot) .lang-foot{grid-column:2;grid-row:1;justify-self:start;transform:translateX(50%)}
  .ip-foot:has(.lang-foot) .ip-links:last-child{grid-column:2;grid-row:1;justify-self:end}
  .lang-sheet{display:none}
}
@media (max-width:767px){.lang-foot{display:none}.lang-sheet{position:absolute;right:12px;top:9px}}
.ar-review{position:fixed;z-index:120;right:50%;bottom:24px;transform:translateX(50%);padding:10px 16px;border-radius:999px;background:#7A5B12;color:#fff;font-size:.85rem;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);white-space:nowrap;max-width:calc(100% - 32px);overflow:hidden;text-overflow:ellipsis}
@media (max-width:767px){.ar-review{bottom:calc(92px + env(safe-area-inset-bottom,0px))}}
/* Notice for visitors sent from an Arabic address that has no published Arabic yet. */
.ar-soon{position:fixed;z-index:120;right:50%;bottom:24px;transform:translateX(50%);width:min(440px,calc(100% - 32px));padding:12px 18px 12px 52px;border-radius:16px;background:var(--ink);color:#EEF2F6;box-shadow:0 20px 40px -20px rgba(7,18,29,.6);font-size:.92rem;line-height:1.45}
.ar-soon p+p{color:#B9C6D4;margin-top:2px}
.ar-soon [lang="ar"]{font-family:"Readex Pro",var(--sans);text-align:left}
.ar-soon button{position:absolute;left:8px;top:8px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:#fff;background:rgba(255,255,255,.08)}
@media (max-width:767px){.ar-soon{bottom:calc(92px + env(safe-area-inset-bottom,0px))}}

/* Display headings use tight line-heights; this keeps their descenders (g, y, p, Arabic tails) clear of the next line. */
:is(.flag h3,.g-entry .g-title h1,.hero-ed h1,.t-hero h1,.ttease h2,.gtease h2,.c-hero h1,.j-hero h1,.next-case h2,.xcard h2,.cd-hero h1,.ahead h1,.g-pos h2,.g-cta h2,.eco-card strong){padding-bottom:.12em}

/* ---------- Arabic (html[lang="ar"], dir="rtl"; the mirrored layout is dbu-rtl.css, generated by build.sh) ----------
   Readex Pro carries the Arabic; Latin words (DBU, Mapped Out) fall back to General Sans. Letter-spacing and capitals
   break Arabic letter joining, so both are off; display type gets room for Arabic dots and marks. */
@font-face{font-family:"Readex Pro";src:url(../fonts/ReadexPro-Arabic.woff2) format("woff2");font-weight:300 600;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
html[lang="ar"]{--sans:"Readex Pro","General Sans","Helvetica Neue",Arial,sans-serif;--mono:"Readex Pro","General Sans",Arial,sans-serif;
  --fs-display:clamp(2.6rem,6.6vw,7.2rem);--fs-h1:clamp(2.2rem,4.6vw,4.8rem);--fs-h2:clamp(1.8rem,3.3vw,3.4rem);--fs-h3:clamp(1.35rem,2vw,1.9rem)}
/* Arabic display sizes: Readex Pro sits larger than General Sans at the same size, so headlines scale to about 0.8. */
html[lang="ar"] .hero-b h1{font-size:clamp(2.8rem,8vw,9rem)}
html[lang="ar"] .gl-w{font-size:clamp(2.6rem,5.6vw,5.8rem);line-height:1.18} /* Arabic ascenders and descenders need the room. */
html[lang="ar"] .t-hero h1{font-size:clamp(2.4rem,5.6vw,6rem)}
html[lang="ar"] :is(.cd-hero h1,.ahead h1,.xcard h2){font-size:clamp(2rem,4.4vw,4.4rem)}
html[lang="ar"] .ind .ctx .t{font-size:clamp(2.2rem,4vw,4.2rem)}
html[lang="ar"] :is(.ttease h2,.gtease h2,.c-hero h1){font-size:clamp(2.4rem,5.6vw,6rem)}
html[lang="ar"] :is(.g-pos h2,.g-cta h2,.next-case h2,.flag h3){font-size:clamp(2.1rem,4.6vw,5rem)}
html[lang="ar"] .j-hero h1{font-size:clamp(3.4rem,11vw,12rem)}
html[lang="ar"] :is(.hero-ed h1,.c-hero h1,.a-hero h1,.cd-hero h1,.ahead h1){max-width:20ch}
html[lang="ar"] body,html[lang="ar"] body *{letter-spacing:0!important;text-transform:none!important}
/* Latin-only labels in the menu (LinkedIn, Instagram, Mapped Out, Craffo, EN | AR) keep the English label style. */
/* Journey years: same numbers as English (a word year such as اليوم stays Arabic). */
html[lang="ar"] body .orbit .yr:not(.word){font-family:"Geist Mono",ui-monospace,monospace!important;letter-spacing:.1em!important}
html[lang="ar"] body .jyear:not(.word) .yearbox{font-family:"General Sans","Helvetica Neue",Arial,sans-serif!important;letter-spacing:-.06em!important}
html[lang="ar"] body :is(.ip-links,.lang) :is(a,span:not(.sr)){font-family:"Geist Mono",ui-monospace,"SFMono-Regular",Menlo,monospace!important;letter-spacing:.12em!important;text-transform:uppercase!important}
html[lang="ar"] :is(h1,h2,h3,.statement,.big,.lead,.t){line-height:1.25!important}
html[lang="ar"] .jstep .y{line-height:1.3} /* Components set tight Latin line-heights; Arabic needs room. */
/* Labels fade out before the wheel's edge, so no word is ever shown half cut. */
.wheel-wrap{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 86%,transparent)}
@media (min-width:768px){html[lang="ar"] .wheel-item{font-size:clamp(1.3rem,2vw,2.2rem)}}
html[lang="ar"] .label{font-size:calc(var(--fs-label) * 1.15)}
/* The presence map is real geography: it is never mirrored (its rules are also excluded from dbu-rtl.css). */
html[dir="rtl"] :is(.nm-map,.art,video){direction:ltr}
/* Arrows and chevrons point the way Arabic reads. */
html[dir="rtl"] :is(use[href="#arr"],use[href="#prev"],use[href="#next"]){transform:scaleX(-1);transform-box:fill-box;transform-origin:center} /* On the icon itself, so hover nudges on the svg still apply. */
html[dir="rtl"] .ip-sub a::after{transform:scaleX(-1)}
html[dir="rtl"] .ip-sub a:hover::after{transform:scaleX(-1) translateX(4px)}

/* Leadership biographies stay readable however long they are. */
@media (max-width:767px){.pcard .rev{min-height:100%;padding:20px 18px calc(20px + env(safe-area-inset-bottom,0px));justify-content:stretch}.pcard .rev p{font-size:.92rem;line-height:1.5}}
/* No min-height on desktop: the panel hugs the bio so the scrim sits behind the
   text instead of riding up over the face. */

/* The opening's sticky photograph is a positioned layer, so everything after it is raised above it;
   otherwise it painted over the next section and left what looked like a long empty gap. */
.opening ~ *{position:relative;z-index:1}

/* Contact: phone number with its country code (flag, dialling code, country). */
.phone-row{display:grid;grid-template-columns:minmax(0,142px) minmax(0,1fr);gap:8px}
.phone-row select{padding-left:34px;background-position:left 12px center;font-size:1rem;text-overflow:ellipsis}
.phone-row input{min-width:0}
/* The dialling code, searchable. The <select> is still what the form submits; this is the list in front of it. */
.dsel{position:relative;min-width:0}
.dsel-btn{width:100%;min-height:54px;font:inherit;font-size:1rem;text-align:right;color:var(--text);background:#F8F8FA;border:1px solid #C7CDD6;border-radius:12px;padding:15px 14px 15px 30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:border-color var(--t2),box-shadow var(--t2),background var(--t2)}
.dsel-btn::after{content:"";position:absolute;left:12px;top:50%;width:7px;height:7px;border-left:1.5px solid #6B7F93;border-bottom:1.5px solid #6B7F93;transform:translateY(-70%) rotate(-45deg)}
.dsel-btn:hover{border-color:#8C98A8}
.dsel.is-open .dsel-btn,.dsel-btn:focus-visible{outline:none;background:#fff;border-color:var(--navy);box-shadow:0 0 0 4px rgba(18,57,92,.16)}
.dsel-pop{position:absolute;z-index:40;top:calc(100% + 6px);right:0;min-width:100%;width:max(100%,290px);background:#fff;border:1px solid #C7CDD6;border-radius:14px;box-shadow:0 24px 50px -24px rgba(12,27,42,.45);overflow:hidden}
.dsel-find{width:100%;font:inherit;font-size:1rem;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:13px 14px;background:#fff;-webkit-appearance:none;appearance:none}
.dsel-find:focus{outline:none;background:#F8F8FA}
.dsel-list{list-style:none;margin:0;padding:6px;max-height:min(46vh,300px);overflow-y:auto;overscroll-behavior:contain}
.dsel-list li{padding:11px 12px;border-radius:9px;cursor:pointer;font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dsel-list li.on,.dsel-list li:hover{background:#EEF2F6}
.dsel-list li[aria-selected="true"]{font-weight:500}
.dsel-none{color:var(--mist);cursor:default}
.dsel-none:hover{background:transparent}
@media (max-width:420px){.dsel-pop{width:max(100%,250px)}}
@media (max-width:420px){.phone-row{grid-template-columns:minmax(0,118px) minmax(0,1fr)}.phone-row select{font-size:.95rem;padding-inline:12px 28px;background-position:left 8px center}}