/* Modal Styles */
        .req-modal { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.6); backdrop-filter: blur(4px); opacity: 0; transition: opacity 0.3s ease; }
        .req-modal.show { display: flex; align-items: center; justify-content: center; opacity: 1; }
        
        .req-modal-content { background-color: #fff; border-radius: 12px; padding: 40px; width: 100%; max-width: 700px; position: relative; box-shadow: 0 20px 50px rgba(0,0,0,0.15); transform: translateY(-30px); transition: transform 0.3s ease; margin: 20px; }
        .req-modal.show .req-modal-content { transform: translateY(0); }
        
        .req-close { color: #999; position: absolute; top: 20px; right: 25px; font-size: 32px; font-weight: bold; cursor: pointer; transition: color 0.2s; line-height: 1; }
        .req-close:hover, .req-close:focus { color: #111; text-decoration: none; }
        
        .req-title { font-size: 26px; color: #111; margin-bottom: 8px; font-weight: 800; }
        .req-subtitle { font-size: 14px; color: #666; margin-bottom: 30px; }
        
        .req-form { display: flex; flex-direction: column; gap: 20px; }
        .req-row { display: flex; gap: 20px; }
        .req-row .req-group { flex: 1; }
        
        .req-group { display: flex; flex-direction: column; gap: 8px; }
        .req-group label { font-size: 13px; font-weight: 600; color: #555; text-transform: uppercase; letter-spacing: 0.5px; }
        .req-asterisk { color: #6da247; font-weight: bold; font-size: 16px; line-height: 1; vertical-align: top; }
        
        .req-group input, .req-group textarea { padding: 12px 15px; border: 1px solid #ddd; border-radius: 6px; font-size: 14px; color: #333; outline: none; transition: border-color 0.2s, box-shadow 0.2s; font-family: inherit; }
        .req-group input::placeholder, .req-group textarea::placeholder { color: #aaa; }
        .req-group input:focus, .req-group textarea:focus { border-color: #1d670d; box-shadow: 0 0 0 3px rgba(29, 103, 13, 0.1); }
        
        .req-submit-btn { background: #1d670d; color: #fff; border: none; padding: 14px 25px; border-radius: 6px; font-size: 16px; font-weight: bold; cursor: pointer; transition: background 0.3s; margin-top: 10px; text-transform: uppercase; letter-spacing: 1px; }
        .req-submit-btn:hover { background: #144d08; }
        .req-submit-btn:disabled { background: #999; cursor: not-allowed; }
        
        @media(max-width: 600px) {
            .req-row { flex-direction: column; gap: 20px; }
            .req-modal-content { padding: 30px 20px; }
        }

        /* Floating Requirement Button Wrapper */
        .floating-req-wrapper {
            position: fixed;
            bottom: 30px;
            right: 30px;
            z-index: 999;
            display: flex;
            align-items: center;
            gap: 12px;
            cursor: pointer;
            animation: floating-bounce 2.5s infinite ease-in-out;
            user-select: none;
        }

        .floating-req-wrapper:hover {
            animation-play-state: paused;
        }

        @keyframes floating-bounce {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-12px);
            }
        }

        /* Floating Badge/Label */
        .floating-req-label {
            background-color: #1d670d;
            color: #fff;
            padding: 8px 16px;
            border-radius: 30px;
            font-size: 14px;
            font-weight: 600;
            white-space: nowrap;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
            opacity: 0;
            transform: translateX(20px);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            pointer-events: none;
        }

        .floating-req-wrapper:hover .floating-req-label {
            opacity: 1;
            transform: translateX(0);
        }

        /* Circle Button */
        .floating-req-circle {
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, #1d670d 0%, #6da247 100%);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 20px rgba(29, 103, 13, 0.4);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
        }

        /* Inner Pulsing Rings */
        .floating-req-circle::before,
        .floating-req-circle::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            background: inherit;
            z-index: -1;
            opacity: 0.6;
        }

        .floating-req-circle::before {
            animation: pulse-ring 2s infinite cubic-bezier(0.4, 0, 0.2, 1);
        }

        .floating-req-circle::after {
            animation: pulse-ring 2s infinite cubic-bezier(0.4, 0, 0.2, 1) 0.5s;
        }

        @keyframes pulse-ring {
            0% {
                transform: scale(1);
                opacity: 0.6;
            }
            100% {
                transform: scale(1.6);
                opacity: 0;
            }
        }

        .floating-req-circle:hover {
            transform: scale(1.1);
            box-shadow: 0 6px 25px rgba(29, 103, 13, 0.6);
        }

        .floating-req-circle i {
            color: #fff;
            font-size: 24px;
        }

        /* Responsive Styles for Floating Button */
        @media (max-width: 768px) {
            .floating-req-wrapper {
                bottom: 20px;
                right: 20px;
                gap: 0;
            }
            .floating-req-label {
                display: none; /* Hide label on mobile to save screen space */
            }
            .floating-req-circle {
                width: 50px;
                height: 50px;
            }
            .floating-req-circle i {
                font-size: 20px;
            }
        }
