
  * { margin: 0; padding: 0; box-sizing: border-box; }

  body {
    font-family: 'Tajawal','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI','Roboto',sans-serif;
    background: linear-gradient(135deg,#111 0%,#000 100%);
    background-attachment: fixed;
    color: #fff;
    overflow-x: hidden;
  }

  html { scroll-behavior: smooth; }

  /* Scrollbar */
  ::-webkit-scrollbar { width: 8px; }
  ::-webkit-scrollbar-track { background: #111; }
  ::-webkit-scrollbar-thumb { background: #666; border-radius: 4px; }
  ::-webkit-scrollbar-thumb:hover { background: #999; }

 

  /* موبايل/تابلت: وسط الروابط وزر اللغة داخل الكولابس */
  @media (max-width: 991.98px){
    .nav-wrap{
      width:100%;
      flex-direction: column;
      align-items:center;              /* بالنص */
      gap:.75rem;
      padding:.5rem 0;
    }
    .navbar-nav{
      flex-direction: column;
      align-items:center;              /* بالنص */
      gap:.25rem;
    }
    .navbar .nav-link{ padding:.6rem .25rem; }
  }

  /* ---------- Buttons ---------- */
  .btn-primary{
    background:#fff; color:#000; border:none; border-radius:.5rem;
    padding:.5rem 1.5rem; font-weight:600; transition:.3s all ease;
  }
  .btn-primary:hover{ background:#ccc; transform:scale(1.05); }
  .btn-hero{ transition:.3s all ease; }
  .btn-hero:hover{ transform:scale(1.05); }
  .btn-outline-light{ border:2px solid #fff; color:#fff; }
  .btn-outline-light:hover{ background:#fff; color:#000; }

  /* ---------- Hero ---------- */
  .hero-section{ position:relative; height:100vh; overflow:hidden; padding:0; }
  #heroCarousel .carousel-item{ height:100vh; }
  #heroCarousel .carousel-item img{ object-fit:cover; width:100%; height:100%; }

  .hero-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.6); z-index:1; pointer-events:none; }

  .carousel-caption{
    position:absolute; inset:0; z-index:2;
    display:flex; flex-direction:column; justify-content:center; align-items:center;
    text-align:center; padding:0 1rem;
  }

  .carousel-caption .hero-title,
  .carousel-caption .hero-subtitle,
  .carousel-caption .btn-hero{
    opacity:0; transform:translateY(30px); animation: fadeInUp 1s ease-out forwards;
  }
  .carousel-caption .hero-title{ font-size:2.7rem; font-weight:800; line-height:1.2; margin-bottom:1rem; animation-delay:.5s; }
  .carousel-caption .hero-subtitle{ font-size:1.35rem; color:#ddd; margin-bottom:2rem; animation-delay:.8s; }
  .carousel-caption .btn-hero{ font-size:1.1rem; padding:.8rem 2rem; border-radius:.5rem; font-weight:700; animation-delay:1.1s; }

  /* ---------- Sections ---------- */
  .section{ padding:5rem 0; }
  .section-title{ font-size:2.5rem; font-weight:800; text-align:center; margin-bottom:1rem; }
  .section-subtitle{ font-size:1.2rem; color:#ddd; text-align:center; margin-bottom:3rem; }
  .text-primary{ color:#fff !important; }

  /* Cards */
  .glass-card{
    background: rgba(20,20,20,.6);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 1rem;
    padding: 2rem;
    transition: .5s all ease;
    height: 100%;
  }
  .service-card{ margin-bottom:2rem; }
  .service-card img{
    width:100%; height:200px; object-fit:cover;
    border-radius:.8rem; margin-bottom:1rem;
  }
  .service-icon{
    font-size:2rem; position:absolute; top:1rem; left:1rem;
    background:rgba(255,255,255,.8); backdrop-filter:blur(8px);
    border-radius:50%; width:50px; height:50px; display:flex; align-items:center; justify-content:center; color:#000;
  }

  /* Team */
  .team-card{ text-align:center; }
  .team-photo{ width:120px; height:120px; border-radius:50%; margin:0 auto 1rem; border:4px solid rgba(255,255,255,.3); object-fit:cover; }
  .team-photo-large{ width:140px; height:140px; }
  .team-name{ font-size:1.5rem; font-weight:800; margin-bottom:.5rem; }
  .team-position{ color:#fff; font-weight:700; margin-bottom:1rem; }
  .team-description{ color:#ddd; line-height:1.8; margin-bottom:1.5rem; }
  .specialty-tag{
    background: rgba(255,255,255,.1); color:#eee; padding:.3rem .8rem; border-radius:20px; font-size:.85rem;
    border:1px solid rgba(255,255,255,.2); margin:.2rem; display:inline-block;
  }

  /* Values */
  .values-card{ text-align:center; padding:3rem 2rem; }
  .values-icon{ font-size:3rem; margin-bottom:1.2rem; }
  .values-title{ font-size:1.8rem; font-weight:800; margin-bottom:1rem; }


  /* Animations */
  @keyframes fadeInUp { from{opacity:0; transform:translateY(30px);} to{opacity:1; transform:translateY(0);} }
  @keyframes fadeInLeft { from{opacity:0; transform:translateX(30px);} to{opacity:1; transform:translateX(0);} }
  @keyframes fadeInRight{ from{opacity:0; transform:translateX(-30px);} to{opacity:1; transform:translateX(0);} }

  .animate-on-scroll{ opacity:0; transform:translateY(30px); transition:.8s all ease; }
  .animate-on-scroll.animated{ opacity:1; transform:translateY(0); }

  .bg-pattern-1,.bg-pattern-2{ background:transparent; backdrop-filter:none; }

  /* RTL helpers (للأيقونة فقط) */
  [dir="rtl"] .me-2{ margin-left:.5rem !important; margin-right:0 !important; }
  [dir="rtl"] .ms-2{ margin-right:.5rem !important; margin-left:0 !important; }

  /* Hero responsive */
  @media (max-width:768px){
    .carousel-caption .hero-title{ font-size:2.4rem; }
    .carousel-caption .hero-subtitle{ font-size:1.1rem; }
    .btn-hero{ font-size:1rem; padding:.7rem 1.5rem; }
    .section-title{ font-size:2.2rem; }
  }

  #heroCarousel .carousel-control-prev,
  #heroCarousel .carousel-control-next{ z-index:3; }

  .text-start{ text-align:right !important; }