{% extends "base.html" %}

{% block title %}Use Cases - Makenot.work{% endblock %}
{% block body_attrs %} class="padded-page"{% endblock %}

{% block content %}
    {% include "partials/site_header.html" %}

    <div class="container use-cases-page">
        <h1 class="page-title">Use Cases</h1>
        <p class="use-cases-intro">A flat monthly fee. 0% platform cut. Who it's built for:</p>

        <div class="tier-section">
            <h2 class="section-label">Available now</h2>
            <div class="use-case-grid">
                <div class="use-case-card" id="musicians">
                    <div class="use-case-title">Musicians</div>
                    <div class="use-case-who">Bands, solo artists, producers</div>
                    <p class="use-case-desc">Sell albums, singles, and EPs with in-browser streaming, chapter markers, and cover art.</p>
                    <ul class="use-case-features">
                        <li>MP3, FLAC, WAV, OGG, AAC, AIFF upload</li>
                        <li>In-browser audio player with chapters</li>
                        <li>Cover art and rich metadata</li>
                        <li>RSS feed per project</li>
                        <li>Pay-what-you-want pricing</li>
                    </ul>
                    <div class="use-case-tier">Small Files ${{ tier_prices.small_files_std }}/mo &middot; {{ tier_prices.small_files_total }}, {{ tier_prices.small_files_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="podcasters">
                    <div class="use-case-title">Podcasters</div>
                    <div class="use-case-who">Independent shows, networks</div>
                    <p class="use-case-desc">Host and distribute your podcast with full RSS support for every major directory.</p>
                    <ul class="use-case-features">
                        <li>RSS for Apple, Spotify, Pocket Casts</li>
                        <li>Chapter markers</li>
                        <li>Subscriber-only feeds</li>
                        <li>Broadcast emails to followers</li>
                    </ul>
                    <div class="use-case-tier">Small Files ${{ tier_prices.small_files_std }}/mo &middot; {{ tier_prices.small_files_total }}, {{ tier_prices.small_files_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="writers">
                    <div class="use-case-title">Writers</div>
                    <div class="use-case-who">Bloggers, newsletter writers, authors</div>
                    <p class="use-case-desc">Publish long-form writing with Markdown, per-project blogs, and subscriber broadcasts.</p>
                    <ul class="use-case-features">
                        <li>Markdown editor with formatting</li>
                        <li>Per-project blog</li>
                        <li>RSS feed</li>
                        <li>Scheduled publishing</li>
                        <li>Broadcast emails</li>
                    </ul>
                    <div class="use-case-tier">Basic ${{ tier_prices.basic_std }}/mo &middot; {{ tier_prices.basic_total }}, {{ tier_prices.basic_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="developers">
                    <div class="use-case-title">Software Developers</div>
                    <div class="use-case-who">Indie devs, tool makers, plugin authors</div>
                    <p class="use-case-desc">Distribute software with versioned releases, license keys, and a built-in git browser.</p>
                    <ul class="use-case-features">
                        <li>Versioned releases with changelogs</li>
                        <li>License keys with activation tracking</li>
                        <li>Git source browser</li>
                        <li>Promo codes and discounts</li>
                    </ul>
                    <div class="use-case-tier">Small Files ${{ tier_prices.small_files_std }}/mo &middot; {{ tier_prices.small_files_total }}, {{ tier_prices.small_files_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="sample-packs">
                    <div class="use-case-title">Sample Packs</div>
                    <div class="use-case-who">Sound designers, beat makers, foley artists</div>
                    <p class="use-case-desc">Sell sample packs and sound effects with audio previews and versioned downloads.</p>
                    <ul class="use-case-features">
                        <li>Audio previews in-browser</li>
                        <li>Versioned downloads</li>
                        <li>Hierarchical tags for organization</li>
                        <li>Pay-what-you-want pricing</li>
                        <li>Cover art</li>
                    </ul>
                    <div class="use-case-tier">Small Files ${{ tier_prices.small_files_std }}/mo &middot; {{ tier_prices.small_files_total }}, {{ tier_prices.small_files_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="digital-art">
                    <div class="use-case-title">Digital Art &amp; Photography</div>
                    <div class="use-case-who">Illustrators, photographers, font designers</div>
                    <p class="use-case-desc">Sell digital art, photography, and fonts with versioned releases and subscription tiers.</p>
                    <ul class="use-case-features">
                        <li>Any file type supported</li>
                        <li>Versioned releases</li>
                        <li>Subscription tiers</li>
                        <li>Cover images</li>
                    </ul>
                    <div class="use-case-tier">Small Files ${{ tier_prices.small_files_std }}/mo &middot; {{ tier_prices.small_files_total }}, {{ tier_prices.small_files_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="educators">
                    <div class="use-case-title">Educators</div>
                    <div class="use-case-who">Course creators, tutors, workshop leaders</div>
                    <p class="use-case-desc">Publish courses and teaching materials with text content, downloads, and subscriptions.</p>
                    <ul class="use-case-features">
                        <li>Text content with Markdown</li>
                        <li>Downloadable materials</li>
                        <li>Subscription tiers</li>
                        <li>Scheduled publishing</li>
                    </ul>
                    <div class="use-case-tier">Basic ${{ tier_prices.basic_std }}/mo or Small Files ${{ tier_prices.small_files_std }}/mo</div>
                </div>

                <div class="use-case-card" id="game-devs">
                    <div class="use-case-title">Game Developers</div>
                    <div class="use-case-who">Indie games, mods, TTRPG content</div>
                    <p class="use-case-desc">Distribute games up to 20GB per file with versioned downloads, license keys, and promo codes. Need more than 20GB? Request a size increase from your dashboard.</p>
                    <ul class="use-case-features">
                        <li>Up to 20GB per file (increase on request)</li>
                        <li>Versioned downloads with changelogs</li>
                        <li>License keys with activation limits</li>
                        <li>Promo codes</li>
                    </ul>
                    <div class="use-case-tier">Big Files ${{ tier_prices.big_files_std }}/mo &middot; {{ tier_prices.big_files_total }}, {{ tier_prices.big_files_per_file }}/file</div>
                </div>

                <div class="use-case-card" id="comic-creators">
                    <div class="use-case-title">Comic Creators</div>
                    <div class="use-case-who">Webcomic artists, graphic novelists</div>
                    <p class="use-case-desc">Sell digital comics and graphic novels with project organization and scheduled publishing.</p>
                    <ul class="use-case-features">
                        <li>PDF, CBZ, and any file type</li>
                        <li>Project organization</li>
                        <li>Subscriptions</li>
                        <li>Scheduled publishing</li>
                    </ul>
                    <div class="use-case-tier">Small Files ${{ tier_prices.small_files_std }}/mo &middot; {{ tier_prices.small_files_total }}, {{ tier_prices.small_files_per_file }}/file</div>
                </div>
            </div>
        </div>

        <div class="tier-section">
            <h2 class="section-label">Coming soon</h2>
            <div class="use-case-grid use-case-grid-2col">
                <div class="use-case-card coming-soon">
                    <div class="use-case-title">Video Creators</div>
                    <div class="use-case-who">Filmmakers, tutorial creators</div>
                    <p class="use-case-desc">Upload and sell video content with adaptive streaming.</p>
                    <ul class="use-case-features">
                        <li>Video upload</li>
                        <li>Adaptive streaming</li>
                        <li>All existing features included</li>
                    </ul>
                    <div class="use-case-tier">Big Files ${{ tier_prices.big_files_std }}/mo &middot; {{ tier_prices.big_files_total }}, {{ tier_prices.big_files_per_file }}/file</div>
                </div>

                <div class="use-case-card coming-soon">
                    <div class="use-case-title">Live Streamers</div>
                    <div class="use-case-who">Musicians, educators, performers</div>
                    <p class="use-case-desc">Live streaming with VOD archives and everything in the tiers below.</p>
                    <ul class="use-case-features">
                        <li>Live streaming</li>
                        <li>VOD archives</li>
                        <li>All existing features included</li>
                    </ul>
                    <div class="use-case-tier">Everything ${{ tier_prices.everything_std }}/mo &middot; {{ tier_prices.everything_total }}, all features</div>
                </div>
            </div>
        </div>

        <div class="tier-section">
            <h2 class="section-label">Everyone gets</h2>
            <div class="feature-grid">
                <div class="feature-card">
                    <div class="feature-name">0% platform fee</div>
                    <div class="feature-desc">Only ~3% payment processing. No percentage cuts, no revenue sharing.</div>
                </div>
                <div class="feature-card">
                    <div class="feature-name">Full data export</div>
                    <div class="feature-desc">Download everything anytime. Projects, items, sales, contacts: all yours.</div>
                </div>
                <div class="feature-card">
                    <div class="feature-name">No lock-in</div>
                    <div class="feature-desc">Month-to-month. Cancel anytime. Take your audience with you.</div>
                </div>
                <div class="feature-card">
                    <div class="feature-name">Source available</div>
                    <div class="feature-desc">Read the codebase. Verify every claim about privacy and data handling.</div>
                </div>
            </div>
        </div>

        <div class="landing-cta">
            <a class="btn-primary btn--large" href="/join">Join the Alpha</a>
        </div>

        <div class="tier-section">
            <div class="explore-links">
                <a href="/pricing">Pricing Calculator</a>
                <a href="/discover">Browse as guest</a>
                <a href="/docs/getting-started">Creator Guide</a>
            </div>
        </div>
    </div>
{% endblock %}