/* =========================================
   BLOG HERO
========================================= */

.veil-blog-hero {
  position: relative;
  min-height: 340px;

  display: flex;
  align-items: center;
  justify-content: center;

  text-align: center;
  overflow: hidden;

  background-image:
    linear-gradient(rgba(5,10,20,.42), rgba(5,10,20,.88)),
    url('/wp-content/uploads/blog-veil-hero-1.png');

  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;

  border-bottom: 1px solid rgba(211,177,106,.32);
}

.veil-blog-hero__overlay {
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at center,
      rgba(90,166,173,.16),
      transparent 48%),

    radial-gradient(circle at top,
      rgba(139,0,15,.12),
      transparent 58%),

    linear-gradient(
      90deg,
      rgba(3,8,18,.92),
      transparent 45%,
      rgba(3,8,18,.92)
    );

  pointer-events: none;
}

.veil-blog-hero__content {
  position: relative;
  z-index: 2;

  max-width: 980px;
  padding: 4rem 1.5rem;
}

.veil-blog-hero h1 {
  margin: 0;

  font-family: "Cinzel", serif;
  font-size: clamp(3rem, 6vw, 5rem);
  font-weight: 400;
  line-height: 1.05;

  letter-spacing: .08em;
  text-transform: uppercase;

  color: #f5ead6;

  text-shadow:
    0 0 18px rgba(0,0,0,.9),
    0 0 42px rgba(90,166,173,.15);
}

.veil-blog-hero p {
  margin: 0 0 .6rem;

  font-family: "Cinzel", serif;
  font-size: clamp(1rem, 2vw, 1.3rem);

  letter-spacing: .18em;
  text-transform: uppercase;

  color: #5aa6ad;

  text-shadow: 0 0 12px rgba(90,166,173,.35);
}

.veil-blog-hero span {
  display: block;

  max-width: 760px;
  margin: 0 auto;

  font-family: "Cormorant Garamond", serif;
  font-size: clamp(1.1rem, 2vw, 1.45rem);
  line-height: 1.55;

  color: #e8dcc7;
}

@media (max-width:768px) {

  .veil-blog-hero {
    min-height: 260px;
  }

}
/* Hide Blocksy default blog archive hero/title */
.blog .hero-section,
.blog .ct-page-title,
.blog .page-title,
.blog .entry-header,
.blog header.entry-header {
  display: none !important;
}
/* Hide ONLY the default Blocksy Blog page title/hero */
body.blog [data-prefix="blog"] .hero-section,
body.blog [data-prefix="blog"] .ct-container-full > .hero-section,
body.blog .ct-page-title,
body.blog .entry-header,
body.blog .page-title,
body.blog .archive-title-wrapper,
body.blog .page-description {
  display: none !important;
}
/* =========================================
   VEIL BLOG CARD GRID
========================================= */

.veil-blog-content {
  padding: 4rem 8%;
  background:
    radial-gradient(circle at top, rgba(90,166,173,.08), transparent 35%),
    linear-gradient(180deg, #050814, #080b12);
}

.veil-blog-grid {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;

  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}

.veil-blog-card {
  overflow: hidden;
  border-radius: 22px;

  background:
    linear-gradient(180deg, rgba(8,14,26,.96), rgba(4,7,14,.98));

  border: 1px solid rgba(211,177,106,.22);

  box-shadow:
    0 0 30px rgba(0,0,0,.45),
    0 0 35px rgba(90,166,173,.08);

  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease;
}

.veil-blog-card:hover {
  transform: translateY(-6px);

  border-color: rgba(90,166,173,.45);

  box-shadow:
    0 0 38px rgba(0,0,0,.55),
    0 0 45px rgba(90,166,173,.16),
    0 0 28px rgba(139,0,15,.12);
}

.veil-blog-image {
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #050814;
}

.veil-blog-image img {
  width: 100%;
  height: 100%;
  display: block;

  object-fit: cover;

  filter:
    grayscale(8%)
    contrast(1.08)
    brightness(.9);

  transition:
    transform .45s ease,
    filter .45s ease;
}

.veil-blog-card:hover .veil-blog-image img {
  transform: scale(1.06);

  filter:
    grayscale(0%)
    contrast(1.12)
    brightness(1);
}

.veil-blog-card-body {
  padding: 1.5rem;
  text-align: left;
}

.veil-blog-meta {
  margin-bottom: .75rem;

  display: flex;
  align-items: center;
  gap: .45rem;
  flex-wrap: wrap;

  font-family: "Roboto", Arial, sans-serif;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;

  color: rgba(211,177,106,.78);
}

.veil-blog-meta a {
  color: #5aa6ad;
  text-decoration: none;
}

.veil-blog-title {
  margin: 0 0 .85rem;

  font-family: "Cinzel", serif;
  font-size: 1.35rem;
  line-height: 1.25;
}

.veil-blog-title a {
  color: #f5ead6;
  text-decoration: none;
}

.veil-blog-title a:hover {
  color: #5aa6ad;
  text-shadow: 0 0 10px rgba(90,166,173,.35);
}

.veil-blog-excerpt {
  color: #d8d0c2;
  font-size: .98rem;
  line-height: 1.65;
}

.veil-blog-readmore {
  display: inline-flex;
  margin-top: 1rem;

  color: #b11226;
  font-family: "Roboto", Arial, sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
}

.veil-blog-readmore:hover {
  color: #ff4258;
  text-shadow: 0 0 10px rgba(177,18,38,.45);
}

/* Pagination */
.veil-blog-pagination {
  grid-column: 1 / -1;
  margin-top: 2rem;
  text-align: center;
}

/* Responsive */
@media (max-width: 1024px) {
  .veil-blog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .veil-blog-content {
    padding: 3rem 1.25rem;
  }

  .veil-blog-grid {
    grid-template-columns: 1fr;
  }
}