@charset "utf-8";
/* CSS Document */
#abouut {background-image: url("../img/bg.jpg")}

#contact {background-color:gainsboro}
.footer {background-image: url("../img/bgg.jpg")}
nav  {background-color: #4267b2;
    box-shadow: 0.5 0.5 0.5 0.5 black;
  
height: 100px;
padding-top: 100px;}
.navbar-nav a{color:white;}
.navbar-nav a:active{color:orange;}
.navbar-nav a:checked{color:orange;}
.nav-link a:active{color:orange;}

.navbar-nav a:active{color:orange;}

#navMenu {color:white;}

   
      .logo-slider {
  overflow: hidden;
  position: relative;
}

.logo-track {
  display: flex;
  width: calc(180px * 14); /* Adjust based on # of logos */
  animation: scroll 10s linear infinite;
}

.logo-track img {
  width: 180px;
  height: auto;
  margin: 0 0.5rem;
  opacity: 0.9;
  transition: transform 0.3s;
}

.logo-track img:hover {
  transform: scale(1.1);
  opacity: 0.9;
}

@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}


.logo-slider {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.logo-track {
  display: flex;
  width: calc(250px * 20);
  animation: scroll 40s linear infinite;
}

.logo-slider:hover .logo-track {
  animation-play-state: paused; /* توقف عند الوقوف */
}

.logo-track a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 250px;
  padding: 5px;
}

.logo-track img {
  width: 180px;
  height: auto;
  transition: transform 0.3s ease;
  filter: brightness(0.95);
}

.logo-track a:hover img {
  transform: scale(1.1);
  filter: brightness(1.1);
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

.custom-navbar {
  background-color: #4368b0f !important; /* أزرق رئيسي */
  transition: background-color 0.4s ease, box-shadow 0.3s ease;
}

.custom-navbar.scrolled {
  background-color: #0056b3 !important; /* أزرق أغمق عند التمرير */
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

/* شعار الموقع */
.navbar-brand img {
  transition: transform 0.3s ease;
}
.navbar-brand:hover img {
  transform: scale(1.05);
}

/* روابط النافبار */
.navbar-nav .nav-link {
  font-weight: 500;
  color: #fff !important;
  position: relative;
  transition: color 0.3s ease;
  padding: 10px 15px;
}

.navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: #fff;
  transition: all 0.3s ease;
  transform: translateX(-50%);
}

.navbar-nav .nav-link:hover {
  color: #fff !important;
  opacity: 0.9;
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
  width: 50%;
}

/* زر القائمة (الهاتف) */
.navbar-toggler {
  border: none;
  filter: invert(1); /* يجعل الأيقونة بيضاء */
  transition: transform 0.3s ease;
}
.navbar-toggler:focus {
  box-shadow: none;
}
.navbar-toggler:not(.collapsed) {
  transform: rotate(90deg);
}




html, body {
  overflow-x: hidden;
}

    :root{--accent:#5c6ac4;--muted:#6c757d}
    body{font-family: 'Cairo', sans-serif;background:#f7f9ff;color:#222}
    /* Navbar custom */
    .navbar-brand{font-weight:800;letter-spacing:1px}
    .nav-link{font-weight:600}

    /* Hero / Carousel overlay */
    .carousel-caption{bottom:30%;text-shadow:0 6px 18px rgba(0,0,0,.45)}
    .hero-slide{min-height:60vh;background-size:cover;background-position:center}

    /* Cards */
    .feature-card{transition:transform .35s ease, box-shadow .35s ease}
    .feature-card:hover{transform:translateY(-10px);box-shadow:0 18px 36px rgba(44,62,80,.12)}

    /* Counters */
    .counter{font-weight:800;font-size:2.2rem;color:var(--accent)}

    /* Footer */
    footer{background:#0f1724;color:#cbd5e1;padding:48px 0}
    footer a{color:#e6eefc}

    /* Back to top */
    #backTop{position:fixed;right:20px;bottom:20px;z-index:9999;display:none}

    /* Small polish */
    .glass{backdrop-filter: blur(6px);background:rgba(255,255,255,.6)}
    .badge-accent{background:linear-gradient(90deg,var(--accent),#8f9bff);color:white}
      
      .masthead {
  height: 100vh;
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  overflow: hidden;
}

#heroVideo {
  object-fit: cover;
  z-index: 1;
}

.overlay {
  z-index: 2;
}

/* تحريك العناصر بتأخير بسيط */
@keyframes fadeInUpCustom {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate__fadeInUp {
  animation: fadeInUpCustom 1s ease forwards;
}


     html, body {
  overflow-x: hidden;
}
    :root{--accent:#5c6ac4;--muted:#6c757d}
    body{font-family: 'Cairo', sans-serif;background:#f7f9ff;color:#222}
    /* Navbar custom */
    .navbar-brand{font-weight:800;letter-spacing:1px}
    .nav-link{font-weight:600}

    /* Hero / Carousel overlay */
    .carousel-caption{bottom:30%;text-shadow:0 6px 18px rgba(0,0,0,.45)}
    .hero-slide{min-height:60vh;background-size:cover;background-position:center}

    /* Cards */
    .feature-card{transition:transform .35s ease, box-shadow .35s ease}
    .feature-card:hover{transform:translateY(-10px);box-shadow:0 18px 36px rgba(44,62,80,.12)}

    /* Counters */
    .counter{font-weight:800;font-size:2.2rem;color:var(--accent)}

    /* Footer */
    footer{background:#0f1724;color:#cbd5e1;padding:48px 0}
    footer a{color:#e6eefc}

    /* Back to top */
    #backTop{position:fixed;right:20px;bottom:20px;z-index:9999;display:none}

    /* Small polish */
    .glass{backdrop-filter: blur(6px);background:rgba(255,255,255,.6)}
    .badge-accent{background:linear-gradient(90deg,var(--accent),#8f9bff);color:white}
      
      .masthead {
  height: 100vh;
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  overflow: hidden;
}

#heroVideo {
  object-fit: cover;
  z-index: 1;
}

.overlay {
  z-index: 2;
}

/* تحريك العناصر بتأخير بسيط */
@keyframes fadeInUpCustom {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate__fadeInUp {
  animation: fadeInUpCustom 1s ease forwards;
}

      .image-box {
  background: #ffffff;
  border-radius: 18px;
  padding: 16px;
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 10px 25px rgba(0,0,0,0.06);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.image-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 50px rgba(0,0,0,0.12);
}

/* الصورة داخل الإطار */
.image-box img {
  border-radius: 14px;
  transition: transform 0.4s ease;
}

.image-box:hover img {
  transform: scale(1.04);
}

/* النص */
.image-box p {
  margin-bottom: 0;
  font-size: 0.95rem;
  transition: color 0.3s ease;
}

.image-box:hover p {
  color: var(--accent);
}

      /* توحيد حجم المربع */
.image-box {
  height: 360px;                /* ارتفاع ثابت لكل المربعات */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* حاوية الصورة */
.image-box img {
  width: 100%;
  height: 300px;                /* ارتفاع موحد للصورة */
  object-fit: cover;            /* قص ذكي بدون تشويه */
  border-radius: 10px;
}

/* النص أسفل الصورة */
.image-box p {
  margin: 12px 0 0;
  text-align: center;
}


.brand-box {
  transition: all 0.3s ease;
  border-radius: 12px;
}

.brand-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0,0,0,0.15);
}

.brand-logo {
  max-height: 90px;
  object-fit: contain;
  filter: grayscale(100%);
  transition: 0.3s;
}

.brand-box:hover .brand-logo {
  filter: grayscale(0%);
}