/* css/hakkimizda.css */

/* HERO */
.hero-section {
    padding: 160px 0 100px;
    background: linear-gradient(135deg, #e0fcfd 0%, #ffffff 100%);
    text-align: center;
    border-bottom: 1px solid rgba(58, 222, 228, 0.1);
}
.hero-section h1 { font-size: 3.5rem; color: #1e293b; margin-bottom: 20px; font-weight: 800; }
.hero-section p { font-size: 1.2rem; color: #64748b; max-width: 700px; margin: 0 auto; }

/* HİKAYE ALANI */
.story-section { padding: 100px 0; background: #fff; }
.story-section .container { display: flex; align-items: center; gap: 60px; }
.story-content { flex: 1; }
.story-content h2 { font-size: 2.5rem; color: #1e293b; margin-bottom: 30px; line-height: 1.2; }
.story-text { color: #64748b; line-height: 1.8; margin-bottom: 30px; font-size: 1.05rem; }
.story-image { flex: 1; }
.story-image img { width: 100%; border-radius: 20px; box-shadow: 0 20px 50px rgba(0,0,0,0.1); }
.btn { background: #3ADEE4; color: white; padding: 12px 30px; border-radius: 8px; text-decoration: none; font-weight: 700; display: inline-block; transition:0.3s; }
.btn:hover { background: #2BBEC7; transform: translateY(-3px); }

/* İSTATİSTİKLER */
.stats-section { background: #111827; padding: 80px 0; color: white; text-align: center; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 30px; }
.stat-number { font-size: 3.5rem; font-weight: 800; color: #3ADEE4; margin-bottom: 10px; }
.stat-title { font-size: 1.1rem; color: #9ca3af; }

/* KARTLAR */
.cards-section { padding: 100px 0; background: #f8fafc; }
.cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
.info-card { background: white; padding: 40px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: 0.3s; border: 1px solid #e2e8f0; }
.info-card:hover { transform: translateY(-10px); border-color: #3ADEE4; }
.card-icon { width: 60px; height: 60px; background: #e0fcfd; color: #3ADEE4; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.8rem; margin-bottom: 25px; }
.info-card h3 { font-size: 1.4rem; color: #1e293b; margin-bottom: 15px; }
.info-card p { color: #64748b; line-height: 1.6; }

@media (max-width: 992px) {
    .story-section .container { flex-direction: column; text-align: center; }
    .story-image img { max-width: 100%; }
}