/* =========================================================
   OXY Blogs listing page — extra polish
   Loaded after resources-hotfix.css on blogs.html only.
   Tokens: brand:#90594E ink:#231d1b muted:#746967 paper:#fff wash:#f8f4f1 line:#e8dfda
   ========================================================= */

/* ---------- Credibility strip under the section title ---------- */
.blog-highlights {
  display: flex;
  justify-content: center;
  gap: 0;
  max-width: 620px;
  margin: 0 auto 46px !important;
  border: 1px solid #e8dfda;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  transition: box-shadow .3s;
}
.blog-highlights:hover { box-shadow: 0 10px 24px rgba(71,47,41,.08); }
.blog-highlights div {
  flex: 1;
  text-align: center;
  padding: 18px 12px;
  border-right: 1px solid #e8dfda;
  transition: background .25s;
}
.blog-highlights div:hover { background: #f8f4f1; }
.blog-highlights div:last-child { border-right: none; }
.blog-highlights strong {
  display: block;
  color: #90594E;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.3px;
}
.blog-highlights span {
  display: block;
  margin-top: 3px;
  color: #746967;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .2px;
}

/* ---------- Equal 3-up card grid — all cards identical size, one row ---------- */
.oxy-blog-section .blog-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 26px !important;
  align-items: stretch !important;
}

.oxy-blog-section .blog-card,
.oxy-blog-section .blog-card--featured {
  grid-column: auto !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100%;
  position: relative !important;
  border: 1px solid #e8dfda !important;
  border-radius: 10px !important;
  background: #fff !important;
  overflow: hidden !important;
  box-shadow: 0 2px 10px rgba(71,47,41,.05) !important;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s !important;
}

.oxy-blog-section .blog-card:hover,
.oxy-blog-section .blog-card--featured:hover {
  transform: translateY(-9px) !important;
  box-shadow: 0 22px 40px rgba(71,47,41,.16) !important;
  border-color: #d9beb7 !important;
}

/* image */
.oxy-blog-section .blog-card .blog-image,
.oxy-blog-section .blog-card--featured .blog-image {
  flex: none !important;
  width: 100% !important;
  height: 210px !important;
  overflow: hidden !important;
  position: relative;
}
.oxy-blog-section .blog-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(35,29,27,0) 55%, rgba(35,29,27,.35) 100%);
  opacity: 0;
  transition: opacity .35s;
}
.oxy-blog-section .blog-card:hover .blog-image::after { opacity: 1; }
.oxy-blog-section .blog-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .6s cubic-bezier(.2,.8,.2,1) !important;
}
.oxy-blog-section .blog-card:hover .blog-image img {
  transform: scale(1.09) !important;
}

/* content */
.oxy-blog-section .blog-card .blog-content,
.oxy-blog-section .blog-card--featured .blog-content {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 26px !important;
  justify-content: flex-start !important;
}

.oxy-blog-section .blog-content .category {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: max-content;
  transition: letter-spacing .3s, color .3s;
}
.oxy-blog-section .blog-card:hover .category {
  color: #6f4038 !important;
  letter-spacing: 1.4px !important;
}
.oxy-blog-section .blog-content .category::before {
  transition: transform .35s;
}
.oxy-blog-section .blog-card:hover .category::before {
  transform: scale(1.2) rotate(-6deg);
}

.oxy-blog-section .blog-card--featured .blog-content h3 {
  font-size: 21px !important;
}
.oxy-blog-section .blog-content h3 {
  transition: color .3s;
}
.oxy-blog-section .blog-card:hover .blog-content h3 {
  color: #90594E !important;
}

.oxy-blog-section .blog-content .blog-btn {
  position: relative;
  overflow: hidden;
  transition: transform .3s, box-shadow .3s !important;
}
.oxy-blog-section .blog-card:hover .blog-btn {
  transform: translateX(3px) !important;
  box-shadow: 0 10px 22px rgba(144,89,78,.32) !important;
}
.oxy-blog-section .blog-content .blog-btn i {
  transition: transform .3s;
}
.oxy-blog-section .blog-card:hover .blog-btn i {
  transform: translateX(4px);
}

/* remove the old "Featured" ribbon — all cards are equal now */
.blog-card--featured::before { content: none !important; }

@media (max-width: 991px) {
  .oxy-blog-section .blog-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 767px) {
  .oxy-blog-section .blog-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .oxy-blog-section .blog-card .blog-image,
  .oxy-blog-section .blog-card--featured .blog-image {
    height: 220px !important;
  }
  .blog-highlights {
    flex-wrap: wrap;
  }
  .blog-highlights div {
    flex: 1 1 33%;
    border-bottom: 1px solid #e8dfda;
  }
}