/* =========================================================
   BLOG DETAILS — WORLD CLASS UI
   ========================================================= */

.blog-details-hero{
  position: relative;
  padding-top: calc(var(--tv-header-h) + 32px);
  padding-bottom: 60px;
}

.blog-details-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,.75) 0%,
    rgba(0,0,0,.45) 60%,
    rgba(0,0,0,.85) 100%
  );
}

.blog__hero__text{
  position: relative;
  z-index: 2;
}

.blog__hero__text h2{
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 900;
  letter-spacing: -0.6px;
}

/* Article body */
.blog__details__text{
  background: #fff;
  border-radius: 18px;
  padding: 26px;
  box-shadow: 0 18px 48px rgba(16,24,40,.10);
  color: #101828 !important;
}

/* Content typography */
.blog__details__text p{
   font-size: 17px;
  line-height: 1.8;
  color: #344054 !important;
}

.blog__details__text h1,
.blog__details__text h2,
.blog__details__text h3,
.blog__details__text h4{
  color: #101828 !important;
  font-weight: 900;
  letter-spacing: -0.4px;
  margin: 18px 0 10px;
}

/* lists */
.blog__details__text li{
  color: #344054 !important;
  line-height: 1.8;
}

/* links */
.blog__details__text a{
  color: #ca0a00 !important;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.blog__details__text a:hover{
  opacity: .9;
}

.blog__details__text,
.blog__details__text *{
  color: #101828 !important;
}


/* Tags */
.blog__details__tags a{
  border-radius: 999px;
  padding: 6px 12px;
  font-weight: 700;
}

/* Sidebar */
.blog__sidebar{
  position: sticky;
  top: calc(var(--tv-header-h) + 18px);
}