/* SADECE ATÖLYE SAYFASI İÇİN MOBİL DÜZELTMELER */

/* Tabletten itibaren (≤991px) */
@media screen and (max-width: 991px) {
  /* --- Atölyede her gün (Timeline) Düzeltmesi --- */
  
  /* Soldaki çizgiyi mobilde gizle (yerden tasarruf) */
  html body .atl-steps__rail {
    display: none !important;
  }
  
  /* Çizgi için bırakılan soldaki boşluğu kaldır */
  html body .atl-steps__list {
    padding-left: 0 !important;
  }

  /* Üstteki beyaz maskeli bölümün (Zanaatın sanata dönüşmesi) 
     'Atölyede her gün' yazısını kesmesini engellemek için dış mesafeyi artırıyoruz */
  html body .section_journey.is-atolye {
    padding-top: 6rem !important;
  }
}

/* Mobilde (≤767px) */
@media screen and (max-width: 767px) {
  html body .atl-step__media {
    border-radius: 1rem;
  }
  html body .atl-step__title {
    font-size: 1.5rem !important;
  }

  /* Daha dar ekranlarda üstten boşluğu artırarak yazıyı güvenceye al */
  html body .section_journey.is-atolye {
    padding-top: 8rem !important;
  }

  /* --- Kayan Butonu (FERROVIA COFFEE) Küçült --- */
  .brand-switch {
    padding: 12px 8px !important;
    font-size: 9px !important;
    border-radius: 6px 0 0 6px !important;
  }

  /* --- Footer (Alt Kısım) Düzeltmesi --- */
  /* Menü, Sosyal ve Konum kısımlarının birbirine girmesini engelle */
  html body .footer_grid {
    grid-template-columns: 1fr !important;
    gap: 3rem !important;
  }
  
  html body .footer_column {
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
  }

  /* Footer içeriklerinin sola çok yapışmasını (grid çizgisiyle çakışmasını) önle */
  html body .footer_main {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
  }

  /* Sağ alt köşedeki iletişim bilgilerini sola hizala */
  html body .footer_bottom-right {
    align-items: flex-start !important;
    text-align: left !important;
    margin-top: 2rem !important;
  }
}

/* Küçük mobil (≤479px) */
@media screen and (max-width: 479px) {
  /* Daha küçük ekranlarda butonu daha da ufalt ve hafif transparan yap */
  .brand-switch {
    padding: 10px 6px !important;
    font-size: 8px !important;
    opacity: 0.85;
  }
  
  html body .section_journey.is-atolye {
    padding-top: 10rem !important;
  }
}