/* SWAN · Arabic (right-to-left) layout. Loaded only on /ar/ pages, after swan.css.
   Flex and grid layouts follow the page direction by themselves; this file fixes what is placed by left/right,
   swaps the arrows, and sets Arabic type (Tajawal for text, Aref Ruqaa for the hand-written lines). */
html[dir=rtl]{--display:"Tajawal","Segoe UI",system-ui,sans-serif;--body:"Tajawal","Segoe UI",system-ui,sans-serif;--script:"Aref Ruqaa","Tajawal",serif}
html[dir=rtl] body{font-family:var(--body)}
/* Arabic letters join: never space them out, and no capitals to set */
html[dir=rtl] *,html[dir=rtl] *::before,html[dir=rtl] *::after{letter-spacing:0!important}
html[dir=rtl] .skip{left:auto;right:-9999px}
html[dir=rtl] .skip:focus{right:16px}
/* arrows point the reading way */
html[dir=rtl] .arrow,html[dir=rtl] .lux-link>span[aria-hidden],html[dir=rtl] .lux-build>span[aria-hidden],html[dir=rtl] .link .arrow{display:inline-block;transform:scaleX(-1)}
/* phone menu slides in from the left */
html[dir=rtl] .drawer:not(.open){transform:translateX(-100%)}
/* menus open under their button, aligned to the right */
html[dir=rtl] .mega{left:auto;right:-28px}
html[dir=rtl] .nav>li>button::after{margin-left:0;margin-right:4px}
/* hero film/photo sits on the left, the words on the right */
@media (min-width:861px){
  html[dir=rtl] .cin-scenes{inset:0 auto 0 0;-webkit-mask-image:linear-gradient(270deg,transparent 0%,rgba(0,0,0,.35) 18%,#000 46%);mask-image:linear-gradient(270deg,transparent 0%,rgba(0,0,0,.35) 18%,#000 46%)}
  html[dir=rtl] .gl-hero .cin-scenes{-webkit-mask-image:none;mask-image:none}
  html[dir=rtl] .cin-hero::before{background:radial-gradient(ellipse 60% 70% at 82% 55%,rgba(13,12,17,.9),transparent 70%)}
}
/* floating contact button on the reading-start side */
html[dir=rtl] .wa{right:auto;left:calc(18px + env(safe-area-inset-left,0px))}
html[dir=rtl] .drawer .btn{justify-content:center;text-align:center}
/* stacked spec tables on phones: label on the right, value on the left */
@media (max-width:640px){html[dir=rtl] .spec tbody td{text-align:left}html[dir=rtl] .spec tbody td::before{text-align:right}}
/* Reviews: Arabic has no italic serif, so the quotes use Tajawal upright with room for the letters */
html[dir=rtl]{--serif:"Tajawal","Segoe UI",system-ui,sans-serif}
html[dir=rtl] .rv-quote,html[dir=rtl] .rv-q,html[dir=rtl] .rv-st-q,html[dir=rtl] .rv-track q,html[dir=rtl] .rv-tz-q p,html[dir=rtl] .rv-g p,html[dir=rtl] .rv-vcap b{font-style:normal;font-weight:300;line-height:1.45}
html[dir=rtl] .rv-h1{line-height:1.2;text-transform:none}
html[dir=rtl] .rv-script{margin:6px clamp(60px,14vw,260px) 0 0}
@media (max-width:600px){html[dir=rtl] .rv-script{margin-right:56px;margin-left:0}}
html[dir=rtl] .rv-snav span[aria-hidden],html[dir=rtl] .rv-st-nav span[aria-hidden]{display:inline-block;transform:scaleX(-1)}
/* Latin-only captions are wrapped in an LTR isolate by i18n.js; let their parts keep the caption's own spacing */
html[dir=rtl] .rv-sq footer>bdi,html[dir=rtl] .rv-vcap>bdi,html[dir=rtl] .rv-tz-q figcaption>bdi,html[dir=rtl] .rv-g figcaption>bdi{display:contents}
html[dir=rtl] .dl-h1{line-height:1.15;margin-top:30px;letter-spacing:0}
html[dir=rtl] .dl-h1 .dl-thin,html[dir=rtl] .dl-quote,html[dir=rtl] .dl-tiles b,html[dir=rtl] .dl-pop-h,html[dir=rtl] .dl-pillars h3,html[dir=rtl] .dl-list b{font-style:normal;line-height:1.4}
html[dir=rtl] .dl-quote{font-weight:300;line-height:1.45}
