/* ===== Arabic: its own typefaces, right to left, no letter spacing (it would break the joined letters) ===== */
@font-face{font-family:'Markazi Text';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/markazi-text-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-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}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/plex-sans-arabic-300.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-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}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plex-sans-arabic-400.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-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}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500 600;font-display:swap;src:url(../fonts/plex-sans-arabic-500.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-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}
html[lang=ar]{--serif:"Markazi Text","Instrument Serif",Georgia,serif;--sans:"IBM Plex Sans Arabic","Inter Tight",system-ui,sans-serif;--mono:"IBM Plex Sans Arabic","IBM Plex Mono",ui-monospace,monospace}
html[lang=ar] body *{letter-spacing:0 !important}
html[lang=ar] body{line-height:1.7}
html[lang=ar] .mono,html[lang=ar] .nav,html[lang=ar] .nav-shop,html[lang=ar] .link-arrow,html[lang=ar] .room-meta,html[lang=ar] .chip,html[lang=ar] .steps,html[lang=ar] .field>span,html[lang=ar] .btn,html[lang=ar] .cta{font-size:13px}
html[lang=ar] .nav{font-size:13.5px}
html[lang=ar] .langs a:not([lang=ar]){font-family:"IBM Plex Mono",monospace;font-size:9.5px}
html[lang=ar] .hero-title{line-height:1.2;font-size:clamp(46px,7.4vw,118px)}
html[lang=ar] .hero-title em{font-style:normal}
html[lang=ar] .serie-title{line-height:1.05}
html[lang=ar] .room-desc p:first-child{font-size:clamp(20px,1.7vw,24px);line-height:1.6}

/* right to left: the pieces placed with left/right */
[dir=rtl] .hero-title{left:auto;right:var(--gutter)}
[dir=rtl] .hero-meta{right:auto;left:var(--gutter);text-align:left}
[dir=rtl] .room-count{left:auto;right:var(--gutter)}
[dir=rtl] .room-close{right:auto;left:var(--gutter)}
[dir=rtl] .room-arrow.prev{left:auto;right:var(--gutter)}
[dir=rtl] .room-arrow.next{right:auto;left:var(--gutter)}
[dir=rtl] .hinge{transform-origin:right center;transform:perspective(1400px) rotateY(100deg)}
[dir=rtl] .hinge.closed,html[dir=rtl].hinge-in .hinge{transform:perspective(1400px) rotateY(0deg)}
html[dir=rtl].hinge-in.hinge-open .hinge{transform:perspective(1400px) rotateY(100deg)}
[dir=rtl] .link-arrow::after{transform:scaleX(-1)}
[dir=rtl] .pr-light{left:42%}
/* the home showcases keep their composition; only their texts read right to left */
[dir=rtl] .showcase .sc-body{direction:ltr}
[dir=rtl] .showcase .sc-body :is(p,h2,h3,b,span,figcaption){unicode-bidi:plaintext}
