.prm {
    display: flex;
    justify-content: center;
    padding: 0 1rem 6.25rem
}

.prm-scale-custom {
    position: relative;
    overflow: hidden;
    width: 100%;
    border-radius: 3rem;
    max-width: 75rem
}

.prm-scale {
    width: 100%;
    overflow: hidden;
    border-radius: 3rem
}

.prm_wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 5rem 0
}

.prm_svg-wrapper {
    position: relative;
    -webkit-clip-path: url(#my_clip);
    clip-path: url(#my_clip)
}

.prm_rotating-gradient {
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(45deg, #446eff 24.42%, #2e96ff 42.96%, #b1c5ff 66.51%);
    width: 100%;
    height: 100%;
    animation-name: rotating;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

@keyframes rotating {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes rotating-opacity {
    0% {
        transform: rotate(0deg);
        opacity: .8
    }

    20% {
        opacity: 1
    }

    90% {
        opacity: 1
    }

    100% {
        transform: rotate(360deg);
        opacity: .8
    }
}

@keyframes rotating-opacity-counter {
    0% {
        transform: rotate(360deg);
        opacity: 1
    }

    50% {
        opacity: .5
    }

    70% {
        opacity: 1
    }

    100% {
        transform: rotate(0deg)
    }
}

.prm_content-wrapper {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
    width: 100%;
    padding: 0 2.1875rem
}

.prm_title {
    color: var(--neutral-grey-0, #fff);
    text-align: center
}

.prm_paragraph {
    color: var(--neutral-grey-0, #fff);
    text-align: center;
    max-width: 744px;
    margin-left: auto;
    margin-right: auto
}

.prm_button-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media(min-width: 43.75rem) {
    .prm_button-wrapper {
        flex-direction:row
    }
}

.prm_button-secondary-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    -moz-column-gap: 2rem;
    column-gap: 2rem;
    row-gap: 1.25rem;
    flex-direction: column
}

@media(min-width: 43.75rem) {
    .prm_button-secondary-wrapper {
        flex-direction:row
    }
}

.prm_background {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1
}

.prm_dots {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("../images/dot_bg.svg");
    background-size: 26px 26px;
    background-repeat: repeat;
    background-position: top left;
    opacity: .5
}

@media(min-width: 43.75rem) {
    .prm_dots {
        opacity:.3
    }
}

.prm-background-gradient {
    position: absolute;
    width: 300%;
    height: 300%;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    background-image: linear-gradient(-45deg, rgba(0, 0, 0, 0.5), rgba(96, 146, 218, 0.4), rgba(0, 0, 0, 0.7), rgba(96, 146, 218, 0.4), rgba(0, 0, 0, 0.5));
    animation-name: rotating-opacity;
    animation-duration: 20s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

@media(min-width: 43.75rem) {
    .prm-background-gradient {
        width:200%;
        height: 200%
    }
}

@media(min-width: 43.75rem) {
    .prm-background-gradient {
        background-image:linear-gradient(-45deg, rgba(0, 0, 0, 0.5) 0, rgba(96, 146, 218, 0.4) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(96, 146, 218, 0.5) 90%, rgba(0, 0, 0, 0.5) 100%)
    }

    .prm-background-gradient::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        animation-name: rotating-opacity-counter;
        animation-duration: 16s;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
        background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.3) 0, rgba(96, 146, 218, 0.4) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(96, 146, 218, 0.5) 90%, rgba(0, 0, 0, 0.3) 100%)
    }
}