/*------------------------ Accordion ---------------------*/
.accordion-wrapper {
    width: 100%;
    /* 3 sütun için daha geniş bir max-width. */
    /* (3 * 300px min-width) + (2 * 30px gap) = 900 + 60 = 960px. Biraz daha boşluk bırakalım. */
    padding: 20px;
}

.accordion-container {
    display: flex;
    gap: 30px; /* Sütunlar arasındaki boşluk */
    flex-wrap: wrap; /* Küçük ekranlarda alt alta geçişi sağlar */
    justify-content: center; /* Sütunlar sardığında ortalamak için */
}

.accordion-column {
    flex: 1; /* Sütunların eşit genişlikte olmasını sağlar */
    min-width: 300px; /* Sütunların çok fazla küçülmemesi için (içerik sığsın) */
    /* Ekran küçüldüğünde 2 veya 1 sütuna düşmesini bu ayar ve flex-wrap sağlar */
}

/* Accordion Öğesi */
.accordion-item {
    background-color: #ffffff;
    border-radius: 15px; /* Görseldeki yuvarlak köşeler */
    margin-bottom: 20px; /* Her öğe arasındaki boşluk */
    overflow: hidden; /* İçerik geçişi için önemli */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); /* Hafif gölge */
}

.accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 18px 25px; /* İç boşluklar */
    font-size: 17px;
    font-weight: bold;
    color: #333; /* Koyu gri metin */
    background: none;
    border: none;
    cursor: pointer;
    text-align: left; /* Metni sola hizala */
    transition: background-color 0.3s ease;
}

.accordion-header:hover {
    background-color: #f5f5f5; /* Hover rengi */
}

/* Accordion İkonu (Artı/Eksi) */
.accordion-icon {
    width: 32px;
    height: 32px;
    border: 2px dashed #ff9933; /* Görseldeki turuncu kesikli çizgi */
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ff9933; /* Turuncu renk */
    font-size: 20px;
    font-weight: normal; /* Plus işareti daha ince görünsün */
    transition: transform 0.3s ease; /* Dönüşüm animasyonu */
}

/* Accordion İçeriği */
.accordion-content {
    max-height: 0; /* Varsayılan olarak gizli */
    overflow: hidden;
    transition: max-height 0.3s ease-out, padding 0.3s ease-out; /* İçerik açılış/kapanış animasyonu */
    padding: 0 25px; /* Yatayda boşluk bırak, dikeyde 0 */
}

.accordion-content p {
    margin-top: 0;
    margin-bottom: 15px; /* İçerik paragrafının alt boşluğu */
    line-height: 1.6;
    color: #666; /* Daha açık metin rengi */
}

/* Aktif Durum */
.accordion-item.active .accordion-content {
    max-height: 200px; /* Açıldığında maksimum yükseklik (içeriğine göre ayarlayın) */
    padding-bottom: 15px; /* Açıldığında alt boşluk */
}

.accordion-item.active .accordion-icon {
    transform: rotate(45deg); /* Artı işaretini çarpıya çevir */
}

/* Responsive Düzenlemeler */
@media (max-width: 992px) { /* Ekran genişliği 992px'ten küçükse */
    .accordion-column {
        flex-basis: calc(50% - 15px); /* Her sütun 2'ye bölünür, boşluk için 15px çıkarılır */
        max-width: calc(50% - 15px); /* Ekstra güvenlik için max-width */
    }
}

@media (max-width: 768px) { /* Ekran genişliği 768px'ten küçükse */
    .accordion-container {
        flex-direction: column; /* Tablet ve mobil cihazlarda sütunları alt alta getir */
        gap: 0; /* Alt alta geçince sütunlar arası boşluk kalkar */
    }

    .accordion-column {
        min-width: unset; /* Minimum genişlik sınırlamasını kaldır */
        width: 100%; /* Sütunlar tam genişliği kaplar */
        flex-basis: 100%; /* Sütunlar tam genişliği kaplar */
        max-width: 100%;
    }
}
/*--------------------------------------------------------*/