[data-city-blogs][hidden], .city-blog-controls[hidden] { display:none !important; }
.city-blog-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.city-blog-grid > .guide-card { grid-column:auto; }
.city-local-blog { display:flex; min-width:0; min-height:220px; flex-direction:column; align-items:flex-start; padding:26px; overflow:hidden; border:1px solid rgba(42,50,98,.1); border-radius:25px; color:#191b2d; background:rgba(255,255,255,.9); box-shadow:0 18px 42px rgba(38,42,81,.06); text-decoration:none; }
.city-local-blog:hover { transform:translateY(-3px); }
.city-local-blog .guide-card-label { display:inline-flex; margin:0 0 16px; padding:6px 9px; border-radius:999px; color:#5b4df5; background:#efedff; font-size:10px; font-weight:800; letter-spacing:.08em; }
.city-local-blog h3 { margin:0 0 12px; color:#191b2d; font-size:clamp(1.2rem,2vw,1.6rem); line-height:1.25; letter-spacing:-.025em; overflow-wrap:anywhere; }
.city-local-blog p { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; margin:0; color:#626573; font-size:14px; line-height:1.65; overflow-wrap:anywhere; }
.city-local-blog .guide-card-meta { margin-top:auto; padding-top:20px; color:#747787; font-size:12px; line-height:1.6; font-weight:600; }
.city-local-blog-cover { display:block; width:100%; aspect-ratio:16/9; margin-bottom:20px; border-radius:15px; object-fit:cover; }
.city-local-blog-read { margin-top:12px; color:#5142ce; font-size:13px; font-weight:700; }
.city-blog-controls { grid-column:1/-1; display:flex; align-items:center; flex-wrap:wrap; gap:14px; }
.city-blog-controls [role=status] { color:#626573; font-size:13px; }
.city-blog-controls button { min-height:44px; padding:10px 18px; border:1px solid #d9d3f7; border-radius:999px; color:#5142ce; background:rgba(255,255,255,.9); font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.city-blog-controls button:disabled { opacity:.5; cursor:wait; }
.city-local-blog:focus-visible, .city-blog-controls button:focus-visible { outline:3px solid #8f80ed; outline-offset:4px; }
@media(max-width:600px) { .city-blog-grid { grid-template-columns:minmax(0,1fr); } .city-local-blog { min-height:0; padding:22px; } }
