/* Small voxel-style blossoms and restrained morning air, below hero controls. */
.waterfront-atmosphere {
  position: absolute;
  inset: 0;
  z-index: 4;
  overflow: hidden;
  isolation: isolate;
  pointer-events: none;
  user-select: none;
  --wa-width: 100vw;
  --wa-travel: calc(100svh + 200px);
  --wa-scale: 1;
  --wa-mist-strength: .42;
  --wa-sun-strength: .34;
}
.waterfront-blossom-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.waterfront-atmosphere::before,
.waterfront-atmosphere::after {
  content: '';
  position: absolute;
  z-index: 0;
  pointer-events: none;
  animation-play-state: paused;
}
/* Stay below the far bank: gradients feather without a full-scene blur. */
.waterfront-atmosphere::before {
  top: 54%;
  left: -8%;
  width: 116%;
  height: 17%;
  background:
    radial-gradient(ellipse at 27% 58%,rgba(228,244,240,.14),rgba(235,248,243,.06) 36%,transparent 68%),
    radial-gradient(ellipse at 77% 40%,rgba(246,246,240,.10),transparent 59%);
  animation: waterfront-lake-mist 32s ease-in-out -9s infinite alternate both;
  animation-play-state: paused;
}
/* A fixed upper-left source gently brightens; no sweeping beam crosses the house. */
.waterfront-atmosphere::after {
  top: 0;
  left: 0;
  width: 43%;
  height: 43%;
  background:
    radial-gradient(ellipse at 27% 14%,rgba(255,237,195,.20),rgba(255,239,207,.06) 28%,transparent 62%),
    linear-gradient(128deg,transparent 36%,rgba(255,243,215,.10) 40%,transparent 45%,transparent 54%,rgba(255,244,219,.06) 57%,transparent 62%);
  -webkit-mask-image: radial-gradient(ellipse at 27% 12%,#000 8%,rgba(0,0,0,.4) 46%,transparent 72%);
  mask-image: radial-gradient(ellipse at 27% 12%,#000 8%,rgba(0,0,0,.4) 46%,transparent 72%);
  animation: waterfront-morning-light 27s ease-in-out -8s infinite alternate both;
  animation-play-state: paused;
}
html[data-theme=dark] .waterfront-atmosphere { --wa-mist-strength: .24; --wa-sun-strength: .14; }
.waterfront-blossom {
  position: absolute;
  left: var(--wa-x);
  top: -100px;
  width: calc(var(--wa-size) * var(--wa-scale));
  height: calc(var(--wa-size) * var(--wa-scale));
  opacity: 0;
  pointer-events: none;
  animation: waterfront-blossom-fall var(--wa-duration) linear var(--wa-delay) infinite both;
  animation-play-state: paused;
  --wa-opacity: .68;
}
.waterfront-blossom[data-depth=far] { z-index: 1; --wa-opacity: .44; }
.waterfront-blossom[data-depth=middle] { z-index: 2; }
.waterfront-blossom[data-depth=near] { z-index: 3; --wa-opacity: .8; }
.waterfront-blossom-shape {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  stroke: none;
  stroke-width: 0;
  shape-rendering: crispEdges;
  image-rendering: pixelated;
  transform-origin: 50% 50%;
  animation: waterfront-blossom-tumble var(--wa-tumble) ease-in-out var(--wa-spin-delay) infinite both;
  animation-direction: var(--wa-direction);
  animation-play-state: paused;
}
.waterfront-atmosphere[data-state=running] .waterfront-blossom,
.waterfront-atmosphere[data-state=running] .waterfront-blossom-shape,
.waterfront-atmosphere[data-state=running]::before,
.waterfront-atmosphere[data-state=running]::after { animation-play-state: running; }

@keyframes waterfront-lake-mist {
  from { opacity: calc(var(--wa-mist-strength) * .65); transform: translate3d(-1.5%,0,0); }
  to { opacity: var(--wa-mist-strength); transform: translate3d(1.8%,-2px,0); }
}
@keyframes waterfront-morning-light {
  from { opacity: calc(var(--wa-sun-strength) * .6); }
  to { opacity: var(--wa-sun-strength); }
}

@keyframes waterfront-blossom-fall {
  0% { opacity: 0; transform: translate3d(0,0,0); }
  11% { opacity: var(--wa-opacity); }
  24% { transform: translate3d(calc(var(--wa-drift) * .24 + var(--wa-sway)),calc(var(--wa-travel) * .24),0); }
  49% { transform: translate3d(calc(var(--wa-drift) * .49 - var(--wa-sway) * .42),calc(var(--wa-travel) * .49),0); }
  73% { transform: translate3d(calc(var(--wa-drift) * .73 + var(--wa-sway) * .68),calc(var(--wa-travel) * .73),0); }
  88% { opacity: var(--wa-opacity); }
  100% { opacity: 0; transform: translate3d(var(--wa-drift),var(--wa-travel),0); }
}
@keyframes waterfront-blossom-tumble {
  0%,100% { transform: rotateZ(var(--wa-angle)) rotateY(-18deg); }
  25% { transform: rotateZ(calc(var(--wa-angle) + 14deg)) rotateY(24deg); }
  50% { transform: rotateZ(calc(var(--wa-angle) - 8deg)) rotateY(-30deg); }
  75% { transform: rotateZ(calc(var(--wa-angle) + 9deg)) rotateY(12deg); }
}
@media (max-width:760px) {
  .waterfront-blossom-extra { display: none; }
  .waterfront-blossom[data-depth=far] { --wa-opacity: .38; }
}
html[data-motion=paused] .waterfront-atmosphere .waterfront-blossom,
html[data-motion=paused] .waterfront-atmosphere .waterfront-blossom-shape,
html[data-motion=paused] .waterfront-atmosphere::before,
html[data-motion=paused] .waterfront-atmosphere::after { animation-play-state: paused; }
@media (prefers-reduced-motion:reduce) {
  .waterfront-atmosphere::before,
  .waterfront-atmosphere::after { display: none; }
  .waterfront-blossom,
  .waterfront-atmosphere[data-state=running] .waterfront-blossom,
  .waterfront-blossom-shape,
  .waterfront-atmosphere[data-state=running] .waterfront-blossom-shape { animation-play-state: paused; }
}