@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/ibm-plex-mono-400-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/ibm-plex-mono-500-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/ibm-plex-mono-600-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/ibm-plex-sans-arabic-400-arabic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/ibm-plex-sans-arabic-500-arabic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/ibm-plex-sans-arabic-600-arabic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/ibm-plex-sans-arabic-700-arabic.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('../assets/fonts/Inter-VariableFont_opsz-wght.ttf') format('truetype-variations')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url('../assets/fonts/SpaceGrotesk-VariableFont_wght.ttf') format('truetype-variations')}

:root{
  --ink-950:#080A0E;--ink-900:#0C0F15;--surface-800:#0F131A;--surface-700:#141923;
  --line-100:rgba(255,255,255,.07);--line-200:rgba(255,255,255,.12);
  --text-hi:#EEF1F6;--text-mid:#9098A6;
  --accent-600:#FF6A2B;--accent-400:#FF8A50;
  --cyan-500:#3FCBBA;--cyan-400:#6BE0D2;
  --font-display:'Space Grotesk','IBM Plex Sans Arabic',-apple-system,sans-serif;
  --font-body:'Inter','IBM Plex Sans Arabic',-apple-system,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --radius-sm:2px;--radius-md:4px;
  --container-max:1200px;--container-pad:24px;
  --ease-out:cubic-bezier(.16,1,.3,1);--ease-standard:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink-950);color:var(--text-hi);font-family:var(--font-body);overflow-x:hidden}
h1,h2,h3{font-family:var(--font-display);margin:0}
p{margin:0}
a{color:var(--accent-600);text-decoration:none}
a:hover{color:var(--accent-400)}
img,canvas{max-width:100%}
ul{margin:0;padding:0;list-style:none}

.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:18px var(--container-pad);background:rgba(8,10,14,.82);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-100);gap:12px}
.nav-brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.monogram{width:36px;height:36px;flex-shrink:0;border:1.5px solid var(--accent-600);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:17px;color:var(--accent-600)}
.brand-name{font-family:var(--font-mono);font-weight:600;font-size:14px;letter-spacing:.14em;white-space:nowrap}
.brand-sub{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;color:var(--text-mid);margin-top:2px}
.nav-links{display:flex;align-items:center;gap:32px}
.nav-link{font-family:var(--font-mono);font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-hi);transition:color .12s var(--ease-standard)}
.nav-link:hover{color:var(--accent-600)}
.nav-lang{color:var(--text-mid);font-size:12px}
.nav-cta{white-space:nowrap}
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;background:transparent;border:1px solid var(--line-200);border-radius:var(--radius-sm);color:var(--text-hi);font-size:18px;cursor:pointer}
@media (max-width:1100px){
  .nav-links{display:none}
  .nav-links.nav-open{display:flex!important;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0!important;background:rgba(8,10,14,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-100);padding:8px var(--container-pad) 16px;max-height:calc(100svh - 74px);overflow-y:auto}
  .nav-links.nav-open a{padding:12px 0;width:100%}
  .nav-toggle{display:inline-flex}
}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-body);font-weight:600;letter-spacing:.06em;text-transform:uppercase;border-radius:var(--radius-sm);padding:12px 22px;font-size:16px;cursor:pointer;transition:transform .12s var(--ease-standard),background .12s var(--ease-standard);line-height:1;border:1px solid transparent}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--accent-600);color:var(--ink-950);border-color:var(--accent-600)}
.btn-primary:hover{background:var(--accent-400);border-color:var(--accent-400);color:var(--ink-950)}
.btn-secondary{background:transparent;color:var(--accent-600);border-color:var(--accent-600)}
.btn-secondary:hover{color:var(--accent-400);border-color:var(--accent-400)}

.hero{position:relative;background-color:var(--ink-950);background-image:radial-gradient(circle at 12% 25%,rgba(255,106,43,.22),transparent 45%),radial-gradient(circle at 85% 80%,rgba(63,203,186,.16),transparent 50%),linear-gradient(180deg,#0b0d13 0%,#07090f 100%);min-height:100svh;padding:96px var(--container-pad) 80px}
.star-canvas{position:absolute;inset:0;pointer-events:none;z-index:0}
@media (prefers-reduced-motion:reduce){.star-canvas{display:none}}
.hero-inner{position:relative;z-index:1;max-width:var(--container-max);margin:0 auto}
.hero-tagline{font-family:var(--font-mono);font-size:14px;color:var(--accent-600);letter-spacing:.14em;text-transform:uppercase;margin-bottom:24px;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.hero-title{font-size:clamp(38px,8.5vw,84px);line-height:1.05;letter-spacing:-.02em;font-weight:700;color:var(--text-hi);max-width:13ch;margin-bottom:12px;text-shadow:0 2px 24px rgba(0,0,0,.6)}
.hero-title .accent{color:var(--accent-600)}
.hero-subtext{margin-bottom:32px;max-width:46ch;font-size:clamp(16px,3vw,19px);line-height:1.7;color:var(--text-mid);text-shadow:0 1px 12px rgba(0,0,0,.6)}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-in{opacity:0;transform:translateY(18px);animation:heroRise .9s var(--ease-out) forwards}
.hero-in:nth-child(1){animation-delay:.05s}.hero-in:nth-child(2){animation-delay:.16s}.hero-in:nth-child(3){animation-delay:.27s}.hero-in:nth-child(4){animation-delay:.38s}
@keyframes heroRise{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hero-in{opacity:1;transform:none;animation:none}}

.hero-stats{position:relative;z-index:1;max-width:var(--container-max);margin:64px auto 0;border-top:1px solid var(--line-100);padding-top:32px;display:grid;grid-template-columns:repeat(4,1fr)}
@media (max-width:700px){.hero-stats{grid-template-columns:repeat(2,1fr);row-gap:24px}}
.stat-value{font-family:var(--font-display);font-size:35px;font-weight:700;color:var(--accent-600);line-height:1}
.stat-label{margin-top:8px;font-size:14px;color:var(--text-mid);letter-spacing:.06em;text-transform:uppercase}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal.reveal-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

.section{padding:80px var(--container-pad)}
.section-sunken{background:var(--ink-900)}
.section-inner{max-width:var(--container-max);margin:0 auto}
.section-label{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mid);margin-bottom:16px}
.section-label-idx{color:var(--cyan-500);font-weight:600}
.rule{width:24px;height:1px;background:var(--line-100)}
.section-heading{margin-bottom:40px;font-size:clamp(28px,6vw,44px);font-weight:600;max-width:26ch}
.section-body{margin-bottom:32px;max-width:56ch;font-size:clamp(16px,3vw,19px);color:var(--text-mid);line-height:1.7}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
@media (max-width:860px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.grid-3{grid-template-columns:1fr}}

.card{background:var(--surface-800);border:1px solid var(--line-100);border-radius:var(--radius-md);padding:32px}
.service-card{position:relative;overflow:hidden;transition:transform .22s var(--ease-out),border-color .22s var(--ease-standard),background .22s var(--ease-standard)}
.service-card:hover{transform:translateY(-4px);border-color:var(--line-200);background:var(--surface-700)}
.service-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.icon-swatch{width:52px;height:52px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;background:var(--surface-800);border:1px solid var(--line-100);color:var(--accent-600);transition:background .22s var(--ease-standard),border-color .22s var(--ease-standard)}
.service-card:hover .icon-swatch{background:rgba(255,106,43,.14);border-color:var(--accent-600)}
.idx{font-family:var(--font-mono);font-size:14px;color:var(--cyan-500);font-weight:600}
.service-card h3{font-size:clamp(19px,3.4vw,24px);font-weight:600;margin-bottom:12px}
.service-card p{font-size:16px;line-height:1.7;color:var(--text-mid);margin-bottom:20px}
.feature-list{display:flex;flex-direction:column;gap:8px}
.feature-list li{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--text-mid)}
.feature-list svg{color:var(--accent-600);flex-shrink:0}

.why-block{margin-top:80px}
.why-grid{gap:16px}
.why-item{display:flex;align-items:center;gap:12px;padding:16px 20px;background:var(--surface-800);border:1px solid var(--line-100);border-radius:var(--radius-md);transition:transform .22s var(--ease-out),border-color .22s var(--ease-standard),background .22s var(--ease-standard)}
.why-item:hover{transform:translateY(-4px);border-color:var(--line-200);background:var(--surface-700)}
.why-item svg{color:var(--accent-600);flex-shrink:0}
.why-item span{font-size:16px;color:var(--text-hi)}

.footer{background:var(--ink-900);color:var(--text-hi);padding:64px var(--container-pad)}
.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:32px;max-width:var(--container-max);margin:0 auto}
.footer-name{font-family:var(--font-mono);font-size:14px;letter-spacing:.14em;text-transform:uppercase;opacity:.6}
.footer-links{display:flex;gap:40px;flex-wrap:wrap;font-family:var(--font-mono);font-size:14px}
.footer-link{color:var(--text-hi)}
.footer-link:hover{color:var(--accent-600)}
.footer-location{opacity:.6}

html[dir="rtl"] .section-label,html[dir="rtl"] .brand-sub,html[dir="rtl"] .nav-link,html[dir="rtl"] .hero-tagline,html[dir="rtl"] .stat-label,html[dir="rtl"] .idx,html[dir="rtl"] .footer-name,html[dir="rtl"] .footer-links{direction:rtl}