@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800;900&family=Schoolbell&display=swap');

.header-container {
    padding-top: 80px; /* Deutlich nach unten geschoben für mehr Luft */
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
    width: 100%;
    max-width: 1024px;
    margin-bottom: 120px; /* Großzügiger Sicherheitsabstand zu den Buttons */
    transform: scale(1.15); 
    transform-origin: center top;
    position: relative;
}

.logo-bulb {
    font-size: 40px; /* Ca. 33% größer */
    margin-bottom: -15px;
    position: relative;
    top: -10px; /* Höher positioniert */
    left: 24px; /* Um ca. 3% nach links zurückgesetzt (von 30px auf 24px) */
    z-index: 10;
    animation: bulbPulse 3s infinite ease-in-out;
}

@keyframes bulbPulse {
    0%, 100% { filter: drop-shadow(0 0 15px rgba(255, 215, 0, 0.9)); transform: translateY(0); }
    50% { filter: drop-shadow(0 0 35px rgba(255, 215, 0, 1)); transform: translateY(-3px); }
}

.genius-title {
    font-size: 64px;
    font-weight: 900;
    color: #000000;
    letter-spacing: -1px;
    margin: 0;
    line-height: 0.8;
    text-transform: uppercase;
}

.orange-line {
    width: 310px; /* Breite exakt an GENIUS angepasst (ca. 310px bei 64px Font) */
    height: 3px;
    background-color: #FFD700; /* Von Orange zu Maisgelb */
    margin: 12px 0 6px 0;
    animation: linePulse 3s infinite ease-in-out;
}

@keyframes linePulse {
    0%, 100% { box-shadow: 0 0 10px rgba(255, 215, 0, 0.5); }
    50% { box-shadow: 0 0 25px rgba(255, 215, 0, 0.8); }
}

.footer-text {
    font-family: 'Schoolbell', cursive; /* Authentischerer Schreibschrift-Look */
    font-size: 20px; /* Von 22px auf 20px reduziert (ca. 10%) */
    color: #4b5563; /* Etwas dunkler für Kontrast */
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 1.5% 0 0 0; /* Näher am Strich (von 4% auf 1.5%) */
    display: flex;
    align-items: center;
    height: 35px; /* Feste Höhe */
    animation: pulseQuote 4s infinite ease-in-out, stealthQuote 45s infinite linear;
}

@keyframes pulseQuote {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

@keyframes stealthQuote {
    0%, 93.3% { opacity: 1; visibility: visible; }
    93.4%, 99.9% { opacity: 0; visibility: hidden; }
    100% { opacity: 1; visibility: visible; }
}

@keyframes matrixRoll {
    0%, 96% { transform: translateY(0) rotateX(0deg); filter: blur(0); }
    96.5% { transform: translateY(-20px) rotateX(180deg); filter: blur(2px); }
    97% { transform: translateY(20px) rotateX(-180deg); filter: blur(2px); }
    97.5% { transform: translateY(-20px) rotateX(180deg); filter: blur(2px); }
    98% { transform: translateY(20px) rotateX(-180deg); filter: blur(2px); }
    98.5% { transform: translateY(-20px) rotateX(180deg); filter: blur(2px); }
    99% { transform: translateY(20px) rotateX(-180deg); filter: blur(2px); }
    100% { transform: translateY(0) rotateX(0deg); filter: blur(0); }
}

/* Consolidated Static Footer Logo */
.static-footer-logo {
    width: 100%;
    margin-top: 100px; 
    padding: 100px 0 40px 0; 
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: transparent;
}

.static-footer-logo .header-container {
    padding-top: 0;
    margin-bottom: 0px; /* Reduziert den unteren Abstand des Containers */
    transform: scale(1.0); 
    transform-origin: center top;
}

.static-footer-logo .footer-text {
    margin-top: 10px; /* Hier steuerst du den Abstand zwischen Strich und Text im Footer */
}

/* Electric Buzz Animation */
@keyframes electricBuzz {
    0% { transform: translate(0, 0); text-shadow: 0 0 10px #FFD700; }
    10% { transform: translate(-1px, 1px); color: #FFD700; }
    20% { transform: translate(1px, -1px); text-shadow: 0 0 25px rgba(255, 215, 0, 1); }
    30% { transform: translate(-1px, -1px); }
    40% { transform: translate(1px, 1px); color: #FFF; }
    50% { transform: translate(-2px, 0); text-shadow: 0 0 40px rgba(255, 215, 0, 1); }
    60% { transform: translate(2px, 0); }
    70% { transform: translate(-1px, 1px); }
    80% { transform: translate(1px, -1px); }
    90% { transform: translate(-1px, -1px); }
    100% { transform: translate(0, 0); color: #FFD700; text-shadow: 0 0 15px #FFD700; }
}

.buzz-active {
    animation: electricBuzz 0.2s infinite;
    display: inline-block;
    cursor: pointer;
    transition: color 0.1s;
}

.genius-trigger {
    font-weight: 800;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Split-Flap / Roll Effekt für Wissenssprüche */
.rotating-quote-container {
    display: inline-flex;
    perspective: 1000px;
    height: 30px;
    align-items: center;
}

.letter-flap {
    display: inline-block;
    position: relative;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
    animation: matrixRoll 75s infinite ease-in-out;
}

.letter-flap.flipping {
    transform: rotateX(-360deg);
}

.footer-text .spacer {
    width: 0.8em; /* Größerer Abstand zwischen den Wörtern */
}