:root { --p:#1A5FA8;--pd:#0E3F75;--pl:#2B7FD4;--pp:#EBF3FB;--s:#1E7A5C;--sd:#145740;--sl:#27A77D;--sp:#E7F5F0;--a:#E86920;--ap:#FEF0E7;--w:#D4920A;--wp:#FEF7E7;--n50:#F7F8FA;--n100:#EFF1F5;--n200:#DDE1EA;--n400:#9BA3B2;--n600:#5B6478;--n800:#2C3345;--n900:#151C2C;--white:#fff;--r-sm:6px;--r-md:10px;--r-lg:16px;--r-xl:24px;--sh-sm:0 1px 3px rgba(0,0,0,.06);--sh-md:0 4px 14px rgba(0,0,0,.08);--sh-lg:0 12px 40px rgba(0,0,0,.10);--fh:'Cairo',sans-serif;--fb:'IBM Plex Sans Arabic','Cairo',sans-serif;--pad:clamp(20px,6vw,80px) }
.btn-s { background:var(--s);color:#fff;box-shadow:0 2px 10px rgba(30,122,92,.25) }
.btn-s:hover { background:var(--sd);transform:translateY(-1px) }
.btn-op { background:transparent;color:var(--s);border:1.5px solid var(--s) }
.btn-op:hover { background:var(--sp) }
.btn-gh:hover { border-color:var(--s);color:var(--s);background:var(--sp) }
.tag-w { background:var(--wp);color:var(--w);border:1px solid rgba(212,146,10,.15) }
.sec-title span { color:var(--s) }
.bc-inner span { color:var(--s);font-weight:600 }
.mq-item.on { color:var(--s);border-bottom-color:var(--s) }
.page-hero { background:linear-gradient(148deg,#E7F5F0 0%,#F2FAF7 45%,#F0FAF5 100%);padding:72px var(--pad) 60px }
.ph-h1 em { font-style:normal;color:var(--s) }
.pm-mock { background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-lg),0 0 0 1px var(--n200);overflow:hidden }
.pm-bar { background:var(--s);padding:13px 18px;display:flex;align-items:center;justify-content:space-between }
.pm-title { font-family:var(--fh);font-size:13px;font-weight:700;color:#fff }
.pm-dots { display:flex;gap:5px }
.pm-dots i { display:inline-block;width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.4) }
.pm-body { padding:16px }
.pm-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px }
.ps { background:var(--n50);border:1px solid var(--n100);border-radius:var(--r-md);padding:10px 6px;text-align:center }
.ps-val { font-family:var(--fh);font-size:18px;font-weight:800;line-height:1 }
.ps-lbl { font-size:9px;color:var(--n400);margin-top:3px;font-family:var(--fh) }
.cal-wrap { background:var(--n50);border-radius:var(--r-md);padding:10px;margin-bottom:12px }
.cal-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px }
.cal-month { font-family:var(--fh);font-size:11px;font-weight:700;color:var(--n900) }
.cal-grid { display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center }
.cal-dh { font-size:8px;color:var(--n400);font-family:var(--fh);padding:3px 0 }
.cal-d { font-size:9px;font-family:var(--fh);padding:4px 0;border-radius:4px;cursor:default }
.cal-d.has { background:var(--sp);color:var(--s);font-weight:700 }
.cal-d.today { background:var(--s);color:#fff;font-weight:700 }
.cal-d.warn { background:var(--ap);color:var(--a);font-weight:700 }
.upcoming-list { display:flex;flex-direction:column;gap:6px }
.ul-row { display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--r-md);font-size:11px }
.ul-ico { width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0 }
.ul-name { flex:1;font-family:var(--fh);font-weight:600;color:var(--n900) }
.ul-date { font-size:10px;color:var(--n400) }
.ul-badge { font-size:9px;font-weight:700;font-family:var(--fh);padding:2px 8px;border-radius:8px;white-space:nowrap }
.sec-compare { background:var(--n50) }
.compare-grid { display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:48px }
.cmp { background:var(--white);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-md) }
.cmp-head { padding:22px 26px;display:flex;align-items:center;gap:14px }
.cmp-ico { width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0 }
.cmp-ttl { font-family:var(--fh);font-size:18px;font-weight:800 }
.cmp-sub { font-size:11px;opacity:.7;font-family:var(--fh);margin-top:1px }
.cmp-body { padding:20px 26px;display:flex;flex-direction:column;gap:8px }
.cmp-row { display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-radius:var(--r-md);font-size:13px }
.cmp-row i { font-size:14px;margin-top:2px;flex-shrink:0 }
.cmp-num { background:var(--n50);border-radius:var(--r-lg);padding:16px 22px;margin:0 26px 22px;display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:center }
.cmp-n { font-family:var(--fh);font-size:22px;font-weight:800;line-height:1 }
.cmp-nl { font-size:12px;font-weight:600;color:var(--n700);line-height:1.6;margin-top:0 }
.sec-freq { background:var(--white) }
.freq-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:48px }
.fq { background:var(--n50);border:1px solid var(--n200);border-radius:var(--r-xl);padding:24px 18px;text-align:center;transition:all .25s;cursor:default }
.fq:hover { transform:translateY(-4px);box-shadow:var(--sh-md);background:var(--white) }
.fq-ico { width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 16px }
.fq h3 { font-family:var(--fh);font-size:14px;font-weight:800;color:var(--n900);margin-bottom:6px }
.fq p { font-size:11px;color:var(--n600);line-height:1.6;margin-bottom:10px }
.fq-ex { font-size:10px;font-style:italic;color:var(--n400) }
.sec-how { background:var(--n50) }
.how-grid { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-top:48px }
.how-steps { display:flex;flex-direction:column;gap:0 }
.hs-row { display:grid;grid-template-columns:52px 3px 1fr;gap:0 18px;padding-bottom:24px }
.hs-row:last-child { padding-bottom:0 }
.hs-num { width:52px;height:52px;border-radius:50%;border:3px solid var(--s);background:var(--white);display:flex;align-items:center;justify-content:center;font-family:var(--fh);font-size:16px;font-weight:800;color:var(--s);flex-shrink:0;box-shadow:var(--sh-sm) }
.hs-num.done { background:var(--s);color:#fff }
.hs-line { width:3px;background:var(--n200);margin:52px auto 0;border-radius:3px;grid-column:2;grid-row:1/3 }
.hs-row:last-child .hs-line { display:none }
.hs-content { grid-column:3 }
.hs-title { font-family:var(--fh);font-size:15px;font-weight:700;color:var(--n900);margin-bottom:4px }
.hs-desc { font-size:13px;color:var(--n600);line-height:1.7 }
.sec-features { background:var(--white) }
.fc:hover { transform:translateY(-4px);box-shadow:var(--sh-md);border-color:var(--s) }
.sec-builder { background:var(--n50) }
.builder-grid { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-top:48px }
.builder-mock { background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-lg),0 0 0 1px var(--n200);overflow:hidden }
.bm-bar { background:var(--sd);padding:12px 18px;display:flex;align-items:center;gap:12px }
.bm-dots { display:flex;gap:5px }
.bm-dots i { display:inline-block;width:8px;height:8px;border-radius:50% }
.bm-title { font-family:var(--fh);font-size:11px;font-weight:700;color:rgba(255,255,255,.9) }
.bm-body { padding:16px }
.bm-field { margin-bottom:12px }
.bm-label { font-size:10px;font-weight:700;font-family:var(--fh);color:var(--n600);margin-bottom:5px;display:block }
.bm-input { width:100%;background:var(--n50);border:1px solid var(--n200);border-radius:8px;padding:8px 12px;font-size:11px;color:var(--n800);font-family:var(--fh) }
.bm-input.active { border-color:var(--s);background:var(--white) }
.bm-freq-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:12px }
.bm-freq { font-size:10px;font-weight:700;font-family:var(--fh);padding:6px;border-radius:8px;border:1.5px solid var(--n200);background:var(--white);color:var(--n600);text-align:center;cursor:pointer }
.bm-freq.sel { background:var(--s);color:#fff;border-color:var(--s) }
.bm-checklist { display:flex;flex-direction:column;gap:5px;margin-bottom:12px }
.bm-cl { display:flex;align-items:center;gap:8px;font-size:10px;padding:6px 8px;background:var(--n50);border-radius:6px }
.bm-cl-ico { width:14px;height:14px;border-radius:3px;background:var(--s);display:flex;align-items:center;justify-content:center;flex-shrink:0 }
.bm-submit { width:100%;background:var(--s);color:#fff;border:none;border-radius:10px;padding:10px;font-family:var(--fh);font-size:12px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px }
.sec-stats { background:var(--white) }
.stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px }
.sg { background:var(--n50);border-radius:var(--r-xl);padding:28px 22px;text-align:center;border:1px solid var(--n200);box-shadow:var(--sh-sm);transition:all .25s }
.sg:hover { transform:translateY(-3px);box-shadow:var(--sh-md);background:var(--white) }
.sg-num { font-family:var(--fh);font-size:40px;font-weight:900;line-height:1;margin-bottom:6px }
.sg { text-align:right }
.sg h4 { font-family:var(--fh);font-size:17px;font-weight:800;color:var(--n900);line-height:1.45;margin:0 0 8px;position:relative;padding-top:14px }
.sg h4::before { content:'';position:absolute;top:0;right:0;width:32px;height:3px;border-radius:3px;background:var(--s) }
.sg p { font-size:13px;color:var(--n600);line-height:1.75;margin:0 }
.sec-sectors { background:var(--white) }
.sectors-row { display:flex;gap:12px;flex-wrap:wrap;margin-top:36px }
.st { display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:var(--n50);border:1px solid var(--n200);border-radius:var(--r-lg);font-family:var(--fh);font-size:13px;font-weight:600;color:var(--n800);transition:all .2s }
.st:hover { border-color:var(--s);color:var(--s);transform:translateY(-2px) }
.st i { font-size:16px }
.sec-faq { background:var(--n50) }
.faq-q:hover { background:var(--sp) }
.faq-q.open { color:var(--s);background:var(--sp) }
.faq-q i { font-size:12px;color:var(--s);transition:transform .3s;flex-shrink:0 }
.faq-a { display:none;padding:0 20px 16px;font-size:13px;color:var(--n600);line-height:1.75;background:var(--sp) }
.sec-more { background:var(--white) }
.mg { background:var(--n50);border:1px solid var(--n200);border-radius:var(--r-lg);padding:20px;text-align:center;transition:all .25s;display:block;color:inherit }
.mg:hover { border-color:var(--s);transform:translateY(-3px);box-shadow:var(--sh-md) }
.sec-cta { background:linear-gradient(145deg,var(--s) 0%,var(--sd) 55%,#0d3d2c 100%);text-align:center;padding:80px var(--pad) }

@media(max-width:1100px) {
  .ph-inner,.compare-grid,.how-grid,.builder-grid { grid-template-columns:1fr }
  .pm-mock { display:none }
  .freq-grid { grid-template-columns:repeat(3,1fr) }
  .feat-grid,.reports-grid { grid-template-columns:repeat(2,1fr) }
  .stats-grid { grid-template-columns:repeat(2,1fr) }
}

@media(max-width:768px) {
  .freq-grid { grid-template-columns:repeat(2,1fr) }
  .feat-grid,.reports-grid { grid-template-columns:1fr }
  .stats-grid,.more-grid { grid-template-columns:1fr 1fr }
}