@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;0,1000;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900;1,1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Neuton:ital,wght@0,200;0,300;0,400;0,700;0,800;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Neuton&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Italiana&family=Neuton&family=Poppins&display=swap');
*{
    color: #F2F2F2;
    font-family: Italiana;
    margin: 0;
    overflow-x: hidden;
}
html{
    background-color: #010711;
}
a{
    cursor: pointer;
    text-decoration: none;
}
.spacer-default{
    margin-block: 10%;
}

/* *  loader 
.loader {
    height: 7px;
    width: 50%;
    background-color: #f2f2f280;
    border-radius: 20vh;
    position: fixed;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden; 
    opacity: 0; 
    animation: flyIn1 0.7s cubic-bezier(.25,.1,.25,1) forwards, flyOut 0.7s cubic-bezier(.25,.1,.25,1) forwards;
    animation-delay: 0.1s, 4.7s;
}

.loader::before {
    content: "";
    height: 100%;
    width: 0;
    background-color: #f2f2f2;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 20vh;
    animation: load 1.8s cubic-bezier(.25,.1,.25,1) forwards; 
    animation-delay: 0.55s;
}

.loader-bg {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100vh;
    width: 100%;
    background-color: #010711;
    z-index: 1000;
    animation: fadeOut 700ms cubic-bezier(.25,.1,.25,1) forwards; 
    animation-delay: 2.57s;
}

.main-title_default-ltl_factice{
    z-index: 1001;
    position: fixed;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: flyIn2 0.7s cubic-bezier(.25,.1,.25,1) forwards, flyOut2 0.7s cubic-bezier(.25,.1,.25,1) forwards;
    animation-delay: 0.1s, 2.57s;
}

@keyframes load {
    from {
        width: 0%; 
    }
    to {
        width: 100%;
    }
}

@keyframes fadeOut {
    from{
        opacity: 1;
    }
    to{
        opacity: 0;
    }
}

@keyframes flyIn1 {
    from {
        opacity: 0;
        top: 53%;
    }
    to {
        opacity: 1;
        top: 50%;
    }
}

@keyframes flyIn2 {
    from {
        opacity: 0;
        top: 50%;
    }
    to {
        opacity: 1;
        top: 46%;
    }
}

@keyframes flyOut {
    from {
        opacity: 1;
        top: 50%;
    }
    to {
        opacity: 0;
        top: 53%;
    }
}

@keyframes flyOut2 {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes zoomIn {
    from {
        width: 30vh;
        height: 30vh;
    }
    to {
        width: 40vh;
        height: 40vh;
    }
}

@keyframes zoomIn2 {
    from {
        transform: scale(80%);
    }
    to {
        transform: scale(100%);
    }
}

@keyframes FlyFromTop {
    from {
        transform: translateY(-150%);
    }
    to {
        transform: translateY(30%);
    }
} */

/**  Section  1*/
.section-1{
    height: 100vh;
    width: 100%;
    overflow-y: hidden;
}
.center_main-div_default{
    width: 100%;
    height: 98vh;
    margin-top: 2vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.default-img{
    animation: zoomIn 0.7s cubic-bezier(.25,.1,.25,1) forwards;
    animation-delay: 2.57s;
    filter: blur(4.3px);
    opacity: 0.15;
    z-index: -1;
    /* background-color: #5e9ff2; */
    border-radius: 50%;
    width: 40vh;
    height: 40vh;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.default-title_intro{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow-y: hidden;
}
.main-title_default{
    text-align: center;
    opacity: 100%;
    font-size: 700%;
    font-family: Italiana;
    font-variation-settings: 'wght' 500;
    overflow-y: hidden;
}
.main-title_default-ltl{
    overflow: hidden;
}
.main-title_default-alt{
    position: fixed;
    margin-top: 2vh;
    text-align: center;
    width: 100%;
    font-size: 150%;
    animation: FlyFromTop 0.7s cubic-bezier(.25,.1,.25,1) forwards;
    animation-delay: 2.57s;
    mix-blend-mode: difference;
}
.bot-text_dscr{
    position: fixed;
    top: 97%;
    left: 50%;
    transform: translateX(-50%);
}

/** Section 2  */
.text-container_1-default{
    max-width: 40%;
    text-align: center;
}
.text-section-2_1{
    opacity: 1;
}
.text-section-2_2, .text-section-2_3{
    opacity: 0.2;
}
.text-container_1-default-gen{
    margin-bottom: 20vh;
}
.text-section-2-3-gen{
    font-family: Poppins;
    font-size: 100%;
    margin-block: 60px;
}
.section-2_main{
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: row;
}
/**  section 3 */

.section-3_img{
    width: 40%;
    border-radius: 6vh;
}

.section-3_main{
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: row;
}

.section-3_txt-container{
    max-width: 30%;
}

.text-section-3_1, .text-section-3_2, .text-section-3_3{
    opacity: 0;
}

/**  section 4 */

.section-4_img{
    width: 60vh;
    border-radius: 6vh;
}

.section-4_main{
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: row;
}

.section-4_txt-container{
    max-width: 42%;
}

.text-section-4_1, .text-section-4_2, .text-section-4_3{
    opacity: 0;
}

@media all and (max-width: 999px) {
    .text-container_1-default{
        max-width: 80%;
        left: 0%;
    }
    .section-3_main{
        flex-direction: column;
    }
    .section-3_txt-container, .section-4_txt-container{
        max-width: 80%;
    }
    .section-3_img{
        width: 60%;
        border-radius: 6vh;
    }
    .section-4_main{
        flex-direction: column-reverse;
    }
    .section-4_img{
        width: 30vh;
    }
}
@media all and (max-width: 499px) {
    .text-section-2-3-gen{
        font-size: 70%;
    }
}