/*
========================================
Blog Archive
========================================
*/


.blog .site-main,
.archive .site-main {

    padding:
    var(--space-2xl) 0;

}



/*
========================================
Blog Header
========================================
*/


.page-header {

    text-align:center;

    margin-bottom:
    var(--space-xl);

}



.page-header h1 {

    color:
    var(--medipro-primary);

    font-size:
    var(--text-4xl);

}



/*
========================================
Blog Grid
========================================
*/


.medipro-blog-grid {

    display:grid;

    grid-template-columns:
    repeat(3, 1fr);

    gap:
    var(--space-xl);

}



/*
========================================
Blog Card
========================================
*/


.medipro-post-card {

    background:
    var(--medipro-white);

    border-radius:
    var(--radius-md);

    overflow:hidden;

    box-shadow:
    var(--shadow-sm);

    transition:
    transform .3s ease,
    box-shadow .3s ease;

}



.medipro-post-card:hover {

    transform:
    translateY(-5px);

    box-shadow:
    var(--shadow-md);

}



/*
========================================
Featured Image
========================================
*/


.post-thumbnail {

    overflow:hidden;

}



.post-thumbnail img {

    width:100%;

    height:240px;

    object-fit:cover;

    display:block;

    transition:
    transform .3s ease;

}



.medipro-post-card:hover 
.post-thumbnail img {

    transform:
    scale(1.05);

}



/*
========================================
Post Content
========================================
*/


.post-content {

    padding:
    var(--space-lg);

}



/*
========================================
Post Meta
========================================
*/


.post-meta {

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:
    var(--space-sm);

    font-size:
    .875rem;

    color:
    var(--medipro-muted);

}



.post-meta a {

    color:
    var(--medipro-primary);

    text-decoration:none;

    font-weight:600;

}



/*
========================================
Post Title
========================================
*/


.post-title {

    font-size:
    var(--text-2xl);

    line-height:
    1.3;

    margin-bottom:
    var(--space-md);

}



.post-title a {

    color:
    var(--medipro-heading-color);

    text-decoration:none;

}



.post-title a:hover {

    color:
    var(--medipro-primary);

}



/*
========================================
Post Excerpt
========================================
*/


.post-excerpt {

    color:
    var(--medipro-muted);

    margin-bottom:
    var(--space-lg);

}



/*
========================================
Read More Button
========================================
*/


.medipro-post-card .btn {

    margin-top:
    var(--space-sm);

}



/*
========================================
Responsive
========================================
*/


@media(max-width:1024px){


.medipro-blog-grid {

    grid-template-columns:
    repeat(2,1fr);

}


}



@media(max-width:768px){


.medipro-blog-grid {

    grid-template-columns:
    1fr;

}



.post-thumbnail img {

    height:
    220px;

}


}


/*
========================================
Search Results
========================================
*/


.no-search-results {

    text-align:center;

    background:
    var(--medipro-white);

    padding:
    60px 30px;

    margin:
    var(--space-xl) 0;

    border-radius:
    var(--radius-md);

    box-shadow:
    var(--shadow-sm);

}



.no-search-results h2 {

    color:
    var(--medipro-heading-color);

    margin-bottom:
    var(--space-md);

}



.no-search-results p {

    color:
    var(--medipro-muted);

    margin-bottom:
    var(--space-xl);

}