body{background:#f8f9fa;}
a{text-decoration:none;color:#0d6efd;transition:color 0.2s;}
a:hover{color:#0a58ca;}
.card{border-radius:10px;transition:transform 0.2s,box-shadow 0.2s;}
.card:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,0.15);}
.card-img-top{object-fit:cover;height:250px;}
@media(max-width:576px){.card-img-top{height:180px;}}
.badge{font-size:0.75rem;margin-right:3px;}

/* Home button - blue gradient */
.btn-color-home {
    background: linear-gradient(45deg, #1e90ff, #4facfe);
    color: #fff;
    border: none;
    transition: all 0.3s;
}
.btn-color-home:hover {
    background: linear-gradient(45deg, #4facfe, #1e90ff);
    color: #fff;
}

/* Support button - green gradient */
.btn-color-support {
    background: linear-gradient(45deg, #28a745, #7ee787);
    color: #fff;
    border: none;
    transition: all 0.3s;
}
.btn-color-support:hover {
    background: linear-gradient(45deg, #7ee787, #28a745);
    color: #fff;
}

.btn-color-blog {
    background: linear-gradient(45deg, #ff6600, #ff9a33);
    color: #fff;
    border: none;
    transition: all 0.3s;
}
.btn-color-blog:hover {
    background: linear-gradient(45deg, #ff9a33, #ff6600);
    color: #fff;
}


/* Optional: add shadow on hover */
.btn-color-home:hover,
.btn-color-support:hover {
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.post-header{margin-bottom:20px;}
.post-header img{max-height:400px;object-fit:cover;border-radius:10px;}
@media(max-width:576px){.post-header img{max-height:250px;}}
.badge{font-size:0.75rem;margin-right:3px;}
.related-posts h4{margin-bottom:20px;font-weight:600;}
.related-posts .card{border-radius:10px;transition:transform 0.2s,box-shadow 0.2s;}
.related-posts .card:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,0.15);}
.related-posts a{text-decoration:none;color:#0d6efd;transition:color 0.2s;}
.related-posts a:hover{color:#0a58ca;}

.related-posts .btn-primary {
    color: #fff !important;
}
.related-posts .btn-primary:hover {
    color: #fff !important;
}