/* ==========================================================================
   طبقة اللغات اللاتينية (EN / TR) — تُحمَّل فقط على /en و /tr
   وظيفتها ثلاثة أشياء:
   1) استبدال عائلة الخط العربية (Amiri/Cairo) بزوج لاتيني متوافق مع التركية.
   2) ضبط القياسات البصرية: الخط اللاتيني له x-height وتباعد مختلفان عن العربي.
   3) إصلاحات اتجاه لا يستطيع القالب الآلي التقاطها (أسهم SVG، أيقونات معكوسة).

   ملاحظة: قلب left/right و text-align والتدرّجات يتم آلياً على الخادم
   (backend/src/i18n/cssflip.js) — لا تكرّره هنا.
   ========================================================================== */

/* استبدال عائلات الخطوط نفسه يتم على الخادم (swapFonts) — بما يشمل سمات style=""
   المضمّنة، فلا حاجة لـ!important هنا. هذا الملف للقياسات البصرية فقط. */

/* ---------- التناسب البصري ----------
   EB Garamond أقصر x-height من Amiri، فالعناوين تحتاج تنفّساً أقل وتتبّعاً أدق. */
h1, h2, h3, .hero-title, .section-title, .dn-pagehead h1, .dn-section-title,
.ab-title, .fn-title, .proj-title, .ct-title, .tl-final h2 {
  line-height: 1.1;
  letter-spacing: -0.008em;
  word-spacing: 0.01em;
}

/* Manrope أعرض قليلاً من Cairo عند نفس المقاس — نضيّق التتبّع ونرفع سطر الفقرة */
body, p, .dn-lede, .dn-section-sub, .hero-body, .ab-body, .fn-sub, .ct-sub,
.svc-desc, .pj-desc, .tl-card p, .proj-subtitle, .fn-cat-head p {
  letter-spacing: -0.004em;
  line-height: 1.72;
}

/* التسميات الصغيرة بحروف كبيرة تحتاج تباعداً أوسع بالحرف اللاتيني */
.dn-eyebrow, .svc-cat, .pj-cat, .tl-cat, .fn-tag, .ab-tag, .ct-tag, .hero-tag,
.proj-tag span, .dn-brand-sub, .sidebar-fixed {
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.94em;
}

/* الشعار الجانبي العمودي: النص اللاتيني أطول — نصغّره حتى لا يتجاوز الشاشة */
.sidebar-fixed { font-size: 8.5px; letter-spacing: 0.28em; }

/* الأرقام الكبيرة (إحصاءات/شارات) تبدو أنحف بالسيريف — نزيد وزنها */
.proj-stat-num, .ab-badge-num, .tl-num, .svc-num { font-weight: 600; }

/* ---------- الشريط العلوي: النص اللاتيني أطول من العربي ----------
   6 روابط + مبدّل لغة + زر واتساب لا تتسع عند 900px، فنرفع نقطة التحوّل. */
.dn-navlink { font-size: 13.5px; padding: 8px 11px; }
.dn-brand-sub { font-size: 8.5px; }

@media (max-width: 1120px) {
  .dn-nav-links { display: none; }
  .dn-burger { display: flex; }
  .dn-nav.open .dn-drawer { display: flex; }
  .dn-lang-nav { display: none; }
  .dn-cta-wa span { display: none; }
  .dn-cta-wa { padding: 10px; }
}

/* ---------- الهيرو: العنوان اللاتيني يحتاج عرضاً أكبر ---------- */
.hero-content { max-width: 620px; }
.hero-title { letter-spacing: -0.015em; }
.hero-body { max-width: 560px; }

/* على الشاشات المتوسطة يصير الهيرو متمركزاً وصفّ الأزرار اللاتيني أعرض،
   فيصطدم بحلقة «Scroll down» السفلية — نحجز لها مساحة أسفل المحتوى. */
@media (max-width: 900px) {
  #s1 .hero-content { padding-bottom: 58px; }
  .hero-cta { margin-top: 26px !important; }
  .hero-cta .dn-cta { font-size: 13.5px; padding: 10px 16px; }
  /* الحلقة تصغر وتلتصق بالحافة السفلية فتترك مجالاً لصفّ الأزرار الأعرض */
  .scroll-btn-wrap { bottom: 20px; width: 74px; height: 74px; }
  .scroll-ring { width: 74px; height: 74px; }
}
@media (max-width: 560px) {
  #s1 .hero-content { padding-bottom: 66px; }
  .scroll-btn-wrap, .scroll-ring { width: 66px; height: 66px; }
}

/* ---------- بطاقات الخدمات: عناوين إنجليزية/تركية أطول ---------- */
.retro-svc-name { line-height: 1.15; }
.svc-title, .pj-name { line-height: 1.18; }

/* الأزرار: الكلمة التركية أطول (مثل «WhatsApp ile iletişime geçin») */
.dn-cta, .ct-btn, .svc-link { text-align: center; }
.ct-btn { white-space: normal; }

/* ---------- إصلاحات اتجاه لا يلتقطها القالب الآلي ---------- */

/* أيقونة الاقتباس داخل نافذة الخدمة كانت معكوسة لتناسب RTL */
.svc-modal-desc-container > svg { transform: none !important; }

/* أسهم SVG مرسومة يدوياً لتشير يساراً في RTL — تُعكس أفقياً في LTR */
.dn-arrow-flip { transform: scaleX(-1) !important; }
/* أسهم دُوِّرت 180° لأجل RTL فقط — تعود لوضعها الطبيعي في LTR */
.dn-arrow-rtl { transform: none !important; }

/* أزرار «السابق/التالي» مرتّبة لـRTL — نعكس ترتيب الصف فيصير السهم الأيسر أولاً */
.proj-nav, .retro-nav-btns { flex-direction: row-reverse; }
/* مع row-reverse تنقلب دلالة flex-end، فنعيد الأزرار إلى حافة النهاية يدوياً */
.retro-nav-btns { justify-content: flex-start; }

/* شيفرونات اللايتبوكس: مواضعها قُلبت آلياً، فتُعكس أيقوناتها لتوافقها */
.gallery-nav svg { transform: scaleX(-1); }

/* التركية تستخدم İ/ı — نضمن أن التحويل لحروف كبيرة يتبع قواعد اللغة */
:lang(tr) { font-variant-ligatures: none; }

/* ---------- شاشات صغيرة ---------- */
@media (max-width: 560px) {
  .dn-eyebrow, .svc-cat, .pj-cat, .tl-cat { letter-spacing: 0.1em; }
  .hero-title { letter-spacing: -0.02em; }
}