.elementor-51 .elementor-element.elementor-element-78a1e2e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-10%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-b6a67e2 *//* =========================
   BASE
========================= */

body {
  background-color: #fafafa !important;
  color: #1a1a1a !important;
  overflow-x: hidden !important;
  font-family: 'Manrope', sans-serif !important;
}

/* =========================
   HERO BACKGROUND
========================= */

.hero-gradient {
  background: radial-gradient(circle at top right, rgba(19, 127, 236, 0.05), transparent) !important;
}

/* =========================
   FLOATING ANIMATION
========================= */

.floating-instrument {
  animation: float 6s ease-in-out infinite !important;
}

@keyframes float {

  0%,
  100% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-20px);
  }

}

/* =========================
   SERVICE CARD HOVER
========================= */

.service-card:hover img {
  transform: scale(1.05) !important;
}

/* =========================
   CUSTOM TRANSITION
========================= */

.transition-custom {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}


/* ======================================================
   CSS CONTACTO
====================================================== */

body {
  font-family: 'Manrope', sans-serif !important;
}


/* =========================
   FLOAT ANIMATION CONTACT
========================= */

@keyframes float {

  0% {
    transform: translateY(0px) rotate(0deg);
  }

  50% {
    transform: translateY(-20px) rotate(2deg);
  }

  100% {
    transform: translateY(0px) rotate(0deg);
  }

}

.animate-float {
  animation: float 6s ease-in-out infinite !important;
}


/* =========================
   COLLAGE BACKGROUND
========================= */

.bg-collage-pattern {
  background-image: radial-gradient(#e5e7eb 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
}


/* =========================
   GLASS EFFECT
========================= */

.glass-effect {
  background: rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  border-radius: 8px !important;
}/* End custom CSS */