/* ═══════════════════════════════════════════════════════════════════════════
   SIMPLE MIND — HEBREW (RTL) LAYOUT ADJUSTMENTS

   Loaded on every page; every rule is scoped to [dir="rtl"], so English,
   German, French and Dutch render byte-for-byte the same layout as before.

   Principles
   ─────────
   1. The `dir="rtl"` attribute already flips inline flow, default text-align,
      flex/grid main-axis order and logical properties. Those are NOT
      re-declared here — doing so is what broke the previous version.
   2. Only physical, hard-coded offsets are corrected.
   3. Brand marks, logos, product logos, photographs, decorative graphics and
      the technology-logo marquee are explicitly NOT mirrored.
═══════════════════════════════════════════════════════════════════════════ */

/* ── 0. Never mirror brand or decorative artwork ─────────────────────────── */
/* ── 18. Accessibility widget icons — never mirror or flip ──────────────────
   #uw-root is the entire accessibility panel injected by _accessibility.js.
   Its icons are UI glyphs, not translatable content — the Dyslexia Friendly
   button in particular renders literal text ("Df") inside its <svg>, which
   inherits direction:rtl and anchor-flips exactly like the mockup graphics
   did. Scoping this to the whole widget protects any other icon here too. */
[dir="rtl"] #uw-root svg { direction: ltr; }
[dir="rtl"] img,
[dir="rtl"] .site-main-logo,
[dir="rtl"] .site-footer-logo,
[dir="rtl"] .nav-logo,
[dir="rtl"] .footer-brand-logo,
[dir="rtl"] .logo-chip,
[dir="rtl"] .sm-flag {
  transform: none;
}

/* Directional UI glyphs (→ ↗ ›) opt in to mirroring via this class. */
[dir="rtl"] .sm-dir-icon {
  display: inline-block;
  transform: scaleX(-1);
}

/* ── 1. Blocks that must stay left-to-right ──────────────────────────────── */
/* Technology logo marquee: decorative, duplicated-set animation. */
[dir="rtl"] .logos-wrap,
[dir="rtl"] .logos-track,
[dir="rtl"] #trusted .logos-wrap,
[dir="rtl"] #trusted .logos-track { direction: ltr; }

/* Decorative hero graphic + every SVG mockup graphic across the site */
[dir="rtl"] .hero-tech-visual,
[dir="rtl"] .hero-bg,
[dir="rtl"] .cta-dot-grid,
[dir="rtl"] .delivery-visual,     /* about.html */
[dir="rtl"] .cap-visual,          /* custom-software-development.html */
[dir="rtl"] .case-visual-box,     /* mobile-app-development.html */
[dir="rtl"] .del-visual,          /* sap-business-one.html */
[dir="rtl"] .svc-full-visual,     /* services.html */
[dir="rtl"] .case-visual,         /* work.html */
[dir="rtl"] .mockup-visual { direction: ltr; }   /* new shared class — see below */

/* Machine-readable values keep LTR ordering inside RTL text. */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"],
[dir="rtl"] .win-url,
[dir="rtl"] code,
[dir="rtl"] pre {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: start;
}

/* ── 2. Navigation ───────────────────────────────────────────────────────── */
[dir="rtl"] .mobile-menu-btn { margin-left: 0; margin-inline-start: auto; }

/* Services mega-dropdown is horizontally centred on its trigger — the
   translateX(-50%) centring works in both directions, but the caret and the
   hover bridge need logical offsets. */
[dir="rtl"] .nav-dropdown::before {
  border-left: none;
  border-top: 1px solid var(--rule);
  border-right: 1px solid var(--rule);
  transform: translateX(50%) rotate(-45deg);
  left: auto;
  right: 50%;
}
[dir="rtl"] .nav-dropdown-item::after { left: auto; right: 0; }

/* Language switcher */
[dir="rtl"] .sm-lang-item:focus { box-shadow: inset -3px 0 0 var(--blue); }

/* ── 3. Hero / home ──────────────────────────────────────────────────────── */
[dir="rtl"] .float-card.top-right { right: auto; left: 5%; }
[dir="rtl"] .float-card.bottom-left { left: auto; right: -8%; }

[dir="rtl"] .proof-avatars span { margin-left: 0; margin-right: -9px; }
[dir="rtl"] .proof-avatars span:nth-child(1) { margin-right: 0; }

/* ── 4. About visual (image collage) ─────────────────────────────────────── */
[dir="rtl"] .av-main { left: 14%; right: 0; }
[dir="rtl"] .av-secondary { right: auto; left: 0; }
[dir="rtl"] .av-badge { left: auto; right: 54%; transform: translate(50%, -50%); }

/* ── 5. Cards ────────────────────────────────────────────────────────────── */
[dir="rtl"] .svc-card::before { transform-origin: right; }
[dir="rtl"] .svc-arrow { right: auto; left: 1.5rem; }

[dir="rtl"] .svc-full-icon-wrap { left: auto; inset-inline-start: 1.25rem; }
[dir="rtl"] .svc-full-num { right: auto; inset-inline-end: 1.25rem; }

[dir="rtl"] .leader-quote,
[dir="rtl"] .leader-featured-quote,
[dir="rtl"] .mvv-card {
  border-left: none;
  border-right: 3px solid var(--blue);
}
[dir="rtl"] .leader-quote { border-right-width: 4px; }

[dir="rtl"] .testi-co { margin-left: 0; margin-right: auto; }
[dir="rtl"] .testi-featured::before { right: auto; left: 1.5rem; }

/* ── 6. Stats bar divider ────────────────────────────────────────────────── */
[dir="rtl"] .stat-col:not(:last-child)::after { right: auto; left: 0; }

/* ── 7. Timelines / step connectors ──────────────────────────────────────── */
[dir="rtl"] .timeline { padding-left: 0; padding-right: 2rem; }
[dir="rtl"] .timeline::before { left: auto; right: 0; }
[dir="rtl"] .tl-dot { left: auto; right: -2.45rem; }
[dir="rtl"] .how-step:not(:last-child)::after { left: auto; right: 23px; }

/* ── 8. Forms ────────────────────────────────────────────────────────────── */
[dir="rtl"] .form-field select {
  background-position: left 12px center;
  padding-right: 1rem;
  padding-left: 2.5rem;
}
[dir="rtl"] .form-field label,
[dir="rtl"] .form-field input,
[dir="rtl"] .form-field textarea,
[dir="rtl"] .form-field select { text-align: right; }
[dir="rtl"] .form-field input::placeholder,
[dir="rtl"] .form-field textarea::placeholder { text-align: right; }

/* ── 9. FAQ ──────────────────────────────────────────────────────────────── */
[dir="rtl"] .faq-q { text-align: right; }

/* ── 10. Tables ──────────────────────────────────────────────────────────── */
[dir="rtl"] .compare-table th,
[dir="rtl"] .legal-table th { text-align: right; }

/* ── 11. Footer ──────────────────────────────────────────────────────────── */
[dir="rtl"] .dept-body { padding-right: 0; padding-left: 1rem; }

/* ── 12. Legal pages ─────────────────────────────────────────────────────── */
[dir="rtl"] .legal-content ul { padding-left: 0; padding-right: 1.25rem; }

/* ── 13. Centred content stays centred ───────────────────────────────────── */
[dir="rtl"] .section-header.centered,
[dir="rtl"] .cta-box,
[dir="rtl"] .trusted-label,
[dir="rtl"] #trusted .trusted-label,
[dir="rtl"] .stat-col,
[dir="rtl"] .form-ok,
[dir="rtl"] .booking-ok,
[dir="rtl"] .industry-card,
[dir="rtl"] .role-card,
[dir="rtl"] .case-metric,
[dir="rtl"] .services-home-footer,
[dir="rtl"] .cal-timezone,
[dir="rtl"] .cal-weekdays span,
[dir="rtl"] .slot-btn,
[dir="rtl"] .av-badge,
[dir="rtl"] .legal-inline-btn { text-align: center; }

/* ── 14. Hebrew typography ───────────────────────────────────────────────── */
[dir="rtl"] body {
  font-family: 'Sora', 'Segoe UI', 'Arial Hebrew', 'David Libre', Arial, sans-serif;
  /* Hebrew has no ascender/descender rhythm equivalent — a touch more
     leading keeps long paragraphs readable without changing font size. */
  line-height: 1.8;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4 {
  letter-spacing: 0;   /* negative tracking is designed for Latin only */
}
[dir="rtl"] .section-label span,
[dir="rtl"] .eyebrow span,
[dir="rtl"] .svc-num,
[dir="rtl"] .prod-cat,
[dir="rtl"] .case-sector,
[dir="rtl"] .footer-col h4,
[dir="rtl"] .form-field label,
[dir="rtl"] .stat-col .s-sub {
  letter-spacing: .04em;
  text-transform: none;   /* Hebrew has no case; uppercase is a no-op that
                             only widens tracking oddly */
}

/* ── 15. Overflow guard ──────────────────────────────────────────────────── */
/* German, Dutch and Hebrew strings can be longer than the English source.
   Allow normal wrapping instead of shrinking type or letting text escape. */
[dir="rtl"] { overflow-x: hidden; }

.btn,
.nav-links a,
.nav-dropdown-link,
.footer-col li a,
.sm-lang-item-native {
  overflow-wrap: normal;
}

/* ── 16. Long-translation tolerance (all non-English languages) ──────────────
   English keeps its exact original rendering. The four translated languages
   are allowed to wrap inside buttons instead of overflowing them. Font sizes
   are NOT reduced anywhere. */
html:not([lang="en"]) .btn {
  white-space: normal;
  text-align: center;
  line-height: 1.35;
}
html:not([lang="en"]) .nav-links a { white-space: nowrap; }
html:not([lang="en"]) .chip,
html:not([lang="en"]) .svc-tag,
html:not([lang="en"]) .prod-tag { white-space: normal; }

/* ── 17. Nav overflow guard for longer-language labels ──────────────────────
   German and French nav/button copy run measurably longer than the English
   source, and .nav-cta is intentionally non-shrinking (flex-shrink:0). Give
   the nav a little more room on these languages only, and drop the purely
   decorative "simple-mind.tech ↗" link from the CTA row to buy back space —
   font sizes are not touched. */
html:not([lang="en"]) .nav-inner { max-width: 1320px; }

html:not([lang="en"]) .nav-cta a[href="https://simple-mind.tech"],
html:not([lang="en"]) .nav-cta > span[aria-hidden="true"] {
  display: none;
}