/* Language-specific typography (all non-English pages) and right-to-left layout (Arabic) */

/* ---------- fonts & rhythm ---------- */
html[lang=ar]{--serif:'Noto Naskh Arabic','Amiri','Times New Roman',serif;--sans:'IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif}
html[lang=zh]{--serif:'Noto Serif SC','Songti SC','STSong','SimSun',serif;--sans:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif}
html[lang=ar] *,html[lang=ar] *::before,html[lang=ar] *::after{letter-spacing:0!important;text-transform:none!important}   /* tracking breaks Arabic letter joining */
html[lang=zh] *,html[lang=zh] *::before,html[lang=zh] *::after{letter-spacing:.04em!important;text-transform:none!important}
html[lang=ar] body{line-height:1.95}
html[lang=zh] body{line-height:1.85}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] h4{font-weight:500;line-height:1.4}
html[lang=zh] h1,html[lang=zh] h2,html[lang=zh] h3,html[lang=zh] h4{font-weight:400;line-height:1.3}
html[lang=zh] .hc2 h1{font-weight:300}
html[lang=zh],html[lang=ja]{word-break:normal;line-break:strict}
html[lang=fr],html[lang=de]{hyphens:auto}
html[lang=fr] .btn,html[lang=de] .btn{letter-spacing:.09em;padding-inline:26px}
html[lang=fr] .nav,html[lang=de] .nav{gap:26px}
html[lang=fr] .nav a,html[lang=de] .nav a{letter-spacing:.1em}
html[lang=de] h1,html[lang=de] h2,html[lang=de] h3{overflow-wrap:break-word;hyphens:auto}
/* small caps-style labels are unreadable at tiny sizes in Arabic / Chinese */
html[lang=ar] :is(.eyebrow,.tabs span,.pilltabs button,.cat-tabs a,.badge,.tag,.ph-photos,.pin span,.mp-body small,.slide-txt small,.ftr-guides b,.social a,.byline,.amen-grid span,.chap a,.nav a,.btn,.link-arrow,.search label,.filters label,.form label,.details dt,.mp-stats div span,.stats-grid span,.mf label){font-size:.86rem}
html[lang=ar] .nav a{font-size:.92rem}
html[lang=zh] :is(.eyebrow,.tabs span,.pilltabs button,.cat-tabs a,.badge,.tag,.chap a,.search label,.filters label,.form label,.details dt,.stats-grid span){font-size:.8rem}

/* ---------- right to left ---------- */
html[dir=rtl] .hdr .hdr-in{padding:0 28px 0 10px}
html[dir=rtl] .nav a::after{left:auto;right:0}
html[dir=rtl] .slide-n{left:auto;right:20px}
html[dir=rtl] .rows a:hover{padding-left:0;padding-right:18px}
html[dir=rtl] .rows a:hover .r-ar{transform:translateX(-8px)}
html[dir=rtl] .faq summary{padding:26px 0 26px 44px}
html[dir=rtl] .faq summary::after{right:auto;left:4px}
html[dir=rtl] .wa-fab{right:auto;left:22px}
html[dir=rtl] .badge{left:auto;right:14px}
html[dir=rtl] .badge-dark{right:auto;left:14px}
html[dir=rtl] .ph-photos{right:auto;left:28px}
html[dir=rtl] .ph .cue{right:auto;left:34px}
html[dir=rtl] .chap{left:auto;right:22px}
html[dir=rtl] .chap span{transform:translateX(6px)}
html[dir=rtl] .st-fig em{left:auto;right:24px}
html[dir=rtl] .details dd{text-align:left}
html[dir=rtl] .costs td:last-child{text-align:left}
html[dir=rtl] .lb .x{right:auto;left:14px}
html[dir=rtl] .lb .p{left:auto;right:10px}
html[dir=rtl] .lb .n{right:auto;left:10px}
html[dir=rtl] .prose-lg ul{padding-left:0;padding-right:1.2em}
html[dir=rtl] .pbar-in{padding:8px 20px 8px 8px}
/* arrows point the other way */
html[dir=rtl] .link-arrow svg,html[dir=rtl] .btn svg use[href="#i-arrow"],html[dir=rtl] svg:has(use[href="#i-arrow"]){transform:scaleX(-1)}
/* numbers, phone numbers, emails and sliders stay left-to-right */
html[dir=rtl] a[href^="tel:"],html[dir=rtl] a[href^="mailto:"]{direction:ltr;unicode-bidi:isolate;display:inline-block}
html[dir=rtl] .mtg .box,html[dir=rtl] .mtg input[type=range],html[dir=rtl] .mtg .mtg-out b,html[dir=rtl] .costs td:last-child,html[dir=rtl] .stats-grid b{direction:ltr}
html[dir=rtl] .mtg .mtg-out b,html[dir=rtl] .stats-grid b{unicode-bidi:isolate}
html[dir=rtl] .price bdi{unicode-bidi:isolate}
html[dir=rtl] input[type=number],html[dir=rtl] input[type=tel],html[dir=rtl] input[type=email]{text-align:left}
html[dir=rtl] .dmap{direction:ltr}
html[dir=rtl] .dmap .pin span{unicode-bidi:plaintext}
@media (max-width:900px){
  html[dir=rtl] .hdr .hdr-in{padding:0 20px 0 6px}
  html[dir=rtl] .r-p{text-align:left}
  html[dir=rtl] .ph-photos{left:18px}
}
@media (max-width:620px){
  html[dir=rtl] .info::after{left:auto;right:0}
}

html[dir=rtl] .cookie-in{text-align:right}

html[dir=rtl] .pop-x{right:auto;left:12px}
html[dir=rtl] .pop-corner{right:auto;left:var(--inset)}
html[dir=rtl] .pop-bar .pop-card{padding:12px 20px 12px 56px}
html[dir=rtl] .pop-bar .pop-x{left:12px;right:auto}
html[dir=rtl] .gl-reset{left:auto;right:14px}
html[dir=rtl] .gl-tools{left:auto;right:14px}
html[dir=rtl] .gl-seg button,html[dir=rtl] .gl-reset{letter-spacing:0}
html[dir=rtl] .faq details p{padding:0 0 26px 44px}
html[dir=rtl] .tcard blockquote{text-align:right}
html[dir=rtl] .chat{right:auto;left:22px}
html[dir=rtl] .chat-panel,html[dir=rtl] .chat-teaser{right:auto;left:0}
html[dir=rtl] .cm-bot{align-self:flex-end;align-items:flex-end}html[dir=rtl] .cm-me{align-self:flex-start;align-items:flex-start}
html[dir=rtl] .cm-bot .cm-b{border-bottom-left-radius:18px;border-bottom-right-radius:5px}html[dir=rtl] .cm-me .cm-b{border-bottom-right-radius:18px;border-bottom-left-radius:5px}
html[dir=rtl] .chat-fab::after{right:auto;left:3px}
@media (max-width:620px){html[dir=rtl] .chat{left:14px;right:auto}}
html[dir=rtl] .chat-teaser{right:auto;left:74px;padding:14px 20px 14px 12px}
html[dir=rtl] .chat-teaser::after{right:auto;left:-6px}
@media (max-width:620px){html[dir=rtl] .chat-teaser{left:70px;right:auto}}
html[dir=rtl] .chat-teaser{padding:14px 10px 14px 12px;flex-direction:row}
html[dir=rtl] .chat-tav{margin:0 0 0 -2px}