@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400..700&display=swap');
:root {
  --primaryColor: #000000;
  --helperColor: #0275d8;
  --lightHelper: #0275d8;
  --bgProject:#400b5015;
  --hrColor: #e8eef3;
  --middleColor: #3d3d3d;
  --transparentColor: rgba(0, 0, 0, 0.699);
  --shadow: rgba(189, 188, 188, 0.514);
  /* --------------------------------- */
  --whatsappColor: #5cb85c;
  --white: #ffff;
  --blue: #1877F2;
  --green: #25D366;
  --gray: #f8f8f8;
  --container-width: 1340px;
  --header-height: 200px;
  /* 👈 غيّر الرقم حسب الارتفاع اللي تحبه */

}

.m-top{
  margin-top: 80px;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "El Messiri", sans-serif;
}

a {
  text-decoration: none;
  transition: all 0.5s;

}
#projects,#skills-slider,.none{
  display: none !important;
}
ul {
  list-style: none;
}
.container-width{
  max-width: 900px !important;
  margin-inline: auto !important;
}
.container {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.m-auto{
  margin-inline: auto !important;
}
body::-webkit-scrollbar {
  width: 8px
}
body::-webkit-scrollbar-track {
  background-color: var(--primaryColor)
}

body::-webkit-scrollbar-thumb {
  background-color: var(--lightHelper);
  background-image: linear-gradient(0deg,var(--lightHelper) 0%,var(--helperColor) 100%);
  border-radius: 5px
}