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

:root {
  --font-en: 'Montserrat', sans-serif;
  --font-ar: 'Cairo', sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-en);
  background-color: #ffffff;
  color: #2B2B2B;
  -webkit-font-smoothing: antialiased;
}

[dir='rtl'] body,
[dir='rtl'] {
  font-family: var(--font-ar);
}

/* Hide scrollbars globally */
* {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
*::-webkit-scrollbar {
  display: none;
}

/* Gold underline decoration */
.gold-line::after {
  content: '';
  display: block;
  width: 60px;
  height: 2px;
  background: #C9A23D;
  margin-top: 12px;
}

.gold-line-center::after {
  content: '';
  display: block;
  width: 60px;
  height: 2px;
  background: #C9A23D;
  margin: 12px auto 0;
}

/* Smooth transitions */
a, button {
  transition: all 0.25s ease;
}

/* Counter animation */
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-32px); }
  to   { opacity: 1; transform: translateX(0); }
}

.animate-fade-in-up {
  animation: fadeInUp 0.7s ease both;
}

.animate-fade-in {
  animation: fadeIn 0.6s ease both;
}

.animate-slide-in-left {
  animation: slideInLeft 0.7s ease both;
}

/* Property card hover */
.property-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.property-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 60px rgba(11, 45, 92, 0.15);
}

/* Service card hover */
.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 48px rgba(11, 45, 92, 0.12);
  border-color: #C9A23D;
}

/* Partners marquee */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.marquee-track {
  animation: marquee 28s linear infinite;
}

/* Input focus */
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #C9A23D;
  box-shadow: 0 0 0 3px rgba(201, 162, 61, 0.15);
}

/* Mobile bottom padding for sticky bar */
@media (max-width: 1024px) {
  footer {
    padding-bottom: calc(3.5rem + env(safe-area-inset-bottom));
  }
}

/* Gold text selection */
::selection {
  background: rgba(201, 162, 61, 0.25);
  color: #0B2D5C;
}

/* Smooth image loading */
img {
  background-color: #F7F8FA;
}

/* Input placeholder */
::placeholder {
  color: rgba(107, 114, 128, 0.6);
}

/* Nav active indicator */
.nav-active {
  color: #C9A23D;
  position: relative;
}
.nav-active::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
  height: 2px;
  background: #C9A23D;
}

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}
.reveal-left {
  opacity: 0;
  transform: translateX(-32px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal-left.revealed {
  opacity: 1;
  transform: translateX(0);
}
.reveal-right {
  opacity: 0;
  transform: translateX(32px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal-right.revealed {
  opacity: 1;
  transform: translateX(0);
}
.reveal-scale {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal-scale.revealed {
  opacity: 1;
  transform: scale(1);
}

/* Page transition */
@keyframes pageIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.page-enter {
  animation: pageIn 0.4s ease both;
}

/* Stagger children */
.stagger > *:nth-child(1) { transition-delay: 0ms; }
.stagger > *:nth-child(2) { transition-delay: 80ms; }
.stagger > *:nth-child(3) { transition-delay: 160ms; }
.stagger > *:nth-child(4) { transition-delay: 240ms; }
.stagger > *:nth-child(5) { transition-delay: 320ms; }
.stagger > *:nth-child(6) { transition-delay: 400ms; }
.stagger > *:nth-child(7) { transition-delay: 480ms; }
.stagger > *:nth-child(8) { transition-delay: 560ms; }
.stagger > *:nth-child(9) { transition-delay: 640ms; }
.stagger > *:nth-child(10) { transition-delay: 720ms; }
.stagger > *:nth-child(11) { transition-delay: 800ms; }
.stagger > *:nth-child(12) { transition-delay: 880ms; }