*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:tahoma;
direction: rtl;
}

body{

direction:rtl;
background:#eef2f5;

}

.mails {
    direction: ltr;
}

.container{

width:90%;
max-width:1200px;
margin:40px auto;

}

.back-btn{

display:inline-block;
padding:12px 24px;
background:#053734;
color:white;
text-decoration:none;
border-radius:8px;
margin-bottom:25px;
transition:.3s;

}

.back-btn:hover{

background:#D4AF37;
color:#053734;

}

.hero{

height:320px;
background:url("../../images/contact.jpg") center/cover;
border-radius:20px;
overflow:hidden;
margin-bottom:35px;

}

.overlay{

height:100%;
background:rgba(5,55,52,.75);
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
color:white;

}

.overlay h1{

font-size:50px;
color:#D4AF37;
margin-bottom:15px;

}

.contact-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
margin-bottom:35px;

}

.contact-card{

background:white;
padding:30px;
border-radius:15px;
text-align:center;
box-shadow:0 8px 20px rgba(0,0,0,.08);
border-top:5px solid #D4AF37;
transition:.3s;

}

.contact-card:hover{

transform:translateY(-6px);

}

.icon{

font-size:50px;
margin-bottom:15px;

}

.contact-card h3{

color:#053734;
margin-bottom:10px;

}

.contact-card p{

font-size:18px;

}

.address-box,
.map-box,
.message-box{

background:white;
padding:35px;
border-radius:18px;
margin-bottom:35px;
box-shadow:0 8px 20px rgba(0,0,0,.08);

}

.address-box h2,
.map-box h2,
.message-box h2{

color:#053734;
margin-bottom:20px;
border-right:5px solid #D4AF37;
padding-right:12px;

}

.address-box p,
.message-box p{

font-size:18px;
line-height:2;

}

iframe{

width:100%;
height:450px;
border:none;
border-radius:12px;

}

@media(max-width:768px){

.hero{

height:220px;

}

.overlay h1{

font-size:34px;

}

iframe{

height:300px;

}

}