*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial,sans-serif;
}

body{
background:linear-gradient(-45deg,#833ab4,#fd1d1d,#fcb045,#405de6);
background-size:400% 400%;
animation:bg 10s ease infinite;
color:white;
text-align:center;
min-height:100vh;
padding:20px;
}

@keyframes bg{
0%{background-position:0% 50%;}
50%{background-position:100% 50%;}
100%{background-position:0% 50%;}
}

.profile{
width:170px;
height:170px;
border-radius:50%;
border:5px solid white;
margin-top:30px;
object-fit:cover;
box-shadow:0 0 20px rgba(255,255,255,.4);
}

h1{
margin-top:15px;
font-size:35px;
}

p{
margin-top:8px;
color:#eee;
}

.buttons{
margin-top:30px;
display:flex;
flex-direction:column;
gap:15px;
}

.btn{
text-decoration:none;
background:white;
color:#000;
padding:15px;
border-radius:40px;
font-size:18px;
font-weight:bold;
transition:.3s;
}

.btn:hover{
transform:scale(1.05);
}

.about,.gallery,.chat,.contact{
margin-top:50px;
background:rgba(255,255,255,.12);
padding:20px;
border-radius:20px;
backdrop-filter:blur(12px);
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
gap:15px;
margin-top:20px;
}

.grid img{
width:100%;
border-radius:15px;
}

input,textarea{
width:100%;
padding:12px;
margin-top:10px;
border:none;
border-radius:10px;
}

button{
margin-top:15px;
padding:12px 20px;
border:none;
border-radius:10px;
cursor:pointer;
font-size:16px;
}

footer{
margin-top:40px;
padding:20px;
}
