/* Dateiname: app.css
Model: deepseek-v4-pro
Beschreibung: Globale Stylesheets für die Weltraum-Ästhetik.
*/

body {
    background-color: #0b0c10;
    background-image: radial-gradient(circle at 10% 20%, rgba(30, 20, 40, 0.5), transparent 50%), radial-gradient(circle at 90% 80%, rgba(20, 40, 50, 0.5), transparent 50%), url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='1' fill='rgba(255,255,255,0.4)'/%3E%3Ccircle cx='80' cy='60' r='1.5' fill='rgba(255,255,255,0.2)'/%3E%3Ccircle cx='40' cy='100' r='0.5' fill='rgba(255,255,255,0.5)'/%3E%3C/svg%3E");
    color: #c5c6c7;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
}

/* UI Elemente */
.glass-card {
    background: rgba(15, 20, 25, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(102, 252, 241, 0.15);
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.8);
}

.neon-text {
    text-shadow: 0 0 15px rgba(102, 252, 241, 0.7);
    color: #66fcf1;
}

/* Spezifische Layout-Klassen */
.hero-section {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-bottom: 2px solid rgba(102, 252, 241, 0.2);
    background: radial-gradient(circle at center, rgba(102, 252, 241, 0.05) 0%, transparent 70%);
}

.cta-button {
    background: linear-gradient(135deg, #45a29e 0%, #66fcf1 100%);
    color: #0b0c10;
    transition: all 0.3s ease;
    box-shadow: 0 0 20px rgba(102, 252, 241, 0.4);
}

    .cta-button:hover {
        transform: translateY(-3px) scale(1.05);
        box-shadow: 0 0 30px rgba(102, 252, 241, 0.7);
    }

/* Verhindert Blazor-Fehlermeldungen im UI, wenn die Verbindung abbricht (optional) */
#blazor-error-ui {
    display: none !important;
}