/* ============================================================
   Arabic / RTL overrides. Loaded after styles.css on ar.html
   ============================================================ */
:root{--sans:'IBM Plex Sans Arabic','IBM Plex Sans',system-ui,sans-serif}
html{direction:rtl}
body{direction:rtl;text-align:right}

/* Arabic reads better with a little more line-height and no negative tracking */
h1,h2,h3,.hero__title,.intro__lead,.ceo__quote,.row__title,.spp__title,.stat__n,.std__code,.market__name,.svc__t,.doc__t{letter-spacing:0}
h1,h2,h3{line-height:1.25}
.hero__title{line-height:1.2}
.hero__lead,.intro__col p,.row__desc,.svc__d,.spp p,.ceo__body p,.market p,.std p,.contactx__lead{line-height:1.85}

/* hero image and gradient mirror */
.hero__bg img{object-position:40% 50%}
@media(min-width:960px){
  .hero__grade{background:linear-gradient(180deg,rgba(7,20,31,.7) 0%,rgba(7,20,31,.25) 40%,rgba(7,20,31,.92) 100%),
    linear-gradient(270deg,rgba(7,20,31,.75),transparent 60%)}
}

/* burger sits at the visual left */
.nav__burger{margin-right:0;margin-left:-6px;align-items:flex-start}

/* start-aligned overlays flip to the right */
.row__tag{left:auto;right:12px}
.spp__since{left:auto;right:12px}
@media(min-width:600px){.spp__since{right:16px}}
@media(min-width:960px){.row__tag{right:16px}.spp__since{right:20px}}

/* list bullets on the right */
.spp__list li{padding-left:0;padding-right:16px}
.spp__list li::before{left:auto;right:0}
@media(min-width:960px){.spp__list li{padding-right:18px}}

/* arrow links point the other way */
.arrowlink svg{transform:scaleX(-1)}
@media(hover:hover){.arrowlink:hover svg{transform:scaleX(-1) translateX(-4px)}}

/* contact tiles right-aligned, phone number stays ltr */
.ctile{text-align:right;align-items:flex-start}
.ctile__v[dir="ltr"]{direction:ltr;text-align:right}

/* language toggle */
.nav__lang[lang="en"]{font-family:'IBM Plex Sans',system-ui,sans-serif}

/* Latin technical terms (SPP, NFPA 20, API 610 ...) carry lang="en" so screen
   readers switch voice. Those spans sit inside containers whose own rules target
   bare descendant spans, so neutralise the inheritance here. */
span[lang="en"]{display:inline;font-size:inherit;font-weight:inherit;color:inherit;
  line-height:inherit;letter-spacing:inherit;min-width:0;margin:0;padding:0;
  font-family:'IBM Plex Sans',system-ui,sans-serif}