:root {
    --brand-red: #E50914;
}

#intro-layer {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background: black; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    transition: opacity 0.8s ease-out;
}

.intro-logo {
    color: var(--brand-red); font-size: 8rem; letter-spacing: 6px;
    font-family: 'Bebas Neue', sans-serif;
    margin: 0;
    transform: scale(1);
    animation: heartbeat 2.5s ease-in-out forwards;
}

@keyframes heartbeat {
    0% { opacity: 0; transform: scale(0.8); }
    15% { opacity: 1; transform: scale(1.1); }
    30% { transform: scale(1); }
    45% { transform: scale(1.05); }
    100% { transform: scale(1); opacity: 0; }
}

.hidden-initially { opacity: 0; transition: opacity 1.5s ease; }
.fade-in { opacity: 1; }