/***
=============================================
Banner One
=============================================
***/
.banner-one {
    position: relative;
    display: block;
    background: rgb(18, 33, 38);
    background: linear-gradient(90deg, rgba(18, 33, 38, 1) 0%, rgba(18, 33, 38, 1) 35%, rgba(10, 44, 54, 1) 60%, rgba(10, 44, 54, 1) 100%);
    padding: 512px 0px 94px;
    z-index: 2;
    overflow: hidden; /* Taşmaları önlemek için eklendi */
}

    .banner-one::before {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: -300px;
        opacity: 0.80;
        content: "";
        background: rgb(14, 18, 29);
        background: linear-gradient(-120deg, rgba(14, 18, 29, 0.90) 10%, rgba(255, 0, 0, 0.4) 30%, rgba(14, 18, 29, 0.9) 50%);
    }

.banner-one__pattern {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-attachment: scroll;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.02;
    z-index: -1;
}

.banner-one__pattern2 {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    text-align: center;
    z-index: -1;
}

.banner-one .shape1 {
    position: absolute;
    left: -240px;
    bottom: -25px;
    z-index: -1;
}

.banner-one__img1,
.banner-one__img5 {
    position: absolute;
    z-index: 1;
}

.banner-one__img1 {
    bottom: -40px;
    right: -35px;
}

.banner-one__img5 {
    bottom: -65px;
    right: 0;
}

.banner-one__location {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    max-width: 1030px;
    min-height: 470px;
    margin: 0 auto;
    z-index: 7;
}

.banner-one__location-single {
    position: absolute;
}

    .banner-one__location-single.style1 {
        top: 115px;
        left: 40px;
    }

    .banner-one__location-single.style2 {
        top: 60px;
        left: 360px;
    }

    .banner-one__location-single.style3 {
        top: 150px;
        left: 570px;
    }

    .banner-one__location-single.style4 {
        left: 315px;
        bottom: 150px;
    }

    .banner-one__location-single.style5 {
        left: 545px;
        bottom: 145px;
    }

    .banner-one__location-single.style6 {
        top: 160px;
        right: 265px;
    }

    .banner-one__location-single.style7 {
        right: 240px;
        bottom: 185px;
    }

    .banner-one__location-single.style8 {
        top: 115px;
        right: 25px;
    }


    .banner-one__location-single .round-box {
        position: relative;
        display: block;
        width: 20px;
        height: 20px;
        background: var(--logistiq-base);
        border-radius: 50%;
        cursor: pointer;
    }

        .banner-one__location-single .round-box::before,
        .banner-one__location-single .round-box::after {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 31px;
            height: 31px;
            border-radius: 50%;
            background: transparent;
            -webkit-animation-delay: .9s;
            animation-delay: .9s;
            content: "";
            box-shadow: 0 0 0 0 rgb(255 255 255 / 60%);
            -webkit-animation: ripple 3s infinite;
            animation: ripple 3s infinite;
            transition: all .4s ease;
        }

        .banner-one__location-single .round-box::after {
            -webkit-animation-delay: .6s;
            animation-delay: .6s;
        }

    .banner-one__location-single .content-box {
        position: absolute;
        top: 55px;
        left: 50%;
        transform: translateX(-50%) translateY(10%);
        background: var(--logistiq-white);
        padding: 0px 15px 18px;
        border: 2px solid var(--logistiq-base);
        text-align: center;
        transition: all 0.2s ease;
        opacity: 0;
        width: max-content;
        visibility: hidden;
        z-index: 100;
    }

    .banner-one__location-single:hover .content-box {
        opacity: 1;
        transform: translateX(-50%) translateY(0%);
        visibility: visible;
    }

.banner-one__content {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner-one__content-left {
    position: relative;
    display: block;
    text-align: right;
}

    .banner-one__content-left h2 {
        color: var(--logistiq-white);
        font-size: 74px;
        line-height: 1.1em;
        font-weight: 700;
        text-transform: capitalize;
        margin-bottom: 27px;
    }

        .banner-one__content-left h2 span {
            color: var(--logistiq-base);
        }

    .banner-one__content-left p {
        color: var(--logistiq-white);
        font-size: 16px;
        line-height: 22px;
        font-weight: 700;
        text-transform: capitalize;
    }

.banner-one__content-right {
    position: relative;
    display: block;
    padding-left: 40px;
    margin-left: 40px;
}

    .banner-one__content-right::before {
        position: absolute;
        top: 10px;
        left: 0;
        bottom: 0px;
        width: 2px;
        background: var(--logistiq-base);
        content: "";
    }

.banner-one__content-right-text p {
    color: #E4E4E4;
    font-size: 20px;
    line-height: 34px;
}

/* Diğer banner-one__content-right stilleri... */


/***
=============================================
Slider One
=============================================
***/
.slider-one {
    position: relative;
    display: block;
    margin-top: -67px;
    z-index: 1;
}

.slider-one__single-bg {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--logistiq-black);
    background-blend-mode: luminosity;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    transform: scale(1);
    transition: all 6000ms linear;
    z-index: -1;
}

.slider-one .active .slider-one__single-bg {
    transform: scale(1.15);
}

.slider-one__single-bg::before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(var(--logistiq-black-rgb), 0.7);
    content: "";
    z-index: -2;
}

.slider-one__single-inner {
    position: relative;
    display: block;
    padding: 241px 0px 210px;
}

.slider-one__single-content {
    position: relative;
    display: block;
    max-width: 700px;
    width: 100%;
}

    .slider-one__single-content .title-box h2 {
        color: var(--logistiq-white);
        font-size: 82px;
        line-height: 1em;
        font-weight: 700;
        text-transform: capitalize;
    }

        .slider-one__single-content .title-box h2 span {
            color: var(--logistiq-base);
        }

.slider-one__form-box {
    position: absolute;
    right: 250px;
    top: 50%;
    transform: translateY(-50%);
    max-width: 500px;
    width: 100%;
    background: var(--logistiq-white);
    padding: 56px 40px 55px;
    border-radius: 2px;
    z-index: 2;
}
/* Diğer stilleriniz buraya... */


/* ==========================================================================
   ### RESPONSIVE DÜZENLEMELER (DUYARLI TASARIM) ###
   ========================================================================== */

/* ----------------------------------------------------------------
   1. Geniş Tablet / Küçük Masaüstü (1199px ve altı)
-----------------------------------------------------------------*/
@media (max-width: 1199px) {
    .banner-one {
        padding-top: 250px; /* Üst boşluğu azalt */
    }

    .banner-one__location {
        /* Harita alanını orantılı küçült */
        width: 100%;
        max-width: 100%;
        height: 0;
        padding-bottom: 45.6%; /* Oranı koru (470/1030) */
        min-height: 0;
        top: 50px;
    }

    /* Noktaları yüzdesel değerlerle yeniden konumlandır */
    .banner-one__location-single.style1 {
        top: 24%;
        left: 4%;
    }

    .banner-one__location-single.style2 {
        top: 12%;
        left: 35%;
    }

    .banner-one__location-single.style3 {
        top: 32%;
        left: 55%;
    }

    .banner-one__location-single.style4 {
        top: 62%;
        left: 30%;
        bottom: auto;
    }

    .banner-one__location-single.style5 {
        top: 62%;
        left: 53%;
        bottom: auto;
    }

    .banner-one__location-single.style6 {
        top: 34%;
        right: 25%;
        left: auto;
    }

    .banner-one__location-single.style7 {
        top: 58%;
        right: 23%;
        bottom: auto;
        left: auto;
    }

    .banner-one__location-single.style8 {
        top: 24%;
        right: 2%;
        left: auto;
    }

    /* Noktaların ve tooltip'lerin boyutunu küçült */
    .banner-one__location-single .round-box {
        width: 15px;
        height: 15px;
    }

    .banner-one__location-single .content-box {
        top: 35px; /* Tooltip mesafesini ayarla */
    }

    /* Dekoratif resimleri gizle */
    .banner-one__img1, .banner-one__img5, .banner-two__img1 {
        display: none;
    }

    .slider-one__form-box {
        position: relative;
        right: auto;
        top: auto;
        transform: none;
        margin: 60px auto 0;
        max-width: 90%;
    }

    .slider-one__single-inner {
        padding: 200px 0px 150px;
    }
}

/* ----------------------------------------------------------------
   2. Tablet Görünümü (991px ve altı)
-----------------------------------------------------------------*/
@media (max-width: 991px) {
    .banner-one {
        padding-top: 180px;
    }

    .banner-one__content {
        flex-direction: column;
        text-align: center;
    }

    .banner-one__content-left,
    .banner-one__content-right {
        text-align: center;
        padding-left: 0;
        margin-left: 0;
    }

        .banner-one__content-right::before {
            display: none;
        }

    .banner-one__content-right {
        margin-top: 40px;
    }

    .banner-one__content-left h2,
    .banner-two__content-top .title-box h2 {
        font-size: 58px;
    }

    .banner-two__content-bottom {
        float: none;
        width: 100%;
        margin-top: 40px;
    }

    .slider-one__single-inner {
        padding: 180px 0;
    }

    .slider-one__single-content .title-box h2 {
        font-size: 60px;
    }
}

/* ----------------------------------------------------------------
   3. Mobil Görünümü (767px ve altı)
-----------------------------------------------------------------*/
@media (max-width: 767px) {
    .banner-one {
        padding-top: 150px;
        padding-bottom: 60px;
    }

    /* Harita alanını daha da küçült */
    .banner-one__location {
        top: 30px;
    }

    /* Noktaları ve tooltip'leri daha da küçült */
    .banner-one__location-single .round-box {
        width: 12px;
        height: 12px;
    }

    /* !!! DEĞİŞİKLİK BURADA YAPILDI !!! */
    /* Ripple efektini mobilde kaldıran kod bloğu silindi. */
    /*
        .banner-one__location-single .round-box::before,
        .banner-one__location-single .round-box::after {
            display: none; 
        }
    */

    .banner-one__location-single .content-box {
        /* Mobilde tooltip'lerin ekrandan taşmasını engelle */
        min-width: 120px;
        transform: translateX(-50%);
    }

    .banner-one__location-single.style1 .content-box,
    .banner-one__location-single.style2 .content-box,
    .banner-one__location-single.style4 .content-box {
        left: 100%;
        transform: translateX(0); /* Sola yaslı olanları sağa aç */
    }

    .banner-one__location-single.style6 .content-box,
    .banner-one__location-single.style7 .content-box,
    .banner-one__location-single.style8 .content-box {
        left: auto;
        right: 100%;
        transform: translateX(0); /* Sağa yaslı olanları sola aç */
    }

    .banner-one__content-left h2,
    .banner-two__content-top .title-box h2 {
        font-size: 42px;
        line-height: 1.2em;
    }

    .banner-one__content-right-text p {
        font-size: 18px;
        line-height: 1.5em;
    }

    .slider-one__single-inner {
        padding: 150px 0px 120px;
    }

    .slider-one__single-content .title-box h2 {
        font-size: 48px;
        line-height: 1.2em;
    }

    .slider-one__form-box {
        padding: 40px 20px;
    }
}