/* الألوان الأساسية */
:root {
  --main-dark: #0a2540;   /* أزرق كحلي */
  --main-light: #2d8cff; /* أزرق فاتح */
  --text-light: #ffffff;
  --text-dark: #333333;
}

/* تنسيق الجسم */
body {
  margin: 0;
  font-family: Arial, sans-serif;
  background-color: var(--main-dark);
  color: var(--text-light);
}

/* الهيدر */
header {
  background-color: var(--main-dark);
  padding: 15px;
  text-align: center;
}

header img {
  max-height: 60px;
}

/* الهيرو */
.hero {
  background: linear-gradient(135deg, var(--main-dark), var(--main-light));
  padding: 60px 20px;
  text-align: center;
}

.hero h1 {
  font-size: 2.5rem;
  margin-bottom: 10px;
}

.hero p {
  font-size: 1.2rem;
  color: var(--text-light);
}