/* RTL + Arabic typography overrides for VFC Arabic site.
   Loaded after common.css. */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

html[dir="rtl"] body,
body {
  font-family: 'IBM Plex Sans Arabic', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

h1, h2, h3, h4, h5 {
  font-family: 'IBM Plex Sans Arabic', 'Manrope', system-ui, sans-serif;
  letter-spacing: 0;
  line-height: 1.25;
}

h1 { letter-spacing: -0.01em; line-height: 1.15; }
h2 { letter-spacing: -0.005em; }

.kicker, .eyebrow, .mono, .filter,
.partner-logo, .trusted-label,
.stat .lab, .pill, .footer-bottom {
  letter-spacing: 0;
}

/* Keep mono / numeric / temperatures readable LTR */
.mono, .num, .temp, .specs .v, .vis .temp,
.compare-table .v, .pdp-vis .temp .big, .pdp-vis .badge,
.pcard .vis .temp, .pcard .vis .badge,
.hero-vis .temp .big, .hero-vis .temp .lab,
.showcase-row .idx, .showcase-row .spec,
.app-row .n, .seg .num, .pillar .num,
.feat-row .num, .timeline .y, .partner-vis .pv-foot,
.partner-vis .pv-grid .cell .label,
.partner-vis .pv-head .tag {
  font-family: 'JetBrains Mono', monospace;
  direction: ltr;
  unicode-bidi: isolate;
}

/* Arrows / chevrons: mirror for RTL */
.btn-link::after { content: "←"; }
.arrow { direction: rtl; }

/* Reverse arrow direction in known buttons that use → */
[dir="rtl"] .btn { direction: rtl; }

/* Hero grid: keep image on visual left in RTL (so image still anchors), or let it flow naturally. We'll let it flow. */

/* Crumbs separator stays as / */
.crumbs .sep { margin: 0 8px; }

/* Showcase row: in RTL, idx + thumb should sit on the right.
   Grid auto-flips with dir=rtl, but explicit columns can break.
   We re-declare to keep structure clean. */

/* Tables remain LTR-friendly for spec rows; allow text-align start */
table { text-align: start; }

/* Form inputs */
input, textarea, select { font-family: inherit; text-align: start; }

/* Lang toggle in RTL */
.lang-toggle { font-family: 'Manrope', sans-serif; }

/* Footer quick adjustments */
.site-footer h4 { font-weight: 600; }

/* Em / strong styling — green accent same */
em.grn { font-style: normal; }

/* Trusted row: spacing */
.trusted-row { gap: clamp(20px, 4vw, 56px); }

/* Hero title em */
h1 em { font-style: normal; }

/* ── RTL Layout Corrections ── */

/* Kicker: green line appears on the right in RTL */
.kicker { flex-direction: row-reverse; }

/* Section-head right column: text aligns to the right */
.section-head .right { text-align: right; }

/* CTA button columns: flush to outer edge on desktop in RTL (flex-end = visual LEFT) */
@media (min-width: 901px) {
  .cta-panel .right,
  .about-cta-actions,
  .industries-cta-actions,
  .cta-box-actions {
    align-items: flex-end !important; /* flex-end in RTL = visual LEFT */
  }
}

/* FAQ side links: right-aligned text */
.faq-side .ci a { text-align: right; }

/* Contact form labels: right-aligned */
.field label { text-align: right; }

/* Pillar arrow: RTL text direction */
.pillar .arrow { text-align: right; }

/* Hero meta and science stats: right-align in RTL */
.hero-meta .stat { text-align: right; }
.science-stats .stat { text-align: right; }

/* Products compare table: align to start (right) in RTL */
.compare-table th, .compare-table td { text-align: right; }

/* Nav drawer: RTL desktop layout — links on right, action on left */
.nav-drawer-inner { flex-direction: row-reverse; }

/* Mobile: nav drawer stacks properly in RTL */
@media (max-width: 900px) {
  .nav-drawer-inner { flex-direction: column-reverse; }
  .nav-drawer-actions { flex-direction: row-reverse; }
}

/* Showcase row go-arrow: mirror for RTL */
.showcase-row .go { transform: scaleX(-1); }