.elementor-188 .elementor-element.elementor-element-1521602{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-be24c94 *//* =========================================
   ISATIS ABOUT
   ========================================= */

.isatis-about {
  --brand: #29166F;
  --brand-deep: #1C104F;
  --brand-soft: #F0EDFB;

  --water: #139BB8;
  --water-deep: #087B96;
  --water-soft: #E8F8FB;

  --surface: #FFFFFF;
  --ice: #F6FAFB;

  --text: #171529;
  --muted: #6E7181;
  --border: #E7E9EF;

  direction: rtl !important;

  color: var(--text) !important;
}


/* =========================================
   HERO
   ========================================= */

.isatis-about__hero {
  position: relative !important;

  display: grid !important;

  grid-template-columns:
    1.05fr .95fr !important;

  align-items: center !important;

  gap: 60px !important;

  padding: 64px !important;

  border: 1px solid var(--border) !important;

  border-radius: 28px !important;

  background:
    radial-gradient(
      circle at 15% 20%,
      rgba(19,155,184,.1),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #FFFFFF,
      #F6FAFB
    ) !important;

  overflow: hidden !important;
}


.isatis-about__eyebrow {
  display: inline-flex !important;

  align-items: center !important;

  margin-bottom: 18px !important;

  padding: 7px 12px !important;

  border-radius: 999px !important;

  background: var(--brand-soft) !important;

  color: var(--brand) !important;

  font-weight: 600 !important;
}


.isatis-about__hero h1,
.isatis-about__mission h2 {
  margin: 0 0 22px !important;

  color: var(--text) !important;

  line-height: 1.45 !important;

  font-weight: 800 !important;
}


.isatis-about__hero h1 span,
.isatis-about__mission h2 span {
  color: var(--brand) !important;
}


.isatis-about__hero p,
.isatis-about__mission p,
.isatis-about__section-title p,
.isatis-about__card p {
  color: var(--muted) !important;

  line-height: 2 !important;
}


.isatis-about__hero p {
  margin: 0 0 28px !important;
}


/* =========================================
   HERO IMAGE
   ========================================= */

.isatis-about__visual {
  width: 100% !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;
}


.isatis-about__image {
  position: relative !important;

  width: 100% !important;

  min-height: 390px !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  border: 1px dashed rgba(41,22,111,.22) !important;

  border-radius: 24px !important;

  background:
    linear-gradient(
      145deg,
      rgba(240,237,251,.75),
      rgba(232,248,251,.65)
    ) !important;

  overflow: hidden !important;
}


.isatis-about__image::before {
  content: "" !important;

  position: absolute !important;

  width: 230px !important;

  height: 230px !important;

  border-radius: 50% !important;

  background: rgba(19,155,184,.1) !important;

  filter: blur(10px) !important;
}


.isatis-about__image > span {
  position: relative !important;

  z-index: 1 !important;

  padding: 10px 16px !important;

  border-radius: 10px !important;

  background: #FFFFFF !important;

  color: var(--muted) !important;

  box-shadow:
    0 8px 30px rgba(23,21,41,.06) !important;
}


/* وقتی عکس قرار دادی */
.isatis-about__image img {
  position: relative !important;

  z-index: 2 !important;

  width: 100% !important;

  height: 100% !important;
  object-fit: cover !important;

  display: block !important;
}


/* =========================================
   BUTTON
   ========================================= */

.isatis-about__btn {
  min-height: 48px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  gap: 8px !important;

  padding: 0 24px !important;

  border: 1px solid var(--brand) !important;

  border-radius: 12px !important;

  background: var(--brand) !important;

  color: #FFFFFF !important;

  text-decoration: none !important;

  box-shadow:
    0 8px 24px rgba(41,22,111,.15) !important;

  transition:
    transform .2s ease,
    background-color .2s ease,
    box-shadow .2s ease !important;
}


.isatis-about__btn svg {
  width: 18px !important;

  height: 18px !important;

  fill: none !important;

  stroke: currentColor !important;

  stroke-width: 1.8 !important;

  stroke-linecap: round !important;

  stroke-linejoin: round !important;
}


.isatis-about__btn:hover {
  background: var(--brand-deep) !important;

  border-color: var(--brand-deep) !important;

  color: #FFFFFF !important;

  transform: translateY(-2px) !important;

  box-shadow:
    0 12px 28px rgba(41,22,111,.22) !important;
}


/* =========================================
   FEATURES
   ========================================= */

.isatis-about__features {
  padding: 96px 0 !important;
}


.isatis-about__section-title {
  max-width: 720px !important;

  margin: 0 auto 42px !important;

  text-align: center !important;
}


.isatis-about__section-title > span {
  color: var(--water-deep) !important;

  font-weight: 600 !important;
}


.isatis-about__section-title h2 {
  margin: 8px 0 12px !important;

  color: var(--text) !important;

  font-weight: 800 !important;

  line-height: 1.5 !important;
}


.isatis-about__section-title p {
  margin: 0 !important;
}


.isatis-about__grid {
  display: grid !important;

  grid-template-columns:
    repeat(4, minmax(0,1fr)) !important;

  gap: 18px !important;
}


/* =========================================
   FEATURE CARDS
   ========================================= */

.isatis-about__card {
  position: relative !important;

  padding: 26px !important;

  border: 1px solid var(--border) !important;

  border-radius: 18px !important;

  background: var(--surface) !important;

  overflow: hidden !important;

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease !important;
}





.isatis-about__card:hover {
  transform: translateY(-5px) !important;

  border-color:
    rgba(41,22,111,.16) !important;

  box-shadow:
    0 18px 40px rgba(23,21,41,.07) !important;
}


.isatis-about__card:hover::before {
  height: 100% !important;
}


/* Icons */
.isatis-about__icon {
  width: 48px !important;

  height: 48px !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  margin-bottom: 20px !important;

  border-radius: 14px !important;

  background: var(--brand-soft) !important;

  color: var(--brand) !important;

  transition:
    background-color .2s ease,
    color .2s ease,
    transform .2s ease !important;
}


.isatis-about__icon svg {
  width: 23px !important;

  height: 23px !important;

  fill: none !important;

  stroke: currentColor !important;

  stroke-width: 1.7 !important;

  stroke-linecap: round !important;

  stroke-linejoin: round !important;
}


.isatis-about__card:hover
.isatis-about__icon {
  background: var(--brand) !important;

  color: #FFFFFF !important;

  transform:
    translateY(-2px)
    rotate(-3deg) !important;
}


.isatis-about__card h3 {
  margin: 0 0 10px !important;

  color: var(--text) !important;

  font-weight: 700 !important;
}


.isatis-about__card p {
  margin: 0 !important;
}


/* =========================================
   MISSION
   ========================================= */

.isatis-about__mission {
  display: grid !important;

  grid-template-columns:
    1fr 360px !important;

  gap: 28px !important;

  margin-bottom: 40px !important;
}


.isatis-about__mission-content {
  padding: 50px !important;

  border: 1px solid var(--border) !important;

  border-radius: 24px !important;

  background: var(--ice) !important;
}


.isatis-about__mission-content p {
  max-width: 800px !important;

  margin: 0 0 32px !important;
}


/* =========================================
   STATS
   ========================================= */

.isatis-about__stats {
  display: grid !important;

  grid-template-columns:
    repeat(3,1fr) !important;

  gap: 12px !important;
}


.isatis-about__stats > div {
  padding: 18px !important;

  border: 1px solid var(--border) !important;

  border-radius: 14px !important;

  background: #FFFFFF !important;

  transition:
    transform .2s ease,
    border-color .2s ease !important;
}


.isatis-about__stats > div:hover {
  transform: translateY(-3px) !important;

  border-color:
    rgba(41,22,111,.18) !important;
}


.isatis-about__stat-icon {
  width: 38px !important;

  height: 38px !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  margin-bottom: 13px !important;

  border-radius: 10px !important;

  background: var(--water-soft) !important;

  color: var(--water-deep) !important;
}


.isatis-about__stat-icon svg {
  width: 20px !important;

  height: 20px !important;

  fill: none !important;

  stroke: currentColor !important;

  stroke-width: 1.7 !important;

  stroke-linecap: round !important;

  stroke-linejoin: round !important;
}


.isatis-about__stats strong {
  display: block !important;

  margin-bottom: 5px !important;

  color: var(--brand) !important;
}


.isatis-about__stats > div > span:last-child {
  color: var(--muted) !important;
}


/* =========================================
   CTA
   ========================================= */

.isatis-about__cta {
  position: relative !important;

  display: flex !important;

  flex-direction: column !important;

  justify-content: flex-end !important;

  padding: 34px !important;

  border-radius: 24px !important;

  color: #FFFFFF !important;

  background:
    linear-gradient(
      145deg,
      var(--brand),
      var(--brand-deep)
    ) !important;

  overflow: hidden !important;
}


.isatis-about__cta::before {
  content: "" !important;

  position: absolute !important;

  width: 210px !important;

  height: 210px !important;

  top: -90px !important;

  left: -70px !important;

  border-radius: 50% !important;

  background:
    rgba(19,155,184,.18) !important;
}


.isatis-about__cta-icon {
  position: relative !important;

  z-index: 2 !important;

  width: 52px !important;

  height: 52px !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  margin-bottom: 24px !important;

  border-radius: 15px !important;

  background:
    rgba(255,255,255,.12) !important;

  color: #FFFFFF !important;
}


.isatis-about__cta-icon svg {
  width: 27px !important;

  height: 27px !important;

  fill: none !important;

  stroke: currentColor !important;

  stroke-width: 1.6 !important;

  stroke-linecap: round !important;

  stroke-linejoin: round !important;
}


.isatis-about__cta span,
.isatis-about__cta h3,
.isatis-about__cta a {
  position: relative !important;

  z-index: 2 !important;
}


.isatis-about__cta > span {
  opacity: .75 !important;
}


.isatis-about__cta h3 {
  margin: 8px 0 24px !important;

  color: #FFFFFF !important;

  line-height: 1.6 !important;
}


.isatis-about__btn--light {
  align-self: flex-start !important;

  background: #FFFFFF !important;

  border-color: #FFFFFF !important;

  color: var(--brand) !important;

  box-shadow: none !important;
}


.isatis-about__btn--light:hover {
  background: var(--water-soft) !important;

  border-color: var(--water-soft) !important;

  color: var(--brand-deep) !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {

  .isatis-about__hero {
    grid-template-columns:
      1fr 1fr !important;

    gap: 30px !important;

    padding: 44px !important;
  }

  .isatis-about__grid {
    grid-template-columns:
      repeat(2,1fr) !important;
  }

  .isatis-about__mission {
    grid-template-columns:
      1fr !important;
  }

}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {

  .isatis-about__hero {
    grid-template-columns:
      1fr !important;

    padding: 28px 20px !important;

    border-radius: 20px !important;
  }

  .isatis-about__visual {
    order: -1 !important;
  }

  .isatis-about__image {
    min-height: 260px !important;
  }

  .isatis-about__features {
    padding: 64px 0 !important;
  }

  .isatis-about__grid {
    grid-template-columns:
      1fr !important;
  }

  .isatis-about__mission-content,
  .isatis-about__cta {
    padding: 26px 20px !important;
  }

  .isatis-about__stats {
    grid-template-columns:
      1fr !important;
  }

}/* End custom CSS */