/* ================================
   RTL OVERRIDES — Arabic pages
   Loaded after style.css on /ar/ pages only.
================================ */

html, body {
    direction: rtl;
    text-align: right;
}

/* Use a font stack that still renders Arabic glyphs cleanly while keeping Outfit for Latin/numerals */
body {
    font-family: 'Outfit', 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* ---------- Navbar ---------- */
.nav-links {
    padding-right: 0;
}

.nav-links a::after {
    right: 0;
    left: auto;
}

.faq-question,
.hero-cta-group,
.cta-buttons,
.nav-actions,
.contact-item,
.footer-contact-item,
.marquee-item,
.stat-num-row,
.hero-stats,
.social-links,
.client-info,
.sf-step {
    direction: rtl;
}

/* ---------- Hero ---------- */
.hero-container {
    flex-direction: row-reverse;
}

.hero-cta-group,
.cta-buttons {
    flex-direction: row-reverse;
}

/* Mirror arrow icons so they point left (natural "forward" direction in RTL) */
.ph-arrow-right,
.ph-arrow-up {
    display: inline-block;
    transform: scaleX(-1);
}

.back-to-top .ph-arrow-up {
    transform: none; /* vertical arrow doesn't need mirroring */
}

.hero-badge {
    flex-direction: row-reverse;
}

.hero-stats {
    flex-direction: row-reverse;
}

.neural-float-1,
.neural-float-2 {
    left: auto;
    right: 20px;
}

.neural-float-3 {
    right: auto;
    left: 16px;
}

.neural-float {
    flex-direction: row-reverse;
    text-align: right;
}

.neural-float-text {
    align-items: flex-end;
}

/* ---------- Marquee: flip scroll direction for natural RTL reading flow ---------- */
@keyframes marqueeRtl {
    from { transform: translateX(0); }
    to { transform: translateX(50%); }
}

.marquee-inner {
    animation-name: marqueeRtl;
    direction: ltr; /* keep items laid out left-to-right internally so the loop math still lines up */
}

.marquee-item {
    direction: rtl;
}

/* ---------- Sections / headers ---------- */
.section-header.centered {
    text-align: center;
}

.services-layout,
.services-stack {
    direction: rtl;
}

.sf-steps {
    direction: rtl;
}

.sc-tags {
    direction: rtl;
}

/* ---------- Stats ---------- */
.stat-box {
    border-right: none;
    border-left: 1px solid rgba(255, 255, 255, 0.07);
}

.stat-box:last-child {
    border-left: none;
}

@media (max-width: 480px) {
    .stat-box:nth-child(2) {
        border-left: none;
    }
}

/* ---------- Team cards (about-style grids using border-right) ---------- */
.team-card {
    border-right: none;
    border-left: 1px solid var(--border-color);
}

.team-card:nth-child(4n) {
    border-left: none;
}

/* ---------- Testimonials ---------- */
.testimonial-card::before {
    right: auto;
    left: 16px;
}

.client-info {
    flex-direction: row-reverse;
}

.client-info > div {
    text-align: right;
}

/* ---------- FAQ ---------- */
.faq-question {
    flex-direction: row-reverse;
    text-align: right;
}

.faq-inner {
    direction: rtl;
}

/* ---------- Footer ---------- */
.footer-grid {
    direction: rtl;
}

.footer-links-col {
    text-align: right;
}

.footer-links-col a:hover {
    padding-left: 0;
    padding-right: 4px;
}

.footer-contact-item,
.social-links {
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.footer-bottom {
    direction: rtl;
}

/* ---------- Back to top / floating widgets ---------- */
.back-to-top {
    right: auto;
    left: 28px;
}

.meet-widget {
    right: auto;
    left: 24px;
}

.meet-close {
    right: auto;
    left: 18px;
}

/* ---------- Mobile menu / hamburger ---------- */
.mobile-menu {
    text-align: right;
}

/* ---------- About page: timeline ---------- */
.timeline::before {
    right: 50%;
    left: auto;
    transform: translateX(50%);
}

.timeline-item {
    flex-direction: row-reverse;
}

.timeline-item:nth-child(odd) {
    flex-direction: row;
}

.timeline-item:nth-child(odd) .timeline-content {
    text-align: left;
}

.timeline-item:nth-child(odd) .timeline-year {
    text-align: right;
}

.timeline-content {
    text-align: right;
}

.timeline-dot {
    right: 50%;
    left: auto;
    transform: translateX(50%);
}

@media (max-width: 768px) {
    .timeline::before { right: 16px; left: auto; }
    .timeline-item, .timeline-item:nth-child(odd) {
        flex-direction: column;
        padding-left: 0;
        padding-right: 44px;
    }
    .timeline-item:nth-child(odd) .timeline-content { text-align: right; }
    .timeline-dot { right: 16px; left: auto; }
}

/* ---------- About page: how-we-work steps ---------- */
.how-we-work-grid {
    direction: rtl;
}

.hww-arrow i {
    display: inline-block;
    transform: scaleX(-1);
}

/* ---------- Contact page ---------- */
.contact-item {
    flex-direction: row-reverse;
    text-align: right;
}

.contact-item-text {
    text-align: right;
}

.map-placeholder {
    flex-direction: row-reverse;
}

.form-row {
    direction: rtl;
}

.form-group label {
    text-align: right;
    display: block;
}

.offices-grid {
    direction: rtl;
}

/* ---------- Products filter tabs ---------- */
.filter-tabs {
    direction: rtl;
}

.nova-products-grid {
    direction: rtl;
}

.nova-card-top {
    left: 0;
    right: 0;
}

/* ---------- Generic logical-property nudges ---------- */
.hww-step,
.value-card,
.member-card,
.office-card,
.nova-card,
.service-card,
.testimonial-card,
.faq-item {
    text-align: right;
}

.success-msg,
#successMsg {
    direction: rtl;
    text-align: right;
}
