/* ━━━ حَلْقة · أُسُسُ التَصميم ━━━
   مَوضِعٌ واحِدٌ لِلَونٍ ومَسافةٍ وخَطّ. الصَفحةُ التَعريفيّةُ والغُرفةُ
   تَقرَآنِ مِنه، فَلا يَنحَرِفُ أَحَدُهُما عَنِ الآخَر. */
:root{
  /* أَلوانُ الشِعار (٢٧ أُكتوبَر): الكُحليُّ حَلْقَتُهُ ومُعَلِّمُه، والأَخضَرُ والفَيروزِيُّ والبُرتُقاليُّ صَفُّه.
     والكُحليُّ الداكِنُ (navy-900) يَبقى لِلأَسطُحِ والنَصّ — الشِعارُ أَفتَحُ مِن أَن يُقرَأَ عَلَيهِ نَصٌّ طَويل */
  --navy:#06366F; --navy-900:#0B2545; --navy-700:#0E2F5C; --navy-300:#6E8CB0;
  --green:#14A86A; --teal:#0BA18F; --blue:#0176BA; --amber:#E8B352; --red:#DC2626;
  --ink:#0F172A; --body:#475569; --mut:#7A8699;
  --line:#E3E8EF; --soft:#F5F7FA; --card:#FFFFFF; --bg:#FFFFFF;
  --r-s:10px; --r:16px; --r-l:24px; --r-xl:32px;
  --sh-s:0 1px 2px rgba(11,37,69,.06), 0 1px 3px rgba(11,37,69,.04);
  --sh:0 4px 16px rgba(11,37,69,.07), 0 1px 3px rgba(11,37,69,.05);
  --sh-l:0 18px 50px rgba(11,37,69,.13), 0 4px 12px rgba(11,37,69,.06);
  --max:1180px;
  --ff:"IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--ff);color:var(--body);background:var(--bg);
     font-size:17px;line-height:1.85;-webkit-font-smoothing:antialiased;
     overflow-x:hidden}
h1,h2,h3,h4{color:var(--ink);line-height:1.35;margin:0;font-weight:800;letter-spacing:-.02em}
p{margin:0}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%;display:block}
button{font-family:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
@media(min-width:768px){.wrap{padding:0 32px}}