@media (max-width: 1585px) {


}
@media (max-width: 1360px) {


}
@media (max-width: 960px) {

	main {
		width:100vw;
	}
	body {
		padding-top:65px;
	}
	#header {
		display:none;
	}
	#mobilheader {
		display:flex;
	}
	#mobilmenu {
		display:block;
	}

}

/* ==========================================================================
   RESPONSIVE AYARLAR (TÜM BÖLÜMLER İÇİN MOBİL UYUM)
   ========================================================================== */

/* --- 1199px ve Altı (Geniş Tabletler ve Küçük Laptoplar) --- */
@media (max-width: 1199px) {
    /* Referanslar: 6'lı grid yerine 4'lü grid'e düşüyoruz */
    #referanslar .ref-cell { width: 25%; }
    #referanslar .title-cell { width: 50%; } /* Başlık kısmı 2 hücre yer kaplar */
    
    /* Hizmetler (3D Kartlar) */
    #hizmetler .hz-title { font-size: 42px; }
}

/* --- 991px ve Altı (Tabletler ve Yatay Telefonlar) --- */
@media (max-width: 991px) {
    /* Slider */
    #slider .marquee-track span { font-size: 9vw; } /* Yazılar tablette biraz daha büyür */
    
    /* Referanslar: 4'lü grid yerine 3'lü grid'e düşüyoruz */
    #referanslar .ref-cell { width: 33.3333%; padding: 30px; }
    #referanslar .title-cell { width: 100%; padding-left: 30px; aspect-ratio: auto; padding-bottom: 20px; }
    
    /* Büyüme ve İstatistikler */
    #buyume { padding: 80px 0; }
    #buyume .by-content { padding-right: 0; margin-bottom: 50px; } /* Metin ile istatistikler alt alta gelir */
    
    /* Sıkça Sorulan Sorular (SSS) */
    #sss .sss-cta-box { position: static; margin-bottom: 40px; } /* Yapışkanlık (sticky) iptal, alt alta dizilir */
    
    /* Footer */
    #footer .footer-top { padding-bottom: 40px; }
}

/* --- 767px ve Altı (Dikey Telefonlar) --- */
@media (max-width: 767px) {
    /* Slider */
    #slider .marquee-track span { font-size: 13vw; padding-right: 15px; } /* Telefonda devasa ve okunaklı kayan yazı */
    #slider .bottom-bar { bottom: 20px; padding: 0 15px; text-align: center; }
    #slider .btn-teklif, #slider .btn-showreel { width: 100%; justify-content: center; margin-bottom: 10px; }
    #slider .partner-logos { margin-top: 15px; }
    #slider .slider-button-prev, #slider .slider-button-next { display: none; } /* Mobilde okları gizle, kaydırarak geçilsin */
	#slider { width: 100vw; height: 50vh;}
	
    /* Referanslar: 2'li grid (Yan yana 2 logo) */
    #referanslar { padding: 60px 0; }
    #referanslar .ref-cell { width: 50%; padding: 20px; }
    #referanslar h2.ref-title { font-size: 26px; }
    #referanslar .cta-cell h5.ref-title { font-size: 15px; }

    /* Hizmetler (3D Kartlar) */
    #hizmetler .hz-card { height: auto; min-height: auto; padding: 40px 0; flex-direction: column; position: relative; top: 0; }
    #hizmetler .hz-image-wrapper { width: 100%; margin-bottom: 30px; padding: 0 10%; }
    #hizmetler .hz-title { font-size: 32px; }
    #hizmetler .hz-desc { font-size: 14px; }
    #hizmetler .hz-btn { width: 100%; justify-content: center; }
	#hizmetler .hz-image-wrapper:before { top: 2%; width: 73%;}
	
    /* Büyüme ve İstatistikler */
    #buyume .by-title { font-size: 32px; }
    #buyume .by-stats-grid { grid-template-columns: 1fr; } /* İstatistik kartları alt alta sıralanır */
    #buyume .by-stat-card { padding: 25px 20px; }
    #buyume .by-stat-number { font-size: 46px; }

    /* Bizimle Büyüyenler (Reels) */
    #bizimle-buyuyenler { padding: 60px 0; }
    #bizimle-buyuyenler .bb-title { font-size: 28px; }
    #bizimle-buyuyenler .bb-slide { width: 240px; } /* Mobilde kartlar biraz daha daralır */

    /* Blog */
    #blog { padding: 60px 0; }
    #blog .bl-main-title { font-size: 28px; }
    #blog .bl-info { padding: 20px; }
    #blog .bl-title { font-size: 18px; }

    /* Sıkça Sorulan Sorular (SSS) */
    #sss { padding: 60px 0; }
    #sss .sss-title { font-size: 30px; }
    #sss .sss-accordion .accordion-button { padding: 15px 20px; font-size: 15px; }
    #sss .sss-accordion .accordion-body { padding: 15px 20px; font-size: 14px; }

    /* Footer */
    #footer { padding-top: 60px; text-align: center; } /* Mobilde her şeyi ortalıyoruz */
    #footer .ft-logo { margin-bottom: 15px; }
    #footer .ft-social { justify-content: center; margin-bottom: 30px; }
    #footer .ft-title::after { left: 50%; transform: translateX(-50%); } /* Başlık altı çizgiyi ortala */
    #footer .ft-contact li { flex-direction: column; align-items: center; gap: 5px; text-align: center; }
    #footer .ft-legal { justify-content: center; flex-wrap: wrap; margin-top: 15px; }

    /* Dijital Lobi ve Kapılar */
    #lobi-scroll-indicator { display: none; } /* Mobilde kaydırma çubuğu ekranda çok yer kaplar, gizlemek en iyisidir */
    #dijital-lobi .lobi-title { font-size: 36px; }
    #dijital-lobi .lobi-badge { letter-spacing: 5px; font-size: 12px; }
    #dijital-lobi .lobi-desc { font-size: 14px; }
    #dijital-lobi .door-panel { width: 90%; height: 95%; }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    #web-hizmetleri .wh-main-title { font-size: 46px; }
    #web-projeler .wp-title { font-size: 36px; }
}

@media (max-width: 767px) {
    #web-hizmetleri { padding: 120px 0 80px 0; text-align: center; }
    #web-hizmetleri .wh-main-title { font-size: 36px; }
    
    /* Mobilde ikonları ve çizgiyi ortalıyoruz */
    #web-hizmetleri .wh-category-header { justify-content: center; flex-direction: column; gap: 10px; }
    #web-hizmetleri .wh-category-header i { font-size: 42px; }
    
    #web-referanslar { padding: 80px 0; }
    #web-projeler { padding: 80px 0; text-align: center; }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    #produksiyon-hizmetleri .pr-main-title { font-size: 42px; }
    #produksiyon-referanslar .pr-ref-title { border-right: none; margin-bottom: 30px; text-align: center; }
}

@media (max-width: 767px) {
    #produksiyon-hizmetleri { padding: 120px 0 60px 0; text-align: center; }
    #produksiyon-hizmetleri .pr-main-title { font-size: 32px; }
    
    /* Mobilde listeyi ortala ve sol hover çizgisini gizle */
    #produksiyon-hizmetleri .pr-category-header { justify-content: center; flex-direction: column; gap: 10px; }
    #produksiyon-hizmetleri .pr-category-header i { font-size: 40px; }
    #produksiyon-hizmetleri .pr-service-item { border-left: none; padding-left: 0; }
    #produksiyon-hizmetleri .pr-service-item:hover { padding-left: 0; }
    
    #produksiyon-projeler { padding: 60px 0; text-align: center; }
    #produksiyon-projeler .pr-title { font-size: 32px; }
    #produksiyon-projeler .pr-project-info h3 { font-size: 18px; }
    
    /* Mobilde play butonu her zaman hafif görünsün ki video olduğu anlaşılsın */
    #produksiyon-projeler .pr-play-btn { opacity: 0.7; transform: translate(-50%, -50%) scale(0.9); }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    #tasarim-hizmetleri .ts-main-title { font-size: 46px; }
    
    /* Tabletlerde Masonry Grid'i biraz daha basitleştiriyoruz */
    #tasarim-projeler .ts-masonry-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
    }
    #tasarim-projeler .ts-item-large { grid-column: 1 / 3; height: 400px; }
    #tasarim-projeler .ts-item-small { grid-column: auto; height: 300px; }
    #tasarim-projeler .ts-item-wide { grid-column: 1 / 3; }
}

@media (max-width: 767px) {
    #tasarim-hizmetleri { padding: 120px 0 60px 0; text-align: center; }
    #tasarim-hizmetleri .ts-main-title { font-size: 32px; }
    
    /* Mobilde ikonlar ve listeler ortalanır */
    #tasarim-hizmetleri .ts-category-header { justify-content: center; flex-direction: column; gap: 10px; }
    #tasarim-hizmetleri .ts-category-header i { font-size: 40px; }
    #tasarim-hizmetleri .ts-service-item:hover { transform: translateY(-5px); /* Mobilde sağa kayma yerine yukarı zıplasın */ }
    #tasarim-hizmetleri .ts-service-item::before { display: none; /* Mobilde noktayı gizle */ }
    
    #tasarim-referanslar .ts-ref-title { border-left: none; border-bottom: 2px solid #ff7f11; padding-left: 0; padding-bottom: 15px; margin-bottom: 30px; text-align: center; }
    
    #tasarim-projeler { padding: 80px 0; text-align: center; }
    #tasarim-projeler .ts-title { font-size: 32px; margin-bottom: 20px; }
    #tasarim-projeler .ts-view-all { margin-bottom: 40px; }
    
    /* Mobilde Grid İptal Olup Alt Alta (1 Kolon) Dizilir */
    #tasarim-projeler .ts-masonry-grid {
        grid-template-columns: 1fr;
    }
    #tasarim-projeler .ts-item-large, 
    #tasarim-projeler .ts-item-small, 
    #tasarim-projeler .ts-item-wide {
        grid-column: 1 / 2;
        grid-row: auto;
        height: 300px;
    }
    
    /* Mobilde yazılar her zaman okunsun (Hover gerekmeden) */
    #tasarim-projeler .ts-item-tag,
    #tasarim-projeler .ts-item-content h3 {
        transform: translateY(0);
        opacity: 1;
    }
    #tasarim-projeler .ts-item-content h3 { font-size: 18px; }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 1199px) {
    #dijital-hizmetleri .dp-category-header h2 { font-size: 16px; }
}

@media (max-width: 991px) {
    #dijital-hizmetleri .dp-main-title { font-size: 42px; }
    /* Tablette 4 kolon sıkışmasın diye 2x2'ye düşürüyoruz Bootstrap otomatik hallediyor (col-md-6) */
}

@media (max-width: 767px) {
    #dijital-hizmetleri { padding: 120px 0 60px 0; text-align: center; }
    #dijital-hizmetleri .dp-main-title { font-size: 32px; }
    #dijital-hizmetleri .dp-main-desc { margin: 0 auto; }
    
    /* Mobilde ikonları ve çizgiyi ortalıyoruz */
    #dijital-hizmetleri .dp-category-header { justify-content: center; flex-direction: column; gap: 10px; }
    #dijital-hizmetleri .dp-category-header i { font-size: 36px; }
    #dijital-hizmetleri .dp-category-header h2 { font-size: 20px; }
    
    #dijital-referanslar .dp-ref-title { border-left: none; border-bottom: 2px solid #ff7f11; padding-left: 0; padding-bottom: 15px; margin-bottom: 30px; text-align: center; }
    
    #dijital-projeler { padding: 60px 0; }
    #dijital-projeler .dp-title { font-size: 32px; }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    #projeler-sayfasi .pj-main-title { font-size: 40px; }
}

@media (max-width: 767px) {
    #projeler-sayfasi { padding: 120px 0 60px 0; }
    #projeler-sayfasi .pj-main-title { font-size: 32px; }
    
    /* Mobilde filtreleri yan yana kaydırılabilir (scroll) yapmak için */
    #projeler-sayfasi .pj-filter-nav {
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 15px; /* Scroll bar için yer */
        -webkit-overflow-scrolling: touch;
    }
    #projeler-sayfasi .pj-filter-nav li {
        flex: 0 0 auto;
    }
    
    /* Mobilde dokunmatik olduğu için hover beklemeden açıklamayı görünür kılabiliriz 
       veya tasarım çok kalabalık olmasın diye sadece tıklayınca detay sayfasına atabiliriz. 
       Aşağıdaki kod mobilde açıklamayı her zaman açık gösterir: */
    #projeler-sayfasi .pj-hover-body {
        max-height: 300px;
        opacity: 1;
    }
    #projeler-sayfasi .pj-img img {
        filter: brightness(0.6); /* Mobilde metin okunsun diye standart karartma */
    }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    #about-hero .ab-title { font-size: 42px; }
    #about-philosophy .ab-phil-card { border-left: none; border-top: 2px solid #222222; padding: 20px 0 0 0; }
    #about-philosophy .ab-phil-card:hover { border-left-color: transparent; border-top-color: #ff7f11; }
}

@media (max-width: 767px) {
    #about-hero { padding: 130px 0 60px 0; }
    #about-hero .ab-title { font-size: 32px; }
    
    #about-stats .ab-stat-num { font-size: 36px; }
    
    .ab-section-title { font-size: 32px; }
    
    /* Mobilde ekip üyelerinin ismi doğrudan görünsün */
    #about-team .ab-team-info { transform: translateY(0); }
    #about-team .ab-team-img { filter: grayscale(0%); } /* Mobilde filtreyi kapatıp doğrudan renkli gösterebiliriz */
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 1199px) {
    .blg-feat-content { padding: 40px; }
    .blg-feat-content h2 { font-size: 26px; }
}

@media (max-width: 991px) {
    #blog-hero .blg-main-title { font-size: 42px; }
    
    /* Öne Çıkan Kartı mobilde/tablette alt alta diziyoruz */
    .blg-feat-img { min-height: 250px; }
}

@media (max-width: 767px) {
    #blog-hero { padding: 130px 0 60px 0; }
    #blog-hero .blg-main-title { font-size: 32px; }
    
    .blg-feat-content { padding: 30px 20px; }
    .blg-feat-content h2 { font-size: 22px; }
    .blg-feat-content p { font-size: 14px; }
    
    .blg-card-info { padding: 25px 20px; }
    .blg-card-info h3 { font-size: 18px; }
}


/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    .bd-title { font-size: 40px; }
    .bd-sidebar { padding-left: 0; margin-top: 50px; position: static; }
}

@media (max-width: 767px) {
    #bd-hero { padding: 130px 0 30px 0; }
    .bd-title { font-size: 28px; }
    .bd-meta-top { flex-direction: column; gap: 10px; margin-bottom: 15px; }
    
    .bd-main-article { font-size: 16px; }
    .bd-main-article .bd-lead { font-size: 18px; }
    .bd-main-article h3 { font-size: 24px; }
    .bd-main-article blockquote { padding: 20px 25px; }
    .bd-main-article blockquote p { font-size: 18px; }
    
    .bd-author-box { flex-direction: column; text-align: center; padding: 30px 20px; }
    
    #bd-related { padding: 60px 0; }
    .bd-related-title { font-size: 28px; }
}



/* ================= RESPONSIVE AYARLAR ================= */
@media (max-width: 991px) {
    #contact-content .ct-info-box { padding: 40px 0 0 0; }
    #contact-hero .ct-main-title { font-size: 44px; }
}

@media (max-width: 767px) {
    #contact-hero { padding: 130px 0 50px 0; }
    #contact-hero .ct-main-title { font-size: 32px; }
    
    #contact-content .ct-form-box { padding: 30px 20px; }
    #contact-content .ct-form-box h3 { font-size: 22px; }
    
    #contact-content .ct-info-item { gap: 15px; margin-bottom: 30px; }
    #contact-content .ct-info-icon { width: 45px; height: 45px; min-width: 45px; font-size: 24px; }
    #contact-content .ct-info-text h4 { font-size: 16px; }
    #contact-content .ct-info-text p { font-size: 14px; }
    
    #contact-map iframe { height: 350px; }
}