/* Site-wide RTL layout when Arabic is active */
@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&display=swap");

html[dir="rtl"] {
  --font-heading: "Cairo", sans-serif;
  --font-body: "Cairo", sans-serif;
}

html[dir="rtl"] body {
  font-family: var(--font-body);
  text-align: right;
}

html[dir="rtl"] .nav,
html[dir="rtl"] body.page-contact,
html[dir="rtl"] body.page-web,
html[dir="rtl"] body.page-services,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] p,
html[dir="rtl"] a,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] label,
html[dir="rtl"] .mobile-tab-label,
html[dir="rtl"] .section-tag,
html[dir="rtl"] .section-title,
html[dir="rtl"] .tag,
html[dir="rtl"] .about-tag {
  font-family: var(--font-body);
}

/* Keep handwritten accent on about image */
html[dir="rtl"] .grow,
html[dir="rtl"] .grow span {
  font-family: "Caveat", cursive;
}

/* ---- Nav pill: logo right, links center, actions left ---- */
html[dir="rtl"] .site-header .nav {
  direction: rtl;
}

html[dir="rtl"] .btn-primary,
html[dir="rtl"] .btn-primary1,
html[dir="rtl"] .about-btn a,
html[dir="rtl"] .services-btn a,
html[dir="rtl"] .contact-form button {
  background: var(--gradient-button-rtl);
}

html[dir="rtl"] .footer-cta-zone .cta-btn {
  background: var(--nav-white);
  color: var(--nav-rebecca);
}

html[dir="rtl"] .nav-links {
  direction: rtl;
  flex-direction: row;
}

html[dir="rtl"] .nav-links a {
  text-align: right;
}

html[dir="rtl"] .nav-links a::after {
  left: auto;
  right: 0;
  transform-origin: right center;
}

html[dir="rtl"] .nav-actions {
  direction: rtl;
  flex-direction: row;
}

html[dir="rtl"] .nav-logo {
  margin-inline-end: 0;
}

html[dir="rtl"] .nav-toggle {
  margin-inline-start: 0;
  margin-inline-end: auto;
}

html[dir="rtl"] .mobile-tabbar {
  direction: rtl;
}

/* ---- Home section headers: services, projects, testimonials ---- */
html[dir="rtl"] .page-home .services-header,
html[dir="rtl"] .page-home .projects-header,
html[dir="rtl"] .page-home .testimonial-header {
  direction: rtl;
  flex-direction: row;
  text-align: right;
}

html[dir="rtl"] .page-home .services-header .left,
html[dir="rtl"] .page-home .projects-header > div,
html[dir="rtl"] .page-home .testimonial-header > div {
  text-align: right;
}

html[dir="rtl"] .page-home .section-tag {
  flex-direction: row-reverse;
}

html[dir="rtl"] .page-home .services-header h2,
html[dir="rtl"] .page-home .services-lede,
html[dir="rtl"] .page-home .projects-header h2,
html[dir="rtl"] .page-home .projects-header .section-title,
html[dir="rtl"] .page-home .projects .section-title,
html[dir="rtl"] .page-home .testimonial-header h2,
html[dir="rtl"] .page-home .testimonial-header .section-title,
html[dir="rtl"] .page-home .testimonials .section-title {
  text-align: right;
  font-weight: 600;
}

html[dir="rtl"] .page-home .services-lede {
  margin-left: 0;
  margin-right: 0;
}

html[dir="rtl"] .page-home .service-card {
  text-align: right;
}

/* Mirror hero photo only — not text, cards, or buttons inside .main-hero */
html[dir="rtl"] .page-home .main-hero::before {
  transform: scaleX(-1);
}

/* ---- Home stats strip ---- */
html[dir="rtl"] .page-home .stats {
  background: linear-gradient(270deg, #e4dbff, #c6a9e1);
}

html[dir="rtl"] .page-home .stats-container {
  direction: rtl;
}

html[dir="rtl"] .page-home .stat-box {
  direction: rtl;
  flex-direction: row;
  text-align: right;
}

html[dir="rtl"] .page-home .stat-box .text {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
}

html[dir="rtl"] .page-home .stat-box h2,
html[dir="rtl"] .page-home .stat-box p {
  text-align: right;
  line-height: 1.15;
}

html[dir="rtl"] .about-image1 img {
  scale: -1 1;
}

/* ---- About block (home): text right, image left ---- */
html[dir="rtl"] .about-container {
  direction: rtl;
  flex-direction: row;
}

html[dir="rtl"] .about-content {
  text-align: right;
  align-items: flex-end;
}

html[dir="rtl"] .about-tag {
  flex-direction: row-reverse;
}

html[dir="rtl"] .about-btn {
  align-items: flex-end;
}

html[dir="rtl"] .about-btn a {
  flex-direction: row-reverse;
}

html[dir="rtl"] .grow {
  right: auto;
  left: -180px;
  align-items: flex-end;
}

html[dir="rtl"] .grow img {
  margin-right: 48px;
}

html[dir="rtl"] .page-home .about-image::after {
  content: "عضو الفريق\A مطور ويب";
  left: auto;
  right: 3%;
  direction: rtl;
  text-align: right;
  padding: 19px 68px 19px 52px;
}

html[dir="rtl"] .page-home .about-image > img {
  scale: -1 1;
}

html[dir="rtl"] .page-home .about-image::before {
  scale: -1 1;
  right: auto;
  left: 2%;
}

html[dir="rtl"] .page-home .about-image .dots {
  right: auto;
  left: -2%;
}

@media (max-width: 992px) {
  html[dir="rtl"] .page-home .about-image::before {
    left: 12%;
  }

  html[dir="rtl"] .page-home .about-image .dots {
    left: 10%;
  }

  html[dir="rtl"] .page-home .about-image::after {
    left: auto;
    right: 18%;
  }
}

@media (max-width: 768px) {
  html[dir="rtl"] .page-home .about-image::before {
    left: 5%;
  }

  html[dir="rtl"] .page-home .about-image .dots {
    left: 0;
  }

  html[dir="rtl"] .page-home .about-image::after {
    left: auto;
    right: 5%;
    padding: 15px 57px 15px 42px;
  }
}

@media (max-width: 480px) {
  html[dir="rtl"] .page-home .about-image::before {
    left: 1%;
  }

  html[dir="rtl"] .page-home .about-image::after {
    left: auto;
    right: 0;
    padding: 13px 52px 13px 37px;
  }
}

html[dir="rtl"] .about-image .shape {
  right: auto;
  left: 30px;
}

html[dir="rtl"] .about-image .dots {
  right: auto;
  left: -20px;
}

html[dir="rtl"] .about-container1 {
  direction: rtl;
}

html[dir="rtl"] .about-content1 {
  align-items: flex-end;
}

/* ---- About page hero ---- */
html[dir="rtl"] .page-about .about-hero .hero-content1 {
  text-align: right;
  align-items: flex-start;
}

html[dir="rtl"] .page-about .about-hero .section-title {
  flex-direction: row-reverse;
  justify-content: flex-end;
}

html[dir="rtl"] .page-about .about-hero .hero-content1 h1,
html[dir="rtl"] .page-about .about-hero .hero-content1 p {
  text-align: right;
}

html[dir="rtl"] .page-about .about-hero .hero-buttons {
  direction: rtl;
  flex-direction: row;
}

html[dir="rtl"] .page-about .about-hero .btn-primary1,
html[dir="rtl"] .page-about .about-hero .btn-secondary1 {
  flex-direction: row-reverse;
}

html[dir="rtl"] .page-about .about-hero .overlay {
  background: var(--gradient-about-hero-overlay-rtl);
}

html[dir="rtl"] .about-tag1 {
  flex-direction: row-reverse;
}

html[dir="rtl"] .process-line {
  top: 140px;
}

html[dir="rtl"] .hero-content,
html[dir="rtl"] .hero-content h1,
html[dir="rtl"] .hero-content p,
html[dir="rtl"] .tag,
html[dir="rtl"] .hero-actions,
html[dir="rtl"] .about-content,
html[dir="rtl"] .services-content,
html[dir="rtl"] .cta-text,
html[dir="rtl"] .contact-left,
html[dir="rtl"] .legal-content,
html[dir="rtl"] .error-page {
  text-align: right;
}

/* ---- Services page hero stats ---- */
html[dir="rtl"] .page-services .services-stats {
  direction: rtl;
  justify-content: flex-start;
}

html[dir="rtl"] .page-services .stat-item {
  text-align: right;
}

html[dir="rtl"] .page-services .stat-info {
  align-items: flex-end;
  text-align: right;
}

html[dir="rtl"] .page-services .stat-info strong,
html[dir="rtl"] .page-services .stat-info span {
  text-align: right;
}

html[dir="rtl"] .page-services .services-buttons .explore-btn {
  flex-wrap: nowrap;
  align-items: center;
  white-space: nowrap;
}

html[dir="rtl"] .page-services .services-buttons .explore-btn .arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  height: 1em;
  transform: scaleX(-1) translateY(0.08em);
}

html[dir="rtl"] .page-services .services-buttons .explore-btn:hover .arrow {
  transform: scaleX(-1) translateY(0.08em) translateX(7px);
}

html[dir="rtl"] .hero-wrapper {
  direction: rtl;
}

/* ---- Home hero actions (buttons + reviews) ---- */
html[dir="rtl"] .page-home .hero-actions {
  direction: rtl;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: right;
}

html[dir="rtl"] .page-home .hero-actions .hero-buttons {
  direction: rtl;
  flex-direction: row;
}

html[dir="rtl"] .page-home .hero-actions .btn-primary,
html[dir="rtl"] .page-home .hero-actions .btn-secondary {
  flex-direction: row-reverse;
}

html[dir="rtl"] .page-home .hero-actions .reviews {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .page-home .hero-actions .reviews > div:last-child {
  text-align: right;
}

html[dir="rtl"] .page-home .hero-actions .users {
  flex-direction: row-reverse;
}

html[dir="rtl"] .hero-content h1 .hero-accent,
html[dir="rtl"] .hero-content h1 .hero-accent {
  background: var(--gradient-text-accent-rtl);
  -webkit-background-clip: text;
  line-height: 1.25;
}

html[dir="rtl"] .hero-content h1 [data-admin-field="heading"] {
  line-height: 1.25;
}

html[dir="rtl"] .laptop {
  scale: -1 1;
}

@media (max-width: 768px) {
  html[dir="rtl"] .card3 {
    top: 50%;
  }

  html[dir="rtl"] .card1 {
    top: 23%;
  }
}

html[dir="rtl"] .stars {
  margin-bottom: -10px;
}

/* ---- Home hero floating info cards (mirror positions per breakpoint) ---- */
html[dir="rtl"] .page-home .hero-image .info-card {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .page-home .hero-image .card1 {
  left: auto;
  right: -40px;
}

html[dir="rtl"] .info-card {
  padding: 5px 16px;
}

html[dir="rtl"] .page-home .hero-image .card2 {
  right: auto;
  left: -30px;
}

html[dir="rtl"] .page-home .hero-image .card3 {
  left: auto;
  right: 140px;
}

html[dir="rtl"] .page-home .hero-image .card4 {
  right: auto;
  left: -15px;
}

html[dir="rtl"] .cta-box h2 .cta-text h2 {
  text-align: right;
}

html[dir="rtl"] .info-card.gg.card4.fade-up.show {
  bottom: -15px;
}

@media (max-width: 992px) {
  html[dir="rtl"] .page-home .hero-image .card1 {
    left: auto;
    right: 20px;
  }

  html[dir="rtl"] .page-home .hero-image .card2 {
    right: auto;
    left: 20px;
  }

  html[dir="rtl"] .page-home .hero-image .card3 {
    left: auto;
    right: 80px;
  }

  html[dir="rtl"] .page-home .hero-image .card4 {
    right: auto;
    left: 20px;
  }
}

html[dir="rtl"] .grow img,
html[dir="rtl"] .fa-arrow-right,
html[dir="rtl"] .fa-chevron-right,
html[dir="rtl"] .fa-circle-arrow-right {
  transform: scaleX(-1);
}

html[dir="rtl"] .why-choose {
  direction: rtl;
}

html[dir="rtl"] .why-choose .page,
html[dir="rtl"] .why-choose .header,
html[dir="rtl"] .why-choose .cards-grid,
html[dir="rtl"] .why-choose .comparison,
html[dir="rtl"] .why-choose .compare-col,
html[dir="rtl"] .why-choose .compare-col li,
html[dir="rtl"] .why-choose .card,
html[dir="rtl"] .why-choose .card-text {
  direction: rtl;
}

html[dir="rtl"] .why-choose .eyebrow {
  flex-direction: row-reverse;
}

html[dir="rtl"] .why-choose .card {
  text-align: right;
}

html[dir="rtl"] .why-choose .card-text {
  padding-right: 0;
  padding-left: 28px;
}

html[dir="rtl"] .why-choose .card-number {
  right: auto;
  left: 18px;
}

html[dir="rtl"] .why-choose .card::before {
  left: auto;
  right: 0;
  border-radius: 0 16px 16px 0;
}

html[dir="rtl"] .why-choose .comparison {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] .why-choose .compare-col {
  direction: rtl;
  text-align: right;

  flex-direction: column;
  align-items: flex-end;
}

html[dir="rtl"] .why-choose .compare-col h4,
html[dir="rtl"] .why-choose .compare-col li {
  text-align: right;
}

html[dir="rtl"] .why-choose .compare-col ul {
  direction: rtl;

  flex-direction: column;
  align-items: flex-end;
  width: 100%;
  margin: 0;
  padding: 0;
}

html[dir="rtl"] .why-choose .compare-col li {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  text-align: right;
  width: fit-content;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

html[dir="rtl"] .why-choose .mark {
  margin-left: 0;
  margin-right: 0;
}

html[dir="rtl"] .why-choose .compare-col li > *:not(.mark) {
  order: 1;
}

@media (max-width: 768px) {
  html[dir="rtl"] .our-process .steps::before {
    content: "";
    position: absolute;
    right: 19px;
    top: 28px;
    bottom: 28px;
    width: 2px;
    background: var(--color-border-process);
    border-radius: 2px;
    z-index: 0;
    left: auto;
  }

  html[dir="rtl"] .our-process .steps {
    padding: 0 52px 0 0;
  }

  html[dir="rtl"] .our-process .icon-circle {
    position: absolute;
    right: -54px;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    margin: 0;
    background: var(--color-border-neutral);
    border: none;
    border-radius: 30px;
    box-shadow: none;
    z-index: 2;
  }

  html[dir="rtl"] .grow {
    right: auto;
    left: 30px;
    align-items: flex-end;
  }

  html[dir="rtl"] .page-home .about-content p {
    padding: 0 24px 46px;
  }
}

@media (max-width: 768px) {
  html[dir="rtl"] .why-choose .header {
    text-align: center;
  }

  html[dir="rtl"] .why-choose .card {
    direction: rtl;
  }

  html[dir="rtl"] .why-choose .card-text {
    padding-right: 0;
    padding-left: 32px;
    text-align: right;
  }

  html[dir="rtl"] .why-choose .card-number {
    right: auto;
    left: 14px;
  }

  html[dir="rtl"] .why-choose .compare-col {
    text-align: right;
  }

  html[dir="rtl"] .why-choose .compare-col ul {
    align-items: flex-end;
    width: 100%;
  }

  html[dir="rtl"] .why-choose .compare-col li {
    justify-content: flex-end;
    text-align: right;
    width: fit-content;
    max-width: 100%;
  }
}

html[dir="rtl"] .projects-grid,
html[dir="rtl"] .testimonial-grid {
  direction: rtl;
}

html[dir="rtl"] .contact-info-card .arrow-icon {
  transform: scaleX(-1);
}

/* ---- Contact page ---- */
@keyframes contactArrowMoveRtl {
  0%,
  100% {
    transform: scaleX(-1) translateY(-50%) translateX(0);
  }

  50% {
    transform: scaleX(-1) translateY(-50%) translateX(-18px);
  }
}

html[dir="rtl"] .page-contact .contact-container {
  direction: rtl;
}

html[dir="rtl"] .page-contact .contact-heading {
  text-align: right;
}

html[dir="rtl"] .page-contact .contact-left h1,
html[dir="rtl"] .page-contact .contact-left h1 .title-accent {
  text-align: right;
}

html[dir="rtl"] .page-contact .section-subtitle {
  padding-left: 0;
  padding-right: 36px;
}

html[dir="rtl"] .page-contact .section-subtitle::before {
  left: auto;
  right: 0;
}

/* Decorative curved arrow beside the heading — mirror to the left */
html[dir="rtl"] .page-contact .contact-heading .arrow {
  right: auto;
  left: 35px;
  transform: scaleX(-1) translateY(-50%);
  animation: contactArrowMoveRtl 3s ease-in-out infinite;
}

html[dir="rtl"] .page-contact .contact-info-card {
  flex-direction: row-reverse;
}

html[dir="rtl"] .page-contact .contact-info-card .info {
  margin-left: 0;
  margin-right: 12px;
  text-align: right;
}

html[dir="rtl"] .page-contact .contact-form,
html[dir="rtl"] .page-contact .contact-form h2,
html[dir="rtl"] .page-contact .contact-form p {
  text-align: right;
}

html[dir="rtl"] .page-contact .input-box i {
  left: auto;
  right: 18px;
}

html[dir="rtl"] .page-contact .input-box input,
html[dir="rtl"] .page-contact .input-box textarea {
  padding-left: 16px;
  padding-right: 49px;
  text-align: right;
}

/* ---- Contact page stats strip ---- */
html[dir="rtl"] .page-contact .contact-stats .stats-wrapper {
  direction: rtl;
}

html[dir="rtl"] .page-contact .contact-stats .stat-box {
  direction: rtl;
  flex-direction: row;
  text-align: right;
}

html[dir="rtl"] .page-contact .contact-stats .stat-box h2,
html[dir="rtl"] .page-contact .contact-stats .stat-box p {
  text-align: right;
}

html[dir="rtl"] .legal-content ul {
  padding-right: 1.2rem;
  padding-left: 0;
}

@media (max-width: 768px) {
  /* Beat home mobile `text-align: left !important` rules in style.css */
  html[dir="rtl"] .page-home .hero-content,
  html[dir="rtl"] .page-home .hero-content h1,
  html[dir="rtl"] .page-home .hero-content p,
  html[dir="rtl"] .page-home .tag {
    text-align: right !important;
    align-items: flex-end !important;
  }

  html[dir="rtl"] .page-home .hero-actions {
    text-align: right !important;
  }

  html[dir="rtl"] .page-home .hero-actions .hero-buttons {
    direction: rtl !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
  }

  html[dir="rtl"] .page-home .hero-actions .btn-primary,
  html[dir="rtl"] .page-home .hero-actions .btn-secondary {
    flex-direction: row-reverse !important;
  }

  html[dir="rtl"] .page-home .hero-actions .reviews {
    justify-content: flex-start !important;
    text-align: right !important;
  }

  html[dir="rtl"] .page-home .hero-actions .reviews > div:last-child,
  html[dir="rtl"] .page-home .hero-actions .reviews small {
    text-align: right !important;
  }

  html[dir="rtl"] .page-home .hero-buttons,
  html[dir="rtl"] .page-home .reviews {
    justify-content: flex-end !important;
  }

  html[dir="rtl"] .page-home .services-header,
  html[dir="rtl"] .page-home .projects-header,
  html[dir="rtl"] .page-home .testimonial-header {
    justify-content: flex-start !important;
    text-align: right !important;
    flex-direction: column !important;
  }

  html[dir="rtl"] .page-home .services-header .left,
  html[dir="rtl"] .page-home .projects-header > div,
  html[dir="rtl"] .page-home .testimonial-header > div {
    text-align: right !important;
    width: 100% !important;
  }

  html[dir="rtl"] .page-home .services-header h2,
  html[dir="rtl"] .page-home .services-lede,
  html[dir="rtl"] .page-home .projects-header h2,
  html[dir="rtl"] .page-home .testimonial-header h2,
  html[dir="rtl"] .page-home .projects-header .section-title,
  html[dir="rtl"] .page-home .testimonial-header .section-title,
  html[dir="rtl"] .page-home .projects .section-title,
  html[dir="rtl"] .page-home .testimonials .section-title {
    text-align: right !important;
  }

  html[dir="rtl"] .page-home .services-lede {
    margin-inline: 0 !important;
  }

  html[dir="rtl"] .page-about .about-hero {
    text-align: right !important;
  }

  html[dir="rtl"] .page-about .about-hero .hero-content1 {
    text-align: right !important;
  }

  html[dir="rtl"] .page-about .about-hero .section-title {
    justify-content: flex-end !important;
    flex-direction: row-reverse !important;
  }

  html[dir="rtl"] .page-about .about-hero .hero-content1 h1,
  html[dir="rtl"] .page-about .about-hero .hero-content1 p {
    text-align: right !important;
  }

  html[dir="rtl"] .page-about .about-hero .hero-buttons {
    direction: rtl !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
  }

  html[dir="rtl"] .page-about .about-hero .btn-primary1,
  html[dir="rtl"] .page-about .about-hero .btn-secondary1 {
    flex-direction: row-reverse !important;
  }

  html[dir="rtl"] .page-services .services-stats,
  html[dir="rtl"] .page-services .stat-item,
  html[dir="rtl"] .page-services .stat-info,
  html[dir="rtl"] .page-services .stat-info strong,
  html[dir="rtl"] .page-services .stat-info span {
    text-align: right !important;
  }

  html[dir="rtl"] .page-services .services-buttons .explore-btn {
    gap: 12px;
    justify-content: center;
  }

  html[dir="rtl"] .page-services .services-buttons .explore-btn .arrow {
    font-size: 22px;
    transform: scaleX(-1) translateY(0.12em);
  }

  html[dir="rtl"] .page-services .services-buttons .explore-btn:hover .arrow {
    transform: scaleX(-1) translateY(0.12em) translateX(7px);
  }

  /* Mobile stats: keep centered 2x2 cards — inner h2/p must stay visible */
  html[dir="rtl"] .page-home .stats,
  html[dir="rtl"] .page-home .stats-container {
    overflow: visible !important;
  }

  html[dir="rtl"] .page-home .stat-box {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: visible !important;
  }

  html[dir="rtl"] .page-home .stat-box .text {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-align: center !important;
  }

  html[dir="rtl"] .page-home .stat-box h2,
  html[dir="rtl"] .page-home .stat-box p {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-align: center !important;
    overflow-wrap: anywhere;
  }

  html[dir="rtl"] .hero-content,
  html[dir="rtl"] .hero-content h1,
  html[dir="rtl"] .hero-content p,
  html[dir="rtl"] .tag {
    text-align: right;
    align-items: flex-end;
  }

  html[dir="rtl"] .about-container,
  html[dir="rtl"] .about-content {
    align-items: flex-end;
    text-align: right;
  }

  html[dir="rtl"] .about-btn {
    align-items: flex-end;
  }

  html[dir="rtl"] .page-contact .contact-heading {
    padding-right: 0;
    padding-left: 90px;
  }

  html[dir="rtl"] .page-contact .contact-heading .arrow {
    left: -2px;
    right: auto;
    width: 70px;
    transform: scaleX(-1) translateY(-45%);
    animation: contactArrowMoveRtlMobile 3s ease-in-out infinite;
  }

  @keyframes contactArrowMoveRtlMobile {
    0%,
    100% {
      transform: scaleX(-1) translateY(-45%) translateX(0);
    }

    50% {
      transform: scaleX(-1) translateY(-45%) translateX(-12px);
    }
  }

  html[dir="rtl"] .page-home .hero-image .card1 {
    left: auto;
    right: 0;
    transform: translateY(-50%);
  }

  html[dir="rtl"] .page-home .hero-image .card2 {
    right: auto;
    left: 0;
  }

  html[dir="rtl"] .page-home .hero-image .card3 {
    right: 22px;
  }

  html[dir="rtl"] .page-home .hero-image .card4 {
    right: auto;
    left: 10px;
  }

  @media (max-width: 480px) {
    html[dir="rtl"] .page-home .hero-image .card1 {
      right: -2px;
    }

    html[dir="rtl"] .page-home .hero-image .card2 {
      left: -2px;
    }
  }
}

html[dir="rtl"] .cta-box h2,
html[dir="rtl"] .cta-text h2,
html[dir="rtl"] .cta-grid-heading,
html[dir="rtl"] .cta-box p,
html[dir="rtl"] .cta-text p,
html[dir="rtl"] .cta-grid-content {
  text-align: right;
}

/* ---- Single service template ---- */
html[dir="rtl"] .page-service .hero-content,
html[dir="rtl"] .page-service .hero-text,
html[dir="rtl"] .page-service .hero-text h1,
html[dir="rtl"] .page-service .hero-text p,
html[dir="rtl"] .page-service .service-headline,
html[dir="rtl"] .page-service .breadcrumb,
html[dir="rtl"] .page-service .service-card,
html[dir="rtl"] .page-service .service-card h3,
html[dir="rtl"] .page-service .service-card p,
html[dir="rtl"] .page-service .svc-more-header,
html[dir="rtl"] .page-service .svc-more-header h2,
html[dir="rtl"] .page-service .svc-more-header p,
html[dir="rtl"] .page-service .svc-more-card-body,
html[dir="rtl"] .page-service .svc-more-card-body h3,
html[dir="rtl"] .page-service .svc-more-card-body p,
html[dir="rtl"] .section-title h2 {
  text-align: right;
}

html[dir="rtl"] .page-service .hero-content,
html[dir="rtl"] .page-service .breadcrumb,
html[dir="rtl"] .page-service .hero-buttons,
html[dir="rtl"] .page-service .timeline,
html[dir="rtl"] .page-service .svc-more-card {
  direction: rtl;
}

html[dir="rtl"] .footer-top,
html[dir="rtl"] .footer-bottom,
html[dir="rtl"] .social-links,
html[dir="rtl"] .footer-legal {
  direction: rtl;
}

html[dir="rtl"] .footer-top,
html[dir="rtl"] .footer-bottom,
html[dir="rtl"] .footer-bottom p,
html[dir="rtl"] .footer-bottom a {
  text-align: right;
}

html[dir="rtl"] .social-links a::after {
  left: auto;
  right: 0;
}

html[dir="rtl"] .page-service .service-card::before {
  left: auto;
  right: -100%;
}

html[dir="rtl"] .page-service .service-card:hover::before {
  right: 0;
  left: auto;
}

html[dir="rtl"] .page-service .svc-more-card-link i {
  transform: scaleX(-1);
}

html[dir="rtl"] .page-service .svc-more-card:hover .svc-more-card-link i {
  transform: scaleX(-1) translateX(4px);
}

html[dir="rtl"] .page-contact .info > p {
  direction: ltr;
}

html[dir="rtl"] #all-services .service-card .service-link,
.service-link {
  direction: rtl;
}

html[dir="rtl"] .service-link > span {
  scale: -1 1;
}

html[dir="rtl"] .service-card:hover .service-link span,
html[dir="rtl"] .service-card.is-active .service-link span {
  transform: translateX(5px) scale(1.2);
}

@media (max-width: 768px) {
  html[dir="rtl"] .page-service .hero-text,
  html[dir="rtl"] .page-service .hero-text h1,
  html[dir="rtl"] .page-service .hero-text p,
  html[dir="rtl"] .page-service .service-headline,
  html[dir="rtl"] .page-service .breadcrumb {
    text-align: right !important;
  }

  html[dir="rtl"] .page-service .hero-text {
    align-items: stretch !important;
  }

  html[dir="rtl"] .page-service .hero-text .breadcrumb,
  html[dir="rtl"] .page-service .breadcrumb {
    align-self: stretch !important;
    justify-content: flex-start !important;
    text-align: right !important;
  }

  html[dir="rtl"] .page-service .hero-buttons {
    align-items: stretch;
    width: 100%;
  }

  html[dir="rtl"] .page-service .hero-buttons .primary-btn,
  html[dir="rtl"] .page-service .hero-buttons .secondary-btn {
    width: 100%;
    justify-content: center;
  }

  html[dir="rtl"] .page-service .svc-more-list {
    direction: rtl;
  }

  html[dir="rtl"] .page-service .svc-more-card {
    direction: rtl;
  }

  html[dir="rtl"] .page-service .service-card,
  html[dir="rtl"] .page-service .svc-more-header,
  html[dir="rtl"] .page-service .svc-more-card-body {
    text-align: right !important;
  }

  html[dir="rtl"] .page-web .section-title,
  html[dir="rtl"] .page-service .section-title,
  html[dir="rtl"] .technologies.cashflow .section-title,
  html[dir="rtl"] .technologies.cashflow .section-title h2 {
    text-align: right !important;
  }

  html[dir="rtl"] .page-web .section-title .line,
  html[dir="rtl"] .technologies.cashflow .section-title .line {
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  html[dir="rtl"] .technologies.cashflow .section-title h2 {
    letter-spacing: 0;
    text-transform: none;
    font-size: 22px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  html[dir="rtl"] .page-service .footer-top,
  html[dir="rtl"] .page-service .footer-bottom,
  html[dir="rtl"] .footer-top,
  html[dir="rtl"] .footer-bottom,
  html[dir="rtl"] .page-services .footer-top,
  html[dir="rtl"] .page-services .footer-bottom,
  html[dir="rtl"] .page-contact .contact-footer .footer-top,
  html[dir="rtl"] .page-contact .contact-footer .footer-bottom {
    direction: rtl !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: right !important;
  }

  html[dir="rtl"] .page-service .social-links,
  html[dir="rtl"] .page-service .footer-legal,
  html[dir="rtl"] .social-links,
  html[dir="rtl"] .footer-legal,
  html[dir="rtl"] .page-services .social-links,
  html[dir="rtl"] .page-contact .contact-footer .social-links {
    direction: rtl !important;
    justify-content: flex-start !important;
    text-align: right !important;
  }

  html[dir="rtl"] .footer-bottom p,
  html[dir="rtl"] .footer-bottom a {
    text-align: right !important;
  }

  html[dir="rtl"] .cta-box,
  html[dir="rtl"] .cta-text,
  html[dir="rtl"] .cta-box h2,
  html[dir="rtl"] .cta-text h2,
  html[dir="rtl"] .cta-grid-heading,
  html[dir="rtl"] .cta-box p,
  html[dir="rtl"] .cta-text p,
  html[dir="rtl"] .cta-grid-content,
  html[dir="rtl"] .page-service .cta-box,
  html[dir="rtl"] .page-web .cta-box,
  html[dir="rtl"] .page-service .cta-box h2,
  html[dir="rtl"] .page-web .cta-box h2,
  html[dir="rtl"] .page-service .cta-box p,
  html[dir="rtl"] .page-web .cta-box p {
    text-align: right !important;
  }

  html[dir="rtl"] .cta-box p,
  html[dir="rtl"] .cta-text p,
  html[dir="rtl"] .cta-grid-content {
    grid-column: auto !important;
  }
}
