/* Canlı Minimalist Tema */
body {
    background-color: #f8fafc; /* Çok açık, ferah bir gri */
    font-family: 'Inter', sans-serif; /* Temiz ve modern bir yazı tipi */
}
/* Kategori renklerine özel sınıflar */
.card-accent-blue { border-top-color: #3b82f6; }
.btn-accent-blue { background-color: #3b82f6; }
.btn-accent-blue:hover { background-color: #2563eb; }

.card-accent-green { border-top-color: #16a34a; }
.btn-accent-green { background-color: #16a34a; }
.btn-accent-green:hover { background-color: #15803d; }

.card-accent-orange { border-top-color: #f97316; }
.btn-accent-orange { background-color: #f97316; }
.btn-accent-orange:hover { background-color: #ea580c; }

.card-accent-purple { border-top-color: #9333ea; }
.btn-accent-purple { background-color: #9333ea; }
.btn-accent-purple:hover { background-color: #7e22ce; }

.card-accent-red { border-top-color: #ef4444; }
.btn-accent-red { background-color: #ef4444; }
.btn-accent-red:hover { background-color: #dc2626; }
/* Arkaplan Görselli Hero Alanı */
.hero-section-bg {
    position: relative;
    background-size: cover;
    background-position: center;
    border-radius: 1.25rem; /* Tailwind'deki rounded-xl ile aynı */
    overflow: hidden;
    color: white; /* İçindeki yazıların rengini beyaz yapar */
}

.hero-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* Yazıların okunabilmesi için resmin üzerine gelen yarı saydam koyu katman */
    background-color: rgba(17, 24, 39, 0.8); 
}

.hero-content {
    position: relative; /* Overlay'in üzerinde kalması için */
    z-index: 10;
}
/* Sayfa Kaydıkça Gelen Animasyon Stilleri */
.fade-in-up {
    opacity: 0; /* Başlangıçta görünmez */
    transform: translateY(30px); /* Başlangıçta 30px aşağıda */
    transition: opacity 0.8s ease-out, transform 0.8s ease-out; /* Yumuşak geçiş efekti */
}

.fade-in-up.is-visible {
    opacity: 1; /* Görünür hale gel */
    transform: translateY(0); /* Kendi pozisyonuna geri dön */
}