/* ==========================================================================
   Usta Teknik Servis — Responsive Kurallar
   Kontrol edilen genişlikler: 1440, 1366, 1024, 768, 430, 390, 360
   ========================================================================== */

/* ---------- ≤1200px: geniş dizüstü ---------- */
@media (max-width: 1200px) {
  .container { padding: 0 20px; }
  .services-grid { grid-template-columns: repeat(3, 1fr); }
  .bento-grid { grid-template-columns: repeat(3, 1fr); }
  .bento-span-2 { grid-column: span 2; }
  .footer-grid { grid-template-columns: 1.2fr repeat(2, 1fr); }
}

/* ---------- ≤1024px: tablet yatay ---------- */
/* Header/topbar/mobil menu responsive kurallari assets/css/header.css icinde yer alir. */
@media (max-width: 1024px) {
  .hero-grid { grid-template-columns: 1fr; min-height: auto; }
  .hero-visual { order: -1; max-width: 420px; margin: 0 auto; }
  .hero-form-card { margin-top: var(--space-lg); }
  .trust-strip-inner { grid-template-columns: repeat(3, 1fr); }
  .trust-item:nth-child(3) { border-right: none; }
  .region-search-grid { grid-template-columns: 1fr; }
  .region-visual { padding: var(--space-lg); }
  .region-form-side { padding: var(--space-lg); }
  .region-form-side .field-grid { grid-template-columns: 1fr 1fr; }
  .process-timeline { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-xl); }
  .process-timeline::before { display: none; }
  .testimonial-track { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .faq-layout { grid-template-columns: 1fr; }
  .faq-cta-card { position: static; }
  .detail-layout { grid-template-columns: 1fr; }
  .sidebar-form-card { position: static; }
  .fault-teaser { grid-template-columns: 1fr; }
  .fault-visual { order: -1; max-width: 260px; margin: 0 auto; }
}

/* ---------- ≤768px: tablet dikey / büyük mobil ---------- */
@media (max-width: 768px) {
  .container { padding: 0 18px; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .bento-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 180px; }
  .bento-span-2 { grid-column: span 2; }
  .bento-row-2 { grid-row: span 1; }
  .trust-strip .container { margin-top: calc(var(--space-lg) * -1); }
  .trust-strip-inner { grid-template-columns: repeat(2, 1fr); }
  .trust-item { border-bottom: 1px solid var(--border); }
  .trust-item:nth-child(3) { border-right: 1px solid var(--border); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-top .footer-brand-block { max-width: 100%; }
  .field-grid { grid-template-columns: 1fr; }
  .lookup-form-row { grid-template-columns: 1fr; }
  .region-form-side .field-grid { grid-template-columns: 1fr; }
  .desktop-fab-stack { display: none; }
  .mobile-bottom-nav { display: block; }
  .mobile-bottom-nav-inner { display: flex; }
  body { padding-bottom: 78px; }
  .section { padding: var(--space-2xl) 0; }
  .final-cta { padding: var(--space-xl) var(--space-md); }
}

/* ---------- ≤480px: mobil (430 / 390 / 360) ---------- */
@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .eyebrow { font-size: 12px; padding: 6px 12px; }
  .hero { padding: var(--space-xl) 0 var(--space-2xl); }
  .hero-actions .btn { flex: 1 1 100%; }
  .hero-phone-lines__grid { grid-template-columns: 1fr; max-width: 100%; }
  .hero-trust-row { gap: var(--space-md); }
  .hero-form-card { padding: var(--space-md); border-radius: var(--radius-md); }
  .services-grid, .bento-grid, .testimonial-track, .blog-grid { grid-template-columns: 1fr; }
  .bento-grid { grid-auto-rows: auto; }
  .bento-span-2 { grid-column: span 1; }
  .bento-card { min-height: 168px; }
  .process-timeline { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: var(--space-lg); padding: var(--space-xl) 0; }
  .footer-bottom-inner { flex-direction: column; align-items: flex-start; }
  .trust-strip-inner { grid-template-columns: 1fr; }
  .trust-item { border-right: none !important; }
  .brand-chip { width: 140px; height: 80px; }
  .region-search { border-radius: var(--radius-md); }
  .page-form-card { padding: var(--space-md); }
  .final-cta h2 { font-size: 1.9rem; }
  .mobile-bottom-nav a span { font-size: 10px; }
}
