/* ========= Tokens & Safe Reset (Scoped) ========= */
    #mq-arabic-suite{
      --ink:#0f2333; --muted:#5f7281;
      --navy:#0e4f78; --sky:#0a6aa1;
      --gold:#f5c76d; --gold-2:#e7ad38;
      --success:#11b49d;
      --bg1:#f2f8ff; --bg2:#eef6ff;
      --ring:rgba(15,35,51,.14);
      font-family:"Noto Kufi Arabic","Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
      color:var(--ink); position:relative; isolation:isolate;
    }
    /* Full-bleed soft background */
    #mq-arabic-suite::before{
      content:""; position:absolute; inset:0; left:50%; transform:translateX(-50%); width:100vw; z-index:-1;
      background:
        radial-gradient(420px 420px at -6% 10%, rgba(245,199,109,.16), transparent 62%),
        radial-gradient(380px 380px at 108% 85%, rgba(231,173,56,.14), transparent 64%),
        linear-gradient(180deg,var(--bg1),var(--bg2));
      border-top:1px solid rgba(15,35,51,.08);
      border-bottom:1px solid rgba(15,35,51,.08);
    }
    #mq-arabic-suite, #mq-arabic-suite *{ box-sizing:border-box }

    /* ========= Generic layout ========= */
    #mq-arabic-suite .inner{ max-width:1200px; margin:0 auto;
      padding:clamp(20px,4vw,56px) clamp(16px,3vw,28px) }
    #mq-arabic-suite h2{
      margin:0 0 8px; line-height:1.1; font-weight:900;
      font-size:clamp(24px,3.2vw,40px); letter-spacing:.2px;
      background:linear-gradient(180deg,var(--navy),var(--sky));
      -webkit-background-clip:text; background-clip:text; color:transparent;
      text-wrap:balance;
    }
    #mq-arabic-suite .lead{ color:var(--muted); line-height:1.85; max-width:80ch; margin:0 0 18px; text-wrap:pretty }

    /* Separator line used above grids */
    #mq-arabic-suite .sep{
      height:1px; margin:clamp(12px,1.8vw,16px) 0;
      background:
        linear-gradient(90deg, transparent, rgba(14,79,120,.25), rgba(10,106,161,.25), transparent),
        linear-gradient(90deg, transparent 15%, rgba(245,199,109,.35) 50%, transparent 85%);
      border-radius:2px;
    }

    /* ========= Grid patterns ========= */
    #mq-arabic-suite .grid{
      display:grid; gap:clamp(14px,2vw,20px);
      grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    }
    #mq-arabic-suite .blk{ padding:2px }
    #mq-arabic-suite .blk h3{
      margin:0 0 8px; font-weight:900; font-size:clamp(16px,1.5vw,19px);
      color:var(--navy); position:relative; padding-left:12px;
    }
    #mq-arabic-suite .blk h3::before{
      content:""; position:absolute; left:0; top:.28em; bottom:.28em; width:5px; border-radius:5px;
      background:linear-gradient(180deg,var(--gold),var(--gold-2)); box-shadow:0 0 0 1px rgba(245,199,109,.16)
    }
    #mq-arabic-suite .blk p{ margin:0; color:var(--ink); line-height:1.85 }

    /* Bulleted list with success dots */
    #mq-arabic-suite ul.bullets{ list-style:none; margin:12px 0 0; padding:0; columns:1; column-gap:26px }
    @media(min-width:860px){ #mq-arabic-suite ul.bullets{ columns:2 } }
    #mq-arabic-suite ul.bullets li{
      break-inside:avoid; position:relative; padding-left:26px; margin:10px 0; line-height:1.85; color:var(--ink)
    }
    #mq-arabic-suite ul.bullets li::before{
      content:""; position:absolute; left:2px; top:.88em; width:12px; height:12px; border-radius:50%;
      background:var(--success); box-shadow:0 0 0 6px rgba(10,106,161,.10)
    }

    /* Numbered card steps */
    #mq-arabic-suite .step{
      background:#fff; border:1px solid rgba(15,35,51,.08); border-radius:14px; padding:16px 16px 14px;
    }
    #mq-arabic-suite .num{
      display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px;
      background:linear-gradient(180deg,var(--gold),var(--gold-2)); color:#2d2d2d; font-weight:900; margin-bottom:10px;
    }
    #mq-arabic-suite .step h3{ margin:0 0 6px; font-weight:900; color:var(--navy); font-size:18px }
    #mq-arabic-suite .step p, #mq-arabic-suite .step ul{ margin:0; color:var(--muted); line-height:1.8 }

    /* Emphasis + CTA */
    #mq-arabic-suite .emph{
      margin:clamp(14px,2.4vw,22px) 0 0; font-weight:800; line-height:1.8; color:var(--navy);
      background:linear-gradient(180deg, rgba(245,199,109,.17), transparent);
      border-top:1px dashed rgba(231,173,56,.35); padding-top:clamp(12px,1.6vw,16px); text-wrap:pretty;
    }
    #mq-arabic-suite .emph strong{ color:var(--sky) }
    #mq-arabic-suite .cta{ margin-top:clamp(10px,2vw,18px) }
    #mq-arabic-suite .btn{
      display:inline-block; text-decoration:none; cursor:pointer; user-select:none;
      padding:12px 18px; border-radius:12px; font-weight:900; line-height:1;
      background:linear-gradient(180deg,var(--sky),var(--navy)); color:#fff;
      border:1px solid rgba(10,106,161,.35);
      box-shadow:none; transition:transform .15s ease, filter .15s ease;
    }
    #mq-arabic-suite .btn:hover{ transform:translateY(-1px); filter:saturate(1.05) }

    /* Spacing between subsections */
    #mq-arabic-suite .block{ margin-top:clamp(24px,4vw,46px) }
    /* ==== Simple items (override former card styles) ==== */
#mq-arabic-suite #how-it-works .steps{
  counter-reset: step;
  display:grid; gap:16px;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  padding:0; margin:0; list-style:none;
}
#mq-arabic-suite #how-it-works .steps li{
  background:transparent; border:none; border-radius:0; padding:0 0 12px 0;
  position:relative;
  border-bottom:1px dashed rgba(14,79,120,.22);
}
#mq-arabic-suite #how-it-works .steps li:last-child{ border-bottom:none }

#mq-arabic-suite #how-it-works .num{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:9px;
  background:linear-gradient(180deg,var(--gold),var(--gold-2));
  color:#2d2d2d; font-weight:900; margin:0 8px 6px 0;
}
#mq-arabic-suite #how-it-works h3{
  display:inline; margin:0; padding:0; font-size:18px; color:var(--navy); font-weight:900
}
#mq-arabic-suite #how-it-works p{ margin:8px 0 0; color:var(--muted); line-height:1.85 }
#mq-arabic-suite #how-it-works ul{ margin:8px 0 0 0; padding-left:18px }
#mq-arabic-suite #how-it-works ul li{ border:0; padding:0; list-style:disc; color:var(--ink) }

/* tighter on small screens */
@media (max-width:420px){
  #mq-arabic-suite #how-it-works .steps{ grid-template-columns:1fr; gap:12px }
}