@{
    ViewData["Title"] = "Home";
}

<div class="home-page">

    <!-- =====================================================
         HERO
         ===================================================== -->

    <section class="home-hero">

        <div class="home-hero-content">

            <span class="home-eyebrow">
                KERNEL RECORDS
            </span>

            <h1>
                MUSIC
                <span>FOR</span>
                YOUR COLLECTION.
            </h1>

            <p>
                Discover vinyl records, CDs and cassettes
                from artists and releases worth keeping.
            </p>


            <div class="home-hero-actions">

                <a asp-controller="Release"
                   asp-action="Index"
                   class="home-button primary">

                    Browse Collection

                </a>

                <a asp-controller="Sale"
                   asp-action="Index"
                   class="home-button secondary">

                    Shop Sale

                </a>

            </div>

        </div>


        <div class="home-hero-mark">
            K
        </div>

    </section>


    <!-- =====================================================
         QUICK LINKS
         ===================================================== -->

    <section class="home-section">

        <div class="home-section-header">

            <div>

                <span class="section-label">
                    SHOP
                </span>

                <h2>
                    Find something you like.
                </h2>

            </div>

        </div>


        <div class="home-feature-grid">

            <a asp-controller="Release"
               asp-action="Index"
               class="home-feature-card">

                <span>01</span>

                <h3>
                    Browse Releases
                </h3>

                <p>
                    Explore albums and singles.
                </p>

                <strong>
                    Explore →
                </strong>

            </a>


            <a asp-controller="TopSellers"
               asp-action="Index"
               class="home-feature-card">

                <span>02</span>

                <h3>
                    Top Sellers
                </h3>

                <p>
                    See what other collectors are buying.
                </p>

                <strong>
                    View Top Sellers →
                </strong>

            </a>


            <a asp-controller="Sale"
               asp-action="Index"
               class="home-feature-card sale-feature">

                <span>03</span>

                <h3>
                    Sale
                </h3>

                <p>
                    Find discounted physical releases.
                </p>

                <strong>
                    Shop Sale →
                </strong>

            </a>

        </div>

    </section>


    <!-- =====================================================
         COLLECTION INFO
         ===================================================== -->

    <section class="home-collection">

        <div>

            <span class="section-label">
                PHYSICAL MUSIC
            </span>

            <h2>
                Vinyl. CDs. Cassettes.
            </h2>

        </div>

        <p>
            Build a physical collection with releases
            available in the formats you actually want.
        </p>

    </section>

</div>