
/* Basic blog layout */
.blog-container { max-width: 1000px; margin: 0 auto; padding: 24px; }
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.card { border: 1px solid #eee; border-radius: 16px; overflow: hidden; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.06); display:flex; flex-direction:column; }
.card img { width: 100%; height: 180px; object-fit: cover; }
.card-body { padding: 16px; display:flex; flex-direction:column; gap:8px; }
.card-title { font-size: 1.05rem; font-weight: 700; margin: 0; }
.card-meta { color: #666; font-size: .9rem; }
.tag { display:inline-block; padding: 2px 8px; border-radius: 999px; border:1px solid #ddd; margin-right:6px; font-size:.8rem; color:#333; }
.searchbar { display:flex; gap:12px; margin: 0 0 16px 0; }
.searchbar input { flex:1; padding:10px 12px; border-radius: 10px; border:1px solid #ddd; }
.searchbar select { padding:10px 12px; border-radius: 10px; border:1px solid #ddd; }
.post-hero { max-width: 1000px; margin: 0 auto; padding: 24px; }
.post-title { font-size: 2rem; font-weight: 800; margin: 0 0 4px; }
.post-meta { color:#666; margin-bottom: 12px; }
.carousel { position: relative; overflow: hidden; border-radius: 16px; }
.carousel-track { display: flex; transition: transform .3s ease; }
.carousel img { width: 100%; height: 420px; object-fit: cover; display:block; }
.carousel-nav { display:flex; gap:8px; justify-content:center; margin-top:10px; }
.carousel button { border:1px solid #ddd; background:#fff; padding:8px 12px; border-radius:10px; cursor:pointer; }
.carousel button:disabled { opacity:.4; cursor:default; }
.post-body { max-width: 800px; margin: 16px auto 80px; padding: 0 24px; }
@media (max-width: 640px){
  .carousel img { height: 240px; }
}

/* --- Gallery & Lightbox --- */
.gallery-grid {  display:grid; 
  grid-template-columns: repeat(3, 1fr) !important; 
  gap:14px; 
  margin: 16px auto; 
  max-width: 1100px; 
  padding: 0 24px;}
@media (max-width: 980px){
  .gallery-grid {  display:grid; 
  grid-template-columns: repeat(3, 1fr) !important; 
  gap:14px; 
  margin: 16px auto; 
  max-width: 1100px; 
  padding: 0 24px;}
}
@media (max-width: 640px){
  .gallery-grid {  display:grid; 
  grid-template-columns: repeat(3, 1fr) !important; 
  gap:14px; 
  margin: 16px auto; 
  max-width: 1100px; 
  padding: 0 24px;}
}
.gallery-grid img {  width:100% !important; 
  height:auto !important; 
  aspect-ratio: 4 / 3 !important; 
  object-fit: cover !important; 
  border-radius:12px; 
  cursor:pointer; 
  box-shadow:0 4px 12px rgba(0,0,0,.08);}
.gallery-grid img {  width:100% !important; 
  height:auto !important; 
  aspect-ratio: 4 / 3 !important; 
  object-fit: cover !important; 
  border-radius:12px; 
  cursor:pointer; 
  box-shadow:0 4px 12px rgba(0,0,0,.08);}
.lightbox { position:fixed; inset:0; background:rgba(0,0,0,.92); display:none; align-items:center; justify-content:center; z-index:9999; }
.lightbox.open { display:flex; }
.lightbox img { max-width:90vw; max-height:85vh; object-fit:contain; border-radius:12px; }
.lightbox .nav { position:absolute; display:flex; gap:16px; bottom:24px; }
.lightbox .btn { border:1px solid #666; background:#111; color:#eee; padding:10px 14px; border-radius:10px; cursor:pointer; }
.lightbox .close { position:absolute; top:16px; right:16px; background:#111; border:1px solid #666; color:#eee; padding:8px 10px; border-radius:10px; cursor:pointer; }
.post-nav-bottom {  width:100%;
  display:flex; 
  gap:12px; 
  justify-content:center !important; 
  align-items:center !important;
  margin: 24px auto 60px; 
  text-align:center;}
.post-nav-bottom button {  border:1px solid #ddd; 
  background:#fff; 
  padding:10px 16px; 
  border-radius:10px; 
  cursor:pointer; 
  min-width:120px;}
.post-nav-bottom button:disabled { opacity:.5; cursor:default; }

@media (max-width: 980px) {.gallery-grid} {
grid-template-columns: repeat(2, 1fr) !important;
}

@media (max-width: 640px) {.gallery-grid} {
grid-template-columns: 1fr !important;
}


/* --- Buttons (high contrast) --- */
.post-back { max-width:1000px; margin: 0 auto; padding: 0 24px; }
.post-back a, .post-back button {
  display:inline-block;
  background:#2563eb !important; /* blue-600 */
  color:#fff !important;
  border:none !important;
  padding:10px 14px !important;
  border-radius:10px !important;
  text-decoration:none;
  cursor:pointer;
}
.post-back a:hover, .post-back button:hover { background:#1e40af !important; } /* blue-800 */

.post-nav-bottom button {
  background:#2563eb !important;
  color:#fff !important;
  border:none !important;
  padding:12px 18px !important;
  border-radius:10px !important;
}
.post-nav-bottom button:hover { background:#1e40af !important; }

.lightbox .btn, .lightbox .close {
  background:#2563eb !important;
  border:none !important;
  color:#fff !important;
}
.lightbox .btn:hover, .lightbox .close:hover { background:#1e40af !important; }



/* --- Tag pills (improved) --- */
.tag {
  display:inline-block;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  border: 1px solid #2563eb !important;
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  font-size: .85rem !important;
  line-height: 1 !important;
  margin-right: 6px !important;
  margin-bottom: 6px !important;
}
.tag:hover { background: rgba(37,99,235,.16) !important; }

