/* Right-to-left overrides, layered on top of editorial.css.
   Loaded only by Arabic pages, so LTR pages are untouched. */
html[dir="rtl"] body{font-family:'IBM Plex Sans Arabic','DM Sans',sans-serif;letter-spacing:0}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] .brand{
  font-family:'IBM Plex Sans Arabic','Manrope',sans-serif;letter-spacing:0}

/* Arabic script needs more line height than the Latin defaults allow. */
html[dir="rtl"] p,html[dir="rtl"] li,html[dir="rtl"] .faq-answer p{line-height:1.95}
html[dir="rtl"] h1{line-height:1.45}
html[dir="rtl"] h2,html[dir="rtl"] h3{line-height:1.5}

/* Mirror anything anchored to a physical side. */
html[dir="rtl"] .crumbs,html[dir="rtl"] .byline,html[dir="rtl"] nav,
html[dir="rtl"] .faq-nav,html[dir="rtl"] header{direction:rtl}
html[dir="rtl"] .faq-item summary{flex-direction:row}
html[dir="rtl"] .faq-answer{padding:0 0 20px 44px}
html[dir="rtl"] .faq-disclaimer{border-left:0;border-right:3px solid var(--gold)}
html[dir="rtl"] .scope ul,html[dir="rtl"] .prose ul,html[dir="rtl"] .prose ol{padding-left:0;padding-right:20px}
html[dir="rtl"] .composite,html[dir="rtl"] .review{border-left:0;border-right:3px solid var(--mint)}
html[dir="rtl"] .prose blockquote{border-left:0;border-right:3px solid var(--line);padding-left:0;padding-right:16px}

/* The brand stays Latin inside an RTL line. */
html[dir="rtl"] .brand{direction:ltr;unicode-bidi:isolate}
html[dir="rtl"] .footer-contact a{unicode-bidi:isolate}

/* The language switch is the opposite script by definition — isolate it. */
.lang-switch{unicode-bidi:isolate;border:1px solid #33506a;border-radius:4px;padding:5px 10px;font-size:12px}
.lang-switch:hover{border-color:var(--gold);color:var(--gold)}

/* ── Homepage (/ar/), layered on styles.css ─────────────────────────────────
   styles.css was written left-to-right; these mirror what is anchored to a
   physical side. Grids and flex rows reverse on their own under dir="rtl". */

/* Arabic type everywhere styles.css uses its font variables. */
html[dir="rtl"]{--serif:'IBM Plex Sans Arabic','Manrope',sans-serif;--body:'IBM Plex Sans Arabic','DM Sans',sans-serif}
/* Letter-spacing breaks the joins between Arabic letters, and uppercase does nothing. */
html[dir="rtl"] body *{letter-spacing:0!important}
html[dir="rtl"] .problem-strip,html[dir="rtl"] .price span,html[dir="rtl"] .report-score span{text-transform:none}
html[dir="rtl"] .hero h1{font-size:clamp(40px,4.8vw,70px);line-height:1.3}
html[dir="rtl"] .section-intro h2,html[dir="rtl"] .lawyer-section h2,html[dir="rtl"] .tools-section h2,
html[dir="rtl"] .assessment-copy h2,html[dir="rtl"] .network-head h2,html[dir="rtl"] .legal-boundary h2{line-height:1.3}
html[dir="rtl"] em{font-style:normal}

/* Header and hero */
html[dir="rtl"] .topbar .brand{margin-right:0;margin-left:16px}
/* Arabic nav labels run wider than the English ones; keep them on one line and
   tighten the desktop header rather than letting labels wrap onto two lines. */
html[dir="rtl"] .topbar nav a,html[dir="rtl"] .topbar nav button,html[dir="rtl"] .nav-cta{white-space:nowrap}
@media(min-width:1001px){html[dir="rtl"] .topbar nav{gap:16px}}
@media(min-width:1001px) and (max-width:1150px){
  html[dir="rtl"] .topbar nav a,html[dir="rtl"] .topbar nav button{font-size:13px}
  html[dir="rtl"] .nav-cta{padding:10px 13px}
}
html[dir="rtl"] .nav-cta span,html[dir="rtl"] .lawyer-copy button span{margin-left:0;margin-right:8px}
html[dir="rtl"] .trust-row b{margin-right:0;margin-left:7px}
html[dir="rtl"] .live-dot{margin-right:0;margin-left:9px}
html[dir="rtl"] .send-btn{margin-left:0;margin-right:auto}
html[dir="rtl"] .signal-bars{margin-right:0;margin-left:12px}
html[dir="rtl"] .hero-rotator button{text-align:right}

/* Sections */
html[dir="rtl"] .steps article>span{right:auto;left:18px}
html[dir="rtl"] .tool-card,html[dir="rtl"] .role-picker button,html[dir="rtl"] .profile-card button{text-align:right}
html[dir="rtl"] .profile-card button span{float:left}
html[dir="rtl"] .tool-result{border-left:0;border-right:4px solid var(--mint)}
html[dir="rtl"] .tool-result ul,html[dir="rtl"] .tool-result ol,html[dir="rtl"] .terms-dialog ul,
html[dir="rtl"] .issue-box ul,html[dir="rtl"] .message.ai ul,html[dir="rtl"] .message.ai ol{padding-left:0;padding-right:20px}
html[dir="rtl"] .report-preview{transform:rotate(-1.2deg)}
html[dir="rtl"] .report-head small,html[dir="rtl"] .report-score i,html[dir="rtl"] .selected-status{margin-left:0;margin-right:auto}
html[dir="rtl"] .lawyer-copy li:before{margin-right:0;margin-left:12px}
html[dir="rtl"] .account-aside li:before{margin-right:0;margin-left:9px}
html[dir="rtl"] .comparison-row span,html[dir="rtl"] .comparison-row strong{border-left:0}
html[dir="rtl"] .comparison-row span{border-right:1px solid #e5e9e7}
html[dir="rtl"] .comparison-row strong{border-right:1px solid #cae6df}
html[dir="rtl"] .sample-tag{right:auto;left:16px}
html[dir="rtl"] .case-summary>div+div{border-left:0;border-right:1px solid var(--line)}
html[dir="rtl"] .scope-note{border-left:0;border-right:4px solid var(--gold)}
html[dir="rtl"] .preview-notice{border-left:0;border-right:4px solid var(--mint)}
html[dir="rtl"] .faq-section .faq-answer{padding:0 0 0 24px}

/* Navigator dialog */
html[dir="rtl"] .chat-layout aside{border-right:0;border-left:1px solid var(--line)}
html[dir="rtl"] .chat-layout .case-panel{border-left:0!important;border-right:1px solid var(--line)!important}
html[dir="rtl"] .chat-layout aside li:before{margin-right:0;margin-left:10px}
html[dir="rtl"] .messages{padding-right:0;padding-left:5px}
html[dir="rtl"] .message.user{margin-left:0;margin-right:auto}
html[dir="rtl"] .chat-input #chatVoiceBtn{margin-right:0;margin-left:7px}
html[dir="rtl"] .nav-urgency{border-left:0;border-right:3px solid #d0892f}
html[dir="rtl"] .plain-close,html[dir="rtl"] .terms-close,html[dir="rtl"] .checkout-close,
html[dir="rtl"] .account-close,html[dir="rtl"] .profile-close{right:auto;left:15px}

/* Footer links */
html[dir="rtl"] footer>div>a{margin-left:0;margin-right:24px}

@media(max-width:700px){
  html[dir="rtl"] footer>div>a{margin:0 0 0 20px}
  html[dir="rtl"] .case-summary>div+div{border-right:0}
}