.elementor-72 .elementor-element.elementor-element-0cbc735{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-573194a */body {
    /* Set the dark blue background gradient */
    background: linear-gradient(180deg, #000033 0%, #000066 100%);
    color: #ffffff; /* White text */
    font-family: Arial, sans-serif;
    margin: 0;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Hide anything that goes outside the screen */
}

/* Wrapper to cover the whole screen */
.background-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* --- Glowing Line Effect --- */
.glowing-line {
    position: absolute;
    width: 100%;
    height: 2px; /* Thin line */
    background: rgba(0, 150, 255, 0.8); /* Base blue color */
    box-shadow: 
        0 0 10px rgba(0, 150, 255, 1), /* Inner glow */
        0 0 20px rgba(0, 150, 255, 0.8), /* Medium glow */
        0 0 40px rgba(0, 150, 255, 0.6), /* Outer glow */
        0 0 60px rgba(0, 150, 255, 0.4), /* Farthest glow */
        0 0 80px rgba(0, 150, 255, 0.2);
    /* Make the line softer and extend across the screen */
    filter: blur(1px); 
    z-index: 1; /* Keep it behind the text */
}

/* --- Text Content Styling --- */
.content {
    text-align: center;
    z-index: 2; /* Ensure text is on top */
}

.content h1 {
    font-size: 3em; /* COMING */
    font-weight: 300; /* Lighter weight */
    margin: 0 0 10px 0;
    letter-spacing: 5px;
    /* Subtle text shadow for a glow */
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
}

.content h2 {
    font-size: 6em; /* SOON (much larger and bolder) */
    font-weight: 600;
    margin: 0;
    letter-spacing: 10px;
    /* Stronger text shadow for a bright glow */
    text-shadow: 
        0 0 10px #ffffff,
        0 0 20px rgba(0, 150, 255, 0.8),
        0 0 40px rgba(0, 150, 255, 0.6);
}

/* --- Particle/Star Effect (using a pseudo-element) --- */
/* This simulates the scattered particles. */
.background-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Use a radial gradient to simulate a central light source and scattered dots */
    background: radial-gradient(circle at center, rgba(0, 100, 255, 0.1) 0%, transparent 50%),
                /* This is a placeholder for the actual particle effect. In a real project, 
                   you'd use multiple box-shadows or a particle library for realism. */
                url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10"><circle cx="5" cy="5" r="1" fill="rgba(255,255,255,0.4)" /></svg>');
    background-repeat: repeat;
    background-size: 200px 200px;
    opacity: 0.8;
    animation: twinkle 60s linear infinite; /* Slow, continuous movement */
    z-index: 0;
}

/* Keyframes for a subtle, long-running particle animation */
@keyframes twinkle {
    0% { transform: translateY(0); }
    100% { transform: translateY(100vh); }
}/* End custom CSS */