/*  تغییر رنگ باند بالای صفحه موبایلی*/
#AFMobileHeaderSection #AFMobileHeaderBox {
border-bottom: 10px solid #F58220;
  box-shadow: 0 0 32px -6px #0066B3;
}

 
/*  تغییر رنگ باند بالای صفحه از مشکی به نارنجی */
.top-menu {
background: #F58220;
}

/*   (راست)اندازه فلش اسلایدر قبل  */
.an-le {
  color: #fff;
  font-size: 38px !important;
  padding: 30px 0 0 23px;
  /* scale: 220%; */
}

  /*  (چپ)اندازه فلش اسلایدر بعد  */
.an-le1 {
  color: #fff;
  font-size: 38px !important;
  padding: 30px 0 0 11px;
  /* scale: 220%; */
}


/*** قالب ***/
  /*اندازه لوگو بزرگتر بشه   */
.top-logo img {
  max-height: 150px;
  margin: auto;
  padding-bottom: 0px;
}

  /* مقدار عرض منوی هدر */
.col-md-8 {
    width: 50.66666667%;
}

  /* فاصله منوها از بالا در هدر */
#MenuV2 {
  margin-top: 55px;
}

  /* فاصله شماره تماس از بالا در هدر */
.phone {
  margin-top: 25px;
  width: 16.6%;
}

  /* چهار تا ستون فوتر بزرگتر بشه */
.col-md-2{
  width: 20%;
}

/*** تماس با ما ***/
.callme .messageBoxElementBox {
  margin-bottom: 10px;
}

.callme .messageBoxElementInput {
  border-radius: 4px;
  width: 100%;
  box-sizing: border-box;
  padding: 8px;
  border: 1px solid #ccc;
  outline: none;
  transition: border-color 0.3s;
}

.callme .messageBoxElementInput:focus {
  border-color: #66afe9;
}

.callme .messageBoxElementButton {
  border-radius: 5px;
  display: block;
  margin-top: 10px;
  padding: 6px 15px;
  cursor: pointer;
  width: auto;
  min-width: 100px;
  font-size: 14px;
  box-sizing: border-box;
  border: none;
  background-color: #242b2f;
  color: white;
  transition: background-color 0.3s;

  /* دکمه بیاد سمت چپ */
  margin-left: 0;
  margin-right: auto;

  /* نوشته داخل دکمه وسط بمونه */
  text-align: center;
}

.callme .messageBoxElementButton:hover {
  background-color: #3a4448;
}

/*** درباره ما ***/
.shapetitle {
  position: relative;
  display: inline-block;
  z-index: 0;
}

/* ===== متغیرهای قابل تنظیم ===== */
.shapetitle {
  --shape-size: 30px;      /* اندازه پایه مربع‌ها */
  --shape-speed: 6s;       /* سرعت پایه چرخش */

  /* رنگ‌ها به تفکیک هر مربع (با آلفا برای کم‌رنگ بودن سایه‌ها) */
  --shape1-color: rgba(215, 170, 113, 1);  /* رنگ مربع 1 - طلایی */
  --shape2-color: rgba(80, 80, 80, 1); /* رنگ مربع 2 - مشکی */
  --shape3-color: rgba(215, 170, 113, 1); /* رنگ مربع 3 - طلایی */
}
/* ============================== */

.shapetitle .titleElementTitle {
  position: relative;
  z-index: 2; /* عنوان بالای مربع‌ها */
}

/* مربع 1 */
.shapetitle::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--shape-size);
  height: var(--shape-size);
  margin-left: calc(var(--shape-size) / -2);
  margin-top: calc(var(--shape-size) / -2);
  background: var(--shape1-color); /* رنگ مربع 1 */
  opacity: 0.3;
  transform-origin: center;
  z-index: 1;
  pointer-events: none;
  animation: orbit1 var(--shape-speed) linear infinite;

  /* سایه مربع 3 با رنگ کم‌رنگ */
  box-shadow: 90px 0 0 calc(var(--shape-size) * 0.6) var(--shape3-color); /* رنگ مربع 3 */
}

/* مربع 2 */
.shapetitle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(var(--shape-size) * 0.6);
  height: calc(var(--shape-size) * 0.6);
  margin-left: calc(var(--shape-size) * -0.4);
  margin-top: calc(var(--shape-size) * -0.4);
  background: var(--shape2-color); /* رنگ مربع 2 */
  opacity: 0.2;
  transform-origin: center;
  z-index: 1;
  pointer-events: none;
  animation: orbit2 calc(var(--shape-speed) * 1.5) linear infinite reverse;
}

/* انیمیشن‌ها */
@keyframes orbit1 {
  0%   { transform: rotate(0deg)   translateX(50px) rotate(0deg); }
  100% { transform: rotate(360deg) translateX(50px) rotate(-360deg); }
}
@keyframes orbit2 {
  0%   { transform: rotate(0deg)   translateX(70px) rotate(0deg); }
  100% { transform: rotate(360deg) translateX(70px) rotate(-360deg); }
}