/*
  نظام هوية «بصمة» — المصدر الوحيد للألوان والمسافات.

  الألوان مستخرجة من بكسل ملفات الشعار نفسها لا بالنظر، فهي مطابقة تماماً.
  أي صفحة تستورد هذا الملف تبقى متوافقة مع الشعار حتى لو تغيّر لاحقاً.
*/

:root{
  /* الأساسية — من basma-terracotta.png و basma-primary.png */
  --brand:          #A9481F;   /* الطيني: الأزرار والتأكيد والروابط */
  --brand-deep:     #8A3A18;   /* أغمق: عند المرور والضغط */
  --cream:          #EFE3D2;   /* خلفيات الأقسام */
  --cream-soft:     #F7F1E7;   /* كريمي أفتح للتدرّج بين الأقسام */
  --tan:            #E4CBB5;   /* لون البصمة المائية — للزخرفة فقط */
  --ink:            #231A13;   /* النصوص والوضع الداكن */
  --ink-soft:       #5B4A3C;   /* نص ثانوي */
  --white:          #FFFFFF;

  /* واتساب — لون رسمي، لا يُغيَّر */
  --whatsapp:       #25D366;

  /* الخطوط — نظام من اثنين.
     El Messiri هو خط الشعار نفسه، فيُستعمل في العناوين ليتوحّد الرأس مع
     الهوية. لكنه خط عرض، والفقرات الطويلة به أتعب للقراءة — فالنصوص بـ Cairo.
     تنبيه: أقصى وزن في El Messiri هو 700 لا 900، فلا تطلب أثقل منه. */
  --font-display:   'El Messiri', 'Cairo', system-ui, sans-serif;
  --font-body:      'Cairo', system-ui, 'Segoe UI', Tahoma, sans-serif;

  --radius:         14px;
  --radius-lg:      22px;
  --maxw:           1100px;

  /* الحد الأدنى لمساحة اللمس على الجوال. الورش تتصفّح بالجوال أساساً،
     وأي زر أصغر من هذا يُفقد نقرات فعلية. */
  --tap:            48px;
}

*{box-sizing:border-box;margin:0;padding:0}

html{scroll-behavior:smooth}

body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.display{
  font-family:var(--font-display);
  font-weight:700;          /* سقف El Messiri */
  line-height:1.4;
}

/* البصمة كنسيج خلفي خفيف — الموتيف الذي يوحّد الهوية دون أن يصرخ.

   تستعمل basma-fingerprint.png لا basma-icon.png: الأيقونة خلفيتها مصمتة،
   فتظهر كمربّع ضخم عند التخفيف بدل أن تظهر البصمة وحدها. الملف المستخرج
   شفاف تماماً ولا يحمل إلا الخطوط. */
.fingerprint-bg{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.fingerprint-bg::before{
  content:"";
  position:absolute;
  inset-block:-14%;
  inset-inline-start:-6%;
  width:min(460px,52%);
  background:url('basma-fingerprint.png') no-repeat center/contain;
  opacity:.45;
  pointer-events:none;
  z-index:-1;
}
@media(max-width:720px){
  .fingerprint-bg::before{width:min(300px,72%);opacity:.3}
}

a{color:inherit}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:var(--tap);
  padding:0 26px;
  border-radius:var(--radius);
  font-family:inherit;
  font-size:16px;
  font-weight:700;
  text-decoration:none;
  border:0;
  cursor:pointer;
  transition:background .18s,transform .1s;
}
.btn:active{transform:translateY(1px)}

.btn-wa{background:var(--whatsapp);color:#06301A}
.btn-wa:hover{background:#1FBA59}

.btn-brand{background:var(--brand);color:var(--white)}
.btn-brand:hover{background:var(--brand-deep)}

.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--cream)}