body{font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif}

/* BlobBridge landing custom styles */
.hero-bg{
  background:linear-gradient(135deg,#0d6efd 0%,#0550ae 100%);
}
.screenshot{
  max-width:100%;
  border-radius:.5rem;
  box-shadow:0 0.5rem 1rem rgba(0,0,0,.15);
  transition:transform .2s;
}
.screenshot:hover{transform:scale(1.03)}

/* BlobBridge landing & feature overrides */
.hero-bg {
  background: linear-gradient(135deg, #0d6efd 0%, #0550ae 100%);
}
.screenshot {
  max-width: 100%;
  border-radius: .5rem;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15);
  transition: transform .2s;
}
.screenshot:hover {
  transform: scale(1.03);
}
.feature-icon {
  font-size: 2.5rem;
  color: var(--bs-primary);
}
.feature-img {
  width: 100%;
  border-radius: .5rem;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.1);
  margin-top: .5rem;
}

.btn-shine {
  position: relative;
  overflow: hidden;
}

/* the “shine” overlay */
.btn-shine::before {
  content: "";
  position: absolute;
  top: 0; left: -100%;
  width: 40%; height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255,255,255,0)   0%,
    rgba(255,255,255,0.6) 50%,
    rgba(255,255,255,0)   100%
  );
  transform: skewX(-25deg);
}

/* the animation */
@keyframes shine {
  to { left: 150%; }
}

/* apply it on a slow loop */
.btn-shine::before {
  animation: shine 3s ease-in-out infinite;
}
