/* ============================================================
   BETPIR — responsive.css
   Kırılım noktaları: 1200 / 1024 / 900 / 768 / 560 / 400
   ============================================================ */

/* ---------- Geniş masaüstü (≤1200px) ---------- */
@media (max-width: 1200px) {
  .footer-grid { grid-template-columns: 1.6fr repeat(3, 1fr); }
  .footer-brand { grid-column: 1 / -1; }
  .blog-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 34px; }
  .post { padding: 38px 34px; }
}

/* ---------- Küçük masaüstü / yatay tablet (≤1024px) ---------- */
@media (max-width: 1024px) {
  .section { padding: 84px 0; }
  .container { padding: 0 22px; }

  /* Menü mobil moda geçer */
  .main-nav {
    position: fixed;
    top: var(--header-h-sm);
    left: 0; right: 0;
    max-height: calc(100vh - var(--header-h-sm));
    overflow-y: auto;
    background: rgba(18, 18, 18, .97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--line);
    padding: 14px 22px 24px;
    transform: translateY(-14px);
    opacity: 0;
    visibility: hidden;
    transition: transform .34s var(--ease-out), opacity .28s var(--ease), visibility .34s;
  }
  .main-nav.open { transform: translateY(0); opacity: 1; visibility: visible; }
  .main-nav ul { flex-direction: column; align-items: stretch; gap: 2px; }
  .nav-link {
    padding: 14px 12px;
    font-size: 1rem;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
  }
  .nav-link::after { display: none; }
  .nav-link.active { color: var(--accent); }

  .nav-toggle { display: flex; }

  /* Hero tek sütun */
  .hero { padding: calc(var(--header-h) + 62px) 0 78px; }
  .hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .hero-sub { max-width: 100%; }
  .hero-panel { max-width: 520px; }

  /* Izgaralar */
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }

  /* Blog tek sütun — yan sütun alta iner */
  .blog-layout { grid-template-columns: 1fr; gap: 34px; }
  .blog-sidebar { max-width: 100%; }
  .sidebar-sticky {
    position: static;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
  .side-cta { grid-column: 1 / -1; }
}

/* ---------- Tablet (≤900px) ---------- */
@media (max-width: 900px) {
  .stats-wrap { grid-template-columns: repeat(2, 1fr); }
  .stat { padding: 36px 18px; }

  .footer-grid { grid-template-columns: repeat(3, 1fr); gap: 34px 24px; }

  .cta-block { padding: 58px 32px; }
  .post { padding: 34px 28px; }
  .section-head { margin-bottom: 46px; }
}

/* ---------- Küçük tablet / büyük telefon (≤768px) ---------- */
@media (max-width: 768px) {
  :root { --header-h: 70px; --header-h-sm: 60px; }

  .section { padding: 68px 0; }
  .container { padding: 0 18px; }

  /* Header aksiyonları sadeleşir */
  .header-actions .btn-ghost { display: none; }
  .header-actions .btn-sm { padding: 9px 15px; font-size: .83rem; }
  .logo-text { font-size: 1.18rem; }

  .hero { padding: calc(var(--header-h) + 48px) 0 62px; }
  .hero-actions { gap: 11px; }
  .hero-actions .btn { flex: 1 1 100%; }
  .trust-row { gap: 11px 20px; }
  .trust-row li { font-size: .84rem; }
  .hero-panel { padding: 22px; }

  /* Tek sütun ızgaralar */
  .grid-4, .grid-3 { grid-template-columns: 1fr; }
  .sidebar-sticky { grid-template-columns: 1fr; }

  /* Duyurular */
  .notice { grid-template-columns: 1fr; gap: 14px; padding: 22px; }
  .notice-date {
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
    padding: 7px 14px;
    width: fit-content;
  }
  .notice-date span { display: inline; font-size: 1.1rem; margin: 0; }
  .notice:hover { transform: none; }

  .notice-alert { flex-direction: column; gap: 12px; padding: 20px; }

  /* Makale */
  .post { padding: 28px 22px; border-radius: var(--radius); }
  .post h3 { padding-left: 12px; margin-top: 1.7em; }
  .post p { font-size: .94rem; }

  /* SSS */
  .faq-q { padding: 17px 18px; font-size: .95rem; gap: 14px; }
  .faq-a-inner { padding: 0 18px 19px; }

  /* CTA */
  .cta-section { padding-bottom: 78px; }
  .cta-block { padding: 46px 22px; }
  .cta-actions { flex-direction: column; }
  .cta-actions .btn { width: 100%; }

  /* Footer */
  .site-footer { padding-top: 56px; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 30px 20px; padding-bottom: 40px; }
  .footer-brand p { max-width: 100%; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  .footer-legal { gap: 16px; }

  .to-top { right: 16px; bottom: 16px; width: 44px; height: 44px; }

  /* Kart hover etkileri dokunmatikte sadeleşir */
  .card:hover { transform: translateY(-4px); }
}

/* ---------- Telefon (≤560px) ---------- */
@media (max-width: 560px) {
  body { font-size: 15.5px; }

  .section { padding: 56px 0; }
  .section-head { margin-bottom: 36px; text-align: left; }
  .section-head h2 { font-size: 1.6rem; }
  .section-head p { font-size: .95rem; }

  .hero h1 { font-size: 2.05rem; }
  .hero-sub { font-size: 1rem; margin-bottom: 28px; }
  .pill { font-size: .76rem; padding: 6px 13px 6px 10px; }
  .trust-row { flex-direction: column; gap: 10px; }

  .stats-wrap { grid-template-columns: 1fr; border-radius: var(--radius); }
  .stat { padding: 28px 18px; }
  .stat strong { font-size: 2.1rem; }

  .card { padding: 24px 20px; }
  .card-icon { width: 48px; height: 48px; margin-bottom: 16px; }
  .card h3 { font-size: 1.05rem; }

  .post h2 { font-size: 1.3rem; }
  .post-meta { font-size: .76rem; gap: 8px; }

  .cta-block h2 { font-size: 1.65rem; }
  .cta-block > p { font-size: .95rem; }

  .footer-grid { grid-template-columns: 1fr; gap: 26px; }
  .footer-social a { width: 38px; height: 38px; }

  .btn-lg { padding: 15px 26px; font-size: .96rem; }
}

/* ---------- Küçük telefon (≤400px) ---------- */
@media (max-width: 400px) {
  .container { padding: 0 15px; }
  .logo-text { font-size: 1.06rem; }
  .header-actions .btn-sm { padding: 8px 12px; font-size: .8rem; }
  .header-actions .btn-sm svg { display: none; }

  .hero h1 { font-size: 1.82rem; }
  .post { padding: 24px 18px; }
  .faq-q { padding: 15px 15px; font-size: .92rem; }
  .faq-a-inner { padding: 0 15px 17px; }
  .side-box { padding: 20px 18px; }
  .cta-block { padding: 38px 18px; }
}

/* ---------- Yatay mod / kısa ekran ---------- */
@media (max-height: 560px) and (orientation: landscape) {
  .hero { padding: calc(var(--header-h) + 40px) 0 52px; }
  .main-nav { max-height: calc(100vh - var(--header-h-sm)); }
}

/* ---------- Dokunmatik cihazlar ---------- */
@media (hover: none) {
  .card:hover { transform: none; box-shadow: none; }
  .card:hover::before { opacity: 0; }
  .notice:hover { transform: none; }
  .btn:hover { transform: none; }
  .side-list a:hover { transform: none; }
  .footer-social a:hover { transform: none; }
}

/* ---------- Çok geniş ekran ---------- */
@media (min-width: 1600px) {
  :root { --maxw: 1340px; }
  .hero { padding-top: calc(var(--header-h) + 118px); }
  .section { padding: 120px 0; }
}