body{
font-family:Arial;
margin:0;
background:#f4f6fb;
}

header{
background:#111;
color:white;
padding:20px;
text-align:center;
}

.nav{
display:flex;
justify-content:space-between;
max-width:1000px;
margin:auto;
align-items:center;
}

.hero{
padding:60px;
text-align:center;
}

.services{
background:white;
padding:40px;
}

.services ul{
max-width:700px;
margin:auto;
}

.pricing{
padding:50px;
text-align:center;
}

.plans{
display:flex;
justify-content:center;
gap:30px;
}

.plan{
background:white;
padding:20px;
border:1px solid #ddd;
width:200px;
}

.contact{
background:white;
padding:40px;
text-align:center;
}

form{
max-width:500px;
margin:auto;
display:flex;
flex-direction:column;
gap:10px;
}

form input,textarea{
padding:10px;
}

#chatButton{
position:fixed;
bottom:20px;
right:20px;
padding:15px;
cursor:pointer;
}

.chatbox{
display:none;
position:fixed;
bottom:80px;
right:20px;
width:320px;
height:420px;
background:white;
border:1px solid #ccc;
}

.chat-header{
background:#111;
color:white;
padding:10px;
}

.chat-messages{
height:300px;
overflow-y:auto;
padding:10px;
font-size:14px;
}

.chat-input{
display:flex;
}

.chat-input input{
flex:1;
padding:10px;
border:none;
border-top:1px solid #ccc;
}

.chat-input button{
padding:10px;
border:none;
background:#111;
color:white;
}