:root {
  --background-50: 0.997 0.001 106.423;
  --background-100: 0.962 0.001 106.423;
  --background-200: 0.907 0.001 106.423;
  --background-300: 0.827 0.001 106.423;
  --background-400: 0.717 0.001 106.423;
  --background-500: 0.587 0.001 106.423;
  --background-600: 0.457 0.001 106.423;
  --background-700: 0.347 0.001 106.423;
  --background-800: 0.257 0.001 106.423;
  --background-900: 0.177 0.001 106.423;
  --background-950: 0.107 0.001 106.423;
  --accent-50: 0.97 0.014 242.574;
  --accent-100: 0.935 0.023 242.574;
  --accent-200: 0.875 0.038 242.574;
  --accent-300: 0.78 0.059 242.574;
  --accent-400: 0.67 0.086 242.574;
  --accent-500: 0.51 0.113 242.574;
  --accent-600: 0.5 0.109 242.574;
  --accent-700: 0.4 0.095 242.574;
  --accent-800: 0.31 0.074 242.574;
  --accent-900: 0.23 0.055 242.574;
  --accent-950: 0.15 0.036 242.574;
  --primary-50: 0.97 0.013 250.825;
  --primary-100: 0.935 0.021 250.825;
  --primary-200: 0.875 0.036 250.825;
  --primary-300: 0.78 0.055 250.825;
  --primary-400: 0.67 0.08 250.825;
  --primary-500: 0.427 0.105 250.825;
  --primary-600: 0.5 0.101 250.825;
  --primary-700: 0.4 0.088 250.825;
  --primary-800: 0.31 0.073 250.825;
  --primary-900: 0.23 0.059 250.825;
  --primary-950: 0.15 0.043 250.825;
  --secondary-50: 0.97 0.015 244.049;
  --secondary-100: 0.935 0.025 244.049;
  --secondary-200: 0.875 0.043 244.049;
  --secondary-300: 0.78 0.066 244.049;
  --secondary-400: 0.67 0.096 244.049;
  --secondary-500: 0.512 0.126 244.049;
  --secondary-600: 0.5 0.121 244.049;
  --secondary-700: 0.4 0.099 244.049;
  --secondary-800: 0.31 0.076 244.049;
  --secondary-900: 0.23 0.057 244.049;
  --secondary-950: 0.15 0.037 244.049;
  --foreground-50: 0.97 0.003 284.49;
  --foreground-100: 0.93 0.004 284.49;
  --foreground-200: 0.86 0.005 284.49;
  --foreground-300: 0.76 0.007 284.49;
  --foreground-400: 0.65 0.01 284.49;
  --foreground-500: 0.54 0.013 284.49;
  --foreground-600: 0.43 0.016 284.49;
  --foreground-700: 0.34 0.018 284.49;
  --foreground-800: 0.27 0.02 284.49;
  --foreground-900: 0.2 0.021 284.49;
  --foreground-950: 0.219 0.021 284.49;
  --font-heading: "Tajawal", "Cairo", "Noto Sans Arabic", sans-serif;
  --font-body: "Tajawal", "Cairo", "Noto Sans Arabic", sans-serif;
}

html { scroll-behavior: smooth; }

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  background: oklch(var(--background-50));
  color: oklch(var(--foreground-950));
}

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

@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 0 0 oklch(var(--accent-500) / 0.35), 0 0 0 0 oklch(var(--accent-500) / 0.2); }
  50% { box-shadow: 0 0 0 10px oklch(var(--accent-500) / 0), 0 0 0 14px oklch(var(--accent-500) / 0); }
}
.glow-ring {
  animation: glow-pulse 2.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  border-color: oklch(var(--accent-500) / 0.5) !important;
}

.article-content h2 {
  font-size: 1.25rem;
  font-weight: 700;
  color: oklch(var(--foreground-900));
  margin-top: 2rem;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid oklch(var(--primary-200));
  font-family: var(--font-heading);
}
.article-content h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: oklch(var(--foreground-900));
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}
.article-content p {
  margin-bottom: 1.25rem;
  line-height: 1.85;
  color: oklch(var(--foreground-800));
}
.article-content ul {
  list-style: none;
  padding-right: 0;
  margin-bottom: 1.25rem;
}
.article-content ul li {
  position: relative;
  padding-right: 1.5rem;
  margin-bottom: 0.75rem;
  line-height: 1.75;
  color: oklch(var(--foreground-800));
}
.article-content ul li::before {
  content: "";
  position: absolute;
  right: 0;
  top: 0.6rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: oklch(var(--primary-400));
}
.article-content a { color: oklch(var(--primary-600)); text-decoration: underline; }

[x-cloak] { display: none !important; }

@keyframes booking-form-glow {
  0%, 100% {
    box-shadow: 0 0 0 0 oklch(var(--primary-400) / 0.35), 0 10px 30px oklch(var(--primary-500) / 0.15);
  }
  50% {
    box-shadow: 0 0 0 10px oklch(var(--primary-400) / 0), 0 15px 40px oklch(var(--primary-500) / 0.25);
  }
}

.booking-form-highlight {
  animation: booking-form-glow 1.2s ease-in-out 3;
}