html, body {
  min-height: 100%;
  background: #eef3f8 !important;
}

body {
  position: relative;
  background-color: #eef3f8 !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 14% 18%, rgba(165, 199, 255, 0.18) 0, rgba(165, 199, 255, 0.18) 12%, transparent 12.2%),
    radial-gradient(circle at 87% 14%, rgba(222, 198, 255, 0.16) 0, rgba(222, 198, 255, 0.16) 13%, transparent 13.2%),
    radial-gradient(circle at 82% 78%, rgba(150, 227, 235, 0.16) 0, rgba(150, 227, 235, 0.16) 12%, transparent 12.2%),
    linear-gradient(120deg, transparent 0 8%, rgba(187, 214, 255, 0.15) 8% 12%, transparent 12% 28%, rgba(226, 211, 255, 0.12) 28% 34%, transparent 34% 100%),
    linear-gradient(62deg, transparent 0 64%, rgba(209, 234, 255, 0.16) 64% 69%, transparent 69% 100%),
    linear-gradient(135deg, rgba(255,255,255,0.78), rgba(255,255,255,0.78)),
    linear-gradient(180deg, #eff4fb 0%, #edf3f9 100%);
  background-repeat: no-repeat;
  background-size: cover;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .28;
  background-image:
    radial-gradient(circle, rgba(121, 151, 205, 0.32) 0 1.4px, transparent 1.6px),
    radial-gradient(circle, rgba(184, 162, 219, 0.24) 0 1.2px, transparent 1.4px);
  background-size: 140px 140px, 180px 180px;
  background-position: 0 0, 70px 55px;
  mix-blend-mode: normal;
}

/* Hacer que se vea el fondo en todo el sitio */
body .site,
body .site-content,
body .content-area,
body .site-main,
body main,
body article,
body section,
body .page,
body .single,
body .blog,
body .archive,
body .search,
body .error404,
body .widget-area,
body .taxonomy-description,
body .term-description,
body .page-header,
body .cp-page-wrap,
body .cp-archive-wrap,
body .cp-single-wrap {
  background-color: transparent !important;
}

/* Se conservan las tarjetas y paneles legibles */
.cp-card,
.cp-step-card,
.cp-company-card,
.cp-guide-card,
.cp-benefit-item,
.widget,
.sidebar-box,
.entry-card,
.comment-respond,
.comments-area,
.card,
.box,
.panel {
  position: relative;
}

/* Ancho total visual */
body, .site, .site-content {
  overflow-x: clip;
}

@media (max-width: 767px) {
  body::before {
    background:
      radial-gradient(circle at 12% 15%, rgba(165, 199, 255, 0.20) 0, rgba(165, 199, 255, 0.20) 11%, transparent 11.2%),
      radial-gradient(circle at 86% 12%, rgba(222, 198, 255, 0.18) 0, rgba(222, 198, 255, 0.18) 12%, transparent 12.2%),
      radial-gradient(circle at 78% 78%, rgba(150, 227, 235, 0.18) 0, rgba(150, 227, 235, 0.18) 12%, transparent 12.2%),
      linear-gradient(126deg, transparent 0 12%, rgba(187, 214, 255, 0.15) 12% 18%, transparent 18% 35%, rgba(226, 211, 255, 0.13) 35% 42%, transparent 42% 100%),
      linear-gradient(135deg, rgba(255,255,255,0.82), rgba(255,255,255,0.82)),
      linear-gradient(180deg, #f0f5fb 0%, #edf3f9 100%);
    background-repeat: no-repeat;
    background-size: cover;
  }

  body::after {
    opacity: .20;
    background-size: 120px 120px, 150px 150px;
  }
}
