/* Right-to-left (Arabic) fixes on top of style.css.
   Loaded only by /ar/ (html dir="rtl"); build.py adds the <link>. Flex/grid already mirror on their own;
   this file mirrors the things style.css pins to the left or right. */

/* Carousels keep left-to-right scrolling maths so the arrows work; the card content stays right-to-left */
.ftrack,.slider-track,.rq-track{direction:ltr}
.ftrack>*,.slider-track>*,.rq-track>*{direction:rtl}

/* Hero: photos on the left, search bar on the text side of the photos */
@media (min-width:961px){
  .hero-visual{justify-self:start;margin-right:0;margin-left:-40px}
  .search-pill{left:auto;right:-2%}
}
@media (min-width:961px) and (max-width:1320px){
  .hero-visual{margin-left:-24px}
  .search-pill{right:0}
}
@media (max-width:960px){.search-pill{left:auto;right:0}}

/* Proof row: separators and laurels mirrored */
.proof-item{padding:0 16px}
.proof-item:first-child{padding-left:16px;padding-right:0}
.proof-item+.proof-item{border-left:0;border-right:1px solid rgba(35,35,35,.15);padding-left:16px;padding-right:16px}
.proof-item .laurel{transform:scaleX(-1)}
.proof-item .laurel.r{transform:none}
@media (min-width:961px) and (max-width:1320px){
  .proof-item,.proof-item+.proof-item{padding:0 12px}.proof-item:first-child{padding-right:0}
}
@media (max-width:860px){
  .proof-item,.proof-item+.proof-item{padding:0 6px}.proof-item:first-child{padding-right:0}
}

/* Text that style.css aligns to the left */
.how .section-title,.reviews .section-title,.sci .section-title,.sci .section-lead,.qbtn,.pg-top{text-align:right}
.sci .section-title,.sci .section-lead{margin-left:auto;margin-right:0}
@media (max-width:860px){.how-item,.final-qr,.ft-mail{text-align:right}}
@media (min-width:861px){.ft-mail{text-align:left}}

/* Side-by-side offsets */
.qcol-l .qcard:nth-child(2){margin-left:-40px;margin-right:40px}
.qcol-r .qcard:nth-child(2){margin-right:-40px;margin-left:40px}
.qa{padding-left:0;padding-right:80px}
@media (max-width:860px){.qa{padding-right:18px}}
.pg-cal{margin-left:0;margin-right:auto}
.hr-time{text-align:left}
.final-b .final-art.art-b{margin-right:0;margin-left:-40px}

/* FAQ answer card: close button on the other corner */
.qoverlay-close{right:auto;left:16px}
.qoverlay-q{padding-right:0;padding-left:40px}
.qoverlay-body{padding-right:0;padding-left:8px}

/* Arrows that mean "go forward" point left */
.gd-more svg{transform:scaleX(-1)}
