/* SAYFAYI TAM KAPLASIN */
.site-loader {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    display: none; /* JS açacak */
    align-items: center;
    justify-content: center;
    overflow: hidden;
    pointer-events: all;
    color: #fff;
}

    /* Arka plan */
    .site-loader .loader-bg {
        position: absolute;
        inset: 0;
        background: radial-gradient(1200px 700px at 20% 20%, rgba(255,255,255,0.08), transparent 60%), linear-gradient(180deg, #0b2239 0%, #06192b 100%);
        filter: saturate(1.05);
    }

    /* Orta kutu */
    .site-loader .loader-box {
        position: relative;
        z-index: 2;
        width: min(880px, 92vw);
        padding: 20px 18px;
        border-radius: 18px;
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,255,255,0.16);
        box-shadow: 0 18px 55px rgba(0,0,0,0.35);
        backdrop-filter: blur(8px);
    }

    /* Yazılar net olsun */
    .site-loader .loader-title {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 20px;
        font-weight: 900;
        letter-spacing: .2px;
    }

    .site-loader .loader-sub {
        margin-top: 6px;
        font-size: 14px;
        font-weight: 600;
        opacity: .92;
    }

    /* Nokta animasyonu */
    .site-loader .dot {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: #00c58e; /* sizin yeşile yakın */
        box-shadow: 0 0 0 6px rgba(0,197,142,.18), 0 0 24px rgba(0,197,142,.35);
        animation: pulse 1.1s ease-in-out infinite;
    }

@keyframes pulse {
    0%,100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.18);
        opacity: .85;
    }
}

/* Yol */
.site-loader .road {
    position: relative;
    margin-top: 16px;
    height: 180px;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
    border: 1px solid rgba(255,255,255,.12);
}

/* Şerit */
.site-loader .lane {
    position: absolute;
    left: -20%;
    right: -20%;
    top: 50%;
    height: 6px;
    transform: translateY(-50%);
    background: repeating-linear-gradient( 90deg, rgba(0,197,142,.95) 0 44px, rgba(0,197,142,0) 44px 78px );
    animation: laneMove 1.05s linear infinite;
    opacity: .9;
}

@keyframes laneMove {
    from {
        background-position: 0 0;
    }

    to {
        background-position: -78px 0;
    }
}

/* Arabalar (ikon) */
.site-loader .car {
    position: absolute;
    left: -220px;
    font-size: 42px;
    opacity: .95;
    filter: drop-shadow(0 14px 18px rgba(0,0,0,.35));
    color: #e5f6ff;
}

/* farklı tipleri ufak renklendir */
.site-loader .t1 {
    color: #00c58e;
}

.site-loader .p1 {
    color: #9fb4d8;
    opacity: .9;
}

/* Konum + hızlar */
.site-loader .c1 {
    top: 32%;
    animation: drive 2.8s linear infinite;
}

.site-loader .c2 {
    top: 52%;
    font-size: 38px;
    opacity: .9;
    animation: drive 3.4s linear infinite;
    animation-delay: .35s;
}

.site-loader .c3 {
    top: 70%;
    font-size: 34px;
    opacity: .85;
    animation: drive 3.9s linear infinite;
    animation-delay: .8s;
}

.site-loader .c4 {
    top: 42%;
    font-size: 46px;
    animation: drive 3.1s linear infinite;
    animation-delay: 1.1s;
}

.site-loader .t1 {
    top: 60%;
    font-size: 40px;
    animation: drive 3.0s linear infinite;
    animation-delay: .55s;
}

.site-loader .p1 {
    top: 26%;
    font-size: 44px;
    animation: drive 4.2s linear infinite;
    animation-delay: 1.3s;
}

/* Sürüş */
@keyframes drive {
    0% {
        transform: translateX(-260px);
    }

    100% {
        transform: translateX(calc(100vw + 520px));
    }
}

/* Kapanış animasyonu */
.site-loader.hide {
    animation: fadeOut .55s ease forwards;
}

@keyframes fadeOut {
    to {
        opacity: 0;
        visibility: hidden;
    }
}