/* ═══ Duyarlı düzen — mobil öncelikli ince ayarlar ═══ */

/* ── Tablet ── */
@media (max-width: 1024px) {
  .ust-menu {
    display: none;
  }
  .menu-dugme {
    display: grid;
  }
  .imlec,
  .imlec-nokta {
    display: none;
  }
  .dekor {
    width: 100%;
  }

  .s1-u1 { left: 10%; }
  .s1-u2 { left: 90%; }
  .s2-u1 { left: 11%; }
  .s2-u2 { left: 89%; }

  .yay-oge { width: clamp(84px, 13vw, 150px); }
}

/* ── Mobil ── */
@media (max-width: 768px) {
  .sayac,
  .sosyal {
    display: none;
  }
  .noktalar {
    right: calc(var(--edge) * 0.5);
    gap: 0.8rem;
  }
  .noktalar button {
    width: 7px;
    height: 7px;
  }
  .noktalar button::after {
    display: none;
  }
  .ipucu {
    bottom: 0.9rem;
  }
  .ipucu-yazi {
    display: none;
  }

  .sahne {
    padding-top: calc(var(--header-h) + 2.4vh);
  }
  .metin {
    gap: 0.65rem;
  }
  .lead {
    max-width: 32ch;
  }

  /* Sahne 1 — uydular köşelere çekilir, vitrin büyür */
  .s1-vitrin { top: 46%; width: min(56vw, 250px); }
  .s1-golge { top: 72%; width: min(52vw, 230px); }
  .s1-u1 { left: 15%; top: 20%; width: min(24vw, 104px); }
  .s1-u2 { left: 85%; top: 26%; width: min(22vw, 96px); }
  .s1-u3 { left: 17%; top: 74%; width: min(20vw, 88px); }
  .s1-u4 { left: 84%; top: 71%; width: min(21vw, 92px); }

  /* Sahne 2 · Adet Tatlılar — uydular köşelere, vitrin ortada */
  .at-vitrin { left: 50%; top: 45%; width: min(58vw, 260px); }
  .at-golge { left: 50%; top: 71%; width: min(52vw, 230px); }
  .at-u1 { left: 15%; top: 22%; width: min(24vw, 104px); }
  .at-u2 { left: 85%; top: 19%; width: min(24vw, 106px); }
  .at-u3 { left: 15%; top: 72%; width: min(21vw, 92px); }
  .at-u4 { left: 85%; top: 68%; width: min(22vw, 96px); }
  .at-u5 { display: none; }

  /* Sahne 2 (eski) */
  .s2-vitrin { top: 47%; width: min(54vw, 240px); }
  .s2-golge { top: 73%; width: min(50vw, 220px); }
  .s2-u1 { left: 14%; top: 24%; width: min(23vw, 98px); }
  .s2-u2 { left: 86%; top: 32%; width: min(21vw, 92px); }
  .s2-u3 { display: none; }
  .kat-cizgi { width: 88vw; }

  /* Sahne 3 — yay sıkışır, uçtakiler gizlenir */
  .vitrin-yay { height: clamp(150px, 26vh, 220px); }
  .yay-oge { width: min(30vw, 116px); }
  .yay-oge:nth-child(1) { --x: -8.2rem !important; --y: 2.2rem !important; }
  .yay-oge:nth-child(2) { --x: -4.2rem !important; --y: -0.6rem !important; }
  .yay-oge:nth-child(3) { --x: 0rem !important; --y: -2rem !important; }
  .yay-oge:nth-child(4) { --x: 4.2rem !important; --y: -0.6rem !important; }
  .yay-oge:nth-child(5) { --x: 8.2rem !important; --y: 2.2rem !important; }
  .serit-ic span { font-size: 0.92rem; }

  /* Sahne 4 */
  .s4-vitrin { top: 50%; width: min(52vw, 220px); }
  .s4-golge { top: 74%; width: min(48vw, 200px); }
  .s4-u1 { left: 15%; top: 30%; width: min(23vw, 96px); }
  .s4-u2 { left: 85%; top: 38%; width: min(21vw, 90px); }

  /* Sahne 5 */
  .lambalar { width: 96vw; opacity: 0.75; }
  .metin-iletisim { margin-top: clamp(1.8rem, 6vh, 3rem); }
  .iletisim-izgara {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .iletisim-oge p br {
    display: none;
  }
}

/* ── Küçük mobil ── */
@media (max-width: 400px) {
  .s1-u3,
  .s1-u4 {
    display: none;
  }
  .marka {
    width: min(52vw, 172px);
  }
}

/* ── Alçak ekranlar (yatay telefon / küçük dizüstü) ── */
@media (max-height: 700px) and (min-width: 769px) {
  .metin {
    gap: 0.55rem;
  }
  .lead {
    font-size: 0.92rem;
    line-height: 1.55;
  }
  .s1-vitrin,
  .s2-vitrin,
  .s4-vitrin {
    width: clamp(170px, 26vh, 280px);
  }
  .ipucu {
    display: none;
  }
}