body{
font-family:Arial;
margin:0;
background:#f5f7fb;
}

/* HEADER */

.header{
background:#0d6efd;
color:white;
padding:25px;
text-align:center;
}

/* LAYOUT */

.container{
max-width:1200px;
margin:auto;
display:flex;
gap:30px;
padding:30px;
}

/* FILTER */

.filters{
width:260px;
background:white;
padding:20px;
border-radius:10px;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
}

.filters input,
.filters select{
width:100%;
padding:10px;
margin-bottom:10px;
}

/* TUTOR CARD */

.tutor-card{
display:flex;
gap:20px;
background:white;
padding:20px;
margin-bottom:20px;
border-radius:10px;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
}

.tutor-card img{
width:140px;
height:140px;
object-fit:cover;
border-radius:10px;
}

.rating{
color:#ff9800;
font-size:18px;
}

/* BUTTON */

.contact-btn{
background:#28a745;
color:white;
padding:10px 15px;
border:none;
border-radius:6px;
cursor:pointer;
}

/* PAGINATION */

.pagination{
text-align:center;
margin-top:20px;
}

.pagination a{
background:#0d6efd;
color:white;
padding:8px 14px;
margin:4px;
border-radius:5px;
text-decoration:none;
}

/* SEO */

.seo{
max-width:1200px;
margin:40px auto;
background:white;
padding:40px;
border-radius:10px;
box-shadow:0 4px 12px rgba(0,0,0,0.08);
line-height:1.7;
}

/* FOOTER */

.footer{
background:#222;
color:#ccc;
text-align:center;
padding:25px;
margin-top:40px;
}

/* POPUP */

.popup{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
justify-content:center;
align-items:center;
}

.popup-box{
background:white;
padding:30px;
border-radius:10px;
width:320px;
}
