* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

body {
  background-color: #0d0608;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  position: relative;
}

/* Background Glowing Elements */
.bg-glow {
  position: absolute;
  width: 350px;
  height: 350px;
  border-radius: 50%;
  filter: blur(100px);
  opacity: 0.35;
  z-index: 1;
}
.blob-gold { background: #ffd700; top: 15%; left: 20%; }
.blob-red { background: #800020; bottom: 15%; right: 20%; }

.container {
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Outer Animated Glowing Border Ring (Gold Theme) */
.outer-glow-ring {
  padding: 4px;
  border-radius: 50px;
  background: linear-gradient(45deg, #ffd700, #b8860b, #ff4500, #ffd700);
  background-size: 300% 300%;
  animation: borderRotate 4s ease infinite;
  box-shadow: 0 0 30px rgba(255, 215, 0, 0.35);
}

/* Main Button Styling */
.btn-endelea {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 16px 40px;
  border-radius: 46px;
  background: linear-gradient(135deg, #2a0812 0%, #0a0305 100%);
  color: #ffffff;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 215, 0, 0.4);
  cursor: pointer;
  box-shadow: inset 0 0 15px rgba(255, 215, 0, 0.15);
}

/* Logo Box & Icon Styling */
.logo-box {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(255, 215, 0, 0.5);
  background: #000;
}

.btn-logo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Button Text Styling */
.btn-text {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 2px;
  background: linear-gradient(90deg, #ffffff, #ffd700, #ffffff);
  background-size: 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shineText 3s infinite linear;
}

/* Shiny Light Sweep Effect */
.shine {
  position: absolute;
  top: 0; left: -100%;
  width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.3), transparent);
  transform: skewX(-25deg);
  animation: shineSweep 3s infinite;
}

/* Soft Bounce Animation (Kudunda kwa Taratibu) */
.bounce-soft {
  animation: softBounce 2.4s infinite ease-in-out;
}

@keyframes softBounce {
  0%, 100% {
    transform: translateY(0) scale(1);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.8);
  }
  50% {
    transform: translateY(-8px) scale(1.03);
    box-shadow: 0 18px 35px rgba(255, 215, 0, 0.3);
  }
}

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

@keyframes shineSweep {
  0% { left: -100%; }
  30%, 100% { left: 200%; }
}

@keyframes shineText {
  0% { background-position: 0%; }
  100% { background-position: 200%; }
}

/* Hover State */
.btn-endelea:hover {
  transform: scale(1.06);
  border-color: #ffd700;
}