/* ═══════════════════════════════════════════════════════════════════════════
   A PLAN — طبقة الأساس الحديثة
   ───────────────────────────────────────────────────────────────────────────
   تعالج ما قِيس فعليًا في style.css (9087 سطرًا):
     · 0 خاصية منطقية مقابل 59 فيزيائية  → أخطاء اتجاه في موقع RTL
     · 0 prefers-reduced-motion مع 77 transition:all → حركة إجبارية
     · 0 :focus-visible → التنقل بالكيبورد بلا مؤشر
     · 1377 px ثابتة → مقاسات لا تستجيب لتفضيل حجم الخط
   تُحمَّل قبل طبقة التصميم (dossier) وبعد ستايل الثيم.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────────
   ١. إتاحة — خط الأساس الذي لا يُتفاوض عليه
   ─────────────────────────────────────────────────────────────────────────── */

/* 77 قاعدة transition:all في الثيم تعمل دون استثناء. من يطلب تقليل الحركة
   يجب أن يحصل عليه — هذا معيار إتاحة لا تفضيل جمالي. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .swiper-wrapper { transition-duration: .01ms !important; }
}

/* لا يوجد :focus-visible في الثيم إطلاقًا — المتنقّل بالكيبورد يفقد موضعه. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid #e31e24;
  outline-offset: 3px;
  border-radius: 3px;
}
/* نُبقي المخطط للكيبورد فقط، لا لنقر الفأرة */
:where(a, button, input, select, textarea, summary, [tabindex]):focus:not(:focus-visible) {
  outline: none;
}

/* تخطّي إلى المحتوى — يظهر عند التركيز فقط */
.ap-skip {
  position: absolute;
  inset-inline-start: 1rem;
  top: -100px;
  z-index: 9999;
  background: #0a1745;
  color: #fff;
  padding: .7rem 1.15rem;
  border-radius: 6px;
  font-weight: 700;
  text-decoration: none;
  transition: top .25s cubic-bezier(.22,1,.36,1);
}
.ap-skip:focus { top: 1rem; }

/* ───────────────────────────────────────────────────────────────────────────
   ٢. تصحيح الاتجاه — الخصائص الفيزيائية في موقع RTL
   ─────────────────────────────────────────────────────────────────────────── */

/* الأسهم والأيقونات المكتوبة لاتجاه واحد تنقلب مع الاتجاه */
[dir="rtl"] .fa-arrow-left,
[dir="rtl"] .fa-long-arrow-alt-left { transform: scaleX(-1); }

/* الأرقام تبقى بمحاذاة موحّدة داخل النص العربي */
:where(.stat-number, .badge-number, .step-number, .clients-v2-stat-number,
       .plan-price, table td, table th) {
  font-variant-numeric: tabular-nums;
}

/* الاقتباسات والقوائم تحترم الاتجاه بدل left/right الثابتة */
blockquote { border-inline-start: 3px solid #e31e24; border-inline-end: 0;
             padding-inline-start: 1.2rem; padding-inline-end: 0; }

/* ───────────────────────────────────────────────────────────────────────────
   ٣. مقياس مرن — يستجيب لحجم الشاشة ولتفضيل المستخدم معًا
   ─────────────────────────────────────────────────────────────────────────── */
:root {
  --ap-fluid-xs: clamp(.82rem, .8rem + .1vw, .9rem);
  --ap-fluid-sm: clamp(.92rem, .89rem + .15vw, 1.02rem);
  --ap-fluid-md: clamp(1.05rem, .98rem + .3vw, 1.22rem);
  --ap-fluid-lg: clamp(1.35rem, 1.15rem + .8vw, 1.9rem);
  --ap-fluid-xl: clamp(1.9rem, 1.5rem + 1.7vw, 2.9rem);
  --ap-fluid-2xl: clamp(2.4rem, 1.7rem + 3vw, 4.2rem);

  --ap-gap-sm: clamp(.8rem, .6rem + .6vw, 1.3rem);
  --ap-gap-md: clamp(1.4rem, 1rem + 1.4vw, 2.6rem);
  --ap-gap-lg: clamp(2.6rem, 1.8rem + 3vw, 5.2rem);
}

/* الجذر لا يثبّت حجم الخط بالبكسل حتى يحترم تفضيل المتصفح */
html { font-size: 100%; -webkit-text-size-adjust: 100%; }

/* العربي يحتاج ارتفاع سطر أعلى من اللاتيني — الثيم يستخدم 1.6 في مواضع كثيرة */
body { line-height: 1.85; text-rendering: optimizeLegibility; }
p { line-height: 1.9; }

/* ───────────────────────────────────────────────────────────────────────────
   ٤. أداء — transition:all يحرّك خصائص التخطيط ويسبب إعادة تخطيط
   ─────────────────────────────────────────────────────────────────────────── */
:where(.aplan-service-card, .pricing-plan, .process-step, .feature-item,
       .aplan-portfolio-card, .crypto-faq-item, .client-slide) {
  transition-property: transform, opacity, background-color, border-color,
                       box-shadow, color;
}

/* الصور لا تسبب قفزات تخطيط */
img, video, iframe { max-width: 100%; height: auto; }
img[width][height] { height: auto; }

/* ───────────────────────────────────────────────────────────────────────────
   ٥. أسطح حديثة — ظل واحد مدروس بدل 134 ظلًا متفرقًا
   ─────────────────────────────────────────────────────────────────────────── */
:root {
  --ap-shadow-sm: 0 1px 2px rgba(10,23,69,.05), 0 2px 8px -4px rgba(10,23,69,.08);
  --ap-shadow-md: 0 4px 12px -4px rgba(10,23,69,.1), 0 12px 32px -12px rgba(10,23,69,.14);
  --ap-shadow-lg: 0 8px 24px -8px rgba(10,23,69,.14), 0 24px 60px -20px rgba(10,23,69,.2);
}

/* حواف أهدأ — 47 قاعدة في الثيم تتجاوز 20px */
:where(.aplan-service-card, .pricing-plan, .feature-item, .crypto-faq-item,
       .aplan-portfolio-card, input, select, textarea) {
  border-radius: 8px;
}
:where(.btn, button, .nav-cta-button, .aplan-read-more-btn) { border-radius: 6px; }

/* ───────────────────────────────────────────────────────────────────────────
   ٦. نماذج — أهم مسار تحويل في الموقع
   ─────────────────────────────────────────────────────────────────────────── */
:where(input, select, textarea) {
  font-family: inherit;
  font-size: max(16px, var(--ap-fluid-sm));   /* أقل من 16px يسبب تكبيرًا تلقائيًا على iOS */
  line-height: 1.6;
  border: 1px solid #d9d7d1;
  background: #fff;
  transition: border-color .25s cubic-bezier(.22,1,.36,1),
              box-shadow .25s cubic-bezier(.22,1,.36,1);
}
:where(input, select, textarea):focus {
  border-color: #e31e24;
  box-shadow: 0 0 0 3px rgba(227,30,36,.13);
  outline: none;
}
:where(input, select, textarea)::placeholder { color: #8a8fa3; opacity: 1; }

/* هدف لمس لا يقل عن 44px — معيار إتاحة على الجوال */
@media (pointer: coarse) {
  :where(a.btn, button, .nav-cta-button, input[type="submit"]) { min-height: 44px; }
}

/* ───────────────────────────────────────────────────────────────────────────
   ٧. قاعدة التباعد الحرفي للعربية  (مصدر بحثي: voxire.com)
   الحروف العربية تترابط داخل الكلمة بروابط (ligatures)، وأي letter-spacing
   يكسرها ويجعل الكلمة تبدو مفكّكة. القاعدة: صفر على كل الكتل العربية.
   ─────────────────────────────────────────────────────────────────────────── */
:where(html[lang="ar"], [dir="rtl"]) :where(body, p, li, h1, h2, h3, h4, h5, h6,
  a, span, div, td, th, label, button, input, textarea, blockquote, figcaption) {
  letter-spacing: 0 !important;
}
/* استثناء: النصوص اللاتينية الخالصة داخل الصفحة (أرقام/مصطلحات) */
:where([lang="en"], .ltr, code, kbd, samp) { letter-spacing: normal !important; }

/* ارتفاع السطر وفق قياسات العربية لا اللاتينية */
:where([dir="rtl"]) :where(h1, h2, h3) { line-height: 1.35; }
:where([dir="rtl"]) :where(h4, h5, h6) { line-height: 1.45; }
:where([dir="rtl"]) :where(p, li, dd)  { line-height: 1.85; }