*{
    box-sizing:border-box;
}

body{
    margin:0;
    font-family:Arial;
    color:white;

    background:
    radial-gradient(circle at top, rgba(0,255,170,0.15), transparent 40%),
    #040f0f;

    height:100vh;
min-height:100vh;
overflow:auto;
}

.container{
    text-align:center;
    margin-top:150px;
    padding-bottom:100px;
}

h1{
    font-size:72px;
    margin-bottom:10px;

    color:#7fffd4;

    text-shadow:
    0 0 10px rgba(0,255,170,0.7),
    0 0 30px rgba(0,255,170,0.3);
}

p{
    color:#9ca3af;
    font-size:20px;
    line-height:1.7;
}

button{
    margin-top:30px;
    padding:16px 40px;

    border:1px solid rgba(0,255,170,0.4);

    border-radius:14px;

    background:
    linear-gradient(
        135deg,
        rgba(0,255,170,0.25),
        rgba(0,255,170,0.08)
    );

    color:#d1fae5;

    font-size:18px;
    font-weight:bold;

    cursor:pointer;

    transition:0.3s;

    backdrop-filter:blur(10px);

    box-shadow:
    0 0 20px rgba(0,255,170,0.15);
}

button:hover{

    transform:translateY(-3px);

    background:
    linear-gradient(
        135deg,
        rgba(0,255,170,0.4),
        rgba(0,255,170,0.15)
    );

    box-shadow:
    0 0 25px rgba(0,255,170,0.35);
}

#resultBox{

    margin-top:30px;

    width:90%;
max-width:350px;

    margin-left:auto;
    margin-right:auto;

    padding:20px;

    border-radius:16px;

    background:rgba(0,255,170,0.08);

    border:1px solid rgba(0,255,170,0.2);

    color:#d1fae5;

    font-size:18px;

    display:none;

    box-shadow:
    0 0 20px rgba(0,255,170,0.12);
}

.form-box{

width:90%;
max-width:420px;

    margin:40px auto;

    display:flex;

    flex-direction:column;

    gap:18px;
}

input,
textarea{

    font-family:Arial;

    background:rgba(255,255,255,0.03);

    border:1px solid rgba(0,255,170,0.18);

    border-radius:14px;

    padding:16px;

    color:white;

    font-size:16px;

    outline:none;

    transition:0.3s;
}

input:focus,
textarea:focus{

    border-color:#00ffaa;

    box-shadow:
    0 0 15px rgba(0,255,170,0.15);
}

textarea{

    height:100px;

    resize:none;
}

input::placeholder,
textarea::placeholder{

    color:#94a3b8;
}

#particles-js{

    position:fixed;

    top:0;
    left:0;

    width:100%;
    height:100%;

    z-index:-2;
}