/* =====================================================
SEO PAGE GRADIENT
===================================================== */

.rc-hero--seo {
  --gradient-color-1: #0f3d91;
  --gradient-color-2: #0fb9b1;
  --gradient-color-3: #2ecc71;
  --gradient-color-4: #6c5ce7;

  position: relative;
  overflow: hidden;
  padding: 160px 0 120px;
  color: white;
  min-height: 520px; /* IMPORTANT */
}

#gradient-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.rc-hero--seo::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      circle at 30% 30%,
      rgba(255, 255, 255, 0.08),
      transparent 60%
    ),
    radial-gradient(
      circle at 70% 60%,
      rgba(255, 255, 255, 0.05),
      transparent 60%
    );

  pointer-events: none;
}

.seo-page .rc-seo-intro {
  display: grid;
  gap: 2.5rem;
  align-items: center;
}

.seo-page .rc-seo-intro__content {
  min-width: 0;
}

.seo-page .rc-seo-intro__media {
  width: 100%;
  max-width: 400px;
  justify-self: center;
}

.seo-page .rc-seo-intro__asset {
  display: block;
  width: 100%;
  height: auto;
}

.seo-page .rc-seo-audit__title {
  color: #000;
}

.seo-page .rc-list--checks {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 1rem;
}

.seo-page .rc-list--checks li {
  position: relative;
  padding-left: 1.65rem;
  color: #353945;
  font-size: clamp(1rem, 1.2vw, 1.32rem);
  line-height: 1.4;
}

.seo-page .rc-list--checks li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.28rem;
  width: 1rem;
  height: 1rem;
  background: url("/assets/img/ui/check-icon.png") center / contain no-repeat;
}

@media (min-width: 981px) {
  .seo-page .rc-seo-intro {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 400px);
  }

  .seo-page .rc-seo-intro__media {
    justify-self: end;
  }
}

/* CTA styles */
.rc-cta {
  padding: 58px 0;
}
.rc-cta__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--rc-border);
  background: rgba(0, 0, 0, 0.02);
  border-radius: var(--rc-radius);
  padding: 18px;
}
@media (max-width: 980px) {
  .rc-cta__inner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* SEO page spacing tweaks */
.seo-page .rc-cta--gradient .rc-container.rc-center .rc-p + .rc-btn {
  margin-top: 2rem;
}

.seo-page .rc-form > .rc-btn,
.seo-page .rc-form > button[type="submit"] {
  margin-top: 2rem;
}