/* =====================================================================
   RTL + Arabic overrides — loaded ONLY on /ar/ pages (after styles.css).
   Handles direction-specific flips that dir="rtl" doesn't do on its own.
   ===================================================================== */

body { font-family: 'Cairo', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; }
h1, h2, h3, h4,
.eyebrow, .btn, .nav__link, .section__title, .hero__title,
.stat strong, .step__n, .shieldcard__stats strong, .logo-ph, .prod {
  font-family: 'Cairo', sans-serif;
}

/* Arabic reads better without the tight latin tracking */
.hero__title, .section__title, .brand__text, h1, h2, h3 { letter-spacing: 0; }

/* Keep the latin brand mark left-to-right */
.brand__text { direction: ltr; font-family: 'Plus Jakarta Sans', sans-serif; }

/* Phone numbers stay LTR so digits/“+” render correctly */
.topbar__item, .side-contact a, .footer__col a[href^="tel"] { unicode-bidi: plaintext; }

/* Hero photo: mirror so the dark side sits under the (right-aligned) text */
.hero__bg {
  background-image:
    linear-gradient(270deg, rgba(8,23,44,.97) 0%, rgba(9,27,50,.9) 34%, rgba(9,27,50,.55) 64%, rgba(9,25,48,.72) 100%),
    radial-gradient(800px 460px at 18% -10%, rgba(225,29,42,.22), transparent 60%),
    url('assets/hero.jpg');
  background-position: center left;
}
.pagehero {
  background-image: linear-gradient(270deg, rgba(8,23,44,.93), rgba(9,27,50,.82)), url('assets/hero.jpg');
  background-position: center left;
}

/* Physical-side bits that must flip */
.faq summary::after { float: left; }
.fab { left: 22px; right: auto; }
.stat, .sidecard { background-position: top left; }

/* The hero text column reads right-aligned */
.hero__sub { margin-left: auto; }