.connect-section {
    display: flex;              
    flex-wrap: wrap;            
    align-items: center;        
    justify-content: center;    
    gap: 3rem;                  
    padding: 4rem 2rem;
    color: #E0E0E0;
  }
  
  
  
  .get-in-touch {
    position: relative;
    z-index: 1;                
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: #FFC331; 
    overflow: visible;         
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
  }
  
  
  .get-in-touch::before,
  .get-in-touch::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 4px solid #FFC331;  
    background-color: transparent;
    pointer-events: none;       
    z-index: 0;              
  }
  
 
  .get-in-touch::before {
    width: 140px;  
    height: 140px;
    border: 2px solid #FFC331;
  
  }
  
 
  .get-in-touch::after {
    width: 160px;
    height: 160px;
    border: 1px solid #FFC331;
  
  }
  
  .get-in-touch:hover {
    transform: scale(1.05);
  }
  
  
  
  .get-in-touch:hover {
    transform: scale(1.05);
  }
  
  

  .pulse-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: 120%;
    border-radius: 50%;
    background-color: rgba(255, 195, 49, 0.3);
    transform: translate(-50%, -50%) scale(0.7);
    opacity: 0;
    z-index: 1;
    animation: none;
    animation-fill-mode: forwards; 
  }
  .pulse-delay1 { animation-delay: 0.4s; }
  .pulse-delay2 { animation-delay: 0.8s; }
  .get-in-touch:hover .pulse-circle {
    animation: pulse 1.5s infinite ease-out;
  }
  @keyframes pulse {
    0%   { transform: translate(-50%, -50%) scale(0.7); opacity: 0.6; }
    70%  { transform: translate(-50%, -50%) scale(1.3); opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(1.3); opacity: 0; }
  }
  
 
  .connect-content {
    text-align: center;
  }
  
  .connect-content h2 {
    font-size: 2.5rem;
    margin-bottom: 1rem;
  }
  
  .connect-content p {
    font-size: 1.2rem;
    margin-bottom: 2rem;
  }
  

  .social-links ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin: 0;
    padding: 0;
  }
  .social-links li {
    list-style: none;
  }
  
  
    
  
    .social-links li a {
      width: 80px;
      height: 80px;
      background-color: #FFC331;
      
      display: flex;                
      justify-content: center;      
      align-items: center;       
      font-size: 35px;
      border-radius: 50%;
      position: relative;
      overflow: hidden;
      z-index: 1;
    }
    
    
    
    .social-links li a .icon {
      width: 40px;
      height: 40px;
      
      transition: 0.5s;    
      z-index: 100;
      
    }
    
    
    .social-links li a:hover .icon {
      color: #fff;
      transform: rotateY(360deg);
    }
    
   
    .social-links li a::before {
      content: "";
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      height: 100%;
      background: #f00; 
      transition: 0.5s;
      z-index: 0;
    }
    
    .social-links li a:hover::before {
      top: 0;
    }
    
   
    .social-links li:nth-child(1) a::before {
      background: #0077b5; /* LinkedIn */
    }
    
    .social-links li:nth-child(2) a::before {
      background: #EA4335; /* E-Mail */
    }








    .get-in-touch,
.get-in-touch * {
  -webkit-tap-highlight-color: transparent;
}

 
  

  .pulse-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: 120%;
    border-radius: 50%;
    background-color: rgba(255, 195, 49, 0.3); 
    transform: translate(-50%, -50%) scale(0.7);
    opacity: 0;
    z-index: 1;
  
   
    animation: none;
    animation-fill-mode: forwards; 
  }
  
 
  .pulse-delay1 {
    animation-delay: 0.4s;
  }
  .pulse-delay2 {
    animation-delay: 0.8s;
  }
  
 
  .get-in-touch:hover .pulse-circle {
    animation: pulse 1.5s infinite ease-out;
  }
  
  
  @keyframes pulseQuick {
    0%   { transform: translate(-50%, -50%) scale(0.8); }
    25%  { transform: translate(-50%, -50%) scale(0.9); }
    50%  { transform: translate(-50%, -50%) scale(1.0); }
    75%  { transform: translate(-50%, -50%) scale(0.9); }
    100% { transform: translate(-50%, -50%) scale(0.8); }
  }