.elementor-17 .elementor-element.elementor-element-4db7138d{--display:flex;--min-height:400px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0px;--margin-bottom:15px;--margin-left:0px;--margin-right:0px;}.elementor-17 .elementor-element.elementor-element-6e6266d9{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-17 .elementor-element.elementor-element-3cb9e364{--e-transform-rotateZ:0deg;--e-transform-rotateX:1deg;--e-transform-perspective:45px;--e-transform-rotateY:1deg;}.elementor-17 .elementor-element.elementor-element-3cb9e364:not( .elementor-widget-image ), .elementor-17 .elementor-element.elementor-element-3cb9e364.elementor-widget-image img{-webkit-mask-image:url( https://abofa.webqtechdemo.site/wp-content/plugins/elementor/assets/mask-shapes/blob.svg );-webkit-mask-size:contain;-webkit-mask-position:center center;-webkit-mask-repeat:no-repeat;}.elementor-17 .elementor-element.elementor-element-3cb9e364 img{border-style:groove;border-width:1px 1px 1px 1px;border-color:#FFFFFF;border-radius:80px 60px 40px 20px;}.elementor-17 .elementor-element.elementor-element-60c7ad65{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-546bcd46 .elementor-heading-title{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-7741f50b{font-family:"Montserrat", Sans-serif;font-size:15px;font-weight:300;line-height:22px;color:#FFFFFF;}.elementor-17 .elementor-element.elementor-element-65120083{--display:flex;--margin-top:0px;--margin-bottom:15px;--margin-left:0px;--margin-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for container, class: .elementor-element-6e6266d9 */.water-img {
  position: relative;
  overflow: hidden;
}

.water-img::after {
  content: "";
  position: absolute;
  inset: 0; /* 👈 مهم جدًا */
  background: radial-gradient(circle at center,
    rgba(255,255,255,0.15) 0%,
    rgba(255,255,255,0.05) 40%,
    transparent 60%);
  animation: ripple 4s infinite ease-in-out;
  pointer-events: none;
  z-index: 2;
}

.water-img img {
  display: block;
  width: 100%;
  height: auto;
  position: relative;
  z-index: 1;
}

@keyframes ripple {
  0% {
    transform: scale(1);
    opacity: .2;
  }
  50% {
    transform: scale(1.08);
    opacity: .35;
  }
  100% {
    transform: scale(1);
    opacity: .2;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4db7138d */.elementor-17 .elementor-element.elementor-element-4db7138d{
  background: linear-gradient(315deg,
  #0B2230 0%,
  #103151 60%,
  #2C3E2E 100%
);


}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-76aa53b4 *//* ==================================================
   Vision & Mission – Premium Section
   ================================================== */

/* ---------- Section Base ---------- */
.vision-mission-section {
  padding: 110px 20px;
  background: linear-gradient(180deg, #071a2a 0%, #0b2235 100%);
  color: #ffffff;
  font-family: inherit;
}

.vision-mission-wrap {
  max-width: 1240px;
  margin: 0 auto;
}

/* ---------- Head ---------- */
.vision-mission-head {
  text-align: center;
  margin-bottom: 70px;
}

.vision-mission-title {
  font-size: 46px;
  font-weight: 700;
  margin-bottom: 14px;
  letter-spacing: -0.5px;
}

.vision-mission-sub {
  max-width: 760px;
  margin: 0 auto;
  font-size: 18px;
  line-height: 1.7;
  opacity: 0.85;
}

/* ==================================================
   Vision Card (Hero Card)
   ================================================== */

.vision-card {
  position: relative;
  background: linear-gradient(135deg, #0f3551, #0b2a41);
  border-radius: 22px;
  padding: 55px 60px;
  margin-bottom: 90px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 30px 80px rgba(0,0,0,0.45);
  overflow: hidden;
}

.vision-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at top right, rgba(0,170,255,0.18), transparent 55%);
}

.vision-ico {
  font-size: 42px;
  margin-bottom: 18px;
}

.vision-card h3 {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 18px;
}

.vision-card p {
  font-size: 18px;
  line-height: 1.8;
  max-width: 920px;
  opacity: 0.9;
}

/* ==================================================
   Mission Head
   ================================================== */

.mission-head {
  text-align: center;
  margin-bottom: 60px;
}

.mission-title {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 10px;
}

.mission-sub {
  font-size: 17px;
  opacity: 0.85;
}

/* ==================================================
   Mission Grid
   ================================================== */

.mission-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 34px;
  align-items: stretch;
}

/* ---------- Mission Card ---------- */
.mission-card {
  position: relative;
  background: rgba(255,255,255,0.05);
  border-radius: 20px;
  padding: 38px 34px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 18px 50px rgba(0,0,0,0.35);

  display: flex;
  flex-direction: column;
  height: 100%;

  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.mission-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,170,255,0.18), transparent 65%);
  opacity: 0;
  transition: opacity 0.35s ease;
  border-radius: 20px;
}

.mission-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 26px 65px rgba(0,0,0,0.5);
}

.mission-card:hover::before {
  opacity: 1;
}

/* ---------- Mission Card Content ---------- */
.mission-ico {
  font-size: 34px;
  margin-bottom: 18px;
}

.mission-card h4 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 14px;
  min-height: 52px; /* توحيد ارتفاع العناوين */
}

.mission-card p {
  font-size: 16px;
  line-height: 1.7;
  opacity: 0.85;
  margin-top: auto; /* تثبيت النص للأسفل */
}

/* ==================================================
   Responsive
   ================================================== */

@media (max-width: 1200px) {
  .vision-card {
    padding: 45px;
  }
}

@media (max-width: 1024px) {
  .mission-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .vision-mission-title {
    font-size: 34px;
  }

  .vision-card {
    padding: 32px;
    margin-bottom: 70px;
  }

  .mission-grid {
    grid-template-columns: 1fr;
  }

  .mission-title {
    font-size: 28px;
  }
}


.elementor-17 .elementor-element.elementor-element-76aa53b4{
    font-family: "Montserrat", Sans-serif;
    
}/* End custom CSS */