/**GLOBAL**/

/* Add shadow on hover cards */
.hhs-img-hover-con {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); /* Color and Transparency */
}


/*********************************/
/*ADD BREAK LINE TO SCREENS BIGGER THAN 768px */
/*********************************/
@media (max-width: 768px) {
  .break {
    display: none;
  }
}



/*** Hide the line break on screens smaller than 992px ***/
  @media (max-width: 991px) {
    .break-992 {
      display: none;
    }
  }



/** SUBSCRIPTION PREFERENCES PAGES**/

/* Remove the black overlay against the hero section bg image */
.sub-pre-header .head-overlay {
  display: none !important;
}


/*********************************/
/* PAGE - HOME PAGE*/ 
/*********************************/
/* Adjust position of 2nd and 3rd hover cards */
@media (min-width: 992px) {
    /* Targeting the second card in the hover-cards-1 container */
    #hover-cards-1 .row .col-lg-4.col-sm-12:nth-of-type(2) {
        margin-top: -30px;
    }

    /* Targeting the third card in the hover-cards-1 container */
    #hover-cards-1 .row .col-lg-4.col-sm-12:nth-of-type(3) {
        margin-top: -60px;
    }
}


/* Move dots to the center */
@media (min-width: 993px) {
   .testimonials-module .c-slider-container .c-slider .slick-dots {
        position: absolute;
        left: 50%;
        right: 50%;
        transform: translateX(-50%);
        bottom: -25px; /* Adjust if necessary to better position the dots */
        text-align: center;
        width: auto;
    }
}


/* Row Shadow for homepage information section */
/* 3 Item 1 row background */
.information .row {
    box-shadow:  0 4px 16px rgba(229, 229, 240, 0.5); /* Adjust the shadow values as needed */
    border-radius: 16px; /* Adjust the radius for rounded corners */
    overflow: hidden; /* Ensures rounded corners are applied */
}


/*********************************/
/*SECTION - FOOTER */
/*********************************/
/* Make sure columns are center aligned on mobile  */
@media (max-width: 767px) {
  .hhs-foot-nav-cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .hhs-foot-nav-cols > .col-12 {
    max-width: 100%;
    margin-bottom: 30px;
  }

  .hhs-foot-nav-col {
    margin: 0 auto;
  }

  .hhs-foot-nav-col .hs-menu-wrapper {
    justify-content: center !important;
  }

  .hhs-foot-nav-col img {
    margin-left: auto;
    margin-right: auto;
  }
}




/*********************************/
/*SECTION - CLIENT LOGOS */
/*********************************/
/* Force 4-column layout on tablet to stack the same way as 5 columns rows */
@media (min-width: 768px) and (max-width: 991px) {
  .four-column-logos .c-col {
    width: 25% !important;
    flex: 0 0 25% !important;
    max-width: 25% !important;
  }
}


/*********************************/
/* PAGE - HOW WE HELP PAGE */
/*********************************/
/*Add line and move images above*/
#job-description .c-col.c-1::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%; /* Center the line horizontally within the column */
    transform: translateX(-50%); /* Adjust positioning to keep the line centered */
    width: .5px; /* Adjust the thickness of the line */
    background: linear-gradient(to bottom, #FCB040, #fc6c3f); /* Gradient color for the line */
    z-index: 1; /* Ensure the line is behind the content */
    height: 940%; /* Ensure the line fills the height of the row */
}

#job-description .c-col.c-1 {
    position: relative;
    height: 100%; /* Ensure the column height matches the row height */
}

/* Hide the vertical line on screens smaller than 768px */
@media (max-width: 767px) {
    #job-description .c-col.c-1::before {
        display: none;
    }
}


/*********************************/
/* PAGE - WHO WE HELP */
/*********************************/
/* Adjust screen alignment */
.who-we-help-h2 {
    text-align: left; /* Default for larger screens */
  }

  @media (max-width: 768px) { /* Adjust breakpoint as needed */
    .who-we-help-h2 {
      text-align: center; /* Center-align for smaller screens */
    }
  }


/*********************************/
/*SUCCESS STORIES - CSS */
/*********************************/
/* Client name and image stacking CSS */
/* Default layout: Side-by-side */
.success-stories-testimonial {
  display: flex; /* Enables Flexbox */
  flex-direction: row; /* Align items side by side */
  align-items: center; /* Vertically center items */
  gap: 10px; /* Space between items */
}

/* Media query: Stack items vertically on smaller screens */
@media (max-width: 719px) {
  .success-stories-testimonial {
    flex-direction: column; /* Stack items vertically */
    align-items: flex-start; /* Align items to the left */
  }
}
  

/* ADD BORDER TO ROWS */
.success-stories-video .row {
  border: 2px solid #F1592A; /* Adds a border around the row */
}
  
  .success-stories-case-study .row {
  border: 2px solid #ffffff; /* Adds a border around the row */
}


/*********************************/
/*LANDING PAGES - Hero Section with Forms */
/*********************************/
.hero-it-sales-book .c-content-con[role="form"] {
  background-color: #fff; /* White background */
  padding: 0px 25px 25px 25px; /* Space inside the box */
  border-radius: 10px;/* Optional: rounded corners */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* Optional: subtle shadow */
  margin: 0;  
}
  }