/* ============================================================
   VADALO VENTURES — ARABIC RTL CSS
   ar-rtl.css — Proper RTL without scaling or compression
   ============================================================ */

/* ── ARABIC FONTS — load properly ── */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&family=Amiri:ital,wght@0,400;0,700;1,400&display=swap');

/* ── BODY & HTML — RTL, no zoom, no scale ── */
html[lang="ar"],
html[dir="rtl"] {
  direction: rtl;
}

body.rtl {
  direction: rtl;
  font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif !important;
  /* NO zoom, NO scale, NO transform — same layout as EN */
}

/* ── TYPOGRAPHY — Arabic needs slightly larger size for readability ── */
body.rtl p,
body.rtl li,
body.rtl span,
body.rtl div {
  font-family: 'Cairo', sans-serif;
  letter-spacing: 0; /* Arabic has no letter spacing */
}

body.rtl h1,
body.rtl h2,
body.rtl h3,
body.rtl h4,
body.rtl h5 {
  font-family: 'Amiri', 'Cairo', serif;
  font-weight: 700;
  letter-spacing: 0;
}

/* ── HEADER RTL — mirror layout ── */
body.rtl .hdr-top__inner { flex-direction: row-reverse; }
body.rtl .hdr-top__enq { margin-left: 0; margin-right: auto; }
body.rtl .hdr-main__inner { flex-direction: row-reverse; }
body.rtl .hdr-logo { margin-right: 0; margin-left: 1.75rem; flex-direction: row-reverse; }
body.rtl .hdr-nav { flex-direction: row-reverse; }
body.rtl .hdr-actions { flex-direction: row-reverse; }
body.rtl .hdr-dropdown { left: auto; right: 0; text-align: right; }
body.rtl .hdr-dropdown a { flex-direction: row-reverse; }
body.rtl .hdr-sub__inner { flex-direction: row-reverse; }
body.rtl .hdr-sub__left { flex-direction: row-reverse; }
body.rtl .hdr-sub__right { flex-direction: row-reverse; }
body.rtl .hdr-lang__dd { left: auto; right: 0; }
body.rtl .hdr-mobile-menu a { flex-direction: row-reverse; text-align: right; }

/* ── CONTAINERS — same width as EN ── */
body.rtl .container { direction: rtl; }

/* ── SECTION HEADS — center stays center, left becomes right ── */
body.rtl .section-head { text-align: right; }
body.rtl .section-head--center { text-align: center; }
body.rtl .section-label { text-align: inherit; }
body.rtl .divider { margin: 0 auto; }

/* ── HERO SECTION ── */
body.rtl .ar-hero .container { text-align: right; }
body.rtl .ar-badge { flex-direction: row-reverse; }
body.rtl .ar-pills { justify-content: flex-start; flex-direction: row; }
body.rtl .ar-cta { flex-direction: row; }

/* ── GRIDS — same as EN, just RTL text ── */
body.rtl .ar-grid,
body.rtl .ar-trust { direction: rtl; }
body.rtl .ar-card { text-align: center; direction: rtl; }

/* ── FOOTER RTL ── */
body.rtl .footer-grid { direction: rtl; }
body.rtl .footer-brand { text-align: right; }
body.rtl .footer-logo-wrap { flex-direction: row-reverse; }
body.rtl .footer-contacts { align-items: flex-start; }
body.rtl .footer-contact-row { flex-direction: row-reverse; justify-content: flex-end; }
body.rtl .footer-social { flex-direction: row; }
body.rtl .footer-links li a { flex-direction: row-reverse; }
body.rtl .footer-links--contact li { flex-direction: row-reverse; text-align: right; }
body.rtl .footer-col { text-align: right; }
body.rtl .footer-col-title { text-align: right; }
body.rtl .footer-bottom-inner { flex-direction: row-reverse; }
body.rtl .footer-reg { text-align: right; }

/* ── FORMS RTL ── */
body.rtl input,
body.rtl textarea,
body.rtl select {
  text-align: right;
  direction: rtl;
}

body.rtl .form-group label { text-align: right; display: block; }
body.rtl .form-row { direction: rtl; }

/* ── CARDS & SECTIONS ── */
body.rtl .card { text-align: right; }
body.rtl .stat-card { flex-direction: row-reverse; }
body.rtl .feature-list li,
body.rtl .checklist li {
  flex-direction: row-reverse;
  text-align: right;
}

/* ── BUTTONS — keep LTR for icons ── */
body.rtl .btn { direction: ltr; display: inline-flex; }
body.rtl .hdr-btn { direction: ltr; }

/* ── WA FLOAT — mirror side ── */
body.rtl .wa-float { right: auto; left: 1.5rem; }
body.rtl .back-to-top { right: auto; left: 1.5rem; }

/* ── MOBILE RTL ── */
@media (max-width: 768px) {
  body.rtl .ar-grid { grid-template-columns: 1fr 1fr; }
  body.rtl .ar-trust { grid-template-columns: 1fr 1fr; }
  body.rtl .ar-hero .container { text-align: right; }
  body.rtl .footer-grid { grid-template-columns: 1fr 1fr; }
  body.rtl .footer-brand { grid-column: 1 / -1; }
}

/* ── AR PAGE SECTIONS — match EN exactly ── */
.ar-hero {
  background: linear-gradient(135deg, #0f2318 0%, #1a3a2a 55%, #224d38 100%);
  min-height: calc(70vh - 116px);
  display: flex;
  align-items: center;
  padding: 4rem 0;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.ar-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(-45deg, transparent, transparent 60px, rgba(255,255,255,.01) 60px, rgba(255,255,255,.01) 61px);
}

.ar-hero .container { position: relative; z-index: 1; text-align: right; }

.ar-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(201,168,76,.15);
  border: 1px solid rgba(201,168,76,.3);
  border-radius: 100px;
  padding: .35rem 1.1rem;
  font-size: .82rem;
  font-weight: 700;
  color: var(--clr-gold);
  margin-bottom: 1.25rem;
}

.ar-title {
  font-family: 'Amiri', 'Cairo', serif !important;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 700;
  color: white;
  line-height: 1.4;
  margin-bottom: 1.25rem;
}

.ar-title em {
  color: var(--clr-gold);
  font-style: normal;
}

.ar-desc {
  font-family: 'Cairo', sans-serif !important;
  font-size: 1.05rem;
  color: rgba(255,255,255,.75);
  line-height: 1.9;
  max-width: 600px;
  margin-bottom: 1.5rem;
  margin-right: 0;
}

.ar-pills {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.75rem;
}

.ar-pills span {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 100px;
  padding: .28rem .85rem;
  font-size: .78rem;
  font-weight: 600;
  color: rgba(255,255,255,.85);
  font-family: 'Cairo', sans-serif;
}

.ar-cta { display: flex; gap: .85rem; flex-wrap: wrap; }

.ar-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  margin-top: 2.5rem;
}

.ar-card {
  background: white;
  border: 1px solid var(--clr-border-light);
  border-radius: var(--radius-lg);
  padding: 1.75rem 1.5rem;
  text-decoration: none;
  text-align: center;
  transition: all .3s;
}

.ar-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); }

.ar-card-icon { font-size: 2.5rem; margin-bottom: .75rem; display: block; }

.ar-card-name {
  font-family: 'Cairo', sans-serif !important;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--clr-forest);
  margin-bottom: .4rem;
}

.ar-card-sub {
  font-family: 'Cairo', sans-serif !important;
  font-size: .82rem;
  color: var(--clr-text-muted);
  line-height: 1.6;
}

.ar-trust {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-top: 2.5rem;
}

.ar-trust-item {
  background: white;
  border: 1px solid var(--clr-border-light);
  border-radius: var(--radius-md);
  padding: 1.25rem;
  text-align: center;
}

.ar-trust-num {
  font-family: 'Cairo', sans-serif !important;
  font-size: 2rem;
  font-weight: 800;
  color: var(--clr-forest);
  line-height: 1;
}

.ar-trust-label {
  font-family: 'Cairo', sans-serif !important;
  font-size: .82rem;
  color: var(--clr-text-muted);
  margin-top: .35rem;
  font-weight: 600;
}

.ar-cta-sec {
  background: linear-gradient(135deg, var(--clr-forest), var(--clr-forest-mid));
  padding: 4rem 0;
  text-align: center;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.ar-cta-sec::before {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(-45deg, transparent, transparent 60px, rgba(255,255,255,.015) 60px, rgba(255,255,255,.015) 61px);
}

.ar-cta-sec .container { position: relative; z-index: 1; }

.ar-cta-title {
  font-family: 'Amiri', 'Cairo', serif !important;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 700;
  color: white;
  margin-bottom: .75rem;
  line-height: 1.4;
}

.ar-cta-title em { color: var(--clr-gold); font-style: normal; }

.ar-cta-desc {
  font-family: 'Cairo', sans-serif !important;
  font-size: 1rem;
  color: rgba(255,255,255,.7);
  max-width: 520px;
  margin: 0 auto 2rem;
  line-height: 1.9;
}

.ar-cta-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .85rem;
  flex-wrap: wrap;
}

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .ar-grid { grid-template-columns: repeat(2, 1fr); }
  .ar-trust { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .ar-hero { padding: 2.5rem 0; }
  .ar-grid { grid-template-columns: 1fr 1fr; }
  .ar-trust { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  .ar-grid { grid-template-columns: 1fr; }
  .ar-trust { grid-template-columns: 1fr 1fr; }
}
