/*
 * Subtle, non-interactive pastel accents for adult pages.
 * Decorations always live at section edges; readable content is layered above.
 */
.has-site-decor {
  position: relative;
  isolation: isolate;
  overflow-x: clip;
  --decor-inset: max(0.8rem, calc((100vw - var(--container)) / 2 - 8.5rem));
}

.has-site-decor > .site-wrap,
.has-site-decor > .inner-content,
.has-site-decor > .inner-grid,
.has-site-decor > .cta-final__inner,
.has-site-decor > .adhd-test-shell {
  position: relative;
  z-index: 2;
}

.has-site-decor > :not(.site-decor) {
  position: relative;
  z-index: 2;
}

.site-decor {
  position: absolute;
  z-index: 1;
  display: block;
  width: 5.5rem;
  height: 5.5rem;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 5px 10px rgba(29, 80, 111, 0.06));
}

.site-decor--mobile {
  display: none;
}

.site-decor--loop-tl,
.site-decor--loop-br {
  width: clamp(5.5rem, 11vw, 9.5rem);
  height: clamp(4rem, 8vw, 6.5rem);
  background-image: url("../images/decor/loop-mint.svg");
}

.site-decor--dots-tr,
.site-decor--dots-bl {
  width: clamp(3.5rem, 7vw, 6rem);
  height: clamp(3rem, 6vw, 4.8rem);
  background-image: url("../images/decor/dots-lilac.svg");
}

.site-decor--arch-tr,
.site-decor--arch-bl {
  width: clamp(5rem, 10vw, 8.5rem);
  height: clamp(5rem, 10vw, 8.5rem);
  background-image: url("../images/decor/arch-apricot.svg");
}

.site-decor--spark-tr,
.site-decor--spark-bl {
  width: clamp(2.6rem, 5vw, 4.5rem);
  height: clamp(2.6rem, 5vw, 4.5rem);
  background-image: url("../images/decor/spark-blue.svg");
}

.site-decor--loop-tl,
.site-decor--arch-bl,
.site-decor--spark-bl {
  left: var(--decor-inset);
}

.site-decor--dots-bl,
.site-decor--loop-br {
  right: var(--decor-inset);
}

.site-decor--dots-tr,
.site-decor--arch-tr,
.site-decor--spark-tr {
  right: var(--decor-inset);
}

.site-decor--loop-tl,
.site-decor--dots-tr,
.site-decor--arch-tr,
.site-decor--spark-tr {
  top: 1rem;
}

.site-decor--dots-bl,
.site-decor--arch-bl,
.site-decor--loop-br,
.site-decor--spark-bl {
  bottom: 1rem;
}

.site-decor--loop-tl { transform: rotate(-9deg); }
.site-decor--loop-br { transform: rotate(8deg); }
.site-decor--dots-tr { transform: rotate(8deg); }
.site-decor--dots-bl { transform: rotate(-7deg); }
.site-decor--arch-tr { transform: rotate(9deg); }
.site-decor--arch-bl { transform: rotate(-8deg); }

.why-choose > .site-decor--arch-tr {
  top: 50%;
  right: auto;
  left: var(--decor-inset);
  transform: translateY(-50%) rotate(-8deg);
}
.site-decor--spark-tr { transform: rotate(10deg); }
.site-decor--spark-bl { transform: rotate(-12deg); }

.site-decor--hero-loop {
  right: -1.15rem;
  top: 0.35rem;
  bottom: auto;
  left: auto;
  width: clamp(5.5rem, 7vw, 8.5rem);
  height: clamp(3.6rem, 5vw, 5.75rem);
  background-image: url("../images/decor/loop-mint.svg");
  transform: rotate(8deg);
}

.site-decor--hero-spark {
  top: -1.2rem;
  right: var(--decor-inset);
  width: clamp(3rem, 5vw, 4.75rem);
  height: clamp(3rem, 5vw, 4.75rem);
  background-image: url("../images/decor/spark-blue.svg");
  transform: rotate(10deg);
}

body:not(.is-kids) .hero-split__media > .site-decor {
  z-index: 0;
}

.site-decor--test-arch {
  top: 1rem;
  left: var(--decor-inset);
  width: clamp(5.5rem, 9vw, 8rem);
  height: clamp(5.5rem, 9vw, 8rem);
  background-image: url("../images/decor/arch-apricot.svg");
  transform: rotate(-9deg);
}

.site-decor--test-dots {
  right: var(--decor-inset);
  bottom: 1rem;
  width: clamp(3rem, 5vw, 4.5rem);
  height: clamp(2.6rem, 4vw, 3.8rem);
  background-image: url("../images/decor/dots-lilac.svg");
  transform: rotate(8deg);
}

body:not(.is-kids) .cta-final__inner > .site-decor {
  z-index: 1;
}

body:not(.is-kids) .cta-final__inner > *:not(.site-decor) {
  position: relative;
  z-index: 2;
}

/* Below ~1680px the side gutter is smaller than the ornaments, so they sit on copy. */
@media (max-width: 1679px) {
  .has-site-decor > .site-decor--loop-tl,
  .has-site-decor > .site-decor--loop-br,
  .has-site-decor > .site-decor--dots-tr,
  .has-site-decor > .site-decor--dots-bl,
  .has-site-decor > .site-decor--arch-tr,
  .has-site-decor > .site-decor--arch-bl,
  .has-site-decor > .site-decor--spark-tr,
  .has-site-decor > .site-decor--spark-bl,
  .has-site-decor > .site-decor--test-arch,
  .has-site-decor > .site-decor--test-dots {
    display: none;
  }
}

@media (max-width: 767px) {
  .site-decor:not(.site-decor--mobile) {
    display: none;
  }

  .site-decor--mobile {
    --decor-angle: 0deg;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: block;
    width: 3.2rem;
    height: 2rem;
    overflow: hidden;
    border-radius: 0.35rem;
    opacity: 0.88;
    filter: none;
    transform: rotate(var(--decor-angle));
  }

  .site-decor--mobile-left {
    right: auto;
    left: var(--decor-inline, 0.45rem);
    --decor-angle: -7deg;
  }

  .site-decor--mobile-right {
    right: var(--decor-inline, 0.45rem);
    left: auto;
    --decor-angle: 7deg;
  }

  .site-decor--mobile.site-decor--dots-tr,
  .site-decor--mobile.site-decor--dots-bl {
    background-image: url("../images/decor/dots-lilac.svg");
  }

  .site-decor--mobile.site-decor--spark-tr,
  .site-decor--mobile.site-decor--spark-bl {
    width: 3rem;
    height: 3rem;
    background-image: url("../images/decor/spark-blue.svg");
    background-size: 125%;
  }
  .site-decor--mobile-left.site-decor--spark-tr,
  .site-decor--mobile-left.site-decor--spark-bl {
    --decor-angle: -14deg;
    background-position: left center;
  }
  .site-decor--mobile-right.site-decor--spark-tr,
  .site-decor--mobile-right.site-decor--spark-bl {
    --decor-angle: 14deg;
    background-position: right center;
  }
  .site-decor--mobile.site-decor--dots-brand {
    width: 4.4rem;
    height: 2.25rem;
    background-image: url("../images/decor/dots-brand.svg");
    background-size: 116%;
  }
  .site-decor--mobile.site-decor--fringe {
    width: 5rem;
    height: 2.15rem;
    background-image: url("../images/decor/fringe-brand.svg");
    background-size: 112%;
  }
  .site-decor--mobile.site-decor--wave {
    width: 5.35rem;
    height: 1.8rem;
    background-image: url("../images/decor/wave-brand.svg");
    background-size: 108%;
  }
  .site-decor--mobile-left.site-decor--wave {
    --decor-angle: -4deg;
  }
  .site-decor--mobile-right.site-decor--wave {
    --decor-angle: 4deg;
  }
  .site-decor--mobile.site-decor--splash {
    width: 3.75rem;
    height: 2.75rem;
    background-image: url("../images/decor/splash-brand.svg");
    background-size: 122%;
  }
  .site-decor--mobile-left.site-decor--splash {
    --decor-angle: -11deg;
    background-position: left center;
  }
  .site-decor--mobile-right.site-decor--splash {
    --decor-angle: 11deg;
    background-position: right center;
  }

  .site-decor--placement-heading {
    top: var(--decor-heading-top, 0.45rem);
  }

  .site-decor--placement-divider {
    top: var(--decor-divider-top, -0.55rem);
    transform: translateY(-10%) rotate(var(--decor-angle));
  }

  .site-decor--placement-corner {
    top: var(--decor-corner-top, -0.45rem);
  }

  .site-decor--placement-edge-low {
    top: auto;
    bottom: var(--decor-low-bottom, 0.35rem);
  }

  .site-decor--mobile-left {
    background-position: left center;
  }

  .site-decor--mobile-right {
    background-position: right center;
  }

  .hero-split > .site-decor--placement-corner {
    --decor-corner-top: -2.4rem;
  }

  /* Mobile heroes get a small, varied edge pattern while desktop remains unchanged. */
  body.is-home:not(.is-kids) .hero-split > .site-decor--mobile {
    z-index: 3;
  }

  body.is-home:not(.is-kids) .hero-split--decor-home > .site-decor--mobile-left.site-decor--dots-brand {
    top: -1.3rem;
    left: -1.35rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-home > .site-decor--mobile-right.site-decor--spark-tr {
    top: 0.35rem;
    right: -0.65rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-home > .site-decor--mobile-right.site-decor--fringe {
    top: 8.75rem;
    right: -2rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-home > .site-decor--mobile-left.site-decor--wave {
    bottom: 0.65rem;
    left: -1.8rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-lodz > .site-decor--mobile-right.site-decor--arch-tr {
    top: -1.35rem;
    right: -2.25rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-lodz > .site-decor--mobile-left.site-decor--dots-tr {
    top: 5.4rem;
    left: -1.2rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-lodz > .site-decor--mobile-right.site-decor--splash {
    top: 13rem;
    right: -1.7rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-lodz > .site-decor--mobile-right.site-decor--wave {
    bottom: 0.75rem;
    right: -1.7rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-warszawa > .site-decor--mobile-left.site-decor--loop-tl {
    top: -1.35rem;
    left: -2.4rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-warszawa > .site-decor--mobile-right.site-decor--dots-brand {
    top: 5rem;
    right: -1.25rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-warszawa > .site-decor--mobile-left.site-decor--spark-tr {
    top: 12.1rem;
    left: -0.7rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-warszawa > .site-decor--mobile-right.site-decor--fringe {
    bottom: 0.7rem;
    right: -2rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-katowice > .site-decor--mobile-left.site-decor--splash {
    top: -0.9rem;
    left: -1.45rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-katowice > .site-decor--mobile-right.site-decor--arch-tr {
    top: 5.1rem;
    right: -2.2rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-katowice > .site-decor--mobile-left.site-decor--wave {
    top: auto;
    right: -1.85rem;
    bottom: 0.8rem;
    left: auto;
  }

  body.is-home:not(.is-kids) .hero-split--decor-katowice > .site-decor--mobile-left.site-decor--dots-tr {
    bottom: 0.7rem;
    left: -1.05rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-poznan > .site-decor--mobile-left.site-decor--fringe {
    top: -1.05rem;
    left: -2rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-poznan > .site-decor--mobile-right.site-decor--loop-tl {
    top: 5.2rem;
    right: -2.35rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-poznan > .site-decor--mobile-right.site-decor--spark-tr {
    top: 12.4rem;
    right: -0.65rem;
  }

  body.is-home:not(.is-kids) .hero-split--decor-poznan > .site-decor--mobile-right.site-decor--dots-brand {
    bottom: 0.75rem;
    right: -1.35rem;
  }

  .adhd-test-shell[data-test-view]:not([data-test-view="start"]) > .site-decor--mobile {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce), print {
  .site-decor {
    display: none;
  }
}