.body1 {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    direction: rtl;
    text-align: center;
    background: #f5f5f5;
  }
  .container1 {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
  }

  .why-us1 {
    padding: 20px;
  }
  .features1 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
  }
  .feature1 {
    background: #fff;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  .feature-icon1 {
    font-size: 24px;
    color: #5b8f8d;
    margin-bottom: 10px;
  }
  #contact1 {
    background: #f5f5f5;
    padding: 20px;
  }
  .contact-info1 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
  }
  .contact-box1 {
    background: #ffffff;
    padding: 8px;
    border-radius: 6px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    flex: 1;
    min-width: 30%;
  }
 .social-icons1 {
display: flex;
justify-content: center; /* برای قرار دادن آیکون‌ها در وسط */
gap: 25px; /* فاصله بین آیکون‌ها */
margin-top: 20px;
}

.social-icons1 a {
display: inline-block;
text-decoration: none;
font-size: 36px; /* اندازه آیکون‌ها */
color: #5b8f8d; /* رنگ اولیه آیکون‌ها */
transition: transform 0.3s ease, color 0.3s ease; /* انیمیشن برای تغییرات */
}

.social-icons1 a:hover {
transform: scale(1.2); /* بزرگ شدن آیکون‌ها در حالت هاور */
color: #ff4081; /* تغییر رنگ در حالت هاور */
}

.social-icons1 i {
display: block;
margin: 0 auto;
}

/* برای نمایش آیکون‌ها در موبایل */
@media (max-width: 768px) {
.social-icons1 a {
font-size: 30px; /* کمی کوچکتر در موبایل */
}
}


  @media (max-width: 768px) {
    .features1 {
      grid-template-columns: repeat(2, 1fr);
    }
    .contact-info1 {
      flex-direction: row;
    }
    .contact-box1 {
      width: 30%;
    }

}

  /* استایل‌های عمومی برای هدر */
.header1 {
height: 120px; /* کاهش ارتفاع هدر */
background: rgb(107, 58, 32);
color: #fff;
display: flex;
align-items: center;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

position: relative;
top: 92px;
justify-content: center; /* مرکز کردن افقی */
align-items: center; /* مرکز کردن عمودی */
flex-direction: column; /* قرار دادن عناصر در یک ستون */
text-align: center; /* مرکز کردن متن */
}

.header1 button {
background: #fff;
color: #000000;
border: none;
padding: 10px 20px;
font-size: 30px;
font-weight: bold;
border-radius: 25px;
cursor: pointer;
transition: background 0.3s ease;
position: absolute;
/* موقعیت اولیه دکمه در حالت دسکتاپ */
top: 50%; /* قرار دادن دکمه در وسط هدر */
right: 10%; /* فاصله دکمه از سمت راست */
transform: translateY(-50%);
}
.button{
  background: #fff;
color: #000000;
border: none;
padding: 10px 20px;
font-size: 20px;
font-weight: bold;
border-radius: 25px;
cursor: pointer;
transition: background 0.3s ease;
position: absolute;
/* موقعیت اولیه دکمه در حالت دسکتاپ */
top: 50%; /* قرار دادن دکمه در وسط هدر */
right: 10%; /* فاصله دکمه از سمت راست */
transform: translateY(-50%);
}

.header1 button:hover {
background: #ffcccc;
}
.header1 span {
font-size: 22px;
font-weight: 400;
line-height: 1.4;
padding: 0px;
text-align: center;
white-space: nowrap; /* جلوگیری از شکست متن */
overflow: hidden; /* مخفی کردن متن اضافی */
text-overflow: ellipsis; /* اضافه کردن "..." در صورت نیاز */
}

.header1 img {
position: absolute;
top: 42%;
left: 78px;
transform: translateY(-50%);
width: 328px;
height: 328px; /* افزایش ارتفاع عکس */
border-radius: 15px;
}


/* استایل‌ها برای موبایل */
@media (max-width: 768px) {
.header1 img {
    width: 196px;
    height: 287px; /* عکس در موبایل هم ریسپانسیو باشد */
    left: -3px; /* اورفلو کمتر در موبایل */
}

.header1 span {
    font-size: 9px; /* تغییر اندازه فونت برای موبایل */
    font-weight: 400;
    line-height: 1.4;
    padding: 0px;
    margin-left: 52px;
}

.header1 button {
    position: relative;
    top: 10px;
    margin: -16px 62px;
    margin-left: 422px;
    width: 55px;
    font-size: 12px;
    padding: 6px;
    order: 2;
    right: -300; /* چسباندن دکمه به لبه راست */
}
}

/* استایل‌ها برای دسکتاپ */
@media (min-width: 769px) {
.header1 button {
    position: absolute;
    top: 50%; /* در حالت دسکتاپ دکمه در وسط هدر قرار می‌گیرد */
    right: 10%; /* موقعیت دکمه از سمت راست */
    transform: translateY(-50%); /* تنظیم عمودی دکمه */
    width: 96px;
    height: 52px;
    font-size: 16px;
  }
}
.contact-box1 p {
direction: ltr;
font-size: 1.5rem; /* می‌توانید این مقدار را به دلخواه تغییر دهید */
}
.social-icons1 i {
font-size: 2.8rem; /* اندازه ایموجی‌ها */
}

.contact-box1 a {
color: #5b8f8d; /* تغییر رنگ لینک */
font-size: 1.5rem; /* اندازه پیش‌فرض برای دسکتاپ */
}

@media (max-width: 768px) {
.contact-box1 a {
font-size: 1.2rem; /* اندازه لینک برای موبایل */
}
}

/* تغییر ضخامت فونت برای دستگاه‌های کوچکتر (موبایل) */
@media (max-width: 768px) {
.contact-box1 p:last-child strong {
font-weight: 70; /* نازک‌تر کردن فقط این متن در موبایل */
}
}

/* تغییر موقعیت باکس در موبایل */
@media (max-width: 768px) {
div[style*="background: #ecf0f1"] {
margin-top: -28px; /* بالا بردن باکس در موبایل */
}
}