.blog-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        border: 1px solid rgba(0,0,0,0.1);
    }
    .blogs-bg{background: #faf7f1;
    }
    
    .blog-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    }

    
    .blog-card h3 {
        color: #4A4238;
        transition: color 0.2s ease;font-family: 'Lato-Bold';
    }
    
    .blog-card:hover h3 {
        color: #4A4238;}
    .btn-readmore{
        background-color: #B85B47;
        color: white;
    }
    .btn-readmore:hover{
        background-color: #4A4238;
        color: white;
    }
    .badge{
        background-color: #B85B47;
    }
    .filter-header{ background-color: #B85B47; color: white;}
.form-check-input:checked{background-color: #B85B47;border-color: #B85B47;}

.l-trends a{
    color: #4A4238;
}
.l-trends p{color: #B85B47;}
    @media (max-width: 767.98px) {
        .blog-card .col-md-4 {
            height: 200px;
        }
    }

.page-link{color:#B85B47;}
.page-link:hover{color:#B85B47;}

.active>.page-link { background-color:#B85B47;border: #B85B47;}
.blog-img{align-content: center;}
.blog-img img{background: #faf7f1;height: 180px !important;object-fit: cover;padding: 15px;border-radius: 2rem;}


/* blog detail page */

    .blog-title{
        background-color: #B85B47;
        color: white;
    }
    .recommended-reads h6{
        color: #4A4238;
    }
    .recommended-reads h6:hover{color: #B85B47;}
    .trendings h6{
        color: #4A4238;
    }
    .trendings h6:hover{color: #B85B47;}
    .trendings p{
        color: #B85B47;
    }
    .trendings p:hover{
        color: #4A4238;
    }
    .categories-list{
        background: #faf7f1;
    }
    .category-title{
        color: #4A4238;
    }
    .category-title-count{
        color: #B85B47;
        background-color: rgba(184, 91, 71, 0.1);
    }

    .card-header{color:#ffffff;background: #4A4238;}
    .sidebar-body{background: #faf7f1;}
    .content {
        line-height: 1.8;
        font-size: 1.1rem;
        color: #4a4a4a;
    }
    .content img {
        max-width: 100%;
        height: auto;
        border-radius: 0.75rem;
        margin: 2rem 0;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }
    
    .content h2, 
    .content h3, 
    .content h4 {
        margin-top: 2.5rem;
        margin-bottom: 1.25rem;
        font-weight: 600;
    }
    
    .content h2 {
        font-size: 1.75rem;
        border-bottom: 1px solid #eee;
        padding-bottom: 0.5rem;
    }
    
    .content h3 {
        font-size: 1.5rem;
    }
    
    .content ul, 
    .content ol {
        padding-left: 1.5rem;
    }
    
    .content ul li, 
    .content ol li {
        margin-bottom: 0.5rem;
    }
    
    .content blockquote {
        padding: 1.5rem;
        border-left: 4px solid #0d6efd;
        background-color: #f8f9fa;
        font-style: italic;
        border-radius: 0.5rem;
        margin: 2rem 0;
    }
    
    .content pre {
        background-color: #f8f9fa;
        padding: 1.5rem;
        border-radius: 0.5rem;
        overflow-x: auto;
        margin: 2rem 0;
    }
    
    .content code {
        background-color: #f8f9fa;
        padding: 0.2rem 0.4rem;
        border-radius: 0.25rem;
        font-size: 0.9em;
    }
    
    .hover-shadow {
        box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075);
    }
    
    .hover-shadow:hover {
        box-shadow: 0 1rem 2rem rgba(0,0,0,0.1);
        transform: translateY(-3px);
    }
    
    .transition-all {
        transition: all 0.3s ease;
    }
    
    .hover-bg-light:hover {
        background-color: #f8f9fa;
    }
    
    .rounded-4 {
        border-radius: 1rem !important;
    }
    
    /* Table styling */
    .content table {
        width: 100%;
        margin: 2rem 0;
        border-collapse: collapse;
    }
    
    .content table th,
    .content table td {
        padding: 0.75rem;
        border: 1px solid #dee2e6;
    }
    
    .content table th {
        background-color: #f8f9fa;
        font-weight: 600;
    }
.event-info {
        background-color: #f8f9fa;
        border-radius: 4px;
        padding: 8px;
        margin-top: 10px;
        font-size: 0.85rem;
    }
    .event-info i {
        margin-right: 5px;
    }
    .blog-loc{color: #B85B47 !important;}