/* ==========================================================================
   BARIŞ YAZILIM VE BİLİŞİM TEKNOLOJİLERİ — BETA 2 KATMANI
   --------------------------------------------------------------------------
   baris.css + baris-responsive.css ÜZERİNE yüklenir; hiçbirini silmez.
   Design token'ları baris.css :root bloğundan devralır.

   İÇİNDEKİLER
   B0. Yardımcılar (yazı markası, kırmızı nabız, zorla-kapalı durum)
   B1. Mega menü — masaüstü (>=1180)
   B2. Mega menü — çekmece / akordeon (<=1179)
   B3. Kampanya şeridi (ana sayfa) + kampanya kartları
   B4. Ana sayfa Beta 2 bölümleri (yollar, iş ortağı şeridi, çözüm alanları,
       özel yazılım, bilgi merkezi vitrini, iş ortağı rayı kademeleri)
   B5. İçerik kartları (Bilgi Merkezi / Haberler) + detay
   B6. Giriş (statik portal karşılama)
   B7. Belgeler — dürüst boş durum
   B8. Erişilebilirlik & hareket tercihi
   ========================================================================== */


/* ==========================================================================
   B0. YARDIMCILAR
   ========================================================================== */

/* Orijinal logosu henüz sağlanmamış iş ortakları için NÖTR yazı markası.
   Uydurma logo çizilmez; marka adı tipografik olarak basılır. */
.b-wordmark {
    display: inline-block;
    font-weight: 600;
    letter-spacing: .04em;
    color: rgba(255, 255, 255, .88);
    white-space: nowrap;
}

/* Ölçülü kırmızı nabız — kampanya işaretleyicisi (§13, §24).
   Yanıp sönme yok; sakin bir nefes ve dışa açılan yumuşak bir halo.

   İki katman ayrı çalışır:
     • Nokta   → opacity + scale ile çok hafif nefes alır
     • Halo    → ::after üzerinde merkezden dışa büyüyüp tamamen kaybolur

   Halo mutlak konumlu bir sözde öğedir; nokta ise yalnızca transform ile
   ölçeklenir. İkisi de akışa dokunmaz, dolayısıyla metin, kampanya kutusu
   ve şerit yüksekliği hiç oynamaz (layout shift yok).

   Önceki sürüm 2.8 sn'de yalnızca box-shadow halkası çiziyordu; nokta
   sabitti. Bu kural onun yerini alır, eski b2-pulse keyframe'i kaldırıldı. */
.b-campaign-strip__pulse {
    position: relative;
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--baris-red);
    flex: none;
    animation: b2-dot-breathe 2s var(--ease-inout) infinite;
}

.b-campaign-strip__pulse::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: rgba(var(--baris-red-rgb), .38);
    transform: translate(-50%, -50%) scale(1);
    pointer-events: none;
    animation: b2-dot-halo 2s var(--ease-inout) infinite;
}

/* 50%'de opacity .8 / scale .9 — istenen .75–.85 ve .88–.92 aralıklarında. */
@keyframes b2-dot-breathe {
    0%, 100% { opacity: 1;  transform: scale(1); }
    50%      { opacity: .8; transform: scale(.9); }
}

/* Halo 2.4 kata kadar açılır ve tamamen söner; döngünün son çeyreği
   sessiz kalır, böylece etki "atış" değil "nefes" gibi okunur. */
@keyframes b2-dot-halo {
    0%   { opacity: .45; transform: translate(-50%, -50%) scale(1); }
    70%  { opacity: 0;   transform: translate(-50%, -50%) scale(2.4); }
    100% { opacity: 0;   transform: translate(-50%, -50%) scale(2.4); }
}

/* Escape / dış tıklama sonrası geçici kapatma (js/baris-beta2.js).
   Kullanıcı menüye yeniden girince sınıf kaldırılır. */
.baris-nav .inner-nav > ul > li.is-force-closed .mn-sub {
    display: none !important;
}


/* ==========================================================================
   B1. MEGA MENÜ — MASAÜSTÜ
   Koyu premium panel; başlıkla aynı mimari dil. Şablonun .mn-sub
   aç/kapa sistemi korunur, yalnızca görsel katman ve iç düzen yenidir.
   ========================================================================== */

@media (min-width: 1180px) {

    /* --- KÖK DÜZELTME: PANELİN KONUMLANDIRMA BAĞLAMI -----------------------
       Sorun: şablonun `.inner-nav { position: relative; float: right }` kuralı
       nedeniyle panelin offsetParent'ı NAV LİSTESİ oluyordu. `left/right: 0`
       bu yüzden konteynerin değil, menü öğelerinin kutusuna hizalanıyor;
       panel sağa yapışık ve nav genişliğine bağımlı hâle geliyordu (nav
       genişliği akışkan tipografiyle değiştiği için sayfadan sayfaya /
       genişlikten genişliğe FARKLI geometri).

       Çözüm: masaüstünde HEM host li HEM `.inner-nav` static yapılır; böylece
       tek güvenilir bağlam `.baris-nav .full-wrapper` (position: relative)
       olur. Panel oradan viewport'a göre ortalanır ve genişliği viewport'la
       sınırlanır. Tetikleyici yalnızca AÇ/KAPA durumunu belirler; GEOMETRİYİ
       BELİRLEMEZ. Mobil/tablet (<1180) bu bloğun dışındadır — şablonun
       `.mobile-on .desktop-nav { position: absolute }` çekmecesi korunur. */
    .baris-nav .inner-nav > ul > li.baris-nav__megaHost { position: static; }
    .baris-nav .inner-nav.desktop-nav { position: static; }
    .baris-nav .full-wrapper { position: relative; }

    /* Arka plan geri çekilir (§15): sayfa üzerine ölçülü karartma.
       pointer-events:none ŞART — yoksa perde li:hover alanını büyütür ve
       menü hiç kapanmaz. z-index:-1: nav bağlamında panelin arkasında,
       sayfa içeriğinin önünde. */
    .baris-nav .inner-nav > ul > li.baris-nav__megaHost:hover::before,
    .baris-nav .inner-nav > ul > li.baris-nav__megaHost:focus-within::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: -1;
        background: rgba(0, 0, 0, .45);
        pointer-events: none;
    }

    .baris-nav .inner-nav > ul > li.baris-nav__megaHost.is-force-closed::before { content: none; }

    .baris-nav .inner-nav ul li .mn-sub.mn-mega {
        position: absolute;
        top: 100%;
        /* Viewport'a göre ortalı; asla ekrandan taşmaz. Şablonun
           `.mn-sub { width: 200px; left: 0 }` ve `:last-child { right: 0 }`
           kuralları burada tamamen geçersiz kılınır. */
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: min(1180px, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
        min-width: 0;
        margin: 0;
        padding: 0;
        /* Panel TAM OPAK: %98,5'lik yarı saydamlıkta hero'nun dev beyaz
           başlığı panelin altından hayalet gibi okunuyordu (menü açıkken
           sayfa içeriğiyle görsel çakışma). Bu opaklıkta backdrop-filter
           zaten hiçbir şey göstermediği için kaldırıldı — gereksiz stacking
           context ve boyama maliyeti de böylece ortadan kalkar. */
        background: #131313;
        border: 0;
        border-top: 1px solid rgba(255, 255, 255, .08);
        border-bottom: 1px solid rgba(255, 255, 255, .10);
        border-radius: 0;
        box-shadow: 0 48px 80px -32px rgba(0, 0, 0, .6);
        /* §14: menü ikinci bir sayfa gibi durmaz; içerik kadar, en çok ~62vh */
        max-height: min(62vh, calc(100vh - var(--nav-h)));
        overflow: auto;
    }

    .mn-mega .mn-mega__cell { list-style: none; }

    /* §13: sağ kampanya kolonu kaldırıldı — tek kolon, altta kompakt şerit */
    .mn-mega__inner {
        display: block;
        padding: 0 clamp(1.5rem, 2.5vw, 2.5rem);
        text-align: left;   /* şablonun ortalanmış nav metnini geri al */
    }

    /* --- Mod sekmeleri ---------------------------------------------------- */
    .mn-mega__modes {
        grid-area: modes;
        display: flex;
        gap: .25rem;
        padding: 1rem 0 .9rem;
        margin-bottom: 1.4rem;
        border-bottom: 1px solid rgba(255, 255, 255, .09);
    }

    .mn-mega__mode {
        appearance: none;
        border: 0;
        background: none;
        padding: .5rem .9rem;
        font-family: var(--font-sans);
        font-size: .8125rem;
        font-weight: 600;
        letter-spacing: .01em;
        color: rgba(255, 255, 255, .58);
        cursor: pointer;
        position: relative;
        transition: color var(--dur) var(--ease);
    }

    .mn-mega__mode::after {
        content: "";
        position: absolute;
        left: .9rem;
        right: .9rem;
        bottom: -0.95rem;
        height: 2px;
        background: var(--baris-red);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform var(--dur) var(--ease);
    }

    .mn-mega__mode:hover,
    .mn-mega__mode:focus-visible { color: #fff; }
    .mn-mega__mode.is-active { color: #fff; }
    .mn-mega__mode.is-active::after { transform: scaleX(1); }

    /* Masaüstünde akordeon oku gereksiz */
    .mn-mega__mode-chev { display: none; }

    .mn-mega__stage { grid-area: stage; min-width: 0; }
    .mn-mega__panel[hidden] { display: none !important; }

    /* --- Kolon düzeni: Kime Göre (3) ve İhtiyaca Göre (5) ------------------ */
    /* Kart yok; kolonlar ince dikey ayraçlarla zeminde yaşar (§10, §11). */
    .mega-cols {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: clamp(1.5rem, 2.5vw, 2.75rem);
        padding-bottom: 1.4rem;
    }

    .mega-cols--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

    .mega-col { min-width: 0; padding-left: clamp(1.25rem, 2vw, 2rem); border-left: 1px solid rgba(255, 255, 255, .07); }
    .mega-col:first-child { padding-left: 0; border-left: 0; }

    .mega-col__head {
        display: flex;
        align-items: center;
        gap: .55rem;
        margin: 0 0 .75rem;
    }

    .mega-col__head .b-icon {
        width: 18px;
        height: 18px;
        color: var(--baris-red-onDark);
        flex: none;
    }

    .mega-col__title {
        font-size: .703125rem;
        font-weight: 700;
        letter-spacing: var(--tracking-label);
        text-transform: uppercase;
        color: rgba(255, 255, 255, .85);
    }

    .mega-col__links {
        margin: 0 0 .8rem;
        padding: 0;
        list-style: none;
    }

    .mega-col__links a {
        display: block;
        padding: .32rem 0;
        font-size: .84375rem;
        font-weight: 500;
        color: rgba(255, 255, 255, .66);
        transition: color var(--dur) var(--ease), transform var(--dur) var(--ease);
    }

    .mega-col__links a:hover,
    .mega-col__links a:focus-visible {
        color: #fff;
        transform: translateX(3px);
        text-decoration: none;
    }

    .mega-col__cta {
        display: inline-flex;
        align-items: center;
        gap: .35rem;
        font-size: .78125rem;
        font-weight: 600;
        color: var(--baris-red-onDark);
        transition: color var(--dur) var(--ease), gap var(--dur) var(--ease);
    }

    .mega-col__cta:hover,
    .mega-col__cta:focus-visible { color: #fff; gap: .6rem; text-decoration: none; }

    /* Özel ihtiyaç satırı — farklı ama dev kart değil (§10) */
    .mega-ozel {
        display: flex;
        align-items: baseline;
        gap: 1rem;
        flex-wrap: wrap;
        padding: .9rem 0 0;
        border-top: 1px solid rgba(255, 255, 255, .08);
        transition: color var(--dur) var(--ease);
    }

    .mega-ozel__title {
        font-size: .875rem;
        font-weight: 700;
        color: #fff;
        letter-spacing: -.01em;
    }

    .mega-ozel__text {
        min-width: 0;
        font-size: .78125rem;
        color: rgba(255, 255, 255, .55);
    }

    .mega-ozel__cta {
        margin-left: auto;
        flex: none;
        font-size: .78125rem;
        font-weight: 600;
        color: var(--baris-red-onDark);
        transition: color var(--dur) var(--ease);
    }

    .mega-ozel:hover { text-decoration: none; }
    .mega-ozel:hover .mega-ozel__cta,
    .mega-ozel:focus-visible .mega-ozel__cta { color: #fff; }

    /* --- Markaya Göre: hiyerarşik satırlar, KART YOK (§12) ----------------- */
    .mega-brand__label {
        margin: 0 0 .9rem;
        font-size: .65625rem;
        font-weight: 600;
        letter-spacing: var(--tracking-label);
        text-transform: uppercase;
        color: rgba(255, 255, 255, .42);
    }

    .mega-brand {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .mega-brand__item {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: .55rem;
        padding: .25rem 1.25rem .25rem 0;
        transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
    }

    .mega-brand li + li .mega-brand__item {
        padding-left: 1.25rem;
        border-left: 1px solid rgba(255, 255, 255, .07);
    }

    .mega-brand__item:hover,
    .mega-brand__item:focus-visible { text-decoration: none; transform: translateY(-2px); }

    /* Logolar ORİJİNAL renklerinde; ölçek OPTİK ağırlığa göre (bkz. B4a). */
    .mega-brand__logo { display: flex; align-items: center; min-height: 34px; position: relative; }
    .mega-brand__logo img { width: auto; max-width: 160px; object-fit: contain; position: relative; z-index: 1; }

    /* §8 — Mikro'nun siyah yazı markası mega menünün koyu zemininde de
       okunmuyor. Plaka/kart/filtre yerine sınırsız, dağılan sıcak-nötr
       optik arka ışık; kenarları panele erir. */
    .mega-brand__logo:has(.brand-mark--mikro)::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 150%;
        height: 200%;
        background: radial-gradient(ellipse at center,
            rgba(248, 246, 242, .155) 0%,
            rgba(248, 246, 242, .09)  36%,
            rgba(248, 246, 242, .034) 58%,
            rgba(248, 246, 242, 0)    76%);
        filter: blur(9px);
        pointer-events: none;
        z-index: 0;
    }

    .mega-brand--primary { padding-bottom: 1.3rem; margin-bottom: 1.2rem; border-bottom: 1px solid rgba(255, 255, 255, .07); }

    /* Rol satırları hizalı kalsın: birincil logolar ortak dikey kutuda oturur */
    .mega-brand--primary .mega-brand__logo { min-height: 40px; }

    /* İkincil ve destek grupları yan yana iki blok (§12) */
    .mega-brand__row {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
        column-gap: clamp(1.5rem, 2.5vw, 2.75rem);
        padding-bottom: 1.4rem;
    }

    .mega-brand__row .mega-brand__group + .mega-brand__group {
        padding-left: clamp(1.25rem, 2vw, 2rem);
        border-left: 1px solid rgba(255, 255, 255, .07);
    }

    .mega-brand--secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mega-brand--tertiary  { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .mega-brand--secondary .mega-brand__logo { min-height: 26px; }
    .mega-brand--tertiary  .mega-brand__logo { min-height: 22px; }
    /* Düzeltme §3: opaklıkla hiyerarşi yok — ölçek yeterli */

    .mega-brand__role {
        font-size: .6875rem;
        color: rgba(255, 255, 255, .46);
    }

    .b-wordmark { font-size: .875rem; }

    /* --- Kampanya şeridi (§13): menünün altında, ~64–80px ------------------ */
    .mega-campaign {
        display: flex;
        align-items: center;
        gap: clamp(1rem, 2.5vw, 2.25rem);
        min-height: 64px;
        max-height: 80px;
        padding: .85rem 0;
        border-top: 1px solid rgba(255, 255, 255, .09);
        transition: background-color var(--dur) var(--ease);
    }

    .mega-campaign:hover,
    .mega-campaign:focus-visible {
        background: rgba(255, 255, 255, .025);
        text-decoration: none;
    }

    .mega-campaign__label {
        display: inline-flex;
        align-items: center;
        gap: .55rem;
        flex: none;
        font-size: .65625rem;
        font-weight: 700;
        letter-spacing: var(--tracking-label);
        text-transform: uppercase;
        color: var(--baris-red-onDark);
    }

    .mega-campaign__body {
        display: flex;
        align-items: baseline;
        gap: 1rem;
        min-width: 0;
    }

    .mega-campaign__title {
        font-size: .875rem;
        font-weight: 700;
        letter-spacing: -.01em;
        color: #fff;
        white-space: nowrap;
    }

    .mega-campaign__text {
        font-size: .78125rem;
        color: rgba(255, 255, 255, .55);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mega-campaign__cta {
        margin-left: auto;
        flex: none;
        font-size: .78125rem;
        font-weight: 600;
        color: var(--baris-red-onDark);
        transition: color var(--dur) var(--ease);
    }

    .mega-campaign:hover .mega-campaign__cta { color: #fff; }

    /* --- Özgüllük kalkanı ---------------------------------------------------
       Şablon (.inner-nav ul li .mn-sub li a) tüm mega bağlantılarına
       display:block + 11px/15px padding + #b0b0b0 !important uygular;
       ayrıca navigasyon ul/li'lerini FLOAT'lar (grid'i parçalar).
       Beta 2.1 kompozisyonu burada BİLİNÇLİ olarak geri kazanılır. */
    .baris-nav .inner-nav ul li .mn-mega ul,
    .baris-nav .inner-nav ul li .mn-mega li,
    .baris-nav .inner-nav ul li .mn-mega div {
        float: none;
    }
    .baris-nav .inner-nav ul li .mn-mega .mega-col__links a {
        display: block;
        width: auto;
        padding: .32rem 0;
        font-size: .84375rem;
        color: rgba(255, 255, 255, .66) !important;
        background: none;
    }

    .baris-nav .inner-nav ul li .mn-mega .mega-col__links a:hover,
    .baris-nav .inner-nav ul li .mn-mega .mega-col__links a:focus-visible {
        color: #fff !important;
        background: none;
        transform: translateX(3px);
    }

    .baris-nav .inner-nav ul li .mn-mega a.mega-col__cta {
        display: inline-flex;
        width: auto;
        padding: .15rem 0 0;
        font-size: .78125rem;
        color: var(--baris-red-onDark) !important;
        background: none;
    }

    .baris-nav .inner-nav ul li .mn-mega a.mega-col__cta:hover,
    .baris-nav .inner-nav ul li .mn-mega a.mega-col__cta:focus-visible {
        color: #fff !important;
        background: none;
    }

    .baris-nav .inner-nav ul li .mn-mega a.mega-ozel {
        display: flex;
        width: 100%;
        padding: .9rem 0 0;
        background: none;
    }

    .baris-nav .inner-nav ul li .mn-mega a.mega-ozel:hover { background: none; }

    .baris-nav .inner-nav ul li .mn-mega a.mega-brand__item {
        display: flex;
        width: auto;
        padding: .25rem 1.25rem .25rem 0;
        background: none;
    }

    .baris-nav .inner-nav ul li .mn-mega .mega-brand li + li a.mega-brand__item {
        padding-left: 1.25rem;
    }

    .baris-nav .inner-nav ul li .mn-mega a.mega-brand__item:hover { background: none; }

    .baris-nav .inner-nav ul li .mn-mega a.mega-campaign {
        display: flex;
        align-items: center;
        width: 100%;
        padding: .85rem 0;
        background: none;
    }

    .baris-nav .inner-nav ul li .mn-mega a.mega-campaign:hover,
    .baris-nav .inner-nav ul li .mn-mega a.mega-campaign:focus-visible {
        background: rgba(255, 255, 255, .025);
    }
}


/* ==========================================================================
   B2. MEGA MENÜ — ÇEKMECE / AKORDEON (<=1179) (§14)
   Masaüstü paneli küçültülmez; modlar akordeon başlığına dönüşür.
   Doğal yükseklikler; kaydırılabilir çekmece şablonda zaten var.
   ========================================================================== */

@media (max-width: 1179px) {

    .main-nav.baris-nav.mobile-on .desktop-nav ul li .mn-sub.mn-mega {
        background: rgba(255, 255, 255, .02);
    }

    .mn-mega__cell { list-style: none; }
    .mn-mega__inner { display: block; }
    .mn-mega__modes { display: block; }

    .mn-mega__mode {
        appearance: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: .85rem calc(var(--gutter) + 18px);
        border: 0;
        border-bottom: 1px solid var(--baris-line-dark-soft);
        background: none;
        font-family: var(--font-sans);
        font-size: .875rem;
        font-weight: 600;
        text-align: left;
        color: rgba(255, 255, 255, .78);
        cursor: pointer;
    }

    .mn-mega__mode.is-active { color: #fff; }

    .mn-mega__mode-chev {
        width: 14px;
        height: 14px;
        color: rgba(255, 255, 255, .5);
        transition: transform var(--dur) var(--ease);
    }

    .mn-mega__mode.is-active .mn-mega__mode-chev { transform: rotate(180deg); }

    .mn-mega__panel {
        padding: .5rem calc(var(--gutter) + 18px) 1rem;
        border-bottom: 1px solid var(--baris-line-dark-soft);
    }

    .mn-mega__panel[hidden] { display: none !important; }

    /* Akordeon iç düzeni (§16): tek kolon editoryal listeler; grid yok,
       kart duvarı yok, yatay kaydırma yok. Dokunma hedefleri >= 44px. */
    .mega-cols { display: block; }

    .mega-col { padding: .35rem 0 .7rem; }
    .mega-col + .mega-col { border-top: 1px solid var(--baris-line-dark-soft); padding-top: .8rem; }

    .mega-col__head { display: flex; align-items: center; gap: .55rem; margin: 0 0 .3rem; }
    .mega-col__head .b-icon { width: 16px; height: 16px; color: var(--baris-red-onDark); flex: none; }

    .mega-col__title {
        font-size: .6875rem;
        font-weight: 700;
        letter-spacing: var(--tracking-label);
        text-transform: uppercase;
        color: rgba(255, 255, 255, .8);
    }

    .mega-col__links { margin: 0; padding: 0; list-style: none; }

    .mega-col__links a {
        display: block;
        padding: .6rem 0;            /* >= 44px dokunma hedefi */
        font-size: .84375rem;
        color: rgba(255, 255, 255, .7);
    }

    .mega-col__cta {
        display: inline-block;
        padding: .55rem 0;
        font-size: .78125rem;
        font-weight: 600;
        color: var(--baris-red-onDark);
    }

    .mega-ozel {
        display: block;
        margin-top: .35rem;
        padding: .8rem 0 .3rem;
        border-top: 1px solid var(--baris-line-dark-soft);
    }

    .mega-ozel__title { display: block; font-size: .875rem; font-weight: 700; color: #fff; }
    .mega-ozel__text { display: block; margin: .2rem 0 .45rem; font-size: .75rem; color: rgba(255, 255, 255, .55); }
    .mega-ozel__cta { display: inline-block; padding: .35rem 0; font-size: .78125rem; font-weight: 600; color: var(--baris-red-onDark); }

    .mega-brand__label {
        margin: .6rem 0 .3rem;
        font-size: .65625rem;
        font-weight: 600;
        letter-spacing: var(--tracking-label);
        text-transform: uppercase;
        color: rgba(255, 255, 255, .42);
    }

    .mega-brand { display: block; margin: 0; padding: 0; list-style: none; }
    .mega-brand__row { display: block; }

    .mega-brand__item {
        display: flex;
        align-items: center;
        gap: .9rem;
        min-height: 44px;
        padding: .45rem 0;
    }

    /* Optik logo ölçüleri B4a bloğundan (marka bazlı) gelir. */
    .mega-brand__logo { display: flex; align-items: center; position: relative; }
    .mega-brand__logo img { width: auto; object-fit: contain; position: relative; z-index: 1; }

    /* §8 — Mikro okunurluk arka ışığı mobil çekmecede de geçerli */
    .mega-brand__logo:has(.brand-mark--mikro)::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 150%;
        height: 200%;
        background: radial-gradient(ellipse at center,
            rgba(248, 246, 242, .155) 0%,
            rgba(248, 246, 242, .09)  36%,
            rgba(248, 246, 242, .034) 58%,
            rgba(248, 246, 242, 0)    76%);
        filter: blur(9px);
        pointer-events: none;
        z-index: 0;
    }
    .mega-brand__role { font-size: .6875rem; color: rgba(255, 255, 255, .45); }
    .b-wordmark { font-size: .8125rem; }

    /* Kampanya — akordeonun sonunda kompakt satır (§16) */
    .mega-campaign {
        display: block;
        margin: .4rem calc(var(--gutter) + 18px) 1rem;
        padding: .8rem 0 .2rem;
        border-top: 1px solid var(--baris-line-dark-soft);
    }

    .mega-campaign__label {
        display: flex;
        align-items: center;
        gap: .5rem;
        margin: 0 0 .4rem;
        font-size: .625rem;
        font-weight: 700;
        letter-spacing: var(--tracking-label);
        text-transform: uppercase;
        color: var(--baris-red-onDark);
    }

    .mega-campaign__body { display: block; }
    .mega-campaign__title { display: block; margin: 0 0 .2rem; font-size: .875rem; font-weight: 700; color: #fff; }
    .mega-campaign__text { display: block; margin: 0 0 .45rem; font-size: .71875rem; color: rgba(255, 255, 255, .56); }
    .mega-campaign__cta { display: inline-block; padding: .3rem 0; font-size: .75rem; font-weight: 600; color: var(--baris-red-onDark); }

    /* --- Özgüllük kalkanı (mobil): şablonun .mn-sub li a blok kuralına karşı.
       Şablon iç içe ul'leri alt-menü uçuşu sanıp position/left verir;
       akordeon içinde ul'ler DÜZ liste olarak akar. */
    .main-nav.baris-nav .desktop-nav ul li .mn-mega ul,
    .main-nav.baris-nav .desktop-nav ul li .mn-mega li,
    .main-nav.baris-nav .desktop-nav ul li .mn-mega div {
        float: none;
    }

    .main-nav.baris-nav .desktop-nav ul li .mn-mega .mn-mega__panel ul {
        position: static;
        left: auto;
        right: auto;
        top: auto;
        width: auto;
        border: 0;
        background: none;
        box-shadow: none;
    }
    .main-nav.baris-nav .desktop-nav ul li .mn-mega .mega-col__links a {
        display: block;
        width: auto;
        padding: .6rem 0;
        font-size: .84375rem;
        color: rgba(255, 255, 255, .7) !important;
        background: none;
    }

    .main-nav.baris-nav .desktop-nav ul li .mn-mega a.mega-col__cta {
        display: inline-block;
        width: auto;
        padding: .55rem 0;
        font-size: .78125rem;
        white-space: nowrap;
        color: var(--baris-red-onDark) !important;
        background: none;
    }

    .main-nav.baris-nav .desktop-nav ul li .mn-mega a.mega-ozel {
        display: block;
        width: 100%;
        padding: .8rem 0 .3rem;
        background: none;
    }

    .main-nav.baris-nav .desktop-nav ul li .mn-mega a.mega-brand__item {
        display: flex;
        align-items: center;
        width: 100%;
        padding: .45rem 0;
        background: none;
    }

    .main-nav.baris-nav .desktop-nav ul li .mn-mega a.mega-campaign {
        display: block;
        width: auto;
        padding: .8rem 0 .2rem;
        background: none;
    }
}


/* ==========================================================================
   B3. KAMPANYA ŞERİDİ + KAMPANYA KARTLARI (§23, §24)
   Pahalı ve bilinçli görünmeli; ucuz reklam bandı değil.
   ========================================================================== */

.b-campaign-strip {
    background: var(--baris-graphite-2);
    border-top: 1px solid rgba(255, 255, 255, .06);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    position: relative;
}


/* İnce hareketli kırmızı aksan — üst kenarda, çok düşük yoğunlukta */
.b-campaign-strip::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--baris-red-rgb), .7), transparent);
    background-size: 220px 1px;
    background-repeat: no-repeat;
    animation: b2-accent-sweep 7s var(--ease-inout) infinite;
    pointer-events: none;
}

@keyframes b2-accent-sweep {
    0%   { background-position: -220px 0; }
    55%  { background-position: calc(100% + 220px) 0; }
    100% { background-position: calc(100% + 220px) 0; }
}

.b-campaign-strip__inner {
    display: flex;
    align-items: center;
    gap: clamp(1rem, 3vw, 2.5rem);
    padding: 1.05rem 0;
}

.b-campaign-strip__inner:hover,
.b-campaign-strip__inner:focus-visible { text-decoration: none; }

.b-campaign-strip__badge {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    flex: none;
    font-size: .65625rem;
    font-weight: 700;
    letter-spacing: var(--tracking-label);
    color: var(--baris-red-onDark);
}

.b-campaign-strip__body { min-width: 0; display: flex; align-items: baseline; gap: 1rem; }

.b-campaign-strip__title {
    font-size: .9375rem;
    font-weight: 700;
    letter-spacing: -.01em;
    color: #fff;
    white-space: nowrap;
}

.b-campaign-strip__text {
    font-size: .8125rem;
    color: rgba(255, 255, 255, .55);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.b-campaign-strip__cta {
    margin-left: auto;
    flex: none;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--baris-red-onDark);
    transition: color var(--dur) var(--ease);
}

.b-campaign-strip__inner:hover .b-campaign-strip__cta { color: #fff; }

@media (max-width: 767px) {
    .b-campaign-strip__inner { flex-wrap: wrap; gap: .5rem .9rem; padding: .95rem 0; }
    .b-campaign-strip__body { flex-direction: column; gap: .15rem; width: 100%; }
    .b-campaign-strip__title, .b-campaign-strip__text { white-space: normal; }
    .b-campaign-strip__cta { margin-left: 0; }
}

/* --- Kampanya kartı (kampanyalar.php) ------------------------------------ */
.b-campaign-card {
    /* b-grid 12 kolonludur; kart tam satır kaplar, yoksa kolonlara dağılıp
       üst üste binmiş gibi görünür (Beta 2 QA bulgusu). */
    grid-column: 1 / -1;
    max-width: 860px;
    padding: clamp(1.5rem, 3vw, 2.25rem);
    background: var(--baris-dark-raised);
    border: 1px solid rgba(255, 255, 255, .10);
    border-left: 3px solid var(--baris-red);
    border-radius: 2px;
    scroll-margin-top: calc(var(--nav-h) + 16px);
}

.b-campaign-card + .b-campaign-card { margin-top: 1.25rem; }

.b-campaign-card__label {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .8rem;
    font-size: .65625rem;
    font-weight: 700;
    letter-spacing: var(--tracking-label);
    text-transform: uppercase;
    color: var(--baris-red-onDark);
}

.b-campaign-card__title {
    margin: 0 0 .6rem;
    font-size: clamp(1.25rem, 2vw, 1.625rem);
    font-weight: 700;
    letter-spacing: -.02em;
    color: #fff;
}

.b-campaign-card__summary {
    margin: 0 0 .8rem;
    font-size: 1rem;
    font-weight: 500;
    color: rgba(255, 255, 255, .82);
}

.b-campaign-card__text {
    margin: 0 0 1.4rem;
    font-size: .875rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, .58);
    max-width: 68ch;
}


/* ==========================================================================
   B4. ANA SAYFA — BETA 2 BÖLÜMLERİ
   ========================================================================== */

/* --- Hero kampanya CTA'sı (Düzeltme §1) ------------------------------------
   İkinci hero butonu kampanyaya gider; ölçülü kırmızı nabız butonun içinde. */
.b-btn--campaign { white-space: nowrap; }
.b-btn--campaign .b-campaign-strip__pulse { margin-right: .35rem; }

/* --- Hızlı çözüm navigasyonu — hero rayı (Beta 2.1 · §3) -------------------
   Yapı li > a olduğu için baris.css'teki .hero-rail__item + .hero-rail__item
   ayraçları artık eşleşmez; ayraçlar burada li üzerinden yeniden kurulur.
   Kart yok, kutu yok: öğeler koyu zeminde ince dikey ayraçlarla yaşar. */

.hero-rail > li { min-width: 0; }

a.hero-rail__item {
    grid-template-columns: 26px minmax(0, 1fr) auto;
    height: 100%;
    position: relative;
    color: inherit;
    transition: color var(--dur) var(--ease);
}

/* Öğe altında ölçülü kırmızı ışık çizgisi (Düzeltme §2) — vitrin aydınlatması,
   neon değil. Metin kolonuyla hizalı, kısa ve düşük yoğunlukta. */
a.hero-rail__item::after {
    content: "";
    position: absolute;
    left: calc(26px + .9rem);
    bottom: .55rem;
    width: 40px;
    height: 2px;
    border-radius: 1px;
    background: linear-gradient(90deg, rgba(var(--baris-red-rgb), .55), rgba(var(--baris-red-rgb), 0));
    opacity: .45;
    transition: opacity var(--dur) var(--ease), width var(--dur) var(--ease);
    pointer-events: none;
}

a.hero-rail__item:hover::after,
a.hero-rail__item:focus-visible::after { opacity: .9; width: 58px; }

a.hero-rail__item:hover,
a.hero-rail__item:focus-visible { text-decoration: none; }

/* Tipografi: başlık birincil, marka satırı bilinçli sessiz */
.hero-rail__title { transition: color var(--dur) var(--ease); }

.hero-rail__text {
    font-size: .78125rem;
    color: rgba(255, 255, 255, .45);
}

a.hero-rail__item:hover .hero-rail__title,
a.hero-rail__item:focus-visible .hero-rail__title { color: var(--baris-red-onDark); }

.hero-rail__go {
    align-self: center;
    font-size: .875rem;
    color: rgba(255, 255, 255, .28);
    transition: color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

a.hero-rail__item:hover .hero-rail__go,
a.hero-rail__item:focus-visible .hero-rail__go {
    color: var(--baris-red-onDark);
    transform: translateX(3px);
}

/* Ayraçlar: >=900 tek satır 4 öğe; altında 2×2 */
@media (min-width: 900px) {
    .hero-rail > li + li a.hero-rail__item {
        border-left: 1px solid rgba(255, 255, 255, .065);
        padding-left: clamp(1.25rem, 2.4vw, 2.5rem);
    }
}

@media (max-width: 899px) {
    .hero-rail > li:nth-child(even) a.hero-rail__item {
        border-left: 1px solid rgba(255, 255, 255, .065);
        padding-left: 1rem;
    }
    .hero-rail > li:nth-child(n+3) a.hero-rail__item {
        border-top: 1px solid rgba(255, 255, 255, .09);
    }
}

@media (max-width: 767px) {
    /* baris.css eski blokta başlık/metin rollerini ters ölçekliyordu;
       Beta 2.1 hiyerarşisi: başlık birincil kalır, marka satırı sessiz. */
    .hero-rail__title { font-size: .71875rem; }
    .hero-rail__text  { font-size: .75rem; line-height: 1.4; color: rgba(255, 255, 255, .45); }
    .hero-rail__go { display: none; }   /* dokunmatikte ok gürültüsü olmasın */
}

/* --- 01 · İhtiyacınıza göre çözümler: üç giriş yolu (§27–§30) ------------- */
.paths {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 2.5rem 0 0;
    padding: 0;
    list-style: none;
}

.path-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: clamp(1.4rem, 2.4vw, 2rem);
    background: var(--baris-dark-raised);
    background-image: linear-gradient(150deg, rgba(255, 255, 255, .03), transparent 55%);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 2px;
    transition: border-color var(--dur) var(--ease),
                transform var(--dur) var(--ease);
}

.path-card:hover,
.path-card:focus-visible {
    border-color: rgba(var(--baris-red-rgb), .5);
    transform: translateY(-4px);
    text-decoration: none;
}

.path-card .b-icon { width: 26px; height: 26px; color: var(--baris-red-onDark); margin-bottom: 1.1rem; }

.path-card__title {
    margin: 0 0 .5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -.015em;
    color: #fff;
}

.path-card__text {
    margin: 0 0 1.1rem;
    font-size: .84375rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, .58);
}

/* Destekleyici adlar — logo duvarı DEĞİL, küçük metin izleri (§28) */
.path-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem .7rem;
    margin: auto 0 1.1rem;
    padding: 0;
    list-style: none;
}

.path-card__tags li {
    font-size: .671875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .38);
}

.path-card__cta {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--baris-red-onDark);
    transition: color var(--dur) var(--ease), gap var(--dur) var(--ease);
}

.path-card:hover .path-card__cta { color: #fff; gap: .65rem; }

/* Üçüncü yol: Barış'ın kendi geliştirme kimliği — hafif kırmızı zemin izi */
.path-card--custom {
    background-image: linear-gradient(150deg, rgba(var(--baris-red-rgb), .13), transparent 60%);
    border-color: rgba(var(--baris-red-rgb), .35);
}

/* ==========================================================================
   B4a. OPTİK LOGO NORMALİZASYONU (Beta 2.1 · §7, §28C)
   --------------------------------------------------------------------------
   Aynı CSS yüksekliği ≠ aynı görsel ağırlık. Her markanın taban yüksekliği
   kendi oran/iç-boşluk yapısına göre ayrı belirlenir; bağlamlar yalnızca
   bağlam kuralları marka bazlı AÇIK yükseklik verir. Oran bozulmaz, filtre uygulanmaz.

   Oranlar: zirve 1.60 · mikro 1.86 · dia 1.00 (kare) · bizmu 2.05
            netgsm 4.85 (geniş) · narbulut 5.06 (geniş) · parasut 3.21 · logo 2.74
   Geniş yazı-markaları (Netgsm, Narbulut) alan olarak değil GENİŞLİK olarak
   baskınlaşır; taban yükseklikleri bu yüzden düşük tutulur.
   ========================================================================== */

.brand-mark {
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

/* Birincil üçlü: yaklaşık eş optik ağırlık */
img.brand-mark--zirve    { height: 30px; }
img.brand-mark--mikro    { height: 29px; }
img.brand-mark--dia      { height: 38px; }   /* kare — alan için daha yüksek */
/* Bulut & iletişim: geniş yazı markaları genişlikle baskınlaşmasın */
img.brand-mark--netgsm   { height: 21px; }
img.brand-mark--narbulut { height: 20px; }
/* Diğer çözümler: okunur ama bilinçli ikincil */
img.brand-mark--bizmu    { height: 22px; }
img.brand-mark--parasut  { height: 19px; }
img.brand-mark--logo     { height: 17px; }

/* ==========================================================================
   BÖLÜM 01 · "ÇALIŞTIĞIMIZ ÇÖZÜMLER" — VİTRİN AYDINLATMASI (TEK UYGULAMA)
   --------------------------------------------------------------------------
   Metafor: logolar koyu mimari bir duvara monte edilmiştir. Ortam ışığı
   duvarı yıkar, altta ölçülü bir Barış-kırmızısı zemin yansıması vardır;
   ziyaretçi bir markanın üzerine geldiğinde yukarıdan yumuşak bir tavan
   spotu o logonun üzerine düşer, logo birkaç piksel yükselir ve zemindeki
   yansıma tepki verir.

   Katman düzeni (BAŞKA parlama sistemi YOKTUR — eski deneyler kaldırıldı):
     .b-partner-strip          → ortam duvar ışığı (background katmanları)
     .b-partner-strip__list::after → sürekli kırmızı zemin bandı
     .b-partner-strip__item a::before → tavan spotu (yalnız hover/odak)
     .b-partner-strip__item a::after  → logoya ait küçük kırmızı zemin yansıması
     .b-partner-strip__item::before   → YALNIZ Mikro: nötr okunurluk alanı

   Kurallar: plaka/kart/kenarlık YOK, filtre-invert-recolor YOK, logo
   opaklığı her zaman 1, hiyerarşi ölçekle kurulur.
   ========================================================================== */
.b-partner-strip {
    grid-column: 1 / -1;
    /* §12: dikey nefes ~%13 azaltıldı — ray "boş odada yüzen sıra" değil,
       bilinçli bir vitrin yerleşimi gibi dursun. */
    margin-top: 2.4rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, .08);
    position: relative;
    isolation: isolate;

    /* §1 — ORTAM: kullanıcı bir gradyan ŞEKLİ görmemeli; yalnızca duvarın
       aydınlatıldığını hissetmeli. Üstten hafif ışık + logo hizasında
       yumuşak nötr duvar yıkaması. */
    background:
        radial-gradient(ellipse 62% 78% at 48% 62%,
            rgba(248, 246, 242, .045) 0%,
            rgba(248, 246, 242, .018) 38%,
            rgba(248, 246, 242, 0)    68%),
        linear-gradient(180deg,
            rgba(255, 255, 255, .015) 0%,
            rgba(255, 255, 255, 0)    45%);
}

.b-partner-strip__label {
    margin: 0 0 1.1rem;
    font-size: .65625rem;
    font-weight: 600;
    letter-spacing: var(--tracking-label);
    text-transform: uppercase;
    color: rgba(255, 255, 255, .4);
}

.b-partner-strip__list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.2rem clamp(1.5rem, 3.2vw, 3rem);
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;          /* vitrin aydınlatma katmanlarının çerçevesi */
}

/* §2 — SÜREKLİ KIRMIZI ZEMİN IŞIĞI
   Gizli bir mimari LED şeridin yüzeyden yumuşakça yansıması gibi. Yatay,
   alçak, sert çizgisi yok; kenarları %6 içeriden başlar ve tamamen erir.
   Tek tek logoların yansımasından ÖNCE gelen ortak "raf" ışığıdır. */
.b-partner-strip__list::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
    left: 6%;
    right: 6%;
    bottom: -6px;
    height: 26px;
    background: radial-gradient(ellipse at 44% center,
        rgba(var(--baris-red-rgb), .18) 0%,
        rgba(var(--baris-red-rgb), .065) 45%,
        rgba(var(--baris-red-rgb), 0)    72%);
    filter: blur(8px);
}

/* Logolar aydınlatma katmanlarının ÖNÜNDE durur */
.b-partner-strip__item { position: relative; z-index: 1; }

/* §4 — MİKRO OKUNURLUK ALANI (yalnızca bu marka).
   Duvara düşen ışık gibi; arka plan KAPSAYICISI gibi değil. Elips kenarda
   tamamen kaybolur — gri/beyaz leke olmamalı. Ölçüm: Mikro'nun siyah yazı
   markası ray zemininde (rgb 36,33,31) 1.31:1 → okunmuyor. Diğer markalar
   2.46–4.89 arası; hiçbirine yerel nötr alan uygulanmaz. */
.b-partner-strip__item:has(.brand-mark--mikro)::before {
    content: "";
    position: absolute;
    left: 50%;
    top: calc(50% - 8px);
    width: 150%;
    height: 190%;
    transform: translate(-50%, -50%);
    background: radial-gradient(ellipse at center,
        rgba(248, 246, 242, .12)  0%,
        rgba(248, 246, 242, .055) 36%,
        rgba(248, 246, 242, 0)    72%);
    filter: blur(7px);
    pointer-events: none;
    z-index: 0;
}

/* Düzeltme §3: opaklıkla hiyerarşi YOK — tüm logolar tam okunur. */

/* --- BÖLÜM 01 · LOGO KATMANI: TAVAN SPOTU + ZEMİN YANSIMASI ---------------- */
.b-partner-strip__item a {
    --floor-o: .26;              /* logoya ait zemin yansıması — varsayılan */
    display: flex;
    align-items: center;
    position: relative;
    padding-bottom: 16px;
}

/* §3 — Birincil üçlü (Zirve · Mikrogrup · DİA) zeminde bir tık daha güçlü
   yansıtır; diğerleri sakin kalır. Hiyerarşi ışık + ölçekle, OPAKLIKLA DEĞİL. */
.b-partner-strip__item--t1 a { --floor-o: .40; }
.b-partner-strip__item--t2 a { --floor-o: .26; }
.b-partner-strip__item--t3 a { --floor-o: .22; }

/* §5 — TAVAN SPOTU. Görünür üçgen / sert koni YOKTUR: yukarıdan gelen
   yönlülüğü linear katman, logonun çevresindeki ışık havuzunu radial katman
   verir; blur ile her kenar erir. Yalnızca hover/odaklanan logoda açılır
   (§9) — komşular sakin kalır. */
.b-partner-strip__item a::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -44px;
    bottom: -4px;
    width: max(190%, 104px);
    transform: translateX(-50%);
    background:
        radial-gradient(ellipse 58% 46% at 50% 66%,
            rgba(248, 246, 242, .105) 0%,
            rgba(248, 246, 242, .042) 46%,
            rgba(248, 246, 242, 0)    76%),
        linear-gradient(180deg,
            rgba(248, 246, 242, 0)    0%,
            rgba(248, 246, 242, .022) 34%,
            rgba(248, 246, 242, .038) 70%,
            rgba(248, 246, 242, 0)    100%);
    filter: blur(11px);
    opacity: 0;
    transition: opacity 280ms cubic-bezier(.2, .7, .2, 1);
    pointer-events: none;
    z-index: 0;
}

.b-partner-strip__item a:hover::before,
.b-partner-strip__item a:focus-visible::before { opacity: 1; }

/* §3/§7 — Logoya ait kırmızı zemin yansıması: basık, kısa, logoya yakın.
   Hover'da hafifçe genişler, parlar ve merkezi biraz keskinleşir; ZEMİNDE
   kalır (logo yükselir, ışık kalır — vitrin derinliği buradan gelir). */
.b-partner-strip__item a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 3px;
    transform: translateX(-50%);
    width: 58%;
    min-width: 40px;
    max-width: 92px;
    height: 9px;
    background: radial-gradient(ellipse at center,
        rgba(var(--baris-red-rgb), .30) 0%,
        rgba(var(--baris-red-rgb), .12) 45%,
        rgba(var(--baris-red-rgb), 0)   75%);
    filter: blur(7px);
    opacity: var(--floor-o);
    transition: opacity 280ms cubic-bezier(.2, .7, .2, 1),
                width   280ms cubic-bezier(.2, .7, .2, 1);
    pointer-events: none;
    z-index: 0;
}

.b-partner-strip__item a:hover::after,
.b-partner-strip__item a:focus-visible::after {
    opacity: calc(var(--floor-o) * 1.3);
    width: 66%;
    background: radial-gradient(ellipse at center,
        rgba(var(--baris-red-rgb), .36) 0%,
        rgba(var(--baris-red-rgb), .13) 42%,
        rgba(var(--baris-red-rgb), 0)   75%);
    filter: blur(6px);
}

/* §6 — Logo hareketi: yükselir, ışık zeminde kalır. Yay/zıplama/döndürme yok. */
.b-partner-strip__item a .brand-mark,
.b-partner-strip__item a .b-wordmark {
    position: relative;
    z-index: 1;
    transition: transform 280ms cubic-bezier(.2, .7, .2, 1);
    transform-origin: center bottom;
    will-change: transform;
}

.b-partner-strip__item a:hover .brand-mark,
.b-partner-strip__item a:focus-visible .brand-mark,
.b-partner-strip__item a:hover .b-wordmark,
.b-partner-strip__item a:focus-visible .b-wordmark {
    transform: translateY(-3px) scale(1.03);
}

/* §14 — Dokunmatik: hover'a bağımlılık YOK. Ortam ışığı, kırmızı zemin
   yansıması ve Mikro okunurluk alanı kalır; tavan spotu kalıcı açılmaz,
   takılı hover durumu oluşmaz. */
@media (hover: none) {
    .b-partner-strip__item a:hover::before { opacity: 0; }
    .b-partner-strip__item a:hover::after  { opacity: var(--floor-o); width: 58%; filter: blur(7px); }
    .b-partner-strip__item a:hover .brand-mark,
    .b-partner-strip__item a:hover .b-wordmark { transform: none; }
}

/* Kademe = yalnızca ÖLÇEK farkı; taban B4a değerinden gelir. */
/* §13: Netgsm SALT BEYAZ olduğu için optik ağırlığı yüksektir; birincil
   üçlüyü bastırmaması adına ölçüsü bir tık kısılır (renk değişmez, oran
   korunur). Narbulut gri-mavi olduğundan aynı bantta biraz daha yüksektir. */
.b-partner-strip__item--t2 img.brand-mark--netgsm   { height: 17px; }
.b-partner-strip__item--t2 img.brand-mark--narbulut { height: 18px; }
.b-partner-strip__item--t3 img.brand-mark--bizmu    { height: 19px; }
.b-partner-strip__item--t3 img.brand-mark--parasut  { height: 17px; }
.b-partner-strip__item--t3 img.brand-mark--logo     { height: 15px; }

.b-partner-strip__item--t1 .b-wordmark { font-size: 1.05rem; }
.b-partner-strip__item--t2 .b-wordmark { font-size: .84375rem; opacity: .85; }
.b-partner-strip__item--t3 .b-wordmark { font-size: .75rem; opacity: .6; }

/* Sessiz varyant — eski düz ray (§38); ekosistem bölümü .eco-* kullanır.
   Üretim sertleştirmesi §4: buradaki `opacity: .7` KALDIRILDI — logo hiçbir
   yerde opaklıkla sönükleştirilmez (sessizlik yalnızca boşluk/ayraçla). */
.b-partner-strip--quiet { margin-top: 0; padding-top: 0; border-top: 0; }

/* --- 08 · Çözüm Ekosistemi (Beta 2.1 · §6): üç hiyerarşi grubu ------------- */
.eco {
    grid-column: 1 / -1;
    margin-top: 2.5rem;
}

.eco__group {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    align-items: center;
    column-gap: clamp(1.5rem, 3vw, 3rem);
    padding: 1.35rem 0;
    border-top: 1px solid rgba(255, 255, 255, .07);
}

.eco__group-label {
    margin: 0;
    font-size: .65625rem;
    font-weight: 600;
    letter-spacing: var(--tracking-label);
    text-transform: uppercase;
    color: rgba(255, 255, 255, .42);
}

.eco__list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.1rem clamp(1.75rem, 3.5vw, 3.5rem);
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Düzeltme §3: hiyerarşi OPAKLIKLA DEĞİL; ölçek, boşluk ve gruplamayla.
   Tüm logolar tam okunur.

   DÜZELTME (2. rötuş taşıması): vitrin ışığı/hover cilası bu ALT bölümden
   KALDIRILDI — doğru yeri Bölüm 01 "Çalıştığımız Çözümler" şerididir
   (bkz. B4 › .b-partner-strip ışık bloğu). Ekosistem bölümü önceki sakin
   hâline döndü: yalnızca hafif yükselme, zemin ışığı YOK. */
.eco__item a {
    display: flex;
    align-items: center;
    transition: transform 260ms var(--ease);
}

.eco__item a:hover,
.eco__item a:focus-visible { transform: translateY(-2px); }

/* §8/§11 — KOYU LOGO OKUNURLUĞU (vitrin ışığı DEĞİL).
   Mikro'nun siyah yazı markası koyu zeminde 1.31:1 ile okunmuyor. Kırmızı
   zemin yansıması burada KULLANILMAZ (§10: bu bölüm Bölüm 01'den sessiz
   kalır); yalnızca sınırı olmayan, dağılan sıcak-nötr optik arka ışık
   uygulanır ve Bölüm 01'dekinden belirgin biçimde ZAYIFTIR. */
.eco__item a:has(.brand-mark--mikro) { position: relative; }

.eco__item a:has(.brand-mark--mikro)::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 148%;
    height: 210%;
    background: radial-gradient(ellipse at center,
        rgba(248, 246, 242, .105) 0%,
        rgba(248, 246, 242, .06)  36%,
        rgba(248, 246, 242, .022) 58%,
        rgba(248, 246, 242, 0)    76%);
    filter: blur(9px);
    pointer-events: none;
    z-index: 0;
}

.eco__item a .brand-mark { position: relative; z-index: 1; }

/* Grup ölçekleri: A tam, B hafif küçük, C bilinçli ikincil — yalnız BOYUT */
.eco__group--b img.brand-mark--netgsm   { height: 20px; }
.eco__group--b img.brand-mark--narbulut { height: 19px; }
.eco__group--c img.brand-mark--bizmu    { height: 19px; }
.eco__group--c img.brand-mark--parasut  { height: 17px; }
.eco__group--c img.brand-mark--logo     { height: 15px; }

@media (max-width: 1024px) {
    .eco__group { grid-template-columns: 1fr; row-gap: .8rem; }
}

@media (max-width: 767px) {
    .eco__list { gap: .9rem 1.75rem; }
    .eco__group { padding: 1.1rem 0; }
    .eco img.brand-mark--zirve    { height: 24px; }
    .eco img.brand-mark--mikro    { height: 23px; }
    .eco img.brand-mark--dia      { height: 30px; }
    .eco img.brand-mark--netgsm   { height: 16px; }
    .eco img.brand-mark--narbulut { height: 15px; }
    .eco img.brand-mark--bizmu    { height: 15px; }
    .eco img.brand-mark--parasut  { height: 13px; }
    .eco img.brand-mark--logo     { height: 12px; }
}

/* --- 03 · Çözüm alanları (§33) -------------------------------------------- */
.area-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin: 2.5rem 0 0;
    padding: 0;
    list-style: none;
}

.area-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1.5rem 1.4rem;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 2px;
    transition: border-color var(--dur) var(--ease),
                background-color var(--dur) var(--ease),
                transform var(--dur) var(--ease);
}

.area-card:hover,
.area-card:focus-visible {
    background: rgba(255, 255, 255, .05);
    border-color: rgba(var(--baris-red-rgb), .45);
    transform: translateY(-3px);
    text-decoration: none;
}

.area-card .b-icon { width: 24px; height: 24px; color: var(--baris-red-onDark); margin-bottom: 1rem; }

.area-card__title { margin: 0 0 .45rem; font-size: 1rem; font-weight: 700; color: #fff; letter-spacing: -.01em; }

.area-card__text {
    margin: 0 0 1.1rem;
    font-size: .78125rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, .55);
}

.area-card__cta {
    margin-top: auto;
    font-size: .78125rem;
    font-weight: 600;
    color: var(--baris-red-onDark);
}

.area-card:hover .area-card__cta { color: #fff; }

/* --- 05 · Altyapı dizini bağlantıları — çözüm önde, marka destek ---------- */
.infra-item__link { color: inherit; transition: color var(--dur) var(--ease); }
.infra-item__link:hover,
.infra-item__link:focus-visible { color: var(--baris-red-onDark); text-decoration: none; }

/* --- 07 · Bilgi merkezi vitrini (§37) -------------------------------------- */
.home-info {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(1.5rem, 3vw, 3rem);
    margin-top: 2.5rem;
}

.home-info__lane-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: .7rem;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.home-info__lane-title {
    margin: 0;
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .02em;
    color: #fff;
}

.home-info__lane-link {
    font-size: .75rem;
    font-weight: 600;
    color: var(--baris-red-onDark);
    white-space: nowrap;
}

.home-info__lane-link:hover,
.home-info__lane-link:focus-visible { color: #fff; text-decoration: none; }


/* ==========================================================================
   B5. İÇERİK KARTLARI — Bilgi Merkezi / Haberler (§21, §22)
   ========================================================================== */

.b-article-card { min-width: 0; }

.b-article-card + .b-article-card { margin-top: .9rem; }

.b-article-card__link {
    display: block;
    padding: 1.15rem 1.25rem;
    background: var(--baris-dark-raised);
    background-image: linear-gradient(150deg, rgba(255, 255, 255, .02), transparent 55%);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 2px;
    transition: border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.b-article-card__link:hover,
.b-article-card__link:focus-visible {
    border-color: rgba(var(--baris-red-rgb), .5);
    transform: translateY(-2px);
    text-decoration: none;
}

.b-article-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin: 0 0 .5rem;
    font-size: .671875rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .4);
}

.b-article-card__cat { color: var(--baris-red-onDark); }

.b-article-card__title {
    margin: 0 0 .4rem;
    font-size: .984375rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -.01em;
    color: #fff;
}

.b-article-card__summary {
    margin: 0 0 .7rem;
    font-size: .8125rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, .55);
}

.b-article-card__go {
    font-size: .75rem;
    font-weight: 600;
    color: var(--baris-red-onDark);
}

.b-article-card__link:hover .b-article-card__go { color: #fff; }

/* Liste sayfası ızgarası */
.b-article-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2.25rem;
}

.b-article-grid .b-article-card + .b-article-card { margin-top: 0; }

/* Detay görünümü */
.b-article-detail {
    grid-column: 1 / -1;
    max-width: 76ch;
    margin-top: 2rem;
}

.b-article-detail__title {
    margin: .4rem 0 1.2rem;
    font-size: clamp(1.375rem, 2.6vw, 1.875rem);
    font-weight: 700;
    letter-spacing: -.02em;
    color: #fff;
}

.b-article-detail__p {
    margin: 0 0 1.1rem;
    font-size: .9375rem;
    line-height: 1.75;
    color: rgba(255, 255, 255, .72);
}

/* §14H — bilgi katmanını ticari çözüm sayfasına bağlayan ölçülü satır.
   Reklam kutusu değil; ince ayraçla ayrılmış tek bir yönlendirme. */
.b-article-detail__related {
    margin: 1.75rem 0 1.1rem;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(255, 255, 255, .09);
    font-size: .84375rem;
    color: rgba(255, 255, 255, .5);
}


/* ==========================================================================
   B6. GİRİŞ — STATİK PORTAL KARŞILAMA (§40)
   Kimlik doğrulama YOKTUR; sahte başarı durumu üretilmez.
   ========================================================================== */

.portal-roles {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 2.25rem 0 0;
    padding: 0;
    list-style: none;
}

.portal-role {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1.6rem 1.5rem;
    background: var(--baris-dark-raised);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 2px;
}

.portal-role .b-icon { width: 24px; height: 24px; color: var(--baris-red-onDark); margin-bottom: 1rem; }

.portal-role__title { margin: 0 0 .4rem; font-size: 1.0625rem; font-weight: 700; color: #fff; }

.portal-role__text {
    margin: 0 0 1.2rem;
    font-size: .8125rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, .55);
}

/* Dürüst durum işareti: "hazırlanıyor" — buton değil, durum */
.portal-role__state {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .71875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .45);
}

.portal-role__state::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #C99B3F;   /* hazırlık amber'i — yeşil "hazır" işareti DEĞİL */
    flex: none;
}


/* ==========================================================================
   B7. BELGELER — DÜRÜST BOŞ DURUM (§44)
   Gerçek belge asset'leri sağlanana kadar sahte sertifika basılmaz.
   ========================================================================== */

.doc-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2.25rem;
    padding: 0;
    list-style: none;
}

.doc-slot {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .6rem;
    min-height: 180px;
    padding: 1.4rem;
    border: 1px dashed rgba(255, 255, 255, .18);
    border-radius: 2px;
    color: rgba(255, 255, 255, .45);
}

.doc-slot__kind {
    font-size: .671875rem;
    font-weight: 600;
    letter-spacing: var(--tracking-label);
    text-transform: uppercase;
    color: rgba(255, 255, 255, .38);
}

.doc-slot__name { font-size: .9375rem; font-weight: 600; color: rgba(255, 255, 255, .75); }
.doc-slot__note { margin-top: auto; font-size: .75rem; color: rgba(255, 255, 255, .4); }


/* ==========================================================================
   B8. RESPONSIVE + ERİŞİLEBİLİRLİK
   ========================================================================== */

@media (max-width: 1024px) {
    .paths { grid-template-columns: 1fr; }
    .area-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-roles { grid-template-columns: 1fr; }
    .doc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .area-grid { grid-template-columns: 1fr; }
    .home-info { grid-template-columns: 1fr; }
    .b-article-grid { grid-template-columns: 1fr; }
    .doc-grid { grid-template-columns: 1fr; }
    .b-partner-strip__list { gap: .9rem 1.6rem; }
    /* Telefonda tüm markalar bir kademe küçülür; oranlar B4a'dan gelir. */
    .b-partner-strip img.brand-mark--zirve    { height: 24px; }
    .b-partner-strip img.brand-mark--mikro    { height: 23px; }
    .b-partner-strip img.brand-mark--dia      { height: 30px; }
    .b-partner-strip img.brand-mark--netgsm   { height: 16px; }
    .b-partner-strip img.brand-mark--narbulut { height: 15px; }
    .b-partner-strip img.brand-mark--bizmu    { height: 15px; }
    .b-partner-strip img.brand-mark--parasut  { height: 13px; }
    .b-partner-strip img.brand-mark--logo     { height: 11px; }
}

/* Klavye odak halkası — koyu zeminde okunur */
.mn-mega__mode:focus-visible,
.mega-col__links a:focus-visible,
.mega-col__cta:focus-visible,
.mega-ozel:focus-visible,
.mega-brand__item:focus-visible,
.mega-campaign:focus-visible,
a.hero-rail__item:focus-visible,
.eco__item a:focus-visible,
.path-card:focus-visible,
.area-card:focus-visible,
.b-article-card__link:focus-visible,
.b-campaign-strip__inner:focus-visible {
    outline: 2px solid var(--baris-red-onDark);
    outline-offset: 2px;
}

/* Hareket azaltma tercihi: nabız ve süpürme animasyonları durur */
@media (prefers-reduced-motion: reduce) {
    /* Nokta sabit ve tam görünür kalır; halo tamamen kapanır. */
    .b-campaign-strip__pulse { animation: none; opacity: 1; transform: none; }
    .b-campaign-strip__pulse::after { animation: none; opacity: 0; }
    .b-campaign-strip::before { animation: none; opacity: 0; }
    .path-card, .area-card, .b-article-card__link, .mega-campaign,
    .b-partner-strip__item a,
    .mega-col__links a, .mega-col__cta, .mega-ozel, .mega-brand__item,
    a.hero-rail__item, .hero-rail__go, .hero-rail__title,
    .eco__item a { transition: none; }

    /* §15 — Bölüm 01 vitrini: hareket ve spot geçişleri kalkar; STATİK
       aydınlatma (ortam ışığı, kırmızı zemin bandı, Mikro okunurluk alanı,
       logoya ait sabit yansıma) olduğu gibi KALIR. */
    .b-partner-strip__item a .brand-mark,
    .b-partner-strip__item a .b-wordmark,
    .b-partner-strip__item a::before,
    .b-partner-strip__item a::after { transition: none; }
    .b-partner-strip__item a:hover .brand-mark,
    .b-partner-strip__item a:focus-visible .brand-mark,
    .b-partner-strip__item a:hover .b-wordmark,
    .b-partner-strip__item a:focus-visible .b-wordmark { transform: none; }
}


/* ==========================================================================
   B9. BETA 2.2 — KURUMSAL GÖRSEL RÖTUŞ
   --------------------------------------------------------------------------
   Yapı, hiyerarşi ve içerik DEĞİŞMEZ. Burada yalnızca ölçümle kanıtlanmış
   görsel kusurlar giderilir.
   ========================================================================== */

/* --- B9a. KALDIRILDI (Düzeltme §3) ---------------------------------------
   Mikro için beyaz plaka denemesi, "logo kartı/plaka YOK" kuralı gereği
   geri alındı. Mikro'nun koyu zeminde düşük kontrastı BİLİNEN bir durumdur:
   Mikrogrup resmî açık renk varyant yayınlamıyor (mikro.com.tr doğrulandı);
   logo boyanmaz/filtrelenmez. Çözüm: Mikrogrup'tan resmî beyaz varyant
   talep edilecek — o gelene kadar özgün renkli logo şeffaf zeminde kalır.
   (NEEDS REVIEW — bkz. qa/partner-assets.md) */

/* --- B9b. Buton hover'ında ölçülü yükselme (§17, §18) -------------------
   Butonlarda zaten ok kayması ve zemin geçişi var; eksik olan tek şey
   §17'nin istediği "küçük yükselme" idi. 1 piksel: hissedilir ama
   sıçrama yaratmaz. Gölge büyütülmez, ölçek değişmez.

   transform, .b-btn üzerinde başka bir amaçla kullanılmıyor (ok animasyonu
   ::after üzerinde) — çakışma yok. */
.b-btn,
a.b-btn {
    transition: background-color var(--dur) var(--ease),
                color var(--dur) var(--ease),
                border-color var(--dur) var(--ease),
                transform var(--dur) var(--ease);
}

.b-btn:hover,
a.b-btn:hover,
.b-btn:focus-visible,
a.b-btn:focus-visible {
    transform: translateY(-1px);
}

/* Dokunmatikte "asılı kalan" hover durumu oluşmasın (§26). */
@media (hover: none) {
    .b-btn:hover,
    a.b-btn:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .b-btn, a.b-btn { transition: none; }
    .b-btn:hover, a.b-btn:hover,
    .b-btn:focus-visible, a.b-btn:focus-visible { transform: none; }
}


/* ==========================================================================
   B10. SAYFA KONSOLİDASYONU — TANIMLAYICI H1 + EDİTORYAL SLOGAN, MARKA BLOĞU
   --------------------------------------------------------------------------
   H1 artık sayfanın NE olduğunu söyler; eski slogan .b-page-hero__tagline'a
   iner. Görsel hiyerarşi: H1 (display) > slogan (orta, kırmızı nokta) > lead.
   ========================================================================== */
.b-page-hero__tagline {
    margin: 1rem 0 0;
    max-width: 30ch;
    font-size: clamp(1.125rem, 1.45vw, 1.4375rem);
    line-height: 1.32;
    font-weight: 500;
    letter-spacing: -.012em;
    color: rgba(255, 255, 255, .66);
}
.b-page-hero__tagline > span { display: inline; }
.b-page-hero__tagline .hero__dot { color: var(--baris-red); }
.b-page-hero__tagline + .b-page-hero__lead { margin-top: 1.25rem; }

/* --- Bağlam içinde marka bloğu (ikincil markaların yeni yuvası) ------------
   Plaka/kart duvarı YOK: ince üst çizgi, otantik logo, rol, uyum cümlesi,
   en fazla 4 madde. Aynı bölümde iki blok yan yana durabilir. */
.b-brand-blocks {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem clamp(2rem, 4vw, 4rem);
    margin-top: 2.5rem;
}
.b-brand-blocks--1 { grid-template-columns: minmax(0, 1fr); max-width: 760px; }

.b-brand-block {
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, .10);
}
.b-brand-block__head {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}
.b-brand-block__logo {
    display: inline-flex;
    align-items: center;
    position: relative;
    min-width: 56px;
}
.b-brand-block__logo img { position: relative; z-index: 1; width: auto; }
.b-brand-block__logo img.brand-mark--parasut { height: 20px; }
.b-brand-block__logo img.brand-mark--bizmu   { height: 24px; }
.b-brand-block__logo img.brand-mark--logo    { height: 20px; }
.b-brand-block__logo img.brand-mark--narbulut{ height: 22px; }
.b-brand-block__meta { display: flex; flex-direction: column; gap: .15rem; }
.b-brand-block__name { font-weight: 700; color: #fff; font-size: 1.0625rem; letter-spacing: -.01em; }
.b-brand-block__role {
    font-size: .6875rem; font-weight: 600; letter-spacing: var(--tracking-label);
    text-transform: uppercase; color: rgba(255, 255, 255, .45);
}
.b-brand-block__fit  { margin: 0 0 1rem; font-size: .9375rem; line-height: 1.7; color: rgba(255, 255, 255, .74); }
.b-brand-block__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.b-brand-block__list li { display: flex; gap: .7rem; align-items: flex-start; font-size: .875rem; line-height: 1.6; color: rgba(255, 255, 255, .68); }
.b-brand-block__list li .b-icon { flex: none; width: 18px; height: 18px; margin-top: .2rem; color: var(--baris-red-onDark); }
.b-brand-block__list li strong { color: #fff; font-weight: 600; }
.b-brand-block__note { margin: 1rem 0 0; font-size: .8125rem; color: rgba(255, 255, 255, .5); }

@media (max-width: 767px) {
    .b-brand-blocks { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; margin-top: 1.75rem; }
    .b-page-hero__tagline { max-width: none; }
}

/* =============================================================================
   C1 — TİCARİ YAZILIM ÜRÜN KATALOĞU
   -----------------------------------------------------------------------------
   Ürün sayfaları hizmet sayfalarından DAHA YOĞUNDUR: ürün kartı, künye paneli,
   yetenek grupları, akış, modül matrisi ve karşılaştırma. Mevcut tasarım dili
   korunur — yeni renk, yeni yarıçap, tüketici mağazası estetiği yoktur.
   Sepet/fiyat/stok/puan bileşeni YOKTUR.
   ========================================================================== */

/* --- Ürün kartları --------------------------------------------------------- */
.b-pcards {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: clamp(16px, 2vw, 28px);
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.b-pcard {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: clamp(20px, 2.2vw, 28px);
    border: 1px solid var(--baris-line);
    background: var(--baris-white);
    transition: border-color .18s ease, background-color .18s ease;
}

.b-section--dark .b-pcard {
    border-color: var(--baris-line-dark);
    background: rgba(255, 255, 255, .022);
}

.b-pcard:hover,
.b-pcard:focus-within { border-color: rgba(var(--baris-red-rgb), .55); }
.b-section--dark .b-pcard:hover,
.b-section--dark .b-pcard:focus-within { background: rgba(255, 255, 255, .045); }

/* Kartın tamamı tıklanır; başlık ayrıca bağlantı değildir. */
.b-pcard__hit { position: absolute; inset: 0; z-index: 2; }
.b-pcard__hit:focus-visible { outline: 2px solid var(--baris-red); outline-offset: 3px; }

.b-pcard__kicker {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .5rem;
    margin: 0 0 .5rem;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
}

.b-pcard__brand {
    padding-left: .5rem;
    border-left: 1px solid var(--baris-line);
    letter-spacing: .06em;
    font-weight: 600;
}
.b-section--dark .b-pcard__brand { border-left-color: var(--baris-line-dark); }

.b-pcard__name {
    margin: 0 0 .6rem;
    font-size: clamp(1.15rem, 1.5vw, 1.375rem);
    font-weight: 700;
    line-height: 1.25;
    color: var(--baris-ink);
}
.b-section--dark .b-pcard__name { color: var(--baris-white); }

.b-pcard__text {
    margin: 0 0 1rem;
    font-size: .9375rem;
    line-height: 1.6;
    color: var(--baris-muted);
    flex: 1 1 auto;
}

.b-pcard__who {
    margin: 0 0 1rem;
    padding-top: .75rem;
    border-top: 1px solid var(--baris-line-soft);
    font-size: .8125rem;
    line-height: 1.5;
    color: var(--baris-muted);
}
.b-section--dark .b-pcard__who { border-top-color: var(--baris-line-dark-soft); }
.b-pcard__who span {
    display: block;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    opacity: .72;
    margin-bottom: .15rem;
}

.b-pcard__tags {
    display: flex;
    flex-wrap: wrap;
    gap: .375rem;
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
}
.b-pcard__tags li {
    padding: .2rem .6rem;
    border: 1px solid var(--baris-line);
    border-radius: 2px;
    font-size: .75rem;
    color: var(--baris-muted);
}
.b-section--dark .b-pcard__tags li { border-color: var(--baris-line-dark); }

.b-pcard__go {
    margin: 0;
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--baris-red);
}
.b-section--dark .b-pcard__go { color: var(--baris-red-on); }
.b-pcard__go::after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 1px;
    margin-left: .5rem;
    vertical-align: middle;
    background: currentColor;
    transition: width .18s ease;
}
.b-pcard:hover .b-pcard__go::after { width: 28px; }

/* --- Filtre çipleri -------------------------------------------------------- */
.b-filter {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
    margin-top: clamp(1.25rem, 2.5vw, 2rem);
}

.b-filter__label {
    margin: 0;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
}

.b-filter__chips { display: flex; flex-wrap: wrap; gap: .5rem; }

.b-chip {
    padding: .4rem .85rem;
    border: 1px solid var(--baris-line);
    border-radius: 2px;
    background: transparent;
    font: inherit;
    font-size: .8125rem;
    line-height: 1.2;
    color: var(--baris-muted);
    cursor: pointer;
    transition: border-color .16s ease, color .16s ease, background-color .16s ease;
}
.b-section--dark .b-chip { border-color: var(--baris-line-dark); }
.b-chip:hover { color: var(--baris-ink); border-color: var(--baris-line); }
.b-section--dark .b-chip:hover { color: var(--baris-white); }
.b-chip.is-active {
    border-color: var(--baris-red);
    color: var(--baris-red);
    background: rgba(var(--baris-red-rgb), .06);
}
.b-section--dark .b-chip.is-active { color: var(--baris-red-on); }
.b-chip:focus-visible { outline: 2px solid var(--baris-red); outline-offset: 2px; }

/* Filtre sarmalayıcısı ızgara ÇOCUĞUDUR; kaplama verilmezse 12 kolonluk
   düzende tek kolona sıkışır ve kartlar daralır. */
[data-filter-root] { grid-column: 1 / -1; }

.b-pcard[hidden] { display: none !important; }

/* --- Ürün künyesi ---------------------------------------------------------- */
.b-specs {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 0;
    margin: clamp(1.5rem, 3vw, 2.5rem) 0 0;
    border-top: 1px solid var(--baris-line);
}
.b-section--dark .b-specs { border-top-color: var(--baris-line-dark); }

.b-specs__row {
    padding: 1rem 1.25rem 1rem 0;
    border-bottom: 1px solid var(--baris-line-soft);
}
.b-section--dark .b-specs__row { border-bottom-color: var(--baris-line-dark-soft); }

.b-specs dt {
    margin: 0 0 .25rem;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
}
.b-specs dd {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.5;
    color: var(--baris-ink);
}
.b-section--dark .b-specs dd { color: var(--baris-white); }

/* --- Yetenek grupları ------------------------------------------------------ */
.b-capgroups {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: clamp(20px, 2.4vw, 34px);
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.b-capgroup__head {
    display: flex;
    align-items: center;
    gap: .625rem;
    margin: 0 0 .875rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--baris-line);
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--baris-ink);
}
.b-section--dark .b-capgroup__head { border-bottom-color: var(--baris-line-dark); color: var(--baris-white); }
.b-capgroup__head .b-icon { width: 20px; height: 20px; flex: 0 0 auto; color: var(--baris-red); }
.b-section--dark .b-capgroup__head .b-icon { color: var(--baris-red-on); }

.b-capgroup__list { list-style: none; padding: 0; margin: 0; }
.b-capgroup__list li {
    position: relative;
    padding: .4rem 0 .4rem 1.1rem;
    font-size: .9375rem;
    line-height: 1.6;
    color: var(--baris-muted);
}
.b-capgroup__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1.05em;
    width: 5px;
    height: 1px;
    background: var(--baris-red);
}

/* --- İş akışı -------------------------------------------------------------- */
.b-flow { grid-column: 1 / -1; margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.b-flow__title {
    margin: 0 0 1.25rem;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
}
.b-flow__steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0;
    list-style: none;
    padding: 0;
    margin: 0;
}
.b-flow__step {
    position: relative;
    padding: 1.25rem 1.5rem 1.25rem 0;
    border-top: 2px solid var(--baris-line);
}
.b-section--dark .b-flow__step { border-top-color: var(--baris-line-dark); }
.b-flow__step:first-child { border-top-color: var(--baris-red); }
.b-flow__num {
    display: block;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .14em;
    color: var(--baris-red);
    margin-bottom: .4rem;
}
.b-section--dark .b-flow__num { color: var(--baris-red-on); }
.b-flow__name {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    color: var(--baris-ink);
    margin-bottom: .25rem;
}
.b-section--dark .b-flow__name { color: var(--baris-white); }
.b-flow__text {
    display: block;
    font-size: .875rem;
    line-height: 1.55;
    color: var(--baris-muted);
}

/* --- Modül matrisi --------------------------------------------------------- */
.b-modgrid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: clamp(18px, 2.2vw, 30px);
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
}
.b-modgroup__name {
    margin: 0 0 .75rem;
    padding-bottom: .6rem;
    border-bottom: 1px solid var(--baris-line-dark);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
}
.b-modgroup__list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .375rem; }
.b-modgroup__list li {
    padding: .3rem .7rem;
    border: 1px solid var(--baris-line-dark);
    border-radius: 2px;
    font-size: .8125rem;
    color: var(--baris-ink);
}
/* Modül matrisi koyu bölümde durur; jeton açık tema için tanımlıdır. */
.b-section--dark .b-modgroup__list li { color: rgba(255, 255, 255, .84); }
.b-modnote {
    grid-column: 1 / -1;
    margin: 1.5rem 0 0;
    font-size: .875rem;
    line-height: 1.6;
    color: var(--baris-muted);
}

/* --- Karşılaştırma --------------------------------------------------------- */
.b-compare {
    grid-column: 1 / -1;
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
    overflow-x: auto;
}
.b-compare__table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.b-compare__table th,
.b-compare__table td {
    padding: .9rem 1rem;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--baris-line-soft);
}
.b-section--dark .b-compare__table th,
.b-section--dark .b-compare__table td { border-bottom-color: var(--baris-line-dark-soft); }
.b-compare__table thead th {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
    border-bottom: 1px solid var(--baris-line);
    white-space: nowrap;
}
.b-compare__table tbody th {
    font-weight: 700;
    color: var(--baris-ink);
    white-space: nowrap;
}
.b-section--dark .b-compare__table tbody th { color: var(--baris-white); }
.b-compare__table td { color: var(--baris-muted); }

/* --- Karar desteği --------------------------------------------------------- */
.b-decide { grid-column: 1 / -1; list-style: none; padding: 0; margin: clamp(1.5rem, 3vw, 2.5rem) 0 0; }
.b-decide__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 0;
    border-bottom: 1px solid var(--baris-line-dark-soft);
}
.b-decide__row:first-child { border-top: 1px solid var(--baris-line-dark); }
.b-decide__if { font-size: .9375rem; line-height: 1.5; color: var(--baris-ink); }
/* Karar listesi koyu bölümde kullanılır: açık tema mürekkebi okunmaz kalır. */
.b-section--dark .b-decide__if { color: rgba(255, 255, 255, .80); }
.b-decide__arrow { position: relative; height: 1px; background: var(--baris-line-dark); }
.b-decide__arrow::after {
    content: "";
    position: absolute;
    right: 0; top: -3px;
    width: 7px; height: 7px;
    border-top: 1px solid var(--baris-red-on);
    border-right: 1px solid var(--baris-red-on);
    transform: rotate(45deg);
}
.b-decide__then a {
    display: block;
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--baris-white);
    text-decoration: none;
}
.b-decide__then a:hover { color: var(--baris-red-on); }
.b-decide__why { display: block; margin-top: .2rem; font-size: .8125rem; line-height: 1.5; color: var(--baris-muted); }

/* --- Ailedeki diğer ürünler ------------------------------------------------ */
.b-subproducts {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: clamp(20px, 2.6vw, 36px);
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
}
.b-subproduct { scroll-margin-top: 96px; }
.b-subproduct__kicker {
    margin: 0 0 .4rem;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--baris-muted);
}
.b-subproduct__name {
    margin: 0 0 .625rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--baris-white);
}
.b-subproduct__text { margin: 0 0 .75rem; font-size: .9375rem; line-height: 1.65; color: var(--baris-muted); }

/* --- Kaynak notu ----------------------------------------------------------- */
.b-source {
    max-width: 1180px;
    margin: 0 auto;
    padding: 1.25rem clamp(16px, 4vw, 40px) 2.5rem;
    font-size: .8125rem;
    line-height: 1.6;
    color: var(--baris-muted);
}

/* --- Responsive ------------------------------------------------------------ */
@media (max-width: 900px) {
    .b-decide__row { grid-template-columns: 1fr; gap: .5rem; }
    .b-decide__arrow { display: none; }
    .b-decide__then { padding-left: .875rem; border-left: 2px solid var(--baris-red); }
}

@media (max-width: 767px) {
    .b-pcards,
    .b-capgroups,
    .b-modgrid,
    .b-subproducts,
    .b-specs { grid-template-columns: 1fr; }

    .b-flow__steps { grid-template-columns: 1fr; }
    .b-flow__step { padding-right: 0; }

    .b-specs__row { padding-right: 0; }

    /* Karşılaştırma tablosu dar ekranda karta dönüşür: bileşen küçültülmez,
       bilgi mimarisi değişir. */
    .b-compare { overflow-x: visible; }
    .b-compare__table thead { display: none; }
    .b-compare__table tbody tr {
        display: block;
        padding: 1rem 0;
        border-bottom: 1px solid var(--baris-line-dark);
    }
    .b-compare__table tbody th {
        display: block;
        padding: 0 0 .625rem;
        border: 0;
        font-size: 1.0625rem;
        white-space: normal;
    }
    .b-compare__table tbody td {
        display: flex;
        justify-content: space-between;
        gap: 1rem;
        padding: .4rem 0;
        border: 0;
    }
    .b-compare__table tbody td::before {
        content: attr(data-label);
        flex: 0 0 auto;
        font-size: .6875rem;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase;
        color: var(--baris-muted);
        opacity: .8;
    }
}

/* --- Katalog: koyu bölüm metin renkleri ------------------------------------
   Sitede koyu zemin renkleri jetonla değil, bileşen bazlı açık override ile
   verilir (.b-capability__text gibi). Katalog bileşenleri de aynı kurala
   uyar; aksi hâlde açık tema mürekkebi/gri'si koyu zeminde 3.3:1'de kalır.
   -------------------------------------------------------------------------- */
.b-section--dark .b-capgroup__list li,
.b-section--dark .b-flow__text,
.b-section--dark .b-compare__table td,
.b-section--dark .b-subproduct__text,
.b-section--dark .b-modnote,
.b-section--dark .b-pcard__text { color: rgba(255, 255, 255, .68); }

.b-section--dark .b-pcard__who,
.b-section--dark .b-pcard__tags li,
.b-section--dark .b-specs dt,
.b-section--dark .b-modgroup__name,
.b-section--dark .b-flow__title,
.b-section--dark .b-filter__label,
.b-section--dark .b-decide__why,
.b-section--dark .b-pcard__kicker,
.b-section--dark .b-subproduct__kicker,
.b-section--dark .b-compare__table thead th { color: rgba(255, 255, 255, .58); }

.b-section--dark .b-chip { color: rgba(255, 255, 255, .70); }
.b-section--dark .b-chip:hover { color: #fff; }

.b-source { color: rgba(255, 255, 255, .55); }


/* =======================================================================/* ==========================================================================
   C2 — DİNAMİK ÜRÜN DETAY DÜZENİ  (/urun/<slug>)
   ==========================================================================
   Tek renderer'ın (product.php + elements/product-view.php) düzeni.
   Yapı:  .b-plyt > .b-plyt__inner > (.b-psidebar + .b-pmain)

   YÜZEY SİSTEMİ: .b-plyt işaretlemede `b-section--dark b-tone-graphite`
   sınıflarını taşır. Bu bilinçli bir seçimdir — katalog bileşenlerinin
   (.b-pcard, .b-specs, .b-compare, .b-modgrid …) koyu kuralları zaten
   `.b-section--dark` altında tanımlıdır ve böylece ürün sayfasında
   KENDİLİĞİNDEN geçerli olur. Ürün detayına özel ikinci bir renk katmanı
   YAZILMAZ; aşağıdaki kurallar yalnızca DÜZEN ve bu düzene özgü öğelerdir.
   ========================================================================== */

.b-plyt {
    padding-block: clamp(48px, 6vw, 88px);
}

/* Koyu bölümlerdeki ortam ışığı katmanı içeriğin ÜSTÜNE çıkmasın.
   .b-section--dark > .b-container için var olan kuralın bu düzendeki karşılığı. */
.b-plyt > .b-plyt__inner { position: relative; z-index: 2; }

.b-plyt__inner {
    width: 100%;
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--gutter);
    display: grid;
    /* Kenar çubuğu sabit ölçekli, ana kolon kalanı alır. minmax(0,1fr)
       uzun kelime/tablo taşmasını engeller. */
    grid-template-columns: 264px minmax(0, 1fr);
    column-gap: clamp(28px, 3.4vw, 56px);
    align-items: start;
}

/* ---------- Kenar çubuğu ---------- */

.b-psidebar {
    position: sticky;
    /* Sabit navbar'ın altına oturur; küçülen navbar yüksekliği esas alınır. */
    top: calc(var(--nav-h-small) + 20px);
    align-self: start;
}

.b-pnav {
    border: 1px solid var(--baris-line-dark);
    border-radius: 4px;
    background: rgba(255, 255, 255, .022);
    padding: 20px 18px;
}

.b-pnav__head {
    margin: 0 0 4px;
    font-size: .70rem;
    letter-spacing: .10em;
    font-weight: 600;
    color: rgba(255, 255, 255, .55);
}

.b-pnav__back {
    display: inline-block;
    margin-bottom: 14px;
    font-size: .82rem;
    color: rgba(255, 255, 255, .62);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

.b-pnav__back::before { content: "← "; }

.b-pnav__back:hover {
    color: #FFFFFF;
    border-bottom-color: var(--baris-line-dark);
}

.b-pnav__list {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--baris-line-dark-soft);
}

.b-pnav__list li { border-bottom: 1px solid var(--baris-line-dark-soft); }

.b-pnav__list a {
    display: block;
    padding: 11px 0;
    font-size: .92rem;
    line-height: 1.35;
    color: rgba(255, 255, 255, .74);
    text-decoration: none;
    transition: color var(--dur) var(--ease);
}

.b-pnav__list a:hover { color: #FFFFFF; }

/* Aktif ürün: ölçülü kırmızı işaret + koyu yüzey vurgusu.
   Renk TEK ayırt edici değildir — ağırlık ve sol çizgi de değişir. */
.b-pnav__list a.is-active {
    font-weight: 600;
    color: #FFFFFF;
    padding-left: 12px;
    background: rgba(255, 255, 255, .03);
    box-shadow: inset 2px 0 0 0 var(--baris-red-onDark);
}

.b-pnav__all {
    display: inline-block;
    margin-top: 14px;
    font-size: .82rem;
    color: rgba(255, 255, 255, .62);
    text-decoration: none;
    border-bottom: 1px solid var(--baris-line-dark);
}

.b-pnav__all:hover { color: #FFFFFF; border-bottom-color: var(--baris-red-onDark); }

/* Mobil açılır seçici — masaüstünde gizlidir. */
.b-pnav-mobile { display: none; }

/* ---------- Ana kolon ---------- */

.b-pmain { min-width: 0; }

.b-pblock { padding-block: clamp(28px, 3.2vw, 44px); }

.b-pblock + .b-pblock { border-top: 1px solid var(--baris-line-dark-soft); }

.b-pblock:first-child { padding-top: 0; }

.b-pblock__eyebrow {
    margin: 0 0 6px;
    font-size: .70rem;
    letter-spacing: .10em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 255, 255, .55);
}

.b-pblock__title {
    margin: 0 0 12px;
    font-size: clamp(1.35rem, 2.1vw, 1.85rem);
    line-height: 1.22;
    letter-spacing: -.01em;
    color: #FFFFFF;
}

.b-pblock__text {
    margin: 0 0 12px;
    max-width: 68ch;
    color: rgba(255, 255, 255, .74);
    line-height: 1.62;
}

.b-pblock__text:last-of-type { margin-bottom: 18px; }

/* ---------- Hedef kullanıcı listesi ---------- */

.b-plist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    gap: 1px;
    background: var(--baris-line-dark-soft);
    border: 1px solid var(--baris-line-dark-soft);
}

.b-plist li {
    background: rgba(255, 255, 255, .022);
    padding: 16px 18px;
}

.b-plist strong {
    display: block;
    margin-bottom: 4px;
    font-size: .95rem;
    color: #FFFFFF;
}

.b-plist span {
    display: block;
    font-size: .88rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, .68);
}

/* ---------- Sayfa kapanış çağrısı ---------- */

.b-pcta {
    margin-top: clamp(32px, 4vw, 48px);
    padding: clamp(24px, 3vw, 34px);
    /* Koyu zemin üstünde ayrışsın diye bir tık daha derin yüzey. */
    background: var(--baris-black);
    border: 1px solid var(--baris-line-dark);
    border-radius: 4px;
}

.b-pcta__title {
    margin: 0 0 8px;
    font-size: clamp(1.15rem, 1.7vw, 1.4rem);
    line-height: 1.3;
    color: #FFFFFF;
}

.b-pcta__text {
    margin: 0 0 18px;
    max-width: 62ch;
    line-height: 1.6;
    color: rgba(255, 255, 255, .74);
}

/* ---------- Taslak önizleme bayrağı ---------- */

.b-preview-flag {
    margin: 0;
    padding: 12px var(--gutter);
    background: #7A4B00;
    color: #FFFFFF;
    font-size: .86rem;
    font-weight: 600;
    text-align: center;
}

/* ---------- Kaynak satırı ---------- */

.b-source--inline {
    margin-top: 20px;
    font-size: .80rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, .55);
    word-break: break-word;
}


/* --------------------------------------------------------------------------
   1023px VE ALTI — kenar çubuğu üstte açılır seçiciye dönüşür.
   768'de iki kolon ana metni sıkıştırır; 1024'te kompakt (212px) kenar çubuğu
   ile ana kolon ~680px kalır (bkz. C7). Karar ölçülen genişliğe dayanır.
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {

    .b-plyt__inner {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 24px;
    }

    .b-psidebar {
        position: static;      /* yapışkanlık kalkar: dar ekranda ekranı yer */
        top: auto;
    }

    /* Masaüstü listesi gizlenir, açılır seçici görünür. */
    .b-pnav { display: none; }

    .b-pnav-mobile {
        display: block;
        border: 1px solid var(--baris-line-dark);
        border-radius: 4px;
        background: rgba(255, 255, 255, .022);
    }

    .b-pnav-mobile > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 48px;      /* dokunma hedefi >= 44px */
        padding: 10px 16px;
        cursor: pointer;
        list-style: none;
    }

    .b-pnav-mobile > summary::-webkit-details-marker { display: none; }

    .b-pnav-mobile > summary::after {
        content: "";
        flex: 0 0 auto;
        width: 9px;
        height: 9px;
        border-right: 1.5px solid rgba(255, 255, 255, .55);
        border-bottom: 1.5px solid rgba(255, 255, 255, .55);
        transform: rotate(45deg) translateY(-2px);
        transition: transform .18s ease;
    }

    .b-pnav-mobile[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }

    .b-pnav-mobile__label {
        font-size: .70rem;
        letter-spacing: .10em;
        text-transform: uppercase;
        font-weight: 600;
        color: rgba(255, 255, 255, .55);
    }

    .b-pnav-mobile__current {
        flex: 1 1 auto;
        text-align: right;
        font-size: .92rem;
        font-weight: 600;
        color: #FFFFFF;
    }

    .b-pnav-mobile .b-pnav__list { margin: 0 16px; }

    .b-pnav-mobile .b-pnav__list a { padding: 13px 0; }   /* >= 44px hedef */

    .b-pnav-mobile .b-pnav__all { margin: 0 16px 16px; }
}

@media (max-width: 767px) {

    /* Dar ekranda ürün adı tek başına kalınca seçici olduğu anlaşılmıyordu:
       etiket üst satıra alınır, ad ve ok alt satırda kalır. */
    .b-pnav-mobile > summary { flex-wrap: wrap; padding-block: 8px; }

    .b-pnav-mobile__label { flex: 1 0 100%; order: -1; }

    .b-pnav-mobile__current { flex: 1 1 auto; text-align: left; }

    .b-plist { grid-template-columns: minmax(0, 1fr); }
}


/* ==========================================================================
===
   C3 — YAYINLANMIŞ KURUMSAL BELGE KARTI
   ==========================================================================
   .doc-slot dürüst BOŞ durumu (kesikli çerçeve) anlatır. Doğrulanmış bir
   belge yayınlandığında aynı ızgarada dolu kart görünümüne geçer: çerçeve
   kesikli olmaktan çıkar, metin kontrastı yükselir.
   ========================================================================== */

.doc-slot--filled {
    border-style: solid;
    border-color: var(--baris-line-dark);
    color: rgba(255, 255, 255, .72);
}

.doc-slot--filled .doc-slot__kind { color: rgba(255, 255, 255, .55); }
.doc-slot--filled .doc-slot__name { color: #FFFFFF; }

.doc-slot__desc {
    font-size: .8125rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, .66);
}

.doc-slot__link {
    margin-top: auto;
    font-size: .8125rem;
    font-weight: 600;
    color: #FFFFFF;
    text-decoration: none;
    border-bottom: 1px solid var(--baris-line-dark);
    padding-bottom: 2px;
}

.doc-slot__link:hover {
    color: var(--baris-red-onDark, #FF6B57);
    border-bottom-color: currentColor;
}


/* --------------------------------------------------------------------------
   C4 — AZ ÜRÜNLÜ MARKADA KOMPAKT KENAR ÇUBUĞU
   --------------------------------------------------------------------------
   Bir markanın yalnızca bir–iki detay ürünü olduğunda büyük gezinme kutusu
   sayfada boşluk gibi duruyordu. Kompakt biçimde kutu çerçevesi kalkar,
   liste sadeleşir; aile bağlantısı ve katalog bağlantısı korunur.
   -------------------------------------------------------------------------- */

.b-pnav--compact {
    border: 0;
    background: transparent;
    padding: 0;
}

.b-pnav--compact .b-pnav__list { border-top: 0; }

.b-pnav--compact .b-pnav__list li:last-child { border-bottom: 0; }


/* --------------------------------------------------------------------------
   C5 — ÇOK BOYUTLU KATALOG SÜZGECİ
   --------------------------------------------------------------------------
   Tek satırlık .b-filter düzenini, boyut başına bir satıra genişletir.
   Etiket sütunu dar ekranda üste geçer.
   -------------------------------------------------------------------------- */

.b-filter--multi {
    grid-column: 1 / -1;
    display: grid;
    gap: 12px;
}

.b-filter--multi .b-filter__row {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: baseline;
    gap: 8px 16px;
}

.b-filter--multi .b-filter__label {
    margin: 0;
    font-size: .70rem;
    letter-spacing: .10em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--baris-muted);
}

/* Koyu bölümde etiket: --baris-muted (#6F6F6F) koyu zeminde 3.18:1'e düşüyordu.
   Bu kural C1'deki genel koyu listeden DAHA SONRA geldiği için aynı özgüllükle
   onu eziyordu; düzeltme kuralın kendi yanında ve daha özgül tutulur. */
.b-section--dark .b-filter--multi .b-filter__label { color: rgba(255, 255, 255, .58); }

@media (max-width: 767px) {
    .b-filter--multi .b-filter__row { grid-template-columns: minmax(0, 1fr); }
}


/* ==========================================================================
   C6 — KIRMIZI NOKTA SİSTEMİ  (tek kaynak)
   ==========================================================================
   Barış kırmızısı 6px nokta, sitenin KÜÇÜK imzasıdır. Yalnızca şu yerlerde
   kullanılır: özellik/yetenek listeleri, hedef kullanıcı ve rol listeleri,
   önemli kısa listeler, kenar çubuğundaki aktif ürün.
   Paragraf, H2, düğme ve navbar öğelerine KONMAZ.
   Noktalar STATİKTİR — nabız yalnızca onaylı durum öğelerindedir
   (ör. "Güncel Kampanya" şeridi). Nokta CSS ile üretilir; veritabanı
   içeriğine madde işareti karakteri yazılmaz.
   ========================================================================== */

:root { --b-dot: 6px; }

.b-dots {
    grid-column: 1 / -1;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    column-gap: clamp(20px, 2.6vw, 36px);
}

.b-dots--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.b-dots > li {
    --dot-y: calc(.7rem + .8em);
    position: relative;
    padding: .7rem 0 .7rem 1.15rem;
    border-bottom: 1px solid var(--baris-line-soft);
    font-size: .9375rem;
    line-height: 1.6;
    color: var(--baris-muted);
}

.b-dots > li strong { color: var(--baris-ink); font-weight: 600; }
.b-dots > li strong + span::before { content: "— "; opacity: .6; }

.b-section--dark .b-dots > li { border-bottom-color: var(--baris-line-dark-soft); color: rgba(255, 255, 255, .70); }
.b-section--dark .b-dots > li strong { color: #FFFFFF; }

/* Ortak nokta — liste ailesi burada toplanır. */
.b-dots > li::before,
.b-capgroup__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: var(--dot-y, 1.1em);
    width: var(--b-dot);
    height: var(--b-dot);
    border-radius: 50%;
    background: var(--baris-red);
    transform: translateY(-50%);
    animation: none;
}

.b-section--dark .b-dots > li::before,
.b-section--dark .b-capgroup__list li::before { background: var(--baris-red-onDark); }

/* Yetenek grubu: eski 5×1 çizgi yerine aynı nokta. */
.b-capgroup__list li { --dot-y: calc(.4rem + .8em); }

/* Kenar çubuğunda aktif ürün: sol çizgi yerine aynı nokta. Renk tek
   ayırt edici değildir — ağırlık ve zemin de değişir. */
.b-pnav__list a.is-active {
    position: relative;
    padding-left: 16px;
    box-shadow: none;
}

.b-pnav__list a.is-active::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 50%;
    width: var(--b-dot);
    height: var(--b-dot);
    border-radius: 50%;
    background: var(--baris-red-onDark);
    transform: translateY(-50%);
}

@media (max-width: 767px) {
    .b-dots--2 { grid-template-columns: minmax(0, 1fr); }
}


/* --------------------------------------------------------------------------
   C7 — ÜRÜN DETAYI: SIKILIK VE GEZİNME
   -------------------------------------------------------------------------- */

/* Kenar çubuğu başlığı: marka kısa adı. Büyük harf CSS ile yapılır; lang="tr"
   sayesinde "Zirve" → "ZİRVE" doğru döner (PHP mb_strtoupper "ZIRVE" verir). */
.b-pnav__head { text-transform: uppercase; }

/* Yapışkan liste ekrandan taşmasın: kısa ekranda kendi içinde kayar. */
.b-pnav {
    max-height: calc(100vh - var(--nav-h-small) - 40px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.b-pnav__all::after { content: " →"; }

/* 1024–1199: kompakt kenar çubuğu, ana kolon okunur genişlikte kalır. */
@media (min-width: 1024px) and (max-width: 1199px) {
    .b-plyt__inner {
        grid-template-columns: 212px minmax(0, 1fr);
        column-gap: 28px;
    }
    .b-pnav { padding: 16px 14px; }
    .b-pnav__list a { font-size: .88rem; }
}

/* Künye: ana kolonun ilk öğesi — koyu, bütünleşik, ince ayraçlı. */
.b-pmain > .b-specs {
    margin: 0 0 clamp(8px, 1vw, 12px);
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    border: 1px solid var(--baris-line-dark);
    border-radius: 4px;
    background: rgba(255, 255, 255, .022);
}

.b-pmain > .b-specs .b-specs__row { padding: .8rem 1rem; }

.b-pmain > .b-specs + .b-pblock { border-top: 0; }

/* Ürün bölümleri içinde ızgara çocuğu kuralları nötr kalır. */
.b-pblock .b-dots { margin-top: 4px; }

/* İlgili ürünler — en fazla üç, kompakt satır. */
.b-prel {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
    gap: 1px;
    background: var(--baris-line-dark-soft);
    border: 1px solid var(--baris-line-dark-soft);
}

.b-prel__item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: 100%;
    padding: 14px 16px;
    background: var(--baris-surface-dark, #15161A);
    text-decoration: none;
    transition: background-color var(--dur) var(--ease);
}

.b-prel__item:hover { background: rgba(255, 255, 255, .04); text-decoration: none; }

.b-prel__kicker {
    font-size: .68rem;
    letter-spacing: .10em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 255, 255, .58);
}

.b-prel__name { font-size: .98rem; font-weight: 600; color: #FFFFFF; }
.b-prel__item:hover .b-prel__name { color: var(--baris-red-onDark); }

.b-prel__text { font-size: .85rem; line-height: 1.5; color: rgba(255, 255, 255, .68); }

/* Seçici altındaki aile + katalog bağlantıları tek satırda. */
.b-pnav__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 16px;
    margin: 12px 16px 14px;
}

.b-pnav-mobile .b-pnav__links .b-pnav__back,
.b-pnav-mobile .b-pnav__links .b-pnav__all { margin: 0; }

/* YAPIŞKANLIK ÖN KOŞULU: şablonun .page { overflow:hidden } kuralı .page'i
   kaydırma kabı yapıyor ve position:sticky hiç devreye girmiyordu (ölçüm:
   kenar çubuğu içerikle birlikte kayıyordu). overflow:clip aynı yatay
   kırpmayı kaydırma kabı OLUŞTURMADAN yapar. Desteklemeyen eski tarayıcıda
   eski davranış (hidden) sürer. */
@supports (overflow: clip) {
    .page { overflow: clip; }
}


/* ==========================================================================
   C8 — ÇÖZÜM AİLE DÜZENİ  (seçenekler önce, detay sonra)
   ==========================================================================
   Aile düzenindeki sayfa: kompakt hero → .b-plyt--family (sol yapışkan
   yerel menü + sağda bloklar). Bloklar tam genişlik bölüm yerine .b-fsec
   olarak basılır; ortak koyu zemini paylaşır, ince ayraçla ayrılır.
   Aşağıdaki kurallar tam genişlik bileşenlerin dar ana kolondaki
   karşılığıdır — yeni renk katmanı YAZILMAZ.
   ========================================================================== */

/* ---------- Kompakt hero: kimlik verir, seçenekleri ilk ekrana bırakır ---------- */
.b-page-hero--compact {
    padding-top: calc(var(--nav-h) + clamp(1.25rem, 2.4vw, 2.25rem));
    padding-bottom: clamp(1.75rem, 2.8vw, 2.5rem);
}
.b-page-hero--compact .b-page-hero__title { font-size: clamp(2rem, 3vw, 2.75rem); }
.b-page-hero--compact .b-page-hero__tagline { margin-top: .5rem; }
.b-page-hero--compact .b-page-hero__lead { margin-top: 1rem; font-size: 1rem; line-height: 1.65; }
.b-page-hero--compact .b-page-hero__actions { margin-top: 1.4rem; }
.b-page-hero--compact .b-page-hero__visual .b-visual { min-height: clamp(220px, 19vw, 300px); }

@media (max-width: 767px) {
    /* Dar ekranda ikinci düğme ve dekoratif görsel seçenekleri aşağı itmesin. */
    .b-page-hero--compact .b-page-hero__actions .b-btn:not(.b-btn--primary) { display: none; }
    .b-page-hero--compact .b-page-hero__visual { display: none; }
    .b-page-hero--compact .b-page-hero__tagline { display: none; }
}

/* ---------- Düzen ---------- */
.b-plyt--family { padding-block: clamp(28px, 3.4vw, 48px) clamp(40px, 5vw, 72px); }
.b-plyt--nonav .b-plyt__inner { grid-template-columns: minmax(0, 1fr); }

.b-fsec { scroll-margin-top: calc(var(--nav-h-small) + 16px); }
.b-fmain > .b-fsec:first-child { padding-top: 0; }
.b-fsec__head { margin-bottom: 20px; }
.b-fsec__head .b-pblock__text { margin-bottom: 8px; }
.b-fsec__head .b-pblock__text:last-child { margin-bottom: 0; }
.b-fsec__num { margin-right: .7em; color: var(--baris-red-onDark); }
.b-fsec .b-pblock__title { max-width: 32ch; }

/* ---------- Bileşenlerin dar kolon karşılıkları ---------- */
.b-fmain .b-capability-grid,
.b-fmain .b-capability-grid--2,
.b-fmain .b-capability-grid--4 {
    grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
    row-gap: 1.75rem;
    margin-top: 0;
}
.b-fmain .b-process { margin-top: 0; }
.b-fmain .b-process--4,
.b-fmain .b-process--5 { grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); row-gap: 1.5rem; }
.b-fmain .b-facts { margin-top: 12px; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.b-fmain .b-brand-list,
.b-fmain .b-related,
.b-fmain .b-decide,
.b-fmain .b-pcards,
.b-fmain .b-modgrid,
.b-fmain .b-subproducts,
.b-fmain .b-capgroups { margin-top: 0; }
.b-fmain .b-brand-blocks { margin-top: 0; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.b-fmain .b-brand-blocks--1 { grid-template-columns: minmax(0, 1fr); }
.b-fmain .b-split__visual,
.b-fmain .b-split__visual--right { grid-column: auto; grid-row: auto; margin: 0 0 20px; }
.b-fmain .b-split__visual .b-visual { min-height: clamp(220px, 22vw, 320px); }
.b-fmain .b-split__body,
.b-fmain .b-split__body--left { grid-column: auto; grid-row: auto; }
.b-fmain .b-split__body p { margin-top: .9rem; font-size: 1rem; line-height: 1.65; }
.b-fmain .b-modgrid + .b-modnote,
.b-fmain .b-pcards + .b-modgrid { margin-top: 22px; }
.b-modgrid--anchored .b-modgroup { scroll-margin-top: calc(var(--nav-h-small) + 16px); }
.b-fmain > .b-source { margin: 28px 0 0; font-size: .8rem; }

/* ---------- Yerel menü ekleri ---------- */
.b-pnav__overview a { font-weight: 600; }
.b-pnav__sublabel {
    margin: 16px 0 4px;
    font-size: .68rem;
    letter-spacing: .10em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 255, 255, .5);
}
.b-pnav__list--sub { border-top: 0; }
.b-pnav__list--sub li { border-bottom: 0; }
.b-pnav__list--sub a { padding: 6px 0 6px 12px; font-size: .86rem; }
.b-pnav-mobile .b-pnav__subitem a { padding-left: 14px; font-size: .88rem; }

/* Okunan bölüm (scrollspy): aktif öğeyle aynı nokta. */
.b-pnav__list a.is-spy { position: relative; padding-left: 16px; color: #FFFFFF; }
.b-pnav__list a.is-spy::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 50%;
    width: var(--b-dot);
    height: var(--b-dot);
    border-radius: 50%;
    background: var(--baris-red-onDark);
    transform: translateY(-50%);
}

/* ---------- SEÇENEK KARTLARI (hizmet · platform · e-belge · yetenek) ---------- */
.b-options {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr));
    gap: 1px;
    background: var(--baris-line-dark-soft);
    border: 1px solid var(--baris-line-dark-soft);
}
.b-options > li { display: flex; }
.b-option {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
    padding: 16px 40px 16px 18px;
    background: var(--baris-surface-dark);
    text-decoration: none;
    transition: background-color var(--dur) var(--ease);
}
.b-option--link:hover,
.b-option--link:focus-visible { background: rgba(255, 255, 255, .045); text-decoration: none; }
.b-option__meta {
    font-size: .68rem;
    letter-spacing: .10em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 255, 255, .55);
}
.b-option__name {
    position: relative;
    padding-left: 14px;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
    color: #FFFFFF;
}
.b-option__name::before {
    content: "";
    position: absolute;
    left: 0;
    top: .68em;
    width: var(--b-dot);
    height: var(--b-dot);
    border-radius: 50%;
    background: var(--baris-red-onDark);
    transform: translateY(-50%);
}
.b-option--link:hover .b-option__name { color: var(--baris-red-onDark); }
.b-option__text { padding-left: 14px; font-size: .875rem; line-height: 1.5; color: rgba(255, 255, 255, .66); }
.b-option__go {
    position: absolute;
    right: 18px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-top: 1.5px solid rgba(255, 255, 255, .45);
    border-right: 1.5px solid rgba(255, 255, 255, .45);
    transform: translateY(-50%) rotate(45deg);
}
.b-option--link:hover .b-option__go { border-color: var(--baris-red-onDark); }

/* Seçenek kartları — ara boşluklu düzen: son satırda eksik hücre kaldığında
   ızgara zemini gri kutu olarak görünmez. Bağlam etiketi kartın ALTINDA
   durur; adlar tüm kartlarda aynı hizada kalır. */
.b-options { gap: 10px; background: transparent; border: 0; }
.b-option { border: 1px solid var(--baris-line-dark-soft); border-radius: 3px; }
.b-option--link:hover,
.b-option--link:focus-visible { border-color: var(--baris-line-dark); }
.b-option__meta { order: 3; margin-top: auto; padding: 6px 0 0 14px; }

/* Kompakt hero ince ayar: koyu varyantta sağ taraf boş olduğu için özet
   daha geniş satırda akar (satır sayısı azalır); dar ekranda üst etiket ve
   marka notu gizlenir, marka logosu kimlik olarak kalır. */
.b-page-hero--compact:not(.b-page-hero--photo) .b-page-hero__col { grid-column: 1 / span 9; }
.b-page-hero--compact .b-page-hero__lead { max-width: 78ch; }
@media (max-width: 767px) {
    .b-page-hero--compact .b-eyebrow { display: none; }
    .b-page-hero--compact .b-tech-mark__ctx { display: none; }
}
@media (max-width: 767px) {
    /* Marka kimliği başlıkta zaten var; logo satırı seçenekleri aşağı itmesin. */
    .b-page-hero--compact .b-tech-mark { display: none; }
    .b-page-hero--compact .b-page-hero__lead { font-size: .95rem; line-height: 1.6; margin-top: .8rem; }
    .b-page-hero--compact .b-page-hero__actions { margin-top: 1.1rem; }
    .b-fsec__head .b-pblock__text { font-size: .95rem; line-height: 1.6; }
}
@media (max-width: 1024px) {
    /* ≤1024'te fotoğraflı hero görseli metnin ALTINA yığılıp seçenekleri
       bir ekran aşağı itiyordu; kompakt hero'da gizlenir. */
    .b-page-hero--compact .b-page-hero__visual { display: none; }
}

/* ==========================================================================
   C9 — KIRMIZI KAPANIŞ NOKTASI (editoryal başlık imzası)
   ==========================================================================
   Büyük başlık cümlesi beyaz kalır; YALNIZCA kapanış noktası Barış
   kırmızısıdır. Kural yalnızca RENK tanımlar: boyut, ağırlık, taban çizgisi
   ve harf aralığı başlıktan devralınır; nokta son kelimeden kopmaz (araya
   boşluk girmez, kendi satırına düşmez). Gövde metni, blog ve form
   noktalarına UYGULANMAZ. Onaylı eski işaret .hero__dot ile aynı renktedir.
   ========================================================================== */

.b-red-period,
.hero__dot {
    display: inline;
    color: var(--baris-red);
    font: inherit;
    letter-spacing: inherit;
}

/* CMS feature flag: restrained emphasis, no logo plates. */
.eco__item--featured .brand-mark { transform: scale(1.04); }
.eco__item > span { display:flex; align-items:center; }

/* Media art direction: retain the photographic subject on compact page heroes. */
@media (max-width: 1024px) {
    .b-page-hero--compact.b-page-hero--photo .b-page-hero__visual {
        display: block;
        grid-column: 1 / -1;
        margin: 20px 0 0;
    }
    .b-page-hero--compact.b-page-hero--photo .b-page-hero__visual .b-visual {
        min-height: 0;
        height: clamp(175px, 38vw, 300px);
    }
}

/* ==========================================================================
   HIZLI GEZİNME — yerel göstergeler
   --------------------------------------------------------------------------
   Tam sayfa yükleme ekranı YOKTUR. Ağ 250 ms'yi aşarsa yalnızca ince bir
   ilerleme çizgisi görünür; içerik yerinde kalır, yüksekliği korunur, üst
   menü ve yerel menü engellenmez.
   ========================================================================== */
.b-sr-only {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0; border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden; white-space: nowrap;
}

.b-inav-bar {
    position: fixed;
    top: 0; left: 0;
    height: 2px; width: 0;
    background: var(--baris-red);
    z-index: 9000;
    opacity: 0;
    pointer-events: none;
    transition: opacity .12s linear;
}
.b-inav-bar.is-on {
    opacity: 1;
    animation: b-inav-ilerle 1.6s var(--ease-out, ease-out) forwards;
}
@keyframes b-inav-ilerle {
    0%   { width: 0; }
    40%  { width: 55%; }
    75%  { width: 80%; }
    100% { width: 92%; }
}

/* İçerik değişirken: beyaz delik yok, yalnızca hafif soluklaşma. */
#icerik.is-inav-busy {
    opacity: .6;
    transition: opacity .1s linear;
}
#icerik {
    transition: opacity .16s var(--ease-out, ease-out);
}

@media (prefers-reduced-motion: reduce) {
    .b-inav-bar.is-on { animation: none; width: 40%; }
    #icerik, #icerik.is-inav-busy { transition: none; opacity: 1; }
}

/* View Transitions destekleyen tarayıcıda çok ölçülü geçiş. */
@media (prefers-reduced-motion: no-preference) {
    ::view-transition-old(root) { animation: b-inav-cik .09s ease-in both; }
    ::view-transition-new(root) { animation: b-inav-gir .16s ease-out both; }
}
@keyframes b-inav-cik { to { opacity: .6; } }
@keyframes b-inav-gir { from { opacity: .4; } to { opacity: 1; } }

/* ==========================================================================
   BÖLÜM 08 — SÜZGEÇLİ ÇÖZÜM EKOSİSTEMİ
   --------------------------------------------------------------------------
   İki sabit logo satırı yerine TEK etkileşimli alan: üstte Yazılım / Donanım
   süzgeci, altında yavaşça akan şerit. Şeritte hem markalar hem gerçek
   ürünler bulunur; ikisi küçük meta yazısıyla ayrışır.

   Logolar olduğu gibi kalır: renk değişmez, ters çevrilmez, beyaz/gri plaka
   konmaz. Koyu logoların okunması için YALNIZCA logonun arkasına yumuşak,
   sınırı belli olmayan sıcak bir ışık serpilir.
   ========================================================================== */
.eco { display: block; }

/* ---------- Süzgeç ---------- */
.eco__filter {
    display: inline-flex;
    gap: 2px;
    padding: 3px;
    margin: 0 0 28px;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 999px;
    background: rgba(255, 255, 255, .03);
}
.eco__tab {
    appearance: none;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, .62);
    font: inherit;
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 11px 22px;
    min-height: 44px;              /* dokunma hedefi */
    border-radius: 999px;
    cursor: pointer;
    transition: color .18s var(--ease-out, ease), background-color .18s var(--ease-out, ease);
}
.eco__tab:hover { color: #fff; }
.eco__tab.is-active {
    background: var(--baris-red);
    color: #fff;
}
.eco__tab:focus-visible {
    outline: 2px solid var(--baris-red-onDark, #E86A57);
    outline-offset: 2px;
}

/* ---------- Panel geçişi ---------- */
.eco__panel { opacity: 1; transition: opacity .16s var(--ease-out, ease); }
.eco__panel.is-fading { opacity: 0; }
.eco__empty { color: rgba(255, 255, 255, .55); font-size: .95rem; margin: 6px 0 0; }

/* ---------- Şerit ---------- */
.eco__rail {
    position: relative;
    overflow: hidden;
    /* Kenarlarda sert kesim yerine yumuşak geçiş. */
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
            mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.eco__track {
    display: flex;
    align-items: stretch;
    gap: 14px;
    margin: 0;
    padding: 4px 0;
    list-style: none;
    width: max-content;
    will-change: transform;
    animation: eco-kay var(--eco-sure, 45s) linear infinite;
}
@keyframes eco-kay {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(-50%, 0, 0); }   /* ikinci kopyanın başı */
}
/* Üzerine gelince ve klavye odağında yavaşlar: bağlantıya tıklamak kolay olsun. */
.eco__rail:hover .eco__track,
.eco__rail:focus-within .eco__track { animation-play-state: paused; }

/* ---------- Öğe ---------- */
.eco__item { display: flex; }
.eco__link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 18px 12px 12px;
    min-height: 56px;
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    border: 1px solid transparent;
    transition: border-color .18s var(--ease-out, ease), background-color .18s var(--ease-out, ease);
}
a.eco__link:hover,
a.eco__link:focus-visible {
    border-color: rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .03);
}

/* Logo: plaka YOK; yalnızca arkasında yumuşak ışık. */
.eco__logo {
    position: relative;
    flex: none;
    width: 76px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.eco__logo img {
    position: relative;
    max-width: 100%;
    max-height: 30px;
    width: auto;
    height: auto;
    object-fit: contain;
    opacity: 1;                    /* resmî logo: solukluk/hiyerarşi yok */
}
.eco__logo-text {
    position: relative;
    font-weight: 700;
    color: rgba(255, 255, 255, .72);
    letter-spacing: .04em;
}

.eco__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eco__name {
    color: #fff;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: -.005em;
    white-space: nowrap;
}
.eco__meta {
    color: rgba(255, 255, 255, .50);
    font-size: .72rem;
    letter-spacing: .07em;
    text-transform: uppercase;
    white-space: nowrap;
}
/* Marka ile ürün aynı şeritte: marka etiketi kırmızı ipucu alır. */
.eco__item--brand .eco__meta { color: var(--baris-red-onDark, #E86A57); }

@media (max-width: 767px) {
    .eco__filter { margin-bottom: 20px; }
    .eco__logo { width: 62px; height: 34px; }
    .eco__logo img { max-height: 24px; }
    .eco__link { padding: 10px 14px 10px 10px; gap: 10px; }
    .eco__name { font-size: .9rem; }
}

/* Hareket azaltma: şerit durur, içerik elle kaydırılabilir kalır. */
@media (prefers-reduced-motion: reduce) {
    .eco__track { animation: none; width: auto; flex-wrap: nowrap; }
    .eco__rail {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        -webkit-mask-image: none;
                mask-image: none;
    }
    .eco__panel { transition: none; }
}

/* ==========================================================================
   BÖLÜM 08 — KOYU BÖLÜM + TEK AÇIK VİTRİN ŞERİDİ
   --------------------------------------------------------------------------
   Bölüm sitenin koyu gövdesinin İÇİNDE kalır; yalnızca logoların AKTIĞI
   şerit açıktır. Kırmızı tam zemin olarak DEĞİL, yalnızca vurgu olarak
   kullanılır (bölüm numarası, çizgi, etkin süzgeç alt çizgisi, nokta).

   Ton seçimi komşularla sürekliliğe göre: 07 grafit (#191817), 09 sıcak
   koyu (#201C1B). 08 ikisinin arasındaki grafit katmanını (#1E1C1B)
   kullanır; böylece sınırlar sert düşmez, uydurma bir siyah girmez.

   Öğeler arasında dikey ayraç yoktur; ürün TEK <a> içinde logo + kısa ad
   taşır ve dikey kompozisyonla dizilir.
   ========================================================================== */
#ekosistem.partner-rail {
    --eco-ray: #F7F3EB;          /* şeridin açık yüzeyi */
    --eco-ink: #25231F;          /* açık şerit üzerindeki koyu grafit yazı */
    --eco-ink-soft: #55504A;
    --eco-on-dark: #F4F1EC;      /* koyu zeminde sıcak beyaz başlık */
    --eco-on-dark-soft: rgba(244, 241, 236, .62);
    padding-top: clamp(1.6rem, 2.9vw, 2.4rem);
    padding-bottom: clamp(1.6rem, 2.9vw, 2.4rem);
    background: var(--baris-graphite-2);
    color: var(--eco-on-dark);
    /* 07 ve 09 da koyu: sınır, tam genişlikte kırmızı bant yerine çok
       düşük opaklıkta ince bir çizgiyle belirtilir. */
    border-top: 1px solid rgba(255, 255, 255, .05);
    border-bottom: 1px solid rgba(255, 255, 255, .05);
    box-shadow: none;
}

/* ---- Koyu zemindeki yazı ---- */
#ekosistem .partner-rail__title { color: var(--eco-on-dark); margin-bottom: 0; }
#ekosistem .partner-rail__label { color: var(--eco-on-dark-soft); }
/* Üst etiket bloğu 100 piksel yer kaplıyordu; bölümdeki ölü boşluğun
   büyük kısmı buradan geliyordu. .section-index'in 1.75rem alt boşluğu
   YALNIZCA bu bölümde kısaltılır. */
#ekosistem .partner-rail__label .section-index { margin-bottom: .35rem; }
/* Kırmızı yeniden VURGU: bölüm numarası ve kısa çizgi. */
#ekosistem .section-index__num { color: var(--baris-red-onDark, #E86A57); }
#ekosistem .section-index::before { background: var(--baris-red); }
#ekosistem .section-index > span:not(.section-index__num) { color: var(--eco-on-dark-soft); }
/* Koyu zeminde paylaşılan kırmızı nokta kuralı geçerli; yerel geçersiz
   kılmaya gerek yok (kırmızı dönem zemine karşı okunuyor). */

/* 08 → 09 sınırı: .cta kendi üstünde 3 piksellik tam genişlikte kırmızı
   bant taşıyor (css/baris.css). 08 kremken bu bant iki yüzeyi ayıran bir
   aksandı; 08 koyulaşınca iki koyu bölüm arasında parlak bir çizgiye
   dönüştü. Yalnızca BU komşulukta ince, düşük opaklıklı bir çizgiye
   indirilir — .cta'nın diğer sayfalardaki kullanımı değişmez. */
#ekosistem + .b-section--dark.cta::before {
    height: 1px;
    background: rgba(255, 255, 255, .06);
}

/* ---- Masaüstü: başlık solda, süzgeç aynı başlık bandının sağ altında ----
   .eco display:contents ile kendi çocuklarını üst ızgaraya bırakır; böylece
   işaretleme değişmeden süzgeç başlıkla aynı satıra girer. */
@media (min-width: 992px) {
    #ekosistem .partner-rail__inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 48px;
        align-items: end;
    }
    #ekosistem .partner-rail__label { grid-column: 1; grid-row: 1; }
    #ekosistem .partner-rail__title { grid-column: 1; grid-row: 2; }
    #ekosistem .eco { display: contents; }
    #ekosistem .eco__filter {
        grid-column: 2;
        grid-row: 2;
        justify-self: end;
        align-self: end;
        margin: 0;
    }
    #ekosistem .eco__panel { grid-column: 1 / -1; grid-row: 3; margin-top: 18px; }
}

/* ---- Süzgeç: kırmızının üstünde sade alt çizgi ---- */
#ekosistem .eco__filter {
    border: 0;
    background: none;
    border-radius: 0;
    padding: 0;
    gap: 26px;
    margin: 0 0 16px;
}
#ekosistem .eco__tab {
    color: rgba(244, 241, 236, .58);
    background: none;
    border-radius: 0;
    padding: 10px 2px;
    border-bottom: 2px solid transparent;
    transition: color .18s var(--ease-out, ease), border-color .18s var(--ease-out, ease);
}
#ekosistem .eco__tab:hover { color: var(--eco-on-dark); }
/* Etkin sekme: beyaz yazı + Barış kırmızısı alt çizgi. Hap/beyaz zemin yok. */
#ekosistem .eco__tab.is-active {
    background: none;
    color: #fff;
    border-bottom-color: var(--baris-red);
}
#ekosistem .eco__tab:focus-visible {
    outline: 2px solid var(--baris-red-onDark, #E86A57);
    outline-offset: 2px;
}

/* ---- Açık şerit: TEK sürekli vitrin yüzeyi ----
   Kenar yumuşatma maskeyle değil şeridin kendi rengindeki geçişle yapılır;
   maske kullanılsaydı açık zemin de kenarlarda saydamlaşırdı. */
#ekosistem .eco__rail {
    position: relative;
    background: var(--eco-ray);
    border-radius: 14px;
    padding: 14px 0;
    -webkit-mask-image: none;
            mask-image: none;
}
#ekosistem .eco__rail::before,
#ekosistem .eco__rail::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 72px;
    pointer-events: none;
    z-index: 2;
}
#ekosistem .eco__rail::before {
    left: 0;
    border-radius: 14px 0 0 14px;
    background: linear-gradient(90deg, var(--eco-ray) 38%, rgba(247, 243, 235, 0));
}
#ekosistem .eco__rail::after {
    right: 0;
    border-radius: 0 14px 14px 0;
    background: linear-gradient(270deg, var(--eco-ray) 38%, rgba(247, 243, 235, 0));
}

/* ---- Öğe: ayraç YOK, kart YOK; ayırıcı yalnızca boşluk ---- */
#ekosistem .eco__track { gap: 0; padding: 0; }
#ekosistem .eco__item + .eco__item { border-left: 0; }
#ekosistem .eco__link,
#ekosistem .eco__item + .eco__item .eco__link {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    min-width: 168px;
    padding: 0 30px;
    min-height: 70px;
    border: 0;
    background: none;
    border-radius: 0;
    text-align: center;
}
/* Logo biraz daha baskın; oran korunur, markalar eşit genişliğe zorlanmaz.
   Kapsayıcıya AÇIK genişlik verilir: genişlik auto bırakılınca img'deki
   max-width:100% dairesel referansa düşüyor ve logolar 0 piksele çöküyordu. */
#ekosistem .eco__logo { width: 152px; height: 38px; }
#ekosistem .eco__logo img { max-width: 100%; max-height: 36px; width: auto; height: auto; }
#ekosistem .eco__name {
    color: var(--eco-ink);
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: -.005em;
}
/* Marka öğesinde ad basılmaz; logo kendiliğinden dikey ortalanır,
   altında boş yazı satırı ayrılmaz. */

#ekosistem .eco__empty {
    color: var(--eco-ink-soft);
    background: var(--eco-ray);
    border-radius: 14px;
    margin: 0;
    padding: 34px 28px;
}
#ekosistem .eco__logo-text { color: var(--eco-ink-soft); }
/* Hover: şerit bir gezinme bileşeni değil, görsel vitrin. Kaldırma, ölçek,
   kart ve CTA yok; yalnızca çok hafif bir optik vurgu. */
#ekosistem a.eco__link:hover,
#ekosistem a.eco__link:focus-visible {
    border: 0;
    background: none;
    transform: none;
    opacity: .78;
}
#ekosistem a.eco__link { transition: opacity .2s var(--ease-out, ease); }
/* Logolar olduğu gibi: plaka, ışık, filtre, saydamlık yok. */
#ekosistem .eco__logo { background: none; }
#ekosistem .eco__logo::before,
#ekosistem .eco__logo::after { content: none; }
#ekosistem .eco__logo img { filter: none; opacity: 1; mix-blend-mode: normal; }

@media (max-width: 991px) {
    /* Mobil/tablet: doğal yığın — başlık, süzgeç, şerit alt alta.
       .eco'nun 40 piksellik üst boşluğu ızgaranın 28 piksellik satır
       aralığıyla üst üste binip başlıkla süzgeç arasında 68 piksellik
       ölü alan bırakıyordu. */
    #ekosistem .eco { margin-top: 0; }
    #ekosistem .eco__filter { margin-bottom: 18px; }
    #ekosistem .eco__rail { padding: 22px 0; }
    #ekosistem .eco__link { min-width: 148px; padding: 0 22px; min-height: 78px; }
    #ekosistem .eco__logo { width: 124px; height: 36px; }
    #ekosistem .eco__logo img { max-height: 32px; }
}

@media (prefers-reduced-motion: reduce) {
    #ekosistem a.eco__link { transition: none; }
}