/* ===========================
   BLOG PAGE
=========================== */

.blog-card{
    overflow:hidden;
    border-radius:24px;
}

.blog-card img{
    transition:.5s ease;
}

.blog-card:hover img{
    transform:scale(1.08);
}

.blog-card h3{
    margin-top:15px;
    margin-bottom:15px;
}

.blog-card p{
    margin-bottom:20px;
}

/* ===========================
   CONTACT PAGE
=========================== */

.contact-info-box{
    background:var(--white);
    padding:30px;
    border-radius:24px;
    box-shadow:var(--shadow);
    border:1px solid var(--border);
}

.contact-info-box h3{
    margin-bottom:20px;
}

.contact-item{
    display:flex;
    gap:15px;
    margin-bottom:20px;
}

.contact-icon{
    width:50px;
    height:50px;
    border-radius:50%;
    background:linear-gradient(
    135deg,
    var(--secondary),
    var(--accent)
    );

    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:20px;
}

/* ===========================
   FAQ PAGE
=========================== */

.faq-category{
    background:var(--white);
    padding:25px;
    border-radius:24px;
    border:1px solid var(--border);
    margin-bottom:25px;
}

.faq-category h3{
    margin-bottom:20px;
}

/* ===========================
   PRIVACY + TERMS
=========================== */

.policy-content{
    background:var(--white);
    padding:40px;
    border-radius:30px;
    box-shadow:var(--shadow);
}

.policy-content h2{
    margin-bottom:20px;
    color:var(--primary);
}

.policy-content p{
    margin-bottom:20px;
    color:var(--muted);
}

/* ===========================
   TEAM SECTION
=========================== */

.team-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

.team-card{
    background:var(--white);
    border-radius:24px;
    overflow:hidden;
    text-align:center;
    box-shadow:var(--shadow);
}

.team-card img{
    height:280px;
    object-fit:cover;
}

.team-card-content{
    padding:25px;
}

.team-card h3{
    margin-bottom:8px;
}

.team-card p{
    color:var(--muted);
}

/* ===========================
   CASE STUDY
=========================== */

.case-card{
    overflow:hidden;
}

.case-card img{
    border-radius:18px;
}

.case-card p{
    margin-top:10px;
}

/* ===========================
   TESTIMONIALS
=========================== */

.testimonial-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}

.testimonial-box{
    background:var(--white);
    padding:30px;
    border-radius:24px;
    box-shadow:var(--shadow);
}

.testimonial-box img{
    width:70px;
    height:70px;
    border-radius:50%;
    margin-bottom:15px;
}

/* ===========================
   CLIENT LOGOS
=========================== */

.client-logos{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:20px;
}

.client-logo{
    background:var(--white);
    padding:20px;
    border-radius:18px;
    text-align:center;
    box-shadow:var(--shadow);
}

/* ===========================
   NEWSLETTER
=========================== */

.newsletter{
    background:linear-gradient(
    135deg,
    var(--secondary),
    var(--accent)
    );

    padding:60px;
    border-radius:30px;
    color:#fff;
    text-align:center;
}

.newsletter h2{
    margin-bottom:15px;
}

.newsletter form{
    max-width:600px;
    margin:auto;
    display:flex;
    gap:10px;
}

.newsletter input{
    flex:1;
    padding:15px;
    border:none;
    border-radius:50px;
}

.newsletter button{
    border:none;
    cursor:pointer;
}

/* ===========================
   RESPONSIVE
=========================== */

@media(max-width:992px){

.team-grid,
.testimonial-grid,
.client-logos{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

.team-grid,
.testimonial-grid,
.client-logos{
    grid-template-columns:1fr;
}

.newsletter{
    padding:40px 20px;
}

.newsletter form{
    flex-direction:column;
}

}