/*==========================================================================
   nav2.css — Apple tarzı ince üst menü + düz zemin + footer tipografisi
   --------------------------------------------------------------------
   (Sayfa kabuğu: menü ve footer `.home2` sarmalayıcısının DIŞINDA kaldığı
   için burada, body sınıfına göre kapsanıyorlar.)
   TAMAMI body.nav2-page altında kapsanmıştır. Bu sınıf _Layout.cshtml'de
   YALNIZCA Home/Index için basılır; diğer sayfalar eski menüyle devam eder.
   Siteye yaymak için _Layout'taki koşulu kaldırmak yeterli.
   Geri alma: bu dosyayı sil + _Layout'taki <link> ve body sınıfını kaldır.
   ========================================================================== */

/* Dekoratif body arkaplanı (images/background.svg — sarı blok + gri köşe)
   Apple'ın düz zeminiyle çakışıyor, ana sayfada kapatılıyor. */
body.nav2-page {
    background-image: none;
    background-color: #fff;
}

/*--------------------------------------------------------------------------
  Çubuk: tam genişlik, yarı saydam, bulanık, yapışkan
  --------------------------------------------------------------------------*/
body.nav2-page .header {
    position: sticky;
    top: 0;
    z-index: 1000;
    padding: 0;
    /* token setindeki "nav elevated" yüzeyi: #fafafc + blur */
    background: rgba(250, 250, 252, .82);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
    border-bottom: 1px solid rgba(0,0,0,.07);
}

    body.nav2-page .header .container-fluid {
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 24px;
    }

    body.nav2-page .navbar {
        background: transparent;
        border-radius: 0;
        padding: 0;
        min-height: 44px; /* Apple global nav: 44px */
        flex-wrap: nowrap;
        gap: 0;
    }

/* logo küçülür */
body.nav2-page .logo {
    display: flex;
    align-items: center;
    height: 44px;
    width: auto;
    min-width: 0; /* temada 240px sabitlenmiş */
}

/* <object> öğesinin kutusu temada 240px; içindeki çizim ~130px olduğu için
   mobilde logo + menü düğmesi tek satıra sığmıyordu. Kutu daraltıldı. */
body.nav2-page .documenoslogo {
    height: 26px;
    width: 170px;
    min-width: 0;
}

/* Bayrak main.js'te satır içi `max-height:1.8rem` ile basılıyor;
   satır içi bildirimi ancak !important ezebiliyor. */
body.nav2-page #spanLocaleName img {
    max-height: 1.25rem !important;
}

/* Menü öğeleri sayfanın TAM ortasında dursun: yanlardaki iki blok (logo ve
   dil seçici) eşit genişlik alıyor, ortadaki blok kendi boyunda kalıyor.
   Sadece ortaya `flex:1` vermek yetmiyor — logo ile dil bloğu farklı
   genişlikte olduğu için menü sola kayıyordu. */
body.nav2-page .logo {
    flex: 1 1 0;
}

body.nav2-page .navbar-collapse:first-of-type {
    flex: 0 0 auto;
    justify-content: center;
}

body.nav2-page .navbar-collapse:last-of-type {
    flex: 1 1 0;
    justify-content: flex-end;
}

body.nav2-page .navbar-nav {
    gap: 34px;
    align-items: center;
}

    /* Apple: küçük punto, kalın değil, BÜYÜK HARF DEĞİL */
    body.nav2-page .navbar-nav .menu-item a {
        /* Apple 12px/400 kullanıyor ama o SF Pro; Outfit aynı ölçüde daha
           ince ve geniş duruyor, menü sitenin geri kalanından kopuk görünüyordu.
           14/500 dengeyi kuruyor — hâlâ ince, ama aynı ailenin sesi. */
        font-size: 15px;
        font-weight: 500;
        line-height: 1;
        letter-spacing: 0;
        /* xlsx'te bazı menü etiketleri BÜYÜK HARF ("ÖZELLİKLER"), bazıları
           değil. Sözlük salt-okunur olduğu için cümle düzenine burada
           çevriliyor: önce tamamı küçük, sonra ilk harf büyük. <html lang>
           tanımlı olduğundan tarayıcı Türkçe İ/ı kuralını doğru uygular. */
        text-transform: lowercase;
        color: var(--nav-ink, #1C274C);
        opacity: .85;
        padding: 15px 0;
        transition: opacity .2s ease;
    }

        body.nav2-page .navbar-nav .menu-item a::first-letter {
            text-transform: uppercase;
        }

        body.nav2-page .navbar-nav .menu-item a:hover {
            opacity: 1;
        }

/* alt menü başlıkları sözlükteki hâliyle kalsın */
body.nav2-page .sub-menu .menu-item a {
    text-transform: none;
}

/* açılır ok işareti yeni yükseklikle hizalanır */
body.nav2-page .navbar-nav > .menu-item.menu-item-has-children > a {
    padding-right: 13px;
}

    body.nav2-page .navbar-nav > .menu-item.menu-item-has-children > a::after {
        top: 19px;
        opacity: .5;
    }

/*--------------------------------------------------------------------------
  Açılır paneller
  --------------------------------------------------------------------------*/
body.nav2-page .sub-menu {
    padding: 18px 8px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(0,0,0,.14);
    min-width: 260px;
}

    /* Modüller (13) ve Özellikler (19) uzun listeler — iki sütun.
       Dil menüsünün kendi inline style'ı var, :not([style]) onu dışta bırakır. */
    body.nav2-page .sub-menu:not([style]) {
        column-count: 2;
        column-gap: 8px;
        min-width: 560px;
    }

    body.nav2-page .sub-menu .menu-item {
        break-inside: avoid;
    }

        body.nav2-page .sub-menu .menu-item:not(:last-child) {
            margin-bottom: 2px;
        }

        body.nav2-page .sub-menu .menu-item a {
            display: block;
            font-size: 14px;
            padding: 8px 14px;
            border-radius: 10px; /* token: links 10px */
            opacity: .9;
        }

            body.nav2-page .sub-menu .menu-item a:hover {
                background: #e8e8ed; /* cool wash */
                transform: none; /* eski 5px kaydırma iptal */
                opacity: 1;
            }

/* dil seçici */
body.nav2-page #spanLocaleName {
    font-size: 12.5px;
}

/*--------------------------------------------------------------------------
  Mobil
  --------------------------------------------------------------------------*/
@media (max-width: 991px) {
    body.nav2-page .sub-menu:not([style]) {
        column-count: 1;
        min-width: 260px;
    }

    /* Açılan mobil menü bir panel; masaüstü için verdiğim şeffaf zemin
       burada paneli görünmez yapıyordu. */
    body.nav2-page .navbar {
        background: #fff;
        padding: 10px 18px 16px;
        border-radius: 0 0 18px 18px;
    }

    /* İki panel (menü + dil) temada da mobilde üst üste biniyor ve dil
       paneli "Ana sayfa" satırını örtüyordu. Akışa alınıp alt alta
       diziliyorlar; menü paneli üstte, dil seçici altta. */
    body.nav2-page .navbar {
        flex-wrap: wrap;
    }

    /* Kapalı panel tema tarafından translateX ile kenara kaydırılıyor;
       o hâlde akışa girerse düğmenin üstüne biner. Bu yüzden yalnızca
       AÇIKKEN (.is-active) akışa alınıyor. */
    body.nav2-page .navbar-collapse.is-active {
        position: static;
        width: 100%;
        flex: 0 0 100%;
    }

    body.nav2-page .navbar-collapse.is-active:first-of-type {
        justify-content: flex-start;
        order: 2;
    }

    body.nav2-page .navbar-collapse.is-active:last-of-type {
        order: 3;
        margin-top: 8px;
        padding-top: 12px;
        border-top: 1px solid #d6d6d6;
    }

    body.nav2-page .navbar-nav {
        gap: 6px;
        align-items: stretch;
    }

        body.nav2-page .navbar-nav .menu-item a {
            font-size: 15px;
            padding: 11px 0;
        }

    body.nav2-page .navbar-toggler {
        border: 0;
        box-shadow: none;
    }
}

/*--------------------------------------------------------------------------
  Footer — tipografi ölçeği sayfanın geri kalanına eşitleniyor.
  Temadaki ölçek çok iri (slogan 70/80, sütun başlığı 30, bağlantı 18) ve
  yeni sayfanın yanında bağıra bağıra duruyordu. Değerler home2.css'teki
  ölçekten alındı: bölüm başlığı = .home2__title, bağlantı = caption 14px.
  Zemin fotoğrafına ve %65 karartmaya DOKUNULMADI — o ayrı bir karar.
  --------------------------------------------------------------------------*/
body.nav2-page .footer-two {
    padding-top: 84px;
}

    /* Slogan: "Documenos'u Tanıyın" başlığıyla birebir aynı ölçek.
       Temada üç ayrı kırılımda (70 / 50 / 34) sabit punto var; clamp
       tek kuralda karşılıyor, seçici daha özel olduğu için hepsini ezer. */
    body.nav2-page .footer-two > h2 {
        font-size: clamp(26px, 2.6vw, 32px);
        line-height: 1.14;
        font-weight: 600;
        letter-spacing: 0.007em;
        max-width: 860px;
    }

body.nav2-page .footer__social {
    padding: 36px 20px;
    gap: 12px;
}

    /* daireler 60px idi; 32px'lik sloganın yanında ondan iri kalıyordu */
    body.nav2-page .footer__social a {
        width: 44px;
        height: 44px;
    }

        body.nav2-page .footer__social a img {
            height: 18px;
        }

/* Sütunlar sayfanın içerik sütunuyla hizalanır (temada 1660px idi;
   üstteki her şey 1200 genişlikte olduğu için footer kopuk duruyordu).
   .home2__wrap ile birebir aynı: 1200 + 24 iç boşluk.

   Listeler BİRBİRİNE YAKIN duruyor (Dilek, 2026-08-18): temanın
   `space-between`i üç sütunu 1200'ün iki ucuna savuruyordu; eski footer'da
   aradaki boş sütunlar bu boşluğu yuttuğu için listeler kümelenmiş
   görünüyordu ve o hâli daha iyiydi. Burada aynı etki sabit bir aralıkla
   veriliyor: sütunlar ortada, aralarında 96px. Footer'ın slogan, sosyal
   simge ve telif satırları da ortalı olduğu için ortalama tutarlı. */
body.nav2-page .footer__lists {
    max-width: 1200px;
    padding: 0 24px;
    justify-content: center;
    gap: 150px; /* 96px'ten açıldı (Dilek, 2026-08-20): sütunlar birbirine çok yakındı */
}

    /* Markup'ta ilk ve son sütun BOŞ (`<h3></h3>`); space-between onlara da
       pay ayırdığı için üç gerçek sütun içeri kaçıyor ve sayfanın sol
       kenarıyla hizalanmıyordu. Boş sütunlar yalnız bu sayfada gizleniyor —
       markup'a dokunmadan, diğer sayfaların footer'ı bozulmadan. */
    body.nav2-page .footer__item:has(> h3:empty) {
        display: none;
    }

/* Sütun başlığı: caption ölçeği, kalın. 30px'ten geliyordu ve altındaki
   18px bağlantılarla arasında 53px boşluk vardı — ikisi de küçüldü. */
body.nav2-page .footer__item h3 {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0;
    margin-bottom: 16px;
}

body.nav2-page .footer__item li,
body.nav2-page .footer__item li a {
    font-size: 14px;
    line-height: 1.5;
}

body.nav2-page .footer__item li:not(:last-child),
body.nav2-page .footer__item:last-child li:not(:last-child) {
    margin-bottom: 7px;
}

body.nav2-page .footer-two .footer__copyright p {
    font-size: 12px;
    line-height: 1.5;
    padding: 24px 0;
}

@media (max-width: 767px) {
    /* Dar ekranda sütunlar alt alta sarıyor; ortalama ve 96px aralık orada
       anlamsız — temanın sola dayalı sarma davranışına dönülüyor. */
    body.nav2-page .footer__lists {
        justify-content: flex-start;
        gap: 30px;
    }

    /* temada mobilde başlık altı 40px; küçülen puntoyla orantısız */
    body.nav2-page .footer__item h3 {
        margin-bottom: 14px;
    }

    body.nav2-page .footer__item:not(:last-child) {
        margin-bottom: 28px;
    }
}

/*--------------------------------------------------------------------------
  Footer — AÇIK ZEMİN (deneme, 2026-08-19)
  Koyu footer (zemin fotoğrafı + %65 karartma) beyaz/gri bantlarla ilerleyen
  yeni sayfanın sonunda ağır duruyordu. Burada footer sayfanın gri bandına
  (#f5f5f7) çekiliyor ve tüm metin koyuya dönüyor.

  Zemin fotoğrafını `main.js` SATIR İÇİ stille basıyor (`[data-background]`,
  main.js:127) — o yüzden `background-image` burada `!important` ile
  kapatılıyor; markup'a dokunmak gerekmiyor.

  Beyaza çevirmek için tek yer: aşağıdaki `--footer-bg`.
  Koyu hâle dönmek için: bu bloğu sil.
  --------------------------------------------------------------------------*/
body.nav2-page .footer-two {
    --footer-bg: #f5f5f7;
    background-image: none !important;
    background-color: var(--footer-bg);
    /* üstteki bölüm de gri olabildiği için ayrım saç teli bir çizgiyle */
    border-top: 1px solid rgba(0,0,0,.08);
}

    /* koyu perde */
    body.nav2-page .footer-two::after {
        content: none;
    }

    body.nav2-page .footer-two > h2 {
        color: #1C274C;
    }

/* Sosyal daireler: beyaz daire gri zeminde duruyor, simgeler zaten koyu.
   Beyaz zemine geçilirse daire kaybolur — o durumda `background: #ececef`. */
body.nav2-page .footer__social a {
    background-color: #fff;
}

    body.nav2-page .footer__social a:hover {
        background-color: #ececef;
    }

body.nav2-page .footer__item h3 {
    color: #1C274C;
}

body.nav2-page .footer__item li,
body.nav2-page .footer__item li a,
body.nav2-page .footer__item p,
body.nav2-page .footer-two .footer__copyright p {
    color: #707070;
}

    body.nav2-page .footer__item li a:hover {
        color: #1C274C;
    }

/* ayırıcı çizgiler beyaz şeffaftı, koyu şeffafa döndü */
body.nav2-page .footer__address,
body.nav2-page .footer-two .footer__copyright {
    border-color: rgba(0,0,0,.08);
}