/* Lumos — Arabic typography and right-to-left adjustments. Loaded only on /ar/ pages, after lumos.css. 2026-10-19
   Fonts (self-hosted, OFL, Arabic subset only): IBM Plex Sans Arabic for text, Amiri for headlines.
   Latin text inside Arabic pages (brand names, URLs) keeps the English fonts; Arabic glyphs fall through to these. */
@font-face{font-family:"Lumos Arabic";src:url(/wp-content/uploads/lumos-fonts/plex-arabic-400.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:"Lumos Arabic";src:url(/wp-content/uploads/lumos-fonts/plex-arabic-500.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:"Lumos Arabic";src:url(/wp-content/uploads/lumos-fonts/plex-arabic-600.woff2) format("woff2");font-weight:600 800;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:"Lumos Arabic Display";src:url(/wp-content/uploads/lumos-fonts/amiri-arabic-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:"Lumos Arabic Display";src:url(/wp-content/uploads/lumos-fonts/amiri-arabic-700.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}

:root[lang="ar"]{
  --lx-serif:"Lumos Serif","Lumos Arabic Display","Iowan Old Style",serif;
  --lx-sans:"Lumos Sans","Lumos Arabic",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
  --lx-label:"Lumos Label","Lumos Arabic","Lumos Sans",sans-serif;
}
html[lang="ar"] body{font-family:var(--lx-sans)}

/* ---------- Arabic typography: no italics, no tracking (it breaks letter joins), roomier line height ---------- */
[lang="ar"] .lx{line-height:1.85}
[lang="ar"] .lx h1,[lang="ar"] .lx h2,[lang="ar"] .lx h3,[lang="ar"] .lx .lx-display{letter-spacing:0;line-height:1.32}
/* h1 stays at 1.32 and h2 gets 1.4: at 1.22/1.32 the dots under ي touched the hamza on the line below (measured, 2026-10-19) */
[lang="ar"] .lx h2{line-height:1.4}
[lang="ar"] em,[lang="ar"] .lx em,[lang="ar"] .lx-display em,[lang="ar"] .page-id-55 h1 .highlighted,[lang="ar"] .page-id-57 h1 em{font-style:normal}
[lang="ar"] .lx-statement{letter-spacing:0;line-height:1.55;max-width:30ch}
[lang="ar"] .lx-names{letter-spacing:0;line-height:1.45}
[lang="ar"] .lx-label{letter-spacing:0;text-transform:none;font-size:13.5px;font-weight:500}
[lang="ar"] .lx-chapter .lx-n,[lang="ar"] .lx-rows--num>div::before,[lang="ar"] .lx-steps b::before{letter-spacing:.14em}
[lang="ar"] .lx-lede{line-height:1.8}
[lang="ar"] .lx-steps b{line-height:1.35}
[lang="ar"] .lx-faq summary{line-height:1.6}
[lang="ar"] .lx-mail a{direction:ltr;unicode-bidi:isolate;display:inline-block}

[lang="ar"] .lw-card__name{letter-spacing:0}

/* ---------- glyph clipping (2026-10-19) ----------
   Amiri's dots and tails reach ~.3em past the line box (up to .5em below with stacked marks), and the hero
   reveal mask (.lx-line overflow:hidden) cut them off. Same mask shape, but as a clip-path with room above and
   below: layout is unchanged (padding/negative margins would collapse between the stacked lines). The start
   offset grows by the same room so the line still begins fully hidden. */
html[lang="ar"].lx-js .lx-hero .lx-line{overflow:visible;clip-path:inset(-.4em -.25em -.6em -.25em)}
html[lang="ar"].lx-js .lx-hero .lx-line>span{transform:translateY(calc(105% + 1em))}
/* Elementor post navigation (case studies) clips each label to its 1.5 line box; the tail of a final ي was cut.
   Padding widens the clip box, the equal negative margin keeps the size (flex children: no margin collapsing). */
[lang="ar"] .elementor-post-navigation .elementor-post-navigation__link__prev,[lang="ar"] .elementor-post-navigation .elementor-post-navigation__link__next,
[lang="ar"] .elementor-post-navigation .post-navigation__prev--label,[lang="ar"] .elementor-post-navigation .post-navigation__next--label,
[lang="ar"] .elementor-post-navigation .post-navigation__prev--title,[lang="ar"] .elementor-post-navigation .post-navigation__next--title{padding-block:3px;margin-block:-3px}

/* ---------- mirroring: physical left/right rules from lumos.css ---------- */
[dir="rtl"] .lx-chapter::after{transform-origin:right}
[dir="rtl"] .lx-js .lx-chapter.is-in::after,html[dir="rtl"].lx-js .lx-chapter.is-in::after{--lx-seam:linear-gradient(270deg,rgba(237,99,54,0),var(--lx-o) 70%,#ffd6c4 94%,rgba(237,99,54,0));animation-name:lx-seam-rtl}
@keyframes lx-seam-rtl{0%,50%{background-position:0% 0,0 0}100%{background-position:-40% 0,0 0}}
[dir="rtl"] .lx-btn:hover .lx-arr{transform:translateX(-4px)}
[dir="rtl"] .lx-link{background-position:100% 100%}
[dir="rtl"] .lx-link:hover{background-position:0 100%}
[dir="rtl"] .lx-hero::before{inset:auto 30% -40% -10%}
[dir="rtl"] .lx-hero__art .lx-plate:nth-of-type(1){left:auto;right:0}
[dir="rtl"] .lx-hero__art .lx-plate:nth-of-type(2){left:auto;right:30%}
[dir="rtl"] .lx-hero__art .lx-plate:nth-of-type(3){right:auto;left:0}
[dir="rtl"] .lx-hero__art--wide .lx-plate:nth-of-type(1){left:auto;right:0}
[dir="rtl"] .lx-hero__art--wide .lx-plate:nth-of-type(2){right:auto;left:0}
[dir="rtl"] .lx-cap{left:auto;right:0}
[dir="rtl"] .lx-rays{right:auto;left:2%}
[dir="rtl"] .lx-hero__art--rays .lx-rays{right:auto;left:0}
[dir="rtl"] .lx-split>div{padding-right:0;padding-left:clamp(0px,3vw,48px)}
[dir="rtl"] .lx-split>div+div{border-left:0;border-right:1px solid var(--rule);padding-left:0;padding-right:clamp(24px,4vw,64px)}
[dir="rtl"] .lx-plans>div{padding-right:0;padding-left:clamp(0px,3vw,48px)}
[dir="rtl"] .lx-plans>div+div{border-left:0;border-right:1px solid var(--rule);padding-right:clamp(24px,4vw,56px)}
[dir="rtl"] .lx-steps li::before{left:auto;right:0}
[dir="rtl"] .lx-steps b::before{margin-right:0;margin-left:6px}
[dir="rtl"] .lx-faq summary{padding:24px 0 24px 44px}
[dir="rtl"] .lx-faq summary::after{right:auto;left:6px}
[dir="rtl"] .lx-faq details p{padding:0 0 26px 44px}
[dir="rtl"] .lx-article .lx-list li::before{left:auto;right:2px}
[dir="rtl"] .lx-note-box{border-left:0;border-right:3px solid var(--lx-o)}
[dir="rtl"] .lw-card--duo .lw-inset{right:auto;left:5%}
html[dir="rtl"] .page-id-57 .elementor-widget-heading h1.elementor-heading-title,html[dir="rtl"] .page-id-57 .elementor-element-3172280 .elementor-heading-title{text-align:right !important}
html[dir="rtl"] .page-id-57 .elementor-form .elementor-field-textual{text-align:right !important}
html[dir="rtl"] .page-id-57 .elementor-form input[type="email"],html[dir="rtl"] .page-id-57 .elementor-form input[type="tel"]{direction:ltr;text-align:right !important}
@media (max-width:1024px){
  [dir="rtl"] .lx-split>div+div,[dir="rtl"] .lx-plans>div+div{border-right:0;padding-right:0}
  [dir="rtl"] .lx-split>div,[dir="rtl"] .lx-plans>div{padding-left:0}
}

/* ---------- language switcher (both languages render it; styles live here and in lumos.css-equivalent below) ---------- */
[lang="ar"] .lumos-lang__link{font-family:var(--lx-sans) !important}

/* ---------- RTL for the 2026-10-21 scroll scenes: lines draw from the right, hero plates turn the mirrored way ---------- */
[dir="rtl"] .lx-steps::after,[dir="rtl"] .lx-rows>div::after{transform-origin:right}
@media (min-width:1025px){
  [dir="rtl"] .lx-hero__art .lx-plate:nth-of-type(1){--turn:-20deg}
  [dir="rtl"] .lx-hero__art .lx-plate:nth-of-type(2){--turn:8deg}
  [dir="rtl"] .lx-hero__art .lx-plate:nth-of-type(3){--turn:24deg}
}
@media (max-width:767px){[dir="rtl"] .lx-hero__art .lx-rays{left:50%;right:auto}} /* centred bands on phones, as in English */
/* the work in 3D, mirrored: rows and case captures angle the other way toward their text; hero fan mirrored */
html[dir="rtl"].lx-js .lx-row figure{--ry:-13deg}
html[dir="rtl"].lx-js .lx-row--flip figure{--ry:13deg}
html[dir="rtl"].lx-js .lx-row--phone figure{--ry:-20deg}
html[dir="rtl"].lx-js .lx-row--phone.lx-row--flip figure{--ry:20deg}
html[dir="rtl"].lx-js .lx-row:hover figure{--ry:-4deg}
html[dir="rtl"].lx-js .lx-row--flip:hover figure{--ry:4deg}
html[dir="rtl"].lx-js .lx-case__plates figure:first-child{--ry:-9deg}
html[dir="rtl"].lx-js .lx-case__plates figure:nth-child(2){--ry:16deg}
html[dir="rtl"].lx-js .lx-plate::after,html[dir="rtl"].lx-js .lx-row figure::after,html[dir="rtl"].lx-js .lx-case__plates figure::after{background:linear-gradient(242deg,rgba(255,255,255,.16),rgba(255,255,255,0) 34%,rgba(255,255,255,0) 70%,rgba(255,255,255,.05))}
@media (min-width:1025px){
  html[dir="rtl"].lx-js .lx-hero__art .lx-plate:nth-of-type(1){--rest:-26deg}
  html[dir="rtl"].lx-js .lx-hero__art .lx-plate:nth-of-type(2){--rest:10deg}
  html[dir="rtl"].lx-js .lx-hero__art .lx-plate:nth-of-type(3){--rest:30deg}
  html[dir="rtl"].lx-js .lx-hero__art--wide .lx-plate:nth-of-type(1){--rest:-16deg}
  html[dir="rtl"].lx-js .lx-hero__art--wide .lx-plate:nth-of-type(2){--rest:14deg}
}
@media (max-width:767px){
  html[dir="rtl"].lx-js .lx-row figure,html[dir="rtl"].lx-js .lx-row--flip figure{--ry:-7deg}
  html[dir="rtl"].lx-js .lx-hero__art .lx-plate:nth-of-type(1){rotate:y -14deg}
  html[dir="rtl"].lx-js .lx-hero__art .lx-plate:nth-of-type(3){rotate:y 14deg}
}
/* Arabic footer (#1099): its widgets kept "end" alignment from the English layout, which in RTL means left: the logo floated mid-page
   on desktop, and on phones the text and link lists sat on the left edge under a right-aligned logo. Start = right in RTL. 2026-10-21 */
[dir="rtl"] .elementor-location-footer .elementor-element.elementor-widget-image,[dir="rtl"] .elementor-location-footer .elementor-element.elementor-widget-heading{text-align:start}