.blb-reference .blb-about-v2 {
  background: #050505;
  overflow: hidden;
}

.blb-reference .blb-about-v2__wrap {
  width: min(1180px, calc(100% - 40px));
  margin-inline: auto;
}

.blb-reference .blb-about-v2__hero {
  min-height: 650px;
  display: flex;
  align-items: center;
  padding: 90px 0;
  color: #fff;
  background: linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.65) 36%, rgba(0,0,0,.08) 78%), url("assets/blb-original/blb-about-hero.webp") center / cover no-repeat;
}

.blb-reference .blb-about-v2__hero .blb-about-v2__wrap { margin-block: auto; }
.blb-reference .blb-about-v2__eyebrow,
.blb-reference .blb-about-v2__marker {
  margin: 0 0 16px;
  color: #f2b51d;
  font-family: "BLB Marker", "Comic Sans MS", cursive;
  font-size: clamp(1.5rem, 1.5vw, 2rem);
  line-height: 1.15;
  text-transform: uppercase;
}

.blb-reference .blb-about-v2 h1,
.blb-reference .blb-about-v2 h2,
.blb-reference .blb-about-v2 h3 {
  margin: 0;
  font-family: "BLB Bangers", Impact, "Arial Black", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  text-wrap: balance;
}

.blb-reference .blb-about-v2 h1 {
  max-width: 720px;
  font-size: clamp(6rem, 8.2vw, 11rem);
  line-height: .89;
}

.blb-reference .blb-about-v2 h2 {
  font-size: clamp(4.6rem, 5.5vw, 7.6rem);
  line-height: .92;
}

.blb-reference .blb-about-v2__hero-lead {
  max-width: 55ch;
  margin: 25px 0 0;
  font-size: clamp(1.8rem, 1.6vw, 2.2rem);
  font-weight: 700;
  line-height: 1.5;
}

.blb-reference .blb-about-v2__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px 30px;
  margin-top: 32px;
}

.blb-reference .blb-about-v2__text-link {
  color: #fff;
  border-bottom: 2px solid #f2b51d;
  padding-bottom: 4px;
  font-family: "BLB Marker", "Comic Sans MS", cursive;
  font-size: 1.8rem;
  text-transform: uppercase;
}

.blb-reference .blb-about-v2__intro,
.blb-reference .blb-about-v2__parent {
  padding: clamp(68px, 8vw, 116px) 0;
  background: #f4efe5;
  color: #111;
}

.blb-reference .blb-about-v2__intro-grid,
.blb-reference .blb-about-v2__parent-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 7vw, 100px);
  align-items: start;
}

.blb-reference .blb-about-v2__intro .blb-about-v2__marker,
.blb-reference .blb-about-v2__parent .blb-about-v2__marker { color: #c82814; }
.blb-reference .blb-about-v2__prose { padding-top: 8px; }
.blb-reference .blb-about-v2__prose p,
.blb-reference .blb-about-v2__close p:not(.blb-about-v2__marker) {
  margin: 0 0 18px;
  font-size: clamp(1.7rem, 1.35vw, 2rem);
  line-height: 1.58;
}
.blb-reference .blb-about-v2__prose p:last-child { margin-bottom: 0; }
.blb-reference .blb-about-v2__prose a { text-decoration: underline; text-decoration-color: #ef2b12; text-underline-offset: 4px; }

.blb-reference .blb-about-v2__method {
  background: #f2b51d;
  color: #080808;
  padding: clamp(60px, 7vw, 100px) 0;
}
.blb-reference .blb-about-v2__method-grid {
  display: grid;
  grid-template-columns: minmax(0, .75fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(40px, 6vw, 92px);
}
.blb-reference .blb-about-v2__method .blb-about-v2__marker { color: #8f1f12; }
.blb-reference .blb-about-v2__character {
  margin: 0;
  align-self: end;
  max-width: 410px;
}
.blb-reference .blb-about-v2__character img { display: block; width: 100%; max-height: 550px; object-fit: contain; object-position: bottom; }
.blb-reference .blb-about-v2__steps { list-style: none; margin: 28px 0 0; padding: 0; }
.blb-reference .blb-about-v2__steps li {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 18px;
  padding: 18px 0;
  border-top: 2px solid rgba(0,0,0,.22);
}
.blb-reference .blb-about-v2__steps li:last-child { border-bottom: 2px solid rgba(0,0,0,.22); }
.blb-reference .blb-about-v2__steps li > span { font: 2rem/1 "BLB Marker", cursive; }
.blb-reference .blb-about-v2__steps h3 { font-size: clamp(2.7rem, 2.2vw, 3.4rem); line-height: .95; }
.blb-reference .blb-about-v2__steps p { margin: 7px 0 0; font-size: 1.6rem; line-height: 1.45; }

.blb-reference .blb-about-v2__pillars {
  padding: clamp(70px, 8vw, 116px) 0;
  background: #080808;
  color: #fff;
}
.blb-reference .blb-about-v2__pillars h2 { max-width: 850px; }
.blb-reference .blb-about-v2__pillars-lead { max-width: 60ch; margin: 18px 0 34px; font-size: 1.8rem; line-height: 1.5; }
.blb-reference .blb-about-v2__pillar-list { list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; }
.blb-reference .blb-about-v2__pillar-list li { min-width: 0; padding: 22px 16px 24px; border-top: 6px solid #ef2b12; background: #1b1b1b; }
.blb-reference .blb-about-v2__pillar-list li:nth-child(2) { border-color: #f2b51d; }
.blb-reference .blb-about-v2__pillar-list li:nth-child(3) { border-color: #0f8283; }
.blb-reference .blb-about-v2__pillar-list li:nth-child(4) { border-color: #257da5; }
.blb-reference .blb-about-v2__pillar-list li:nth-child(5) { border-color: #ce5c29; }
.blb-reference .blb-about-v2__pillar-list span { display: block; color: #aaa; font: 1.7rem/1 "BLB Marker", cursive; }
.blb-reference .blb-about-v2__pillar-list strong { display: block; margin: 16px 0 12px; font: 3.2rem/.93 "BLB Bangers", Impact, sans-serif; text-transform: uppercase; overflow-wrap: anywhere; }
.blb-reference .blb-about-v2__pillar-list small { display: block; color: #ddd; font-size: 1.45rem; line-height: 1.4; }

.blb-reference .blb-about-v2__close { padding: clamp(72px, 8vw, 112px) 0; background: #ef2b12; color: #fff; }
.blb-reference .blb-about-v2__close h2 { max-width: 950px; font-size: clamp(5rem, 7vw, 9.2rem); }
.blb-reference .blb-about-v2__close p:not(.blb-about-v2__marker) { max-width: 60ch; margin-top: 18px; }
.blb-reference .blb-about-v2__close .blb-about-v2__marker { color: #fff; }
.blb-reference .blb-about-v2__close .blb-button:first-child { background: #fff; color: #080808; border-color: #fff; }
.blb-reference .blb-about-v2__close .blb-button--ghost { color: #fff; border-color: #fff; }

@media (max-width: 900px) {
  .blb-reference .blb-about-v2__hero { min-height: 620px; background-position: 64% center; }
  .blb-reference .blb-about-v2__intro-grid,
  .blb-reference .blb-about-v2__parent-grid { grid-template-columns: 1fr; gap: 28px; }
  .blb-reference .blb-about-v2__method-grid { grid-template-columns: minmax(0, .55fr) minmax(0, 1fr); gap: 30px; }
  .blb-reference .blb-about-v2__pillar-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .blb-reference .blb-about-v2__wrap { width: calc(100% - 32px); }
  .blb-reference .blb-about-v2__hero { min-height: 0; padding: 92px 0 110px; background-image: linear-gradient(90deg, rgba(0,0,0,.9), rgba(0,0,0,.62)), url("assets/blb-original/blb-about-hero.webp"); background-position: 58% center; }
  .blb-reference .blb-about-v2 h1 { font-size: clamp(5.4rem, 15vw, 7.4rem); }
  .blb-reference .blb-about-v2 h2 { font-size: clamp(4.4rem, 12vw, 6rem); }
  .blb-reference .blb-about-v2__actions { align-items: stretch; flex-direction: column; }
  .blb-reference .blb-about-v2__actions .blb-button { width: 100%; }
  .blb-reference .blb-about-v2__text-link { align-self: flex-start; }
  .blb-reference .blb-about-v2__method-grid { display: flex; flex-direction: column-reverse; align-items: stretch; }
  .blb-reference .blb-about-v2__character { align-self: center; width: min(70%, 280px); }
  .blb-reference .blb-about-v2__pillar-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 400px) {
  .blb-reference .blb-about-v2__pillar-list { grid-template-columns: 1fr; }
}
