/* ═══════════════════════════════════════════════════════════════════════════════════════════
   /hakkimizda (2026-11-01). Bölümler Staco about-us bileşenleri (style.css); burada yalnız sayaç,
   fotoğraf ve ekip kartından arındırılınca gereken küçük ekler var. anahtar-sayfa.css'ten sonra yüklenir.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

/* Nedir: görsel kutusu (temadaki açık zeminli çerçeve) */
.hk-nedir { padding: 100px 0 90px; }
.hk-gorsel-kutu {
    padding: 34px;
    border-radius: 0 120px 24px 24px;
    background: #eef1fb;
}
.hk-gorsel-kutu svg { display: block; width: 100%; height: auto; }
.hk-nedir .customer-content-text .section-title { margin-bottom: 20px; }
.hk-nedir .customer-content-text p { font-size: 17px; line-height: 1.8; color: #374151; }
.hk-nedir .text-link { margin-top: 8px; font-weight: 600; }

/* Ne yapar: kart başlığı bağlantı olabilir */
.hk-neyapar { padding: 80px 0 40px; background: #f6f8fd; }
.hk-neyapar .core-feature-item { max-width: 100%; }
.hk-neyapar .core-feature-item h3 a { color: inherit; }
.hk-neyapar .core-feature-item h3 a:hover { color: #0f57e8; }
.hk-giris { max-width: 680px; margin: 14px auto 0; font-size: 17px; line-height: 1.7; color: #4b5563; }

/* Kimler için: ekip kartı, fotoğraf yerine ikon */
.hk-kimler { padding: 100px 0 60px; }
.hk-kimler .team-card {
    width: 100%;
    max-width: 300px;
    min-height: 100%;
    padding: 28px 22px 26px;
    text-align: center;
}
.hk-kimler .row > div { display: flex; margin-bottom: 30px; }
.hk-kimler .team-card { margin-bottom: 0; }
.hk-kart-ikon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 112px;
    height: 112px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: #eef4ff;
    color: #0f57e8;
    font-size: 40px;
}
.hk-kimler .team-card h3 { margin-bottom: 10px; font-size: 19px; font-weight: 700; }
.hk-kimler .team-card h3 a, .hk-neden-kart h3 a { color: inherit; }
.hk-kimler .team-card h3 a:hover, .hk-neden-kart h3 a:hover { color: #0f57e8; }
.hk-kimler .team-card p { margin: 0; font-size: 15px; line-height: 1.6; color: #4b5563; }

/* Misyon / vizyon / hedef */
.hk-amac { padding: 40px 0 40px; }
.about-feature-tab .about-feature-tab-content .list .list-item i { flex: 0 0 auto; margin-right: 10px; font-size: 20px; color: #16a34a; }
.hk-amac .about-feature-tab-content h3 { margin-bottom: 14px; font-size: 22px; font-weight: 700; }
.hk-telefon { padding: 20px 0; text-align: center; }
.hk-telefon img { max-width: 100%; height: auto; }

/* Veri güvenliği: yorum kartı, avatar yerine kalkan */
.hk-guvenlik { padding: 100px 0; }
.hk-guvenlik .testimonial-card-left { flex: 0 0 32%; width: 32%; height: auto; align-self: stretch; }
.hk-guvenlik .testimonial-card-right { flex: 1 1 auto; width: auto; height: auto; min-width: 0; padding: 56px 52px 48px; }
.hk-kalkan {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    background: #34365e;
    color: #fec458;
    font-size: 84px;
}
.hk-guvenlik-giris { margin-bottom: 24px; font-size: 16px; line-height: 1.7; color: rgba(255, 255, 255, 0.82); }
.hk-guvenlik-liste {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px 28px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.hk-guvenlik-liste li { display: flex; gap: 14px; }
.hk-guvenlik-liste i { flex: 0 0 26px; margin-top: 3px; font-size: 20px; text-align: center; color: #7ab8ff; }
.hk-guvenlik-liste h3 { margin-bottom: 4px; font-size: 16px; font-weight: 700; color: #fff; }
.hk-guvenlik-liste p { margin: 0; font-size: 14px; line-height: 1.55; color: rgba(255, 255, 255, 0.76); }

/* Değerlerimiz: temadaki sayaç bandı, sayısız */
.hk-degerler { margin-bottom: 0; padding: 80px 0 50px; }
.hk-deger { margin-bottom: 30px; padding: 0 8px; text-align: center; }
.hk-deger i { display: block; margin-bottom: 16px; font-size: 36px; color: #0095ff; }
.hk-deger h3 { margin-bottom: 10px; font-size: 19px; font-weight: 700; }
.hk-deger p { margin: 0; font-size: 15px; line-height: 1.6; color: #4b5563; }

/* Neden Şantiye Plus */
.hk-neden { padding: 90px 0 50px; }
.hk-neden .row > div { display: flex; margin-bottom: 24px; }
.hk-neden-kart { width: 100%; padding: 26px 22px; border-radius: 18px; background: #f6f8fd; }
.hk-neden-kart i { display: block; margin-bottom: 14px; font-size: 26px; color: #0f57e8; }
.hk-neden-kart h3 { margin-bottom: 8px; font-size: 18px; font-weight: 700; }
.hk-neden-kart p { margin: 0; font-size: 15px; line-height: 1.6; color: #4b5563; }

@media (max-width: 991.98px) {
    .hk-nedir { padding: 60px 0; }
    .hk-gorsel-kutu { max-width: 460px; margin: 0 auto 32px; }
    .hk-kimler { padding: 60px 0 30px; }
    .hk-kimler .row > div { justify-content: center; }
    .hk-telefon { margin-top: 24px; }
    .hk-guvenlik { padding: 60px 0; }
    .hk-guvenlik .testimonial-card { flex-direction: column; }
    .hk-guvenlik .testimonial-card-left { flex: 0 0 auto; width: 100%; min-height: 200px; border-radius: 50px 50px 0 0; }
    .hk-guvenlik .testimonial-card-right { width: 100%; min-height: 0; padding: 34px 26px 30px; }
    .hk-guvenlik .bg-shape { display: none; }
    .hk-kalkan { width: 130px; height: 130px; margin: 34px 0; font-size: 56px; }
}
@media (max-width: 767.98px) {
    .hk-guvenlik-liste { grid-template-columns: 1fr; }
    .hk-gorsel-kutu { padding: 22px; border-radius: 0 70px 20px 20px; }
    .hk-degerler, .hk-neden { padding: 54px 0 24px; }
}