/* ============================================================
   KHW-UNI — مشاهد الخلفية

   خلفية على <body> فقط. لا HTML يتغيّر، ولا طبقة فوق النص.
   تعمل حيث توجد السمة data-hero على <html>، وقيمتها تحدّد المشهد:

     data-hero="home"  →  الرئيسية (عربي/إنجليزي) — معرض الدرون
     data-hero="db"    →  خريطة العالم — منصات الدرون العالمية + الشركات والدول
     data-hero="fly"   →  أقدر أطير هنا؟ — مدينة مصغّرة ومؤشّر موقع
     data-hero="wx"    →  طقس الطيران — معرض لوحات الطقس
     data-hero="air"   →  تنسيق المجال التشغيلي — معرض المجال الجوي
     data-hero="mp"    →  مخطط المهمة — معرض تخطيط المسار
     data-hero="fr"    →  سجل الطيران — معرض محضر ما قبل الإقلاع
     data-hero="app"   →  استخدامات الدرون — معرض القطاعات
     data-hero="hl"    →  الدرونات الثقيلة — معرض الرفع الثقيل
     data-hero="dt"    →  أنواع الدرونز وصفحاتها الست الفرعية — صالة العرض
                           (حُوِّلت من اللوحة الزرقاء إلى لوحة الموقع)
     data-hero="gen"   →  مشهد عام: ثماني صفحات بلا مشهد خاص (عربي/إنجليزي)

   التنقّل في الموقع تحميل صفحة كامل بعد postbuild، فالسمة لا
   تتسرّب إلى صفحة أخرى.

   ترتيب الطبقات:
     ١) المشهد     — أعلى الصفحة، بلا تكرار، عرض كامل
     ٢) شبكة 44px  — تكمل تحته إلى آخر الصفحة
     ٣) لون الأرضية الموحّد #F8F8F9

   أسفل كل صورة مذوَّب في #F8F8F9 داخل الملف نفسه، فلا يظهر خط قطع.
   وتُحمَّل هذه الورقة آخر الرأس لتسبق ورقة الهوية في الترتيب.
   ============================================================ */

:root[data-hero] body {
  background-repeat: no-repeat, repeat, repeat;
  background-size: 100% auto, 44px 44px, 44px 44px;
  background-position: center top, 0 0, 0 0;
  background-attachment: scroll, scroll, scroll;
}

:root[data-hero="home"] body {
  background-image:
    url("/assets/hero-desktop.729b9a5a75.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="gen"] body {
  background-image:
    url("/assets/gen-desktop.8649f7d6b3.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="dt"] body {
  background-image:
    url("/assets/dt-desktop.ee71b75139.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="hl"] body {
  background-image:
    url("/assets/hl-desktop.f2838f58f9.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="app"] body {
  background-image:
    url("/assets/app-desktop.a6b91d7d73.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="fr"] body {
  background-image:
    url("/assets/fr-desktop.dda29637bf.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="mp"] body {
  background-image:
    url("/assets/mp-desktop.f5732855d4.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="air"] body {
  background-image:
    url("/assets/air-desktop.2752356fd2.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="wx"] body {
  background-image:
    url("/assets/wx-desktop.32472c5b4c.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="fly"] body {
  background-image:
    url("/assets/fly-desktop.6a9f9fa752.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

:root[data-hero="db"] body {
  background-image:
    url("/assets/map-desktop.35cbb5a6b4.webp"),
    linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
}

/* الجوال: قصّات عمودية — عمود المحتوى يملأ العرض هنا،
   فالنسخة العريضة تطلع شريحة بلا معنى. */
@media (max-width: 899px) {
  :root[data-hero="home"] body {
    background-image:
      url("/assets/hero-mobile.e01781a8ee.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="gen"] body {
    background-image:
      url("/assets/gen-mobile.516c99cd05.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="dt"] body {
    background-image:
      url("/assets/dt-mobile.d5911b0af2.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="hl"] body {
    background-image:
      url("/assets/hl-mobile.5837df2e90.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="app"] body {
    background-image:
      url("/assets/app-mobile.a3c050a638.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="fr"] body {
    background-image:
      url("/assets/fr-mobile.e67eb0b21f.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="mp"] body {
    background-image:
      url("/assets/mp-mobile.50a44fbb0d.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="air"] body {
    background-image:
      url("/assets/air-mobile.da68b2e9c8.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="wx"] body {
    background-image:
      url("/assets/wx-mobile.7bd2695d8d.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="fly"] body {
    background-image:
      url("/assets/fly-mobile.cb29fbffe7.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
  :root[data-hero="db"] body {
    background-image:
      url("/assets/map-mobile.257a544e47.webp"),
      linear-gradient(rgba(15,110,122,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(15,110,122,.04) 1px, transparent 1px);
  }
}

@media print {
  :root[data-hero] body { background-image: none; }
}
