/* Resim Optimizasyonu */
img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Video Optimizasyonu */
video {
    object-fit: cover;
}

/* Lazy Loading için placeholder */
img[loading="lazy"],
video[loading="lazy"] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s ease-in-out infinite;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

/* Animasyon performansı */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* GPU Hızlandırma */
.video-carousel-track,
.article-card,
.video-card {
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
}

/* ========================================
   MOBİL PERFORMANS OPTİMİZASYONU
   Görünümü bozmadan sadece performans artışı
   ======================================== */

/* Mobil cihazlarda (768px altı) */
@media (max-width: 768px) {

    /* Geçiş sürelerini kısalt - daha hızlı hissedilir */
    .article-card,
    .video-card,
    .video-carousel-card {
        transition-duration: 0.2s !important;
    }

    /* Touch için optimizasyon - 300ms delay kaldır */
    a,
    button,
    .clickable {
        touch-action: manipulation;
    }

    /* Scroll performansı */
    .video-carousel-track {
        will-change: transform;
        -webkit-overflow-scrolling: touch;
    }

    /* Lazy loading placeholder animasyonunu kaldır - CPU tasarrufu */
    img[loading="lazy"],
    video[loading="lazy"] {
        animation: none;
        background: #f0f0f0;
    }
}

/* Çok küçük ekranlar (480px altı) */
@media (max-width: 480px) {

    /* Daha az gölge = daha iyi performans */
    .article-card,
    .video-card {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    /* Hover zoom efektini kaldır - mobilde gereksiz */
    .video-carousel-thumb img,
    .video-carousel-thumb video {
        transition: none;
    }

    .video-carousel-card:hover .video-carousel-thumb img,
    .video-carousel-card:hover .video-carousel-thumb video {
        transform: none;
    }
}

/* Reduced Motion tercihi olan kullanıcılar için */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ========================================
   MODERN TARAYICI OPTİMİZASYONLARI
   (Layout'u bozmadan render hızlandırma)
   ======================================== */

/* Ekran dışındaki içerikleri render etme (Chrome/Edge Mobile) */
.topics-section,
.latest-articles-section,
footer {
    content-visibility: auto;
    contain-intrinsic-size: 1000px;
    /* Yaklaşık yükseklik, layout kaymasını önler */
}

/* Hero bölümü her zaman öncelikli */
.hero,
.video-carousel-section {
    content-visibility: visible;
}