/* ═══════════════════════════════════════
   BatuhanWeb — responsive.css
   Tüm Medya Sorguları — Mobil Öncelikli
   ═══════════════════════════════════════ */

/* ── TABLET (max 900px) ── */
@media (max-width: 900px) {
  .about-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .contact-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .process-grid::before { display: none; }
}

/* ── MOBİL (max 780px) ── */
@media (max-width: 780px) {

  /* Nav */
  .nav-links { display: none; }
  .hamburger { display: flex; }
  nav { padding: 1rem 1.5rem; }

  /* Hero */
  .hero {
    padding: 8rem 1.5rem 4rem;
    min-height: auto;
    padding-bottom: 5rem;
  }

  .hero h1 { font-size: clamp(2rem, 8vw, 3rem); letter-spacing: 0; }
  .hero-sub { font-size: 1rem; }
  .hero-orb { display: none; }
  .hero-content { max-width: 100%; }

  /* Divider */
  .divider { width: calc(100% - 3rem); }

  /* Sections */
  .section { padding: 4rem 1.5rem; }

  .section-sub { max-width: 100%; }

  /* Services */
  .services-grid { grid-template-columns: 1fr; }

  /* Process */
  .process-grid { grid-template-columns: 1fr; gap: 1.25rem; }
  .process-step { text-align: left; display: flex; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
  .step-number { font-size: 2rem; min-width: 2.5rem; }
  .step-icon { font-size: 1.6rem; }
  .process-step h3 { font-size: 1rem; }

  /* Portfolio */
  .p-grid { grid-template-columns: 1fr; }
  .p-link { opacity: 1; } /* always visible on touch */

  /* About */
  .about-grid { grid-template-columns: 1fr; gap: 2rem; }
  .about-visual { padding: 2rem; }

  /* Contact */
  .contact-grid { grid-template-columns: 1fr; gap: 2rem; }
  .c-form { padding: 1.5rem; }

  /* Footer */
  footer { padding: 1.5rem; }
}

/* ── KÜÇÜK MOBİL (max 420px) ── */
@media (max-width: 420px) {
  nav { padding: .85rem 1rem; }
  
  .logo  { width: 35%; }

  .hero { padding: 7rem 1rem 4rem; }
  .hero h1 { font-size: 1.9rem; }

  .section { padding: 3.5rem 1rem; }

  .stats { grid-template-columns: 1fr 1fr; gap: .75rem; }
  .stat-n { font-size: 1.5rem; }

  .lang-btn { padding: 3px 7px; font-size: .62rem; }

  .c-form { padding: 1.25rem; }
  .fg input, .fg textarea, .fg select { padding: .65rem .85rem; }

  .btn { padding: .8rem 1.6rem; font-size: .9rem; }

  .toast { font-size: .8rem; padding: .75rem 1.25rem; white-space: normal; text-align: center; width: calc(100% - 2rem); }
}

/* ── GENİŞ EKRAN (min 1400px) ── */
@media (min-width: 1400px) {
  .section { padding: 7rem 2.5rem; }
  .hero { padding: 10rem 2.5rem 6rem; }
}