.gradient-background {
	background: linear-gradient(-45deg, #69B5BE, #F06A66, #A5D3D9, #F7A5A3);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.gradient-background-still {
  background: linear-gradient(135deg, #69B5BE, #F06A66);
  color: white;
  position: relative;
}

/* Keep SVG under the content */
.wave-divider svg {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: -1px;
}

/* Float the hero image slightly above the wave */
.hero-image {
  position: relative;
  z-index: 3; /* 👈 This ensures it stays above the SVG */
  margin-bottom: -40px; /* Moves it down toward the wave visually */
  /* box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3); */
  /* border-radius: 35px; */
  /* max-width: 50%; */
}

.icon-square {
    width: 70px;              /* controls the square size */
    height: 70px;
    background-color: #f8f9fa; /* light background */
    border-radius: 12px;       /* optional: slightly rounded corners */
  }
  
  .section-divider {
  border: 0;
  height: 2px;
  background: linear-gradient(to right, #ddd, #69B5BE, #F06A66, #A5D3D9, #F7A5A3);
  border-radius: 2px;
}

.w-90 { width: 90% !important; }