/* Blog-only layout. Core Gray Goat Air branding is inherited from /assets/styles.css. */
.blog-hero{padding:4.5rem 1.25rem 3.25rem;text-align:center;background:linear-gradient(180deg,#f7f8f8 0%,#eef1f2 100%);border-bottom:1px solid #d9dfe3}
.blog-hero .eyebrow,.article-hero .eyebrow{margin:0 0 .65rem}
.blog-hero h1{max-width:1180px;margin:0 auto .9rem}
.blog-hero p{max-width:1040px;margin:0 auto;font-size:1.08rem;color:#53606b}
.blog-wrap{width:min(96vw,1480px);max-width:none;margin:0 auto;padding:3rem 1.25rem 4rem}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.35rem}
.post-card{background:#fff;border:1px solid #d9dfe3;border-radius:16px;overflow:hidden;box-shadow:0 10px 28px rgba(20,31,42,.06);display:flex;flex-direction:column;min-height:100%}
.post-card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#eef1f2}
.post-card-body{padding:1.2rem;display:flex;flex-direction:column;gap:.65rem;flex:1}
.post-card h2{margin:0;font-size:1.28rem;line-height:1.22}
.post-card h2 a{color:inherit;text-decoration:none}.post-card h2 a:hover{text-decoration:underline}
.post-meta{font-size:.78rem;font-weight:800;letter-spacing:.025em;color:#68737d}
.post-card p{margin:0;color:#4e5c66}.read-more{margin-top:auto;font-weight:900;text-decoration:none}
.pagination{display:flex;gap:.65rem;margin-top:1.5rem}.pagination a{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:.7rem 1rem;background:#f3f5f6;border:1px solid #d9dfe3;font-weight:900;text-decoration:none}
.blog-error{max-width:780px;margin:3rem auto;padding:1.2rem 1.3rem;border:1px solid #e3b7a3;background:#fff6f1;border-radius:12px}
.article-wrap{width:min(94vw,1240px);max-width:none;margin:0 auto;padding:3rem 1.25rem 4.5rem}.article-hero{margin-bottom:1.6rem}
.article-hero h1{margin:.35rem 0 .8rem;font-size:clamp(2.2rem,5vw,3.65rem);line-height:1.04}
.article-description{margin:0 0 1rem;font-size:1.12rem;color:#53606b}
.article-featured{width:100%;max-height:560px;object-fit:cover;border-radius:16px;margin:1rem 0 2rem;box-shadow:0 12px 30px rgba(20,31,42,.08)}
.article-body{font-size:1.06rem;line-height:1.75}.article-body h2{margin:2.2rem 0 .7rem;font-size:1.85rem;line-height:1.15}.article-body h3{margin:1.75rem 0 .6rem;font-size:1.38rem}
.article-body p{margin:0 0 1.15rem}.article-body ul,.article-body ol{margin:0 0 1.25rem;padding-left:1.4rem}.article-body li{margin:.4rem 0}
.article-body blockquote{margin:1.6rem 0;padding:1rem 1.2rem;border-left:4px solid #7f8a91;background:#f6f7f7;border-radius:0 10px 10px 0}
.article-body figure{margin:1.6rem 0}.article-body figure img{width:100%;max-width:100%;height:auto;border-radius:12px}.article-body figcaption{margin-top:.4rem;color:#68737d;font-size:.82rem}
.article-body pre{overflow:auto;padding:1rem;border-radius:10px;background:#202a31;color:#fff}
.blog-table-wrap{overflow:auto;margin:1.4rem 0;border:1px solid #d9dfe3;border-radius:10px}.article-body table{width:100%;border-collapse:collapse;font-size:.94rem}.article-body th,.article-body td{padding:.72rem;border-bottom:1px solid #e4e8ea;text-align:left}.article-body th{background:#f3f5f6}
.article-cta{margin-top:2.75rem;padding:1.4rem 1.5rem;border-radius:16px;background:#f0f2f3;border:1px solid #d9dfe3;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.article-cta h2{margin:0 0 .25rem}.article-cta p{margin:0;color:#53606b}
.faq{margin-top:2.5rem}.faq details{border:1px solid #d9dfe3;border-radius:10px;padding:.9rem 1rem;margin-bottom:.7rem;background:#fff}.faq summary{cursor:pointer;font-weight:900}
@media(max-width:900px){.post-grid{grid-template-columns:1fr 1fr}.article-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.post-grid{grid-template-columns:1fr}.blog-hero{padding:3.4rem 1rem 2.4rem}.blog-wrap{padding:2rem 1rem 3rem}.article-wrap{padding:2rem 1rem 4rem}}


.article-body{
  max-width:880px;
  margin-left:auto;
  margin-right:auto;
}
.article-hero,
.article-featured,
.article-cta,
.faq{
  width:100%;
}








/* Blog header stacking fix:
   Keep the SITE navigation identical to the rest of Gray Goat Air,
   while preventing the article's semantic <header> from inheriting nav styling. */
body > header{
  position:sticky !important;
  top:0;
  z-index:40 !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.8rem;
  padding:.45rem clamp(1rem,4.5vw,4.5rem);
  background:linear-gradient(90deg,#06172a,#03101f) !important;
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 25px rgba(0,0,0,.18);
}

/* The article header is content, not the navigation bar. */
.article-hero{
  position:static !important;
  top:auto !important;
  z-index:auto !important;
  display:block !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.blog-hero,
.blog-wrap,
.article-wrap,
main{
  position:relative;
  z-index:0;
}


/* Article header text contrast on light blog/article background */
.article-hero h1,
.article-hero h1 a{
  color:#06172a !important;
}

.article-hero .article-description{
  color:#53606b !important;
}

.article-hero .post-meta{
  color:#68737d !important;
}

.article-hero .eyebrow{
  color:var(--orange,#f28c28) !important;
}
