.announcement {
  background-color: #0b2255;
  background-image:
    linear-gradient(rgb(4 19 56 / 62%), rgb(4 19 56 / 62%)),
    url("first-principle-blue-abstract-2.png");
  background-position: center;
  background-size: cover;
}

.hero-stage {
  background: #0b2358 url("first-principle-blue-abstract.png") center / cover no-repeat;
}

.go-card {
  background-color: #0b4455;
  background-image:
    linear-gradient(110deg, rgb(0 65 65 / 80%), rgb(4 47 88 / 72%)),
    url("first-principle-blue-abstract-1.png");
  background-position: center;
  background-size: cover;
}

.token-card {
  background-color: #f5f9fc;
  background-image:
    linear-gradient(rgb(250 252 255 / 90%), rgb(240 248 250 / 90%)),
    url("first-principle-blue-abstract.png");
  background-position: center;
  background-size: cover;
}

.token-card > .token-logo {
  display: block;
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.benefits-cards {
  background-color: #14385c;
  background-image:
    linear-gradient(120deg, rgb(3 86 75 / 38%), rgb(6 32 80 / 26%)),
    url("first-principle-blue-abstract-2.png");
  background-position: 55% center;
  background-size: cover;
}

.testimonial-section blockquote {
  background-color: #102752;
  background-image:
    linear-gradient(90deg, rgb(5 17 53 / 86%), rgb(5 22 61 / 68%)),
    url("first-principle-blue-abstract-1.png");
  background-position: center;
  background-size: cover;
}

.platform-card.connect { background: #f2f5ed; }
.platform-card.context { background: #f5eef0; }
.platform-card.action { background: #fff0e6; }
.platform-card.everywhere { background: #eff1eb; }

.platform-card img {
  height: 78%;
  object-position: center;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 28%);
  mask-image: linear-gradient(to bottom, transparent, #000 28%);
}

.resources-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #eaf3f5;
}

.resources-section::before {
  position: absolute;
  inset: -20px;
  z-index: 0;
  background: url("first-principle-blue-abstract-2.png") center / cover no-repeat;
  content: "";
  filter: blur(12px) hue-rotate(-18deg);
  opacity: .24;
  pointer-events: none;
}

.resources-section > * {
  position: relative;
  z-index: 1;
}

.final-cta {
  background-color: #e8f6f3;
  background-image:
    linear-gradient(110deg, rgb(239 250 248 / 90%), rgb(220 245 236 / 78%)),
    url("first-principle-blue-abstract-1.png");
  background-position: center;
  background-size: cover;
}