.elementor-widget-container .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-container .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1821 .elementor-element.elementor-element-b8a30bc{--display:flex;--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:20px;--margin-bottom:20px;--margin-left:0px;--margin-right:0px;}.elementor-1821 .elementor-element.elementor-element-e36617d{--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;}.elementor-widget-image .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-image .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.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-widget-heading .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-heading .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.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-1821 .elementor-element.elementor-element-d793f29 .elementor-heading-title{color:#FFFFFF;}.elementor-1821 .elementor-element.elementor-element-b8d389c{--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;}.elementor-1821 .elementor-element.elementor-element-df2a27e .elementor-heading-title{color:#FFFFFF;}.elementor-1821 .elementor-element.elementor-element-396aacc{--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;}.elementor-1821 .elementor-element.elementor-element-b0ac994 .elementor-heading-title{color:#FFFFFF;}.elementor-1821 .elementor-element.elementor-element-1cb2e33{--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;}.elementor-1821 .elementor-element.elementor-element-f5cc57d .elementor-heading-title{color:#FFFFFF;}@media(min-width:768px){.elementor-1821 .elementor-element.elementor-element-e36617d{--width:25%;}.elementor-1821 .elementor-element.elementor-element-b8d389c{--width:25%;}.elementor-1821 .elementor-element.elementor-element-396aacc{--width:25%;}.elementor-1821 .elementor-element.elementor-element-1cb2e33{--width:25%;}}/* Start custom CSS for container, class: .elementor-element-b8a30bc *//* 1. Make the container relative */
.elementor-element.e-con-full.e-flex.e-con.e-child {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

/* 2. Ensure the image fills the container and transitions smoothly */
.elementor-widget-image img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.5s ease, filter 0.5s ease;
}

/* 3. Create a gradient overlay using pseudo-element */
.elementor-element.e-con-full.e-flex.e-con.e-child::before {
  content: "";
  position: absolute;
  inset: 0; /* top:0; right:0; bottom:0; left:0; */
  background: linear-gradient(180deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.35) 50%, rgba(0,0,0,0.65) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 2;
}

/* 4. Center the heading over the container */
.elementor-element.e-con-full.e-flex.e-con.e-child .elementor-widget-heading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  z-index: 3;
  opacity: 0;
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}

/* 5. Hover effect: show overlay and heading */
.elementor-element.e-con-full.e-flex.e-con.e-child:hover::before,
.elementor-element.e-con-full.e-flex.e-con.e-child:focus-within::before {
  opacity: 1;
}

.elementor-element.e-con-full.e-flex.e-con.e-child:hover .elementor-widget-heading,
.elementor-element.e-con-full.e-flex.e-con.e-child:focus-within .elementor-widget-heading {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.05);
}

/* 6. Optional: zoom image slightly on hover */
.elementor-element.e-con-full.e-flex.e-con.e-child:hover img,
.elementor-element.e-con-full.e-flex.e-con.e-child:focus-within img {
  transform: scale(1.05);
  filter: brightness(0.85);
}

/* 7. Smooth responsive text scaling */
@media (max-width: 768px) {
  .elementor-element.e-con-full.e-flex.e-con.e-child .elementor-widget-heading {
    font-size: 1.5rem;
  }
}
@media (max-width: 480px) {
  .elementor-element.e-con-full.e-flex.e-con.e-child .elementor-widget-heading {
    font-size: 1.2rem;
  }
}

/* Make the overlay and heading ignore pointer events so clicks go to the <a> */
.elementor-element.e-con-full.e-flex.e-con.e-child::before,
.elementor-element.e-con-full.e-flex.e-con.e-child .elementor-widget-heading {
    pointer-events: none;
}

/* Ensure the <a> fills the container */
.elementor-element.e-con-full.e-flex.e-con.e-child a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}/* End custom CSS */