/*
Theme Name: Hello Biz Child
Theme URI: https://elementor.com/products/hello-biz/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-biz
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Biz is a free, user-friendly Hybrid WordPress Theme that was crafted for seamless integration with the Elementor site builder and tailored specifically for business websites. Perfect for beginners, but far from limited to just them, it features a dedicated beginner-oriented “Home” screen to simplify and streamline the web-building process. Hello Biz also integrates with Elementor’s premium features, giving you access to tools like AI, and accessibility enhancements in one place. Whether launching a startup site or refining a company portfolio, Hello Biz offers a solid, responsive foundation for all web creators. Report security bugs through the Patchstack Vulnerability Disclosure Program. The Patchstack team validates, triages, and handles vulnerabilities. Report here: https://patchstack.com/database/wordpress/theme/hello-biz/vdp.
Tags: flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready,style-variations
Version: 1.2.0.1760510773
Updated: 2025-10-15 06:46:13

*/

body{
	background-color:#F8F8F8;
	overflow-x:hidden
}

.header{
	backdrop-filter: blur(3px);
}

.signup-btn a {
  display: inline-block;
  padding: 12px 30px !important;
  border-radius: 50px;
  background: linear-gradient(#F8F8F8, #F8F8F8) padding-box,
              linear-gradient(to left, #0891B2, #0FA785, #10B981) border-box;
  border: 2px solid transparent;
  text-decoration: none;
  color: #0FA785 !important;
	transition: all 0.5s ease;
}

.signup-btn a:hover {
   background: linear-gradient(to left, #0891B2, #0FA785, #10B981);
    color: #ffffff !important;
    box-shadow: 0 10px 15px rgba(8,145,178,0.2), 0 10px 15px rgba(16,185,129,0.1);
}

.freetrial-btn a{
	display: inline-block;
  padding: 12px 30px !important;
  border-radius: 50px;
  background: linear-gradient(#F8F8F8, #F8F8F8) padding-box,
              linear-gradient(to left, #0891B2, #0FA785, #10B981) border-box;
  border: 2px solid transparent;
  text-decoration: none;
  color: #0FA785 !important;
	transition: all 0.5s ease;
}

.freetrial-btn a:hover {
   background: linear-gradient(to left, #0891B2, #0FA785, #10B981);
    color: #ffffff !important;
    box-shadow: 0 10px 15px rgba(8,145,178,0.2), 0 10px 15px rgba(16,185,129,0.1);
}

.border-btn a{
	display: inline-block;
  padding: 13px 30px !important;
  border-radius: 50px;
  background: linear-gradient(#F8F8F8, #F8F8F8) padding-box,
              linear-gradient(to left, #0891B2, #0FA785, #10B981) border-box;
  border: 2px solid transparent;
  text-decoration: none;
  color: #0FA785 !important;
transition: all 0.5s ease;
}

.border-btn a:hover {
   background: linear-gradient(to left, #0891B2, #0FA785, #10B981);
    color: #ffffff !important;
    box-shadow: 0 10px 15px rgba(8,145,178,0.2), 0 10px 15px rgba(16,185,129,0.1);
}


.freetrial-btn .elementor-button-icon svg{
	width:24px
}

.freetrial-btn a .elementor-button-content-wrapper {
    display: flex;
    line-height: 28px;
    align-items: center;
}

.freetrial-btn{
    position:relative;
}

.freetrial-btn:before{
    content:'';
    width:47px;
    height:50px;
    position:absolute;
    top:27px;
    left:-47px;
    background:url(https://www.foodmeter.jmddesign.nl/wp-content/uploads/2025/10/Curving-Arrow-PNG-Pic-1.png)
}

.price-card .elementor-price-table__price{
	padding-bottom: 20px !important;
	margin-top: 30px;
}

.price-card .elementor-price-table__price .elementor-price-table__period{
    display:flex;
	width: auto;
	margin-left: 5px;
}

.price-card{
    transition: all 0.5s ease;
}

.price-card:hover{
    box-shadow:0px 20px 40px rgba(0, 0, 0, .1) 
}

.free a.elementor-price-table__button{
    display: inline-block;
  padding: 15px 30px !important;
  border-radius: 50px;
  background: linear-gradient(#F8F8F8, #F8F8F8) padding-box,
              linear-gradient(to left, #0891B2, #0FA785, #10B981) border-box;
  border: 2px solid transparent;
  text-decoration: none;
  color: #0FA785 !important;
margin-bottom: 20px;
transition: all 0.5s ease;
}

.free a.elementor-price-table__button:hover {
   background: linear-gradient(to left, #0891B2, #0FA785, #10B981);
    color: #ffffff !important;
    box-shadow: 0 10px 15px rgba(8,145,178,0.2), 0 10px 15px rgba(16,185,129,0.1);
}




.price-card.pro a.elementor-price-table__button{
    background: linear-gradient(to left, #0891B2, #0FA785, #10B981) border-box;
    border-radius:50px;
	padding: 17px 30px !important;
}

.ai-title .elementor-image-box-wrapper{
    justify-content:start
}

.ai-title .elementor-image-box-content{
    width:auto !important;
    margin-right:10px;
	white-space: nowrap;
}

.ai-icon-box .elementor-image-box-img{
    background-color:white;
    padding:15px;
    border-radius:10px;
    border:1px solid #D5D5D5;
    box-shadow:0px 4px 40px rgba(0, 0, 0, .1) !important
}

.first-post .elementor-post__card{
    min-height:auto !important
}

.first-post .elementor-post__card .elementor-post__thumbnail__link{
    margin-bottom:0px
}

.first-post .elementor-post__card .elementor-post__text{
    position:absolute;
    bottom:40px
}

.first-post .elementor-post__card .elementor-post__meta-data{
     position:absolute;
    bottom:0px;
    border:0px !important
}

.first-post .elementor-post__thumbnail{
    min-height:400px
}

.first-post .elementor-post__thumbnail:before{
    content:'';
    width:100%;
    height:100%;
    background: linear-gradient(0deg,rgba(0, 0, 0, 0.6) 30%, rgba(0, 0, 0, 0.1) 100%);
    position:absolute;
    top:0px;
    left:0px;
    z-index: 1;
}

.first-post .slick-dots li button:before {
    font-size: 36px;
}

.first-post .slick-dots li.slick-active button:before {
    color: #10b981;
}

.second-post .elementor-post__card{
    min-height:auto !important
}

.second-post .elementor-post__card .elementor-post__thumbnail__link{
    margin-bottom:0px
}

.second-post .elementor-post__card .elementor-post__text{
    position:absolute;
    bottom:40px
}

.second-post .elementor-post__card .elementor-post__meta-data{
     position:absolute;
    bottom:0px;
    border:0px !important
}

.second-post .elementor-post__thumbnail{
    min-height:190px;
	padding-bottom: 0px !important;
}

.second-post .elementor-post__thumbnail:before{
    content:'';
    width:100%;
    height:100%;
    background: linear-gradient(0deg,rgba(0, 0, 0, 0.6) 30%, rgba(0, 0, 0, 0.1) 100%);
    position:absolute;
    top:0px;
    left:0px;
    z-index: 1;
}

.service-slider .slick-dots li button:before{
	font-size: 36px;
}

.service-slider .slick-dots li.slick-active button:before {
    color: #10b981;
}

.service-slider .slick-slide{
	padding:10px
}

.price-slider .slick-dots li button:before {
    font-size: 36px;
}

.price-slider .slick-dots li.slick-active button:before {
    color: #10b981;
}

.price-slider .slick-dots{
	width: calc(100% - 20px);
}

.otgs-development-site-front-end{
	display:none!important;
}

.ai-icon-box .elementor-image-box-title{
    margin-top:0px
}

.pro a {
  position: relative;
  overflow: hidden;
  transition: background-color 0.4s ease-in-out;
    border-radius:50px
}

.pro a::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.4) 0%,
    rgba(255, 255, 255, 0.1) 60%,
    transparent 100%
  );
  transform: skewX(-25deg);
}

.pro a:hover {
  background-color: #67AEAA;
  color: white;
}

.pro a:hover::after {
  animation: shine 0.8s forwards;
}

@keyframes shine {
  0% {
    left: -75%;
  }
  100% {
    left: 125%;
  }
}

/* Base wrapper */
.anim .elementor-image-box-wrapper {
  position: relative;
  overflow: hidden;
  padding: 25px;
  border-radius: 18px;
  transition: transform 0.3s ease;
  z-index: 0;
}

/* Single gradient border line using pseudo-element */
.anim .elementor-image-box-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  border: 2px solid transparent; /* fallback */
  background: linear-gradient(90deg, #10B981, #0FA785, #0891B2);
  background-clip: border-box;
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0.4; /* faded initially */
  transform: scaleX(0);
  transform-origin: left;
  transition: all 0.6s ease;
  z-index: 1;
}

/* Hover effect — grow and full opacity */
.anim:hover .elementor-image-box-wrapper::before {
  transform: scaleX(1);
  opacity: 1;
  background-position: 100% 0;
}

/* Optional subtle zoom on hover */
.anim:hover .elementor-image-box-wrapper {
  transform: scale(1.02);
}

.ai-tool-slider .slick-slide{
    padding:10px
}

.ai-tool-slider .slick-slide .ai-icon-box{
    background-color:white;
    padding:40px 20px;
    border-radius:20px
}

.ai-tool-slider .slick-dots li button:before {
    font-size: 36px;
}

.ai-tool-slider .slick-dots li.slick-active button:before {
    color: #10b981;
}


@media(max-width:992px){
	.mob-sidebar .sub-menu{
    margin-top:0px !important;
    margin-left:auto !important;
    right:0px;
    background-color:transparent !important
}

.mob-sidebar .sub-menu li a{
   text-align:center !important;
   justify-content: center;
   color: white;
padding-left: 0px;
}

}


@media(max-width:767px){
	.freetrial-btn:before{
    content:unset;
}
	.price-slider .slick-slide{
		padding-left:10px;
		padding-right:10px
	}
	
	.ai-title .elementor-image-box-wrapper{
    display:flex;
    align-items:center;
    justify-content:center !important
}

.ai-title .elementor-image-box-wrapper .elementor-image-box-img{
    margin:0px !important;
    margin-right:10px !important;
    padding:0px !important;
    width:auto !important
}
	
	.ai-icon-box .elementor-image-box-title{
    margin-top:10px
}

	.first-post .elementor-post__thumbnail {
    min-height: 300px;
}
	
	 .anim .elementor-image-box-wrapper::before {
    transform: scaleX(1);
    opacity: 1;
  }

  /* Disable hover zoom for mobile */
  .anim .elementor-image-box-wrapper,
  .anim:hover .elementor-image-box-wrapper {
    transform: none;
  }

}