.profile{
    display: flex;
    gap: 1.25rem;
    align-items: center;
    padding: 1.5rem;
    background-color: rgba(99, 65, 122, 0.142);
    border-radius: 12px;
}

.pfp{
    width: clamp(80px, 20vw, 160px);
    height: auto;
    border-radius: 50%;
    border: 2px solid rgba(99, 65, 122, 0.346);
}

.info h1{
    font-size: clamp(1.2rem, 3vw, 1.6rem);
    margin-bottom: 0.25rem;
}

.info h3{
    font-size: clamp(0.9rem, 1.6vw, 1rem);
    font-weight: 400;
    color: rgba(255,255,255,0.9);
    margin: 0.15rem 0;
}

@media (max-width: 600px) {
    .profile {
        flex-direction: column;
        text-align: center;
        padding: 1rem;
    }

    .bio h3 {
        margin-bottom: 0.25rem;
    }
}