.section {
  background-color: white;
  border-radius: 12px;
  padding: 20px;
  margin: 20px auto;
  max-width: 700px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}


.section p {
  font-size: 16px;
  line-height: 1.6;
}


.values-list {
  list-style: none;
  padding: 0;
}

.values-list li {
  margin: 10px 0;
  font-size: 15px;
}

/* الكاروسيل */
.carousel {
  position: relative;
  overflow: hidden;
  max-width: 700px;
  margin: auto;
}

.carousel-track {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.carousel img {
  width: 180px;
  margin: 10px;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}


.carousel-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #001F3F;
  color: white;
  border: none;
  padding: 8px 12px;
  cursor: pointer;
  border-radius: 50%;
}

.carousel-button.left {
  left: 10px;
}

.carousel-button.right {
  right: 10px;
}


.partner-slider img,
.client-slider img {
  width: 100%;
  height: 120px; 
  object-fit: contain; 
  display: block;
  margin: auto;
}


.swiper-slide {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}


.swiper-wrapper {
  align-items: center;
}
.swiper-slide img {
  width: 100%;
  height: 120px;
  object-fit: contain; 
  display: block;
  margin: auto;
}


.swiper {
  width: 100%;
  padding: 20px 0;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  max-width: 100%;
  max-height: 120px; 
  object-fit: contain; 
}


.swiper {
  width: 100%;
  padding: 20px 0;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  max-width: 100%;
  max-height: 120px; 
  object-fit: contain;
}


.swiper-button-next,
.swiper-button-prev {
  color: #000;            
  width: 25px;            
  height: 25px;           
}

.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 20px;        
}



.service-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 15px;
  padding: 10px 20px;
  background-color: #f8f8f8; 
  color: #1a1a1a; 
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  border-radius: 8px;
  border: 2px solid #1a1a1a; 
  transition: background-color 0.3s, transform 0.2s, color 0.3s;
}

.service-btn:hover {
  background-color: #1a1a1a; 
  color: #f8f8f8; 
  transform: translateY(-2px);
}

.service-btn img {
  display: inline-block;
}


:root{
  --navy-900: #021124;
  --navy-700: #05293a;
  --navy-500: #0b5f73;
  --accent: #0ea5a0;
  --muted: #6b7280;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: 'Tajawal', sans-serif;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  color:#0b2230;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{max-width:1100px;margin:0 auto;padding:20px}
.site-header{background:var(--navy-900);color:#fff;padding:14px 0;position:sticky;top:0;z-index:30}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.logo{height:48px}
.main-nav a{margin:0 12px;color:#d1e8ef;text-decoration:none;font-weight:600}
.hero{background:linear-gradient(90deg, rgba(2,17,36,0.95) 0%, rgba(5,41,58,0.9) 100%);color:#fff;padding:60px 0}
.hero .hero-content{max-width:640px}
.hero h1{font-size:34px;margin:0 0 12px}
.hero p{font-size:18px;color:#d1e8ef}
.btn{display:inline-block;padding:12px 20px;border-radius:10px;text-decoration:none;font-weight:700}
.btn.primary{background:var(--accent);color:#fff}
.btn.outline{border:2px solid rgba(255,255,255,0.12);color:#fff;background:transparent}
.hero-image img{max-width:180px;opacity:0.95;margin-top:20px}

.services-preview{padding:40px 0}
.services-preview h2{text-align:center;color:var(--navy-900);margin-bottom:18px}
.cards{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.card{background:#fff;border-radius:12px;padding:20px;width:300px;box-shadow:0 8px 20px rgba(2,17,36,0.06)}
.card h3{margin:0 0 8px;color:var(--navy-700)}

.contact-cta{background:linear-gradient(90deg, rgba(5,41,58,0.05), rgba(2,17,36,0.02));padding:30px 0;text-align:center}

.page{padding:40px 0;background:#fff;border-radius:12px;margin-top:20px}
.service-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.service-item{background:linear-gradient(180deg,#ffffff,#f7fbfc);padding:18px;border-radius:10px;box-shadow:0 6px 18px rgba(11,34,48,0.04)}

.site-footer{background:var(--navy-900);color:#d1e8ef;padding:20px 0;margin-top:30px}
.site-footer .container{display:flex;justify-content:space-between;align-items:center}
.footer-logo{height:40px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.contact-form input,.contact-form textarea{width:100%;padding:10px;margin-bottom:10px;border:1px solid #e6eef0;border-radius:8px}
.contact-form textarea{min-height:120px;resize:vertical}

@media(max-width:800px){
  .header-inner{flex-direction:column;gap:10px}
  .main-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
  .cards{flex-direction:column;align-items:center}
  .contact-grid{grid-template-columns:1fr}
}

.whatsapp-float{position:fixed;bottom:20px;left:20px;background:#25D366;border-radius:50%;width:56px;height:56px;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(2,17,36,0.16);z-index:90}
.whatsapp-float img{width:28px;height:28px}



#splash-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0a1a3f;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.splash-logo {
    width: 200px;
    animation: fadeIn 1.5s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.8); }
    to { opacity: 1; transform: scale(1); }
}

/* زر واتساب */
#whatsapp-popup {
    display: none;
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 10000;
}
#whatsapp-popup img {
    width: 50px;
    border-radius: 50%;
}