/* BidCatch shared styles — mirrors index.html inline styles plus article/blog additions */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #ffffff; color: #1b1b1b; line-height: 1.6; }
.wrap { max-width: 880px; margin: 0 auto; padding: 0 24px; }

header { position: sticky; top: 0; background: #ffffff; z-index: 50; border-bottom: 1px solid #dfe1e2; }
.head-inner { max-width: 880px; margin: 0 auto; padding: 14px 24px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.logo { display: flex; align-items: center; gap: 9px; text-decoration: none; }
.logo .word { font-size: 20px; font-weight: 800; letter-spacing: 0.01em; color: #1a4480; }
.logo .word span { color: #005ea2; }
.header-contact { font-size: 14px; color: #565c65; text-decoration: none; }
.header-contact:hover { color: #005ea2; }
.topnav { display: flex; align-items: center; gap: 18px; font-size: 14px; flex-wrap: wrap; justify-content: flex-end; }
.topnav a { color: #565c65; text-decoration: none; white-space: nowrap; }
.topnav a:hover { color: #005ea2; }
.topnav .nav-cta { background: #005ea2; color: #ffffff; font-weight: 700; padding: 8px 16px; border-radius: 6px; }
.topnav .nav-cta:hover { background: #0b4778; color: #ffffff; }
@media (max-width: 640px) {
  .topnav { gap: 12px; font-size: 13px; }
  .topnav a.hide-sm { display: none; }
}

footer { padding: 32px 0 48px; border-top: 1px solid #dfe1e2; font-size: 13px; color: #71767a; }
footer a { color: #565c65; }

/* Blog index */
.postlist { list-style: none; padding: 0; margin: 28px 0 48px; }
.postlist li { border-top: 1px solid #e6e6e6; padding: 20px 0; }
.postlist a { color: #005ea2; font-weight: 700; font-size: 18px; text-decoration: none; }
.postlist a:hover { text-decoration: underline; }
.postlist .pm { color: #71767a; font-size: 13px; margin-top: 4px; }
.page-head { padding: 56px 0 8px; }
.page-head h1 { font-size: 34px; font-weight: 800; letter-spacing: -0.01em; margin-bottom: 8px; }
.page-head p { font-size: 16px; color: #565c65; max-width: 620px; }

/* Article pages */
article { padding: 48px 0 56px; max-width: 720px; }
article h1 { font-size: 32px; font-weight: 800; line-height: 1.2; margin-bottom: 6px; letter-spacing: -0.01em; }
article .post-meta { color: #71767a; font-size: 13px; margin-bottom: 30px; }
article h2 { font-size: 20px; font-weight: 700; margin: 34px 0 10px; letter-spacing: -0.01em; }
article p, article li { font-size: 15px; color: #3d4555; }
article p { margin-bottom: 14px; }
article .lede { font-size: 17px; color: #1b1b1b; }
article ul { padding-left: 22px; margin: 8px 0 16px; }
article li { margin-bottom: 6px; }
article a { color: #005ea2; }
.cta-box { background: #f5f7fa; border: 1px solid #dfe1e2; border-radius: 8px; padding: 22px 24px; margin-top: 36px; text-align: center; }
.cta-box p { margin-bottom: 12px; font-size: 15px; }
.cta { display: inline-block; background: #005ea2; color: #ffffff; font-weight: 700; font-size: 15px; padding: 12px 26px; border-radius: 6px; text-decoration: none; }
.cta:hover { background: #0b4778; }

/* Mobile nav restructure (2026-09-27): two tidy rows — logo row, then links + CTA all left-aligned */
@media (max-width: 640px) {
  .head-inner { flex-wrap: wrap; row-gap: 8px; padding: 10px 20px; }
  .head-inner .logo { margin-right: auto; }
  .topnav { order: 3; flex-basis: 100%; justify-content: flex-start; gap: 6px 16px; }
  .topnav .nav-cta { padding: 8px 14px; }
}