/* ==========================================================================
   main.css — الأساسيات المشتركة بين جميع الصفحات
   متغيرات الألوان · الخطوط · Reset · Container · الحركات المشتركة
   ========================================================================== */

/* ---------- متغيرات الهوية (مصدرها الهيدر/الفوتر المعتمد) ---------- */
:root{
  --gold:#d9aa4f;
  --gold-light:#f3ca70;
  --black:#060606;
  --dark:#0b0c0d;
  --dark-2:#111314;
  --white:#fff;
  --muted:#b9b5ad;
  --line:rgba(217,170,79,.42);
  --line-soft:rgba(255,255,255,.08);
  --container:1240px;
  --font-main:"Alexandria",sans-serif;
}

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

html{scroll-behavior:smooth}

body{
  min-height:100vh;
  font-family:var(--font-main);
  color:var(--white);
  overflow-x:hidden;
}

body.menu-open{overflow:hidden}

a{color:inherit;text-decoration:none}

img{display:block;width:100%}

button,input,textarea,select{font:inherit}

button{cursor:pointer}

/* ---------- الحاوية العامة (مطابقة لحاوية الهيدر والفوتر) ---------- */
.container{
  width:min(calc(100% - 36px),var(--container));
  margin:auto;
}

/* --------------------------------------------------------------------------
   عزل الهيدر والفوتر عن متغيرات الصفحات
   كل صفحة تعرّف متغيراتها على body.page-x، وهذه القاعدة تضمن بقاء
   الهيدر والفوتر وقائمة الجوال بألوان الهوية الموحدة في كل الصفحات.
   -------------------------------------------------------------------------- */
.site-header,
.mobile-overlay,
.mobile-menu,
.site-footer,
.mobile-footer,
.mobile-bottom-nav,
.whatsapp-float,
.skip-link{
  --gold:#d9aa4f;
  --gold-light:#f3ca70;
  --black:#060606;
  --dark:#0b0c0d;
  --dark-2:#111314;
  --white:#fff;
  --muted:#b9b5ad;
  --line:rgba(217,170,79,.42);
  --line-soft:rgba(255,255,255,.08);
  --container:1240px;
  color:var(--white);
  line-height:normal;
}

/* ---------- تخطي إلى المحتوى (Accessibility) ---------- */
.skip-link{
  position:absolute;
  right:-9999px;
  top:0;
  z-index:2000;
  padding:12px 20px;
  color:#171208;
  background:var(--gold-light);
  font-size:13px;
}

.skip-link:focus{right:12px;top:12px}

/* نص مخفي بصريًا ومتاح لقارئات الشاشة */
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

:where(a,button,input,textarea,select):focus-visible{
  outline:2px solid var(--gold-light);
  outline-offset:2px;
}

/* ---------- حركة الظهور عند التمرير (مشتركة) ---------- */
.reveal{
  opacity:0;
  transform:translateY(25px);
  transition:opacity .7s ease,transform .7s ease;
}

.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}