.pg-blog-section {
  padding: 86px 0 96px;
  background: radial-gradient(circle at 50% 0%, #f6f9ff 0, #fff 44%);
}
.pg-blog-section .container { max-width: 1320px; }
.pg-blog-heading { text-align: center; margin: 0 auto 43px; }
.pg-blog-heading h2 {
  margin: 0;
  color: #080c22;
  font-size: clamp(36px, 4.8vw, 64px);
  line-height: 1.12;
  font-weight: 850;
  letter-spacing: -.055em;
}
.pg-blog-heading h2 span { position: relative; color: #153bd1; }
.pg-blog-heading h2 span::after {
  content: '';
  position: absolute;
  left: 12%; right: 3%; bottom: -10px;
  height: 6px;
  border-top: 4px solid #153bd1;
  border-radius: 50%;
  transform: rotate(-3deg);
}
.pg-blog-heading p { margin: 22px 0 0; color: #656a78; font-size: clamp(15px, 1.7vw, 21px); }
.pg-blog-carousel { position: relative; }
.pg-blog-carousel-arrow { display: none; }
.pg-blog-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px; align-items: stretch; }
.pg-blog-cards[data-count="1"] { grid-template-columns: minmax(0, 415px); justify-content: center; }
.pg-blog-cards[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 415px)); justify-content: center; }
.pg-blog-card {
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #ebeff8;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 15px 40px rgba(28, 58, 114, .085);
  transition: transform .2s ease, box-shadow .2s ease;
}
.pg-blog-card:hover { transform: translateY(-5px); box-shadow: 0 22px 52px rgba(28, 58, 114, .15); }
.pg-blog-card-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #eef3ff;
}
.pg-blog-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transform: none !important;
}
.pg-blog-card-placeholder {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
  background: radial-gradient(circle at 68% 24%, #3f74ff, transparent 40%), linear-gradient(145deg, #07144d, #1639bf);
  color: #fff; text-align: center; font-size: 23px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2;
}
.pg-blog-card-placeholder i { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 18px; background: #ffffff25; font-size: 28px; }
.pg-blog-card-body { flex: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 25px 27px 28px; }
.pg-blog-card-meta { display: flex; align-items: center; flex-wrap: wrap; column-gap: 15px; row-gap: 5px; color: #182347; font-size: 13px; }
.pg-blog-card-meta span { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.pg-blog-card-meta span + span { border-left: 1px solid #cfd6e6; padding-left: 15px; }
.pg-blog-card-meta i { color: #163ccd; font-size: 15px; }
.pg-blog-card h3 { margin: 18px 0 18px; font-size: clamp(20px, 1.8vw, 24px); line-height: 1.28; font-weight: 800; letter-spacing: -.025em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; overflow-wrap: anywhere; }
.pg-blog-card h3 a { color: #0a1539; }
.pg-blog-card h3 a:hover { color: #153bd1; }
.pg-blog-card p { margin: 0 0 22px; color: #656a78; font-size: 15px; line-height: 1.65; overflow-wrap: anywhere; }
.pg-blog-card-more {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 21px;
  margin-top: auto; min-height: 55px; padding: 7px 8px 7px 24px;
  border-radius: 50px;
  background: linear-gradient(105deg, #071a85, #0c40ee);
  color: #fff; font-size: 15px; font-weight: 700;
  box-shadow: 0 8px 19px rgba(13, 49, 190, .16);
}
.pg-blog-card-more:hover { color: #fff; background: linear-gradient(105deg, #09166f, #1438c4); }
.pg-blog-card-arrow { width: 39px; height: 39px; display: grid; place-items: center; flex: none; border-radius: 50%; background: #fff; color: #153bd1; font-size: 16px; }
.pg-blog-card a:focus-visible { outline: 3px solid #f7c700; outline-offset: 3px; }
.pg-blog-article .single-blog:hover .blog-image img { transform: none !important; }
/* Keep articles readable even when a cached script adds the reveal class. */
.pg-blog-article .single-blog.pg-reveal { opacity: 1; transform: none; }
.pg-blog-article .blog-image { width: 100%; overflow: visible; }
.pg-blog-article .blog-image img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; border-radius: 18px; }
@media (max-width: 1099px) {
  .pg-blog-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .pg-blog-section { padding: 62px 0 70px; }
  .pg-blog-heading { margin-bottom: 31px; }
  .pg-blog-heading h2 { font-size: clamp(36px, 9vw, 47px); }
  .pg-blog-heading p { margin-top: 18px; line-height: 1.5; }
  .pg-blog-carousel { padding: 0 36px; }
  .pg-blog-cards, .pg-blog-cards[data-count="1"], .pg-blog-cards[data-count="2"] {
    max-width: 340px; margin: 0 auto; display: grid; grid-template-columns: none;
    grid-auto-flow: column; grid-auto-columns: 100%; justify-content: start;
    gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain; scrollbar-width: none; padding-bottom: 10px;
  }
  .pg-blog-cards::-webkit-scrollbar { display: none; }
  .pg-blog-cards .pg-blog-card { scroll-snap-align: start; }
  .pg-blog-carousel-arrow:not([hidden]) { display: grid; place-items: center; position: absolute; top: 40%; z-index: 1; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #153bd1; color: #fff; cursor: pointer; }
  .pg-blog-carousel-arrow:disabled { opacity: .35; cursor: default; }
  .pg-blog-carousel-arrow:focus-visible { outline: 3px solid #f7c700; outline-offset: 2px; }
  .pg-blog-carousel-prev { left: 0; }
  .pg-blog-carousel-next { right: 0; }
  .pg-blog-card { border-radius: 18px; }
  .pg-blog-card-body { padding: 23px 22px 25px; }
  .pg-blog-card-meta { font-size: 12px; column-gap: 9px; }
  .pg-blog-card-meta span + span { padding-left: 9px; }
  .pg-blog-card h3 { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) { .pg-blog-card { transition: none; } }
