@import url("https://fonts.googleapis.com/css2?family=Aref+Ruqaa:wght@400;700&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600&family=Playfair+Display:wght@400;500;700;900&family=Space+Grotesk:wght@400;500;700&display=swap");

/* منع letter-spacing على العربي */
body, h1, h2, h3, h4, h5, h6, p, span, blockquote, a, li, td, th {
  letter-spacing: 0;
}

/* =========================================
   العناوين — Editorial Contrast
   ========================================= */

/* H1 العربي — Aref Ruqaa */
h1, .editorial-hero-title {
  font-family: var(--font-arabic);
  font-size: var(--fs-hero);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  color: var(--charcoal);
  margin-bottom: var(--space-md);
}

/* H1 لاتيني — Playfair Display */
h1.editorial-hero-title--latin,
.editorial-hero-title--latin {
  font-family: var(--font-display);
  font-weight: var(--fw-black);
}

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

h2, .editorial-section-title {
  font-family: var(--font-arabic);
  font-size: var(--fs-section);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  color: var(--charcoal);
  margin-bottom: var(--space-sm);
}

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

h4, h5, h6 {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  color: var(--charcoal);
}

/* =========================================
   النصوص
   ========================================= */

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(--graphite);
}

.editorial-lead {
  font-family: var(--font-body);
  font-size: var(--fs-lead);
  font-weight: var(--fw-normal);
  line-height: 1.7;
  color: var(--charcoal);
}

/* Labels صغيرة — Space Grotesk */
.editorial-label, .eyebrow, .editorial-tag {
  font-family: var(--font-numeric);
  font-size: var(--fs-label);
  font-weight: var(--fw-bold);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  display: inline-block;
}

/* الأرقام التحريرية — Space Grotesk */
.editorial-numeric {
  font-family: var(--font-numeric);
  font-variant-numeric: tabular-nums lining-nums;
  direction: ltr;
}

.stat-number, .counter-value, .huge-number {
  font-family: var(--font-numeric);
  font-size: clamp(2.25rem, 5vw, 4.5rem); /* أصغر لمنع الطفح */
  font-weight: var(--fw-bold);
  line-height: 1;
  color: var(--charcoal);
  font-variant-numeric: tabular-nums lining-nums;
  direction: ltr;
  display: inline-block;
}

.stat-number {
  word-break: break-word; /* يمنع الطفح */
  overflow-wrap: anywhere;
}

/* Pull quote — الاقتباس الضخم */
.pull-quote {
  font-family: var(--font-arabic);
  font-size: var(--fs-section);
  font-weight: var(--fw-bold);
  line-height: 1.3;
  color: var(--charcoal);
  padding-right: var(--space-lg);
  border-right: 4px solid var(--gold);
  margin-block: var(--space-2xl);
}

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

/* Links داخل النص */
.editorial-link {
  color: var(--charcoal);
  border-bottom: 1px solid var(--gold);
  padding-bottom: 2px;
  transition: color var(--duration-hover) var(--ease-out-expo),
              border-color var(--duration-hover) var(--ease-out-expo);
}

.editorial-link:hover {
  color: var(--gold);
  border-bottom-color: var(--charcoal);
}

/* Blockquote داخل النصوص */
blockquote {
  font-family: var(--font-arabic);
  font-size: var(--fs-subsection);
  font-weight: var(--fw-normal);
  line-height: 1.6;
  color: var(--charcoal);
  padding-inline-start: var(--space-md);
  border-inline-start: 3px solid var(--gold);
  margin-block: var(--space-lg);
  font-style: normal;
}