/* ===============================
   UNIVERSAL BUTTON ENGINE
================================*/
.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
  font-family:inherit;
  cursor:pointer;
  text-decoration:none;
/*   border-radius:6px; */
	border-radius: var(--btn-radius, 6px);
  border:none;
  white-space:nowrap;
  transition:all .25s ease;
  
}

.btn-sm{height:var(--btn-h,36px);min-width:120px;padding:0 18px;font-size:15px;}
.btn-md{height:var(--btn-h,44px);min-width:140px;padding:0 10px;font-size:15px;}
.btn-lg{height:var(--btn-h,52px);min-width:160px;padding:0 5px;font-size:16px;}
.btn-xl{height:var(--btn-h,60px);min-width:180px;padding:0 34px;font-size:18px;}

.btn{
  width: var(--btn-w, auto);
/*   padding: var(--btn-py, 10px) var(--btn-px, 10px); */
padding:var(--btn-py,initial) var(--btn-px,initial);
  margin-top:    var(--btn-mt, 0) !important;
  margin-right:  var(--btn-mr, 0) !important;
  margin-bottom: var(--btn-mb, 0) !important;
  margin-left:   var(--btn-ml, 0) !important;
}

body .btn-dark{
  background:#000 !important;
  color:#fff;
border: 1px solid #000000;
/* 	font-size: 15px; */
    font-weight: 100;
	
}
.btn.btn-dark {
    background: #000 !important;
}
.btn-dark:hover{
	background-color: #ffffff !important;
	color: #000000 !important;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3), 0 0 14px rgba(0, 0, 0, 0.2), 0 0 18px rgba(0, 0, 0, 0.1);
}
 .btn-dark span {
        visibility: hidden;
        display: none;
    }
    /* Default state */
    .btn-dark::before {
        color: #ffffff;
    }

    /* Hover state text */
    .btn-dark::after {
        color: #000000;
    }
.btn-pink{
  background:#e9124d;
  color:#fff;
	box-shadow: 0px 2px 2px rgb(139, 0, 36) !important;
}
.btn-pink:hover{
  background:#fff;
/* 	color:#000; */
border: 1px solid #000;
}
 .btn-pink span {
        visibility: hidden;
        display: none;
    }
    /* Default state */
    .btn-pink::before {
        color: #ffffff;
    }

    /* Hover state text */
    .btn-pink::after {
        color: #000000;
    }
.btn-navy{
  background:#101e69;
  color:#fff;
}
.btn-navy:hover{
  background:#000;
  box-shadow:0 0 14px rgba(16,30,105,.35);
}
 .btn-navy span {
        visibility: hidden;
    }
    /* Before hover text */
    .btn-navy::before {
        color: #ffffff;
    }

    /* After hover text */
    .btn-navy::after {
        color: #ffffff;
    }
.btn-blue{
  background:#305cde;
  color:#fff;
}
.btn-blue:hover{
  background:#1e90ff;
}

.btn-white{
  background:#fff;
  color:#000;
  box-shadow:0 2px 4px rgba(0,0,0,.25);
}
.btn-white:hover{
  background:#1e90ff;
/*   color:#fff; */
	 box-shadow: 0 0 6px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.2), 0 0 14px rgba(0, 0, 0, 0.1);
}
 .btn-white span {
        visibility: hidden;
    }

    /* Hover effect */
   .btn-white:hover {
        background-color: #1e90ff;
        box-shadow: 0 0 6px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.2), 0 0 14px rgba(0, 0, 0, 0.1);
    }

    .btn-white::before {
        color: black;
    }

    .btn-white::after {
        color: white;
    }

.btn-outline-dark{
  background-color:#fff;
  border:2px solid #000;
  color:#000;
}

 .btn-outline-dark span {
        visibility: hidden;
        display: none;
    }


    /* Hover state */
   .btn-outline-dark:hover {
        background-color: #000;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
	   color:#fff !important;
    }

    .btn-outline-dark::before {
        color: black;
    }

    .btn-outline-dark::after {
        color: white;
    }
.btn-gradient{
  color:#fff;
  background:linear-gradient(270deg,#F61351,#1e90ff,#F61351);
  background-size:400% 400%;
  animation:gradientWave 6s ease infinite;
}
.btn-gradient:hover{
  animation:none;
  filter:brightness(.9);
background: linear-gradient(to right, #d01045, #1a78c5) !important;
     
}
.btn-gradient.button-text-animation::before,
.btn-gradient.button-text-animation::after {
  color:#fff;
}


.btn-gradient span {
        visibility: hidden;
        display: inline-block;
        height: 0;
        overflow: hidden;
    }
    /* Before hover text */
    .btn-gradient::before {
        color: #ffffff;
    }

    /* After hover text */
    .btn-gradient::after {
        color: #ffffff;
    }
@media (max-width:768px){
  .btn{
    margin-top:var(--btn-mob-mt, var(--btn-mt, 0px)) !important;
    margin-bottom:var(--btn-mob-mb, var(--btn-mb, 0px)) !important;
/*     width:var(--btn-mw, var(--btn-w, auto)) !important;
    height:var(--btn-mh, var(--btn-h, auto)) !important; */
	  width: var(--btn-mw, var(--btn-w)) !important;
height: var(--btn-mh, var(--btn-h)) !important;
    padding-left:var(--btn-mob-px, var(--btn-px, initial)) !important;
    padding-right:var(--btn-mob-px, var(--btn-px, initial)) !important;
    padding-top:var(--btn-mob-py, var(--btn-py, initial)) !important;
    padding-bottom:var(--btn-mob-py, var(--btn-py, initial)) !important;
  }
  [data-mobile-center="1"]{
    display:block !important;
    margin-left:auto !important;
    margin-right:auto !important;
    width:var(--btn-mw, fit-content) !important;
    text-align:center;
  }
}


/* 64 Skills Brand Colors */
.btn-yellow{
  background:#FFEE58;
  color:#111111;
  font-weight:700;
  border:1px solid #FFEE58;
}
.btn-yellow:hover{
  background:#FFD600;
  box-shadow:0 4px 14px rgba(255,238,88,.4);
}
.btn-yellow span{visibility:hidden;display:none;}
.btn-yellow::before{color:#111111;}
.btn-yellow::after{color:#111111;}

.btn-purple{
  background:#503AA8;
  color:#fff;
}
.btn-purple:hover{
  background:#3d2b82;
  box-shadow:0 4px 14px rgba(80,58,168,.4);
}
.btn-purple span{visibility:hidden;display:none;}
.btn-purple::before{color:#fff;}
.btn-purple::after{color:#fff;}

.btn-outline-white{
  background:transparent;
  border:2px solid #fff;
  color:#fff;
}
.btn-outline-white:hover{
  background:#fff;
  color:#111;
}
.btn-outline-white span{visibility:hidden;display:none;}
.btn-outline-white::before{color:#fff;}
.btn-outline-white::after{color:#111;}

@keyframes gradientWave{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
/* ==================================
   SLIDING TEXT ANIMATION (FIXED)
===================================*/

/* ==================================
   SLIDING TEXT ANIMATION (AUTO FIXED)
===================================*/

.button-animation{
  position:relative;
  overflow:hidden;
}

/* hide only the real text, not the button */
.button-animation{
/*   color:inherit; */
	color:transparent;
	
}

/* animation layers */
.button-animation::before,
.button-animation::after{
  content:attr(data-text);
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  white-space:nowrap;
  transition:all .35s ease;
  pointer-events:none;
}

/* main visible text */
.button-animation::before{
  opacity:1;
}

/* second text hidden */
.button-animation::after{
  top:120%;
  opacity:0;
}


/* hover animation */
.button-animation:hover::before{
  top:-120%;
  opacity:0;
}

.button-animation:hover::after{
  top:50%;
  opacity:1;
}



.reqdemo .btn::before,
.reqdemo .btn::after{
  font-weight:700 !important;
}

a.gotoplanner {
    font-size: 14px !important;
}

.btn-align-fix {
  position: absolute !important;
 top: 55px;
    right: -113px;
}
.page-id-1344 .service-replace,
.page-id-1787 .service-replace,
.page-id-1790 .service-replace,
.page-id-1792 .service-replace,
.page-id-1798 .service-replace{
	display:none;
}
/* Mobile Override */
@media (max-width: 768px){
  .btn{
    width: var(--btn-mw, var(--btn-w, auto));
    height: var(--btn-mh, var(--btn-h, auto));
	  min-width:120px !important;
  }
	.letsconnect {
		    margin-left: 56px !important;
	}
	.mobile-align-sft {
		margin-left: 46px !important;
	}
	.mobile-align-bfd {
		margin-left: -254px !important;
	}
	.last-sec-mob-sft {
		margin-left: -46px !important;
	}
	.last-sec-mob-bfd {
		margin-left: 239px !important;
        margin-top: -47px !important;
	}
}

/* ===============================
   FOCUS/ACTIVE BLACK BOX FIX
================================*/
.wp-block-button__link:focus,
.wp-block-button__link:active,
.wp-block-button__link:focus-visible,
.btn:focus,
.btn:active,
.btn:focus-visible,
a:focus,
a:active,
a:focus-visible,
.wp-block-navigation-link__content:focus,
.wp-block-navigation-link__content:focus-visible,
.wp-block-navigation a:focus,
.wp-block-navigation a:focus-visible,
.wp-block-image a:focus,
.wp-block-image a:focus-visible,
.wp-block-site-logo a:focus,
.wp-block-site-logo a:focus-visible,
img:focus,
img:focus-visible{
  outline:none !important;
  box-shadow:none !important;
  text-decoration:none !important;
}

/* ===============================
   SHOP FILTER GRID
================================*/
.sf-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.sf-pill:hover{
  background:#f0f0f0 !important;
  border-color:#bbb !important;
}
.sf-pill.sf-active:hover{
  background:#111 !important;
  border-color:#111 !important;
}
@media(max-width:781px){
  .sf-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
}
@media(min-width:782px) and (max-width:1024px){
  .sf-grid{grid-template-columns:repeat(2,1fr);}
}

/* ===============================
   VIDEO FILTER PILLS & GRID
================================*/
.vf-pill:hover{
  background:#f0f0f0 !important;
  border-color:#bbb !important;
}
.vf-pill.vf-active:hover{
  background:#111 !important;
  border-color:#111 !important;
}
.vf-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
@media(max-width:781px){
  .vf-grid{
    grid-template-columns:1fr;
  }
}
@media(min-width:782px) and (max-width:1024px){
  .vf-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

/* ===============================
   NAV HOVER - NO UNDERLINE
================================*/
.wp-block-navigation a:hover,
.wp-block-navigation a:focus,
.wp-block-navigation-link__content:hover,
.wp-block-navigation-link__content:focus{
  text-decoration:none !important;
}

/* ===============================
   STICKY HEADER
================================*/
.wp-site-blocks > header,
.wp-site-blocks > .wp-block-template-part:first-child{
  position:sticky;
  top:0;
  z-index:999;
  transition:box-shadow .3s ease;
}
.wp-site-blocks > header.scrolled,
.wp-site-blocks > .wp-block-template-part:first-child.scrolled{
  box-shadow:0 2px 12px rgba(0,0,0,0.08);
}