/* Tablet, mobil, çok dar ve yatay telefon düzenleri */
/* ---------- Tablet ---------- */
@media (max-width: 900px) {
  .bf2 { right: 30%; }
  .sit2 { left: calc(4% + 140px); width: 84px; }
}

/* ---------- Mobil ---------- */
@media (max-width: 600px) {
  main { padding-top: 32px; padding-bottom: 120px; justify-content: flex-start; }
  .hero-dog { width: 210px; height: 210px; margin-top: 12px; }
  .features { gap: 6px; margin-top: 22px; }
  .features li { font-size: 12.5px; padding: 6px 10px; }

  .sun, .moon { width: 84px; height: 84px; top: 3%; right: 4%; }
  .fireflies { height: 110px; }
  .horizon { height: 86px; bottom: calc(100% - 22px); }
  .horizon .range { bottom: 22px; height: 68px; }
  .horizon .field { height: 40px; }
  .sun .core { box-shadow: 0 0 0 8px rgba(242,201,138,.22), 0 0 0 18px rgba(242,201,138,.10); }
  .cloud.c1 { width: 100px; }
  .cloud.c2 { width: 70px; }
  .cloud.c3 { width: 84px; }
  .leaf:nth-child(n+8) { display: none; }

  footer { padding-top: 100px; }
  .tree1 { width: 96px; left: 2%; bottom: calc(100% - 24px); }
  .tree2 { width: 80px; right: 2%; bottom: calc(100% - 24px); }
  .bf1 { left: calc(2% + 92px); bottom: calc(100% + 28px); width: 18px; }
  .bf2, .bf3 { display: none; }

  .roamers { bottom: calc(100% - 68px); height: 130px; }
  .dog-a { width: 104px; }
  .dog-b { width: 72px; bottom: 22px; }
  .dog-c { width: 86px; bottom: 11px; }

  .sit1 { width: 52px; right: calc(2% + 66px); bottom: calc(100% - 22px); }
  .sit2 { width: 64px; left: calc(2% + 96px); bottom: calc(100% - 16px); }

  .grass-row svg:nth-child(n+7) { display: none; }
  .paws { height: 36px; margin-bottom: 16px; }
  .paws svg { width: 16px; height: 16px; }
  .paws svg:nth-child(n+7) { display: none; }
  .credit { font-size: 13px; }
  .credit img { height: 24px; }
}

@media (max-width: 360px) {
  .hero-dog { width: 180px; height: 180px; }
  .sit2 { display: none; }
}

@media (max-height: 500px) and (orientation: landscape) {
  main { padding-top: 20px; padding-bottom: 110px; }
  .hero-dog { width: 150px; height: 150px; }
  h1 { font-size: 52px; }
}