.blog-dark-wrap { background-color: #111; padding: 80px 0; color: #fff; }
.blog-dark-wrap h2 { font-size: 36px; font-weight: 700; color: #fff; margin-bottom: 10px; text-transform: uppercase; text-align: center;}
.blog-dark-wrap h3 { font-family: 'Allison', cursive; font-size: 60px; color: #DBC078; margin-top: 0; margin-bottom: 60px; text-align: center;}

.blog-dark-card { background: #222; border-radius: 10px; overflow: hidden; border: 1px solid #333; transition: all 0.3s; margin-bottom: 30px; display: flex; flex-direction: column; height: calc(100% - 30px); }
.blog-dark-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0,0,0,0.5); border-color: #DBC078; }

.blog-dark-card figure { margin: 0; position: relative; overflow: hidden; }
.blog-dark-card img { width: 100%; transition: transform 0.5s; display: block; object-fit: cover; aspect-ratio: 4/3; }
.blog-dark-card:hover img { transform: scale(1.05); }

.blog-dark-text { padding: 25px; text-align: left; display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between; }
.blog-dark-text h5 { color: #fff; font-size: 20px; font-weight: 600; margin-top: 0; margin-bottom: 15px; line-height: 28px; }
.blog-dark-text h5 a { color: inherit; text-decoration: none; transition: color 0.3s; }
.blog-dark-text h5 a:hover { color: #F7D098; }

.blog-info { list-style: none; padding: 0; margin: 0; display: flex; align-items: center; gap: 15px; border-top: 1px solid #333; padding-top: 15px; }
.blog-info li { font-size: 13px; color: #aaa; display: flex; align-items: center; }
.blog-info li i { color: #DBC078; margin-right: 5px; }

@media (min-width: 768px) {
    .row.flex-wrap { display: flex; flex-wrap: wrap; }
}