/* أبعاد — الموقع التعريفي. الألوان والقواعد منقولةٌ من التصميم كما هي. */
:root{--ink:#0f0f0f;--ink2:#3d3d3d;--muted:#6f6f70;--bg:#fbfbfb;--bg2:#f2f3f4;--card:#ffffff;--line:#e7e8ea;--peach:#f6ded0;--peach-ink:#a8552a;--wa:#1f8a4c}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--peach-ink)}
button,input,select,textarea{font-family:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:8px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
[data-d="desk"]{display:none}
@media (min-width:680px){[data-g="cards"],[data-g="types"],[data-g="pillars"]{grid-template-columns:repeat(2,1fr)!important}}
@media (min-width:960px){
  [data-d="desk"]{display:flex!important}
  [data-d="burger"]{display:none!important}
  [data-g="split"]{grid-template-columns:1fr 1fr!important}
  [data-g="split-v"]{grid-template-columns:.85fr 1.15fr!important}
  [data-g="split-fin"]{grid-template-columns:minmax(0,.66fr) minmax(0,1.6fr)!important;gap:36px!important}
  [data-fin-img]{margin-inline-end:calc(16px - clamp(28px,5vw,64px));order:0!important}
  [data-g="cards"]{grid-template-columns:repeat(3,1fr)!important}
  [data-g="types"],[data-g="pillars"]{grid-template-columns:repeat(4,1fr)!important}
  [data-g="detail"]{grid-template-columns:.9fr 1.1fr!important}
  [data-g="detail-wide"]{grid-template-columns:.7fr 1.3fr!important}
  [data-g="detail-xwide"]{grid-template-columns:.62fr 1.38fr!important}
  [data-g="contact"]{grid-template-columns:.8fr 1.2fr!important}
}

/* الجوّال — أُضيفت بعد فحص Safari/WebKit */
/* بطاقاتُ «الملخّص المالي» عمودٌ واحد تحت 520px: المبالغ (nowrap) كانت تخرج من بطاقتها وتُحدث فيضًا أفقيًّا.
   وعلى 320px لا يتّسع المبلغُ وأيقونتُه سطرًا واحدًا، فتنزل «ر.ع» تحته كما في البطاقات السفلى */
@media (max-width:519px){
  [data-fin-img] > [role="img"]{grid-template-columns:minmax(0,1fr)!important}
  [data-fin-img] > [role="img"] [dir="ltr"]{white-space:normal!important}
}
@media (max-width:959px){
  /* القائمة داخل رأسٍ ملتصق: إن طالت عن الشاشة تتمرّر هي، وإلّا بقي آخرُ أزرارها خارج الشاشة */
  [data-menu]{max-height:calc(100vh - 77px);max-height:calc(100dvh - 77px);overflow-y:auto;overscroll-behavior:contain}
  /* أقلّ من 16px يجعل Safari على iOS يكبّر الصفحة عند التركيز */
  [data-contact-form] input,[data-contact-form] select,[data-contact-form] textarea{font-size:16px!important}
}

/* حالاتُ المرور — كانت `style-hover` في التصميم */
.hv-pill:hover{background:var(--bg2)!important;color:var(--ink)!important}
.hv-bg2:hover{background:var(--bg2)!important}
.hv-border-ink:hover{border-color:var(--ink)!important}
.hv-invert:hover{background:var(--ink)!important;color:#fff!important}
.hv-white:hover{color:#fff!important}