/* Sales-only atmosphere. Decoration never changes layout or intercepts input. */
body {
  background-image: url('../assets/img/sales/abstract-playground.svg'), url('../assets/img/sales/abstract-playground.svg');
  background-size: 760px auto;
  background-position: left -590px top 150px, right -590px top -20px;
  background-repeat: no-repeat;
}
.hero-copy { position: relative; }
.site-header { position: relative; }

/* Keep the spacious reading column; give its edges a quiet, playful texture. */
.pain-section, .preview-section, .extras-section, .parent-section,
.fit-section, .start-section, .faq-section, .site-footer {
  position: relative;
  isolation: isolate;
}
.pain-section::before, .preview-section::before, .extras-section::before,
.parent-section::before, .fit-section::before, .start-section::before,
.faq-section::before, .site-footer::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: url('../assets/img/sales/abstract-playground.svg') no-repeat;
  background-size: 410px auto;
  background-position: right -135px top -80px;
  opacity: .62;
}
.preview-section::before { background-size: 500px; background-position: left -170px top 15px; }
.extras-section::before { background-position: right -105px bottom -100px; opacity: .8; }
.parent-section::before { background-position: right -100px top -10px; }
.fit-section::before { background-position: left -150px bottom -195px; opacity: .42; }
.start-section::before { background-position: right -100px top -100px; }
.faq-section::before { background-position: left -180px bottom -120px; }
.site-footer::before { background-position: right -100px bottom -220px; opacity: .45; }

/* Full-width colour bands: abstract curves, not more content cards. */
.worlds-section {
  background-image: url('../assets/img/sales/abstract-playground.svg');
  background-repeat: no-repeat;
  background-size: 740px auto;
  background-position: right -160px top -170px;
}
.routine-section {
  background-image: url('../assets/img/sales/abstract-playground.svg');
  background-repeat: no-repeat;
  background-size: 640px auto;
  background-position: left -220px bottom -180px;
}
.solution-band, .offer-section {
  background-image: url('../assets/img/sales/abstract-evening.svg'), url('../assets/img/sales/abstract-evening.svg');
  background-size: 550px auto, 650px auto;
  background-position: left -210px center, right -200px center;
  background-repeat: no-repeat;
}
.closing-section {
  background-image: url('../assets/img/sales/abstract-playground.svg'), url('../assets/img/sales/abstract-evening.svg');
  background-size: 660px auto, 640px auto;
  background-position: left -250px center, right -190px center;
  background-repeat: no-repeat;
}

@media (max-width: 760px) {
  body { background-size: 520px; background-position: left -420px top 180px, right -430px top 100px; }
  .pain-section::before, .preview-section::before, .extras-section::before,
  .parent-section::before, .fit-section::before, .start-section::before,
  .faq-section::before, .site-footer::before {
    background-size: 300px;
    background-position: right -180px top -30px;
    opacity: .48;
  }
  .preview-section::before, .faq-section::before { background-position: left -210px bottom 10px; }
  .worlds-section { background-size: 500px; background-position: right -320px top -100px; }
  .routine-section { background-size: 460px; background-position: left -300px bottom -120px; }
  .solution-band, .offer-section { background-size: 450px, 430px; background-position: left -330px top, right -290px bottom; }
  .closing-section { background-size: 470px, 450px; background-position: left -330px top, right -300px bottom; }
}
@media (forced-colors: active) {
  body, .worlds-section, .routine-section, .solution-band, .offer-section, .closing-section { background-image: none; }
  .pain-section::before, .preview-section::before, .extras-section::before,
  .parent-section::before, .fit-section::before, .start-section::before,
  .faq-section::before, .site-footer::before { display: none; }
}
