:root { color-scheme: light; font-family: Arial, "Segoe UI", "Noto Sans Arabic", sans-serif; color: #15213b; background: #f5f8ff; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; line-height: 1.7; }
a { color: #1356a8; }
body:not(.portfolio) main { max-width: 880px; margin: 32px auto; padding: 32px; background: white; border-radius: 20px; box-shadow: 0 12px 40px rgba(19, 50, 105, .1); }
body:not(.portfolio) h1, body:not(.portfolio) h2 { color: #0c3b82; }
.muted { color: #5f6b7a; }
.rtl { direction: rtl; text-align: right; margin-top: 48px; }
nav a { margin-inline-end: 16px; }

.portfolio { --navy:#071b3c; --blue:#2164e8; --ink:#101c35; --muted:#647087; --surface:#fff; --soft:#f2f5fb; --line:#dfe5f0; min-height:100vh; color:var(--ink); background:#f8faff; overflow-x:hidden; }
.portfolio[data-theme="dark"] { color-scheme:dark; --navy:#07142e; --ink:#eef4ff; --muted:#aab7cc; --surface:#101d36; --soft:#0b1730; --line:#243653; background:#071126; }
.ambient { position:fixed; width:420px; height:420px; border-radius:50%; filter:blur(90px); opacity:.18; pointer-events:none; z-index:-1; }
.ambient-one { background:#3879ff; top:-180px; right:-120px; }.ambient-two { background:#12c6a2; bottom:-240px; left:-180px; }
.topbar { max-width:1240px; margin:auto; padding:24px 28px; display:flex; align-items:center; justify-content:space-between; direction:ltr; }
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); text-decoration:none; }
.brand-mark { width:46px; height:46px; display:grid; place-items:center; border-radius:15px; color:#fff; background:linear-gradient(145deg,#2164e8,#0a2b6e); font-weight:800; box-shadow:0 10px 24px #2164e835; }
.brand strong,.brand small { display:block; }.brand small { color:var(--muted); font-size:11px; letter-spacing:.08em; }
.top-actions { display:flex; gap:8px; }.icon-button { border:1px solid var(--line); color:var(--ink); background:var(--surface); min-width:44px; height:44px; border-radius:14px; cursor:pointer; font-size:18px; box-shadow:0 5px 15px #102d6110; }.language-button { font-size:13px; font-weight:800; }
.site-shell { max-width:1240px; margin:auto; padding:10px 28px 70px; }
.hero { min-height:570px; display:grid; grid-template-columns:1.04fr .96fr; align-items:center; gap:55px; padding:62px; border-radius:38px; color:#fff; background:radial-gradient(circle at 78% 22%,#1e5ac9 0,#0d316f 30%,#071b3c 70%); box-shadow:0 30px 70px #071b3c35; overflow:hidden; position:relative; }
.hero::after { content:""; position:absolute; inset:auto -10% -55% 35%; height:95%; background:linear-gradient(120deg,transparent,#3a79ef30); transform:rotate(-12deg); border-radius:50%; }
.hero-copy { position:relative; z-index:2; }.eyebrow { margin:0 0 10px; color:#4f86e8; font-weight:800; font-size:13px; letter-spacing:.04em; }.hero .eyebrow { color:#82d8ff; }
.hero h1 { margin:0; font-size:clamp(44px,6vw,78px); line-height:1.12; letter-spacing:-.045em; }.hero-description { max-width:600px; color:#d2ddf3; font-size:18px; margin:24px 0 32px; }
.primary-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:50px; padding:0 22px; border-radius:16px; background:#fff; color:#10285a; font-weight:800; text-decoration:none; box-shadow:0 12px 30px #0002; transition:.2s ease; }.primary-button:hover { transform:translateY(-2px); }.primary-button.light { background:#fff; color:#10326d; }
.hero-visual { position:relative; min-height:420px; display:grid; place-items:center; z-index:2; }.orbit { position:absolute; border:1px solid #7da7ff55; border-radius:50%; }.orbit-one { width:390px; height:390px; }.orbit-two { width:285px; height:285px; border-style:dashed; animation:spin 22s linear infinite; }
.phone-stack { position:relative; width:290px; height:330px; }.phone-stack img { position:absolute; width:150px; height:150px; object-fit:cover; border-radius:35px; border:8px solid #ffffff18; box-shadow:0 28px 45px #0006; }.phone-stack img:nth-child(1){right:63px;top:0;z-index:3;}.phone-stack img:nth-child(2){right:5px;top:145px;transform:rotate(8deg);}.phone-stack img:nth-child(3){left:0;top:155px;transform:rotate(-9deg);}
.float-pill { position:absolute; padding:8px 13px; border-radius:999px; background:#ffffff18; border:1px solid #ffffff2e; backdrop-filter:blur(10px); font-size:12px; }.pill-one{top:55px;left:2px}.pill-two{bottom:48px;right:10px}
@keyframes spin{to{transform:rotate(360deg)}}
.apps-section { padding:95px 0 30px; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:30px; }.section-heading h2,.contact-panel h2 { font-size:clamp(28px,4vw,45px); line-height:1.2; margin:0; }.filters { display:flex; gap:8px; flex-wrap:wrap; }.filter { border:1px solid var(--line); color:var(--muted); background:var(--surface); padding:10px 17px; border-radius:999px; cursor:pointer; font-weight:700; }.filter.active { color:#fff; border-color:var(--blue); background:var(--blue); }
.app-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }.app-card { position:relative; min-height:315px; display:grid; grid-template-columns:112px 1fr; gap:24px; padding:30px; overflow:hidden; border:1px solid var(--line); border-radius:27px; background:var(--surface); box-shadow:0 15px 40px #16356b0c; transition:.25s ease; }.app-card:hover { transform:translateY(-4px); box-shadow:0 22px 55px #16356b18; }.app-card.featured { grid-column:span 2; min-height:300px; grid-template-columns:150px 1fr; padding:42px; }.app-card.is-hidden{display:none}
.card-glow { position:absolute; width:190px; height:190px; opacity:.17; filter:blur(45px); border-radius:50%; inset:-80px auto auto -45px; }.blue{background:#2473ff}.green{background:#2eb85c}.cyan{background:#13b9df}.purple{background:#7659f5}.orange{background:#ffae36}
.app-icon { position:relative; width:112px; height:112px; object-fit:cover; border-radius:25px; box-shadow:0 14px 30px #102d612b; }.featured .app-icon { width:150px; height:150px; border-radius:34px; }.app-content { position:relative; min-width:0; }.card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }.status { display:inline-flex; padding:6px 10px; border-radius:999px; font-size:11px; font-weight:800; }.status.soon{color:#9a5b00;background:#fff0cd}.status.available{color:#06724c;background:#dff8ec}.status.development{color:#6555a5;background:#eeeaff}.platforms{font-size:11px;color:var(--muted);direction:ltr}
.app-card h3 { margin:20px 0 8px; font-size:27px; line-height:1.2; }.app-card p { color:var(--muted); margin:0 0 22px; }.card-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }.disabled-button { color:var(--muted); background:var(--soft); border:1px solid var(--line); padding:11px 15px; border-radius:13px; font-weight:700; font-size:13px; }.text-link { font-size:13px; font-weight:800; color:#3973d6; text-decoration:none; }.store-button { display:inline-flex; align-items:center; gap:9px; border-radius:13px; padding:8px 14px; background:#0a0d13; color:#fff; text-decoration:none; line-height:1.1; direction:ltr; }.store-button small{display:block;font-size:9px;color:#cbd2df}.store-symbol{font-size:18px}
.contact-panel { margin-top:65px; padding:48px 55px; border-radius:30px; display:flex; align-items:center; justify-content:space-between; gap:40px; color:#fff; background:linear-gradient(130deg,#1649a5,#09275f); }.contact-panel .eyebrow{color:#8edfff}.contact-panel p:not(.eyebrow){color:#d6e2f7;margin-bottom:0;}
footer { max-width:1240px; margin:auto; padding:25px 28px 38px; display:flex; justify-content:space-between; gap:20px; color:var(--muted); font-size:12px; border-top:1px solid var(--line); }

@media(max-width:900px){.hero{grid-template-columns:1fr;padding:45px;}.hero-visual{min-height:360px}.app-grid{grid-template-columns:1fr}.app-card.featured{grid-column:auto}.section-heading{align-items:flex-start;flex-direction:column}.contact-panel{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){body:not(.portfolio) main{margin:0;padding:22px;border-radius:0}.topbar{padding:16px}.brand small{display:none}.brand strong{font-size:13px}.site-shell{padding:4px 14px 45px}.hero{min-height:auto;padding:34px 25px;border-radius:25px}.hero-description{font-size:15px}.hero-visual{min-height:310px}.orbit-one{width:310px;height:310px}.orbit-two{width:230px;height:230px}.phone-stack{transform:scale(.82)}.apps-section{padding-top:65px}.app-card,.app-card.featured{grid-template-columns:76px 1fr;padding:21px;gap:16px;min-height:0}.app-icon,.featured .app-icon{width:76px;height:76px;border-radius:20px}.card-top{align-items:flex-start;flex-direction:column}.app-card h3{font-size:22px;margin-top:14px}.app-card p{grid-column:1/-1}.card-actions{grid-column:1/-1}.contact-panel{padding:32px 25px}.filters{width:100%}.filter{flex:1;padding-inline:8px}footer{flex-direction:column;text-align:center}.brand-mark{width:40px;height:40px}}