/* input(106,21): run-time error CSS1036: Expected expression, found '1'
input(106,99): Scanner error CSS1002: Unterminated string: "); */
.heroAboutUs {
  position: relative;
  width: 100%;
  height: 229px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  z-index: 1;
  /* &::after {
     content: "";
     position: absolute;
     top: 80%;
     left: 50%;
     transform: translateX(-50%);
     width: 2px;
     bottom: 0;
     background-color: #d0ab67;
     opacity: 0.95;
     pointer-events: none;
     z-index: 2;

     @media (max-width: 768px) {
       display: none;
     }
   }*/
}
.heroAboutUs .image {
  position: relative;
  width: 100%;
  height: 100%;
}
.heroAboutUs .image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
.heroAboutUs .image .img1 {
  /*      @media (max-width: 768px) {
          display: none;
        }*/
}
.heroAboutUs .image .img2 {
  display: none;
}
.heroAboutUs .image .aboutus-hero-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: white;
  text-decoration: none;
  z-index: 2;
}
.heroAboutUs .image .aboutus-hero-center .small {
  font-size: 16px;
  font-weight: 600;
}
.heroAboutUs .image .aboutus-hero-center .large {
  font-size: 24px;
  font-weight: 700;
}
.heroAboutUs::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #003e88;
  opacity: 0.5;
  z-index: 1;
}
@media (max-width: 768px) {
  .heroAboutUs {
    height: 200px;
  }
  .heroAboutUs .aboutus-hero-center {
    gap: 4px;
  }
  .heroAboutUs .aboutus-hero-center .small {
    font-size: 14px;
  }
  .heroAboutUs .aboutus-hero-center .large {
    font-size: 20px;
  }
}

body {
  font-family: IRANSansXFaNum;
  background: white;
  color: #0f172a;
}

.hero-section .hero {
  position: relative;
  height: 229px;
  background-image: url(Themes/News/Varesh/Assets/assets/varesh-aboutUs/Frame 1000008688 (1).png");
  background-size: cover;
  background-position: center;
}
.hero-section .hero::after {
  content: "";
  position: absolute;
  top: 80%;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  background-color: #d0ab67;
  opacity: 0.95;
  pointer-events: none;
}
.hero-section .hero-content .kicker {
  font-size: 12px;
  opacity: 0.9;
  margin-bottom: 8px;
}
.hero-section .hero-content h1 {
  font-size: 28px;
  font-weight: 800;
}
.hero-section .hero-divider {
  width: 2px;
  height: 36px;
  background: #d0ab67;
  margin: 12px auto 0;
}
.hero-section .about-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: stretch;
  padding: 70px 0 110px;
}
.hero-section .about-grid .about-col {
  font-size: 16px;
  color: #334155;
  text-align: justify;
  line-height: 32px;
  font-weight: 500;
  width: 100%;
  font-family: IRANSansXFaNum;
  letter-spacing: 0;
}
.hero-section .about-grid .about-col a {
  color: #0f172a;
  font-weight: 700;
}
.hero-section .about-grid .about-sep {
  background-color: #d0ab67;
  width: 100%;
  height: 100%;
}
@media (max-width: 768px) {
  .hero-section .about-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .hero-section .about-grid .about-col {
    width: 100%;
    font-size: 14px;
    line-height: 28px;
  }
  .hero-section .about-grid .about-sep {
    width: 100%;
    height: 2px;
  }
}

body {
  font-family: IRANSansXFaNum;
  background: white;
  color: #0f172a;
}

.contactUs .contact-panel {
  width: 100%;
  height: 100%;
  margin: 40px auto 40px;
  padding: 16px;
  background-color: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.06);
}
.contactUs .contact-topline {
  text-align: start;
  font-size: 12px;
  color: #475569;
  margin: 32px 5px 32px;
}
.contactUs .contact-grid {
  padding: 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: stretch;
}
.contactUs .contact-grid .contact-card-1 {
  background-color: #e5e7eb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.06);
  width: 287px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
}
.contactUs .contact-grid .contact-card-1 .inner {
  padding: 14px 16px;
}
.contactUs .contact-grid .contact-card-1 .caption {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 6px;
}
.contactUs .contact-grid .contact-card-1 .value {
  font-size: 16px;
  color: #0f172a;
  font-weight: 600;
  text-align: center;
}
.contactUs .contact-grid .contact-card-1 a {
  color: #2563eb;
  text-decoration: none;
  padding-top: 8px;
}
.contactUs .contact-grid .contact-card-1 a:hover {
  text-decoration: underline;
}
.contactUs .contact-grid .contact-card-2 {
  background-color: #e5e7eb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.06);
  width: 482px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
}
.contactUs .contact-grid .contact-card-2 .inner {
  padding: 14px 16px;
}
.contactUs .contact-grid .contact-card-2 .caption {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 6px;
}
.contactUs .contact-grid .contact-card-2 .value {
  font-size: 16px;
  color: #0f172a;
  font-weight: 600;
  text-align: center;
}
.contactUs .contact-grid .contact-card-2 a {
  color: #2563eb;
  text-decoration: none;
  padding-top: 8px;
}
.contactUs .contact-grid .contact-card-2 a:hover {
  text-decoration: underline;
}
.contactUs .contact-grid .contact-card-3 {
  background-color: #e5e7eb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.06);
  width: 287px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.contactUs .contact-grid .contact-card-3 .inner {
  padding: 14px 16px;
}
.contactUs .contact-grid .contact-card-3 .caption {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 6px;
}
.contactUs .contact-grid .contact-card-3 .value {
  font-size: 16px;
  color: #0f172a;
  font-weight: 600;
  text-align: center;
}
.contactUs .contact-grid .contact-card-3 a {
  color: #2563eb;
  text-decoration: none;
  padding-top: 8px;
}
.contactUs .contact-grid .contact-card-3 a:hover {
  text-decoration: underline;
}
.contactUs .contact-grid .contact-card-4 {
  background-color: #e5e7eb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.06);
  width: 352px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
}
.contactUs .contact-grid .contact-card-4 .inner {
  padding: 14px 16px;
}
.contactUs .contact-grid .contact-card-4 .caption {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 6px;
}
.contactUs .contact-grid .contact-card-4 .value {
  font-size: 16px;
  color: #0f172a;
  font-weight: 600;
  text-align: center;
}
.contactUs .contact-grid .contact-card-4 a {
  color: #2563eb;
  text-decoration: none;
  padding-top: 8px;
}
.contactUs .contact-grid .contact-card-4 a:hover {
  text-decoration: underline;
}
@media (max-width: 768px) {
  .contactUs .contact-panel {
    width: 100%;
    height: auto;
    padding: 16px;
  }
  .contactUs .contact-topline {
    font-size: 12px;
    line-height: 24px;
    text-align: justify;
    margin: 16px 0;
  }
  .contactUs .contact-grid {
    flex-direction: column;
    align-items: stretch;
  }
  .contactUs .contact-grid .contact-card-1,
  .contactUs .contact-grid .contact-card-2,
  .contactUs .contact-grid .contact-card-3,
  .contactUs .contact-grid .contact-card-4 {
    width: 100%;
    height: auto;
  }
  .contactUs .contact-grid .contact-card-1 .value,
  .contactUs .contact-grid .contact-card-2 .value,
  .contactUs .contact-grid .contact-card-3 .value,
  .contactUs .contact-grid .contact-card-4 .value {
    font-size: 15px;
    text-align: center;
    line-height: 26px;
  }
  .contactUs .contact-grid .contact-card-1 .inner,
  .contactUs .contact-grid .contact-card-2 .inner,
  .contactUs .contact-grid .contact-card-3 .inner,
  .contactUs .contact-grid .contact-card-4 .inner {
    padding: 12px;
  }
}