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

:root {
  --color-primary: #111111;
  --color-primary-light: #1C1C1C;
  --color-accent: #C5A880;
  --color-accent-hover: #B39257;
  --color-accent-light: #F3EFE9;
  --color-bg: #FBF9F6;
  --color-text-dark: #222222;
  --color-text-muted: #666666;
  --font-arabic-heading: 'Cairo', sans-serif;
  --font-arabic-body: 'Tajawal', sans-serif;
  --font-logo: 'Marcellus', serif;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: var(--color-bg);
}
::-webkit-scrollbar-thumb {
  background: var(--color-accent);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-accent-hover);
}

html, body {
  overflow-x: hidden;
  width: 100%;
}

body {
  font-family: var(--font-arabic-body);
  background-color: var(--color-bg);
  color: var(--color-text-dark);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-arabic-heading);
}

.font-logo {
  font-family: var(--font-logo);
}

/* Soft gold glow effect */
.glow-accent {
  box-shadow: 0 0 30px rgba(197, 168, 128, 0.2);
}

.text-gold-gradient {
  background: linear-gradient(135deg, #B39257 0%, #E2C799 50%, #C5A880 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bg-gold-gradient {
  background: linear-gradient(135deg, #B39257 0%, #C5A880 50%, #E2C799 100%);
}

/* Transition utility */
.transition-luxury {
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Scroll Animation classes */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

/* Overlay zoom for product cards */
.product-card-img-wrapper {
  overflow: hidden;
}

.product-card-img-wrapper img {
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.product-card:hover .product-card-img-wrapper img {
  transform: scale(1.08);
}

/* Premium Button Styling */
.btn-luxury {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.btn-luxury::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: var(--color-primary);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: -1;
}

.btn-luxury:hover::after {
  height: 100%;
}

/* Backglow element */
.logo-backglow {
  filter: blur(80px);
  background: radial-gradient(circle, rgba(197, 168, 128, 0.25) 0%, rgba(251, 249, 246, 0) 70%);
}

.hero-glow {
  filter: blur(100px);
  background: radial-gradient(circle, rgba(197, 168, 128, 0.15) 0%, rgba(251, 249, 246, 0) 70%);
}

/* Animated Burger Menu */
#menu-btn span {
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--color-primary);
  transition: all 0.3s ease-in-out;
}

#menu-btn.open span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

#menu-btn.open span:nth-child(2) {
  opacity: 0;
}

#menu-btn.open span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}
