/* ══════════════════════════════════════════════════════════════
   ÖZDEMIR NATURAL — about.css
   Hakkımızda sayfasına özel stiller
══════════════════════════════════════════════════════════════ */

.about-section { width: 100%; padding: 100px 20px; }

.about-container {
    max-width: 900px;
    margin: auto;
    text-align: center;
}

.main-title { font-size: 3rem; font-weight: 700; margin-bottom: 15px; color: #1f1f1f; }
.sub-title { font-size: 1.9rem; font-weight: 600; margin-bottom: 25px; color: #444; }

.about-text {
    max-width: 800px;
    margin: 0 auto 90px;
    line-height: 1.9;
    font-size: 1.1rem;
    color: #555;
}

.faq-title { font-size: 2.4rem; font-weight: 700; margin-bottom: 40px; color: #1f1f1f; }

.faq-section { width: 100%; }

.faq-item { margin-bottom: 18px; }

.faq-question {
    width: 100%;
    border: none;
    cursor: pointer;
    background: white;
    border-radius: 16px;
    padding: 24px 30px;
    font-size: 1.1rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 5px 20px rgba(0,0,0,.05);
    transition: transform .35s ease, background-color .35s ease;
    font-family: Arial, sans-serif;
    text-align: left;
}
.faq-question:hover { transform: scale(1.03); background: #e5e5e5; }
.faq-question span { font-size: 1.6rem; }

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
}
.faq-answer p { padding: 0 35px; text-align: left; line-height: 1.8; color: #555; }

.faq-item.active .faq-answer { max-height: 300px; padding: 25px 0; }
.faq-item.active .faq-question { background: #f0f0f0; }


/* ── HAKKIMIZDA BÖLÜM STİLLERİ ── */
.hero-section { background: linear-gradient(135deg, #f0fff4 0%, #e8f5e9 100%); text-align: center; padding: 120px 20px 80px; }
.hero-text { max-width: 680px; margin: 0 auto; font-size: 1.1rem; color: #555; line-height: 1.8; }
.story-section { background: #fafafa; }
.story-content { display: flex; gap: 50px; align-items: center; max-width: 1100px; margin: 0 auto; flex-wrap: wrap; }
.story-text { flex: 1; min-width: 300px; }
.story-text p { font-size: 1.05rem; color: #555; line-height: 1.8; margin-bottom: 16px; }
.story-img-wrap img { width: 320px; height: 280px; object-fit: cover; border-radius: 18px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); }
.values-section { background: #fff; }
.values-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px; max-width: 1100px; margin: 0 auto; }
.value-card { background: #f0fff4; border: 1.5px solid #a8d5a2; border-radius: 16px; padding: 32px 24px; text-align: center; }
.value-card i { font-size: 40px; color: #21dd3a; margin-bottom: 14px; display: block; }
.value-card h3 { font-size: 1.1rem; font-weight: 700; color: #1a1a1a; margin: 0 0 10px; }
.value-card p { font-size: 0.95rem; color: #666; line-height: 1.6; margin: 0; }
.faq-list { max-width: 860px; margin: 0 auto; }
/* FA icon (chevron) döndürme */
.faq-icon { transition: transform 0.3s; }
.faq-item.active .faq-question .faq-icon { transform: rotate(180deg); }


/* ── MOBİL ── */
@media (max-width: 768px) {
    .main-title { font-size: 2.3rem; }
    .sub-title { font-size: 1.5rem; }
    .faq-title { font-size: 2rem; }
    .faq-question { padding: 20px; font-size: 1rem; }
    .about-section { padding: 60px 18px; }
}