/* Transition */

.transition {
	transition: all 0.25s ease-in-out;
}




/* Stretch Link */
.stretch-link {
  position: relative;
}

.stretch-link a::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: auto; 
}

.stretch-link a:is(:focus-visible)::after {
  outline: 2px solid;
}

.stretch-link a:is(:hover, :focus) {
  outline: none;
}


/* -- Some Tweaks -- */

/** Stack Card **/

/* Stack Card */

:root {
	--stack-padding-top: 80px;
}

@media (prefers-reduced-motion: no-preference) {
  .stack-card {
    animation: heisen linear;
    animation-timeline: view(auto calc(100% - var(--stack-padding-top)));
  }

  @keyframes heisen {
    to {
      filter: blur(20px);
      transform: scale(0.5);
    }
  }
}






/* Sticky header – Apple-like frosted glass effect */

.gb-site-header-0482007b.gb-is-sticky {
  background-color: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(15px) saturate(180%);
  -webkit-backdrop-filter: blur(15px) saturate(180%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}





/* Sticky header – Apple-like frosted glass effect */
.gb-site-header-955e0dbc.gb-is-sticky {
  background-color: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(15px) saturate(180%);
  -webkit-backdrop-filter: blur(15px) saturate(180%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/** Fixed problem during glass navigaiton mobile container **/
.gb-menu-container--mobile {
  position: fixed !important;
 
  left: 0;
  width: 100vw;
  height: 100vh;
  overflow-y: auto;
  z-index: 9999 !important;
  background: #fff; /* or your desired color */
}

.gb-menu-container--mobile .gb-menu {
  margin-top: 10px; /* Equal to or more than sticky header height */
} 




/** GB menu **/

.gb-menu > .gb-menu-item-mi280742:nth-of-type(1).current-menu-item {
  color: var(--neutral-950) !important;
}


/** Black **/
.gb-menu > .gb-menu-item-mi588c5e:nth-of-type(1).current-menu-item {
  color: var(--neutral-0) !important;
}




/** Sparkle Text Animation **/

.gb-text-8040a53e .gb-shape svg {
    animation: bounce 2.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
    display: inline-block;
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-12px);
    }
}



/* COMPLETE CSS FOR WORDPRESS TESTIMONIALS WITH ANIMATED BUBBLES */



/* Bubble 1 - Purple (top left) - LIGHTER */
.bubble-container:before {
    content: '';
    position: absolute;
    top: -150px;
    left: 40px;
    width: 120px;
    height: 120px;
    background: rgba(168, 85, 247, 0.1); /* Reduced from 0.3 to 0.1 */
    border-radius: 50%;
    animation: bubble-bounce-1 3s ease-in-out infinite;
    pointer-events: none;
    z-index: -2;
}

/* Bubble 2 - Green (top right) - LIGHTER */
.bubble-container:after {
    content: '';
    position: absolute;
    top: -160px;
    right: 20px;
    width: 100px;
    height: 100px;
    background: rgba(34, 197, 94, 0.1); /* Reduced from 0.3 to 0.1 */
    border-radius: 50%;
    animation: bubble-bounce-2 2.5s ease-in-out infinite 1s;
    pointer-events: none;
    z-index: -2;
}

/* Bubble 3 - Blue (bottom center) - LIGHTER */
.bubble-container .testimonial:nth-child(2):before {
    content: '';
    position: absolute;
    bottom: -130px;
    left: 50%;
    transform: translateX(-50%);
    width: 110px;
    height: 110px;
    background: rgba(59, 130, 246, 0.1); /* Reduced from 0.3 to 0.1 */
    border-radius: 50%;
    animation: bubble-bounce-3 3.5s ease-in-out infinite 2s;
    pointer-events: none;
    z-index: -2;
}

/* Animations */
@keyframes bubble-bounce-1 {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-15px) scale(1.05); }
}

@keyframes bubble-bounce-2 {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-12px) scale(1.03); }
}

@keyframes bubble-bounce-3 {
    0%, 100% { transform: translateX(-50%) translateY(0px) scale(1); }
    50% { transform: translateX(-50%) translateY(-18px) scale(1.04); }
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .bubble-container:before {
        width: 80px;
        height: 80px;
        top: -100px;
        left: 10px;
    }
    
    .bubble-container:after {
        width: 70px;
        height: 70px;
        top: -110px;
        right: 10px;
    }
    
    .bubble-container .testimonial:nth-child(2):before {
        width: 75px;
        height: 75px;
        bottom: -50px;
    }
}

/* Additional fixes for better compatibility */
.bubble-container {
    min-height: 200px;
}

/* Ensure bubbles don't interfere with hover effects */
.testimonial:hover {
    z-index: 15 !important;
}

/** Rotate Icon **/

.rotate-icon {
  animation: spin 5s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rotate-icon {
    animation: none !important;
  }
}


