/* ==========================================================================
   tamulasim.com - mobil uyum katmani  (04.09.2026)
   Mevcut sayfa stillerine dokunulmaz; yalnizca dar ekranlarda gereken
   duzeltmeler bu dosyadan uygulanir. Her sayfada <style> bloklarindan
   SONRA yuklenir.
   ========================================================================== */

/* --- her ekranda gecerli guvenlik kurallari --- */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe { max-width: 100%; height: auto; }
.lang-switch { white-space: nowrap; }

/* ==========================================================================
   TABLET VE ALTI  (<= 900px)
   ========================================================================== */
@media (max-width: 900px) {

  /* --- ust bar: logo + marka + TR/EN ustte, menu altta --- */
  header { flex-wrap: wrap !important; padding: 10px 14px !important; }
  header nav { margin-left: 0 !important; margin-right: 0 !important; width: 100%; }
  header nav ul {
    flex-wrap: wrap !important;
    gap: 4px 10px !important;
    justify-content: flex-start !important;
    padding-top: 6px !important;
  }
  header nav ul li a { font-size: 15px !important; padding: 6px 8px !important; }
  header img.logo, header .logo { height: 40px !important; }
  .branding h1 { font-size: 18px !important; }
  .branding h2 { font-size: 12px !important; }

  /* --- iki sutunlu bloklar tek sutuna iner --- */
  .project-info, .article-body { flex-wrap: wrap !important; gap: 24px !important; }
  .sidebar { min-width: 0 !important; width: 100% !important; flex: 1 1 100% !important; }
  .gtfs-content, .office-card, .featured-cards, .story-cards,
  .projects-grid, .article-list, .image-gallery, .team-grid,
  .values-grid, .features-grid, .data-grid, .approach-grid, .focus-areas {
    grid-template-columns: 1fr !important;
  }
  .featured-cards { grid-template-rows: auto !important; width: 100% !important; gap: 20px !important; }
  .card { width: auto !important; }

  /* --- basliklar ve bosluklar --- */
  .hero { padding: 60px 16px !important; }
  .hero h1, .page-header h1, .project-header h1, .article-header h1 { font-size: 28px !important; }
  .project-header p, .page-header p { font-size: 16px !important; }
  .section-title, h2 { font-size: 22px !important; }

  /* --- slayt alani --- */
  .slider-wrapper { height: 240px !important; }
  .slider-btn { width: 36px !important; height: 36px !important; font-size: 16px !important; }

  /* --- alt bilgi --- */
  .footer-container { gap: 24px !important; }
  .footer-col { flex: 1 1 100% !important; }
  .footer-bottom { flex-direction: column !important; gap: 10px; text-align: center; }
  .footer-links { flex-wrap: wrap !important; justify-content: center !important; }

  /* --- form ve butonlar: parmakla kullanilabilir olcu --- */
  input, textarea, select { width: 100% !important; font-size: 16px !important; }
  button, .btn, .view-full-article-btn, .cta-button { min-height: 44px; }
}

/* ==========================================================================
   TELEFON  (<= 600px)
   ========================================================================== */
@media (max-width: 600px) {
  header { justify-content: center !important; text-align: center; }
  header > a { justify-content: center; }
  header nav ul { justify-content: center !important; }
  .lang-switch a { padding: 8px 12px !important; }   /* dokunma alani */

  .hero h1, .page-header h1, .project-header h1, .article-header h1 { font-size: 24px !important; }
  .project-container, .article-container, .news-container, .content-section,
  .page-container, main { padding-left: 14px !important; padding-right: 14px !important; }
  .slider-wrapper { height: 190px !important; }
  .team-member img, .image-placeholder { width: 110px !important; height: 110px !important; }
  .footer-social img { width: 90px !important; }
  p, li { font-size: 15px !important; line-height: 1.65 !important; }
}

/* --- ana sayfadaki 99vw kart izgarasi: yatay kaydirmayi onler --- */
.featured-cards { width: 100% !important; max-width: 100%; }

/* --- dil anahtari: her sayfada, her ekranda gorunur kalir --- */
header .lang-switch {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: static !important;
  flex: 0 0 auto;
}
header .lang-switch a { color: #fff; }
header .lang-switch a[aria-current="true"] { background: #fff !important; color: #f57c00 !important; }