@font-face{font-family:EdurimaArabic;src:url('/assets/NotoSansArabic.ttf') format('truetype');font-display:swap;font-weight:100 900}
:root{color-scheme:light;--surface:#fff;--page:#f8faff;--ink:#00132f;--secondary:#425973;--stroke:#d7e2ee;--accent:#0956ff;--mint-ink:#007d7d}
:root[data-theme=dark]{color-scheme:dark;--surface:#10233d;--page:#081526;--ink:#edf4ff;--secondary:#b8c9df;--stroke:#2b425f;--accent:#80adff;--mint-ink:#65dbcd;--navy:#edf4ff;--blue:#80adff;--teal:#65dbcd;--muted:#b8c9df;--line:#2b425f;--teal-ink:#65dbcd}
body{background:var(--page);color:var(--ink)}
/* Keep the original lockup left-aligned; compensate for its SVG inset below. */
.brand{direction:ltr;align-items:center;gap:12px}
.brand-type{display:grid;justify-items:start;gap:6px;min-width:0}
.brand .brand-wordmark{object-position:left center;margin:0;padding:0}
.brand-slogan{margin:0;padding:0;text-align:left;align-self:start;line-height:1.35}
.header-actions{display:flex;align-items:center;gap:16px;min-width:0}
.preferences{display:flex;align-items:center;gap:6px}
.preference-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border:1px solid var(--stroke);background:var(--surface);color:var(--ink);border-radius:10px;padding:8px 12px;font-size:12px;font-weight:600}
.preference-button:hover{border-color:var(--accent);background:var(--page)}
.language-toggle{font-family:EdurimaArabic,system-ui,sans-serif;min-width:70px}
.theme-toggle{width:42px;padding:10px}
.theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sun-icon{display:none}
[data-theme=dark] .sun-icon{display:block}
[data-theme=dark] .moon-icon{display:none}
[data-theme=dark] header,[data-theme=dark] footer{border-color:var(--stroke)}
[data-theme=dark] header nav .social-button{background:var(--surface);color:var(--ink);border-color:var(--stroke)}
[data-theme=dark] header nav .social-button:hover{background:#193451;border-color:var(--accent);color:var(--ink)}
[data-theme=dark] .social-arrow,[data-theme=dark] .intro,[data-theme=dark] .production-note,[data-theme=dark] .game-note,[data-theme=dark] .expertise-intro,[data-theme=dark] .service-grid p,[data-theme=dark] .service-detail,[data-theme=dark] .service-footnote,[data-theme=dark] footer,[data-theme=dark] .section-eyebrow{color:var(--secondary)}
[data-theme=dark] .specialisms,[data-theme=dark] .game-note span,[data-theme=dark] .service-footnote>span,[data-theme=dark] footer>span:last-child{color:var(--mint-ink)}
[data-theme=dark] .brand-wordmark{filter:brightness(0) invert(1)}
[data-theme=dark] .brand-mark{background:#f8faff;border-radius:9px;padding:3px}
[data-theme=dark] .brand-slogan{color:#c4ddff}
[data-theme=dark] .construction-badge,[data-theme=dark] .requests-soon{color:#7ee5d7;background:#0e302f;border-color:#285653}
[data-theme=dark] .pillars li,[data-theme=dark] .pillars li+li,[data-theme=dark] .service-grid article,[data-theme=dark] .service-grid article+article{background:var(--surface);border-color:var(--stroke);color:var(--ink)}
[data-theme=dark] .build-zone{background:var(--surface);border-color:var(--stroke)}
[data-theme=dark] .yard-header{background:var(--surface);border-color:var(--stroke)}
[data-theme=dark] .live-label{color:#7ee5d7}
[data-theme=dark] .game-label,[data-theme=dark] .scene-caption{color:#b8c9df}
[data-theme=dark] .construction-scene,[data-theme=dark] .complete .construction-scene{background-color:#0d2038;background-image:linear-gradient(#547bac22 1px,transparent 1px),linear-gradient(90deg,#547bac22 1px,transparent 1px)}
[data-theme=dark] .station-labels{fill:#c5d9f2}
[data-theme=dark] .game-block:not(.built) rect{fill:#203d60;stroke:#6d8fb9}
[data-theme=dark] .scaffold{stroke:#7198c5}
[data-theme=dark] .crane{stroke:#83adf0}
[data-theme=dark] .foundations{fill:#6387b4}
[data-theme=dark] .floating-reward{text-shadow:0 2px 0 #081526}
[data-theme=dark] .skip-link{background:var(--surface);color:var(--ink)}
[data-theme=dark] ::selection{background:#285484;color:white}
[lang=ar] body{font-family:EdurimaArabic,system-ui,sans-serif}
[lang=ar] h1{letter-spacing:0;line-height:1.5;font-weight:650}
[lang=ar] .brand-slogan{font-family:EdurimaArabic,system-ui,sans-serif;direction:rtl;justify-self:start;letter-spacing:0;font-size:11px}
[lang=ar] .brand-slogan>span{display:inline-block}
[lang=ar] .construction-badge,[lang=ar] .section-eyebrow,[lang=ar] .service-detail,[lang=ar] .specialisms,[lang=ar] .live-label,[lang=ar] .game-label,[lang=ar] .stat-label,[lang=ar] .boost-description,[lang=ar] .scene-caption,[lang=ar] .game-progress>div:first-child{letter-spacing:0}
[lang=ar] .build-zone,[lang=ar] .boost-copy{text-align:right}
[lang=ar] .boost-copy{align-items:flex-start}
[lang=ar] .construction-scene{direction:ltr}
[lang=ar] .scene-caption{direction:rtl;font-family:EdurimaArabic,system-ui,sans-serif}
[lang=ar] .station-labels{font-family:EdurimaArabic,system-ui,sans-serif;letter-spacing:0}
[lang=ar] .game-progress{padding-right:0}
[lang=ar] #progress-label,[lang=ar] #streak,[lang=ar] #floating-reward{direction:ltr;unicode-bidi:isolate}
[lang=ar] .game-progress strong{font-family:EdurimaArabic,system-ui,sans-serif}
[lang=ar] .game-hint{margin-left:0;margin-right:auto}
[lang=ar] .boost-plus{margin-left:0;margin-right:7px}
[lang=ar] .game-note span{margin-left:0;margin-right:8px}
[lang=ar] .service-footnote>span{margin-left:0;margin-right:auto}
[lang=ar] .service-grid article{align-items:flex-start}
[lang=ar] .social-arrow{margin-left:0;margin-right:3px}
@media(max-width:1050px){header{height:auto;min-height:100px;flex-wrap:wrap;padding:20px 0;gap:20px}.header-actions{gap:12px}header nav .social-button{padding:10px;font-size:11px}}
@media(max-width:760px){header{justify-content:space-between;gap:16px;padding:18px 0}.header-actions{display:contents}.preferences{margin-inline-start:auto;gap:7px}header nav{width:100%;gap:10px}header nav .social-button{flex:1;justify-content:center;min-height:44px}.brand{gap:10px}.preference-button{min-height:44px}.theme-toggle{width:44px}.brand-slogan{font-size:9px}[lang=ar] .brand-slogan{font-size:9px}[lang=ar] .boost-plus{margin-right:auto}[lang=ar] .service-footnote>span{margin-right:0}[lang=ar] .pillars li{font-size:12px!important;white-space:normal;text-align:center}[lang=ar] .specialisms{font-size:11px;gap:8px;flex-wrap:wrap}[lang=ar] .scene-caption{font-size:8px}}
@media(max-width:480px){header nav .social-button>span:not(.sr-only){font-size:11px}header nav .youtube-button>span:first-of-type::after,header nav .linkedin-button>span:first-of-type::after{content:none}header nav .social-arrow{display:none}.language-toggle{min-width:64px;padding:8px}.brand .brand-mark{width:31px;height:37px}.brand .brand-wordmark{width:115px}.brand-slogan{font-size:8.5px}.preferences{gap:5px}.header-actions{gap:8px}[lang=ar] .yard-header h2{font-size:12px}[lang=ar] .expertise-heading{flex-wrap:wrap}}
/* Match the first visible E inside the original SVG's transparent viewBox. */
.brand-type{--wordmark-width:156px}
.brand-slogan{margin-left:calc(var(--wordmark-width) * .017)}
@media(max-width:760px){.brand-type{--wordmark-width:124px}}
@media(max-width:480px){.brand-type{--wordmark-width:115px}}
@media(max-width:360px){.brand-type{--wordmark-width:106px}}

/* Keep brand and header controls in fixed positions in both writing directions. */
header,.header-actions,header nav,.preferences{direction:ltr}
header nav .social-button{width:192px;justify-content:center}
[lang=ar] header nav .social-button{direction:rtl}
.brand{align-items:flex-start}
.brand-type{padding-top:0}
[data-theme=dark] .brand-type{padding-top:3px}
.brand .brand-mark{height:56px;object-position:top left}
@media(max-width:1050px){header nav .social-button{width:176px}}
@media(max-width:760px){header nav .social-button{width:auto}.brand-type{padding-top:0}[data-theme=dark] .brand-type{padding-top:2px}.brand .brand-mark{height:45px}}
@media(max-width:480px){.brand .brand-mark{height:42px}}
