/* ai-agent-rtl.css — RTL overrides for /ar/ai-payroll-agent.
   Loaded only on Arabic (rp_is_arabic()). Most mirroring is automatic:
   CSS grid flows right->left under [dir=rtl], so the hero columns, the feature
   splits (incl. the .is-rev alternation) and the 4-step row all mirror on their
   own; block text defaults to right-align. This file only pins the few things
   that don't fall out for free. Scope: .rp-aipa. */

/* HERO — the product visual must sit LEFT in AR (right in EN). The grid already
   places the message column on the right and the visual on the left under RTL;
   here we just flip the image's auto-margin so it hugs the left edge, and make
   the text explicitly right-aligned (belt-and-braces over the dir default). */
[dir="rtl"] .rp-aipa-hero__h1,
[dir="rtl"] .rp-aipa-hero__sub { text-align: right; }
[dir="rtl"] .rp-aipa-hero__visual img { margin-left: 0; margin-right: auto; }

/* Centred section headings stay centred (symmetric) — no rule needed for
   .rp-aipa-problem__h / .rp-aipa-featurelead__h / .rp-ent-features__h.
   Problem/capability card text right-aligns via icon-cards.css [dir=rtl] rules.
   Feature splits + stepper + CTA mirror via their own component RTL / grid dir.

   The 4-step connector is a symmetric horizontal dashed line, so it needs no
   mirroring; at <=991px it is suppressed for both locales by howitworks.css. */