@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;700;800&display=swap');

body{
font-family:'Heebo', Arial, sans-serif;
margin:0;
background:#f5f5f5;
direction:rtl;
color:#374046;
line-height:1.8;
}

/* banner */

.banner{
background:#365b6d;
text-align:center;
padding:28px;
}

.logo{
max-width:420px;
width:80%;
}

/* menu */

.menu{
text-align:center;
background:white;
padding:18px;
border-bottom:1px solid #e2e2e2;
}

.menu a{
margin:0 22px;
text-decoration:none;
font-weight:500;
font-size:1.15rem;
color:#3f474d;
}

.menu a:hover{
color:#365b6d;
}

/* title */

.title{
text-align:center;
padding:45px 20px 20px;
}

.title h1{
margin:0;
font-size:clamp(2.4rem,5vw,3.4rem);
font-weight:700;
color:#2f383d;
}

/* about */

.about{
display:flex;
justify-content:center;
align-items:center;
gap:48px;
padding:20px 20px 40px;
max-width:1100px;
margin:auto;
}

.about-text{
max-width:650px;
font-size:1.08rem;
}

.about-text h3{
font-size:1.5rem;
margin-bottom:14px;
color:#2f383d;
}

.about-text p{
margin-bottom:22px;
}

.about-image img{
width:280px;
border-radius:16px;
box-shadow:0 6px 20px rgba(0,0,0,0.15);
}

/* services */

#services{
padding:40px 20px 70px;
text-align:center;
}

#services h2{
font-size:clamp(1.8rem,3vw,2.6rem);
margin-bottom:40px;
color:#2f383d;
}

.service-grid{
display:grid;
grid-template-columns:repeat(2, minmax(260px,320px));
gap:28px;
justify-content:center;
}

.service-card{
background:#ececec;
border:2px solid #365b6d;
border-radius:18px;
padding:24px;
min-height:160px;
transition:all 0.2s ease;
}

.service-card:hover{
transform:translateY(-4px);
box-shadow:0 6px 16px rgba(0,0,0,0.12);
}

.service-card h3{
margin-top:0;
margin-bottom:12px;
font-size:1.3rem;
color:#2f383d;
}

.service-card p{
margin:0;
font-size:1rem;
color:#4b555c;
}

/* contact */

.contact{
text-align:center;
background:#e6e6e6;
padding:34px 20px 42px;
}

.contact h3{
margin-bottom:14px;
}

.contact a{
color:#365b6d;
text-decoration:none;
font-weight:500;
}

.contact a:hover{
text-decoration:underline;
}

/* workshops */

.page-title{
text-align:center;
margin:45px 20px 10px;
font-size:clamp(2rem,4vw,2.8rem);
color:#2f383d;
}

.workshop-grid{
display:flex;
justify-content:center;
gap:40px;
padding:40px 20px 70px;
flex-wrap:wrap;
}

.workshop-card{
text-align:center;
max-width:320px;
}

.workshop-card img{
width:100%;
border-radius:16px;
}

.workshop-card h3{
margin-top:14px;
font-size:1.3rem;
color:#2f383d;
}

/* mobile */

@media(max-width:900px){

.about{
flex-direction:column-reverse;
text-align:center;
}

.service-grid{
grid-template-columns:1fr;
}

}