/* Arabic case studies: right to left over case.css, as the Arabic home page does over its own (built by build_case_ar.py). */
/* Arabic is never tracked: letter spacing pulls its joined letters apart. Nor slanted. */
html[lang=ar] body *{letter-spacing:0!important;font-style:normal!important}
/* Arrows point the way the page reads. */
html[dir=rtl] .ph-arrow-right:before,html[dir=rtl] .ph-arrow-left:before,html[dir=rtl] .ph-arrow-up-right:before{display:inline-block;transform:scaleX(-1)}
/* Small labels: English sets them in tracked capitals; Arabic has neither, so it takes a size up. */
html[lang=ar] .overline,html[lang=ar] .facts dt{font-size:13px;text-transform:none}
html[lang=ar] .facts dt{padding-top:1px}
/* Text runs from the right edge: Chrome justifies Arabic with wide word gaps rather than kashida (as on the home page). */
html[lang=ar] .lead,html[lang=ar] .prose p{text-align:start;-webkit-hyphens:none;hyphens:none}
html[dir=rtl] .start{text-align:right}
/* Room for the letters, as on the home page: Safari paints a box that moves, fades or clips only inside that box, and
   Arabic reaches further past the line than Latin. Padding, given back as negative margin, so nothing moves. */
.hcta-t>span,.site-nav .nl{padding:.3em 0;margin:-.3em 0}
/* Every line reaches as far as its letters (see ar-head.html): Safari otherwise paints over dots and tails next to a redraw. */
:where(html[lang=ar] body,html[lang=ar] body *:not([style*="text-shadow"],[style*="text-shadow"] *,svg,svg *)){text-shadow:.3em .6em transparent,-.3em -.45em transparent}
html[lang=ar] svg,html[lang=ar] svg *{text-shadow:none!important}
.rv>h2{padding-bottom:.35em;margin-bottom:-.35em}
.rv>p:last-child,.rv figcaption{padding-bottom:.25em;margin-bottom:-.25em}
html[dir=rtl] .frame-bar{padding:0 16px 0 10px}
html[dir=rtl] .showcase .phone{right:auto;left:0}
@media (max-width:599px){html[dir=rtl] .showcase .phone{left:-4px}}
/* Footer: the tagline under the names, breaking after "الإلكترونية،" on phones, as on the home page. */
html[lang=ar] .site-foot .facr{font-size:12px;font-weight:500;text-transform:none}
html[lang=ar] .site-foot .facr .cursor{color:var(--copper);font-weight:600}
@media (min-width:600px){html[lang=ar] .site-foot .facr{align-self:center}}
.site-foot .fbr{display:none}
@media (max-width:599px){.site-foot .fbr{display:inline}}
/* Cursors keep their room on the side facing the text (set per letter by case-menu-ar.js; this is the common case). */
html[dir=rtl] .cursor,html[dir=rtl] .cm .cursor{margin-left:0;margin-right:.05em}
html[dir=rtl] .cm-cases{padding-left:0;padding-right:12px}
html[dir=rtl] .cm-cases::before{left:auto;right:0}
html[dir=rtl] .cm-case,html[dir=rtl] .cm-mail{margin-right:0;margin-left:-16px;padding:8px 8px 8px 16px}
html[dir=rtl] .cm-case:hover>i{transform:translateX(-3px)}
html[dir=rtl] .cm-talk>span{padding:0 12px 0 10px}
