.download-hero {
    background: linear-gradient(-45deg, #000000, #1a1a1a, #2a2a2a, #1e1e1e, #1d1d1d, #0f0f0f);
    background-size: 400% 400%;
    animation: gradientShift 8s ease infinite;
    padding: 2rem 0 4rem;
    text-align: center;
    position: relative;
    overflow-x: hidden;
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.download-hero .download-container {
    position: relative;
    z-index: 1;
}

.download-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
}

.app-logo-large {
    width: 150px;
    margin: 0 auto 2rem;
    border-radius: 20px;
}

.beta-badge {
    background: linear-gradient(45deg, var(--color-primary), #ff9500);
    color: var(--color-text-dark);
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: bold;
    font-size: 0.9rem;
    margin-bottom: 1rem;
    display: inline-block;
    position: absolute;
}

.headline-animated {
    margin: 0 auto;
    margin-bottom: 1rem;
    max-width: 750px;
}

.hero-description {
    margin: 0 auto;
}

@media (max-width: 768px) {
    .beta-badge {
        padding: 0.3rem 0.6rem;
        font-size: 0.54rem;
    }

    /* Philosophy pages: keep h2 elements left-aligned on mobile */
    .fit-content {
        width: auto;
        margin-left: 0;
        margin-right: 0;
    }
}