.blog-header { background: #0b2740; color: #fff; border-bottom: 1px solid #31495e; }
.blog-nav { position: relative; z-index: 5; max-width: 1240px; margin: auto; min-height: 110px; display: flex; align-items: center; gap: 30px; padding: 18px 30px; color: #fff; font-family: "Avenir Next", Avenir, "Trebuchet MS", "Segoe UI", sans-serif; letter-spacing: 0; }
.blog-brand { margin-right: auto; flex-shrink: 0; }
.blog-brand img { display: block; width: 220px; height: 72px; object-fit: contain; filter: brightness(0) invert(1); }
.blog-nav-links { display: flex; align-items: center; gap: 24px; font-size: 15px; }
.blog-nav-links a { color: inherit; text-decoration: none; padding: 10px 0; }
.blog-nav-links a[aria-current], .blog-nav-links a:hover, .blog-mobile-menu a[aria-current] { color: #d8a553; }
.blog-nav .blog-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 10px 20px; background: #d8a553; color: #061a2d; border: 1px solid transparent; border-radius: 5px; text-decoration: none; font-weight: 700; font-size: 15px; white-space: nowrap; }
.blog-nav .blog-button:hover { background: #e7bc76; }
.blog-nav a:focus-visible, .blog-mobile-menu summary:focus-visible { outline: 3px solid #d8a553; outline-offset: 4px; }
.blog-nav .blog-mobile-menu { display: none; position: relative; margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.blog-mobile-menu summary { display: block; min-height: 44px; line-height: 28px; padding: 8px; cursor: pointer; color: #fff; font-size: 15px; font-weight: 600; list-style: none; }
.blog-mobile-menu summary::-webkit-details-marker { display: none; }
.blog-mobile-menu summary::after, .blog-mobile-menu[open] summary::after { content: none; }
.blog-mobile-menu div { position: absolute; right: 0; top: 48px; width: 200px; padding: 12px; background: #0b2740; border: 1px solid #496276; border-radius: 5px; z-index: 5; box-shadow: 0 12px 30px #0003; }
.blog-mobile-menu a { display: block; padding: 10px; color: #fff; text-decoration: none; font-size: 15px; }
.blog-mobile-menu a:hover { background: #1e4567; }
@media (max-width: 1000px) {
  .blog-nav { gap: 18px; flex-wrap: wrap; }
  .blog-nav-links { display: none; }
  .blog-nav .blog-mobile-menu { display: block; }
  .blog-nav .blog-brand img { width: 190px; height: 62px; }
}
@media (max-width: 640px) {
  .blog-nav { padding: 16px 20px; gap: 8px 16px; min-height: 90px; }
  .blog-nav .blog-brand img { width: 180px; height: 58px; }
  .blog-nav > .blog-button { order: 3; min-height: 44px; width: 100%; }
}