/* ==========================================================================
   رِواق | RIWAQ — css/typography.css
   النظام التيبوغرافي التحريري العربي: الخطوط، المقاييس، القواعد الصارمة
   ========================================================================== */

/* --------------------------------------------------------------------------
   استيراد الخطوط التحريرية المعتمدة من Google Fonts
   -------------------------------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Aref+Ruqaa:wght@400;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,600&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600&family=Reem+Kufi:wght@400;500;600&family=Space+Mono:wght@400;700&display=swap");

/* --------------------------------------------------------------------------
   القواعد العامة للطباعة العربية (Arabic Typographic Discipline)
   -------------------------------------------------------------------------- */

/* حظر تباعد الحروف (letter-spacing) تمامًا على النص العربي للحفاظ على سلامة الاتصال الحرفي */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
blockquote,
a,
li,
td,
th {
  letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   العناوين الرئيسية (Main Titles) — Aref Ruqaa
   -------------------------------------------------------------------------- */

h1,
.editorial-hero-title {
  font-family: var(--font-heading);
  font-size: var(--fs-hero);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  color: var(--text-primary);
  margin-bottom: var(--space-md);
}

.editorial-page-title {
  font-family: var(--font-heading);
  font-size: var(--fs-page-title);
  font-weight: var(--fw-bold);
  line-height: 1.25;
  color: var(--text-primary);
  margin-bottom: var(--space-md);
}

/* --------------------------------------------------------------------------
   العناوين الفرعية وأسماء الأقسام (Subheadings) — Reem Kufi
   -------------------------------------------------------------------------- */

h2,
.editorial-section-title {
  font-family: var(--font-subheading);
  font-size: var(--fs-section-title);
  font-weight: var(--fw-semibold);
  line-height: 1.35;
  color: var(--text-primary);
  margin-bottom: var(--space-sm);
}

h3,
.editorial-subsection {
  font-family: var(--font-subheading);
  font-size: var(--fs-subsection);
  font-weight: var(--fw-medium);
  line-height: var(--lh-subheading);
  color: var(--text-primary);
  margin-bottom: var(--space-xs);
}

h4,
h5,
h6 {
  font-family: var(--font-subheading);
  font-size: var(--fs-body);
  font-weight: var(--fw-medium);
  line-height: var(--lh-subheading);
  color: var(--text-primary);
}

/* --------------------------------------------------------------------------
   متون النصوص والفقرات التحريرية (Body Copy) — IBM Plex Sans Arabic
   -------------------------------------------------------------------------- */

p,
.editorial-body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-normal);
  line-height: var(--lh-body);
  color: var(--text-secondary);
}

/* الفقرة الافتتاحية للمقالات والأعداد */
.editorial-lead {
  font-family: var(--font-body);
  font-size: var(--fs-lead);
  font-weight: var(--fw-normal);
  line-height: 1.75;
  color: var(--text-primary);
}

/* --------------------------------------------------------------------------
   التسميات التوثيقية والترميزات الفنية (Metadata & Labels) — Space Mono
   -------------------------------------------------------------------------- */

.editorial-label,
.editorial-tag,
.project-meta-label {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: var(--fw-bold);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent-clay);
  display: inline-block;
}

/* النصوص اللاتينية الوظيفية فقط يُسمح لها بالوزن الخفيف */
:lang(en),
[dir="ltr"],
.font-latin-light {
  font-weight: var(--fw-light);
}

/* --------------------------------------------------------------------------
   الأرقام المعمارية والإحصاءات العريضة (Numerics) — Cormorant Garamond
   -------------------------------------------------------------------------- */

.editorial-numeric,
.stat-number,
.timeline-number,
.counter-value {
  font-family: var(--font-numeric);
  font-size: var(--fs-numeric-display);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  color: var(--text-primary);
  font-variant-numeric: tabular-nums lining-nums;
  direction: ltr;
  display: inline-block;
}

.editorial-numeric-hero {
  font-family: var(--font-numeric);
  font-size: var(--fs-numeric-hero);
  font-weight: var(--fw-medium);
  line-height: 1.1;
  color: var(--accent-warm);
  font-variant-numeric: tabular-nums lining-nums;
  direction: ltr;
  display: inline-block;
}

/* --------------------------------------------------------------------------
   الاقتباسات المسحوبة التحريرية (Editorial Pull-Quotes)
   -------------------------------------------------------------------------- */

.pull-quote {
  font-family: var(--font-heading);
  font-size: var(--fs-section-title);
  font-weight: var(--fw-normal);
  line-height: 1.45;
  color: var(--text-primary);
  position: relative;
  padding-right: var(--space-lg);
  margin-top: var(--space-xl);
  margin-bottom: var(--space-xl);
  border-right: 2px solid var(--accent-warm);
}

.pull-quote cite {
  display: block;
  font-family: var(--font-subheading);
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
  font-style: normal;
  color: var(--text-secondary);
  margin-top: var(--space-sm);
}