 /* [01] */
@font-face {
  font-family: 'Kalameh';
  font-style: bold;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/Kalameh\ Bold.ttf') format('woff2');
}

/* [02] */
@font-face {
  font-family: 'IranianSans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/IranianSans.ttf') format('woff2');
}
 .site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* کانتینر وسط چین */
.header-container {
  
  margin: 0 auto;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}



/* دکمه منو */
.menu-toggle {
  font-size: 24px;
  background: none;
  border: none;
  cursor: pointer;
}

/* منوی موبایل */
.mobile-menu {
  direction: rtl;
  position: fixed;
  top: 0;
  right: 0;
  width: 260px;
  height: 100%;
  background: hsl(0, 0%, 95%,0.6);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  padding: 20px;
}

/* حالت باز */
.mobile-menu.open {
  transform: translateX(0);
}

/* دکمه بستن */
.close-menu {
  background: none;
  border: none;
  font-size: 28px;
  cursor: pointer;
  margin-bottom: 20px;
}

/* آیتم‌ها */
.mobile-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobile-menu li {
  margin-bottom: 16px;
}

.mobile-menu a {
  font-family: 'IranianSans';
  text-decoration: none;
  font-size: 16px;
}

.intro-container {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  padding: 50px;
}
.about-container {
  height: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  padding: 50px;
}

.intro-box {
  flex: 1 1 300px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
  min-height: 350px;
  display: flex;
  flex-direction: column;
}
.about-box {
  flex: 1 1 300px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}
.text-box {
  font-family: 'IranianSans';
  text-align: justify;
  background-color: #F2F2F2;
  padding: 40px;
  justify-content: center;
  line-height: 2;
}

.image-box {
  background-image: url('../images/sections/section2.jpg');
  background-size: cover;
  background-position: center;
}
.image-box1 {
  background-image: url('../images/pages/page2.jpeg');
  background-size: cover;
  background-position: center;
}
.image-box2 {
  background-image: url('../images/pages/page3.jpg');
  background-size: cover;
  background-position: center;
}
.image-box3 {
  background-image: url('../images/pages/page4.jpg');
  background-size: cover;
  background-position: center;
}
.image-box5 {
  background-image: url('../images/sections/section2.jpg');
  background-size: cover;
  background-position: center;
}

/* --- استایل بخش دوم (خدمات) --- */
.services-section {
  padding: 30px;
  text-align: center;
}



.services-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.service-card {
  flex: 1 1 300px;
  /* سه عدد در ردیف، در موبایل زیر هم */
  max-width: 440px;
  background: #F2F2F2;
  padding: 40px 40px;
  border-radius: 20px;
  /* بوردر کرو مطابق درخواست */
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.05);
  /* شادو ملایم */
  transition: transform 0.3s ease;
}


.service-card:hover {
  transform: translateY(-10px);
  /* افکت حرکت به بالا هنگام هاور */
}

 

 .service-card h3 {
   font-size: 22px;
   color: #333;
   margin-bottom: 15px;
 }

 .imgbox {
   display: flex;
  justify-content: center; /* وسط افقی */
  align-items: center;     /* وسط عمودی */
 }

 .service-card p {
   font-family: 'IranianSans';
   font-size: 14px;
   line-height: 1.7;
   text-align: center;
 }
/* --- تنظیمات رسپانسیو --- */
@media (max-width: 768px) {
  .intro-container {
    flex-direction: column-reverse;
    font-size: 10px;
  }

  .section-header h2 {
    font-size: 24px;
  }

  .service-card {
    flex: 1 1 100%;
    /* در موبایل هر کارت تمام عرض را می‌گیرد */
  }
}
.site-footer {
  color: #ffffff;
   font-family: 'IranianSans';
}

.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.icon-span {
    color: #cf6019;
    margin-bottom: 1rem;
}
.light-text {
  margin-bottom: 1rem;
    letter-spacing: 0.05em;
 
    font-weight: 300;
}
.footer-col h3 {
  font-size: 18px;
  margin-bottom: 15px;
  color: #cf6019;
}

.footer-col ,
.footer-col li {
  font-size: 18px;
  margin-bottom: 10px;
}

.footer-col a {
  color: #ffffff;
  text-decoration: none;
}

.footer-col a:hover {
  color: #f97316; /* نارنجی */
}

.footer-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-bottom {
  text-align: center;
  padding: 15px;
  font-size: 13px;
  background-color: #020617;
  color: #94a3b8;
}

/* 📱 رسپانسیو */
@media (max-width: 768px) {
  .footer-container {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .minimage{
    width: 100px;
  }
}

 body {
            font-family: 'Tahoma', sans-serif;
            background-color: #f9f9f9;
            margin: 0;
            padding: 0;
        }

        /* --- استایل بخش اول (قبلی) --- */
        .intro-container {
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
            padding: 40px 20px;
        }

        .intro-box {
            flex: 1 1 300px;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 10px 20px rgba(0,0,0,0.1);
            min-height: 350px;
            display: flex;
            flex-direction: column;
        }

        .text-box {
            background-color: #f4f4f4;
            padding: 40px;
            justify-content: center;
        }

        .image-box {
            background-image: url('../images/pages/page1.jpg'); /* عکس نمونه لجستیک */
            background-size: cover;
            background-position: center;
        }

        /* --- استایل بخش دوم (خدمات) --- */
        .services-section {
            padding: 60px 20px;
            text-align: center;
        }

        .section-header h2 {
            font-size: 28px;
            color: #222;
            margin-bottom: 10px;
        }

        .section-header p {
            font-size: 16px;
            color: #666;
            margin-bottom: 40px;
        }

        .services-grid {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            justify-content: center;
        }

        .service-card {
            flex: 1 1 300px; /* سه عدد در ردیف، در موبایل زیر هم */
            max-width: 380px;
            background: #fff;
            padding: 40px 20px;
            border-radius: 20px; /* بوردر کرو مطابق درخواست */
            box-shadow: 0 8px 15px rgba(0,0,0,0.05); /* شادو ملایم */
            transition: transform 0.3s ease;
        }

        .service-card:hover {
            transform: translateY(-10px); /* افکت حرکت به بالا هنگام هاور */
        }

        .service-card i {
            font-size: 50px;
            color: #0056b3; /* رنگ آبی تجاری */
            margin-bottom: 20px;
        }

        .service-card h3 {
            font-size: 22px;
            color: #333;
            margin-bottom: 15px;
        }

        .service-card p {
            font-size: 14px;
            color: #777;
            line-height: 1.7;
        }

        /* --- تنظیمات رسپانسیو --- */
        @media (max-width: 768px) {
            .intro-container {
                flex-direction: column-reverse;
            }
            .section-header h2 {
                font-size: 24px;
            }
            .service-card {
                flex: 1 1 100%; /* در موبایل هر کارت تمام عرض را می‌گیرد */
            }
            .about-container {
              font-size: 10px;
            }
        }