/* ════════════════════════════════════════════════════════════════════
 * CarbonReport Pro — Blog visual layer (additive, brand-aligned)
 * Loaded AFTER each blog page's own styles. Upgrades existing classes
 * only — no markup changes required.
 * ════════════════════════════════════════════════════════════════════ */

/* Hero: brand gradient + geodesic mark watermark */
.page-hero, .article-hero {
  background: linear-gradient(150deg, #0A0F3A 0%, #141A5E 52%, #0F172A 100%) !important;
}
.page-hero::before, .article-hero::before {
  content: '';
  position: absolute;
  right: -120px; top: 50%;
  transform: translateY(-50%);
  width: 420px; height: 420px;
  background: url('/assets/carbonreport-mark.svg') center/contain no-repeat;
  opacity: 0.07;
  pointer-events: none;
}
.page-hero, .article-hero { position: relative; overflow: hidden; }

/* Blog index cards: brand accents instead of off-brand indigo */
.bc-tag {
  background: rgba(221, 74, 24, 0.10) !important;
  color: #C23F12 !important;
}
.blog-card { position: relative; }
.blog-card::before {
  content: '';
  position: absolute; inset: 0 auto auto 0;
  width: 100%; height: 3px;
  background: linear-gradient(90deg, #0C1244 0%, #DD4A18 100%);
  opacity: 0; transition: opacity .2s;
}
.blog-card:hover::before { opacity: 1; }
.blog-card:hover {
  border-color: #CBD5E1 !important;
  box-shadow: 0 12px 36px rgba(12, 18, 68, 0.12) !important;
}
.bc-read { color: #DD4A18 !important; }

/* Article typography rhythm */
.article-body h2, article h2 {
  color: #0C1244;
  margin-top: 2.2em;
  padding-top: 0.6em;
  border-top: 1px solid #E2E8F0;
  letter-spacing: -0.01em;
}
.article-body h3, article h3 { color: #0C1244; margin-top: 1.6em; }
.article-body p, article p { line-height: 1.75; }

/* Callouts & warnings: unified brand treatment */
.callout {
  border-left: 4px solid #0C1244 !important;
  background: #F8FAFC !important;
  border-radius: 10px;
}
.warning-box {
  border-left: 4px solid #B45309 !important;
  background: #FFFBEB !important;
  border-radius: 10px;
}

/* Data tables: navy header, zebra rows */
.data-table th { background: #0C1244 !important; color: #fff !important; }
.data-table tr:nth-child(even) td { background: #F8FAFC; }
.data-table td, .data-table th { padding: 10px 12px; }

/* Sidebar CTA: brand gradient */
.sidebar-cta {
  background: linear-gradient(150deg, #0A0F3A, #141A5E) !important;
  border-radius: 14px;
}
.btn-orange-sm, .mobile-cta a { background: #DD4A18 !important; }

/* Footer link color safety on navy */
.foot-links a:hover { color: #FF8659 !important; }