/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.4.1755003363
Updated: 2025-08-12 12:56:03

*/

/* Shutter effect */
.button-hover .elementor-button {
	position: relative;
	overflow: hidden;
}
.button-hover .elementor-button::before {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background-color: #000;
	color: #131E25;
	transition: left 0.5s ease;
	z-index: 0;
}

.button-hover .elementor-button:hover::before{
	left: 0; 
}
.button-hover .elementor-button-content-wrapper{
	position: relative;
	z-index: 1;
}
/* Shutter effect */

/*Menu Hover*/
.elementor-nav-menu li .elementor-item,
.elementor-nav-menu li.menu-item-has-children > .elementor-item-anchor {
  position: relative;
}

/* Elementor: Pseudo-element for the gradient underline effect */
.elementor-nav-menu li .elementor-item::before,
.elementor-nav-menu li.menu-item-has-children > .elementor-item-anchor::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 4px;
  background-color: #fff !important;
  border-radius: 0;
  transition: all 0.5s ease-in-out;
}

/* Elementor: Hover state to expand the gradient underline */
.elementor-nav-menu li .elementor-item:hover::before,
.elementor-nav-menu li.menu-item-has-children > .elementor-item-anchor:hover::before {
  width: 100%;
  border-radius: 50%;
}
/*Menu Hover*/


.hammer path:nth-child(1), .hammer path:nth-child(2) {
    animation: hammerBounce 3s ease-in-out infinite;
}
.hammer path:nth-child(3), .hammer path:nth-child(4), .hammer path:nth-child(5), .hammer path:nth-child(6) {
    transform-origin: center;
    animation: hammerStrike 3s ease-in-out infinite;
}

@keyframes hammerStrike {
  0%, 100% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-15deg);
  }
}
@keyframes hammerBounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(1px);
  }
}

/*Image revel*/
/* Reveal wrapper (works on Elementor image widget wrapper or any wrapper with class "reveal") */
.reveal{
  position: relative;
  overflow: hidden;
  visibility: hidden;         /* JS will set visible when ready */
  --reveal-mask: 0%;          /* animated by GSAP */
  --reveal-mask-color: #fff;  /* change to match section bg if needed */
  will-change: transform;
}

/* mask as a pseudo-element — animates via CSS variable */
.reveal::after{
  content: "";
  position: absolute;
  inset: 0;
  background: var(--reveal-mask-color);
  z-index: 6;
  transform: translateX(var(--reveal-mask));
  pointer-events: none;
}

/* make images behave predictably inside elementor structure */
.reveal img,
.elementor-widget-image .reveal img,
.elementor-widget-image img.reveal {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: center;
  will-change: transform;
}

/* Optional: keep wrapper area stable in columns (remove if you want auto height) */
.reveal {
  min-height: 220px; /* adjust to taste or remove */
}


/*Image hover shine*/
.shine {
  position: relative;
  overflow: hidden;
}

.shine::before {
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 100%
  );
  content: "";
  display: block;
  height: 100%;
  left: -85%;
  position: absolute;
  top: 0;
  transform: skewX(-25deg);
  width: 50%;
  z-index: 2;
}

.shine:hover::before,
.shine:focus::before {
  animation: shine 0.85s;
}

@keyframes shine {
  100% {
    left: 125%;
  }
}

/*Practice Area Hover effct*/
.practice-area {
  position: relative;
  overflow: hidden;
}

.practice-area .hover-overlay {
  content: "";
  position: absolute;
  inset: 0;
  background: #1E415D; /* background color for hover */
  z-index: 3;
  pointer-events: none;
  transform: translateY(-100%);
}

.practice-area * {
  position: relative;
  z-index: 4; /* keep text above overlay */
  transition: color 0.3s ease;
}
.practice-area .elementor-icon-box-description a{
    top: 15px;
    color: #2a7d8c;
    font-weight: bold;
}
.practice-area .elementor-icon-box-description a::after {
  content: " →";
  transition: transform 0.3s ease;
}

.home-cnt a {
    color: #2a7d8c;
}


.all-cards {
  display: flex;
  flex-direction: column; /* Arrange cards vertically in the column */
}

.card1 {
  position: -webkit-sticky; /* For Safari */
  position: sticky;
  top: 50px; /* Offset from the top */
}
.card2 {
  position: -webkit-sticky; /* For Safari */
  position: sticky;
  top: 100px; /* Offset from the top */
}
.card3 {
  position: -webkit-sticky; /* For Safari */
  position: sticky;
  top: 150px; /* Offset from the top */
}
.card4 {
  position: -webkit-sticky; /* For Safari */
  position: sticky;
  top: 200px; /* Offset from the top */
}


/* TablePress Design */

#tablepress-1 tbody td {
    padding: 16px 20px;
    border: none;
}

table caption+thead tr:first-child td, table caption+thead tr:first-child th {
    background-color: #fff;
    font-size: 18px;
    padding-left: 20px;
    border-bottom: 1px solid hsla(0,0%,50%,.502);
}