/* ============================================================
   شمس · الأساس
   الرموز التصميمية، إعادة الضبط، التايبوغرافي
   ============================================================ */

:root {
  /* ---- الرمال: أسطح الصفحة ---- */
  --sand-50:  #fcfaf6;
  --sand-100: #f7f2ea;
  --sand-200: #efe6d8;
  --sand-300: #e2d5c0;
  --sand-400: #cdbb9f;

  /* ---- الأعماق: النص والأسطح الداكنة ---- */
  --deep-900: #06222a;
  --deep-800: #0a2f39;
  --deep-700: #10404c;
  --deep-600: #1b5765;

  /* ---- الفيروزي: اللون الأساسي ---- */
  --teal-800: #08525b;
  --teal-700: #0a6771;
  --teal-600: #0d818d;
  --teal-500: #1298a5;
  --teal-300: #7fcbd3;
  --teal-200: #aadfe4;
  --teal-100: #d9f0f2;
  --teal-50:  #eef9fa;

  /* ---- الذهبي: لون التمييز ---- */
  --gold-700: #8f6521;
  --gold-600: #b3812f;
  --gold-500: #cb9c48;
  --gold-300: #e5c68c;
  --gold-100: #f6ecd8;

  /* ---- أدوار الألوان ---- */
  --bg:          var(--sand-50);
  --bg-alt:      var(--sand-100);
  --surface:     #ffffff;
  --line:        rgb(10 47 57 / 0.10);
  --line-soft:   rgb(10 47 57 / 0.06);
  --line-strong: rgb(10 47 57 / 0.18);

  --ink:      var(--deep-900);
  --ink-soft: #3c5760;
  --ink-mute: #6b848c;
  --ink-faint:#93a7ad;

  --brand:      var(--teal-600);
  --brand-deep: var(--teal-800);
  --accent:     var(--gold-600);

  /* ---- الإيقاع ---- */
  --wrap:        73.75rem; /* 1180px */
  --wrap-mid:    58rem;
  --wrap-narrow: 45rem;
  --gutter: clamp(1.25rem, 5vw, 3.5rem);
  --header-h: 4.75rem;

  --section-y: clamp(4rem, 9vw, 7.5rem);

  /* ---- الأنصاف والظلال ---- */
  --r-xs: 0.5rem;
  --r-sm: 0.75rem;
  --r:    1.125rem;
  --r-lg: 1.75rem;
  --r-pill: 62.5rem;

  --shadow-xs: 0 1px 2px rgb(6 34 42 / 0.05);
  --shadow-sm: 0 2px 6px rgb(6 34 42 / 0.05), 0 1px 2px rgb(6 34 42 / 0.04);
  --shadow:    0 12px 32px -14px rgb(6 34 42 / 0.20), 0 2px 6px rgb(6 34 42 / 0.05);
  --shadow-lg: 0 30px 60px -28px rgb(6 34 42 / 0.32), 0 4px 12px rgb(6 34 42 / 0.06);

  /* ---- المنحنيات ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-io:  cubic-bezier(0.65, 0, 0.35, 1);

  /* ---- الخطوط ---- */
  --font-display: 'Alexandria', 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --font-body: 'IBM Plex Sans Arabic', 'Alexandria', system-ui, sans-serif;

  color-scheme: light;
}

*,
*::before,
*::after { box-sizing: border-box; }

/* سمة hidden لا تتغلّب وحدها على display المضبوط في القواعد التالية */
[hidden] { display: none !important; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 1.5rem);
}

body {
  margin: 0;
  min-height: 100svh;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  font-weight: 400;
  line-height: 1.85;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* حين تُفتح قائمة الجوال نمنع تمرير الصفحة خلفها */
body.is-locked { overflow: hidden; }

img, svg, video { max-width: 100%; display: block; }
img { height: auto; }

a {
  color: var(--teal-700);
  text-decoration-color: rgb(13 129 141 / 0.35);
  text-underline-offset: 0.25em;
  transition: color 0.2s var(--ease-out), text-decoration-color 0.2s var(--ease-out);
}
a:hover { color: var(--teal-500); text-decoration-color: currentColor; }

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

/* الأرقام اللاتينية داخل نصّ عربي: تبقى ككتلة واحدة ولا تنكسر بين سطرين */
[dir="ltr"] { unicode-bidi: isolate; }
a[dir="ltr"], address[dir="ltr"] { white-space: nowrap; }

/* ---- العناوين ---- */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.005em;
  margin: 0;
  text-wrap: balance;
}

h1 { font-size: clamp(2rem, 1.3rem + 3.1vw, 3.7rem); font-weight: 400; line-height: 1.3; }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.85vw, 2.6rem); font-weight: 400; line-height: 1.34; }
h3 { font-size: clamp(1.2rem, 1.06rem + 0.6vw, 1.5rem); }
h4 { font-size: 1.0625rem; font-weight: 500; }

p { margin: 0; text-wrap: pretty; }

::selection {
  background: var(--teal-200);
  color: var(--deep-900);
}

/* ---- التركيز ---- */
:focus-visible {
  outline: 2px solid var(--teal-600);
  outline-offset: 3px;
  border-radius: var(--r-xs);
}
:focus:not(:focus-visible) { outline: none; }

/* ---- رابط التخطّي ---- */
.skip-link {
  position: fixed;
  inset-block-start: 0.75rem;
  inset-inline-start: 0.75rem;
  z-index: 200;
  padding: 0.7rem 1.15rem;
  border-radius: var(--r-pill);
  background: var(--deep-900);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 0.25s var(--ease-out);
}
.skip-link:focus-visible { transform: translateY(0); color: #fff; }

/* ---- تقليل الحركة ---- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---- للطباعة ---- */
@media print {
  .site-header, .site-footer, .to-top, .hero-scroll { display: none !important; }
  body { background: #fff; }
  .reveal { opacity: 1 !important; transform: none !important; }
}
