/* =========================================================
   Newman — RTL adjustments for the Arabic version
   Loaded after styles.css on every page inside /ar/
   ========================================================= */

html[dir="rtl"] body {
  font-family: "Cairo", "Tajawal", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Arial, sans-serif;
}

/* Section heading & body proportions read better with slightly tighter line-height in Arabic */
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3, html[dir="rtl"] h4 {
  letter-spacing: 0;
  line-height: 1.35;
}
html[dir="rtl"] body { line-height: 1.75; }

/* Mirror the eyebrow chip and pillar arrow direction */
html[dir="rtl"] .pillar a::after { content: " \2190"; }

/* Hero floating stat sits on the right edge instead of the left */
html[dir="rtl"] .hero-image .floating-stat {
  left: auto;
  right: 20px;
}

/* Checklist bullet flips to the right side */
html[dir="rtl"] .checklist li {
  padding: 10px 32px 10px 0;
}
html[dir="rtl"] .checklist li::before {
  left: auto;
  right: 0;
}

/* Bitdefender brand banner — vertical separator switches sides */
html[dir="rtl"] .bd-tagline {
  border-left: none;
  border-right: 1px solid rgba(255, 255, 255, 0.4);
  padding-left: 0;
  padding-right: 20px;
}

/* Recognition / Forrester section — score list bullets flip */
html[dir="rtl"] .recognition .scores li {
  padding-left: 0;
  padding-right: 22px;
}
html[dir="rtl"] .recognition .scores li::before {
  left: auto;
  right: 0;
}

/* Forrester badge stays LTR (it's a brand mark) */
html[dir="rtl"] .forrester-badge {
  direction: ltr;
  text-align: left;
}

/* Bitdefender brand wordmark stays LTR for legibility */
html[dir="rtl"] .bd-wordmark,
html[dir="rtl"] .partner-logo {
  direction: ltr;
}

/* Footer brand tag also reads better LTR */
html[dir="rtl"] .footer-bottom { direction: rtl; }

/* Buttons in Arabic — Inter rendering of Arabic glyphs is fine, but force Cairo */
html[dir="rtl"] .btn { font-family: inherit; }

/* Language switcher in topbar */
.lang-switch {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-size: 0.82rem;
}
.lang-switch a {
  color: #cbd5e1;
  text-decoration: none;
  padding: 2px 8px;
  border-radius: 4px;
  transition: background 0.15s ease, color 0.15s ease;
}
.lang-switch a:hover { color: #fff; background: rgba(255, 255, 255, 0.08); }
.lang-switch a.active {
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  font-weight: 600;
}