/* Alt sahne: çimenlik, ağaçlar, kelebekler, gezen/oturan köpekler, top, pati izleri, imza */
/* ---------- Alt sahne ---------- */
footer {
  position: relative; z-index: 2; background: #AEBE7C;
  border-top: 1px solid rgba(60,40,25,.06);
  padding: 150px 20px 22px;
  padding-bottom: max(22px, env(safe-area-inset-bottom));
  isolation: isolate;
}
.tree1 { position: absolute; left: 4%; bottom: calc(100% - 38px); width: 150px; z-index: -1; }
.tree2 { position: absolute; right: 5%; bottom: calc(100% - 38px); width: 120px; z-index: -1; }
.far-tree .crown,
.tree1 .crown, .tree2 .crown { transform-box: view-box; transform-origin: 75px 150px; animation: sway 6s ease-in-out infinite; }
.tree2 .crown { animation-duration: 7s; animation-delay: -2.5s; }
.butterfly { position: absolute; }
.butterfly ellipse:first-child { transform-box: fill-box; transform-origin: 100% 50%; animation: wing .18s ease-in-out infinite alternate; }
.butterfly ellipse:nth-child(2) { transform-box: fill-box; transform-origin: 0% 50%; animation: wing .18s ease-in-out infinite alternate; }
.bf1 { left: calc(4% + 150px); bottom: calc(100% + 40px); width: 22px; }
.bf2 { right: calc(5% + 210px); bottom: calc(100% + 96px); width: 18px; animation: flutter 11s ease-in-out -4s infinite; }
.bf3 { left: 38%; bottom: calc(100% + 58px); width: 16px; animation: flutter 13s ease-in-out -8s infinite; }

.roamers { position: absolute; left: 0; right: 0; bottom: calc(100% - 150px); height: 190px; pointer-events: none; overflow: visible; z-index: 5; }
.roamers svg { position: absolute; left: 0; overflow: visible; }
.dog-a { bottom: 0; width: 150px; z-index: 3; animation: roamR 24s linear infinite; }
.dog-b { bottom: 28px; width: 104px; z-index: 1; animation: roamL 31s linear -9s infinite; }
.dog-c { bottom: 14px; width: 122px; z-index: 2; animation: roamR 18s linear -11s infinite; }
.leg { transform-box: fill-box; transform-origin: 50% 0; }

.sit1 { position: absolute; right: calc(5% + 56px); bottom: calc(100% - 34px); width: 76px; z-index: -1; }
.sit2 { position: absolute; left: calc(4% + 172px); bottom: calc(100% - 26px); width: 96px; z-index: -1; }
@media (min-width: 1000px) { .sit2 { left: calc(26% + 108px); } }

.grass-row { position: absolute; left: 0; right: 0; top: 6px; display: flex; justify-content: space-around; pointer-events: none; z-index: 0; }
.grass-row svg { width: 22px; height: 16px; transform-origin: 50% 100%; animation: grass 3s ease-in-out infinite; }
.grass-row svg:nth-child(odd) { margin-top: 14px; }

.ball { position: absolute; left: 0; top: 85px; width: 26px; height: 26px; animation: roll 16s linear 4s infinite; }
.ball svg { width: 100%; height: 100%; animation: bounce .5s ease-in infinite alternate, spin .8s linear infinite; }

.paws { display: flex; justify-content: space-between; max-width: 1100px; margin: 0 auto 22px; padding: 0 4px; height: 44px; align-items: center; }
.paws svg { width: 20px; height: 20px; color: #6E8038; opacity: .42; transform: rotate(90deg); }
.paws svg:nth-child(odd) { translate: 0 -9px; }
.paws svg:nth-child(even) { translate: 0 9px; }

.credit { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; font-size: 14px; font-weight: 500; color: rgba(38,44,18,.68); }
.credit strong { font-weight: 600; color: #2E3A16; }
.credit img { height: 28px; width: auto; object-fit: contain; }
