/* ============================================================
   ekip.css — Ekip (takim uyesi) detay sayfasi
   Bu dosya YALNIZCA ekip sayfasinda yuklenir; seciciler global ama
   sadece bu sayfayi etkiler. Tema (safeair) acik zeminli, mavi
   accent'lidir. Temayi degistirmek icin :root degerlerini guncelle.
   ============================================================ */

:root {
    --custom-color-1: #0081c9;   /* ana accent (mavi) */
    --custom-color-2: #022b6d;   /* koyu mavi (hover) */
    --custom-color-3: #666666;   /* soluk metin */
    --custom-color-4: #f7f7f7;   /* acik yuzey */
    --custom-text-1: var(--font-default, 'Outfit', sans-serif);
    --custom-text-2: var(--font-heading, 'Outfit', sans-serif);

    --kb-bg: #ffffff;
    --kb-card: #ffffff;
    --kb-card-2: #f7f7f7;
    --kb-border: #e7e7e7;
    --kb-text: #0e0e0e;
    --kb-muted: #666666;
}

.inner-header-section,
.team-details-section,
main {
    color: var(--kb-text);
    font-family: var(--custom-text-1);
}

/* Bolum / bosluk yardimcilari */
.sp3 { padding: 80px 0; }
.space8 { height: 8px; }
.space16 { height: 16px; }
.space20 { height: 20px; }
.space24 { height: 24px; }
.space100 { height: 80px; }

/* ---------- Sayfa basligi (hero) ---------- */
.inner-header-section {
    position: relative;
    background: linear-gradient(120deg, var(--custom-color-2) 0%, var(--custom-color-1) 100%);
    padding: 170px 0 70px;
    text-align: center;
    border-bottom: 1px solid var(--kb-border);
    overflow: hidden;
}

.inner-header-section::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 60%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent);
}

.about-inner-header h1 {
    color: #fff;
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
}

.about-inner-header a {
    color: rgba(255, 255, 255, .75);
    text-decoration: none;
    transition: color .3s ease;
}

.about-inner-header a:hover { color: #fff; }

.about-inner-header i {
    color: #fff;
    margin: 0 6px;
    font-size: 13px;
}

.about-inner-header span.fw-bold { color: #fff; }

/* ---------- Ekip uyesi kart alani ---------- */
.team-details-area {
    background: var(--kb-card);
    border: 1px solid var(--kb-border);
    border-radius: 16px;
    padding: 30px;
    box-shadow: var(--box-shadow-regular, 0 2px 12px 0 #e7e7e7);
}

.team-details-area .img1 {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--kb-border);
}

.team-details-area .img1 img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.team-content h3 {
    color: var(--kb-text);
    font-size: 28px;
    font-weight: 700;
    margin: 0;
    font-family: var(--custom-text-2);
}

.team-content > p {
    color: var(--kb-muted);
    line-height: 1.8;
    margin: 0;
}

/* bilgi satirlari (Pozisyon / Diller / Telefon ...) */
.team-content .content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 6px;
}

.team-details-section .team-details-area .team-content .content .keyword {
    color: var(--custom-color-1) !important;
    font-family: var(--custom-text-2);
    font-size: 16px;
    font-weight: 600;
}

.team-content .content p,
.team-content .content a {
    color: var(--kb-text);
    margin: 0;
    text-decoration: none;
    transition: color .3s ease;
}

.team-content .content a:hover { color: var(--custom-color-1); }

/* sosyal medya ikonlari */
.team-content .content ul {
    list-style: none;
    margin: 0;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.team-content .content ul li a {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--kb-border);
    border-radius: 50%;
    color: var(--kb-text);
    text-decoration: none;
    transition: all .3s ease;
}

.team-content .content ul li a:hover {
    background: var(--custom-color-1);
    border-color: var(--custom-color-1);
    color: #fff;
    transform: translateY(-3px);
}

/* ---------- Makale govdesi (ham HTML) ---------- */
.blog-content {
    color: #444444;
    font-size: 16px;
    line-height: 1.85;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.blog-content > *:first-child { margin-top: 0; }

.blog-content h1,
.blog-content h2,
.blog-content h3,
.blog-content h4,
.blog-content h5,
.blog-content h6 {
    color: var(--kb-text);
    font-weight: 700;
    line-height: 1.3;
    margin: 1.8em 0 .6em;
    font-family: var(--custom-text-2);
}

.blog-content h1 { font-size: 30px; }
.blog-content h2 { font-size: 26px; padding-bottom: 8px; border-bottom: 1px solid var(--kb-border); }
.blog-content h3 { font-size: 22px; }
.blog-content h4 { font-size: 19px; }
.blog-content h5 { font-size: 17px; }
.blog-content h6 { font-size: 16px; }

.blog-content p { margin: 0 0 1.2em; }

.blog-content a {
    color: var(--custom-color-1);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.blog-content a:hover { color: var(--custom-color-2); }

.blog-content strong,
.blog-content b { color: var(--kb-text); }

.blog-content ul,
.blog-content ol { margin: 0 0 1.2em; padding-left: 1.5em; }

.blog-content li { margin-bottom: .55em; }
.blog-content ul li::marker { color: var(--custom-color-1); }
.blog-content ol li::marker { color: var(--custom-color-1); font-weight: 700; }

.blog-content img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    display: block;
    margin: 1em 0;
}

.blog-content blockquote {
    margin: 0 0 1.4em;
    border-left: 4px solid var(--custom-color-1);
    background: var(--kb-card-2);
    padding: 16px 20px;
    border-radius: 0 8px 8px 0;
    color: var(--kb-muted);
}

.blog-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 1.6em;
    font-size: 15px;
}

.blog-content th,
.blog-content td {
    border: 1px solid var(--kb-border);
    padding: 10px 14px;
    text-align: left;
}

.blog-content thead th { background: var(--kb-card-2); color: var(--kb-text); }
.blog-content hr { border: none; height: 1px; background: var(--kb-border); margin: 2em 0; }

/* ---------- Iletisim formu (yan panel) ---------- */
.contact4-section-area {
    background: var(--kb-card);
    border: 1px solid var(--kb-border);
    border-radius: 16px;
    padding: 28px;
    box-shadow: var(--box-shadow-regular, 0 2px 12px 0 #e7e7e7);
}

.contact-input-area label {
    color: var(--kb-text);
    font-size: 14px;
    font-weight: 600;
    display: block;
}

.contact-input-area input,
.contact-input-area textarea {
    width: 100%;
    background: var(--kb-card-2);
    border: 1px solid var(--kb-border);
    color: var(--kb-text);
    padding: 12px 14px;
    border-radius: 8px;
    outline: none;
    font-family: var(--custom-text-1);
    transition: border-color .3s ease;
}

.contact4-section-area .contact-form-area .contact-input-area textarea { height: 110px; resize: vertical; }

.contact-input-area input::placeholder,
.contact-input-area textarea::placeholder { color: #999; }

.contact-input-area input:focus,
.contact-input-area textarea:focus { border-color: var(--custom-color-1); }

/* gonder butonu */
.theme-btn7 {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--custom-color-1);
    color: #fff;
    border: none;
    padding: 13px 28px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: background .3s ease, gap .3s ease;
}

.theme-btn7:hover { background: var(--custom-color-2); gap: 14px; }

/* ---------- Responsive ---------- */
@media screen and (max-width: 991px) {
    .inner-header-section { padding: 130px 0 50px; }
    .sp3 { padding: 50px 0; }
    .space100 { height: 50px; }
    .team-details-area { padding: 22px; }
    .team-details-area .img1 { margin-bottom: 24px; }
    .col-lg-4 .contact4-section-area { margin-top: 30px; }
}