.elementor-28620 .elementor-element.elementor-element-39bf871{--display:flex;--margin-top:-20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-28620 .elementor-element.elementor-element-39bf871.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-28620 .elementor-element.elementor-element-7c7ce2a{--display:flex;}/* Start custom CSS for html, class: .elementor-element-f2ceddb *//* Main wrapper */
.wp-custom-floating-socials {
  position: fixed;
  bottom: 82px; /* Kept at 90px to clear your back-to-top button */
  right: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 99999;
  /* Adds a transparent hit-box padding so hover doesn't break when moving the mouse up */
  padding-top: 20px; 
}

/* Wrapper for the hidden items */
.social-reveal-wrapper {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 16px; /* Space between the hidden icons and the main toggle */
  
  /* Hidden state */
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
}

/* Reveal when hovering over the main wrapper */
.wp-custom-floating-socials:hover .social-reveal-wrapper {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* The primary toggle button (The + icon) */
.wp-social-main-toggle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background-color: var(--taiga-dark, #1A1A1A);
  color: var(--taiga-gold, #F5A623);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  transition: all 0.3s ease;
}

/* Rotate the + icon to an X when hovered */
.wp-custom-floating-socials:hover .wp-social-main-toggle {
  background-color: var(--taiga-gold, #F5A623);
  color: var(--taiga-dark, #1A1A1A);
  box-shadow: 0 6px 16px var(--taiga-gold-faded, rgba(245, 166, 35, 0.3));
}

.wp-social-main-toggle svg {
  transition: transform 0.3s ease;
}

.wp-custom-floating-socials:hover .wp-social-main-toggle svg {
  transform: scale(1.15); /* Turns the + into an x */
}

/* Inner individual social buttons */
.wp-social-float-btn {
  width: 48px; /* Slightly smaller than main button for visual hierarchy */
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--taiga-light, #F8F9FA) !important; 
  text-decoration: none !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.wp-social-float-btn:hover {
  transform: scale(1.1);
}

/* WhatsApp Official Green */
.wp-whatsapp-float {
  background-color: #25D366 !important; 
}

/* Instagram Official Gradient */
.wp-insta-float {
  background: #f09433 !important; 
  background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%) !important; 
}

/* Scale effect for SVG icons inside the buttons */
.wp-social-float-btn svg {
  fill: currentColor;
}/* End custom CSS */