/* ============================================================
   i18n.css — language switcher, RTL support & Arabic/Persian fonts
   Shared across all language versions of sertandede.com
   ============================================================ */

/* ---------- Nav: group switcher + CTA in the right column ---------- */
.nav-end {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ---------- Language switcher ---------- */
.lang-switch { position: relative; }

.lang-switch-cur {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  background: var(--ivory);
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
  color: var(--navy);
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(10, 31, 61, 0.04);
  transition: background 0.22s, border-color 0.22s, transform 0.22s;
}
.lang-switch-cur:hover { background: var(--frost); border-color: var(--gold); transform: translateY(-1px); }
.lang-switch-cur .ls-globe { font-size: 13px; opacity: 0.55; }
.lang-switch-cur .ls-caret {
  font-size: 9px;
  color: var(--gold-deep);
  transition: transform 0.25s ease;
}
.lang-switch:hover .ls-caret,
.lang-switch:focus-within .ls-caret { transform: rotate(180deg); }

.lang-switch-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 184px;
  list-style: none;
  margin: 0;
  padding: 6px;
  background: rgba(251, 250, 246, 0.86);
  backdrop-filter: blur(28px) saturate(1.8);
  -webkit-backdrop-filter: blur(28px) saturate(1.8);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 24px 60px -22px rgba(10, 31, 61, 0.42);
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease;
  z-index: 200;
}
html[dir="rtl"] .lang-switch-menu { right: auto; left: 0; }

.lang-switch:hover .lang-switch-menu,
.lang-switch:focus-within .lang-switch-menu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.lang-switch-menu a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  text-decoration: none;
  color: var(--navy);
  transition: background 0.18s;
}
.lang-switch-menu a:hover { background: rgba(10, 31, 61, 0.05); }
.lang-switch-menu a.active { background: var(--navy); }
.lang-switch-menu a.active .ls-native,
.lang-switch-menu a.active .ls-sub { color: var(--paper); }
.lang-switch-menu a.active .ls-sub { opacity: 0.7; }

.lang-switch-menu .ls-native {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--navy);
}
.lang-switch-menu .ls-sub {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-faint);
}

@media (max-width: 720px) {
  .lang-switch-cur { padding: 7px 10px; font-size: 12px; }
  .lang-switch-cur .ls-globe { display: none; }
}

/* ============================================================
   RTL SUPPORT  (Arabic + Persian)
   ============================================================ */
html[dir="rtl"] body { text-align: right; }

/* Arabic shaping is broken by tracking — neutralise letter-spacing */
html[dir="rtl"] body,
html[dir="rtl"] body * { letter-spacing: normal !important; }

/* Keep centred blocks centred */
html[dir="rtl"] .sec-head,
html[dir="rtl"] .stats-grid,
html[dir="rtl"] .stat,
html[dir="rtl"] .campaign-quota,
html[dir="rtl"] .footer-monogram,
html[dir="rtl"] .footer-bottom { text-align: center; }

/* The image carousel relies on LTR translateX maths — pin it LTR */
html[dir="rtl"] .banner-frame,
html[dir="rtl"] .banner-track { direction: ltr; }

/* Flip the small hover nudge on inline arrows */
html[dir="rtl"] .nav-cta:hover .arrow,
html[dir="rtl"] .btn-pill:hover .arrow { transform: translateX(-2px); }
html[dir="rtl"] .service-card:hover .service-link span:last-child { transform: translateX(-4px); }

/* Numerals & latin tokens stay LTR inside RTL runs */
html[dir="rtl"] .hero-meta-val,
html[dir="rtl"] .stat-num,
html[dir="rtl"] .showcase-stat-val,
html[dir="rtl"] .property-meta,
html[dir="rtl"] .social-card-handle { direction: ltr; unicode-bidi: isolate; }
html[dir="rtl"] .stat-num,
html[dir="rtl"] .hero-meta-item { text-align: center; }

/* ---------- Arabic / Persian webfonts ---------- */
html[lang="fa"] {
  --font-display: 'Vazirmatn', 'SF Pro Display', 'Segoe UI', Tahoma, sans-serif;
  --font-body:    'Vazirmatn', 'SF Pro Text', 'Segoe UI', Tahoma, sans-serif;
}
html[lang="ar"] {
  --font-display: 'IBM Plex Sans Arabic', 'SF Pro Display', 'Segoe UI', Tahoma, sans-serif;
  --font-body:    'IBM Plex Sans Arabic', 'SF Pro Text', 'Segoe UI', Tahoma, sans-serif;
}
/* Persian/Arabic run a touch larger & looser line for legibility */
html[dir="rtl"] body { font-size: 16.5px; line-height: 1.7; }
html[dir="rtl"] .hero-title { line-height: 1.12; }
html[dir="rtl"] .sec-title,
html[dir="rtl"] .showcase-title,
html[dir="rtl"] .campaign-heading,
html[dir="rtl"] .contact-heading { line-height: 1.2; }