/* =========================================================
   PRE-RELEASE STATUS BANNER
========================================================= */

.pre-release-banner {
    width: 100%;
    margin: 34px 0 42px;
    padding: 2px;

    box-sizing: border-box;

    border-radius: 10px;

    background:
        linear-gradient(
            90deg,
            rgba(0, 255, 204, 0.18),
            rgba(0, 170, 255, 0.55),
            rgba(0, 255, 204, 0.18)
        );

    box-shadow:
        0 0 22px rgba(0, 200, 255, 0.08);
}

.pre-release-banner-inner {
    position: relative;

    padding: 24px 40px;

    text-align: center;

    border-radius: 8px;

    background:
        linear-gradient(
            135deg,
            rgba(12, 16, 28, 0.98),
            rgba(18, 22, 38, 0.98)
        );

    border: 1px solid rgba(255, 255, 255, 0.08);

    overflow: hidden;
}

.pre-release-banner-inner::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(0, 255, 204, 0.8),
            transparent
        );

    animation: preReleaseScan 3.5s ease-in-out infinite;
}

.pre-release-status {
    display: flex;

    justify-content: center;
    align-items: center;

    gap: 9px;

    margin-bottom: 8px;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #00ffcc;
}

.pre-release-dot {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #00ffcc;

    box-shadow:
        0 0 7px #00ffcc,
        0 0 16px rgba(0, 255, 204, 0.7);

    animation: preReleaseBlink 1.8s ease-in-out infinite;
}

.pre-release-banner h3 {
    margin: 0 0 8px;

    font-size: 20px;

    letter-spacing: 1.5px;
}

.pre-release-banner p {
    max-width: 1050px;

    margin: 0 auto;

    font-size: 13px;

    line-height: 1.6;

    color: rgba(255, 255, 255, 0.72);
}

@keyframes preReleaseBlink {

    0%,
    100% {
        opacity: 0.45;
        transform: scale(0.9);
    }

    50% {
        opacity: 1;
        transform: scale(1.15);
    }

}

@keyframes preReleaseScan {

    0% {
        opacity: 0.25;
        transform: translateX(-30%);
    }

    50% {
        opacity: 1;
        transform: translateX(0);
    }

    100% {
        opacity: 0.25;
        transform: translateX(30%);
    }

}