/* TKM Yapı - Responsive (breakpoint) stilleri
   Mobile-first: critical.css ve main.css mobil düzeni temel alır, burada büyük ekranlar
   için düzen genişletilir. */

/* ---------- Tablet: 768px+ ---------- */
@media (min-width: 768px) {
  .container { padding-left: var(--margin-desktop); padding-right: var(--margin-desktop); }
  .site-header__inner { padding: 0 var(--margin-desktop); }

  .hero h1 { font-size: 46px; }
  .hero p { font-size: 18px; }

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

  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-bottom { flex-direction: row; justify-content: space-between; align-items: center; }

  .cta-strip { flex-direction: row; align-items: center; justify-content: space-between; }
  .cta-strip__actions { flex-shrink: 0; }

  .contact-strip__grid { flex-direction: row; justify-content: space-between; align-items: center; }

  .form-row { grid-template-columns: repeat(2, 1fr); }

  .cookie-banner { flex-direction: row; align-items: center; justify-content: space-between; left: 24px; right: 24px; bottom: 24px; }
}

/* ---------- Masaüstü: 1024px+ ---------- */
@media (min-width: 1024px) {
  section { padding: var(--section-gap-desktop) 0; }

  .hero { min-height: 82vh; }
  .hero h1 { font-size: 60px; }

  .menu-toggle { display: none; }
  .mobile-nav { display: none; }

  .main-nav {
    display: flex;
    gap: 32px;
    align-items: center;
    height: 100%;
  }
  .main-nav a {
    font-size: 15px;
    color: var(--color-secondary);
    height: 100%;
    display: flex;
    align-items: center;
    border-bottom: 2px solid transparent;
    transition: color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav a:hover,
  .main-nav a.is-active { color: var(--color-primary); border-bottom-color: var(--color-primary); }

  .header-actions .btn-phone { display: inline-flex; }

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

  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; }

  .service-card { padding: 32px; }

  /* Asimetrik bento düzeni: hizmetler grid alanı */
  .services-bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter); }
  .services-bento .service-card--lg { grid-column: span 7; }
  .services-bento .service-card--md { grid-column: span 5; }
  .services-bento .service-card--sm { grid-column: span 4; }

  .split-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--section-gap-desktop) / 2; align-items: center; }
  .split-2--offset { grid-template-columns: 5fr 6fr; column-gap: var(--gutter); }
}

/* ---------- Geniş ekran: 1280px+ ---------- */
@media (min-width: 1280px) {
  .grid-5 { grid-template-columns: repeat(5, 1fr); }
}

/* ---------- Yazdırma ---------- */
@media print {
  .site-header, .site-footer, .whatsapp-float, .cookie-banner, .mobile-nav { display: none !important; }
}
