.rcbb-actions{
  --rcbb-gap:10px;
  --rcbb-offset-x:20px;
  --rcbb-offset-y:20px;
  --rcbb-icon-size:44px;
  --rcbb-z:9999;
  --rcbb-shadow:0 10px 24px rgba(0,0,0,.14);
  --rcbb-shadow-hover:0 14px 30px rgba(0,0,0,.18);
  --rcbb-brand-cyan:#34acd8;
  --rcbb-brand-gold:#f7c600;
  --rcbb-brand-red:#de3b2a;

  position:fixed;
  display:flex;
  gap:var(--rcbb-gap);
  z-index:var(--rcbb-z);
}

.rcbb-actions.rcbb-layout-vertical{ flex-direction:column; }
.rcbb-actions.rcbb-layout-horizontal{ flex-direction:row; }

.rcbb-actions.rcbb-x-left{ left:var(--rcbb-offset-x); }
.rcbb-actions.rcbb-x-right{ right:var(--rcbb-offset-x); }
.rcbb-actions.rcbb-y-top{ top:var(--rcbb-offset-y); }
.rcbb-actions.rcbb-y-bottom{ bottom:var(--rcbb-offset-y); }

.rcbb-btn{
  width:var(--rcbb-icon-size);
  height:var(--rcbb-icon-size);
  min-height:var(--rcbb-icon-size);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  text-decoration:none;
  color:#fff;
  box-shadow:var(--rcbb-shadow);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  background-size:200% 200%;
  transform-origin:center;
  animation:
    rcbbGradientShift 10s ease-in-out infinite,
    rcbbFloat 3.3s ease-in-out infinite;
}

.rcbb-btn:nth-child(2){ animation-delay:0s, .45s; }
.rcbb-btn:nth-child(3){ animation-delay:0s, .9s; }

.rcbb-btn svg{
  width:20px;
  height:20px;
  fill:currentColor;
  color:#fff;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35));
}

.rcbb-call{ background:linear-gradient(135deg, #42b7e0 0%, #239fcf 100%); }
.rcbb-wa{ background:linear-gradient(135deg, #25D366 0%, #128C7E 100%); color:#fff; border-color:rgba(37,211,102,.1); }
.rcbb-wa svg{ color:#fff; filter:drop-shadow(0 1px 2px rgba(0,0,0,.35)); }
.rcbb-support{ background:linear-gradient(135deg, #e54a38 0%, #cd2f1e 100%); }

.rcbb-btn:hover{
  transform:translateY(-3px) scale(1.12) rotate(-4deg);
  box-shadow:var(--rcbb-shadow-hover);
  filter:brightness(1.1);
  animation-play-state:running;
}

.rcbb-btn:hover::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:999px;
  box-shadow:0 0 0 0 rgba(255,255,255,0);
  animation:rcbbRipple 0.8s ease-out;
}

@keyframes rcbbRipple{
  0%{ box-shadow:0 0 0 0 rgba(255,255,255,0.4); }
  100%{ box-shadow:0 0 0 12px rgba(255,255,255,0); }
}


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

@keyframes rcbbFloat{
  0%, 100%{ transform:translate3d(0,0,0) rotate(0deg) scale(1); }
  25%{ transform:translate3d(0,-4px,0) rotate(-1.2deg) scale(1.01); }
  50%{ transform:translate3d(0,-8px,0) rotate(0deg) scale(1.03); }
  75%{ transform:translate3d(0,-4px,0) rotate(1.2deg) scale(1.01); }
}

@media (prefers-reduced-motion:reduce){
  .rcbb-btn{
    animation:rcbbGradientShift 10s ease-in-out infinite;
  }
}

@media (max-width:1024px){
  .rcbb-btn svg{
    width:18px;
    height:18px;
  }
}