/* ─────────────────────────────────────────────
   SLADKA — Arabic / RTL Overrides
   Font: Cairo (closest to Madani available via CDN)
───────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap');

[dir="rtl"] {
  --font: 'Cairo', sans-serif;
  --font-heading: 'Cairo', sans-serif;
}

[dir="rtl"] body {
  font-family: 'Cairo', sans-serif;
}

/* ── NAV ── */
[dir="rtl"] .site-header nav {
  direction: rtl;
}
[dir="rtl"] .logo {
  flex-direction: row-reverse;
}

/* ── HERO ── */
[dir="rtl"] .hero-standalone {
  align-items: flex-end;
  padding: 0 7vw;
}
[dir="rtl"] .hero-inner {
  text-align: right;
}
[dir="rtl"] .hero-heading {
  text-align: right;
}
[dir="rtl"] .hero-tagline {
  text-align: right;
}
[dir="rtl"] .scroll-hint {
  left: auto;
  right: 7vw;
  align-items: flex-end;
}

/* ── SCROLL SECTIONS — swap side zones ── */
[dir="rtl"] .align-left {
  padding-right: 7vw;
  padding-left: 52vw;
}
[dir="rtl"] .align-right {
  padding-left: 7vw;
  padding-right: 52vw;
}
[dir="rtl"] .align-left .section-inner,
[dir="rtl"] .align-right .section-inner {
  text-align: right;
}

/* ── SECTION INNER border flips ── */
[dir="rtl"] .section-inner {
  padding-left: 0;
  padding-right: 1.25rem;
  border-left: none;
  border-right: 1px solid rgba(145, 170, 160, 0.25);
}

/* ── STATS ── */
[dir="rtl"] .stats-row {
  direction: rtl;
}
[dir="rtl"] .stat {
  align-items: flex-end;
}
[dir="rtl"] .stat-value-row {
  flex-direction: row-reverse;
}

/* ── CTA / WORD REVEAL ── */
[dir="rtl"] .cta-inner {
  text-align: right;
}
[dir="rtl"] .word-reveal-text {
  text-align: right;
  direction: rtl;
}
[dir="rtl"] .word-reveal-buttons {
  justify-content: flex-end;
}
[dir="rtl"] .cta-button-outline {
  margin-left: 0;
  margin-right: 1rem;
}

/* ── MARQUEE — keep LTR scrolling ── */
[dir="rtl"] .marquee-text {
  direction: ltr;
}

/* ── LANGUAGE TOGGLE ── */
.lang-toggle {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: rgba(240, 237, 232, 0.5);
  text-decoration: none;
  transition: all 0.25s ease;
  padding: 0.4rem 0.85rem;
  border: 1px solid rgba(240,237,232,0.25);
  border-radius: 2px;
  white-space: nowrap;
}
.lang-toggle:hover {
  color: var(--text);
  border-color: rgba(240,237,232,0.5);
}

/* ── LOGO WORDMARK in Arabic ── */
[dir="rtl"] .logo-wordmark {
  letter-spacing: 0.05em;
  font-size: 0.85rem;
}

/* ── ARABIC LETTER-SPACING FIX ── */
/* Arabic script breaks apart with letter-spacing — reset everything */
[dir="rtl"],
[dir="rtl"] * {
  letter-spacing: 0 !important;
  word-spacing: normal;
}

/* ── SCROLL HINT — LEFT SIDE in Arabic ── */
[dir="rtl"] .hero-standalone {
  position: relative;
}
[dir="rtl"] .scroll-hint {
  position: absolute;
  left: 7vw;
  right: auto;
  bottom: 2.5rem;
  align-items: flex-start;
}

/* ── WORK PAGE — case-reverse in RTL ── */
/* In RTL, .case puts image on RIGHT (columns reversed).
   .case-reverse should flip it: image on LEFT, text on RIGHT */
[dir="rtl"] .case-reverse {
  direction: ltr;
}
[dir="rtl"] .case-reverse > * {
  direction: rtl;
}

/* ── MOBILE RTL FIXES ── */
@media (max-width: 768px) {
  /* Remove desktop RTL side padding — let mobile styles handle it */
  [dir="rtl"] .align-left,
  [dir="rtl"] .align-right {
    padding: 0 6vw;
  }

  /* RTL border flip */
  [dir="rtl"] .align-left .section-inner,
  [dir="rtl"] .align-right .section-inner {
    border-right: 1px solid rgba(145,170,160,0.2);
    border-left: none;
  }

  /* Remove border-left default (applied by non-RTL rule) */

  /* Stack CTA buttons centered on mobile */
  [dir="rtl"] .cta-button-outline {
    margin-right: 0;
  }
}