.feature-screen-effects{
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:99999;
    overflow:hidden;
}

.fullscreen-phone{
    position:fixed;
    left:50%;
    top:50%;
    width:170px;
    height:320px;
    border-radius:38px;
    background:linear-gradient(145deg,#151515,#020202);
    border:3px solid rgba(255,106,0,.85);
    box-shadow:
        0 0 70px rgba(255,106,0,.55),
        0 50px 120px rgba(0,0,0,.85);
    transform:translate(-50%,-50%) rotateY(90deg) scale(.45);
    animation:phoneFullscreenSpin 2.2s ease forwards;
}

.fullscreen-phone::before{
    content:"";
    position:absolute;
    left:50%;
    top:10px;
    width:54px;
    height:7px;
    border-radius:999px;
    background:#050505;
    transform:translateX(-50%);
}

.fullscreen-phone-screen{
    position:absolute;
    inset:18px;
    border-radius:28px;
    background:
        radial-gradient(circle at 50% 25%, rgba(255,106,0,.45), transparent 42%),
        linear-gradient(180deg,#1a1a1a,#050505);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.fullscreen-phone-screen strong{
    color:#fff;
    font-size:1.3rem;
}

.fullscreen-phone-screen span{
    margin-top:10px;
    color:var(--color-primary);
    font-weight:900;
    letter-spacing:2px;
}

@keyframes phoneFullscreenSpin{
    0%{
        opacity:0;
        transform:translate(-50%,-50%) rotateY(90deg) rotateZ(-18deg) scale(.45);
    }

    22%{
        opacity:1;
    }

    45%{
        transform:translate(-50%,-50%) rotateY(0deg) rotateZ(5deg) scale(1.05);
    }

    70%{
        transform:translate(-50%,-50%) rotateY(360deg) rotateZ(-3deg) scale(1);
        opacity:1;
    }

    100%{
        opacity:0;
        transform:translate(-50%,-58%) rotateY(520deg) rotateZ(18deg) scale(.55);
    }
}