/* AI PAGE */

.ai-hero{
    margin-bottom:40px;
}

.ai-card{
    background:#0b1224;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:24px;
    padding:36px;
}

.ai-card h2{
    font-size:34px;
    margin-bottom:24px;

    background:linear-gradient(
        90deg,
        #8b5fff,
        #2ac9ff
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

    background-clip:text;
}

.ai-form{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.ai-form textarea{
    width:100%;
    min-height:180px;

    padding:20px;

    box-sizing:border-box;

    border-radius:18px;

    border:1px solid rgba(255,255,255,0.08);

    background:#111936;

    color:white;

    font-size:16px;

    resize:vertical;

    outline:none;
}

.ai-form textarea:focus{
    border-color:#8b5fff;
}

.ai-form button{
    width:100%;

    padding:18px;

    border:none;

    border-radius:18px;

    background:linear-gradient(
        90deg,
        #8b5fff,
        #2ac9ff
    );

    color:white;

    font-size:16px;

    font-weight:700;

    cursor:pointer;
}

.ai-response{
    margin-top:32px;

    padding:28px;

    background:#111936;

    border-radius:20px;

    border:1px solid rgba(255,255,255,0.08);
}

.ai-response h3{
    margin-bottom:18px;
    font-size:24px;
}

.ai-response p{
    color:#d7def7;
    line-height:1.8;
    font-size:17px;
}

/* MOBILE */

@media(max-width:768px){

    .ai-card{
        padding:24px;
        border-radius:20px;
    }

    .ai-card h2{
        font-size:24px;
        margin-bottom:20px;
    }

    .ai-form textarea{
        min-height:160px;
        padding:18px;
        border-radius:16px;
        font-size:16px;
    }

    .ai-form button{
        padding:16px;
        border-radius:16px;
        font-size:16px;
    }

    .ai-response{
        margin-top:24px;
        padding:22px;
        border-radius:18px;
    }

    .ai-response h3{
        font-size:20px;
    }

    .ai-response p{
        font-size:16px;
        line-height:1.7;
    }

}