<!-- 
Theme: Filifly
Author: Md Mim Akhtar
Author Website: https://www.imimofficial.com
License: All Rights Reserved
-->

<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Filifly - #1 Social File Sharing Solution</title>
    
        <!-- Meta Description for SEO -->
        <meta name="description" content="Filifly is a fast, secure, and easy-to-use platform for sharing files. Share your files via unique codes or messaging platforms like WhatsApp, Telegram, and Messenger with ease.">
    
        <!-- Meta Keywords for SEO -->
        <meta name="keywords" content="filifly, file sharing, secure file transfer, file sharing platform, free file sharing, WhatsApp file sharing, Telegram file transfer, Messenger file sharing">
    
        <!-- Author Meta Tag -->
        <meta name="author" content="Filifly">
    
        <!-- Robots Meta Tag (for search engine indexing) -->
        <meta name="robots" content="index, follow">
    
        <!-- Open Graph Tags for Social Media Sharing -->
        <meta property="og:title" content="Filifly - #1 Social File Sharing Solution">
        <meta property="og:description" content="Filifly allows fast, secure, and easy file sharing with unique codes and instant sharing through social platforms.">
        <meta property="og:image" content="URL-to-image.jpg"> <!-- Link to an image to display when shared on social media -->
        <meta property="og:url" content="https://www.filifly.com">
        <meta property="og:type" content="website">
        
        <!-- Twitter Card Tags -->
        <meta name="twitter:card" content="summary_large_image">
        <meta name="twitter:title" content="Filifly - #1 Social File Sharing Solution">
        <meta name="twitter:description" content="Filifly provides a fast and secure way to share files with your friends and teams via unique codes and instant notifications.">
        <meta name="twitter:image" content="URL-to-image.jpg">
        <meta name="twitter:site" content="@filifly">

        <!-- Link to Stylesheet -->
        <link rel="stylesheet" href="assets/css/styles.css">

        <!-- Theme Color -->
        <meta name="theme-color" content="#007bff">

        <!-- Standard Favicon -->
        <link rel="icon" href="assets/img/favicon.ico" type="image/x-icon">
        
        <!-- PNG Favicons -->
        <link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicon-32x32.png">
        <link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicon-16x16.png">
        
        <!-- Apple Touch Icons -->
        <link rel="apple-touch-icon" sizes="180x180" href="assets/img/apple-touch-icon.png">
        <link rel="apple-touch-icon" sizes="120x120" href="assets/img/apple-touch-icon-120x120.png">
        
        <!-- Manifest File -->
        <link rel="manifest" href="assets/config/manifest.json">
        
        <!-- Windows Pinned Tiles -->
        <meta name="msapplication-TileColor" content="#007bff">
        <meta name="msapplication-TileImage" content="https://www.filifly.com/assets/img/mstile-150x150.png">
        <meta name="msapplication-config" content="https://www.filifly.com/config/browserconfig.xml">
    
        <!-- Font Awesome CDN for icons -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    
        <!-- JQuery CDN -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

        <!-- JSZIp -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>

        <!-- File Icons -->
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/file-icon-vectors@1.0.0/dist/file-icon-vivid.min.css" />
    
        <!-- Structured Data for SEO (JSON-LD) for Rich Snippets -->
        <script type="application/ld+json">
        {
            "@context": "https://schema.org",
            "@type": "SoftwareApplication",
            "name": "Filifly",
            "url": "https://www.filifly.com",
            "description": "Filifly is a fast, secure, and easy-to-use platform for sharing files via unique codes and messaging platforms like WhatsApp, Telegram, Messenger, etc. It offers end-to-end encryption, social media integration, and no login file sharing.",
            "publisher": {
            "@type": "Organization",
            "name": "Filifly",
            "logo": "https://www.filifly.com/assets/img/logo.png",
            "url": "https://www.filifly.com",
            "sameAs": [
            "https://www.facebook.com/filifly",
            "https://www.twitter.com/filifly",
            "https://www.linkedin.com/company/filifly"
            ]
            },
            "mainEntityOfPage": {
            "@type": "WebPage",
            "@id": "https://www.filifly.com"
            },
            "contactPoint": {
            "@type": "ContactPoint",
            "contactType": "Customer Service",
            "email": "social@filifly.com",
            "url": "https://www.filifly.com/contact"
            },
            "sameAs": [
            "https://www.facebook.com/filifly",
            "https://www.twitter.com/filifly",
            "https://www.linkedin.com/company/filifly"
            ]
        }
        </script>
    
        <!-- Open Graph Image for better social media sharing -->
        <meta property="og:image" content="https://www.filifly.com/assets/img/social-share.jpg">
    
        <!-- Mobile-Friendly Meta Tag -->
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
        <!-- Canonical Link (to avoid duplicate content issues) -->
        <link rel="canonical" href="https://www.filifly.com">
    
        <!-- Structured Data for FAQ (to show in Google Search Results) -->
        <script type="application/ld+json">
        {
          "@context": "https://schema.org",
          "@type": "FAQPage",
          "mainEntity": [{
            "@type": "Question",
            "name": "What file types can I share using Filifly?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Filifly supports a wide range of file types, including documents, images, videos, and more. You can upload any file format without any issues."
            }
          },{
            "@type": "Question",
            "name": "Is there a file size limit for uploads?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Yes, each file can be up to 20 MB in size. If you need to share larger files, consider splitting them into smaller parts."
            }
          },{
            "@type": "Question",
            "name": "Do I need to create an account* to use Filifly?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "No, you can share files without creating an account*! However, signing up allows you to access additional features such as file tracking and history."
            }
          },{
            "@type": "Question",
            "name": "How is my data protected when using Filifly?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Your files are protected with end-to-end encryption. The file(s) can only be read using the file key you receive after uploading. Even we can't read your files without the key. So, don't worry!"
            }
          },{
            "@type": "Question",
            "name": "Can I share files via social media?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Absolutely! Filifly allows you to share files directly through social platforms like WhatsApp, Messenger, and Telegram."
            }
          },{
            "@type": "Question",
            "name": "Do Filifly store the file key?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "No, we don't store the plain file key but a generated key i.e. to use it to recognize you when you try to retrieve the file."
            }
          },{
            "@type": "Question",
            "name": "How do I retrieve files that I've shared?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Once you share a file, you'll receive a unique key, and a link too that allows you and your recipients to access the file. You can also track your shared files in your account if you have one."
            }
          },{
            "@type": "Question",
            "name": "What should I do if I forget my file key?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "If you forget the file key, unfortunately, there’s no way to retrieve it. We strongly recommend to copy the file key after uploading. That's the only time you see it."
            }
          },{
            "@type": "Question",
            "name": "Is Filifly available on mobile devices?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Yes, you can access Filifly from any device, including smartphones and tablets, making it easy to share files on the go."
            }
          },{
            "@type": "Question",
            "name": "Can I set an expiration date for shared files?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Yes, FiliFly allows you to set expiration dates for file links with an account*, after which the files will be deleted forever."
            }
          },{
            "@type": "Question",
            "name": "Does Filifly support file version control?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Currently, FiliFly does not support version control without an account*. However, you can upload new versions and share them as separate files if needed."
            }
          },{
            "@type": "Question",
            "name": "Can I customize sharing permissions on Filifly?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Yes, FiliFly allows you to control permissions with an account*, letting you choose who can view, edit, or download the files you share."
            }
          },{
            "@type": "Question",
            "name": "Is there a way to track file downloads?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "If you create an account*, you can track downloads for each shared file and see when recipients access your files."
            }
          },{
            "@type": "Question",
            "name": "How long are my files stored on Filifly?",
            "acceptedAnswer": {
              "@type": "Answer",
              "text": "Files are stored indefinitely as long as you have an active account*, or until you delete them. For free users (without an account*), inactive files may be removed after 24-hours of time. You can also choose to set expiry time while uploading."
            }
          }]
        }
        </script>
    
        <!-- Additional Performance Optimization (Preload) -->
        <link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" as="style">
    
</head>    
<body>
    <!-- Full-Screen Welcome Screen with Background Video -->
    <div class="welcome-screen" id="welcomeScreen">
        <button class="close-popup-buttonn" onclick="hideInitializer()">✕</button>
        <video autoplay muted loop playsinline class="background-video">
            <source src="assets/mp4/filifly-bg.mp4" type="video/mp4">
            Your browser does not support the video tag.
        </video>
        <div class="video-overlay"></div> <!-- Overlay for styling and readability -->
        
        <!-- Main Content over Video -->
        <div class="welcome-content">
            <div class="w-logo-container">
                <img src="assets/img/logo.png" alt="Filifly Logo" class="w-logo">
            </div>
            <style>
                .w-logo-container {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;
                    margin-bottom: 20px;
                }
                .w-logo {
                    width: 100px;
                    height: 100px;
                    margin-bottom: 10px;
                }
                .w-welcome-text {
                    font-size: 1.5rem;
                    font-weight: 500;
                    text-align: center;
                    color: var(--dark-color);
                }

            </style>
            <div class="text-carousel">
                <h1 class="feature-text"></h1> <!-- Carousel Text -->
            </div>
            <div class="welcome-buttons">
                <button class="action-button" id="sendButton" onclick="openUploadTab()">Send Files</button>
                <button class="action-button" id="receiveButton" onclick="openDownloadTab()">Receive Files</button>
            </div>
            <div class="welcome-buttons">
                <button class="action-buttonn" id="receiveButton" onclick="openLiveSharing()" disabled>Wi-Fi Sharing <br><i>Coming soon</i></button>
            </div>
            <div class="footer-message">
                <p class="tc-message">
                    By visiting this site, you agree to Filifly's <a href="w/privacy-policy/" target="_blank">Privacy Policy</a> and <a href="w/terms-of-service/" target="_blank">Terms of Service</a>.
                </p>
                <p class="author">Made with ❤️ at <a href="#">Earth</a></p>
            </div>
        </div>
    </div>

    <!-- Navbar -->
    <nav class="navbar">
        <div class="navbar-container">
        <!-- Logo -->
        <a href="https://www.filifly.com" class="logo"><img src="assets/img/logo.png" alt="Filifly Logo"><span>Filifly</span></a>
        
        <!-- Navigation Links -->
        <ul class="nav-links">
            <li><a href="#" onclick="scrollToTop()">Send | Receive</a></li>
            <li><a href="#features">Features</a></li>
            <li><a href="#how-it-works">How It Works</a></li>
            <li><a href="#faqs">FAQs</a></li>
            <li><a href="https://www.filifly.com/live" class="active">Live Sharing <i class="coming-soon">Coming Soon</i></a></li>
            <!-- <li class="dark-mode-toggle" id="darkModeToggle"><a href="#">Light</a></li> -->
        </ul>

        <!-- Mobile Menu Icon -->
        <button class="menu-toggle">
            ☰
        </button>
        </div>
    </nav>
    <div class="video-background">
        <video autoplay muted loop id="background-video">
            <source src="assets/mp4/filifly-bg.mp4" type="video/mp4">
            Your browser does not support the video tag.
        </video>
        <div class="video-overlay"></div> <!-- Overlay layer -->
    </div>
<div class="block-main" id="upload">
    <section class="tabs-section">
        <div class="headings">
            <h2>Get File(s) Anywhere!</h2>
        </div>
        <div class="tabs-container">
          <!-- Tabs -->
          <button class="tab active" data-tab="send">Send</button>
          <button class="tab" data-tab="receive">Receive</button>
        </div>
      
        <!-- Tab Content -->
        <div class="tab-content">
          <div class="tab-pane active" id="send">
            <!-- File Upload Area -->
            <div class="file-upload-area">
                <input type="file" id="file-input" multiple hidden>
                <label for="file-input" class="upload-box" id="drop-zone">
                <p>Drag & Drop files here or <span>Browse</span></p>
                <i id="upload-icon" class="fa-solid fa-upload"></i>
                <p class="file-count">No files selected</p>
                </label>
            </div>

            <!-- Total Size and Clear All -->
            <div class="file-actions">
                <div>
                    <span class="file-status upload-file-status">Status</span>&nbsp;|
                    <span class="total-size total-upload-size">Total Size: 0 KB</span>
                </div>
                <div>
                    <span><button class="clear-all">Clear</button></span>
                </div>
            </div>

            <!-- File Preview Area -->
            <div class="file-preview-container"></div>

            <!-- Status Message -->
            <div class="status-message">
                <p class="error-message upload-error-message"></p>
                <p class="success-message upload-success-message"></p>
            </div>

            <!-- Upload Button -->
            <button class="upload-button button" id="upload-button" disabled>Upload</button>
          </div>
          <div class="tab-pane" id="receive">
            <!-- Unique Input Area for Code Entry -->
            <div class="code-input-area">
                <input type="text" maxlength="1" class="digit-input" required>
                <input type="text" maxlength="1" class="digit-input" required>
                <input type="text" maxlength="1" class="digit-input" required>
                <input type="text" maxlength="1" class="digit-input" required>
                <input type="text" maxlength="1" class="digit-input" required>
                <input type="text" maxlength="1" class="digit-input" required>
            </div>
            <p>Enter the 6-digit file key to get the file(s).</p>
            <!-- Status Message -->
            <div class="status-message">
                <p class="error-message receive-error-message"></p>
                <p class="success-message receive-success-message"></p>
            </div>
            <button id="receive-button" class="receive-button button" disabled>Receive Files</button>
            <div class="file-actions">
                <div>
                    <span class="file-status receive-file-status">Status:</span>
                    <span class="file-status receive-file-count"></span>&nbsp;|
                    <span class="total-size total-receive-size">Total Size: 0 KB</span>
                </div>
                <div>
                    <span><button id="clear-all-received-button" class="clear-all">Clear</button></span>
                </div>
                
            </div>
            <!-- File Preview Area -->
            <div class="receive-file-preview-container">
            </div>
            <div class="social-send-container">
                <div class="question">
                    <p>Would you like to send it anywhere else?</p>
                </div>
                <div class="social-share-options-row">
                    <div class="social-option2" data-platform="email">
                        <div class="social-icon"><img alt="Email Icon" src="assets/img/social-icons/email.png"></div>
                    </div>
                    <!-- <div class="social-option2" data-platform="whatsapp">
                        <div class="social-icon"><img alt="WhatsApp Icon" src="assets/img/social-icons/whatsapp.png"></div>
                    </div>
                    <div class="social-option2" data-platform="messenger">
                        <div class="social-icon"><img alt="Messenger Icon" src="assets/img/social-icons/messenger.png"></div>
                    </div> -->
                    <div class="social-option2" data-platform="telegram">
                        <div class="social-icon"><img alt="Telegram Icon" src="assets/img/social-icons/telegram.png"></div>
                    </div>
                    <!-- <div class="social-option2" data-platform="instagram">
                        <div class="social-icon"><img alt="Instagram Icon" src="assets/img/social-icons/instagram.png"></div>
                    </div> -->
                    <div class="social-option2" data-platform="viber">
                        <div class="social-icon"><img alt="Viber Icon" src="assets/img/social-icons/viber.png"></div>
                    </div>
                    <div class="social-option2" data-platform="line">
                        <div class="social-icon"><img alt="LINE Icon" src="assets/img/social-icons/line.png"></div>
                    </div>
                </div>
                <!-- Dynamic input fields will appear here -->
                <div id="platformInputs2" class="platform-inputs"></div>
                <button class="button send-file" id="social-send-button2" disabled>Send File</button>
            </div>
            <button id="download-all-button" class="button download-all-button" disabled>Download All Files</button>
        </div> 
        <div class="message">
            <p class="tc-message">By visiting this site, you agree to Filifly's <a href="w/privacy-policy/" target="_blank">Privacy Policy</a> and <a href="w/terms-of-service/" target="_blank">Terms of Service</a>.</p>
            <p class="countings"><strong>Trusted by</strong> - <strong title="Uploads">🚀&nbsp;<span id="upload-counts">889</span></strong>&nbsp;| <strong title="Downloads">📥&nbsp;<span class="download-counts">1895</span></strong></p>             
        </div>
        <div class="social-icons-main">
            <button class="social-button" data-platform="facebook" title="Share on Facebook">
                <i class="fab fa-facebook-f"></i>
            </button>
            <button class="social-button" data-platform="twitter" title="Share on Twitter">
                <i class="fab fa-twitter"></i>
            </button>
            <button class="social-button" data-platform="linkedin" title="Share on LinkedIn">
                <i class="fab fa-linkedin-in"></i>
            </button>
            <button class="social-button" data-platform="whatsapp" title="Share on WhatsApp">
                <i class="fab fa-whatsapp"></i>
            </button>
            <button class="social-button" data-platform="telegram" title="Share on Telegram">
                <i class="fab fa-telegram-plane"></i>
            </button>
            <button class="social-button" id="nativeShareButton" title="Native Share">
                <i class="fas fa-share-alt"></i>
            </button>
        </div>
        </div>      
    </section>
</div>

<div class="block-white">
    <section class="how-it-works" id="how-it-works">
        <h2>How Filifly Works</h2>
        <p class="features-intro">Filifly simplifies file sharing with security, ease, and speed.</p>
        <div class="process-container">
            <div class="process-step">
                <div class="step-icon"><i class="fas fa-file-upload"></i></div>
                <h3>Choose Files</h3>
                <p>Select files from your device to upload. You can easily drag files or browse your computer.</p>
            </div>
            <div class="process-step">
                <div class="step-icon"><i class="fas fa-key"></i></div>
                <h3>Get Code</h3>
                <p>After uploading, you'll receive a unique code that represents your files securely.</p>
            </div>
            <div class="process-step">
                <div class="step-icon"><i class="fas fa-share-alt"></i></div>
                <h3>Share Code</h3>
                <p>Share the unique code with anyone you want, or save it for later use and access.</p>
            </div>
            <div class="process-step">
                <div class="step-icon"><i class="fas fa-download"></i></div>
                <h3>Receive Files</h3>
                <p>If you have a code, enter it to quickly retrieve the associated files you need.</p>
            </div>
        </div>
        <!-- Video Section -->
        <div class="embed-video-section">
            <h2>Watch Our Introductory Video</h2>
            <!-- Responsive Video Container -->
            <div class="embed-video-container">
            <iframe 
                src="https://www.youtube.com/embed/Cj1AeuxSxT8" 
                title="YouTube video player" 
                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
                allowfullscreen>
            </iframe>
            </div>
        </div>
    </section>
</div>
    
<div class="block-1">
    <section class="features" id="features">
        <h2>Features of Filifly</h2>
        <p class="features-intro">Filifly simplifies file sharing with security, ease, and speed. Discover what makes us the best choice for all your file transfer needs.</p>
        <div class="features-container">
            
            <div class="feature">
                <div class="feature-icon"><i class="fa-solid fa-money-bill"></i></div>
                <h3>Free of Cost</h3>
                <p>Filifly offers you a free-forever plan with all the base features. Its free forever for everyone!</p>
            </div>

            <div class="feature">
                <div class="feature-icon"><i class="fas fa-lock"></i></div>
                <h3>End-To-End Encryption</h3>
                <p>All your files are encrypted from sender to receiver, keeping your data safe and private.</p>
            </div>
        
            <div class="feature">
                <div class="feature-icon"><i class="fas fa-share-alt"></i></div>
                <h3>Social File Sharing</h3>
                <p>Share files easily on social platforms i.e. WhatsApp, Messenger, Telegram, etc. directly from our service.</p>
            </div>
        
            <div class="feature">
                <div class="feature-icon"><i class="fas fa-user-friends"></i></div>
                <h3>No Login File Sharing</h3>
                <p>Send files without the hassle of creating an account*, ensuring a quick and easy transfer process.</p>
            </div>
            
            <div class="feature">
                <div class="feature-icon"><i class="fas fa-file-alt"></i></div>
                <h3>Supports All File Types</h3>
                <p>Upload and share various file types including documents, images, videos, and more.</p>
            </div>
            
            <div class="feature">
                <div class="feature-icon"><i class="fas fa-lock"></i></div>
                <h3>Password Protection</h3>
                <p>Set passwords for added protection, ensuring only authorized users can access your files.</p>
            </div>
            
            <div class="feature">
                <div class="feature-icon"><i class="fas fa-globe"></i></div>
                <h3>Access from Anywhere</h3>
                <p>Filifly is accessible on any device, so you can share and receive files anytime, anywhere.</p>
            </div>
            
            <div class="feature">
                <div class="feature-icon"><i class="fas fa-sync-alt"></i></div>
                <h3>Fast Transfers</h3>
                <p>Enjoy fast, reliable file transfers without the hassle of waiting for uploads and downloads.</p>
            </div>
        </div>
    </section>    
</div>

<!-- Filifly vs. Other Platforms Section -->
<div class="block-white">
    <section class="comparison-section">
        <h2>Filifly vs Other Platforms</h2>
        <p class="comparison-intro">See how Filifly compares to traditional file-sharing options.</p>
        <div class="comparison-table">
            <table>
                <thead>
                    <tr>
                        <th>Feature</th>
                        <th>Filifly</th>
                        <th>Traditional Platforms</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>No Account Needed</td>
                        <td class="highlight">✔ Yes</td>
                        <td>No</td>
                    </tr>
                    <tr>
                        <td>Anonymous Sharing</td>
                        <td class="highlight">✔ Yes</td>
                        <td>No</td>
                    </tr>
                    <tr>
                        <td>Social Media Integration</td>
                        <td class="highlight">✔ Yes</td>
                        <td>Limited</td>
                    </tr>
                    <tr>
                        <td>File Expiration (24-hour limit)</td>
                        <td class="highlight">✔ Yes</td>
                        <td>No or Requires Account</td>
                    </tr>
                    <tr>
                        <td>End-To-End Encryption</td>
                        <td class="highlight">✔ Yes</td>
                        <td>Varies</td>
                    </tr>
                    <tr>
                        <td>File Size Limit</td>
                        <td>20 MB</td>
                        <td>Up to 50 GB (with paid plans)</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </section>
</div>

<div class="block-1">
    <section class="testimonials">
        <h2>What Users Are Saying</h2>
        <p class="testimonials-intro">Discover why users love Filifly for secure and simple file sharing.</p>
        <div class="testimonial-cards">
            <div class="testimonial-card">
                <p class="testimonial-text">"Filifly makes sharing files so easy! No accounts, no hassle—just upload and share instantly."</p>
                <p class="testimonial-author">— Sarah J., Graphic Designer</p>
            </div>
            <div class="testimonial-card">
                <p class="testimonial-text">"The anonymous sharing feature is a game-changer for quick, private file transfers."</p>
                <p class="testimonial-author">— Mike R., Marketing Specialist</p>
            </div>
            <div class="testimonial-card">
                <p class="testimonial-text">"I love the integration with messaging apps. It’s perfect for sharing files with clients on WhatsApp."</p>
                <p class="testimonial-author">— Rachel P., Freelance Developer</p>
            </div>
            <div class="testimonial-card">
                <p class="testimonial-text">"I love the integration with messaging apps. It’s perfect for sharing files with clients on WhatsApp."</p>
                <p class="testimonial-author">— Rachel P., Freelance Developer</p>
            </div>
        </div>
        <!-- Post your review -->
        <div class="post-review empty-space-40px">
            <h3>Share Your Experience</h3>
            <p class="empty-space-up-down-15px">Have you used Filifly for file sharing? Share your thoughts and help others discover the benefits of our platform.</p>
            <textarea class="reviewText" id="reviewText" placeholder="Write your thoughts here..." rows="6" cols="50"></textarea>
            <p class="guide" id="reviewGuideMessage">You must write <i id="characterCount">156</i> characters more.</p>
            <input type="text" id="reviewName" placeholder="Your Name" class="reviewName">
            <p class="error" id="nameError"></p>
            <input type="email" id="reviewEmail" placeholder="Your Email" class="reviewEmail">
            <p class="error" id="emailError"></p>
            <div class="checkbox-container">
                <input type="checkbox" id="reviewAnon" class="reviewAnon"> <label for="reviewAnon">Do you want your review to be posted publicly?</label>
            </div>
            <div class="checkbox-container">
                <input type="checkbox" id="reviewSubscribe" class="reviewAnon" checked> <label for="reviewSubscribe">Subscribe to our occassional newsletter</label>
            </div>
            <p class="error" id="reviewError"></p>
            <button class="button" id="postReviewButton" disabled>Post a Review</button>
        </div>
    </section>
</div>

<div class="block-white">
    <section class="faq" id="faqs">
        <h2>Frequently Asked Questions (FAQs)</h2>
        <p class="faq-intro">Here are some of the most common questions we receive about Filifly. If you have any other questions, feel free to contact us!</p>
        
        <div class="faq-container">

            <div class="faq-item">
                <div class="faq-question">
                    <h3>1. What file types can I share using Filifly?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Filifly supports a wide range of file types, including documents, images, videos, and more. You can upload any file format without any issues.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>2. Is there a file size limit for uploads?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Yes, each file can be up to <strong></strong>20 MB</strong> in size. If you need to share larger files, consider splitting them into smaller parts or upgrading to Filifly Pro.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>3. Do I need to create an account to use Filifly?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">No, you can share files without creating an account*! However, signing up allows you to access additional features such as large file transfer, file tracking and history.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>4. How is my data protected when using Filifly?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Your files are protected with end-to-end encryption. The file(s) can only be read using the file key you receive after uploading. Even we can't read your files without the key. So, don't worry!</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>5. Can I share files via social media?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Absolutely! Filifly allows you to share files directly through social platforms like WhatsApp, Messenger, and Telegram.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>6. Do Filifly store the file key?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">No, we don't store the plain file key but a generated key i.e. to use it to recognize you when you try to retrieve the file.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>6. How do I retrieve files that I've shared?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Once you share a file, you'll receive a unique key, and a link too that allows you and your recipients to access the file. You can also track your shared files in your account if you have one.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>7. What should I do if I forget my file key?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">If you forget the file key, unfortunately, there’s no way to retrieve it. We strongly recommend to copy the file key after uploading. That's the only time you see it.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>8. Is Filifly available on mobile devices?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Yes, you can access Filifly from any device, including smartphones and tablets, making it easy to share files on the go.</p>
            </div>

            <div class="faq-item">
                <div class="faq-question">
                    <h3>9. Can I set an expiration date for shared files?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Yes, FiliFly allows you to set expiration dates for file links with an account*, after which the files will be deleted forever.</p>
            </div>
            
            <div class="faq-item">
                <div class="faq-question">
                    <h3>10. Does Filifly support file version control?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Yes, FiliFly does support version control with an account*. However, without an account you can upload new versions and share them as separate files if needed.</p>
            </div>
            
            <div class="faq-item">
                <div class="faq-question">
                    <h3>11. Can I customize sharing permissions on Filifly?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Yes, FiliFly allows you to control permissions with an account*, letting you choose who can view, edit, or download the files you share.</p>
            </div>
            
            <div class="faq-item">
                <div class="faq-question">
                    <h3>12. Is there a way to track file downloads?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Yes with an account*, you can track downloads for each shared file and see when recipients access your files.</p>
            </div>
            
            <div class="faq-item">
                <div class="faq-question">
                    <h3>13. How long are my files stored on Filifly?</h3>
                    <i class="fas fa-chevron-down"></i>
                </div>
                <p class="faq-answer">Files are stored indefinitely as long as you have an active account*, or until you delete them. For free users, inactive files may be removed after 24-hours of time. You can also choose to set expiry time while uploading.</p>
            </div>
            <p class="faq-note">* Account refers to a registered user account on Filifly. Account features are yet to be live. Check <a target="_blank" href="w/update-logs/#live">update logs</a> to know more.</p>
        </div>
    </section>
</div>

<div class="block-primary-color">
    <section class="cta-section">
        <div class="cta-banner">
            <h2>Start Sharing Files for Free!</h2>
            <p>Experience fast, secure, and easy file sharing with Filifly – no fees, no fuss!</p>
            <button type="button" id="get-started-btn" class="cta-button">Get Started</button>
            <button type="button" id="contact-us-btn" class="cta-button">Contact Us</button>
        </div>
    </section>
</div>

    <!-- Footer -->
    <footer class="footer">
        <div class="footer-container">
            <!-- About Us -->
            <div class="footer-column">
                <h4>About Filifly</h4>
                <p>Filifly simplifies file sharing, allowing you to quickly and safely transfer files without the need for logins or account setups. Whether you’re sharing important documents, photos, or videos, Filifly ensures a smooth experience for users of all tech levels.</p>
            </div>
        
            <!-- Quick Links -->
            <div class="footer-column">
                <h4>Quick Links</h4>
                <ul>
                <li><a href="w/about/">About</a></li>
                <li><a href="w/founder/">Founders</a></li>
                <li><a href="w/fund-filifly/">Fund Filifly</a></li>
                <li><a href="w/privacy-policy/">Privacy Policy</a></li>
                <li><a href="w/terms-of-service/">Terms of Service</a></li>
                </ul>
            </div>
        
            <!-- Resources -->
            <div class="footer-column">
                <h4>Resources</h4>
                <ul>
                <li><a href="w/blogs/">Blogs</a></li>
                <li><a href="w/guides/">Guides</a></li>
                <li><a href="w/feedback/">Feedback</a></li>
                <li><a href="w/update-logs/">Update Logs</a></li>
                </ul>
            </div>
        
            <!-- Contact Us -->
            <div class="footer-column">
                <h4>Contact Us</h4>
                <p><strong>Email:</strong> social@filifly.com</p><br>
                <div class="social-icons">
                    <a target="_blank" href="https://www.facebook.com/FiliflyX/" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
                    <a target="_blank" href="https://x.com/FiliflyX/" aria-label="Twitter"><i class="fab fa-twitter"></i></a>
                    <a target="_blank" href="https://www.instagram.com/fili.fly/" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
                    <a target="_blank" href="https://www.linkedin.com/company/filifly/" aria-label="LinkedIn"><i class="fab fa-linkedin-in"></i></a>
                </div>
            </div>
        </div>
        <div class="footer-bottom">
            <p>Filifly @ 2022 - <span id="currentYear"></span> | All Rights Reserved</p>
        </div>
    </footer>

    <!-- Drag Overlay -->
    <div class="drag-overlay" id="drag-overlay">
        <div class="align-center">
            <i class="fa-solid fa-cloud-upload-alt"></i>
            <p>Drop files to upload</p>
        </div>
    </div>

    <!-- Notification Popup -->
    <div class="alert-notification" id="alert-notification">
        <button class="close-btn" onclick="toggleNotification()">×</button>
        <h2></h2>
        <p></p>
    </div>

    <div class="upload-overlay" id="uploadOverlay">
        <div class="upload-content">
            <div class="spinner"></div>
            <h3>Uploading Files...</h3>
            <div class="progress-container">
                <div class="progress-bar" id="progressBar"></div>
            </div>
            <p class="progress-text" id="progressText">0%</p>
            <div class="free-height-20px"></div>
            <button type="button" class="button" onclick="cancelUpload()">Cancel</button>
        </div>
    </div>

    <!-- Upload Success Popup -->
    <div class="upload-success-popup-overlay" id="uploadSuccessPopup">
        <div class="upload-success-popup-content">
            <button class="close-popup-button" id="closePopupButton">✕</button>
            <h2 class="success-heading">File Uploaded Successfully!</h2>
            <p class="success-message">Don't forget to copy the file key. Without the file key, you can't access the uploaded file.</p>
            <div class="file-info">
                <div class="qr-code">
                    <img id="qrCodeImage" title="Scan QR Code to get the file URL" src="assets/img/qr-loading.gif" alt="QR Code">
                </div>
                <div class="file-key">
                    <span id="fileKey" title="Click To Copy File Key">file_key_here</span>
                </div>
                <div class="file-url">
                    <input type="text" id="copyUrlButton" title="Click To Copy File URL" value="https://www.filifly.com/?receive=" readonly />
                    <button class="share-button" id="shareUrlButton" title="Share File URL">
                        <span>Share</span>&nbsp;<i class="fa fa-share"></i>
                    </button>
                </div>
            </div>
            <div class="question">
                <p>Would you like to send it anywhere else?</p>
            </div>
            <div class="social-share-options-row">
                <div class="social-option" data-platform="email">
                    <div class="social-icon"><img alt="Email Icon" src="assets/img/social-icons/email.png"></div>
                </div>
                <!-- <div class="social-option" data-platform="whatsapp">
                    <div class="social-icon"><img alt="WhatsApp Icon" src="assets/img/social-icons/whatsapp.png"></div>
                </div>
                <div class="social-option" data-platform="messenger">
                    <div class="social-icon"><img alt="Messenger Icon" src="assets/img/social-icons/messenger.png"></div>
                </div> -->
                <div class="social-option" data-platform="telegram">
                    <div class="social-icon"><img alt="Telegram Icon" src="assets/img/social-icons/telegram.png"></div>
                </div>
                <!-- <div class="social-option" data-platform="instagram">
                    <div class="social-icon"><img alt="Instagram Icon" src="assets/img/social-icons/instagram.png"></div>
                </div> -->
                <div class="social-option" data-platform="viber">
                    <div class="social-icon"><img alt="Viber Icon" src="assets/img/social-icons/viber.png"></div>
                </div>
                <div class="social-option" data-platform="line">
                    <div class="social-icon"><img alt="LINE Icon" src="assets/img/social-icons/line.png"></div>
                </div>
            </div>
            <!-- Dynamic input fields will appear here -->
            <div id="platformInputs" class="platform-inputs"></div>
            <button class="button send-file" id="social-send-button" disabled>Send File</button>
        </div>
    </div>

    <!-- Scroll To Top -->
    <button id="scrollToTopBtn" class="scrollToTopBtn">↑</button>

    <!-- JavaScript -->
    <script src="assets/js/scripts.js"></script>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            const offset = 100; // Adjust this value to set the offset

            document.querySelectorAll('a[href^="#"]').forEach(anchor => {
                anchor.addEventListener('click', function(e) {
                    e.preventDefault();

                    const targetId = this.getAttribute('href').substring(1);
                    const targetElement = document.getElementById(targetId);

                    if (targetElement) {
                        const elementPosition = targetElement.getBoundingClientRect().top;
                        const offsetPosition = elementPosition + window.pageYOffset - offset;

                        window.scrollTo({
                            top: offsetPosition,
                            behavior: "smooth"
                        });
                    }
                });
            });
        });
    </script>
</body>
</html>