.container .row.justify-content-center {
    margin-bottom: 3rem;
}

.display-4 {
    color: #050131; /* Kurumsal renginizde başlık */
}

.lead {
    color: #495057; /* Koyu gri metin, okunurluğu artırmak için */
}

/* Kart Stilini Geliştirme */
.card {
    border-radius: 0.75rem; /* Hafif yuvarlak köşeler */
    transition: all 0.3s ease-in-out; /* Animasyon geçişi */
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); /* Hafif gölge */
    border: 1px solid rgba(5, 1, 49, 0.1); /* Kurumsal renkten hafif bir kenarlık */
}

/* Kart Üzerine Gelindiğinde Dönüşüm Efekti */
.card.transform-on-hover:hover {
    transform: translateY(-5px) scale(1.02); /* Hafif yukarı kayma ve büyüme */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); /* Daha belirgin gölge */
    cursor: pointer;
}

.card-body {
    padding: 2rem;
}

.card-title {
    color: #050131; /* Kurumsal renginizde kart başlığı */
    margin-bottom: 0.75rem;
}

.card-text {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #6c757d; /* Açık gri metin */
}

/* Büyük İkon Stili */
.icon-large {
    font-size: 3.5rem; /* İkon boyutu */
    color: #050131; /* Kurumsal renginizde ikon */
    margin-bottom: 1rem;
}

/* Buton Stilini Geliştirme */
.btn-outline-primary {
    border-width: 2px;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    transition: all 0.3s ease;
    color: #050131; /* Kurumsal renkte buton yazısı */
    border-color: #050131; /* Kurumsal renkte buton kenarlığı */
}

.btn-outline-primary:hover {
    background-color: #050131; /* Hover'da kurumsal renge bürünsün */
    color: #fff; /* Hover'da yazısı beyaz olsun */
    border-color: #050131; /* Hover'da kenarlığı da aynı renk olsun */
}

/* hakkimizda/css/biz-kimiz.css */

/* Yöntem A: Mevcut Bootstrap sınıfını hedefleyerek */
.btn-outline-primary:active,
.btn-outline-primary:focus {
    background-color: #05376c !important; /* Tıklandığında veya odaklandığında daha koyu mavi arka plan */
    border-color: #05376c !important;   /* Tıklandığında veya odaklandığında daha koyu mavi kenarlık */
    color: #fff !important;              /* Tıklandığında veya odaklandığında beyaz yazı rengi */
    box-shadow: 0 0 0 0.25rem rgba(9, 83, 193, 0.5) !important; /* Bootstrap'in focus ring'ini koru veya değiştir */
}



/* Duyarlı Tasarım İyileştirmeleri */
@media (max-width: 768px) {
    .display-4 {
        font-size: 2.5rem;
    }
    .lead {
        font-size: 1rem;
    }
    .icon-large {
        font-size: 2.8rem;
    }
    .card-body {
        padding: 1.5rem;
    }
}