/* === Bubble Shooter — banner pour pages internes === */
.bubble-shooter-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 16px;
  padding: 10px 0 6px;
}
.banner-bulles {
  display: flex;
  gap: 6px;
}
.bulle-deco {
  border-radius: 50%;
  animation: bulle-float 3s ease-in-out infinite;
  will-change: transform;
}
.banner-bulles .bulle-deco {
  width: 22px; height: 22px;
}
.banner-bulles .bulle-deco:nth-child(2) { animation-delay: -1s; }
.banner-bulles .bulle-deco:nth-child(3) { animation-delay: -2s; }
.bulle-rouge {
  background: radial-gradient(circle at 30% 30%, #fca5a5, #ef4444);
  box-shadow: 0 4px 12px rgba(239,68,68,0.4), inset 0 -2px 4px rgba(255,255,255,0.2);
}
.bulle-verte {
  background: radial-gradient(circle at 30% 30%, #6ee7b7, #10b981);
  box-shadow: 0 4px 12px rgba(16,185,129,0.4), inset 0 -2px 4px rgba(255,255,255,0.2);
}
.bulle-bleue {
  background: radial-gradient(circle at 30% 30%, #67e8f9, #06b6d4);
  box-shadow: 0 4px 12px rgba(6,182,212,0.4), inset 0 -2px 4px rgba(255,255,255,0.2);
}
.banner-title {
  font-size: 1.1rem;
  font-weight: 800;
  color: #67e8f9;
  text-decoration: none;
  transition: color 0.2s;
}
.banner-title:hover { color: #a5f3fc; }
@keyframes bulle-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}