.gradient-text {
      background: linear-gradient(90deg, #00b4cc, #00cfc5);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    .hover-scale {
      transition: transform 0.3s ease;
    }

    .hover-scale:hover {
      transform: scale(1.05);
    }

    /* whatsapp */
    .whatsapp-btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
  }
  .whatsapp-btn img {
    width: 75px;
    height: 75px;
    border-radius: 100%;
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
    transition: transform 0.2s;
  }
  .whatsapp-btn img:hover {
    transform: scale(1.1);
  }


/* TESTIMONIOS */
 .testimonial-slider {
            scroll-snap-type: x mandatory;
            scrollbar-width: none;
            -ms-overflow-style: none;
            scroll-behavior: smooth;
        }
        .testimonial-slider::-webkit-scrollbar {
            display: none;
        }
        .testimonial-card {
            scroll-snap-align: start;
            flex: none;
        }







          .gradient-bg {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }
        .hero-pattern {
            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
        }
        .floating-animation {
            animation: float 3s ease-in-out infinite;
        }
        @keyframes float {
            0%, 100% { transform: translateY(0px); }
            50% { transform: translateY(-10px); }
        }
        .pulse-glow {
            box-shadow: 0 0 20px rgba(255, 107, 53, 0.3);
            animation: pulse-glow 2s ease-in-out infinite;
        }
        @keyframes pulse-glow {
            0%, 100% { box-shadow: 0 0 20px rgba(255, 107, 53, 0.3); }
            50% { box-shadow: 0 0 30px rgba(255, 107, 53, 0.5); }
        }



        /* para la galeria de fotos de instalaciones */
                .fade-in {
            animation: fadeIn 0.3s ease-in-out;
        }
        
        .zoom-in {
            animation: zoomIn 0.3s ease-in-out;
        }
        
        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }
        
        @keyframes zoomIn {
            from { transform: scale(0.95); opacity: 0; }
            to { transform: scale(1); opacity: 1; }
        }
        
        .gallery-img {
            transition: transform 0.3s ease;
        }
        
        .gallery-img:hover {
            transform: scale(1.03);
        }