@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Outfit:wght@300;400;500;600;700&display=swap');

html { scroll-behavior: smooth; }

body {
  background: #fff;
  color: #24170d;
  font-family: 'Outfit', Arial, sans-serif;
}

.font-display { font-family: 'Playfair Display', Georgia, serif; }
.arabic { font-family: Tahoma, Arial, sans-serif; }

/* Phone numbers in RTL — keep LTR order */
.phone-ltr {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Gold gradients */
.gold-gradient {
  background: linear-gradient(110deg, #8d5b08, #dca52b, #ffe6a0, #b97808);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gold-bg {
  background: linear-gradient(110deg, #9c6808, #dca52b, #f5d67d, #b97808);
}

.gold-border {
  border-image: linear-gradient(90deg, #9c6808, #f5d67d, #9c6808) 1;
}

.luxury-shadow { box-shadow: 0 25px 70px rgba(120, 78, 8, 0.14); }
.luxury-shadow-lg { box-shadow: 0 40px 100px rgba(120, 78, 8, 0.18); }

.hero-glow {
  background:
    radial-gradient(circle at 50% 20%, rgba(222, 171, 63, 0.18), transparent 32%),
    radial-gradient(circle at 10% 80%, rgba(222, 171, 63, 0.10), transparent 30%);
}

.pattern {
  background-image: radial-gradient(rgba(180, 120, 15, 0.10) 1px, transparent 1px);
  background-size: 22px 22px;
}

.pattern-dark {
  background-image: radial-gradient(rgba(222, 171, 63, 0.08) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* Page hero */
.page-hero {
  background:
    radial-gradient(ellipse at 80% 20%, rgba(222, 171, 63, 0.12), transparent 50%),
    radial-gradient(ellipse at 10% 80%, rgba(222, 171, 63, 0.06), transparent 40%),
    linear-gradient(180deg, #fffdf8 0%, #fff 100%);
}

/* Cards */
.card-hover {
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.35s ease;
}
.card-hover:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 80px rgba(120, 78, 8, 0.12);
}

/* Magnetic */
.magnetic { transition: transform 0.25s ease; }

/* Nav active */
.nav-link {
  position: relative;
  transition: color 0.2s ease;
}
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, #c88b13, #f5d67d);
  transition: width 0.3s ease;
  border-radius: 2px;
}
.nav-link:hover::after,
.nav-link.active::after { width: 100%; }
.nav-link.active { color: #a96e05; }

/* Mobile menu */
#mobileMenu {
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
#mobileMenu.open { transform: translateX(0); }
#menuOverlay {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
#menuOverlay.open {
  opacity: 1;
  pointer-events: auto;
}

/* Timeline */
.timeline-line {
  background: linear-gradient(180deg, #dca52b, #c88b13, #805208);
}
.timeline-dot {
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px rgba(200, 139, 19, 0.3);
}

/* Form */
.form-input {
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-input:focus {
  outline: none;
  border-color: #dca52b;
  box-shadow: 0 0 0 3px rgba(220, 165, 43, 0.15);
}

/* Stat counter glow */
.stat-glow {
  text-shadow: 0 0 40px rgba(220, 165, 43, 0.3);
}

/* Section divider */
.section-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200, 139, 19, 0.3), transparent);
}

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #fffaf0; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #dca52b, #c88b13);
  border-radius: 4px;
}