.elementor-10 .elementor-element.elementor-element-727aad8{--display:flex;--min-height:70vh;--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;--justify-content:center;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-10 .elementor-element.elementor-element-727aad8:not(.elementor-motion-effects-element-type-background), .elementor-10 .elementor-element.elementor-element-727aad8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}.elementor-10 .elementor-element.elementor-element-3851b5e{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10 .elementor-element.elementor-element-ee3919a{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10 .elementor-element.elementor-element-ad8a5e4.elementor-element{--align-self:center;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-10 .elementor-element.elementor-element-727aad8{--padding-top:32px;--padding-bottom:32px;--padding-left:24px;--padding-right:24px;}}@media(max-width:767px){.elementor-10 .elementor-element.elementor-element-727aad8{--min-height:60vh;--justify-content:center;--padding-top:32px;--padding-bottom:32px;--padding-left:16px;--padding-right:16px;}}/* Start custom CSS for html, class: .elementor-element-ad8a5e4 */.project-title {
  position: relative;
  text-decoration: none;
  color: #fff;
  cursor: pointer;
  transition: color 0.3s ease;
  z-index: 1; /* normal text below image */
}

.project-title:hover {
  color: #fff;
  z-index: 9999; /* hovered text above image */
}

.hover-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 400px;
  height: 300px;
  pointer-events: none;
  background-size: cover;
  background-position: center;
  opacity: 0.5;
  transform: translate(-50%, -50%) scale(0.9);
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 100; /* in between */

}

.hover-projects{
    color:#fff;
    font-size: 42px;
    font-family: "inter";
    text-align: center;
    line-height:70px;
}

.hover-image::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.5); /* overlay color */
  pointer-events: none;
}
/* Tablet (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
  .hover-projects {
    font-size: 32px;
    line-height:1.5em;
  }
}

/* Mobile (max-width: 767px) */
@media (max-width: 767px) {
  .hover-projects {
    font-size: 20px;
    line-height:1.8em;
  }
}/* End custom CSS */