.elementor-28030 .elementor-element.elementor-element-5fe62043{--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;--padding-top:15px;--padding-bottom:20px;--padding-left:120px;--padding-right:120px;}.elementor-28030 .elementor-element.elementor-element-5fe62043:not(.elementor-motion-effects-element-type-background), .elementor-28030 .elementor-element.elementor-element-5fe62043 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-a5f5932 );}.elementor-28030 .elementor-element.elementor-element-6b3317f9{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-28030 .elementor-element.elementor-element-6b3317f9.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-28030 .elementor-element.elementor-element-22817ec0{--display:flex;--margin-top:0px;--margin-bottom:570px;--margin-left:0px;--margin-right:0px;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );text-transform:var( --e-global-typography-text-text-transform );line-height:var( --e-global-typography-text-line-height );}.elementor-28030 .elementor-element.elementor-element-3a7a2a1c{text-align:start;}.elementor-28030 .elementor-element.elementor-element-3a7a2a1c img{width:100%;}.elementor-28030 .elementor-element.elementor-element-557d5385{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );color:var( --e-global-color-primary );}.elementor-28030 .elementor-element.elementor-element-1a9d18d0 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:16px;font-weight:400;line-height:1.2em;color:#000000;}.elementor-28030 .elementor-element.elementor-element-49a2977c{--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;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );text-transform:var( --e-global-typography-text-text-transform );line-height:var( --e-global-typography-text-line-height );}.elementor-28030 .elementor-element.elementor-element-7841fe71 img{width:100%;}.elementor-28030 .elementor-element.elementor-element-103a090 img{width:100%;}.elementor-28030 .elementor-element.elementor-element-5178c339 img{width:100%;}.elementor-28030 .elementor-element.elementor-element-291d05e4{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:7px 0px;--row-gap:7px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:80px;--padding-bottom:0px;--padding-left:25px;--padding-right:0px;}.elementor-28030 .elementor-element.elementor-element-58494aad .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:30px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-556bb093 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:30px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-2d3e0940 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:30px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-71b29817 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:30px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-1448b03e .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:30px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-597b5318{width:100%;max-width:100%;}.elementor-28030 .elementor-element.elementor-element-597b5318 > .elementor-widget-container{margin:0px 0px 130px 0px;padding:0px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-6fe46bf7 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-16277b95{--display:flex;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-28030 .elementor-element.elementor-element-7d7c2cb2 > .elementor-widget-container{padding:10px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-7d7c2cb2{text-align:end;}.elementor-28030 .elementor-element.elementor-element-251c1e20{--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;--padding-top:15px;--padding-bottom:20px;--padding-left:120px;--padding-right:120px;}.elementor-28030 .elementor-element.elementor-element-251c1e20:not(.elementor-motion-effects-element-type-background), .elementor-28030 .elementor-element.elementor-element-251c1e20 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-a5f5932 );}.elementor-28030 .elementor-element.elementor-element-283ac0e2{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-28030 .elementor-element.elementor-element-283ac0e2.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-28030 .elementor-element.elementor-element-c6d5b84{text-align:start;}.elementor-28030 .elementor-element.elementor-element-c6d5b84 img{width:100%;}.elementor-28030 .elementor-element.elementor-element-7650f381 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:36px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-f2f6415 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:36px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-7ba153fb .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:36px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-1410b658 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:36px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-e49c034 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:36px;font-weight:500;line-height:1.2em;color:#2C2C2C;}.elementor-28030 .elementor-element.elementor-element-59d77515{width:var( --container-widget-width, 75% );max-width:75%;--container-widget-width:75%;--container-widget-flex-grow:0;}.elementor-28030 .elementor-element.elementor-element-59d77515 > .elementor-widget-container{margin:0px 0px 80px 0px;padding:0px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-8f6e121 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-7b2dcc44 .elementor-heading-title{font-family:"DM Sans Custom", sans-serif;font-size:16px;font-weight:400;line-height:1.2em;color:#000000;}.elementor-28030 .elementor-element.elementor-element-32e9a212{--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;}.elementor-28030 .elementor-element.elementor-element-2fd139da img{width:100%;}.elementor-28030 .elementor-element.elementor-element-87c504d img{width:100%;}.elementor-28030 .elementor-element.elementor-element-666acd1a > .elementor-widget-container{padding:10px 0px 0px 0px;}body:not(.rtl) .elementor-28030 .elementor-element.elementor-element-666acd1a{left:0px;}body.rtl .elementor-28030 .elementor-element.elementor-element-666acd1a{right:0px;}.elementor-28030 .elementor-element.elementor-element-666acd1a{top:0px;text-align:end;}#elementor-popup-modal-28030 .dialog-widget-content{animation-duration:0.6s;box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}#elementor-popup-modal-28030{background-color:rgba(0,0,0,.8);justify-content:center;align-items:flex-start;pointer-events:all;}#elementor-popup-modal-28030 .dialog-message{width:100vw;height:auto;}@media(max-width:1024px){.elementor-28030 .elementor-element.elementor-element-5fe62043{--padding-top:15px;--padding-bottom:20px;--padding-left:30px;--padding-right:30px;}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-28030 .elementor-element.elementor-element-251c1e20{--padding-top:15px;--padding-bottom:20px;--padding-left:30px;--padding-right:30px;}}@media(max-width:767px){.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-28030 .elementor-element.elementor-element-251c1e20{--padding-top:10px;--padding-bottom:20px;--padding-left:10px;--padding-right:10px;}.elementor-28030 .elementor-element.elementor-element-283ac0e2{--gap:10px 0px;--row-gap:10px;--column-gap:0px;}.elementor-28030 .elementor-element.elementor-element-c6d5b84 img{width:46%;}.elementor-28030 .elementor-element.elementor-element-7650f381 > .elementor-widget-container{margin:20px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-7650f381 .elementor-heading-title{font-size:20px;}.elementor-28030 .elementor-element.elementor-element-f2f6415 .elementor-heading-title{font-size:20px;}.elementor-28030 .elementor-element.elementor-element-7ba153fb .elementor-heading-title{font-size:20px;}.elementor-28030 .elementor-element.elementor-element-1410b658 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-1410b658 .elementor-heading-title{font-size:20px;}.elementor-28030 .elementor-element.elementor-element-e49c034 .elementor-heading-title{font-size:20px;}.elementor-28030 .elementor-element.elementor-element-59d77515{width:var( --container-widget-width, 64% );max-width:64%;--container-widget-width:64%;--container-widget-flex-grow:0;}.elementor-28030 .elementor-element.elementor-element-59d77515 > .elementor-widget-container{margin:0px 0px 100px 0px;}.elementor-28030 .elementor-element.elementor-element-8f6e121 > .elementor-widget-container{margin:10px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-28030 .elementor-element.elementor-element-36619bff img{width:100%;}body:not(.rtl) .elementor-28030 .elementor-element.elementor-element-666acd1a{left:281px;}body.rtl .elementor-28030 .elementor-element.elementor-element-666acd1a{right:281px;}.elementor-28030 .elementor-element.elementor-element-666acd1a{top:-497px;}}@media(min-width:768px){.elementor-28030 .elementor-element.elementor-element-6b3317f9{--width:25.646%;}.elementor-28030 .elementor-element.elementor-element-283ac0e2{--width:25.646%;}}/* Start custom CSS for heading, class: .elementor-element-58494aad */.hd-1 {
  position: relative;
  display: inline-block;
}

.hd-1::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-1:hover::after {
  width: 100%;
  left: 0;
}

.hd-1:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-556bb093 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-2 {
  position: relative;
  display: inline-block;
}

.hd-2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-2:hover::after {
  width: 100%;
  left: 0;
}

.hd-2:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-2d3e0940 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-7 {
  position: relative;
  display: inline-block;
}

.hd-7::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-7:hover::after {
  width: 100%;
  left: 0;
}

.hd-7:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-71b29817 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-8 {
  position: relative;
  display: inline-block;
}

.hd-8::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-8:hover::after {
  width: 100%;
  left: 0;
}

.hd-8:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-1448b03e *//* Add this CSS to the Custom CSS section in Elementor */
.hd-8 {
  position: relative;
  display: inline-block;
}

.hd-8::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-8:hover::after {
  width: 100%;
  left: 0;
}

.hd-8:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-597b5318 *//* Container for the dropdown menu */
.dropdown-menu {
  position: relative;
}

/* Styling for the main heading */
.hd-3 {
  color: #2C2C2C;
  font-family: 'DM Sans', sans-serif;
  letter-spacing: -1.5px;
  font-size: 30px;
  font-weight: 500;
  margin: 0;
  padding: 1px 0;
  text-decoration: none;
  display: inline-block;
  position: relative;
}

/* Initially hide the submenu */
.submenu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  background-color: #FDFCFA;
  z-index: 10;
  width: 100%;
}

/* Show the submenu on hover */
.dropdown-menu:hover .submenu {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* Submenu layout */
.submenu {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: 100% !important;
}

/* Sub-heading links */
.hd-4,
.hd-5,
.hd-11,
.hd-12 {
  color: #2C2C2C;
  font-family: 'DM Sans', sans-serif;
  font-size: 19px;
  font-weight: 500;
  text-decoration: none;
  padding: 3px 0;
  margin: 0;
  background-color: #FDFCFA;
  position: relative;
  display: inline-block !important; /* ✅ single source of truth */
}

/* Ensure submenu links behave correctly */
.submenu a {
  display: inline-block !important;
}

/* Underline effect */
.hd-3::after,
.hd-4::after,
.hd-5::after,
.hd-11::after,
.hd-12::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

/* Hover underline */
.hd-3:hover::after,
.hd-4:hover::after,
.hd-5:hover::after,
.hd-11:hover::after,
.hd-12:hover::after {
  width: 100%; /* ✅ now truly full text width */
}

/* Active state reset */
.hd-3:active::after,
.hd-4:active::after,
.hd-5:active::after,
.hd-11:active::after,
.hd-12:active::after {
  width: 0;
  left: 0;
}

/* Main heading link */
.main-heading-link {
  text-decoration: none;
  color: inherit;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6fe46bf7 */.elegant-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 23px 117px;
  background: #FF7353;
  color: #2C2C2C;
  font-size: 24px;
  font-family: 'DM Sans Custom';
  font-weight: 400;
  cursor: pointer;
  overflow: hidden;
  transition: color 0.3s ease, border-color 0.3s ease;
}

/* background overlay for hover color */
.elegant-btn::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0%;
  background: #9A87F0; /* change this color later */
  z-index: 0;
  transition: height 0.4s ease;
}

/* text layers */
.elegant-btn span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.4s ease, opacity 0.4s ease;
  white-space: nowrap;
  z-index: 1;
}

/* second text (hover state) */
.elegant-btn .hovered-text {
  color: #2C2C2C; /* text color on hover */
  opacity: 0;
  transform: translate(-50%, 100%);
}

/* hover animations */
.elegant-btn:hover::before {
  height: 100%;
}

.elegant-btn:hover .base-text {
  transform: translate(-50%, -150%);
  opacity: 0;
}

.elegant-btn:hover .hovered-text {
  transform: translate(-50%, -50%);
  opacity: 1;
}

/* revert smoothly */
.elegant-btn:not(:hover) .hovered-text {
  transform: translate(-50%, 100%);
  opacity: 0;
}

@media (max-width: 1024px) {
  .elegant-btn {
    padding: 20px 115px; 
    font-size: 20px; 
  }
}

/* MOBILE */
@media (max-width: 767px) {
  .elegant-btn {
    padding: 17px 80px;
    font-size: 16px; 
  }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-7650f381 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-1 {
  position: relative;
  display: inline-block;
}

.hd-1::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-1:hover::after {
  width: 23%;
  left: 0;
}

.hd-1:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-f2f6415 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-2 {
  position: relative;
  display: inline-block;
}

.hd-2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-2:hover::after {
  width: 50%;
  left: 0;
}

.hd-2:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-7ba153fb *//* Add this CSS to the Custom CSS section in Elementor */
.hd-2 {
  position: relative;
  display: inline-block;
}

.hd-2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-2:hover::after {
  width: 50%;
  left: 0;
}

.hd-2:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-1410b658 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-1 {
  position: relative;
  display: inline-block;
}

.hd-1::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-1:hover::after {
  width: 23%;
  left: 0;
}

.hd-1:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-e49c034 *//* Add this CSS to the Custom CSS section in Elementor */
.hd-2 {
  position: relative;
  display: inline-block;
}

.hd-2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

.hd-2:hover::after {
  width: 50%;
  left: 0;
}

.hd-2:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-59d77515 *//* Hide the checkbox */
.toggle-checkbox {
  display: none;
}

/* Styling for the main heading */
.hd-3-mobile {
  color: #2C2C2C;
  font-family: 'DM Sans', sans-serif;
  letter-spacing: -1.5px;
  font-size: 20px;
  font-weight: 500;
  margin: 0;
  padding: 1px 0;
  cursor: pointer; /* Make it clickable */
}

/* Initially hide the submenu */
.submenu-mobile {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-20px); /* Start above */
  transition: opacity 0.3s ease, transform 0.3s ease; /* Smooth transition */
  background-color: #FDFCFA;
  z-index: 10;
  width: 100%;
  position: absolute;
  top: 25%;
  left: 0;
}

/* Show submenu when checkbox is checked (clicking main heading) */
.toggle-checkbox:checked + .hd-3-mobile + .submenu-mobile {
  opacity: 1;
  visibility: visible;
  transform: translateY(0); /* Slide down smoothly */
}

/* Show underline when checkbox is checked */
.toggle-checkbox:checked + .hd-3-mobile::after {
  width: 100%;
}

/* Styling for the sub-headings */
.hd-4-mobile, .hd-5-mobile, .hd-11-mobile, .hd-12-mobile {
  color: #2C2C2C;
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  display: block;
  padding: 2px 1px;
  margin: 0;
  background-color: #FDFCFA;
  border-bottom: 0px solid #ccc;
}

/* Optional: Add a smooth transition for the sub-menu visibility */
.hd-3-mobile, .hd-4-mobile, .hd-5-mobile, .hd-11-mobile, .hd-12-mobile {
  position: relative;
  display: inline-block;
}

.hd-3-mobile::after, .hd-4-mobile::after, .hd-5-mobile::after, .hd-11-mobile::after, .hd-12-mobile::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #2C2C2C;
  transition: width 0.3s ease;
}

/* Hide underline when submenu is hidden */
.toggle-checkbox:not(:checked) + .hd-3-mobile::after {
  width: 0; /* Reset the width when the checkbox is unchecked */
}

/* Hover effect on headings */
.hd-3-mobile:hover::after {
  width: 100%;
}

.hd-4-mobile:hover::after {
  width: 100%;
}

.hd-5-mobile:hover::after {
  width: 100%;
}

.hd-11-mobile:hover::after {
  width: 100%;
}

.hd-12-mobile:hover::after {
  width: 100%;
}

/* Reset underline when active */
.hd-3-mobile:active::after, .hd-4-mobile:active::after, .hd-5-mobile:active::after, .hd-11-mobile:active::after, .hd-12-mobile:active::after {
  width: 0;
  left: 0;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8f6e121 */.stylish-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 23px 117px;
  background: #FF7353;
  color: #2C2C2C;
  font-size: 24px;
  font-family: 'DM Sans Custom';
  font-weight: 400;
  cursor: pointer;
  overflow: hidden;
  transition: color 0.3s ease, border-color 0.3s ease;
}

/* background overlay for hover color */
.stylish-btn::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0%;
  background: #9A87F0; /* change this color later */
  z-index: 0;
  transition: height 0.4s ease;
}

/* text layers */
.stylish-btn span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.4s ease, opacity 0.4s ease;
  white-space: nowrap;
  z-index: 1;
}

/* second text (hover state) */
.stylish-btn .active-text {
  color: #2C2C2C; /* text color on hover */
  opacity: 0;
  transform: translate(-50%, 100%);
}

/* hover animations */
.stylish-btn:hover::before {
  height: 100%;
}

.stylish-btn:hover .initial-text {
  transform: translate(-50%, -150%);
  opacity: 0;
}

.stylish-btn:hover .active-text {
  transform: translate(-50%, -50%);
  opacity: 1;
}

/* revert smoothly */
.stylish-btn:not(:hover) .active-text {
  transform: translate(-50%, 100%);
  opacity: 0;
}

@media (max-width: 1024px) {
  .stylish-btn {
    padding: 20px 115px; 
    font-size: 20px; 
  }
}

/* MOBILE */
@media (max-width: 767px) {
  .stylish-btn {
    padding: 17px 80px;
    font-size: 16px; 
  }
}/* End custom CSS */