/*
 * Videolar sayfasina ozel stiller. Daha once sayfa icinde inline <style> blogu ve
 * style="" attribute'lari olarak duruyordu; CSP'de style-src 'unsafe-inline'
 * ihtiyacini kaldirmak icin tasindi. Kurallar birebir korunmustur.
 * Yalnizca bu sayfada yuklenir (@section Styles) -> cascade kapsami ayni kalir.
 */
    

    .video-hero-section {

        position: relative;

        background: linear-gradient(135deg, #ffffff 0%, #1e3a8a 100%);

        padding: 125px 0 150px 0;

        overflow: hidden;

        margin-bottom: 0;

    }



    #video-particles {

        position: absolute;

        width: 100%;

        height: 100%;

        top: 0;

        left: 0;

        z-index: 1;

        opacity: 0.5;

    }



    .video-hero-content {

        position: relative;

        z-index: 2;

    }



   

    .video-title {

        font-weight: 900;

        font-size: 4rem;

        margin-bottom: 20px;

        color: #fff;

        text-shadow: 0 5px 30px rgba(0,0,0,0.5);

        line-height: 1.2;

    }



    .video-description {

        font-size: 1.4rem;

        color: #fff;

        opacity: 1;

        max-width: 700px;

        margin: 0 auto;

        font-weight: 300;

    }



    .video-cards-container {

        position: relative;

        z-index: 5;

        margin-top: -100px;

        padding-bottom: 40px;

    }



    .video-card {

        background: #fff;

        border-radius: 15px;

        overflow: hidden;

        box-shadow: 0 5px 15px rgba(0,0,0,0.05);

        transition: 0.3s;

        border: 1px solid #eee;

        height: 100%;

    }



        .video-card:hover {

            transform: translateY(-5px);

            box-shadow: 0 20px 40px rgba(0,0,0,0.1);

            border-color: var(--pusula-mavi);

        }



    .video-frame {

        position: relative;

        padding-bottom: 56.25%; 

        height: 0;

        overflow: hidden;

        background: #000;

    }



        .video-frame iframe {

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            border: 0;

        }



    .video-info {

        padding: 25px;

    }



    .video-cat {

        font-size: 11px;

        font-weight: 800;

        color: var(--pusula-turuncu);

        text-transform: uppercase;

        letter-spacing: 1px;

        margin-bottom: 5px;

        display: block;

    }



    .video-title-card {

        font-size: 1.1rem;

        font-weight: 700;

        margin-bottom: 0;

        color: #333;

        line-height: 1.4;

    }



    .video-filters .btn {

        background: #fff;

        border: 1px solid #ddd;

        color: #555;

        font-weight: 600;

        margin: 0 5px;

        border-radius: 30px;

        padding: 18px 20px;

        transition: 0.3s;

    }



        .video-filters .btn:hover, .video-filters .btn.active {

            background: var(--pusula-mavi);

            color: #fff;

            border-color: var(--pusula-mavi);

            transform: translateY(-3px);

        }

/* --- Videolar sayfasinin eski inline style="" degerleri (sinifa tasindi) --- */
.video-cards-section { margin-top: -60px; padding-top: 70px; position: relative; z-index: 5; }
.video-empty-state { min-height: 300px; }