@font-face { font-family: "IBM Plex Sans Arabic"; font-weight: 400; font-display: swap; src: url("/assets/fonts/plex-arabic-400.woff2") format("woff2"); 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; }
@font-face { font-family: "IBM Plex Sans Arabic"; font-weight: 500; font-display: swap; src: url("/assets/fonts/plex-arabic-500.woff2") format("woff2"); 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; }
@font-face { font-family: "IBM Plex Sans Arabic"; font-weight: 600; font-display: swap; src: url("/assets/fonts/plex-arabic-600.woff2") format("woff2"); 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; }
@font-face { font-family: "IBM Plex Sans Arabic"; font-weight: 700; font-display: swap; src: url("/assets/fonts/plex-arabic-700.woff2") format("woff2"); 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; }
@font-face { font-family: "Space Grotesk"; font-weight: 300 700; font-display: swap; src: url("/assets/fonts/space-grotesk-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; font-weight: 100 800; font-display: swap; src: url("/assets/fonts/jetbrains-mono-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root { --bg: #0a0a0a; --ink: #f5f5f5; --mut: #8a8a8a; --line: rgba(255,255,255,.1); --y: #ffba00; --teal: #12a8ae;
  --f: "Space Grotesk", "IBM Plex Sans Arabic", system-ui, sans-serif; --fa: "IBM Plex Sans Arabic", "Space Grotesk", system-ui, sans-serif; --m: "JetBrains Mono", ui-monospace, monospace; }
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: radial-gradient(60% 50% at 50% 38%, rgba(255,186,0,.07), transparent 70%), var(--bg); color: var(--ink); font: 400 16px/1.6 var(--f); -webkit-font-smoothing: antialiased; }
html[dir="rtl"] body { font-family: var(--fa); }
a { color: inherit; text-decoration: none; }
.lockup-en { display: none; } html[lang="en"] .lockup-ar { display: none; } html[lang="en"] .lockup-en { display: block; } html[lang="ar"] .lockup-en { display: none; }
.nav { display: flex; align-items: center; gap: 1rem; height: 56px; padding-inline: 28px; border-bottom: 1px solid var(--line); background: rgba(10,10,10,.82); }
.nav-logo img { height: 24px; width: auto; }
.nav-end { margin-inline-start: auto; display: flex; gap: 10px; }
.pill-btn { display: inline-flex; align-items: center; justify-content: center; height: 34px; padding: 0 16px; border-radius: 99px; border: 1px solid rgba(255,255,255,.28); background: transparent; color: #fff; font: 500 13px var(--f); cursor: pointer; transition: background .2s, border-color .2s; }
html[dir="rtl"] .pill-btn { font-family: var(--fa); }
.pill-btn:hover { background: rgba(255,255,255,.08); border-color: #fff; }
.pill-btn.solid { background: var(--y); border-color: var(--y); color: #000; font-weight: 700; } .pill-btn.solid:hover { background: #ffc933; }
.pill-btn:focus-visible { outline: 2px solid var(--y); outline-offset: 3px; }
main { flex: 1; display: grid; place-items: center; padding: 48px 20px; text-align: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 12px; font: 500 11px var(--m); letter-spacing: .22em; text-transform: uppercase; color: var(--mut); margin: 0 0 20px; } .eyebrow b { color: var(--y); font-weight: 500; } .eyebrow i { width: 36px; height: 1px; background: rgba(255,255,255,.25); }
html[dir="rtl"] .eyebrow { letter-spacing: .06em; font-family: var(--fa); }
h1 { margin: 0; font-size: clamp(28px, 4vw, 44px); font-weight: 700; letter-spacing: -.03em; line-height: 1.1; }
html[dir="rtl"] h1 { letter-spacing: 0; line-height: 1.3; }
.soon { margin: 14px 0 0; font-size: clamp(36px, 7vw, 76px); font-weight: 700; letter-spacing: -.04em; color: var(--y); line-height: 1.1; }
html[dir="rtl"] .soon { letter-spacing: 0; }
.mut { color: var(--mut); max-width: 34rem; margin: 18px auto 32px; font-size: 15px; }