/* Aquamarine accent. Primary buttons are the quieter #A2DFC7.
   Demo selected row and the demo send control stay #84FECF.
   No text colour on the canvas, no focus-ring change. */

.site_root__ti2Do .site_btnPrimary___h7ng {
  background: #a2dfc7;
  color: #26251e;
}

.site_root__ti2Do .site_btnPrimary___h7ng:hover {
  background: color-mix(in srgb, #a2dfc7 86%, #26251e);
  color: #26251e;
}

.site_root__ti2Do .site_navLinks__XTa0g > a[aria-current="page"],
.site_root__ti2Do .site_navLinks__XTa0g > .site_drop__cPBRE > button[aria-expanded="true"] {
  background: #84fecf;
  color: #26251e;
}

.demo_win__4iyyl [aria-current="page"] {
  background-color: #84fecf;
  color: #26251e;
}

.demo_win__4iyyl [aria-current="page"]:hover {
  background-color: color-mix(in srgb, #84fecf 86%, #26251e);
  color: #26251e;
}

.demo_win__4iyyl button[aria-label="Send"]:not(:disabled) {
  background-color: #84fecf;
  color: #26251e;
}

/* Soft sculpture. Real crops of the master, behind content, not over media boxes. */

.site_hero__H_Blr,
.site_band__8kDc4,
.site_sec__Y3LGN:is(:has(#trust), :has(#pricing)),
.site_final__VMhjv,
.site_plate__EXRcg {
  position: relative;
}

.site_hero__H_Blr > *,
.site_band__8kDc4 > *,
.site_sec__Y3LGN:is(:has(#trust), :has(#pricing)) > *,
.site_final__VMhjv > * {
  position: relative;
  z-index: 1;
}

.site_hero__H_Blr::before,
.site_band__8kDc4::before,
.site_sec__Y3LGN:is(:has(#trust), :has(#pricing))::before,
.site_final__VMhjv::before,
.site_plate__EXRcg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

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

.site_hero__H_Blr::before {
  background-image:
    linear-gradient(to right, var(--base) 0%, transparent 52%),
    linear-gradient(to bottom, var(--base) 0%, transparent 16%, transparent 78%, var(--base) 100%),
    image-set(
      url("/assets/soft/hero.webp") type("image/webp"),
      url("/assets/soft/hero.jpg") type("image/jpeg")
    );
  background-size: cover;
  background-position: center, center, 92% 46%;
  -webkit-mask-image: radial-gradient(ellipse 62% 74% at 84% 46%, #000 0%, #000 32%, transparent 74%);
  mask-image: radial-gradient(ellipse 62% 74% at 84% 46%, #000 0%, #000 32%, transparent 74%);
}

.site_kinds__MJ1Oa > li:nth-child(1) .site_plate__EXRcg::before {
  background-image: image-set(
    url("/assets/soft/do-1.webp") type("image/webp"),
    url("/assets/soft/do-1.jpg") type("image/jpeg")
  );
  background-position: center;
  background-size: cover;
}

.site_kinds__MJ1Oa > li:nth-child(2) .site_plate__EXRcg::before {
  background-image: image-set(
    url("/assets/soft/do-2.webp") type("image/webp"),
    url("/assets/soft/do-2.jpg") type("image/jpeg")
  );
  background-position: center;
  background-size: cover;
}

.site_kinds__MJ1Oa > li:nth-child(3) .site_plate__EXRcg::before {
  background-image: image-set(
    url("/assets/soft/do-3.webp") type("image/webp"),
    url("/assets/soft/do-3.jpg") type("image/jpeg")
  );
  background-position: center;
  background-size: cover;
}

.site_build__8xMBE > li:nth-child(1) .site_plate__EXRcg::before {
  background-image: image-set(
    url("/assets/soft/film-1.webp") type("image/webp"),
    url("/assets/soft/film-1.jpg") type("image/jpeg")
  );
  background-position: left bottom;
  background-size: cover;
}

.site_build__8xMBE > li:nth-child(2) .site_plate__EXRcg::before {
  background-image: image-set(
    url("/assets/soft/film-2.webp") type("image/webp"),
    url("/assets/soft/film-2.jpg") type("image/jpeg")
  );
  background-position: center;
  background-size: cover;
}

.site_build__8xMBE > li:nth-child(3) .site_plate__EXRcg::before {
  background-image: image-set(
    url("/assets/soft/film-3.webp") type("image/webp"),
    url("/assets/soft/film-3.jpg") type("image/jpeg")
  );
  background-position: right center;
  background-size: cover;
}

.site_band__8kDc4::before {
  background-image:
    radial-gradient(ellipse 92% 88% at 68% 58%, transparent 42%, var(--band-bg, var(--base)) 78%),
    image-set(
      url("/assets/soft/solutions.webp") type("image/webp"),
      url("/assets/soft/solutions.jpg") type("image/jpeg")
    );
  background-size: cover;
  background-position: center, 78% 60%;
  -webkit-mask-image: radial-gradient(ellipse 54% 60% at 72% 58%, #000 0%, #000 16%, transparent 64%);
  mask-image: radial-gradient(ellipse 54% 60% at 72% 58%, #000 0%, #000 16%, transparent 64%);
}

.site_sec__Y3LGN:has(#trust)::before {
  background-image: image-set(
    url("/assets/soft/trust.webp") type("image/webp"),
    url("/assets/soft/trust.jpg") type("image/jpeg")
  );
  background-size: cover;
  background-position: 20% 30%;
  -webkit-mask-image: radial-gradient(ellipse 48% 55% at 8% 18%, #000 0%, #000 22%, transparent 68%);
  mask-image: radial-gradient(ellipse 48% 55% at 8% 18%, #000 0%, #000 22%, transparent 68%);
}

.site_sec__Y3LGN:has(#pricing)::before {
  background-image: image-set(
    url("/assets/soft/pricing.webp") type("image/webp"),
    url("/assets/soft/pricing.jpg") type("image/jpeg")
  );
  background-size: cover;
  background-position: center 70%;
  -webkit-mask-image: radial-gradient(ellipse 64% 40% at 50% 74%, #000 0%, #000 18%, transparent 68%);
  mask-image: radial-gradient(ellipse 64% 40% at 50% 74%, #000 0%, #000 18%, transparent 68%);
}

.site_final__VMhjv::before {
  background-image:
    linear-gradient(to bottom, var(--base) 0%, transparent 24%, transparent 58%, var(--base) 100%),
    image-set(
      url("/assets/soft/cta.webp") type("image/webp"),
      url("/assets/soft/cta.jpg") type("image/jpeg")
    );
  background-size: cover;
  background-position: center, center 72%;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 64%, transparent 96%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 64%, transparent 96%);
}

@media (max-width: 760px) {
  .site_hero__H_Blr::before {
    background-image:
      linear-gradient(to bottom, var(--base) 0%, transparent 42%),
      image-set(
        url("/assets/soft/hero-mobile.webp") type("image/webp"),
        url("/assets/soft/hero-mobile.jpg") type("image/jpeg")
      );
    background-size: cover;
    background-position: center, 72% 88%;
    -webkit-mask-image: radial-gradient(ellipse 95% 42% at 62% 76%, #000 0%, #000 28%, transparent 72%);
    mask-image: radial-gradient(ellipse 95% 42% at 62% 76%, #000 0%, #000 28%, transparent 72%);
  }
}

/* Dark ground: paint the warm sky back to the real base, leave the fold. */
html[data-site-theme="dark"] .site_hero__H_Blr::before,
html.dark .site_hero__H_Blr::before {
  background-image:
    linear-gradient(to right, var(--base) 0%, transparent 46%),
    image-set(
      url("/assets/soft/hero.webp") type("image/webp"),
      url("/assets/soft/hero.jpg") type("image/jpeg")
    );
  background-size: auto, 240% auto;
  background-position: center, 100% 100%;
  -webkit-mask-image: radial-gradient(ellipse 50% 62% at 90% 34%, #000 0%, #000 26%, transparent 74%);
  mask-image: radial-gradient(ellipse 50% 62% at 90% 34%, #000 0%, #000 26%, transparent 74%);
}

html[data-site-theme="dark"] .site_final__VMhjv::before,
html.dark .site_final__VMhjv::before {
  background-image:
    linear-gradient(to bottom, var(--base) 0%, var(--base) 46%, transparent 74%, var(--base) 100%),
    image-set(
      url("/assets/soft/cta.webp") type("image/webp"),
      url("/assets/soft/cta.jpg") type("image/jpeg")
    );
  background-size: auto, 170% auto;
  background-position: center, 40% 100%;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, transparent 40%, #000 68%, #000 82%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, transparent 40%, #000 68%, #000 82%, transparent 100%);
}

html[data-site-theme="dark"] .site_band__8kDc4::before,
html.dark .site_band__8kDc4::before {
  background-image:
    radial-gradient(ellipse 92% 88% at 68% 58%, transparent 42%, var(--band-bg, var(--base)) 78%),
    linear-gradient(to bottom, var(--band-bg, var(--base)) 0%, transparent 28%),
    image-set(
      url("/assets/soft/solutions.webp") type("image/webp"),
      url("/assets/soft/solutions.jpg") type("image/jpeg")
    );
  background-position: center, center, 82% 100%;
}

@media (max-width: 760px) {
  html[data-site-theme="dark"] .site_hero__H_Blr::before,
  html.dark .site_hero__H_Blr::before {
    background-image:
      linear-gradient(to bottom, var(--base) 0%, var(--base) 26%, transparent 40%),
      image-set(
        url("/assets/soft/hero-mobile.webp") type("image/webp"),
        url("/assets/soft/hero-mobile.jpg") type("image/jpeg")
      );
    background-size: auto, 220% auto;
    background-position: center, 88% 92%;
    -webkit-mask-image: radial-gradient(ellipse 150% 62% at 72% 58%, #000 0%, #000 36%, transparent 76%);
    mask-image: radial-gradient(ellipse 150% 62% at 72% 58%, #000 0%, #000 36%, transparent 76%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .site_hero__H_Blr::before,
  .site_band__8kDc4::before,
  .site_sec__Y3LGN:is(:has(#trust), :has(#pricing))::before,
  .site_final__VMhjv::before,
  .site_plate__EXRcg::before {
    animation: none;
  }
}
