/* ==========================================================================
   Dollar Media — Responsive (Mobile-First)
   Breakpointler: sm 640 / md 768 / lg 1024 / xl 1280
   ========================================================================== */

/* ---- Varsayılan (mobil, <640px) ---- */
.grid-services { grid-template-columns: 1fr; gap: var(--space-3); }
.grid-projects { grid-template-columns: 1fr; }

.nav-menu { display: none; }
.mobile-menu-btn { display: inline-flex; }

.hero-grid { grid-template-columns: 1fr; }
.hero-content { text-align: center; }
.hero-actions { justify-content: center; }
.hero-media { order: -1; max-width: 220px; margin-inline: auto; margin-bottom: var(--space-2); }

.stats-overlap { margin-top: var(--space-5); }

.cta-left { flex-direction: column; text-align: center; }

/* Genel mobil düzen ve taşma koruması */
.hero-actions .btn { flex: 1 1 100%; white-space: normal; }
.stats-bar { grid-template-columns: 1fr; }
.stat-item { justify-content: flex-start; }
.contact-form-wrap,
.quote-form-wrap,
.blog-detail-content,
.project-story-block { padding: var(--space-5); }
.page-banner { text-align: center; }
.page-banner p { margin-inline: auto; }
.breadcrumb { display: flex; flex-wrap: wrap; justify-content: center; }
.filter-tabs { gap: var(--space-2); }
.filter-tab { flex: 1 1 auto; text-align: center; }
.footer-top { gap: var(--space-6); }
.footer-bottom { text-align: center; }
.service-row { padding: var(--space-4); }
.service-row-icon { width: 44px; height: 44px; }
.blog-share { flex-wrap: wrap; }

@media (min-width: 420px) {
  .stats-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- sm: 640px+ (büyük telefon) ---- */
@media (min-width: 640px) {
  .grid-services { grid-template-columns: repeat(2, 1fr); }
  .grid-projects { grid-template-columns: repeat(2, 1fr); }
  .hero-actions .btn { flex: 0 1 auto; }
  .page-banner { text-align: left; }
  .page-banner p { margin-inline: 0; }
  .breadcrumb { display: block; }
  .filter-tabs { justify-content: flex-start; }
  .filter-tab { flex: 0 0 auto; }
  .service-row { padding: var(--space-5); }
  .service-row-icon { width: 52px; height: 52px; }
}

/* ---- md: 768px+ (tablet) ---- */
@media (min-width: 768px) {
  .hero-content { text-align: left; }
  .hero-actions { justify-content: flex-start; }

  .cta-left { flex-direction: row; text-align: left; }
}

/* ---- lg: 960px+ (küçük masaüstü) ---- */
@media (min-width: 960px) {
  .grid-services { grid-template-columns: repeat(3, 1fr); }
  .grid-projects { grid-template-columns: repeat(3, 1fr); }

  .hero-grid {
    grid-template-columns: 1.1fr 0.9fr;
    align-items: center;
    gap: var(--space-10);
  }
  .hero-media { order: 0; max-width: none; margin-bottom: 0; }

  .stats-overlap { margin-top: calc(var(--space-12) * -1); }
}

/* Menü, tüm bağlantıların rahatça sığdığı genişlikte masaüstüne dönüşür. */
@media (min-width: 1120px) {
  .nav-menu { display: flex; }
  .mobile-menu-btn { display: none; }
}

/* ---- xl: 1280px+ (büyük masaüstü) ---- */
@media (min-width: 1280px) {
  .grid-services { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: clamp(16px, 2vw, 24px); }
}

@media (max-width: 479px) {
  .header-cta { display: none; }
  .btn { width: 100%; white-space: normal; }
  .stats-bar { padding: var(--space-4); gap: var(--space-4); }
  .stat-icon { width: 42px; height: 42px; }
  .project-meta-bar { grid-template-columns: 1fr; }
  .faq-item { padding: var(--space-4); }
  .services-cta-text .btn,
  .mid-cta-box .btn { width: 100%; white-space: normal; }
}
