/* Home hero pond: morning light, reeds, dragonflies, shore pebbles.
   Perf rules: only transform/opacity animate (7 elements, 8-22s loops), no filters/blur/masks,
   contain:paint on the layer, static under prefers-reduced-motion. */
.hpond>h2,.hpond>.qpads,.hpond>.pond-empty{position:relative;z-index:1}
.pdeco{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;contain:paint}
.pdeco>*{position:absolute}
.pdefs{width:0;height:0}
.sun{inset:0;background:radial-gradient(ellipse 60% 55% at 88% 0%,rgba(255,248,214,.38),rgba(255,248,214,0) 70%)}
.beam{top:0;height:100%;left:6%;width:54px;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.21),rgba(255,255,255,0));transform:skewX(-22deg);opacity:.8}
.b2{left:72%;width:90px}
/* static: blends the streaks into the pond edges (top = wave colour, bottom = deep water) */
.fade{inset:0;background:linear-gradient(180deg,#86CDB4 0,rgba(134,205,180,0) 44px,rgba(60,138,121,0) 78%,#3C8A79 100%)}
.reed{bottom:-4px;transform-origin:50% 100%;opacity:.62;animation:sway 9s ease-in-out infinite alternate;will-change:transform}
.rl{left:-21px;width:100px;height:200px}
.rr{right:-23px;width:96px;height:190px;animation-delay:-4s}
@keyframes sway{from{transform:rotate(-1.6deg)}to{transform:rotate(1.8deg)}}
/* shore pebbles: static, sit just under the pond's lower wave */
.shorep{position:absolute;left:0;right:0;top:100%;height:0;z-index:3;pointer-events:none}
.peb{position:absolute;width:76px;height:18px;top:26px}
.e1{left:10px}.e2{right:12px}.e3{display:none}
@media (min-width:860px){
 .rl{left:2%;width:150px;height:300px}
 .rr{right:2%;width:150px;height:285px}
 .d1{left:58%;top:18px;width:44px;height:30px}.d2{left:12%;bottom:auto;top:60%;width:36px;height:24px}
 .b1{left:4%}.b2{left:76%}
 .peb{width:96px;height:22px}.e1{left:6%}.e2{right:auto;left:55%}.e3{display:block;right:6%}
}
@media (prefers-reduced-motion:reduce){.pdeco *{animation:none!important;will-change:auto}}