.header-banner {
    position: relative;
    overflow: hidden;
    min-height: clamp(620px, 82vh, 860px);
}

html,
body {
    max-width: 100%;
    overflow-x: hidden !important;
}

.header-banner .row {
    align-items: center;
}

.home-rocket-stage {
    position: relative;
    min-height: clamp(520px, 62vw, 720px);
    width: 100%;
    overflow: visible;
    perspective: 1200px;
    transform-style: preserve-3d;
    isolation: isolate;
}

.home-rocket-stage::before {
    content: "";
    position: absolute;
    inset: 13% 3% 12% 2%;
    background:
        radial-gradient(circle at 36% 68%, rgba(74, 216, 255, .24), transparent 28%),
        radial-gradient(circle at 68% 32%, rgba(155, 50, 217, .25), transparent 30%);
    filter: blur(12px);
    opacity: .95;
    transform: translateZ(-120px) rotate(-9deg);
}

.home-rocket-main {
    position: absolute;
    z-index: 3;
    top: 9%;
    left: -3%;
    width: min(56vw, 900px);
    max-width: none;
    height: auto;
    transform-origin: 44% 52%;
    transform: translate3d(-38vw, 24vh, -260px) rotateX(52deg) rotateY(-44deg) rotateZ(-52deg) scale(.42);
    animation: bikRocketLaunch 2.4s cubic-bezier(.16, .8, .2, 1) .12s both, bikRocketHover 4.6s ease-in-out 2.52s infinite alternate;
    filter: drop-shadow(0 22px 24px rgba(0, 0, 0, .42)) drop-shadow(0 0 44px rgba(87, 178, 255, .45));
    will-change: transform;
    backface-visibility: hidden;
}

.home-rocket-flame {
    position: absolute;
    z-index: 2;
    top: 63%;
    left: 7%;
    width: clamp(130px, 13vw, 230px);
    height: clamp(18px, 2.4vw, 38px);
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255, 247, 159, .96), rgba(255, 132, 55, .7) 42%, rgba(123, 44, 249, 0));
    filter: blur(4px);
    opacity: 0;
    transform: rotate(-35deg) translateZ(-12px) scaleX(.4);
    transform-origin: right center;
    animation: bikRocketFlame 2.4s cubic-bezier(.16, .8, .2, 1) .12s both;
    pointer-events: none;
}

.home-rocket-orbit {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .16);
    pointer-events: none;
    transform-style: preserve-3d;
}

.orbit-one {
    width: clamp(260px, 30vw, 430px);
    height: clamp(260px, 30vw, 430px);
    top: 15%;
    left: 20%;
    transform: rotateX(68deg) rotateZ(-28deg) translateZ(-80px);
    animation: bikOrbitSpin 13s linear infinite;
}

.orbit-two {
    width: clamp(170px, 20vw, 300px);
    height: clamp(170px, 20vw, 300px);
    top: 28%;
    right: 3%;
    border-color: rgba(123, 44, 249, .22);
    transform: rotateX(58deg) rotateZ(24deg) translateZ(-130px);
    animation: bikOrbitSpin 16s linear infinite reverse;
}

.home-rocket-stage .roketsmall {
    z-index: 4;
    height: auto;
    transform: rotate(-32deg) translate3d(0, 0, 0);
    will-change: transform, opacity;
}

.home-rocket-stage .roket1 {
    top: 70%;
    left: 2%;
    width: clamp(82px, 10vw, 150px);
}

.home-rocket-stage .roket2 {
    top: 8%;
    left: 31%;
    width: clamp(62px, 7vw, 110px);
}

.home-rocket-stage .roket3 {
    top: 78%;
    left: 68%;
    width: clamp(58px, 7vw, 100px);
}

.home-rocket-stage .roket4 {
    top: 72%;
    left: 23%;
    width: clamp(58px, 7.5vw, 118px);
}

.home-rocket-stage .roket5 {
    top: 27%;
    left: 5%;
    width: clamp(72px, 9vw, 135px);
}

@keyframes bikRocketLaunch {
    0% {
        opacity: 0;
        transform: translate3d(-38vw, 24vh, -260px) rotateX(52deg) rotateY(-44deg) rotateZ(-52deg) scale(.42);
    }
    48% {
        opacity: 1;
        transform: translate3d(2vw, -2vh, 80px) rotateX(16deg) rotateY(-16deg) rotateZ(-34deg) scale(1.07);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotateX(0deg) rotateY(-9deg) rotateZ(-32deg) scale(1);
    }
}

@keyframes bikRocketHover {
    0% {
        transform: translate3d(0, 0, 0) rotateX(0deg) rotateY(-9deg) rotateZ(-32deg) scale(1);
    }
    100% {
        transform: translate3d(42px, -12px, 22px) rotateX(3deg) rotateY(-14deg) rotateZ(-31deg) scale(1.025);
    }
}

@keyframes bikRocketFlame {
    0% {
        opacity: 0;
        transform: rotate(-35deg) translate3d(-210px, 90px, -12px) scaleX(.3);
    }
    18%, 68% {
        opacity: .95;
    }
    100% {
        opacity: 0;
        transform: rotate(-35deg) translate3d(36px, -8px, -12px) scaleX(1);
    }
}

@keyframes bikOrbitSpin {
    to {
        rotate: 1turn;
    }
}

@media (max-width: 1199px) {
    .header-banner {
        min-height: auto;
    }

    .home-rocket-stage {
        min-height: 440px;
    }

    .home-rocket-main {
        top: 4%;
        left: 2%;
        width: min(74vw, 640px);
    }
}

@media (max-width: 767px) {
    .header-banner {
        padding-top: 34px;
        padding-bottom: 36px;
    }

    .banner-content {
        margin-top: 40px !important;
        padding: 0 4% !important;
    }

    .home-rocket-stage {
        min-height: 310px;
        margin-top: 8px;
    }

    .home-rocket-main {
        top: 0;
        left: -7%;
        width: min(104vw, 440px);
    }

    .home-rocket-stage .roket1,
    .home-rocket-stage .roket4,
    .home-rocket-stage .roket5 {
        display: none;
    }

    .home-rocket-stage .roket2 {
        left: 72%;
        top: 12%;
        width: 58px;
    }

    .home-rocket-stage .roket3 {
        left: 18%;
        top: 76%;
        width: 52px;
    }

    .home-rocket-flame {
        top: 56%;
        left: 1%;
        width: 110px;
    }

    .orbit-one {
        left: 18%;
        top: 8%;
    }

    .orbit-two {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-rocket-main,
    .home-rocket-flame,
    .home-rocket-orbit,
    .home-rocket-stage .roketsmall {
        animation: none !important;
    }

    .home-rocket-main {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotateZ(-32deg) scale(1);
    }

    .home-rocket-flame {
        display: none;
    }
}
