.elementor-2815 .elementor-element.elementor-element-7960cf99{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:-50px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2815 .elementor-element.elementor-element-7960cf99:not(.elementor-motion-effects-element-type-background), .elementor-2815 .elementor-element.elementor-element-7960cf99 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#222222;}/* Start custom CSS for html, class: .elementor-element-1a806a8a *//* ==============================
   Impact Stories Section — FULL CSS
   ============================== */

/* Section wrapper */
.impactx {
  padding: 72px 20px;
  color: #E9F7F7;
}

/* Elementor global link reset (scoped) */
.impactx a { color: inherit; }

/* Container */
.impactx-wrap {
  max-width: 1240px;
  margin: 0 auto;
}

/* Kicker + Title */
.impactx-kicker {
  color: #3AD7DE;
  font-weight: 400;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 18px;
  margin-bottom: 6px;
}

.impactx-title {
  font-family: 'Lora', serif;
  font-weight: 600;
  color: #fff !important;
  font-size: 3em !important;
}

/* Intro paragraph under title */
.impactx-intro {
  max-width: 800px;
  font-size: 1.15rem;
  line-height: 1.4;
  color: #a7cfd2;
  margin-bottom: 50px !important;
}

@media (max-width: 768px) {
  .impactx-intro { font-size: 1rem; }
}

/* ==============================
   Grid (3 cols desktop → 2 → 1)
   ============================== */
.impactx-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-bottom: 40px;
}
@media (max-width: 1080px) {
  .impactx-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .impactx-grid { grid-template-columns: 1fr; }
}

/* ==============================
   Card
   ============================== */
.impactx-card {
  background: #32B7D430; /* subtle teal-tinted panel */
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
  transition: transform .4s ease, box-shadow .4s ease;
}
.impactx-card:hover {
  transform: translateY(-10px);
  box-shadow:
    0 0 25px rgba(58,215,222,.35),
    0 0 45px rgba(58,215,222,.25),
    0 14px 28px rgba(0,0,0,.5);
}

/* Media */
.impactx-media {
  aspect-ratio: 16/11;
  background-size: cover;
  background-position: center;
}

/* Body */
.impactx-body {
  padding: 1.5em 2em;
}

/* Category pills row */
.impactx-catrow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 10px;
}

/* Category pill (matches “Our Approach” vibe) */
.impactx-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: .92rem;
  color: #f6f0d2;
  background: rgba(230,197,90,.12);              /* soft gold tint */
  border: 1px solid rgba(230,197,90,.28);
  box-shadow: 0 4px 10px rgba(0,0,0,.18) inset;
  white-space: nowrap;
}

/* Headline + excerpt */
.impactx-heading {
  color: #3AD7DE !important;                      /* teal title */
  font-size: 1.28rem;
  margin: 8px 0 14px !important;
  font-weight: 600;
}
.impactx-excerpt,
.impactx-body p {
  font-size: 1rem;
  color: #a7cfd2;
  margin: 0 0 12px;
  line-height: 1.55;
}

/* “Read more” link */
.impactx-readmore {
  display: inline-block;
  margin-top: 2px;
  font-weight: 600;
  text-decoration: none;
  color: #3AD7DE !important;
  transition: color .25s ease, transform .25s ease;
}
.impactx-readmore:hover {
  color: #E6C55A !important;                      /* gold on hover */
  transform: translateY(-1px);
}

/* ==============================
   Buttons below (do not grow on hover)
   ============================== */
.btnx {
  display: inline-block;
  padding: 15px 30px;
  border-radius: 5px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.btnx-teal {
  background: linear-gradient(180deg,#3AD7DE,#1FB7BF);
  color: #111111 !important;
  font-weight: 400 !important;
  box-shadow: 0 8px 16px rgba(58,215,222,.28);
  transition: box-shadow .25s ease, transform .25s ease;
}
.btnx-teal:hover {
  transform: translateY(-1px);                    /* slight lift only */
  box-shadow: 0 12px 22px rgba(58,215,222,.34);
}

/* Optional gold button (if used later) */
.btnx-gold {
  background: linear-gradient(180deg,#E6C55A,#AC8E2F);
  color: #201b09;
  box-shadow: 0 8px 16px rgba(230,197,90,.25);
  transition: box-shadow .25s ease, transform .25s ease;
}
.btnx-gold:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 22px rgba(230,197,90,.32);
}/* End custom CSS */