/* blogindex page styles (moved out of the 4 locale pages; shared and cacheable). */
.blog-hero { background: linear-gradient(120deg, #0f2e59, #0b6a88); color: #eaf1ff; padding: 28px 0; }
.blog-hero h1 { font-size: 32px; margin: 0 0 6px; }
.blog-hero p { margin: 0; opacity: 0.85; }
.blog-card { border: none; border-radius: 16px; box-shadow: 0 18px 30px rgba(9, 20, 35, 0.08); overflow: hidden; }
.blog-card img { width: 100%; height: 180px; object-fit: cover; }
.blog-meta { font-size: 12px; color: #6b7a95; }
.blog-empty { padding: 36px 0; text-align: center; color: #6b7a95; }
.blog-read { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #0f2e59; text-decoration: none; }
.blog-read span { display: inline-block; transition: transform 0.2s ease; }
.blog-read:hover { text-decoration: none; color: #0b5bd3; }
.blog-read:hover span { transform: translateX(3px); }
.blog-ad { margin: 18px 0 24px; min-height: 280px; } /* reserved for the responsive ad: no layout shift when it fills */