/* Ezewag Blog CSS — extends main clean-site.css */
/* All core blog styles are now in clean-site.css */
/* This file handles blog-specific overrides only */

/* Blog hero uses navy background already set in main CSS */
.blog-hero {
  padding-top: calc(76px + 80px);
  padding-bottom: 80px;
}
.blog-card-visual {
  position: relative;
  min-height: 168px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 26% 24%, rgba(214,168,77,.36), transparent 28%),
    linear-gradient(135deg, #061a31 0%, #0d3158 58%, #d6a84d 160%);
}
.blog-card-visual::before {
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
}
.blog-card-visual::after {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
  transform: translate(46px, 18px);
}
.blog-card-visual span {
  position: relative;
  z-index: 1;
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  color: #f4d089;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.blog-card-visual-2 { background:radial-gradient(circle at 76% 12%, rgba(214,168,77,.34), transparent 26%), linear-gradient(135deg,#0a1c33 0%,#173b5f 60%,#5c214d 150%); }
.blog-card-visual-3 { background:radial-gradient(circle at 20% 78%, rgba(214,168,77,.32), transparent 28%), linear-gradient(135deg,#071b32 0%,#1d4656 58%,#d6a84d 155%); }
.blog-card-visual-4 { background:radial-gradient(circle at 80% 28%, rgba(214,168,77,.32), transparent 28%), linear-gradient(135deg,#061a31 0%,#24324f 62%,#8f6530 150%); }
.blog-card-visual-5 { background:radial-gradient(circle at 28% 24%, rgba(214,168,77,.36), transparent 28%), linear-gradient(135deg,#061a31 0%,#11304f 56%,#305b68 145%); }
.blog-card-visual-6 { background:radial-gradient(circle at 72% 76%, rgba(214,168,77,.35), transparent 30%), linear-gradient(135deg,#081b31 0%,#3c2d4f 62%,#d6a84d 155%); }
.blog-post-content ul {
  display: grid;
  gap: 10px;
  margin: 16px 0 24px;
  padding-left: 22px;
}
.blog-post-content li {
  color: var(--body);
}
/* Signal card shown on desktop only */
@media (max-width: 980px) {
  .blog-hero-grid { grid-template-columns: 1fr; }
  .blog-signal-card { display: none; }
  .blog-hero { padding-top: calc(64px + 60px); }
}
@media (max-width: 640px) {
  .blog-grid { grid-template-columns: 1fr; }
  .blog-listing-section { padding: 56px 0; }
}