/* Donate Button Styles */
        .donate-button-container {
            display: flex;
            justify-content: center;
            
            margin: 5rem auto;
            position: relative;
            height: auto;
            width: 100%;
            max-width: 600px;
            
        }

  .donate-button-container p {
        text-align: center;

        }

        @media (max-width: 600px) {
    .donate-button-container {
        padding: 0 1rem;
        margin: 5rem auto;
    }
    
    .donate-button-container p,
    .donate-button-container a,
    .donate-button-container button {
        word-wrap: break-word;
        overflow-wrap: break-word;
        white-space: normal;
        max-width: 100%;
    }
}

        @media (max-width: 768px) {
        .donate-button-container {
            -moz-flex-wrap: wrap;
            -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
            }

        .donate-button {
            position: relative;
            padding: 20px 50px;
            font-size: 1.5em;
            font-weight: bold;
            color: white;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border: none;
            border-radius: 50px;
            cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
            z-index: 10;
            overflow: visible;
            height: auto;
        }

        .donate-button:hover {
            transform: scale(1.05);
            box-shadow: 0 8px 30px rgba(102, 126, 234, 0.6);
        }

        .donate-button:active {
            transform: scale(0.98);
        }

        #particle-container {
            position: relative;
            overflow: hidden;
            width: 100%;
            height: 120%; 
        }

        #particles-js {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index= -1
            overflow: hidden;
            background: radial-gradient(ellipse at bottom, #1B2735 0%, #090A0F 100%);
        }

        .button-container {
            position: relative;
            width: 100%;
            display: flex;
            justify-content: center;
        }

        .space-button {
            padding: 20px 50px; 
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            font-weight: bold;
            color: #ffffff;
            background: rgba(15, 20, 35, 0.8);
            border: 3px solid rgba(100, 150, 255, 0.8);
            border-radius: 50px;
            cursor: pointer;    
            text-transform: uppercase;
            letter-spacing: 2px;
            box-shadow: 
                0 0 20px rgba(100, 150, 255, 0.5),
                inset 0 0 20px rgba(100, 150, 255, 0.2);
            transition: all 0.3s ease;
            font-family: 'Arial', sans-serif;
            width: auto;
            max-width: 100%;
            white-space: nowrap;
        }

        .space-button:hover {
            border-color: rgba(150, 200, 255, 1);
            box-shadow: 
                0 0 40px rgba(150, 200, 255, 0.8),
                inset 0 0 30px rgba(150, 200, 255, 0.3);
            transform: scale(1.05);
        }

        .space-button:active {
            transform: scale(0.95);
        }

        .burst-particle {
            position: absolute;
            width: 4px;
            height: 4px;
            background: white;
            border-radius: 50%;
            pointer-events: none;
            opacity: 0.8;
            animation: burst 1s forwards;
        }