/* Static-page shims. Only needed by the prerendered routes: the design's own
   inline styles are baked at desktop values, so the breakpoint-driven ones are
   restored here. Loaded BEFORE the design's own <style> block so the design
   keeps precedence wherever both apply. */

@media (max-width: 1059px) {
  .dsk-nav { display: none !important; }
  .nav-burger { display: flex !important; }
  .hero-scrim {
    background: linear-gradient(to bottom,rgba(12,11,10,0.62) 0%,rgba(12,11,10,0.5) 34%,rgba(12,11,10,0.82) 72%,rgba(12,11,10,0.94) 100%) !important;
  }
}
@media (min-width: 1060px) {
  .dsk-nav { display: flex !important; }
  .nav-burger { display: none !important; }
}

/* About hero: phone composition (the design's own max-width:760px block owns
   the rest; these two keys have no class-level equivalent there) */
@media (max-width: 700px) {
  .ph-about .ab-box { height: 62% !important; padding-left: 0 !important; padding-right: 0 !important; }
}

#mobile-menu[hidden] { display: none !important; }

/* ── Arabic visual parity (RTL) · 2026-10-26 ─────────────────────────
   Applies only when <html dir="rtl"> (the Arabic pages). English pages
   are unaffected. No font-family is introduced: Arabic text keeps the
   approved IBM Plex Sans Arabic that the site assigns to [dir="rtl"]. */

/* 1 · Split rows keep the English image/text rhythm on desktop/tablet.
   .split already reverses to the English order in RTL; the alternate
   rows (.split-rev) were set to "row", which RTL flipped a second time. */
@media (min-width: 761px) {
  html[dir="rtl"] .split.split-rev { flex-direction: row-reverse; }
}

/* 2 · Home hero: English focal point and crop; scrim kept off the towers. */
html[dir="rtl"] .ph-home img { object-position: 68% 48% !important; }
/* Desktop only: below 1060px the site already uses the same vertical scrim for both languages. */
@media (min-width: 1060px) {
  html[dir="rtl"] .ph-home .hero-scrim {
    background:
      radial-gradient(ellipse 52% 62% at 100% 86%, rgba(12,11,10,0.86) 0%, rgba(12,11,10,0.58) 45%, rgba(12,11,10,0) 100%),
      linear-gradient(264deg, rgba(12,11,10,0.52) 0%, rgba(12,11,10,0.30) 24%, rgba(12,11,10,0.12) 44%, rgba(12,11,10,0.06) 70%, rgba(12,11,10,0.03) 100%) !important;
  }
}

/* 3 · Mobile menu: right-aligned, approved Arabic font, English row rhythm. */
html[dir="rtl"] #mobile-menu a[href^="/ar"] {
  text-align: right !important;
  font-family: inherit !important;
  line-height: 1.2 !important;
}
/* Language switch is English text: LTR, English font kept, aligned with the items. */
html[dir="rtl"] #mobile-menu a:not([href^="/ar"]):not([target="_blank"]) {
  text-align: right !important;
  direction: ltr;
  unicode-bidi: isolate;
}

/* 4 · Desktop navigation: approved Arabic font at the English menu's perceived size. */
html[dir="rtl"] .dsk-nav a[href^="/ar"] {
  font-family: inherit !important;
  font-size: 13px !important;
}

/* 5 · Header logo: brand mark keeps its English orientation and tracking. */
html[dir="rtl"] nav .nav-row > a:first-child { direction: ltr; text-align: left; }
html[dir="rtl"] nav .nav-row > a:first-child span:first-child { letter-spacing: 0.1em !important; }
html[dir="rtl"] nav .nav-row > a:first-child span:last-child  { letter-spacing: 0.14em !important; }

/* 6 · No English tracking on connected Arabic letters; label boxes sized like English. */
html[dir="rtl"] .ar-eyebrow { letter-spacing: 0 !important; line-height: 1.2; }

/* 7 · English company names inside Arabic text: isolated LTR, kept on one line. */
html[dir="rtl"] bdi { direction: ltr; unicode-bidi: isolate; white-space: nowrap; }

/* 8 · Mobile "Selected platforms" grid: RTL counterpart of the English dividers. */
@media (max-width: 760px) {
  html[dir="rtl"] .pf-strip > a:nth-child(2n+1) { padding-right: 0 !important; padding-left: 18px !important; }
  html[dir="rtl"] .pf-strip > a:nth-child(2n) {
    border-left: none !important;
    border-right: 1px solid rgb(230, 224, 211) !important;
    padding-left: 0 !important;
    padding-right: 18px !important;
  }
  html[dir="rtl"] .pf-strip > a:nth-child(5) { border-right: none !important; padding: 20px 0 !important; }
}

/* 9 · Manufacturing capability titles: English line-height. The Arabic font's
   "normal" line box is taller than Inter's, which made each row ~9px taller. */
html[dir="rtl"] div:has(> .ar-num) > span:first-child { line-height: 1.2; }

/* 10 · About hero title: no negative tracking on Arabic letters
   (the mobile rule carried the English -0.035em). */
html[dir="rtl"] .ab-title { letter-spacing: 0 !important; }

/* 11 · Mobile text measures: the English ch-based widths expressed in em, so the
   Arabic font's narrower "0" does not shrink the column. */
@media (max-width: 760px) {
  html[dir="rtl"] .hsplit .hs-txt p:last-of-type { max-width: 18.93em; }
  html[dir="rtl"] .ph-about .ab-lead { max-width: 18.5em !important; }
  html[dir="rtl"] .rs > div.rs-txt p { max-width: 21.45em; }
}

/* 12 · Item #10 (approved 26 Oct): the English company names in the About list use the
   English site's type (Inter 350, -0.015em, line-height 1.2) and stay LTR inside the Arabic
   layout. Only those five name headings are matched; Arabic text keeps IBM Plex Sans Arabic. */
html[dir="rtl"] div[style*="font-size:clamp(23px,2.1vw,28px)"]:has(> bdi),
html[dir="rtl"] div[style*="font-size:clamp(23px,2.1vw,28px)"] > bdi {
  font-family: Inter, system-ui, sans-serif !important;
  font-weight: 350 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.2 !important;
}