/* =========================================================
   RockSolid Concrete & Paving - rtl.css
   Applied when <html dir="rtl">. style.css is written with logical
   properties (inline-start / inline-end), so most of the layout mirrors
   automatically. This file handles the things that don't:
   directional icons, transforms, animations, off-canvas panel, fonts.
   ========================================================= */

[dir="rtl"] body {
  font-family: 'Inter', 'Segoe UI', Tahoma, 'Noto Sans Arabic', 'Noto Sans Hebrew', Arial, sans-serif;
  text-align: start;
}

/* Directional icons (arrows) flip */
[dir="rtl"] .icon-flip { transform: scaleX(-1); }
[dir="rtl"] .btn:hover .icon-flip,
[dir="rtl"] .service-card:hover .more .icon-flip { transform: scaleX(-1) translateX(4px); }
[dir="rtl"] .service-card:hover .more .icon-flip { transform: scaleX(-1) translateX(6px); }
/* slider "previous" arrow has an inline scaleX(-1) in LTR; un-flip it for RTL */
[dir="rtl"] #tPrev .icon-flip { transform: none !important; }
[dir="rtl"] #tNext .icon-flip { transform: scaleX(-1); }

/* Underline / progress / sweep animations originate from the right edge */
[dir="rtl"] .nav-link::after,
[dir="rtl"] .trust-card::before,
[dir="rtl"] .scroll-progress { transform-origin: 100% 50%; }
[dir="rtl"] .scroll-progress { background: linear-gradient(270deg, var(--accent), #ffb347); }
[dir="rtl"] .btn-primary::after { transform: skewX(20deg); }

/* Reveal-from-side animation mirrors */
[dir="rtl"] .js .reveal.reveal-left { transform: translateX(48px); }
[dir="rtl"] .js .reveal.reveal-left.in { transform: none; }

/* Hero decorative frame & overlay gradient mirror */
[dir="rtl"] .hero-overlay {
  background:
    linear-gradient(-100deg, rgba(16, 20, 26, .95) 8%, rgba(16, 20, 26, .72) 55%, rgba(16, 20, 26, .45)),
    repeating-linear-gradient(-45deg, rgba(255, 255, 255, .02) 0 2px, transparent 2px 9px);
}
[dir="rtl"] .why-bg {
  background:
    radial-gradient(600px 300px at 10% 0%, rgba(242, 107, 15, .22), transparent 70%),
    radial-gradient(500px 300px at 100% 100%, rgba(242, 107, 15, .12), transparent 70%),
    repeating-linear-gradient(-135deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 14px);
}
[dir="rtl"] .cta-card {
  background:
    radial-gradient(520px 320px at 0% 0%, rgba(242, 107, 15, .35), transparent 70%),
    linear-gradient(-160deg, var(--ink-2), var(--ink));
}

/* Marquee ticker runs the other way */
[dir="rtl"] .ticker-track { animation-name: marquee-rtl; }
@keyframes marquee-rtl { from { transform: translateX(0); } to { transform: translateX(50%); } }

/* Progress meters grow from the right */
[dir="rtl"] .meter span { float: right; }

/* Project hover arrow rotates the other way */
[dir="rtl"] .project-go { transform: scale(.6) rotate(45deg); }
[dir="rtl"] .project-card:hover .project-go { transform: none; }

/* Navigation */
[dir="rtl"] .dropdown a:hover,
[dir="rtl"] .dropdown a.active { padding-inline-start: 1.15rem; }

/* Mobile slide-in panel opens from the left in RTL */
@media (max-width: 1100px) {
  [dir="rtl"] .nav { transform: translateX(-105%); }
  [dir="rtl"] body.nav-open .nav,
  body.nav-open[dir="rtl"] .nav { transform: none; }
  [dir="rtl"] .nav-link::after { right: .3rem; left: auto; }
}

/* Inputs: keep phone / email / numbers readable left-to-right */
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="email"] { direction: ltr; text-align: end; }
[dir="rtl"] input[type="tel"]::placeholder { text-align: end; }

/* Select arrow sits on the correct side */
[dir="rtl"] .field select { background-position: left .9rem center; }

/* Phone numbers / emails inside RTL text should not get scrambled */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"] { unicode-bidi: plaintext; direction: ltr; display: inline-block; }

/* Stat counters & badge numerals */
[dir="rtl"] .exp-badge strong,
[dir="rtl"] .about-stats strong,
[dir="rtl"] .t-score strong { direction: ltr; unicode-bidi: isolate; }

/* Letter-spacing breaks connected scripts (Arabic etc.); neutralise in RTL */
[dir="rtl"] .eyebrow,
[dir="rtl"] .section-tag,
[dir="rtl"] .chip,
[dir="rtl"] .logo-text small,
[dir="rtl"] .exp-badge span,
[dir="rtl"] .ticker-track span { letter-spacing: 0; }


/* =========================================================
   ABOUT PAGE (RTL)
   Layout mirrors via logical properties; only gradients,
   animation direction and numerals need help here.
   ========================================================= */
[dir="rtl"] .process-track::after { background: linear-gradient(270deg, var(--accent), #ffb347); transform-origin: 100% 50%; }
[dir="rtl"] .ph-ring { animation-direction: reverse; }

/* Keep numerals readable left-to-right */
[dir="rtl"] .ms-year,
[dir="rtl"] .hs strong,
[dir="rtl"] .step-num { direction: ltr; unicode-bidi: isolate; }

/* Letter-spacing breaks connected scripts */
[dir="rtl"] .breadcrumb,
[dir="rtl"] .skill-tags li { letter-spacing: 0; }

/* =========================================================
   CONTACT PAGE (RTL)
   Layout mirrors via logical properties; this handles the
   remaining directional bits.
   ========================================================= */
[dir="rtl"] .contact-hero .btn-ghost .ico { transform: none; }

/* Keep phone numbers, emails and hours readable left-to-right */
[dir="rtl"] .ci-link,
[dir="rtl"] .hours-list li span:last-child { direction: ltr; unicode-bidi: isolate; }
[dir="rtl"] .hours-list li span:last-child { text-align: end; }

/* Map: centre marker offset mirrors */
[dir="rtl"] .map-hq { margin-inline-start: 0; margin-inline-end: -29px; }
@media (max-width: 640px) {
  [dir="rtl"] .map-hq { margin-inline-end: -24px; }
}

/* Letter-spacing breaks connected scripts */
[dir="rtl"] .area-group h4,
[dir="rtl"] .faq-item h3,
[dir="rtl"] .contact-steps strong { letter-spacing: 0; }

/* =========================================================
   SERVICES PAGE (RTL)
   Layout mirrors via logical properties (grid order, insets, padding-inline);
   only numerals and letter-spacing need help.
   ========================================================= */
[dir="rtl"] .svc-badge { direction: ltr; unicode-bidi: isolate; }
[dir="rtl"] .svc-nav a,
[dir="rtl"] .svc-copy h3 { letter-spacing: 0; }

/* =========================================================
   SERVICE DETAILS PAGES (RTL)
   Layout mirrors via logical properties; only gradients,
   arrows and letter-spacing need help.
   ========================================================= */
[dir="rtl"] .sd-hero .btn-ghost .ico { transform: none; }
[dir="rtl"] .sd-quote {
  background: radial-gradient(360px 240px at 0% 0%, rgba(242, 107, 15, .35), transparent 70%), linear-gradient(-160deg, var(--ink-2), var(--ink));
}
[dir="rtl"] .sd-benefits {
  background: radial-gradient(520px 320px at 0% 0%, rgba(242, 107, 15, .32), transparent 70%), linear-gradient(-160deg, var(--ink-2), var(--ink));
}
[dir="rtl"] .sd-other a .arr { transform: scaleX(-1); }
[dir="rtl"] .sd-other a:hover .arr { transform: scaleX(-1) translateX(4px); }
[dir="rtl"] .sd-fact small { letter-spacing: 0; }


/* =========================================================
   SYSTEM PAGES (RTL)  - 404.html, coming-soon.html
   Layout mirrors via logical properties; numerals, the crack
   drawing and letter-spacing need help.
   ========================================================= */
[dir="rtl"] .err-path code { direction: ltr; unicode-bidi: isolate; }
[dir="rtl"] .err-crack { transform: scaleX(-1); }
[dir="rtl"] .err-code { letter-spacing: 0; }
[dir="rtl"] .cs-bar span { float: none; }
[dir="rtl"] .cs-notify input[type="email"] { text-align: start; }
[dir="rtl"] .cs-notify input[type="email"]::placeholder { text-align: start; }

/* Letter-spacing breaks connected scripts */
[dir="rtl"] .err-tape span,
[dir="rtl"] .cs-unit span { letter-spacing: 0; }


/* =========================================================
   PROJECTS / GALLERY PAGE (RTL)
   The before/after slider stays physically left-to-right (it is
   a visual control); everything else mirrors via logical properties.
   ========================================================= */
[dir="rtl"] .gal-count strong,
[dir="rtl"] .ba-meta dd { unicode-bidi: isolate; }

/* Letter-spacing breaks connected scripts */
[dir="rtl"] .ba-tag { letter-spacing: 0; }


/* =========================================================
   TESTIMONIALS PAGE (RTL)
   Layout mirrors via logical properties; numerals and
   letter-spacing need help.
   ========================================================= */
[dir="rtl"] .rv-count strong,
[dir="rtl"] .rv-row span:first-child { unicode-bidi: isolate; }
[dir="rtl"] .pt-copy blockquote { border-inline-start-width: 4px; }


/* =========================================================
   HOME 2 PAGE (RTL)
   Layout mirrors via logical properties; arrows, numerals and
   letter-spacing need help.
   ========================================================= */
[dir="rtl"] .h2-svc:hover .more .icon-flip { transform: scaleX(-1) translateX(5px); }
[dir="rtl"] .h2-panel li:hover { transform: translateX(-4px); }
[dir="rtl"] .h2-panel strong { direction: ltr; }
[dir="rtl"] .h2-pick-label span,
[dir="rtl"] .h2-panel span { letter-spacing: 0; }