/* ==========================================================================
   Bayiseç blokları — ön yüz stilleri
   --------------------------------------------------------------------------
   NEDEN BOOTSTRAP YOK: bu dosya İKİ kabukta birden yükleniyor — masaüstü
   (assets/css/style.css, bootstrap var) ve mobil (mobile-theme/assets/css/
   style.css, bootstrap YOK). Bootstrap ızgarasına yaslanan bir blok mobilde
   tek sütuna çökerdi. Yerleşim burada CSS Grid ile kuruluyor.

   TOKEN'LAR: bayisec-ds.css / bayisec-ds-mobile.css tanımlar. Yine de her
   var() bir yedek değer taşıyor — bloklar ilerideki bir şablonda o dosyalar
   olmadan da render edilebilmeli.

   Yüklenme sırası: iki kabukta da EN SON (bkz. header.php / mobile-header.php).
   ========================================================================== */

/* --------------------------------------------------------------------------
   0) Sayfa kabuğu — marka içerik sayfasının ortak çerçevesi
   -------------------------------------------------------------------------- */
.bs-page-h1 {
    font-size: 22px;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
    margin: 0;
    line-height: 1.3;
}

.bs-content-card { overflow: hidden; }

.bs-content {
    color: var(--bs-body, #4a5a6a);
    font-size: 15px;
    line-height: 1.75;
}

.bs-content > *:first-child { margin-top: 0; }
.bs-content > *:last-child  { margin-bottom: 0; }

.bs-content-empty {
    color: var(--bs-muted, #8595a5);
    font-style: italic;
    margin: 0;
}

/* Kapak görseli yüklenmemiş markada slider yerine geçen şerit
   (bkz. partial/brand-menu.php'deki gerekçe). */
/* Seçici bilerek uzun: style.css:27736 `.user-profile .hovercard .cardheader`
   yüksekliği `calc(100vh - 420px)` yapıyor (0,3,0). Daha kısa bir seçici bu
   kuralı ezmez — kapaksız markada şerit yine ekran boyu kalırdı. */
.user-profile .hovercard .cardheader.bs-kapak-yedek {
    height: 150px;
    background: linear-gradient(120deg, var(--bs-navy, #143d59) 0%, var(--bs-navy-600, #1b4f74) 55%, var(--bs-gold-600, #d99c0a) 160%);
}

/* Marka logosu — logolar kare değil, çoğu da şeffaf zeminli PNG.
   Vendor (style.css:27753) <img>'i 100×100'e ZORLUYOR ve `border-radius:50%`
   veriyordu: geniş logo (ör. Güngör Zeytin 490×151) daireye eziliyor, şeffaf
   zemin de kapak görselinin üstünde okunmuyordu.
   Kutunun YÜKSEKLİĞİ sabit kalır — 100px, vendor'ınkiyle AYNI dikey iz
   (bootstrap `box-sizing:border-box` verdiği için vendor'ın 100px'i kenarlık
   dahildir); ölçüldü: kutunun alt kenarı marka adının tam üstünde biter,
   1px bile üstüne binmez — GENİŞLİK logonun oranınca uzar. `contain` + min/max sınırları aşırı geniş
   ya da dar logoda bile kırpma ve bozulma bırakmaz; beyaz zemin şeffaflığı
   kapatır. Seçici vendor'la aynı ağırlıkta (0,4,1); bu dosya style.css'ten
   SONRA yüklendiği için ezer (bkz. header.php). */
.user-profile .hovercard .user-image .avatar img {
    width: auto;
    height: 100px;
    min-width: 100px;
    max-width: min(300px, 74vw);
    max-height: 100px;
    object-fit: contain;
    padding: 8px;
    border: 0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 2px 12px rgba(20, 38, 58, .16);
}

/* Marka menüsündeki aktif sekme — kullanıcı hangi sayfada olduğunu görsün. */
.bs-tab.is-active,
.user-designation .title a.bs-tab.is-active {
    color: var(--bs-gold-700, #8f5f00) !important;
    position: relative;
}
/* Sekmeler lacivert düğme (vendor `.user-profile .inner-menu a`, zemin #143d59): koyu altın orada 2,06:1
   kalıyordu. Etkin sekme açık altın (6,0:1); beyaz karttaki marka adı bağlantısı yukarıdaki koyu altında. */
.inner-menu a.bs-tab.is-active,
.inner-menu a.bs-tab.is-active span {
    color: var(--bs-gold, #f4b41a) !important;
}
.inner-menu a.bs-tab.is-active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -6px;
    height: 2px;
    border-radius: 2px;
    background: var(--bs-gold, #f4b41a);
}

/* --------------------------------------------------------------------------
   1) Blok temeli
   -------------------------------------------------------------------------- */
.bs-blk {
    margin: 0 0 40px;
    color: var(--bs-body, #4a5a6a);
    font-size: 15px;
    line-height: 1.75;
}
.bs-blk:last-child { margin-bottom: 0; }

.bs-blk__ust {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--bs-gold-700, #8f5f00);
}

.bs-blk__baslik {
    margin: 0 0 12px;
    font-size: 24px;
    line-height: 1.3;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
h3.bs-blk__baslik { font-size: 19px; }

.bs-blk__aciklama { margin: 0 0 4px; }
.bs-blk__aciklama p:last-child { margin-bottom: 0; }

.bs-blk__ikon { width: 20px; height: 20px; flex: 0 0 auto; }
.bs-blk__ikon--sm { width: 16px; height: 16px; }

.bs-blk.is-orta { text-align: center; }
.bs-blk.is-orta .bs-blk__aciklama { max-width: 720px; margin-left: auto; margin-right: auto; }

/* Butonlar ------------------------------------------------------------- */
.bs-blk__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 16px 10px 0 0;
    padding: 11px 22px;
    border-radius: var(--bs-r-pill, 999px);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: var(--bs-t, .18s ease);
    border: 1px solid transparent;
}
.bs-blk__btn--birincil {
    background: var(--bs-navy, #143d59);
    color: #fff;
}
.bs-blk__btn--birincil:hover,
.bs-blk__btn--birincil:focus {
    background: var(--bs-navy-700, #0f2f45);
    color: #fff;
}
.bs-blk__btn--ikincil {
    background: transparent;
    color: var(--bs-navy, #143d59);
    border-color: var(--bs-line, #e6ebf1);
}
.bs-blk__btn--ikincil:hover,
.bs-blk__btn--ikincil:focus {
    border-color: var(--bs-navy, #143d59);
    color: var(--bs-navy, #143d59);
}

/* --------------------------------------------------------------------------
   2) Metin + Görsel
   -------------------------------------------------------------------------- */
.bs-blk__ikili {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: center;
}
.bs-blk--metin-gorsel.is-oran-dar   .bs-blk__ikili { grid-template-columns: 2fr 1fr; }
.bs-blk--metin-gorsel.is-oran-genis .bs-blk__ikili { grid-template-columns: 1fr 2fr; }
/* Görsel yoksa metin tam genişlik — bkz. render.php'deki "is-tek" gerekçesi. */
.bs-blk--metin-gorsel.is-tek .bs-blk__ikili { grid-template-columns: 1fr; }

/* Görsel solda: DOM sırası değişmez (metin önce gelir — ekran okuyucu ve
   mobilde doğru sıra budur), yalnız sütun yerleri takas edilir. */
.bs-blk--metin-gorsel.is-sol .bs-blk__kolon--gorsel { order: -1; }

.bs-blk__kolon { min-width: 0; }
.bs-blk__kolon--gorsel { margin: 0; }
.bs-blk__gorsel {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--bs-r, 12px);
    box-shadow: var(--bs-sh-1, 0 2px 8px rgba(16,34,56,.05));
}

.bs-blk__maddeler {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
}
.bs-blk__maddeler li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 6px 0;
}
.bs-blk__maddeler svg {
    margin-top: 4px;
    color: var(--bs-ok, #16a34a);
}

/* --------------------------------------------------------------------------
   3) Kart ızgarası
   -------------------------------------------------------------------------- */
.bs-blk__izgara {
    display: grid;
    gap: 20px;
}
.bs-blk--kart-izgarasi.is-sutun-2 .bs-blk__izgara { grid-template-columns: repeat(2, 1fr); }
.bs-blk--kart-izgarasi.is-sutun-3 .bs-blk__izgara { grid-template-columns: repeat(3, 1fr); }
.bs-blk--kart-izgarasi.is-sutun-4 .bs-blk__izgara { grid-template-columns: repeat(4, 1fr); }

/* Zengin metin alanlarındaki bağlantılar. Kural yoktu: masaüstünde vendor sıfırlaması
   bağlantıyı düz metne çeviriyor, mobilde tarayıcı mavisi kalıyordu. */
.bs-blk__aciklama a,
.bs-blk__kart-metin a,
.bs-blk__adim-metin a,
.bs-blk__kutu-govde a,
.bs-blk__sss-cevap a,
.bs-blk__kolon--metin a:not(.bs-blk__btn) {
    color: var(--bs-navy, #143d59);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.bs-blk__aciklama a:hover,
.bs-blk__kart-metin a:hover,
.bs-blk__adim-metin a:hover,
.bs-blk__kutu-govde a:hover,
.bs-blk__sss-cevap a:hover,
.bs-blk__kolon--metin a:not(.bs-blk__btn):hover { color: var(--bs-gold-700, #8f5f00); }

.bs-blk__kart {
    padding: 24px;
    border-radius: var(--bs-r, 12px);
    background: var(--bs-surface, #fff);
    transition: var(--bs-t, .18s ease);
    /* Izgara öğesinin varsayılan min-width:auto'su bölünmeyen uzun bir metinde
       (e-posta adresi) kartı sütundan dışarı itiyordu. */
    min-width: 0;
    overflow-wrap: anywhere;
}
.bs-blk--kart-izgarasi.is-cerceve .bs-blk__kart { border: 1px solid var(--bs-line, #e6ebf1); }
.bs-blk--kart-izgarasi.is-dolgu   .bs-blk__kart { background: var(--bs-navy-050, #eef3f8); }
.bs-blk--kart-izgarasi.is-sade    .bs-blk__kart { padding: 4px 0 0; background: none; }

.bs-blk--kart-izgarasi.is-cerceve .bs-blk__kart:hover,
.bs-blk--kart-izgarasi.is-dolgu   .bs-blk__kart:hover {
    box-shadow: var(--bs-sh-2, 0 12px 32px rgba(16,34,56,.06));
    transform: translateY(-2px);
}

.bs-blk__kart-ikon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-bottom: 14px;
    border-radius: var(--bs-r-sm, 8px);
    background: var(--bs-gold-050, #fef7e6);
    color: var(--bs-gold-600, #d99c0a);
}
.bs-blk__kart-ikon svg { width: 22px; height: 22px; }

.bs-blk__kart-baslik {
    margin: 0 0 8px;
    font-size: 17px;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
.bs-blk__kart-metin p:last-child { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   4) Değerler listesi
   -------------------------------------------------------------------------- */
.bs-blk__degerler {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 14px 28px;
}
.bs-blk--deger-listesi.is-sutun-1 .bs-blk__degerler { grid-template-columns: 1fr; }
.bs-blk--deger-listesi.is-sutun-2 .bs-blk__degerler { grid-template-columns: repeat(2, 1fr); }
.bs-blk--deger-listesi.is-sutun-3 .bs-blk__degerler { grid-template-columns: repeat(3, 1fr); }

.bs-blk__deger {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: var(--bs-r-sm, 8px);
    background: var(--bs-surface-alt, #fafbfd);
    border: 1px solid var(--bs-line-soft, #f0f3f7);
}
.bs-blk__deger-ikon {
    display: inline-flex;
    flex: 0 0 auto;
    margin-top: 2px;
    color: var(--bs-ok, #16a34a);
}
.bs-blk__deger-govde { display: block; min-width: 0; }
.bs-blk__deger-metin {
    display: block;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
.bs-blk__deger-aciklama {
    display: block;
    margin-top: 2px;
    font-size: 13.5px;
    color: var(--bs-muted, #8595a5);
}

/* --------------------------------------------------------------------------
   5) Sayı şeridi
   -------------------------------------------------------------------------- */
.bs-blk__sayilar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 4px;
    border-radius: var(--bs-r-lg, 16px);
    overflow: hidden;
}
.bs-blk__sayi {
    padding: 26px 20px;
    text-align: center;
}
.bs-blk__sayi-deger {
    display: block;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.01em;
}
.bs-blk__sayi-birim { font-size: 20px; margin-left: 2px; }
.bs-blk__sayi-etiket {
    display: block;
    margin-top: 6px;
    font-size: 13px;
}

.bs-blk--sayi-seridi.is-koyu .bs-blk__sayilar { background: var(--bs-navy, #143d59); gap: 1px; }
.bs-blk--sayi-seridi.is-koyu .bs-blk__sayi { background: var(--bs-navy, #143d59); }
.bs-blk--sayi-seridi.is-koyu .bs-blk__sayi-deger { color: var(--bs-gold, #f4b41a); }
.bs-blk--sayi-seridi.is-koyu .bs-blk__sayi-etiket { color: rgba(255, 255, 255, .78); }

.bs-blk--sayi-seridi.is-acik .bs-blk__sayilar { background: var(--bs-navy-050, #eef3f8); gap: 1px; }
.bs-blk--sayi-seridi.is-acik .bs-blk__sayi { background: var(--bs-navy-050, #eef3f8); }
.bs-blk--sayi-seridi.is-acik .bs-blk__sayi-deger { color: var(--bs-navy, #143d59); }
.bs-blk--sayi-seridi.is-acik .bs-blk__sayi-etiket { color: var(--bs-body, #4a5a6a); }

.bs-blk--sayi-seridi.is-kart .bs-blk__sayilar { gap: 16px; background: none; overflow: visible; }
.bs-blk--sayi-seridi.is-kart .bs-blk__sayi {
    background: var(--bs-surface, #fff);
    border: 1px solid var(--bs-line, #e6ebf1);
    border-radius: var(--bs-r, 12px);
}
.bs-blk--sayi-seridi.is-kart .bs-blk__sayi-deger { color: var(--bs-navy, #143d59); }
.bs-blk--sayi-seridi.is-kart .bs-blk__sayi-etiket { color: var(--bs-muted, #8595a5); }

/* --------------------------------------------------------------------------
   6) Zaman çizelgesi
   -------------------------------------------------------------------------- */
.bs-blk__cizelge {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Dikey */
.bs-blk--zaman-cizelgesi.is-dikey .bs-blk__cizelge { position: relative; padding-left: 30px; }
.bs-blk--zaman-cizelgesi.is-dikey .bs-blk__cizelge::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background: var(--bs-line, #e6ebf1);
}
.bs-blk--zaman-cizelgesi.is-dikey .bs-blk__adim { position: relative; padding-bottom: 26px; }
.bs-blk--zaman-cizelgesi.is-dikey .bs-blk__adim:last-child { padding-bottom: 0; }
.bs-blk--zaman-cizelgesi.is-dikey .bs-blk__adim-nokta {
    position: absolute;
    left: -30px;
    top: 5px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--bs-gold, #f4b41a);
}

/* Yatay */
.bs-blk--zaman-cizelgesi.is-yatay .bs-blk__cizelge {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 20px;
}
.bs-blk--zaman-cizelgesi.is-yatay .bs-blk__adim {
    padding: 20px;
    border-radius: var(--bs-r, 12px);
    border: 1px solid var(--bs-line, #e6ebf1);
    background: var(--bs-surface, #fff);
}
.bs-blk--zaman-cizelgesi.is-yatay .bs-blk__adim-nokta { display: none; }

.bs-blk__adim-isaret {
    display: inline-block;
    margin-bottom: 6px;
    padding: 3px 10px;
    border-radius: var(--bs-r-pill, 999px);
    background: var(--bs-navy-050, #eef3f8);
    color: var(--bs-navy, #143d59);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
}
.bs-blk__adim-baslik {
    margin: 0 0 6px;
    font-size: 16.5px;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
.bs-blk__adim-metin p:last-child { margin-bottom: 0; }
.bs-blk__adim-figur { margin: 12px 0 0; }
.bs-blk__adim-gorsel {
    display: block;
    max-width: 280px;
    width: 100%;
    height: auto;
    border-radius: var(--bs-r-sm, 8px);
}

/* --------------------------------------------------------------------------
   7) Görsel galeri
   -------------------------------------------------------------------------- */
.bs-blk__galeri { display: grid; gap: 14px; }
.bs-blk--galeri.is-sutun-2 .bs-blk__galeri { grid-template-columns: repeat(2, 1fr); }
.bs-blk--galeri.is-sutun-3 .bs-blk__galeri { grid-template-columns: repeat(3, 1fr); }
.bs-blk--galeri.is-sutun-4 .bs-blk__galeri { grid-template-columns: repeat(4, 1fr); }
.bs-blk--galeri.is-sutun-5 .bs-blk__galeri { grid-template-columns: repeat(5, 1fr); }

.bs-blk__galeri-kalem {
    margin: 0;
    border-radius: var(--bs-r, 12px);
    overflow: hidden;
    background: var(--bs-surface-alt, #fafbfd);
    border: 1px solid var(--bs-line-soft, #f0f3f7);
}
.bs-blk__galeri-bag { display: block; position: relative; }
.bs-blk__galeri-bag::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(20, 61, 89, .18);
    opacity: 0;
    transition: var(--bs-t, .18s ease);
}
.bs-blk__galeri-bag:hover::after { opacity: 1; }

.bs-blk__galeri-img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform .3s ease;
}
.bs-blk__galeri-kalem:hover .bs-blk__galeri-img { transform: scale(1.03); }

.bs-blk--galeri.is-oran-kare    .bs-blk__galeri-img { aspect-ratio: 1 / 1; }
.bs-blk--galeri.is-oran-manzara .bs-blk__galeri-img { aspect-ratio: 4 / 3; }
.bs-blk--galeri.is-oran-genis   .bs-blk__galeri-img { aspect-ratio: 16 / 9; }

.bs-blk__galeri-baslik {
    display: block;
    padding: 9px 12px;
    font-size: 13px;
    color: var(--bs-body, #4a5a6a);
    background: var(--bs-surface, #fff);
}

/* Büyüteç katmanı (JS ile açılır) */
.bs-buyutec {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(10, 24, 36, .9);
}
.bs-buyutec[hidden] { display: none; }
.bs-buyutec__resim {
    max-width: 100%;
    max-height: 84vh;
    border-radius: var(--bs-r, 12px);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
.bs-buyutec__baslik {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 22px;
    text-align: center;
    color: #fff;
    font-size: 14px;
}
.bs-buyutec__kapat,
.bs-buyutec__gez {
    position: absolute;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    border: 0;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.bs-buyutec__kapat { top: 18px; right: 18px; }
.bs-buyutec__gez--onceki { left: 18px; top: 50%; transform: translateY(-50%); }
.bs-buyutec__gez--sonraki { right: 18px; top: 50%; transform: translateY(-50%); }
.bs-buyutec__kapat:hover,
.bs-buyutec__gez:hover { background: rgba(255, 255, 255, .24); }

/* --------------------------------------------------------------------------
   8) Video
   -------------------------------------------------------------------------- */
.bs-blk__video-cerceve {
    position: relative;
    aspect-ratio: 16 / 9;
    border-radius: var(--bs-r, 12px);
    overflow: hidden;
    background: var(--bs-navy-700, #0f2f45);
}
.bs-blk__video-cerceve iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.bs-blk__video-tetik {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}
.bs-blk__video-kapak {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bs-blk__video-play {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: var(--bs-gold, #f4b41a);
    color: var(--bs-navy, #143d59);
    transition: var(--bs-t, .18s ease);
}
.bs-blk__video-play svg { width: 26px; height: 26px; margin-left: 3px; fill: currentColor; }
.bs-blk__video-tetik:hover .bs-blk__video-play { transform: translate(-50%, -50%) scale(1.07); }

/* --------------------------------------------------------------------------
   9) Sertifika / rozet ızgarası
   -------------------------------------------------------------------------- */
.bs-blk__rozetler { display: grid; gap: 16px; }
.bs-blk--sertifikalar.is-sutun-3 .bs-blk__rozetler { grid-template-columns: repeat(3, 1fr); }
.bs-blk--sertifikalar.is-sutun-4 .bs-blk__rozetler { grid-template-columns: repeat(4, 1fr); }
.bs-blk--sertifikalar.is-sutun-5 .bs-blk__rozetler { grid-template-columns: repeat(5, 1fr); }
.bs-blk--sertifikalar.is-sutun-6 .bs-blk__rozetler { grid-template-columns: repeat(6, 1fr); }

.bs-blk__rozet {
    margin: 0;
    padding: 20px 14px;
    text-align: center;
    border: 1px solid var(--bs-line, #e6ebf1);
    border-radius: var(--bs-r, 12px);
    background: var(--bs-surface, #fff);
}
.bs-blk__rozet-kutu {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    margin-bottom: 12px;
    color: var(--bs-gold-600, #d99c0a);
}
.bs-blk__rozet-kutu svg { width: 34px; height: 34px; }
.bs-blk__rozet-logo { max-height: 60px; width: auto; max-width: 100%; object-fit: contain; }
.bs-blk__rozet-ad {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
.bs-blk__rozet-kurum {
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    color: var(--bs-muted, #8595a5);
}

/* --------------------------------------------------------------------------
   10) Sıkça sorulan sorular
   -------------------------------------------------------------------------- */
.bs-blk__sss {
    border: 1px solid var(--bs-line, #e6ebf1);
    border-radius: var(--bs-r, 12px);
    overflow: hidden;
}
.bs-blk__sss-kalem + .bs-blk__sss-kalem { border-top: 1px solid var(--bs-line, #e6ebf1); }

.bs-blk__sss-soru {
    position: relative;
    list-style: none;
    padding: 16px 48px 16px 20px;
    cursor: pointer;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
    background: var(--bs-surface, #fff);
    transition: var(--bs-t, .18s ease);
}
.bs-blk__sss-soru::-webkit-details-marker { display: none; }
.bs-blk__sss-soru:hover { background: var(--bs-surface-alt, #fafbfd); }

.bs-blk__sss-soru::after {
    content: "";
    position: absolute;
    right: 22px;
    top: 50%;
    width: 9px;
    height: 9px;
    margin-top: -6px;
    border-right: 2px solid var(--bs-muted, #8595a5);
    border-bottom: 2px solid var(--bs-muted, #8595a5);
    transform: rotate(45deg);
    transition: transform .2s ease;
}
.bs-blk__sss-kalem[open] > .bs-blk__sss-soru::after { transform: rotate(-135deg); margin-top: -2px; }
.bs-blk__sss-kalem[open] > .bs-blk__sss-soru { background: var(--bs-navy-050, #eef3f8); }

.bs-blk__sss-cevap { padding: 4px 20px 18px; }
.bs-blk__sss-cevap p:last-child { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   11) Bilgi kutusu
   -------------------------------------------------------------------------- */
.bs-blk__kutu {
    display: flex;
    gap: 14px;
    margin: 0;
    padding: 18px 20px;
    border-radius: var(--bs-r, 12px);
    border-left: 4px solid var(--bs-navy, #143d59);
    background: var(--bs-navy-050, #eef3f8);
}
.bs-blk__kutu-ikon { flex: 0 0 auto; margin-top: 2px; color: var(--bs-navy, #143d59); }
.bs-blk__kutu-govde { min-width: 0; }
.bs-blk__kutu-baslik {
    margin: 0 0 4px;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
.bs-blk__kutu-govde p:last-child { margin-bottom: 0; }
.bs-blk__kutu-kaynak {
    margin-top: 8px;
    font-size: 13px;
    color: var(--bs-muted, #8595a5);
}

.bs-blk--bilgi-kutusu.is-onay  .bs-blk__kutu { background: var(--bs-ok-050, #e8f7ee); border-left-color: var(--bs-ok, #16a34a); }
.bs-blk--bilgi-kutusu.is-onay  .bs-blk__kutu-ikon { color: var(--bs-ok, #16a34a); }
.bs-blk--bilgi-kutusu.is-uyari .bs-blk__kutu { background: var(--bs-gold-050, #fef7e6); border-left-color: var(--bs-warn, #d97706); }
.bs-blk--bilgi-kutusu.is-uyari .bs-blk__kutu-ikon { color: var(--bs-warn, #d97706); }
.bs-blk--bilgi-kutusu.is-alinti .bs-blk__kutu {
    background: var(--bs-surface-alt, #fafbfd);
    border-left-color: var(--bs-gold, #f4b41a);
    font-size: 16.5px;
    font-style: italic;
}
.bs-blk--bilgi-kutusu.is-alinti .bs-blk__kutu-ikon { color: var(--bs-gold, #f4b41a); }

/* --------------------------------------------------------------------------
   12) Harekete geçirme bandı
   -------------------------------------------------------------------------- */
.bs-blk__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 30px 32px;
    border-radius: var(--bs-r-lg, 16px);
}
.bs-blk__cta-metin { min-width: 0; }
.bs-blk__cta .bs-blk__baslik { margin-bottom: 6px; }
.bs-blk__cta .bs-blk__aciklama { margin-bottom: 0; }
.bs-blk__cta-butonlar { flex: 0 0 auto; }
.bs-blk__cta-butonlar .bs-blk__btn { margin-top: 0; }

.bs-blk--cta.is-koyu .bs-blk__cta { background: var(--bs-navy, #143d59); }
.bs-blk--cta.is-koyu .bs-blk__baslik { color: #fff; }
.bs-blk--cta.is-koyu .bs-blk__aciklama { color: rgba(255, 255, 255, .78); }
.bs-blk--cta.is-koyu .bs-blk__btn--birincil { background: var(--bs-gold, #f4b41a); color: var(--bs-navy, #143d59); }
.bs-blk--cta.is-koyu .bs-blk__btn--birincil:hover { background: var(--bs-gold-600, #d99c0a); }
.bs-blk--cta.is-koyu .bs-blk__btn--ikincil { color: #fff; border-color: rgba(255, 255, 255, .4); }
.bs-blk--cta.is-koyu .bs-blk__btn--ikincil:hover { border-color: #fff; color: #fff; }

.bs-blk--cta.is-acik .bs-blk__cta {
    background: var(--bs-navy-050, #eef3f8);
    border: 1px solid var(--bs-line, #e6ebf1);
}

/* --------------------------------------------------------------------------
   13) Daraltma — tablet ve telefon
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .bs-blk--kart-izgarasi.is-sutun-3 .bs-blk__izgara,
    .bs-blk--kart-izgarasi.is-sutun-4 .bs-blk__izgara { grid-template-columns: repeat(2, 1fr); }
    .bs-blk--galeri.is-sutun-4 .bs-blk__galeri,
    .bs-blk--galeri.is-sutun-5 .bs-blk__galeri { grid-template-columns: repeat(3, 1fr); }
    .bs-blk--sertifikalar.is-sutun-5 .bs-blk__rozetler,
    .bs-blk--sertifikalar.is-sutun-6 .bs-blk__rozetler { grid-template-columns: repeat(4, 1fr); }
    .bs-blk--deger-listesi.is-sutun-3 .bs-blk__degerler { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
    .bs-blk { margin-bottom: 30px; font-size: 14.5px; }
    .bs-blk__baslik { font-size: 20px; }
    h3.bs-blk__baslik { font-size: 17px; }

    .bs-blk__ikili,
    .bs-blk--metin-gorsel.is-oran-dar .bs-blk__ikili,
    .bs-blk--metin-gorsel.is-oran-genis .bs-blk__ikili { grid-template-columns: 1fr; gap: 20px; }
    /* Mobilde görsel her zaman metnin ALTINDA — üstte olsaydı ekranın ilk
       yarısını kaplayıp anlatıyı katlamanın altına itiyordu. */
    .bs-blk--metin-gorsel.is-sol .bs-blk__kolon--gorsel { order: 0; }

    .bs-blk--kart-izgarasi.is-sutun-2 .bs-blk__izgara,
    .bs-blk--kart-izgarasi.is-sutun-3 .bs-blk__izgara,
    .bs-blk--kart-izgarasi.is-sutun-4 .bs-blk__izgara { grid-template-columns: 1fr; }

    .bs-blk--deger-listesi.is-sutun-2 .bs-blk__degerler,
    .bs-blk--deger-listesi.is-sutun-3 .bs-blk__degerler { grid-template-columns: 1fr; }

    .bs-blk--galeri.is-sutun-3 .bs-blk__galeri,
    .bs-blk--galeri.is-sutun-4 .bs-blk__galeri,
    .bs-blk--galeri.is-sutun-5 .bs-blk__galeri { grid-template-columns: repeat(2, 1fr); }

    .bs-blk--sertifikalar.is-sutun-3 .bs-blk__rozetler,
    .bs-blk--sertifikalar.is-sutun-4 .bs-blk__rozetler,
    .bs-blk--sertifikalar.is-sutun-5 .bs-blk__rozetler,
    .bs-blk--sertifikalar.is-sutun-6 .bs-blk__rozetler { grid-template-columns: repeat(2, 1fr); }

    .bs-blk__sayi { padding: 20px 14px; }
    .bs-blk__sayi-deger { font-size: 25px; }

    .bs-blk__cta { flex-direction: column; align-items: flex-start; padding: 24px; }
    .bs-blk__cta-butonlar .bs-blk__btn { margin-top: 4px; }

    .bs-buyutec__gez { display: none; } /* telefonda kaydırma yerine kapat + geri */
}

/* --------------------------------------------------------------------------
   14) Mobil kabuk — marka gezinme şeridi (mobile-theme/parts/brand-nav.php)
   -------------------------------------------------------------------------- */
.bs-brand-nav {
    background: var(--bs-surface, #fff);
    border-bottom: 1px solid var(--bs-line, #e6ebf1);
}
.bs-brand-nav__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px 10px;
    text-decoration: none;
}
.bs-brand-nav__logo {
    width: 38px;
    height: 38px;
    object-fit: contain;
    border-radius: var(--bs-r-sm, 8px);
    border: 1px solid var(--bs-line, #e6ebf1);
    background: #fff;
    padding: 3px;
}
.bs-brand-nav__name {
    font-size: 15px;
    font-weight: 600;
    color: var(--bs-ink, #14263a);
}
.bs-brand-nav__tabs {
    display: flex;
    gap: 8px;
    padding: 0 16px 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.bs-brand-nav__tabs::-webkit-scrollbar { display: none; }
.bs-brand-nav__tab {
    flex: 0 0 auto;
    padding: 7px 14px;
    border-radius: var(--bs-r-pill, 999px);
    border: 1px solid var(--bs-line, #e6ebf1);
    background: var(--bs-surface-alt, #fafbfd);
    color: var(--bs-body, #4a5a6a);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}
.bs-brand-nav__tab.is-active {
    background: var(--bs-navy, #143d59);
    border-color: var(--bs-navy, #143d59);
    color: #fff;
}
