.page-section {
    background-image: url('/tema/genel/uploads/logo/rakamlarla-bg.jpg'); /* Arka plan görseli */
    background-size: cover; /* Arka planın tam olarak alana yayılmasını sağlar */
    background-position: center; /* Arka planın merkezde konumlanmasını sağlar */
    background-attachment: fixed; /* Arka planın sayfa kaydırıldıkça sabit kalmasını sağlar */
    padding: 50px 0; /* İçeriğe biraz boşluk ekler */
    position: relative; /* Arka plan görseli ve içerik için konumlandırma */
    margin-bottom: 0px !important;
    /*max-width: 80%;*/ /* Genişliği %80 ile sınırla */
    margin: 0 auto;  Ortalamak için 
    padding: 20px; /* Sağ ve soldan boşluk bırak */
}

    .page-section::before {
        content: ''; /* İçerik ekler */
        position: absolute; /* Arka plan fotoğrafını kaplamak için */
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.35 ); /* Karartma efekti (0.5 değeri karartma seviyesini belirtir) */
        z-index: 0; /* Karartma katmanı arka planda olacak şekilde ayarlanır */
    }

.page-content {
    position: relative; /* İçeriği karartmanın önüne yerleştirmek için */
    z-index: 1; /* İçeriğin ön planda kalmasını sağlar */
}


@media (max-width: 768px) {
    .carousel-indicators {
        display: none !important; /* 768px ve altındaki cihazlarda gizle */
    }
}


.owl-carousel-proje .col-md-12 {
    /*max-width: 900px;*/ /* İçeriğin maksimum genişliğini belirle */
    margin: 0 auto;

}
.carousel-indicators {
    margin-top: 30px; /* Sayıların olduğu kısmı aşağı kaydır */
    position: relative; /* Üst üste gelmesini önler */
    z-index: 10; /* Diğer içeriklerin altında kalmasını engeller */
    display: flex;
    justify-content: center;
    align-items: center;
    background: #1d345b; /* Kırmızı arka plan */
    padding: 10px 0;
}

.indicator-btn {
    background: rgba(255, 255, 255, 0.2); /* Saydam beyaz arka plan */
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 16px;
    color: white; /* Sayıları görünür yap */
    transition: background 0.3s, color 0.3s;
    margin: 0 5px;
    border-radius: 0; /* Kare tasarım */
}

    .indicator-btn.active,
    .indicator-btn:hover {
        background: rgba(255, 255, 255, 0.4); /* Seçili olan koyu */
        color: #fff; /* Seçili olunca da beyaz kalsın */
    }

.centered-image-container {
    /* display: flex; */
    justify-content: center; /* Yatay ortalama */
    align-items: center; /* Dikey ortalama */
    text-align: center; /* İçeriği ortalar */
    margin: auto; /* Ortaamayı güçlendirmek için */
    height: 600px; /* Standart bir yükseklik belirle (isteğe bağlı, artırılabilir) */
    overflow: hidden; /* Taşan kısımları gizle */
}

.centered-image {
    max-width: 100%;
    /* height: auto; */
    display: block;
    width: 100%; /* Genişliği tamamen kaplasın */
    /* height: 100%; /* Konteynerin yüksekliğini tamamen doldursun */ */             object-fit: cover; /* Görselin oranlarını bozmadan tam sığdır */
}

.col-10.mx-auto {
    height: 65px;
    background: rgba(255, 255, 255, 0.8); /* Hafif şeffaf beyaz arka plan */
    padding: 15px; /* İç boşluk */
    border-radius: 10px; /* Köşeleri yuvarlat */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15); /* Hafif gölge efekti */
    text-align: center; /* Ortaya hizala */
    backdrop-filter: blur(5px); /* Blur efekti ekle */
    margin-top: -40px;
}

h3.font-weight-bold {
    font-size: 20px; /* Başlık boyutu */
    color: #333; /* Koyu renk */
    margin-bottom: 5px; /* Başlık altındaki boşluğu azalt */
}

p.context {
    font-size: 16px; /* Yazı boyutu */
    color: #555; /* Açık gri renk tonu */
    line-height: 1.4; /* Satır aralığı */
}

p.text-right {
    font-size: 14px; /* Tarih yazı boyutu */
    color: #777; /* Daha açık gri tonu */
    font-style: italic; /* İtalik yap */
    text-align: center; /* Ortaya hizala */
}