/* ─── News page (Divi 5 Blog module) ──────────────────────
   Restyles the .et_pb_blog grid to match the editorial card
   pattern used elsewhere (.ch-pillar, .ch-staff-card).
   Heavy !important to override Divi defaults.
   ──────────────────────────────────────────────────────── */

/* Outer wrapper */
.et_pb_blog {
  margin: 0 !important;
  padding: 0 !important;
}

.et_pb_blog .et_pb_ajax_pagination_container {
  display: block;
}

/* Grid layout — 3 cols on desktop */
.et_pb_blog .et_pb_posts.et_grid_module {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

/* Each post tile */
.et_pb_blog article.et_pb_post {
  margin: 0 !important;
  padding: 0 !important;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 3px solid var(--secondary);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.et_pb_blog article.et_pb_post:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px -16px rgba(20, 35, 63, 0.25);
}

/* Tiles without a thumbnail still keep consistent height */
.et_pb_blog article.et_pb_post.et_pb_no_thumb .et_pb_image_container {
  display: none;
}

/* Featured image — 16:10 frame */
.et_pb_blog .et_pb_image_container {
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--surface);
  overflow: hidden;
}

.et_pb_blog .entry-featured-image-url {
  display: block !important;
  width: 100%;
  height: 100%;
  position: relative;
}

.et_pb_blog .entry-featured-image-url img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  margin: 0 !important;
}

/* Divi's hover overlay — recolor to navy + soft fade */
.et_pb_blog .et_overlay {
  background: rgba(0, 51, 102, 0.55) !important;
  border: none !important;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.et_pb_blog article.et_pb_post:hover .et_overlay {
  opacity: 1;
}

.et_pb_blog .et_overlay::before {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Date meta — mono eyebrow above title */
.et_pb_blog .post-meta {
  order: 1;
  margin: 22px 22px 0 !important;
  padding: 0 !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--tertiary-dark) !important;
  border: none !important;
}

.et_pb_blog .post-meta a,
.et_pb_blog .post-meta .published {
  color: var(--tertiary-dark) !important;
}

/* Title */
.et_pb_blog .entry-title {
  order: 2;
  margin: 6px 22px 12px !important;
  padding: 0 !important;
  font-family: var(--font-display) !important;
  font-size: 22px !important;
  font-weight: normal !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  line-height: 1.15 !important;
  color: var(--ink) !important;
}

.et_pb_blog .entry-title a {
  color: var(--ink) !important;
  text-decoration: none !important;
  background: none !important;
  transition: color 0.15s ease;
}

.et_pb_blog .entry-title a:hover {
  color: var(--tertiary-dark) !important;
}

/* Excerpt + read more */
.et_pb_blog .post-content {
  order: 3;
  padding: 0 22px 24px !important;
  margin: 0 !important;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.et_pb_blog .post-content-inner {
  margin: 0 !important;
  padding: 0 !important;
}

.et_pb_blog .post-content p {
  margin: 0 !important;
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  color: var(--ink-soft) !important;
}

/* Read more — gold mono link with arrow */
.et_pb_blog .more-link {
  margin-top: auto !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  align-self: flex-start;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--tertiary-dark) !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
  transition: color 0.15s ease;
}

.et_pb_blog .more-link::after {
  content: "→";
  font-size: 14px;
  letter-spacing: 0;
  transition: transform 0.2s ease;
}

.et_pb_blog .more-link:hover {
  color: var(--ink) !important;
}

.et_pb_blog .more-link:hover::after {
  transform: translateX(3px);
}

/* Pagination — Divi's "older entries / newer entries" links */
.et_pb_blog .pagination {
  margin: 32px 0 0 !important;
  padding: 24px 0 0;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.et_pb_blog .pagination .alignleft,
.et_pb_blog .pagination .alignright,
.et_pb_blog .pagination a {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--tertiary-dark) !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.et_pb_blog .pagination a:hover {
  color: var(--ink) !important;
}

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 980px) {
  .et_pb_blog .et_pb_posts.et_grid_module {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 600px) {
  .et_pb_blog .et_pb_posts.et_grid_module {
    grid-template-columns: 1fr !important;
  }
}
