/* ✨ Reset für saubere Darstellung */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* 🖋️ Eigene Schriftart einbinden – bevorzugt WOFF2 */
@font-face {
    font-family: "Arapey";
    src: 
        url("./fonts/Arapey-Regular.woff2") format("woff2"),
        url("./fonts/Arapey-Regular-2.woff2") format("woff2"),
        url("./fonts/Arapey-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

/* 🌟 Hintergrund & zentrales Layout */
body {
    background-color: #f3e6d8; /* Warmes, leckeres Beige */
    font-family: "Arapey", "Inter", "Ubuntu", "Lucida Grande", "Lucida", "Verdana", sans-serif;
    color: #2c3e50; /* Dunkles Blau für die Schrift */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh; /* Volle Bildschirmhöhe */
}

/* 🏠 Container für den Inhalt */
.container {
    max-width: 800px;
    padding: 20px;
}

/* 🎤 Haupt-Slogan */
.rsp-slogan {
    font-family: "Arapey", serif;
    font-size: 2rem;
    font-weight: normal;
    margin-bottom: 10px;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 1.5s ease-out forwards;
}

/* 🌿 Sub-Slogan mit weichem Einblenden */
.rsp-sub-slogan {
    font-family: "Arapey", serif;
    font-size: 1.6rem;
    font-style: italic;
    font-weight: normal;
    color: rgba(44, 62, 80, 0.8); /* Etwas transparenter für Eleganz */
    opacity: 0;
    transform: translateY(10px);
    animation: fadeInSoft 3s ease-out 1.5s forwards;
}

/* 🎬 Animation für Haupt-Slogan */
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 🌿 Sanfte Animation für Sub-Slogan */
@keyframes fadeInSoft {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 📷 Logo */
.rsp-image {
    display: block;
    width: 400px;
    margin: 20px auto;
    transition: transform 0.3s ease-in-out;
}

.rsp-image:hover {
    transform: scale(1.1);
}

/* 📞 Kontakt */
.contact {
    margin: 20px 0;
}

.call-action a {
    color: #2c3e50;
    font-size: 1.2em;
    text-decoration: none;
}

/* 📜 Impressum & Datenschutz */
.footer {
    margin-top: 40px;
    font-size: 0.85em;
    color: #43454b;
}