﻿.nb-hero{min-height:310px;background:linear-gradient(90deg,rgba(0,0,0,.64),rgba(0,0,0,.1)),url('/images/Project.jpg') center/cover;display:flex;align-items:center;color:white;padding:60px max(5%,calc((100vw - 1300px)/2))}.nb-hero h1{font:normal 68px Georgia,serif}.nb-hero p{max-width:430px}.nb-container{max-width:1320px;margin:0 auto;padding:44px 25px 80px}.nb-filters{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px;border-bottom:1px solid #ddd;padding-bottom:22px}.nb-filters a{display:inline-block;margin-right:22px;color:#444;text-decoration:none}.nb-filters input{padding:10px;border:1px solid #ddd}.nb-filters button{padding:10px;border:1px solid #ddd;background:white}.nb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px}.nb-card img{width:100%;aspect-ratio:1.55;object-fit:cover}.nb-card small,.nb-detail small{display:block;text-transform:uppercase;margin-top:12px;font-size:11px;letter-spacing:.08em}.nb-card h2{font:normal 24px Georgia,serif;margin:8px 0}.nb-card a,.nb-detail a{color:inherit;text-decoration:none}.nb-card p{color:#666;line-height:1.6}.nb-card footer{display:flex;justify-content:space-between;color:#777}.nb-pages{display:flex;justify-content:center;gap:30px;margin-top:42px}.nb-detail{max-width:1000px}.nb-detail .nb-cover{width:100%;max-height:540px;object-fit:cover}.nb-detail h1{font:normal 54px Georgia,serif;margin:15px 0}.nb-lead{font-size:21px}.nb-body{white-space:pre-line;line-height:1.9;font-size:17px;margin:35px 0 55px}@media(max-width:800px){.nb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nb-hero h1{font-size:48px}}@media(max-width:520px){.nb-grid{grid-template-columns:1fr}.nb-detail h1{font-size:36px}}
/* ==========================================
   NAVELLI BLOG - MODERN DETAIL DESIGN
   ========================================== */

/* Blog detay sayfası */
.nb-container.nb-detail {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 110px 24px 80px;
    box-sizing: border-box;
}

/* Blog / Kategori alanı */
.nb-detail > p:first-child {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 30px;
    padding: 18px 24px;
    background: #f5f2ed;
    border-left: 3px solid #bd9466;
    border-radius: 4px;
    color: #555;
    font-size: 14px;
    letter-spacing: 0.5px;
}

    /* Blog bağlantısı */
    .nb-detail > p:first-child a {
        color: #222;
        text-decoration: none;
        font-weight: 600;
    }

        .nb-detail > p:first-child a:hover {
            color: #bd9466;
        }

/* Kapak görseli */
.nb-detail .nb-cover {
    display: block;
    width: 100%;
    height: 430px;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
    margin: 0 0 28px;
}

/* Kategori etiketi */
.nb-detail > small {
    display: inline-block;
    margin: 0 0 12px;
    padding-bottom: 7px;
    border-bottom: 2px solid #bd9466;
    color: #ad855c;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* Blog başlığı */
.nb-detail > h1 {
    max-width: 950px;
    margin: 0 0 16px;
    color: #222;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -0.5px;
}

/* Yayın tarihi */
.nb-detail > time {
    display: block;
    margin-bottom: 14px;
    color: #888;
    font-size: 14px;
}

/* Özet */
.nb-detail .nb-lead {
    max-width: 950px;
    margin: 0 0 35px;
    padding-bottom: 28px;
    border-bottom: 1px solid #d9c4ac;
    color: #777;
    font-size: 19px;
    line-height: 1.75;
}

/* Makale içeriği */
.nb-detail .nb-body {
    display: block;
    width: 100%;
    max-width: 950px;
    margin: 0 auto 50px;
    color: #292929;
    font-size: 18px;
    line-height: 1.9;
}

    /* Makale başlıkları */
    .nb-detail .nb-body h2 {
        margin: 45px 0 20px;
        font-family: Georgia, "Times New Roman", serif;
        font-size: 32px;
        font-weight: 400;
        line-height: 1.3;
    }

    .nb-detail .nb-body h3 {
        margin: 30px 0 15px;
        font-size: 23px;
        line-height: 1.4;
    }

    /* Paragraflar */
    .nb-detail .nb-body p {
        margin-bottom: 22px;
    }

    /* Makale görselleri */
    .nb-detail .nb-body img {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
    }

    /* Listeler */
    .nb-detail .nb-body ul,
    .nb-detail .nb-body ol {
        padding-left: 28px;
        margin-bottom: 25px;
    }

    .nb-detail .nb-body li {
        margin-bottom: 10px;
    }

/* Bloga geri dön */
.nb-detail > p:last-child {
    margin-top: 50px;
    padding-top: 25px;
    border-top: 1px solid #eee;
}

    .nb-detail > p:last-child a {
        color: #a67d52;
        font-size: 15px;
        font-weight: 600;
        text-decoration: none;
    }

/* Tablet */
@media (max-width: 991px) {
    .nb-container.nb-detail {
        padding-top: 130px;
    }

    .nb-detail .nb-cover {
        height: 350px;
    }
}

/* Mobil */
@media (max-width: 600px) {
    .nb-container.nb-detail {
        padding: 145px 16px 50px;
    }

    .nb-detail > p:first-child {
        padding: 14px;
        margin-bottom: 20px;
    }

    .nb-detail .nb-cover {
        height: 240px;
        border-radius: 6px;
    }

    .nb-detail > h1 {
        font-size: 30px;
    }

    .nb-detail .nb-lead {
        font-size: 16px;
    }

    .nb-detail .nb-body {
        font-size: 16px;
        line-height: 1.8;
    }

        .nb-detail .nb-body h2 {
            font-size: 25px;
        }
}

/* Blog kapak görselini kırpmadan göster */
.nb-detail .nb-cover {
    display: block;
    width: 100%;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center;
    border-radius: 10px;
    margin: 0 0 28px;
}