body{
font-family: 'Inter', sans-serif;
background:#221a1a;
color:#f0ebe2;
margin:0;
text-align:center;
}

.logo{
font-family:'Space Grotesk', sans-serif;
font-size:100px;
margin-top:70px;
color:#38bdf8;
}

.est{
color:#94a3b8;
font-size:20px;
margin-top:-50px;
}

.intro{
width:60%;
margin:auto;
margin-top:40px;
line-height:1.7;
font-size:18px;
}

.menu{
margin-top:70px;
}

.menu a{
margin:20px;
padding:14px 35px;
background:#1e293b;
border-radius:10px;
text-decoration:none;
color:white;
font-weight:500;
transition:0.2s;
}

.menu a:hover{
background:#38bdf8;
color:#0f172a;
}

h1{
margin-top:60px;
font-family:'Space Grotesk', sans-serif;
font-size:50px;
color:#38bdf8;
}

/* project cards */

.project{
display:flex;
align-items:center;
gap:30px;
width:70%;
margin:40px auto;
background:#1e293b;
padding:25px;
border-radius:12px;
text-align:left;
}

.project img{
width:400px;
border-radius:10px;
}

/* gallery */

.countries button{
margin:10px;
padding:12px 20px;
border:none;
background:#1e293b;
color:white;
border-radius:8px;
cursor:pointer;
}

.countries button:hover{
background:#38bdf8;
color:#0f172a;
}

#gallery-container{
display:flex;
flex-wrap:wrap;
justify-content:center;
margin-top:30px;
}

#gallery-container img{
width:350px;
margin:15px;
border-radius:10px;
pointer-events:none;
user-select:none;
}

/* tips */

.tip-box{
background:#1e293b;
padding:30px;
width:50%;
margin:40px auto;
border-radius:12px;
font-size:18px;
}

button{
padding:12px 25px;
font-size:16px;
border:none;
border-radius:8px;
background:#38bdf8;
cursor:pointer;
}

button:hover{
opacity:0.8;
}

.back{
padding:12px 25px;
font-size:16px;
border-radius:8px;
background:#38bdf8;
cursor:pointer;
margin-top:30px;
margin-bottom:30px;
color:#ffffff;
text-decoration:none;
}

.contact-form{
width:40%;
margin:40px auto;
background:#1e293b;
padding:30px;
border-radius:12px;
}

.contact-form input,
.contact-form textarea{

width:100%;
padding:12px;
margin:10px 0;
border:none;
border-radius:8px;
font-family:'Inter', sans-serif;

}

.contact-form textarea{
height:120px;
resize:none;
}

.tip-box a{
color:#38bdf8;
text-decoration:none;
}

.tip-box a:hover{
text-decoration:underline;
}