.elementor-1476 .elementor-element.elementor-element-edb98a7{--display:flex;--margin-top:-20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-1476 .elementor-element.elementor-element-581acca{--display:flex;--margin-top:10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}/* Start custom CSS for html, class: .elementor-element-60dca75 *//* Headings hover effect (updated colors) */
h1, h2, h3, h4, h5, h6 {
  position: relative;
  display: inline-block;
  cursor: pointer;
  transition: color 0.3s ease;
  color: #f1f1f1; /* default light gray */
}

/* text color change on hover (orange highlight) */
h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {
  color: #ff9800; /* warm orange */
}

/* underline effect - gradient */
h1::after, h2::after, h3::after, h4::after, h5::after, h6::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 0;
  height: 3px;
  background: linear-gradient(90deg, #ff9800, #ff5722);
  transition: width 0.4s ease;
  border-radius: 2px;
}

/* animate underline on hover */
h1:hover::after, h2:hover::after, h3:hover::after, h4:hover::after, h5:hover::after, h6:hover::after {
  width: 100%;
}/* End custom CSS */