body{font-family: 'Tahoma', Arial, sans-serif; background:#f5f0f6;}
  .container-flow{max-width:1200px; margin:40px auto;}
  .section-box{background:#fff; border-radius:12px; padding:30px; box-shadow:0 2px 8px rgba(0,0,0,0.03); margin-bottom:24px; position:relative;}
  .section-title{font-weight:700; color:#2196f3; letter-spacing:1px;}
  .flow-row{display:flex; align-items:center; gap:20px; justify-content:flex-start; flex-wrap:nowrap; overflow:auto; padding:10px 0;}
  .flow-card{min-width:240px; border:2px solid #e6d9e8; border-radius:8px; padding:18px; background:#fff; display:flex; gap:12px; align-items:center; box-shadow:none;}
  .flow-card .icon{width:40px; height:40px; border-radius:6px; background:#f3e9f5; display:flex; align-items:center; justify-content:center; color:#6b2b72; font-weight:700;}
  .arrow{width:1px; height:2px; background:linear-gradient(to left, transparent, #4fb6c9); position:relative;}
  .arrow:after{content:'➜'; position:absolute; right:6px; top:-10px; color:#4fb6c9;}
  /* colored themes for rows */
  .theme-blue .flow-card{border-color:#9de0eb;}
  .theme-blue .arrow{background:linear-gradient(to left, transparent, #4fb6c9);}
  .theme-purple .flow-card{border-color:#d9cfe0;}
  .theme-purple .arrow{background:linear-gradient(to left, transparent, #6b2b72);}
  .theme-pink .flow-card{border-color:#f6c1d3;}
  .theme-pink .arrow{background:linear-gradient(to left, transparent, #f06292);}
  /* large title */
  .page-title{text-align:center; font-size:36px; color:#2173c2; margin-bottom:18px; font-weight:800;}
  /* responsive */
  @media (max-width: 767px) {
    .flow-card{min-width:200px;}
    .page-title{font-size:28px;}
  }



  :root{--brand:#f4b400;--dark:#0b1320}
body{font-family: 'Noto Kufi Arabic', sans-serif;background:#fff;color:var(--dark)}
.hero{padding:60px 15px}
.hero .title{font-size:26px;font-weight:700;margin-bottom:6px}
.hero .lead{color:#666;margin-bottom:28px}
.feature-list{max-width:700px}
.feature-item{display:flex;align-items:center;padding:14px 0;border-top:2px dotted #d9d9d9}
.feature-item:first-child{border-top:0}
.feature-item .icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#eaf3ff;color:#0b7bf3;margin-left:12px}
.feature-item .text{flex:1}
.feature-item .text .h{font-weight:600}
/* footer */
.site-footer{background:var(--brand);color:#0b1320;padding:36px 15px}
.metrics{display:flex;gap:1px;flex-wrap:wrap}
.metric{flex:1;padding:20px;border-left:1px solid rgba(11,19,32,0.06);min-width:180px}
.metric .num{font-size:28px;font-weight:700}
.metric .label{font-size:14px;color:rgba(11,19,32,0.65);margin-top:6px}
@media (max-width:768px){
.hero{padding:30px 12px}
.title{font-size:20px}
.metric{min-width:100%}
}