Fuyuzakura/line-up/lineup.html

<style>
    /* CSS für das Kachel-Layout (Grid) */
    .fuyu-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 30px;
        margin-top: 20px;
        margin-bottom: 50px;
    }

    .fuyu-card {
        background: #ffffff;
        border-radius: 16px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        overflow: hidden;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        border: 1px solid #fce7f3;
    }

    .fuyu-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 25px rgba(219, 39, 119, 0.15);
    }

    .fuyu-card-img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        border-bottom: 3px solid #db2777; /* Fuyuzakura Pink */
    }

    .fuyu-card-content {
        padding: 20px;
    }

    .fuyu-card-title {
        color: #312e81;
        font-size: 1.25rem;
        font-weight: 700;
        margin-top: 0;
        margin-bottom: 10px;
    }

    .fuyu-card-meta {
        font-size: 0.85rem;
        color: #db2777;
        font-weight: 600;
        margin-bottom: 15px;
    }

    .fuyu-card-text {
        font-size: 0.95rem;
        color: #4b5563;
        line-height: 1.5;
        margin-bottom: 15px;
    }

    .fuyu-card-link {
        display: inline-block;
        color: #db2777;
        font-weight: 600;
        text-decoration: none;
        font-size: 0.9rem;
    }

    .fuyu-card-link:hover {
        text-decoration: underline;
    }
</style>


<p>Willkommen zur großen Übersicht! Hier präsentieren wir dir stolz das offizielle <strong>Line-up der Fuyuzakura Con</strong>. Entdecke, welche großartigen ShowActs unsere Hauptbühne in der <a href="/location/">Willy-Brandt-Halle in Mühlheim</a> rocken, welche talentierten Künstler in der Zeichnerallee auf dich warten und bei welchen Händlern du dir das beste Merchandise sichern kannst.</p>


<h2>🎤 ShowActs &amp; Bühnenprogramm</h2>
<p>Freu dich auf ein abwechslungsreiches Programm voller Energie! Unser Bühnen-Line-up bringt dir die beste Unterhaltung direkt aus der Anime- und Popkultur.</p>

<div class="fuyu-grid">
    <!-- ShowAct Karte 1 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="ShowAct im Line-up Fuyuzakura Con" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Name der Idol-Gruppe</h3>
            <div class="fuyu-card-meta">📅 Samstag, 14:00 Uhr | 📍 Hauptbühne</div>
            <p class="fuyu-card-text">Diese fantastische Tanzgruppe bringt die Bühne zum Beben. Freut euch auf energiegeladene J-Pop und K-Pop Cover-Tänze im originalgetreuen Cosplay!</p>
            <a href="https://instagram.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Mehr über die Gruppe →</a>
        </div>
    </div>

    <!-- ShowAct Karte 2 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="Cosplay Panel auf der Fuyuzakura Con" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Cosplay Rüstungsbau Panel</h3>
            <div class="fuyu-card-meta">📅 Samstag, 16:30 Uhr | 📍 Panelraum 1</div>
            <p class="fuyu-card-text">Unser Special Guest teilt seine besten Tipps zum Thema Rüstungsbau mit Worbla und Schaumstoff. Perfekt, um dein nächstes Cosplay aufs nächste Level zu heben.</p>
            <a href="https://instagram.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Instagram-Profil →</a>
        </div>
    </div>
</div>


<h2>🎨 Künstler &amp; Zeichnerallee</h2>
<p>In unserer gemütlichen Zeichnerallee präsentieren handverlesene Künstler aus ganz Deutschland ihre Werke. Support your local artists und entdecke einzigartige Fanarts und Merchandise-Kreationen!</p>

<div class="fuyu-grid">
    <!-- Künstler Karte 1 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="Künstler in der Zeichnerallee Line-up Fuyuzakura Con" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Künstlername Eins</h3>
            <div class="fuyu-card-meta">🌸 Stand: Z-01 | Aquarell &amp; Pins</div>
            <p class="fuyu-card-text">Spezialisiert auf fantastische Aquarell-Illustrationen, süße Enamel-Pins und handgemachte Aufkleber von deinen Lieblings-Anime.</p>
            <a href="https://twitter.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Portfolio →</a>
        </div>
    </div>

    <!-- Künstler Karte 2 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="Manga Künstler Fuyuzakura" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Künstlername Zwei</h3>
            <div class="fuyu-card-meta">🌸 Stand: Z-02 | Manga &amp; Prints</div>
            <p class="fuyu-card-text">Bringt euch exklusive Prints im Shōnen-Stil und spannende Eigenproduktionen mit. Verpasst nicht die limitierten Acryl-Anhänger!</p>
            <a href="https://etsy.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Online-Shop →</a>
        </div>
    </div>
    
    <!-- Künstler Karte 3 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="Handgemachte Kunst auf der Fuyuzakura Con" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Künstlername Drei</h3>
            <div class="fuyu-card-meta">🌸 Stand: Z-03 | Plüsch &amp; Charms</div>
            <p class="fuyu-card-text">Wer es flauschig mag, ist hier genau richtig: Handgenähte Plüschtiere, Taschen und detailverliebte Charms für dein Itabag.</p>
            <a href="https://instagram.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Instagram-Profil →</a>
        </div>
    </div>
</div>


<h2>🛍️ Händler &amp; Merchandise</h2>
<p>Was wäre das Line-up einer Convention ohne ordentlich Loot? In unserem Händlerbereich findest du alles, was das Otaku-Herz begehrt – von offiziellen Figuren bis zu japanischen Snacks.</p>

<div class="fuyu-grid">
    <!-- Händler Karte 1 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="Händler für Anime Figuren auf der Fuyuzakura" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Figur-Shop Name</h3>
            <div class="fuyu-card-meta">🛒 Stand: H-01 | Figuren &amp; Merch</div>
            <p class="fuyu-card-text">Dein Fachhändler für importierte Anime-Figuren, Nendoroids und exklusive Gacha-Artikel direkt aus Japan.</p>
            <a href="https://shoplink.de" target="_blank" rel="noopener" class="fuyu-card-link">Zur Website →</a>
        </div>
    </div>

    <!-- Händler Karte 2 -->
    <div class="fuyu-card">
        <img src="https://via.placeholder.com/600x400" alt="Japanische Snacks Fuyuzakura Con" class="fuyu-card-img">
        <div class="fuyu-card-content">
            <h3 class="fuyu-card-title">Snack-Oase</h3>
            <div class="fuyu-card-meta">🛒 Stand: H-02 | Ramune &amp; Sweets</div>
            <p class="fuyu-card-text">Hol dir eine Stärkung! Eine riesige Auswahl an Pocky, Ramune, Mochi und weiteren original japanischen Snacks wartet auf dich.</p>
        </div>
    </div>
</div>

<!-- Call to Action -->
<div style="background-color: #fce7f3; padding: 30px; border-radius: 16px; margin-top: 50px; text-align: center;">
    <h3 style="color: #db2777; margin-top: 0; font-size: 1.5rem;">Du willst dieses Line-up nicht verpassen?</h3>
    <p style="color: #4b5563; margin-bottom: 20px;">Sichere dir jetzt dein Ticket für die Convention und erlebe alle ShowActs, Händler und Künstler live in Mühlheim!</p>
    <a href="/tickets/" style="display: inline-block; background-color: #db2777; color: white; padding: 12px 25px; text-decoration: none; border-radius: 50px; font-weight: bold; font-size: 1.1rem; box-shadow: 0 4px 10px rgba(219,39,119,0.3); transition: transform 0.2s ease;">🎟️ Zum Ticket-Shop</a>
</div>