.blogPage.container {
  max-width: var(--container);
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

.blogHero {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: var(--g-header);
  border-bottom: 1px solid color-mix(in srgb, var(--c-border-2) 80%, transparent);
  position: relative;
}

.blogHero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--c-primary) 60%, transparent), transparent);
  pointer-events: none;
}

.blogHero__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--space-56) 20px var(--space-28);
}

.blogHero__title {
  margin: 0;
  font-family: var(--font-secondary);
  font-weight: var(--fw-700);
  letter-spacing: var(--tracking-tight);
  line-height: var(--lh-tight);
  font-size: var(--fs-h1);
  color: var(--c-text);
}

.blogHero__desc {
  margin: var(--space-14) 0 0 0;
  max-width: 74ch;
  font-family: var(--font-primary);
  font-size: var(--fs-body);
  font-weight: var(--fw-500);
  line-height: var(--lh-relaxed);
  color: var(--c-muted);
}

.gb-looper-9977cbf3.gb-looper-9977cbf3.is-empty{
  display: flex;
  justify-content: center;
  align-items: center;
}

.blogNoResults {
  width: min(560px, 92vw);
  text-align: center;
  padding: var(--space-20) var(--space-24);
  border-radius: var(--radius-14);
  border: 1px solid color-mix(in srgb, var(--c-border) 82%, transparent);
  background: color-mix(in srgb, var(--c-surface) 96%, transparent);
  box-shadow: 0 14px 44px rgba(11, 14, 20, 0.08);
}

.blogNoResults__line {
  width: min(520px, 72vw);
  height: 1px;
  margin: 0 auto var(--space-14);
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--c-primary) 56%, transparent), transparent);
}

.blogNoResults__title {
  margin: 0;
  font-family: var(--font-secondary);
  font-size: var(--fs-h3);
  line-height: 1.12;
  letter-spacing: var(--tracking-tight);
  color: var(--c-text);
}

.blogNoResults__desc {
  margin: var(--space-10) 0 0;
  color: var(--c-text-2);
  font-family: var(--font-primary);
  font-size: var(--fs-body);
  line-height: var(--lh-relaxed);
}

@media (max-width: 768px) {
  .gb-looper-9977cbf3.is-empty {
    padding: var(--space-16);
    border-radius: var(--radius-10);
  }

  .blogNoResults {
    padding: var(--space-16);
    border-radius: var(--radius-10);
  }
}
