/* ===== BLOG GRID ===== */
.vre-blog-wrap{max-width:1200px;margin:0 auto;padding:40px 20px;}
.vre-blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
@media(max-width:1024px){.vre-blog-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.vre-blog-grid{grid-template-columns:1fr;}}
.vre-card{background:#1A1A1A;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 4px 20px rgba(0,0,0,.4);transition:transform .25s,box-shadow .25s;}
.vre-card:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(0,0,0,.55);}
.vre-card__img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;}
.vre-card__img-wrap{overflow:hidden;}
.vre-card__img-placeholder{width:100%;aspect-ratio:16/9;background:#2a2a2a;display:flex;align-items:center;justify-content:center;color:#555;font-size:13px;}
.vre-card__body{padding:20px;flex:1;display:flex;flex-direction:column;gap:10px;}
.vre-card__meta{font-size:12px;color:#888;display:flex;align-items:center;gap:6px;}
.vre-card__dot{color:#444;}
.vre-card__title{font-size:17px;font-weight:700;color:#fff;line-height:1.35;text-decoration:none;display:block;}
.vre-card__title:hover{color:#F2D027;}
.vre-card__excerpt{font-size:13px;color:#aaa;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.vre-card__author{display:flex;align-items:center;gap:8px;font-size:12px;color:#777;margin-top:auto;}
.vre-card__avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;background:#333;}
.vre-card__cta{display:inline-block;background:#F2D027;color:#111;font-weight:700;font-size:13px;padding:8px 20px;border-radius:30px;text-decoration:none;margin:0 20px 0;transition:background .2s,transform .15s;}
.vre-card__cta:hover{background:#ffd900;transform:scale(1.03);}
.vre-card__bar{display:flex;align-items:center;gap:0;border-top:1px solid #2a2a2a;padding:12px 20px 16px;margin-top:4px;}
.vre-bar-btn{background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:5px;font-size:13px;color:#888;padding:6px 10px;border-radius:8px;transition:color .2s,background .2s;position:relative;}
.vre-bar-btn:hover{background:#242424;color:#F2D027;}
.vre-bar-btn.liked{color:#e74c3c;}
.vre-bar-btn.liked svg{fill:#e74c3c;}
.vre-bar-btn svg{width:16px;height:16px;fill:currentColor;transition:transform .2s;}
@keyframes vre-heart-pop{0%{transform:scale(1)}40%{transform:scale(1.5)}70%{transform:scale(.9)}100%{transform:scale(1)}}
.vre-heart-pop svg{animation:vre-heart-pop .4s ease;}
.vre-share-wrap{position:relative;}
.vre-share-menu{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#222;border:1px solid #333;border-radius:10px;padding:8px;min-width:200px;z-index:999;display:none;flex-direction:column;gap:4px;box-shadow:0 8px 30px rgba(0,0,0,.6);}
.vre-share-menu.open{display:flex;}
.vre-share-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;text-decoration:none;font-size:13px;color:#ddd;transition:background .15s;}
.vre-share-item:hover{background:#2d2d2d;color:#F2D027;}
.vre-share-item svg{width:18px;height:18px;flex-shrink:0;}
.vre-share-copied{color:#2ecc71 !important;}
.vre-comments-count{margin-left:auto;}
.vre-load-more-wrap{text-align:center;margin-top:40px;}
.vre-load-more{background:transparent;border:2px solid #F2D027;color:#F2D027;font-weight:700;font-size:14px;padding:12px 36px;border-radius:30px;cursor:pointer;transition:background .2s,color .2s;}
.vre-load-more:hover{background:#F2D027;color:#111;}
.vre-load-more:disabled{opacity:.5;cursor:not-allowed;}
.vre-single-bar{display:flex;align-items:center;gap:8px;border-top:1px solid #2a2a2a;border-bottom:1px solid #2a2a2a;padding:14px 0;margin:30px 0;}
.vre-back-btn{display:inline-flex;align-items:center;gap:8px;background:#F2D027;color:#111;font-weight:700;font-size:13px;padding:10px 22px;border-radius:30px;text-decoration:none;margin-bottom:24px;transition:background .2s;}
.vre-back-btn:hover{background:#ffd900;}
.vre-blog-header{text-align:center;padding:50px 20px 30px;}
.vre-blog-header h1{font-size:36px;font-weight:800;color:#fff;margin-bottom:10px;}
.vre-blog-header p{color:#888;font-size:15px;}