/* Homepage 6: current homepage colours and the footer's star silhouette.
   An oversized star sweeps across the header, briefly leaving at the left
   edge before returning through the lower part of the scene.
   The native CA Colors
   variant continues to supply the background drift and scroll-to-black fade. */
.elementSection.elementSection_var10000.ca-hero-footer-star::before {
  background:
    radial-gradient(
      ellipse at 19% 27%,
      #d0784d 0%,
      rgba(208, 120, 77, .85) 12%,
      rgba(208, 120, 77, 0) 38%
    ),
    radial-gradient(
      ellipse at 32% 76%,
      #d43670 0%,
      rgba(212, 54, 112, .95) 18%,
      rgba(212, 54, 112, 0) 49%
    ),
    radial-gradient(
      ellipse at 73% 34%,
      #79509c 0%,
      rgba(121, 80, 156, .85) 18%,
      rgba(121, 80, 156, 0) 46%
    ),
    linear-gradient(118deg, #c74061 5%, #ba397a 34%, #713c89 62%, #483675 95%);
  filter: blur(24px) saturate(1.55) brightness(1.08);
}

.elementSection.elementSection_var10000.ca-hero-footer-star::after {
  --ca6-star-size: min(112vw, 150svh);
  --ca6-travel-x: 30vw;
  --ca6-travel-y: 24svh;
  width: var(--ca6-star-size);
  height: var(--ca6-star-size);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'%3E%3Cdefs%3E%3ClinearGradient id='star' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%2379509c'/%3E%3Cstop offset='.5' stop-color='%2365479a'/%3E%3Cstop offset='1' stop-color='%23483675'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon points='500,70 621,333 909,367 696,564 753,848 500,706 247,848 304,564 91,367 379,333' fill='url(%23star)'/%3E%3C/svg%3E");
  filter: blur(clamp(28px, 3vw, 55px)) saturate(1.6) brightness(1.08);
  animation: ca6HeaderStarDrift 40s ease-in-out -5s infinite;
}

@keyframes ca6HeaderStarDrift {
  0%, 100% {
    transform: translate3d(calc(-50% + var(--ca6-travel-x) * .7), calc(-50% - var(--ca6-travel-y)), 0) rotate(-18deg) scale(.98);
  }
  28% {
    transform: translate3d(calc(-50% - var(--ca6-travel-x) * .7), calc(-50% - var(--ca6-travel-y) * .5), 0) rotate(8deg) scale(1.04);
  }
  48% {
    transform: translate3d(calc(-50% - 50vw - var(--ca6-star-size) * .55), calc(-50% + var(--ca6-travel-y) * .6), 0) rotate(22deg) scale(1.02);
  }
  62% {
    transform: translate3d(calc(-50% - var(--ca6-travel-x) * .25), calc(-50% + var(--ca6-travel-y)), 0) rotate(35deg) scale(.97);
  }
  82% {
    transform: translate3d(calc(-50% + var(--ca6-travel-x)), calc(-50% + var(--ca6-travel-y) * .35), 0) rotate(5deg) scale(1.03);
  }
}

.elementSection.elementSection_var10000.ca-hero-footer-star.ca-colors-paused::after {
  animation-play-state: paused;
}

@media (max-width: 767px) {
  .elementSection.elementSection_var10000.ca-hero-footer-star::before {
    filter: blur(17px) saturate(1.55) brightness(1.08);
  }
  .elementSection.elementSection_var10000.ca-hero-footer-star::after {
    --ca6-star-size: min(154vw, 98svh);
    --ca6-travel-x: 34vw;
    --ca6-travel-y: 26svh;
    filter: blur(30px) saturate(1.6) brightness(1.08);
    animation-duration: 36s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .elementSection.elementSection_var10000.ca-hero-footer-star::after {
    animation: none;
    transform: translate3d(-50%, -50%, 0) rotate(-18deg);
  }
}