/* Theme Name: Hypetema - Güvenli Düzeltilmiş Versiyon */

@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600;700&display=swap');
/* İKONLARI KURTARAN KODU EN BAŞA KOYDUM */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/v4-shims.min.css');

/* Eski sürüm ikon isimlerini yeni sürüme zorla tanıtma */
.fa, .fas, .far, .fab, .fa-brands, .fa-solid, .fa-regular {
    font-family: "Font Awesome 6 Free" !important;
}
.fab, .fa-brands {
    font-family: "Font Awesome 6 Brands" !important;
}

/* BURADAN SONRASI SENİN ORİJİNAL KODUN */

* {
    font-family: 'Work Sans', sans-serif !important;
}
html, body {
    font-family: 'Work Sans', sans-serif !important;
}

 :root {
     --primary-color: #880fff;
     --secondary-color: #fd2eff;
     --accent-color: #fd2eff;
     --text-color: #0d0d1a;
     --bg-color: #ffffff;
     --border-color: #eaeaea;
     --font-main: 'Work Sans', sans-serif;
     --darkbg-color: #0d0d1a;
     --container-max: 1320px;
}
 body {
     font-family: var(--font-main);
     color: var(--text-color);
     background-color: #f8f9fa;
     line-height: 1.7;
     margin: 0;
     padding: 0;
}
 * {
     border-radius: 0 !important;
}
 a {
     color: var(--text-color) !important;
     text-decoration: none !important;
     transition: all 0.2s ease;
}
 a:hover {
     color: var(--primary-color) !important;
}
 h1, h2, h3, h4, h5, h6 {
     font-family: var(--font-main);
     font-weight: 800;
     margin-bottom: 1rem;
}
/* CONTAINER (Site İçeriği Geniş) */
 .container-hype {
     max-width: var(--container-max);
     margin: 0 auto;
     padding: 0 1rem;
     width: 100%;
}
/* ========================================= HEADER (HİZALAMA VE BOŞLUK DÜZELTMESİ) ========================================= */
 .site-header {
     background-color: #fff;
     z-index: 999;
     position: relative;
     border-bottom: 1px solid var(--border-color);
     height: 90px;
}
/* HEADER CONTAINER */
 .site-header .container-hype {
    /* Daha önceki 3rem padding silindi. Artık global container ile aynı genişlikte */
     padding-left: 1rem;
     padding-right: 1rem;
     height: 100%;
}
/* GRİD SİSTEMİ (ÇERÇEVELİ) */
 .header-grid {
     height: 100%;
     width: 100%;
     display: flex;
     align-items: stretch;
    /* Yüksekliği doldur */
    /* İSTEĞİNİZ: Sağ ve Sol Border */
     border-left: 1px solid var(--border-color);
     border-right: 1px solid var(--border-color);
}
/* ORTAK HÜCRE AYARI (2rem KURALI) */
 .header-cell {
     display: flex;
     align-items: center;
     height: 100%;
    /* Varsayılan olarak border yok, aşağıda özelleştiriyoruz */
}
/* --- 1. LOGO BÖLMESİ --- */
 .logo-cell {
    /* Sol tarafta boşluk: 2rem */
     padding-left: 2rem !important;
    /* Sağ tarafta boşluk: 2rem */
     padding-right: 2rem !important;
     border-right: 1px solid var(--border-color);
    /* Sağ Çizgi */
     min-width: 90px;
}
 .hypetema-logo, .custom-logo {
     height: 40px !important;
     width: auto !important;
     display: block;
     object-fit: contain;
}
/* --- 2. MENÜ BÖLMESİ --- */
 .menu-cell {
     padding-left: 2rem;
     flex-grow: 1;
}
 .hypetema-menu li {
     list-style: none;
     margin: 0;
}
 .hypetema-menu li a {
     display: block;
    /* Menü elemanları arası boşluk */
     padding: 34px 1rem !important;
     font-weight: 500 !important;
     font-size: 15px;
     text-transform: capitalize !important;
     color: var(--text-color) !important;
     position: relative;
     letter-spacing: 0.5px;
     transition: color 0.1s ease;
}
/* İSTEĞİNİZ: İlk elemanın sol paddingini iptal et */
/* Çünkü zaten container'ın 2rem boşluğu var */
 .hypetema-menu li:first-child a {
     padding-left: 0 !important;
}
 .hypetema-menu li a:hover {
     color: var(--primary-color) !important;
}
/* Alt Çizgi Animasyonu */
 .hypetema-menu li a::after {
     content: '';
     position: absolute;
     left: 1.2rem;
     right: 1.2rem;
     bottom: 25px;
     height: 3px;
     background-color: var(--primary-color);
     transform: scaleX(0);
     transition: transform 0.3s ease;
}
 .hypetema-menu li:first-child a::after {
     left: 0;
}
/* İlk eleman için çizgi ayarı */
 .hypetema-menu li a:hover::after, .hypetema-menu li.current-menu-item > a::after {
     transform: scaleX(1);
}
 .hypetema-menu li.current-menu-item > a {
     color: var(--primary-color) !important;
}

/* --- AŞAĞI AÇILIR MENÜ (DROPDOWN) AYARLARI --- */

/* 1. Kapsayıcı (Li) Ayarı */
.hypetema-menu li {
    position: relative; /* Alt menünün buna hizalanması için şart */
}

/* 2. Alt Menü Kutusu (Başlangıçta Gizli) */
.hypetema-menu .sub-menu {
    position: absolute;
    top: 100%; /* Menünün tam altından başla */
    left: 0;
    width: 240px; /* Açılır kutunun genişliği */
    background-color: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1); /* Gölge */
    border-top: 3px solid var(--primary-color); /* Üstteki mor çizgi */
    padding: 10px 0;
    z-index: 1000;
    
    /* Animasyon Başlangıç Değerleri */
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px); /* Hafif aşağıda durur */
    transition: all 0.3s ease; /* Yumuşak geçiş */
    border-left: 1px solid var(--border-color);
    border-right: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

/* 3. Hover (Üzerine Gelince Görün) */
.hypetema-menu li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); /* Yerine oturur */
}

/* 4. Alt Menü Link Tasarımı */
.hypetema-menu .sub-menu li a {
    padding: 12px 20px !important; /* Header dolgusunu eziyoruz */
    font-size: 0.85rem;
    font-weight: 600 !important;
    text-transform: none !important; /* Hepsi büyük harf olmasın */
    color: var(--text-color) !important;
    border-bottom: 1px solid #f9f9f9;
    display: block;
}

/* Alt menü linklerinde animasyon çizgisi olmasın */
.hypetema-menu .sub-menu li a::after {
    display: none; 
}

/* Alt Menü Hover Efekti */
.hypetema-menu .sub-menu li a:hover {
    background-color: #f8f9fa;
    color: var(--primary-color) !important;
    padding-left: 25px !important; /* Sağa kayma efekti */
}

/* --- "DAHA FAZLA" BUTONU VE (+) İKONU --- */

/* Bu sınıfı birazdan panelden ekleyeceğiz */
.hypetema-menu li.more-btn > a {
    color: var(--primary-color) !important; /* Mor renk */
    padding-right: 0 !important; /* Sağ boşluğu sıfırla */
}

/* Artı (+) İkonu */
.hypetema-menu li.more-btn > a::before {
    content: '\2b'; /* FontAwesome Artı İkonu */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 5px;
    display: inline-block;
    transition: transform 0.3s ease;
}

/* Üzerine gelince ikon dönsün */
.hypetema-menu li.more-btn:hover > a::before {
    transform: rotate(90deg);
}

/* --- 3. SAĞ TARAF (SOSYAL, SEARCH, HAMBURGER) --- */
/* Sosyal İkonlar */
 .social-cell {
     border-left: 1px solid var(--border-color);
     padding: 0 2rem;
    /* 2rem Boşluk */
     gap: 0.5rem;
}
/* Arama Kutusu */
 .search-cell {
     border-left: 1px solid var(--border-color);
     padding: 0 2rem;
    /* 2rem Boşluk */
}
 .modern-search-wrapper {
     display: flex;
     align-items: center;
     background-color: #fff;
     width: 220px;
     margin-bottom: 0 !important;
     border-radius: 50px !important;
     padding: 2px 5px 2px 20px;
     border: 1px solid #e5e5e5;
     transition: all 0.3s ease;
}
 .modern-search-wrapper:focus-within {
     border-color: var(--primary-color);
}
 .modern-search-input {
     border: none;
     background: transparent;
     padding: 5px 0;
     font-size: 14px;
     width: 100%;
     color: var(--text-color);
     outline: none;
}
 .modern-search-btn {
     border: none;
     background: transparent;
     padding: 8px 10px;
     color: var(--text-color);
     cursor: pointer;
}
 .modern-search-btn:hover {
     color: var(--primary-color);
}
/* Hamburger */
 .hamburger-cell {
     border-left: 1px solid var(--border-color);
    /* Sol 2rem, Sağ 2rem (Simetri için) */
     padding-left: 2rem !important;
     padding-right: 2rem !important;
}
 .btn-icon {
     background: none !important;
     border: none !important;
     padding: 0;
     cursor: pointer;
     color: var(--text-color);
     font-size: 1.4rem;
     transition: color 0.2s;
}
 .btn-icon:hover {
     color: var(--primary-color);
}
/* ========================================= MOBİL (RESPONSIVE) DÜZELTMELERİ ========================================= */
 @media (max-width: 991px) {
    /* Mobil Header Yüksekliği */
     .sticky-top {
         padding-top: 15px !important;
         padding-bottom: 15px !important;
    }
    /* Mobilde Kenar Boşluklarını Zorla Aç */
    /* Hamburger ve Arama butonu yapışmasın */
     .d-lg-none .container-hype {
         padding-left: 0.5rem !important;
         padding-right: 0.5rem !important;
    }
     .mobile-logo-img {
         height: 32px !important;
         width: auto;
    }
}
/* ========================================= 4. MANŞET (FİNAL RÖTUŞLAR) ========================================= */
 .manset-container {
     padding-top: 0 !important;
     margin-top: 0 !important;
     padding-bottom: 0;
     border-bottom: none !important;
}
 .click-mag-grid {
     border-bottom: 1px solid var(--border-color);
     min-height: 650px;
     display: flex;
}
 @media (max-width: 991px) {
     .click-mag-grid {
         display: block;
         height: auto;
    }
}
/* --- SOL: ANA HABER --- */
 .manset-left-col {
     display: flex;
     flex-direction: column;
     width: 58.333333%;
}
 .manset-main-block {
     height: 100%;
     background: #fff;
     display: flex;
     flex-direction: column;
}
 .manset-img-area {
     width: 100%;
     aspect-ratio: 16/9;
     position: relative;
     overflow: hidden;
     display: block;
}
 .manset-img-area img {
     width: 100%;
     height: 100%;
     object-fit: cover;
}
 .manset-content-wrapper {
     flex-grow: 1;
     padding-left: 2rem;
     padding-right: 2rem;
     padding-top: 1.5rem;
     padding-bottom: 1.5rem;
     display: flex;
     flex-direction: column;
     justify-content: center;
}
 .manset-cat-text {
     display: block;
     color: var(--primary-color) !important;
     font-weight: 800;
     font-size: 0.9rem;
     text-transform: uppercase;
     letter-spacing: 1px;
     margin-bottom: 5px;
}
 .manset-main-title a {
     font-weight: 900;
     font-size: 2.4rem;
     line-height: 1.1;
     color: var(--text-color) !important;
     display: block;
     transition: color 0.2s ease;
}
 .manset-main-title a:hover {
     color: var(--primary-color) !important;
}
 .manset-excerpt {
     font-weight: 400;
     font-size: 1rem;
     color: #666;
     line-height: 1.5;
     margin-top: 10px;
     display: -webkit-box;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
/* ORTAK: HABERİ OKU LİNKİ */
 .read-more-link {
     font-size: 0.85rem;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 1px;
     color: var(--text-color) !important;
     text-decoration: none !important;
     border-bottom: 2px solid var(--text-color);
     padding-bottom: 2px;
     display: inline-block;
     margin-top: 1rem;
     align-self: flex-start;
}
 .read-more-link:hover {
     color: var(--primary-color) !important;
     border-color: var(--primary-color);
}
 .small-link {
     font-size: 0.7rem;
     margin-top: 0.5rem;
     border-bottom-width: 1px;
}
/* --- SAĞ: 3 KÜÇÜK HABER --- */
 .manset-right-col {
     display: flex;
     flex-direction: column;
     width: 41.666667%;
    /* border-left KURALI SİLİNDİ (Kalınlığı önlemek için) */
}
 .manset-sub-item {
     flex: 1;
     width: 100%;
     overflow: hidden;
     border-bottom: 1px solid var(--border-color);
}
 .manset-sub-item:last-child {
     border-bottom: none;
}
 .manset-sub-item .row {
     height: 100%;
     margin: 0;
}
 .transition-img {
     transition: transform 0.5s ease;
}
 .manset-sub-item:hover .transition-img, .manset-img-area:hover .transition-img {
     transform: scale(1.05);
}
 .click-cat-text {
     display: block;
     color: var(--primary-color);
     font-size: 0.7rem;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: 1px;
}
 .click-sub-title a {
     font-size: 1rem;
     font-weight: 700;
     color: var(--text-color) !important;
     line-height: 1.3;
     display: block;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
 .click-sub-title a:hover {
     color: var(--primary-color) !important;
}
 .manset-list-excerpt {
     font-size: 0.85rem;
     color: #777;
     line-height: 1.4;
     font-weight: 400;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
/* İkon (Daire İçinde) */
 .trending-badge {
     position: absolute;
     top: 1rem;
    /* Üstten 2rem (Hiza için) */
     right: 1rem;
    /* Sağdan 2rem (Hiza için) */
     width: 45px;
     height: 45px;
     background-color: var(--primary-color) !important;
    /* KESİNLİKLE DAİRE OLSUN */
     border-radius: 50% !important;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 1.3rem;
     z-index: 10;
}
/* MOBİL */
 @media (max-width: 991px) {
     .manset-left-col, .manset-right-col {
         width: 100%;
         border: none;
    }
     .manset-img-area {
         height: 250px;
    }
     .manset-content-wrapper {
         padding: 1.5rem;
    }
     .manset-sub-item {
         border-bottom: 1px solid #eee;
         padding: 1rem 0;
         min-height: 120px;
    }
}
 .trend-img-wrap {
     background-color: #f0f0f0;
     border-radius: 0;
     position: relative !important;
}
 .trend-item img {
     transition: transform 0.5s ease;
     width: 100%;
     height: 100%;
     object-fit: cover;
}
 .trend-item:hover img {
     transform: scale(1.1);
}
 .placeholder-box {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: var(--text-color);
     display: flex;
     align-items: center;
     justify-content: center;
     color: rgba(255,255,255,0.2);
     font-size: 2rem;
     transition: background-color 0.3s ease;
}
 .trend-item:hover .placeholder-box {
     background-color: var(--primary-color);
     color: #fff;
}
 .trend-title {
     font-size: 0.95rem;
     font-weight: 700;
     line-height: 1.3;
     color: var(--text-color);
     margin: 0;
     transition: color 0.2s ease;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
 .trend-item:hover .trend-title {
     color: var(--primary-color);
}
 .trend-number {
     position: absolute;
     top: 0 !important;
     right: 0 !important;
     left: auto !important;
     width: 40px;
     height: 40px;
     background-color: var(--accent-color) !important;
     color: #000;
     font-weight: 800;
     font-size: 1.1rem;
     display: flex;
     align-items: center;
     justify-content: center;
     z-index: 20 !important;
     pointer-events: none;
     border-radius: 0 !important;
}
 .side-panel {
     position: fixed;
     top: 0;
     left: -28rem;
     width: 25rem;
     height: 100%;
     background: #fff;
     z-index: 9999;
     transition: left 0.4s ease;
     border-right: 1px solid #eee;
     display: flex;
     flex-direction: column;
     padding: 4rem 3rem;
     justify-content: center;
}
 .side-panel.active {
     left: 0;
}
 .side-menu-list {
     list-style: none;
     padding: 0;
     margin: 0;
     text-align: left;
}
 .side-menu-list li {
     margin-bottom: 0;
     border-bottom: 1px solid #f5f5f5;
}
 .side-menu-list a {
     display: block;
     padding: 15px 0;
     /* BURASI DÜZELTİLDİ: Arada noktalı virgül eksikti */
     font-size: 14px; 
     font-weight: 800 !important;
     color: var(--text-color) !important;
     text-transform: uppercase;
}
 .side-menu-list a:hover {
     color: var(--primary-color) !important;
     padding-left: 10px;
}
 .side-menu-list .sub-menu {
     padding-left: 20px;
     border-left: 1px solid #eee;
     margin-top: 5px;
     margin-bottom: 15px;
}
 .side-menu-list .sub-menu li {
     border: none;
     margin: 0;
}
 .side-menu-list .sub-menu a {
     font-size: 1rem;
     font-weight: 400;
     padding: 5px 0;
     text-transform: none;
     color: #666 !important;
}
 .side-menu-list .sub-menu a:hover {
     color: var(--primary-color) !important;
}
 .close-btn {
     position: absolute;
     top: 30px;
     right: 30px;
     background: none;
     border: none;
     cursor: pointer;
     font-size: 1.5rem;
}
 #panel-overlay {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(0,0,0,0.5);
     z-index: 9990;
     opacity: 0;
     visibility: hidden;
     backdrop-filter: blur(5px);
     transition: 0.3s;
}
 #panel-overlay.active {
     opacity: 1;
     visibility: visible;
}
 .full-search {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(255, 255, 255, 0.98);
     z-index: 9999;
     opacity: 0;
     visibility: hidden;
     transition: 0.3s;
}
 .full-search.active {
     opacity: 1;
     visibility: visible;
}
 .full-search input {
     background: transparent;
     border: none;
     border-bottom: 2px solid var(--text-color);
     font-size: 3rem;
     font-weight: 100;
     text-align: center;
     width: 80%;
     outline: none;
}
 .site-footer {
     background-color: var(--darkbg-color);
     color: #fff;
     margin-top: 5rem;
     padding-top: 4rem;
}
 .footer-widget .widget-title {
     color: #fff !important;
     font-weight: 800;
     position: relative;
     padding-bottom: 1rem;
}
 .footer-widget .widget-title::after {
     content: '';
     position: absolute;
     left: 0;
     bottom: 0;
     width: 2.5rem;
     height: 3px;
     background: var(--accent-color);
}
 .footer-widget a {
     color: #aaa !important;
}
 .footer-widget a:hover {
     color: var(--accent-color) !important;
}
/* ========================================= GENEL BÖLÜM BAŞLIĞI (Reusable Class) (Sidebar, Footer, Trend vb. her yerde kullanın) ========================================= */
 .hype-heading {
     display: flex;
     align-items: center;
     margin-bottom: 2rem;
    /* Başlık ile içerik arası boşluk */
}
/* Sol Mor Çubuk */
 .hype-heading .bar {
     width: 1rem;
    /* İstediğiniz genişlik */
     height: 24px;
    /* Yazı yüksekliği ile orantılı */
     background-color: var(--primary-color);
    /* Mor */
     margin-right: 1rem;
    /* Yazı ile arası */
     display: block;
     border-radius: 2px;
    /* Hafif yumuşak köşe */
}
/* Başlık Metni */
 .hype-heading .title {
     margin: 0;
     font-weight: 800;
     text-transform: uppercase;
     font-size: 1.1rem;
     line-height: 1;
     color: var(--text-color);
     letter-spacing: 1px;
}
/* ========================================= GENEL BÖLÜM BAŞLIĞI (Reusable Class) (Sidebar, Footer, Trend vb. her yerde kullanın) ========================================= */
 .hype-heading {
     display: flex;
     align-items: center;
     margin-bottom: 2rem;
    /* Başlık ile içerik arası boşluk */
}
/* Sol Mor Çubuk */
 .hype-heading .bar {
     width: 1rem;
    /* İstediğiniz genişlik */
     height: 24px;
    /* Yazı yüksekliği ile orantılı */
     background-color: var(--primary-color);
    /* Mor */
     margin-right: 1rem;
    /* Yazı ile arası */
     display: block;
     border-radius: 2px;
    /* Hafif yumuşak köşe */
}
/* Başlık Metni */
 .hype-heading .title {
     margin: 0;
     font-weight: 800;
     text-transform: uppercase;
     font-size: 1.1rem;
     line-height: 1;
     color: var(--text-color);
     letter-spacing: 1px;
}
/* ========================================= TREND ALANI (FİNAL & ÖZETLİ) ========================================= */
 .trend-container {
     padding-top: 2rem !important;
     padding-bottom: 2rem !important;
}
 .hype-heading {
     display: flex;
     align-items: center;
     margin-bottom: 2rem;
}
 .hype-section-header .bar {
     width: 1rem;
     height: 24px;
     background-color: var(--primary-color);
     margin-right: 1rem;
     border-radius: 2px;
     display: block;
}
 .hype-section-header h5, .hype-heading .title {
     margin: 0;
     font-weight: 800;
     color: var(--text-color);
     letter-spacing: 1px;
     font-size: 1.1rem;
}
 .trend-grid {
     display: flex;
     flex-wrap: wrap;
}
/* Çizgiler */
 @media (min-width: 992px) {
     .trend-border-x {
         border-left: 1px solid var(--border-color);
         border-right: 1px solid var(--border-color);
    }
}
 @media (max-width: 991px) {
     .trend-item {
         border-bottom: 1px solid var(--border-color);
         padding-bottom: 2rem;
         margin-bottom: 2rem;
    }
}
/* Kart */
 .trend-item {
     padding: 0 2rem;
}
/* Fotoğraf (Dikey Portre) */
 .trend-img-link {
     width: 110px;
     height: 140px;
     overflow: hidden;
     margin-right: 1.5rem;
     position: relative;
     display: block;
}
 .trend-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.5s ease;
}
 .trend-item:hover .trend-img {
     transform: scale(1.05);
}
/* İçerik */
 .trend-cat-text {
     font-size: 0.7rem;
     font-weight: 800;
     color: var(--primary-color);
     text-transform: uppercase;
     margin-bottom: 4px;
     display: block;
}
 .trend-title a {
     font-size: 1.05rem;
     font-weight: 700;
     line-height: 1.3;
     color: var(--text-color) !important;
     display: block;
     margin-bottom: 5px;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
 .trend-title a:hover {
     color: var(--primary-color) !important;
}
/* EKLENEN ÖZET STİLİ */
 .trend-excerpt {
     font-size: 0.85rem;
     color: #777;
     line-height: 1.4;
     font-weight: 400;
    /* 2 Satırdan sonrasını kes */
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
 .small-link {
     font-size: 0.75rem;
     font-weight: 700;
     text-transform: uppercase;
     border-bottom: 1px solid var(--text-color);
     padding-bottom: 1px;
     align-self: flex-start;
     color: var(--text-color) !important;
}
 .small-link:hover {
     color: var(--primary-color) !important;
     border-color: var(--primary-color);
}
/* ========================================= SON EKLENENLER (HİZALAMA SORUNU GİDERİLDİ) ========================================= */
/* Kart Yapısı */
 .latest-card {
     margin: 0;
     padding: 0;
     border-bottom: 1px solid var(--border-color);
     display: flex;
     align-items: flex-start;
     width: 100%;
}
 .latest-card:last-child {
     border-bottom: none;
}
/* Fotoğraf Alanı */
 .latest-img-link {
     width: 430px;
     height: 250px;
     flex-shrink: 0;
     display: block;
     position: relative;
     overflow: hidden !important;
     border-radius: 0;
}
 .latest-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.5s ease;
     display: block;
}
 .latest-card:hover .latest-img {
     transform: scale(1.1);
}
/* İçerik Alanı */
 .latest-content {
     padding-left: 2rem !important;
     padding-right: 2rem !important;
     padding-top: 1.5rem !important;
     padding-bottom: 1.5rem !important;
     height: 250px;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     width: 100%;
}
/* Başlık (GÜNCELLENDİ: Negatif margin kaldırıldı) */
 .latest-title {
     margin-top: 0;
    /* Artık yukarı çekmeyecek, yapışma düzelir */
     margin-bottom: 10px;
}
 .latest-title a {
     font-size: 1.5rem;
     font-weight: 800;
     color: var(--text-color) !important;
     line-height: 1.2;
     transition: color 0.2s;
     display: block;
}
 .latest-title a:hover {
     color: var(--primary-color) !important;
}
/* Kategori */
 .click-cat-text {
     margin-bottom: 5px !important;
    /* Showcase ile aynı boşluk */
     display: block;
     font-weight: 800;
     text-transform: uppercase;
     color: var(--primary-color) !important;
     font-size: 0.9rem !important;
     letter-spacing: 1px;
}
/* Özet */
/* Latest Card (Genel) Bölümündeki .latest-excerpt */
 .latest-excerpt {
     font-size: 1rem;
     color: #666;
     line-height: 1.5;
    /* 2 Satırda Sınırlama Kodu */
     display: -webkit-box;
     -webkit-line-clamp: 2;
    /* Kaç satır olacağını belirler */
     -webkit-box-orient: vertical;
     overflow: hidden;
    /* Yükseklik sınırını kaldırıyoruz, clamp halledecek */
     max-height: none;
     margin-top: 10px;
}
/* Devamı Linki */
 .read-more-simple {
         font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    border-bottom: 2px solid var(--text-color);
     letter-spacing: 1px;
     color: var(--text-color) !important;
     text-decoration: none !important;
     padding-bottom: 2px;
     align-self: flex-start;
}
 .read-more-simple:hover {
     color: var(--primary-color) !important;
     border-color: var(--primary-color);
}
/* MOBİL AYARLARI */
 @media (max-width: 991px) {
     .latest-card {
         flex-direction: column;
         padding-bottom: 2rem;
         margin-bottom: 2rem;
         border-bottom: 1px solid #eee;
    }
     .latest-img-link {
         width: 100%;
         height: 250px;
    }
     .latest-content {
         padding-left: 0 !important;
         padding-right: 0 !important;
         height: auto;
         padding-top: 1.5rem !important;
         justify-content: flex-start;
    }
}
/* ========================================= YENİ KART STİLİ (MANŞET KOPYASI) ========================================= */
/* Manşet Sol Sütun Stillerini Tekrar Kullanıyoruz */
 .manset-style-card .manset-img-area {
     height: 250px;
    /* Listede biraz daha kısa */
}
/* Yazı Alanı Padding */
 .manset-style-card .manset-content-wrapper {
     padding-left: 2rem !important;
     padding-right: 2rem !important;
}
/* Başlık Boyutu (Listede devasa olmasın) */
 .manset-style-card .manset-main-title a {
     font-size: 1.6rem !important;
    /* 2.4rem yerine */
}
/* Mobilde Düzeltme */
 @media (max-width: 991px) {
     .manset-style-card .manset-img-area {
         height: 220px;
    }
     .manset-style-card {
         border-bottom: 1px solid #eee;
         padding-bottom: 2rem;
         margin-bottom: 2rem;
    }
     .border-end, .border-start {
         border: none !important;
    }
}
/* ========================================= SAYFALAMA (PAGINATION) TASARIMI ========================================= */
 .pagination {
     display: flex;
     justify-content: center;
     margin-top: 3rem;
}
 .nav-links {
     display: flex;
     gap: 10px;
}
 .pagination .page-numbers {
     display: flex;
     align-items: center;
     justify-content: center;
     width: 40px;
     height: 40px;
     background-color: #fff;
     border: 1px solid var(--border-color);
     color: var(--text-color) !important;
     font-weight: 700;
     font-size: 0.9rem;
     text-decoration: none !important;
     transition: all 0.2s ease;
}
/* Aktif Sayfa ve Hover */
 .pagination .page-numbers.current, .pagination .page-numbers:hover {
     background-color: var(--text-color);
    /* Siyah */
     color: #fff !important;
     border-color: var(--text-color);
}
/* Önceki / Sonraki Butonları */
 .pagination .prev, .pagination .next {
     width: auto;
     padding: 0 15px;
    /* Genişlik ver */
}
/* ========================================= SAYFALAMA (MODERN BUTONLAR) ========================================= */
/* Ortala */
 .pagination {
     display: flex;
     justify-content: center;
     width: 100%;
}
/* Linkleri kapsayan kutu */
 .nav-links {
     display: flex;
     gap: 10px;
    /* Butonlar arası boşluk */
     flex-wrap: wrap;
     justify-content: center;
}
/* Butonların Kendisi (1, 2, 3, Next) */
 .page-numbers {
     display: flex;
     align-items: center;
     justify-content: center;
     min-width: 45px;
    /* Karemsi genişlik */
     height: 45px;
    /* Yükseklik */
     padding: 0 15px;
    /* Sağ sol boşluk */
     background-color: #fff;
     border: 2px solid var(--border-color);
    /* Kalın çerçeve */
     color: var(--text-color) !important;
     font-weight: 800;
     font-size: 1rem;
     text-decoration: none !important;
     text-transform: uppercase;
     transition: all 0.3s ease;
     border-radius: 0 !important;
    /* Keskin */
}
/* Aktif Sayfa (Current) */
 .page-numbers.current {
     background-color: var(--text-color);
    /* Siyah Zemin */
     color: #fff !important;
    /* Beyaz Yazı */
     border-color: var(--text-color);
}
/* Hover Efekti */
 .page-numbers:not(.current):hover {
     background-color: var(--primary-color);
    /* Mor Zemin */
     border-color: var(--primary-color);
     color: #fff !important;
     transform: translateY(-3px);
    /* Hafif zıplama */
}
/* Önceki / Sonraki Okları */
 .pagination .prev, .pagination .next {
     font-size: 1.1rem;
}
/* ========================================= ARŞİV SAYFASI (MANŞET KOPYASI KARTLAR) ========================================= */
/* Fotoğraf Alanı */
 .archive-img-area {
     height: 250px;
    /* Sabit Yükseklik */
     width: 100%;
     display: block;
}
/* İçerik Alanı */
 .archive-content {
     text-align: left;
    /* Sola Yaslı */
     align-items: flex-start;
}
/* Kategori */
 .archive-cat-text {
     display: block;
     color: var(--primary-color);
    /* Mor */
     font-weight: 800;
     font-size: 0.8rem;
     text-transform: uppercase;
     letter-spacing: 1px;
     margin-bottom: 0.5rem;
}
/* Başlık */
 .archive-title a {
     font-size: 1.6rem;
     font-weight: 900;
    /* Kalın */
     line-height: 1.2;
     color: var(--text-color) !important;
     text-decoration: none !important;
     display: block;
     transition: color 0.2s;
}
 .archive-title a:hover {
     color: var(--primary-color) !important;
}
/* Özet */
 .archive-excerpt {
     font-size: 1rem;
     color: #666;
     line-height: 1.6;
}
/* Mobilde Arşiv */
 @media (max-width: 768px) {
     .archive-img-area {
         height: 220px;
    }
     .archive-content {
         padding: 1.5rem;
    }
}
/* ========================================= YÜKLE BUTONU (MOR & BİTİŞİK) ========================================= */
 .btn-hype {
     background-color: var(--primary-color);
    /* Zemin Mor */
     color: #fff;
    /* Yazı Beyaz */
     font-weight: 800;
     letter-spacing: 1px;
     border: none;
     cursor: pointer;
     transition: all 0.3s ease;
     display: block;
     width: 100%;
     border-radius: 0;
    /* Keskin köşeler, listeye uyması için */
     margin-top: 0;
    /* Garanti olsun diye boşluk sıfırlandı */
}
 .btn-hype:hover {
     background-color: var(--text-color);
    /* Hover'da Siyah */
     color: #fff;
}
 .btn-hype:disabled {
     opacity: 0.7;
     cursor: not-allowed;
}
/* ========================================= GENEL KATEGORİ STİLİ (TÜM SİTE EŞİTLEME) ========================================= */
 .click-cat-text {
     font-size: 0.9rem !important;
    /* Vitrin ile aynı boyut */
     font-weight: 800;
     color: var(--primary-color) !important;
     text-transform: uppercase;
     letter-spacing: 1px;
}
/* ========================================= SIDEBAR TASARIMI (SOSYAL + REKLAM + TREND) ========================================= */
/* 1. SOSYAL MEDYA KUTULARI (KARE) */
 .social-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
    /* 2 Yan yana */
     gap: 10px;
}
 .social-box {
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     padding: 1.5rem 1rem;
     text-decoration: none !important;
     color: #fff !important;
     font-weight: 700;
     font-size: 0.9rem;
    /* GÜNCELLENDİ: Oval değil, tam köşe */
     border-radius: 0 !important;
     transition: transform 0.2s ease, opacity 0.2s;
}
 .social-box i {
     font-size: 1.5rem;
     margin-bottom: 0.5rem;
}
 .social-box:hover {
     transform: translateY(-3px);
     opacity: 0.9;
     color: #fff !important;
}
/* Marka Renkleri */
 .social-box.instagram {
     background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}
 .social-box.twitter {
     background-color: #000;
}
 .social-box.facebook {
     background-color: #1877f2;
}
 .social-box.tiktok {
     background-color: #000;
     border: 1px solid #333;
}
/* 2. REKLAM ALANI (GERİ GELDİ) */
 .ad-box-wrapper {
     text-align: center;
     background: #f8f9fa;
     padding: 20px;
     border: 1px dashed #ccc;
}
 .ad-label {
     display: block;
     font-size: 0.6rem;
     color: #999;
     letter-spacing: 1px;
     margin-bottom: 5px;
     text-transform: uppercase;
}
 .ad-placeholder {
     width: 100%;
     height: 250px;
     background-color: #e9ecef;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     color: #adb5bd;
     font-weight: 600;
}
/* 3. SIDEBAR TREND KARTLARI (GÜNCEL) */
/* Son elemanın çizgisini kaldır */
 .sidebar-trend-card:last-child {
     border-bottom: none !important;
     padding-bottom: 0 !important;
     margin-bottom: 0 !important;
}
/* Görsel Kapsayıcı */
 .trend-card-img-wrap {
     height: 160px;
     width: 100%;
     overflow: hidden;
     display: block;
     position: relative;
     border-radius: 0;
}
 .trend-card-img-wrap img {
     transition: transform 0.5s ease;
}
 .sidebar-trend-card:hover .trend-card-img-wrap img {
     transform: scale(1.05);
}
/* Numara */
 .trend-card-number {
     position: absolute;
     top: 10px;
     right: 10px;
     width: 35px;
     height: 35px;
     background-color: var(--primary-color) !important;
     color: #fff !important;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 800;
     font-size: 1.1rem;
     border-radius: 50% !important;
     z-index: 10;
     box-shadow: 0 4px 6px rgba(0,0,0,0.2);
}
/* Kategori */
 .side-cat {
     font-size: 0.8rem;
     font-weight: 800;
     color: var(--primary-color) !important;
     text-transform: uppercase;
     display: block;
     letter-spacing: 0.5px;
}
/* Başlık (Küçük Boyut) */
 .side-title a {
     font-size: 1rem;
     line-height: 1.3;
     font-weight: 700;
     color: var(--text-color) !important;
     display: block;
     transition: color 0.2s;
}
 .side-title a:hover {
     color: var(--primary-color) !important;
}
/* 1. SOSYAL MEDYA KUTULARI (TEMA MORU & HOVER EFEKTLİ) */
 .social-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
    /* 2 Yan yana */
     gap: 10px;
}
 .social-box {
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     padding: 1.5rem 1rem;
     text-decoration: none !important;
    /* GÜNCELLEME: Temanın Kendi Mor Rengi */
     background-color: var(--accent-color);
     border: 2px solid var(--accent-color);
     color: #fff !important;
    /* Yazı ve İkon Beyaz */
     font-weight: 700;
     font-size: 0.9rem;
     border-radius: 0 !important;
    /* Tam Kare */
     transition: all 0.3s ease;
}
 .social-box i {
     font-size: 1.5rem;
     margin-bottom: 0.5rem;
}
/* HOVER EFEKTİ: İçi boşalsın, yazı mor olsun */
 .social-box:hover {
     background-color: #fff;
    /* Zemin Beyaz */
     color: var(--text-color) !important;
    /* Yazı Mor */
     transform: translateY(-3px);
}
/* Özel marka renklerini eziyoruz, hepsi mor olsun */
 .social-box.instagram, .social-box.twitter, .social-box.facebook, .social-box.tiktok {
     background: var(--primary-color);
     border-color: var(--primary-color);
}
 .social-box:hover.instagram, .social-box:hover.twitter, .social-box:hover.facebook, .social-box:hover.tiktok {
     background: #fff;
}
/* ========================================= TEKİL YAZI (SINGLE.PHP) TASARIMI ========================================= */
/* Kategori */
 .single-cat-text {
     font-size: 1rem;
    /* Büyük ve net */
     font-weight: 800;
     color: var(--primary-color) !important;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none !important;
}
/* Başlık */
 .entry-title {
     font-size: 2.8rem;
    /* Devasa başlık */
     font-weight: 900;
     line-height: 1.1;
     color: var(--text-color);
     letter-spacing: -1px;
}
/* Mobilde başlık küçülsün */
 @media (max-width: 768px) {
     .entry-title {
         font-size: 2rem;
    }
}
/* Meta Bilgiler */
/* 3. Meta Bilgiler (Tarih/Okunma) - YUMUŞATILDI */
 .entry-meta {
    /* Border color çok silik kalacağı için ideal yumuşak griyi (#999) kullandık */
     color: var(--text-color) !important;
     font-weight: 300 !important;
     font-size: 0.85rem !important;
     opacity: 1 !important;
}
/* İkonların rengini de metinle eşitleyelim */
 .entry-meta i {
     font-size: 1rem;
     color: var(--text-color) !important;
     margin-right: 5px;
}
 .text-primary-color {
     color: var(--primary-color);
}
/* İçerik Okunabilirliği (Çok Önemli) */
 .entry-content {
     font-size: 1.15rem;
    /* Standarttan biraz büyük */
     line-height: 1.8;
    /* Satır arası ferah */
     color:var(--text-color) !important;
    /* Tam siyah değil, yumuşak koyu gri */
     font-weight: 400;
}
 .entry-content p {
     margin-bottom: 0.5rem;
}
/* İçerik Başlıkları (H2, H3 vb.) */
 .entry-content h2, .entry-content h3, .entry-content h4 {
     font-weight: 800;
     color: var(--text-color);
     line-height: 1.2;
}
 .entry-content h2 {
     font-size: 2rem;
}
 .entry-content h3 {
     font-size: 1.6rem;
}
/* İçerik Linkleri */
 .entry-content a {
     color: var(--primary-color) !important;
     font-weight: 600;
}
/* Alıntı Kutusu (Blockquote) */
 .entry-content blockquote {
     border-left: 6px solid var(--accent-color);
    /* Neon Çizgi */
     background: #f9f9f9;
     padding: 2rem;
     margin: 2.5rem 0;
     font-size: 1.25rem;
     font-weight: 500;
     color: #444;
}
/* Etiketler */
 .tags-links a {
     display: inline-block;
     background: #f0f0f0;
     padding: 6px 14px;
     margin-right: 8px;
     margin-bottom: 8px;
     font-size: 0.8rem;
     font-weight: 700;
     color: var(--text-color) !important;
     text-decoration: none !important;
     text-transform: uppercase;
     transition: 0.3s;
}
 .tags-links a:hover {
     background: var(--primary-color);
     color: #fff !important;
}
/* ========================================= TEKİL YAZI (SOLA DAYALI & BÜYÜK BAŞLIK) ========================================= */
/* Kategori */
 .single-cat-text {
     font-size: 1rem;
     font-weight: 800;
     color: var(--primary-color) !important;
     text-transform: uppercase;
     letter-spacing: 1px;
     text-decoration: none !important;
}
/* Başlık */
 .entry-title {
    /* GÜNCELLEME: 3.5rem boyut */
     font-size: 3.5rem;
     font-weight: 900;
     line-height: 1.1;
     color: var(--text-color);
     letter-spacing: -1px;
     margin-bottom: 1rem;
     text-align: left;
    /* Sola dayalı */
}
/* Giriş Özeti (Lead Text) */
 .entry-lead {
     font-size: 1.4rem;
    /* Okunaklı büyüklük */
     line-height: 1.5;
    /* GÜNCELLEME: 300 Weight ve Başlık Rengi */
     font-weight: 500 !important;
     color: var(--text-color) !important;
    /* Koyu renk */
}
 .entry-lead p {
     margin-bottom: 0;
}
/* İçerik Okunabilirliği */
 .entry-content {
     font-size: 1.15rem;
     line-height: 1.8;
     color: #222;
     font-weight: 400;
}
 .entry-content p {
     margin-bottom: 1.5rem;
}
/* İçerik Başlıkları */
 .entry-content h2, .entry-content h3 {
     margin-top: 2.5rem;
     margin-bottom: 1rem;
     font-weight: 800;
     color: var(--text-color);
     line-height: 1.2;
}
 .entry-content h2 {
     font-size: 2rem;
}
/* Alıntı */
 .entry-content blockquote {
     border-left: 6px solid var(--accent-color);
     background: #f9f9f9;
     padding: 2rem;
     margin: 2.5rem 0;
     font-size: 1.25rem;
     color: #444;
}
/* Mobil Uyum */
 @media (max-width: 768px) {
     .entry-title {
         font-size: 2.2rem;
    }
    /* Mobilde çok devasa olmasın */
     .entry-image img {
         height: auto !important;
         max-height: 300px !important;
    }
}
/* ========================================= TEKİL YAZI (TİPOGRAFİ VE RENK EŞİTLEME) ========================================= */
/* 1. Başlık */
 .entry-title {
     font-size: 3.5rem;
     font-weight: 900;
     line-height: 1.1;
     color: var(--text-color);
     letter-spacing: -1px;
     margin-bottom: 1rem;
     text-align: left;
}
/* 2. Giriş Özeti (Lead) - RENK EŞİTLENDİ */
 .entry-lead {
     font-size: 1.4rem;
     line-height: 1.5;
     font-weight: 300 !important;
    /* Başlık ve içerikle aynı renk */
     color: var(--text-color) !important;
     opacity: 0.9;
    /* Hafif bir ton farkı için opsiyonel, istenmezse kaldırılabilir */
}
 .entry-lead p {
     margin-bottom: 0;
}
/* 3. Meta Bilgiler (Tarih/Okunma) - RENK EŞİTLENDİ */
 .entry-meta {
    /* text-muted etkisini eziyoruz */
     color: var(--text-color) !important;
     font-weight: 600;
    /* Biraz daha belirgin */
}
 .entry-meta i {
     font-size: 1.1rem;
}
/* 4. İçerik Metni - RENK EŞİTLENDİ */
 .entry-content {
     font-size: 1.15rem;
     line-height: 1.8;
    /* Ana metin rengi */
     color: var(--text-color) !important;
     font-weight: 400;
}
 .entry-content p {
     margin-bottom: 1.5rem;
}
/* İçerik Başlıkları */
 .entry-content h2, .entry-content h3 {
     margin-top: 2.5rem;
     margin-bottom: 1rem;
     font-weight: 800;
     color: var(--text-color);
     line-height: 1.2;
}
 .entry-content h2 {
     font-size: 2rem;
}
 .entry-content blockquote {
     border-left: 6px solid var(--accent-color);
     background: #f9f9f9;
     padding: 2rem;
     margin: 2.5rem 0;
     font-size: 1.25rem;
     color: var(--text-color);
}
/* ========================================= TEKİL YAZI (FİNAL TİPOGRAFİ) ========================================= */
/* 1. Başlık */
 .entry-title {
     font-size: 3.5rem;
     font-weight: 900;
     line-height: 1.1;
     color: var(--text-color);
     letter-spacing: -1px;
     margin-bottom: 1rem;
     text-align: left;
}
/* 2. Giriş Özeti (Lead) - GÜNCELLENDİ */
 .entry-lead {
     font-size: 1.5rem !important;
    /* 1.6rem yapıldı */
     line-height: 1.5;
     font-weight: 300 !important;
     color: var(--text-color) !important;
     opacity: 0.9;
}
 .entry-lead p {
     margin-bottom: 0;
}
/* 3. Meta Bilgiler (Tarih/Okunma) */
 .entry-meta {
     color: var(--text-color) !important;
     font-weight: 300 !important;
     font-size: 0.85rem !important;
     opacity: 1 !important;
}
 .entry-meta i {
     font-size: 1rem;
}
/* 4. İçerik Metni - GÜNCELLENDİ */
 .entry-content {
     font-size: 1.2rem !important;
    /* 1.2rem yapıldı */
     line-height: 1.6 !important;
    /* 1.6 yapıldı */
     color: var(--text-color) !important;
     font-weight: 300 !important;
    /* 300 (Light) yapıldı */
}
 .entry-content p {
     margin-bottom: 1.5rem;
}
/* İçerik Başlıkları */
 .entry-content h2, .entry-content h3 {
     margin-top: 2.5rem;
     margin-bottom: 1rem;
     font-weight: 800;
     color: var(--text-color);
     line-height: 1.2;
}
 .entry-content h2 {
     font-size: 2rem;
}
/* Alıntı */
 .entry-content blockquote {
     border-left: 6px solid var(--accent-color);
     background: #f9f9f9;
     padding: 2rem;
     margin: 2.5rem 0;
     font-size: 1.25rem;
     color: var(--text-color);
}
/* ========================================= SOL DİKEY PAYLAŞIM (OPTİK HİZALAMA: -10px) ========================================= */
 .sticky-share-wrapper {
    /* STICKY AYARLARI */
     position: -webkit-sticky;
     position: sticky;
     top: 100px;
     display: flex;
     flex-direction: column;
     align-items: flex-end;
     gap: 15px;
     padding-right: 10px;
    /* GÜNCELLEME: Optik düzeltme için 10px yukarı çekildi */
     margin-top: -10px;
     z-index: 90;
     height: fit-content;
}
/* Buton Stili */
 .vertical-share-btn {
     width: 50px !important;
     height: 50px !important;
     border-radius: 50% !important;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     background-color: #fff;
     border: 1px solid #e0e0e0;
     color: var(--text-color);
     font-size: 1.2rem;
     text-decoration: none !important;
     transition: all 0.3s ease;
     position: relative;
     box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
 .vertical-share-btn i {
     transition: color 0.3s ease;
}
/* Hover Efekti */
 .vertical-share-btn:hover {
     background-color: var(--primary-color);
     border-color: var(--primary-color);
     transform: translateY(-3px);
     box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}
 .vertical-share-btn:hover i {
     color: #fff !important;
}
/* --- TOOLTIP --- */
 .vertical-share-btn::after {
     content: attr(data-tooltip);
     position: absolute;
     left: 125%;
     top: 50%;
     transform: translateY(-50%) translateX(-10px);
     background-color: #0b0b15;
     color: #fff;
     padding: 6px 12px;
     font-size: 11px;
     font-weight: 700;
     white-space: nowrap;
     border-radius: 4px;
     opacity: 0;
     visibility: hidden;
     pointer-events: none;
     transition: all 0.2s ease;
     z-index: 100;
}
 .vertical-share-btn::before {
     content: '';
     position: absolute;
     left: 125%;
     top: 50%;
     transform: translateY(-50%) translateX(-14px);
     border-width: 5px;
     border-style: solid;
     border-color: transparent #0b0b15 transparent transparent;
     opacity: 0;
     visibility: hidden;
     transition: all 0.2s ease;
}
 .vertical-share-btn:hover::after {
     opacity: 1;
     visibility: visible;
     transform: translateY(-50%) translateX(0);
}
 .vertical-share-btn:hover::before {
     opacity: 1;
     visibility: visible;
     transform: translateY(-50%) translateX(-10px);
}
/* ========================================= İÇERİK TİPOGRAFİSİ & DETAYLAR (EKSİKSİZ PAKET) ========================================= */
/* 1. ARA BAŞLIKLAR (H2, H3, H4) */
/* Okuyucunun gözünü yormadan konuyu böler */
 .entry-content h2, .entry-content h3, .entry-content h4 {
     color: var(--text-color);
     font-weight: 800;
     line-height: 1.3;
     margin-top: 3rem;
    /* Üstten bol boşluk */
     margin-bottom: 1.2rem;
}
 .entry-content h2 {
     font-size: 2.2rem;
     letter-spacing: -0.5px;
}
 .entry-content h3 {
     font-size: 1.7rem;
}
 .entry-content h4 {
     font-size: 1.4rem;
}
/* 2. ALINTI KUTUSU (BLOCKQUOTE) - MODERN & VURUCU */
 .entry-content blockquote {
     position: relative;
     margin: 3rem 0;
     padding: 2rem 2rem 2rem 3rem;
    /* Arkası hafif gri, Solu kalın mor çizgi */
     background: #f8f9fa;
     border-left: 5px solid var(--primary-color);
     font-size: 1.4rem;
     font-weight: 600;
     color: #333;
     line-height: 1.6;
}
/* Alıntıya tırnak işareti ikonu */
 .entry-content blockquote::before {
     content: '\201C';
    /* Açılış Tırnağı */
     position: absolute;
     top: 10px;
     left: 10px;
     font-size: 4rem;
     color: rgba(0,0,0,0.05);
    /* Çok silik */
     font-family: serif;
     line-height: 1;
}
/* Alıntı içindeki kaynak (cite) */
 .entry-content blockquote cite {
     display: block;
     margin-top: 1rem;
     font-size: 0.9rem;
     font-weight: 700;
     color: var(--primary-color);
     font-style: normal;
     text-transform: uppercase;
     letter-spacing: 1px;
}
/* 3. LİSTELER (UL / OL) */
 .entry-content ul, .entry-content ol {
     margin-bottom: 2rem;
     padding-left: 1.5rem;
}
 .entry-content li {
     margin-bottom: 0.8rem;
     font-size: 1.2rem;
    /* Metinle aynı */
     line-height: 1.6;
}
/* Sırasız liste maddelerini özel yapalım */
 .entry-content ul li {
     list-style: none;
     position: relative;
     padding-left: 10px;
}
 .entry-content ul li::before {
     content: '';
     position: absolute;
     left: -15px;
     top: 12px;
     width: 6px;
     height: 6px;
     background-color: var(--primary-color);
    /* Mor nokta */
     border-radius: 50%;
}
/* 4. İÇERİK LİNKLERİ */
 .entry-content a {
     color: var(--primary-color);
     font-weight: 600;
    /* Kalın alt çizgi */
     transition: all 0.2s;
}
 .entry-content a:hover {
     background-color: var(--primary-color);
     color: #fff !important;
}
/* 5. GÖRSELLER VE CAPTION */
 .entry-content img {
     max-width: 100%;
     height: auto;
     margin: 2rem 0;
}
 .wp-caption-text {
     font-size: 1rem;
     color: var(--text-color);
     text-align: center;
     margin-top: -1.5rem;
}
/* ========================================= BREADCRUMBS (YOL HARİTASI) TASARIMI ========================================= */
 .hype-breadcrumbs {
     display: none !important;
}
/* ========================================= BENZER İÇERİKLER (RELATED POSTS) ========================================= */
 .related-posts-wrapper {
     border-top: 1px solid var(--border-color);
    /* Üstten çizgiyle ayır */
}
/* Görsel Alanı */
 .related-img-wrap {
     height: 180px;
    /* Sabit yükseklik */
     width: 100%;
     border-radius: 0;
     display: block;
}
/* Hover Efekti */
 .related-card:hover .related-img-wrap img {
     transform: scale(1.05);
    /* Yaklaşma efekti */
}
 .related-card:hover .related-title {
     color: var(--primary-color) !important;
    /* Başlık mor olsun */
}
/* Başlık */
 .related-title {
     font-size: 1.1rem;
     line-height: 1.4;
     transition: color 0.2s ease;
    /* 2 Satırda kes */
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
/* ========================================= İSTENMEYEN OTOMATİK İÇERİKLERİ GİZLE ========================================= */
/* Jetpack Related Posts Gizle */
 #jp-relatedposts, .jp-relatedposts {
     display: none !important;
     visibility: hidden !important;
     height: 0 !important;
     overflow: hidden !important;
}
/* ========================================= BENZER İÇERİKLER (MİNİMAL & ÖZETLİ) ========================================= */
/* Görsel Alanı (Karemsi/Dikdörtgen) */
 .related-simple-img-wrap {
     height: 180px;
    /* Sabit yükseklik, düzenli dursun */
     width: 100%;
     display: block;
     border-radius: 0;
    /* Keskin köşe */
}
/* Hover Efekti: Zoom */
 .related-simple-card:hover .related-simple-img-wrap img {
     transform: scale(1.05);
}
/* Başlık */
 .related-simple-title a {
     font-size: 1.1rem;
    /* Çok büyük olmasın */
     font-weight: 800;
     line-height: 1.3;
     color: var(--text-color);
     text-decoration: none !important;
     display: block;
     transition: color 0.2s ease;
}
 .related-simple-title a:hover {
     color: var(--primary-color);
}
/* Özet */
 .related-simple-excerpt {
     font-size: 0.9rem;
     line-height: 1.5;
     color: #777;
    /* 3 Satırda kes */
     display: -webkit-box;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
}
/* ========================================= ETİKETLER (TAGS) TASARIMI ========================================= */
 .tag-label {
     font-weight: 900;
     font-size: 0.8rem;
     color: var(--text-color);
     letter-spacing: 1px;
     text-transform: uppercase;
    /* GÜNCELLEME: Hizalama için alt boşluk eklendi */
     margin-bottom: 8px;
     display: inline-block;
    /* Margin'in işlemesi için */
}
 .hype-tag {
     display: inline-block;
     padding: 6px 16px;
     margin-right: 8px;
     margin-bottom: 8px;
    /* Bu değerle eşitlendi */
     background-color: #f3f3f3;
     color: #555 !important;
     border: 1px solid #eee;
     font-size: 0.75rem;
     font-weight: 700;
     text-transform: uppercase;
     text-decoration: none !important;
     letter-spacing: 0.5px;
     border-radius: 4px;
     transition: all 0.2s ease;
}
/* Hover Efekti */
 .hype-tag:hover {
     background-color: var(--primary-color);
     border-color: var(--primary-color);
     color: #fff !important;
     transform: translateY(-2px);
}
/* ========================================= MOBİL STICKY BAR ========================================= */
 .mobile-sticky-bar {
     position: fixed;
     bottom: 0;
     left: 0;
     width: 100%;
     height: 60px;
     background-color: #fff;
     border-top: 1px solid #eee;
     z-index: 9999;
     box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
     padding: 0 1rem;
}
 .mobile-share-text {
     font-size: 0.75rem;
     font-weight: 800;
     text-transform: uppercase;
     color: var(--text-color);
}
 .mobile-btn {
     width: 35px;
     height: 35px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.1rem;
     text-decoration: none !important;
     border: none;
     cursor: pointer;
}
/* Renkler */
 .mobile-btn.whatsapp {
     background: #25D366;
     color: #fff;
}
 .mobile-btn.twitter {
     background: #000;
     color: #fff;
}
 .mobile-btn.telegram {
     background: #0088cc;
     color: #fff;
}
 .mobile-btn.native {
     background: #f0f0f0;
     color: #333;
}
/* ========================================= MOBİL İÇİN ÖZEL DÜZELTMELER (FİNAL) ========================================= */
 @media (max-width: 991px) {
    /* 1. MOBİL STICKY BAR TASARIMI (REVİZE EDİLDİ) */
     .mobile-sticky-bar {
         position: fixed;
         bottom: 0;
         left: 0;
         width: 100%;
         height: 70px;
        /* Dokunma payı için ideal yükseklik */
         background-color: #fff;
        /* Beyaz Zemin */
         border-top: 1px solid #eaeaea;
        /* İncecik çizgi */
        /* Gölge: Aşağıdan yukarıya hafifçe vursun */
         box-shadow: 0 -5px 20px rgba(0,0,0,0.05);
         padding: 0 20px;
         z-index: 999999 !important;
         display: flex;
         align-items: center;
         justify-content: space-between;
    }
    /* İçerik altta kalmasın diye boşluk */
     body {
         padding-bottom: 80px !important;
    }
    /* "Paylaş" Yazısı */
     .mobile-share-label {
         font-weight: 800;
         font-size: 0.85rem;
         color: var(--text-color);
         letter-spacing: 1px;
         display: flex;
         align-items: center;
    }
     .mobile-share-label i {
         color: var(--primary-color);
    }
    /* İkon Mor olsun */
    /* Butonlar (DAİRE & TEMİZ) */
     .mob-btn {
         width: 42px;
         height: 42px;
         border-radius: 50% !important;
        /* KESİN DAİRE */
         display: flex;
         align-items: center;
         justify-content: center;
         background-color: #fff;
        /* Beyaz Zemin */
         border: 1px solid #e0e0e0;
        /* İnce Gri Çerçeve */
         color: var(--text-color);
        /* Siyah İkon */
         font-size: 1.1rem;
         text-decoration: none !important;
         transition: all 0.2s ease;
    }
    /* O cırtlak arka plan renklerini sildik/ezdik */
     .mob-btn.whatsapp, .mob-btn.twitter, .mob-btn.telegram, .mob-btn.native {
         background: #fff !important;
         color: var(--text-color) !important;
    }
    /* Aktif/Tıklama Efekti (Telefonda basınca belli olsun) */
     .mob-btn:active {
         background-color: var(--primary-color) !important;
        /* Basınca Mor */
         border-color: var(--primary-color) !important;
         color: #fff !important;
        /* İkon Beyaz */
    }
    /* 2. DİĞER TİPOGRAFİ DÜZELTMELERİ */
     .entry-title {
         font-size: 2.2rem !important;
         line-height: 1.1 !important;
         margin-bottom: 1rem !important;
    }
     .entry-lead {
         font-size: 1.2rem !important;
         line-height: 1.5 !important;
    }
     .entry-content {
         font-size: 1.1rem !important;
         line-height: 1.6 !important;
    }
     .entry-meta {
         font-size: 0.8rem !important;
         flex-wrap: wrap;
         gap: 10px !important;
    }
    /* --- MOBİL BREADCRUMBS DÜZELTMESİ --- */
     .hype-breadcrumbs {
         font-size: 0.7rem !important;
        /* Biraz daha okunaklı */
         margin-bottom: 0.5rem !important;
        /* Alt boşluğu kıstık */
         line-height: 1.3;
         font-weight: 700;
        /* Ortalamak istersen: */
        /* text-align: center;
         justify-content: center;
         display: flex;
         */
    }
    /* Mobilde Breadcrumb içindeki uzun başlığı GİZLE */
    /* Sadece "Anasayfa / Kategori" kalsın */
     .hype-breadcrumbs .breadcrumb-item.active {
         display: none !important;
    }
     .container-hype {
         padding-left: 20px !important;
         padding-right: 20px !important;
    }
     .hype-heading .title {
         font-size: 1rem !important;
    }
}
/* ========================================= FİNAL RÖTUŞLAR (GAP, PROGRESS, UP BUTTON) ========================================= */
/* 1. FOOTER BOŞLUK DÜZELTMESİ (GAP FIX) */
 .copyright-bar p {
     margin-bottom: 0 !important;
    /* Altındaki boşluğu sıfırlar */
     line-height: 1.5;
    /* Satır yüksekliğini dengeler */
}
/* Mobilde Footer ile Sticky Bar arasını kapat */
 @media (max-width: 991px) {
     .site-footer {
         margin-bottom: 0 !important;
         padding-bottom: 20px !important;
        /* Sticky bar'ın arkasında kalacak pay */
    }
}
/* 2. OKUMA ÇUBUĞU (PROGRESS BAR) DÜZELTMESİ */
 #progress-container {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 5px;
    /* Biraz kalınlaştırdık */
     background: transparent;
     z-index: 9999999 !important;
    /* HER ŞEYİN EN ÜSTÜNDE */
}
 #progress-bar {
     height: 100%;
     background: var(--primary-color);
     width: 0%;
     box-shadow: 0 0 10px rgba(111, 0, 255, 0.5);
    /* Hafif parlama */
     transition: width 0.1s ease;
}
/* ========================================= 2. YUKARI ÇIK BUTONU (SOSYAL İKON STİLİ) ========================================= */
 #back-to-top {
     position: fixed;
     bottom: 30px;
     right: 30px;
    /* GÜNCELLEME: Paylaşım butonlarıyla aynı boyut */
     width: 50px;
     height: 50px;
    /* GÜNCELLEME: Beyaz Zemin, İnce Çerçeve */
     background-color: #fff;
     color: var(--text-color);
    /* Siyah İkon */
     border: 1px solid #e0e0e0;
     border-radius: 50% !important;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.2rem;
     opacity: 0;
     visibility: hidden;
     transition: all 0.3s ease;
     z-index: 99999;
    /* Hafif gölge (Düz beyaz kağıt gibi durmasın) */
     box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}
 #back-to-top.show {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
}
/* Hover: Üzerine gelince Mor olsun */
 #back-to-top:hover {
     background-color: var(--primary-color);
     border-color: var(--primary-color);
     color: #fff;
     transform: translateY(-5px);
     box-shadow: 0 5px 15px rgba(111, 0, 255, 0.2);
}
/* Mobilde konum ayarı */
 @media (max-width: 991px) {
     #back-to-top {
         bottom: 90px;
        /* Sticky bar'ın üstünde */
         right: 20px;
         width: 45px;
        /* Mobilde biraz daha kibar */
         height: 45px;
    }
}
/* Mobil Header - Admin Bar Çakışmasını Önle */
 body.admin-bar .sticky-top {
     top: 32px !important;
}
/* Yan Panel (Side Panel) En Üstte Olsun */
 .side-panel {
     z-index: 999999 !important;
     max-width: 85%;
}
 #panel-overlay {
     z-index: 999998 !important;
}
/* Panel açılınca arka plan kaymasın */
 body.overflow-hidden {
     overflow: hidden;
}
/* Mobil Logo İnce Ayar */
 .d-lg-none .custom-logo {
     max-height: 40px;
     width: auto;
     display: block;
}
/* 1. BEYAZ BOŞLUK DÜZELTMESİ */
/* Mobilde alttaki boşluğu kaldırıyoruz */
 body {
     padding-bottom: 0 !important;
}
/* Eğer sticky bar kullanıyorsak boşluğu sadece o varken footer'a veririz */
 @media (max-width: 991px) {
     .site-footer {
         padding-bottom: 80px !important;
        /* Paylaşım barı footer'ın üstüne binsin ama içerik kapanmasın */
         margin-bottom: 0 !important;
    }
}
/* 2. MOBİL LOGO DÜZELTMESİ */
/* Logonun kesinlikle görünmesini sağlar */
 .d-lg-none img {
     display: inline-block !important;
     max-height: 45px !important;
    /* Yükseklik */
     width: auto !important;
     opacity: 1 !important;
     visibility: visible !important;
}
/* 3. MOBİLDE ÖZET METNİ */
/* Mobilde özet yazı boyutunu ayarlayalım, çok büyük olmasın */
 @media (max-width: 991px) {
     .latest-excerpt {
         font-size: 0.95rem;
         display: block !important;
        /* Gizlenmeyi engelle */
         margin-bottom: 1rem;
         color: #666;
    }
}
/* ========================================= MOBİL TAM EKRAN (EDGE-TO-EDGE) MODU ========================================= */
 @media (max-width: 991px) {
    /* 1. Kapsayıcıların Kenar Boşluklarını Sıfırla */
    /* Manset, Vitrin, Trend ve Son Eklenenler kapsayıcıları */
     .manset-container, .showcase-container, .trend-container, .container-hype.mt-5.mb-5 {
         padding-left: 0 !important;
         padding-right: 0 !important;
         width: 100% !important;
         max-width: 100% !important;
         overflow-x: hidden;
        /* Yan kaymayı engelle */
    }
    /* 2. Header ve Footer'ı Koru */
    /* Onların kenar boşluğa ihtiyacı var, logolar yapışmasın */
     .site-header .container-hype, .site-footer .container-hype {
         padding-left: 20px !important;
         padding-right: 20px !important;
    }
    /* 3. Kartların Kenarlarını Sıfırla ve Çizgileri Kaldır */
     .manset-style-card, .latest-card {
         border-radius: 0 !important;
        /* Köşeleri keskin yap */
         border-left: none !important;
         border-right: none !important;
         margin: 0 !important;
         width: 100% !important;
    }
    /* 4. Metinlerin Kenara Yapışmasını Engelle (İç Padding) */
    /* Görsel tam ekran olsun ama yazı içeriden başlasın */
     .manset-content-wrapper, .latest-content, .trend-item {
         padding-left: 20px !important;
         padding-right: 20px !important;
    }
    /* 5. Trend Alanı Özel Düzeltme */
     .trend-container .row {
         margin: 0 !important;
    }
     .trend-container .col-lg-4 {
         padding: 0 !important;
         border-right: none !important;
         border-left: none !important;
    }
    /* 6. Son Eklenenler Fotoğrafı Tam Genişlik Olsun */
     .latest-img-link {
         width: 100% !important;
         height: auto !important;
         min-height: 250px;
    }
}
/* ========================================= FOOTER BOŞLUK DÜZELTMESİ (FİNAL) ========================================= */
/* 1. Genel Ayar: Tüm sayfalarda alt boşlukları sıfırla */
 body, html {
     padding-bottom: 0 !important;
     margin-bottom: 0 !important;
     height: auto !important;
}
 @media (max-width: 991px) {
    /* Normalde Footer'ın altında hiç boşluk olmasın */
     .site-footer {
         margin-bottom: 0 !important;
         padding-bottom: 0 !important;
    }
    /* İSTİSNA: Sadece 'Yazı Detay' (Single) sayfasında alttan 80px boşluk bırak */
    /* Çünkü orada Sticky Paylaşım Barı var */
     body.single .site-footer, body.single-post .site-footer {
         padding-bottom: 80px !important;
    }
}
/* ========================================= MOBİL İÇİN FİNAL CSS (VİTRİN, TREND & MANŞET EŞİTLEME) ========================================= */
 @media (max-width: 991px) {
    /* 1. TÜM KAPSAYICILARI SIFIRLA (SAĞ/SOL BOŞLUKLARI AL) */
     .manset-container, .showcase-container, .trend-container, .container-hype.mt-5.mb-5 {
         padding-left: 0 !important;
         padding-right: 0 !important;
         width: 100% !important;
         overflow-x: hidden;
    }
    /* 2. ROW (SATIR) NEGATİF MARGİNLERİ SIFIRLA */
    /* Bootstrap row'ların -12px/15px marginlerini yok et ki taşma olmasın */
     .showcase-container .row, .trend-container .row, .manset-container .row {
         margin-left: 0 !important;
         margin-right: 0 !important;
    }
    /* 3. DİKEY ÇİZGİLERİ (BORDER) ÖLDÜR */
    /* Ortadaki elemanın sağındaki/solundaki çizgileri kesin olarak kaldırır */
     .showcase-container .border-end, .showcase-container .border-start, .trend-container .border-end, .trend-container .border-start, .col-lg-4, .col-12 {
         border-left: none !important;
         border-right: none !important;
         border-image: none !important;
    }
    /* 4. SÜTUN (KART) BOŞLUKLARINI SIFIRLA */
     .showcase-container .col-lg-4, .trend-container .col-lg-4 {
         padding-left: 0 !important;
         padding-right: 0 !important;
        /* Kartlar arasına sadece alt çizgi koy */
         border-bottom: 1px solid #eee !important;
         margin-bottom: 2rem;
        /* Kartlar arası boşluk */
    }
    /* 5. METİN İÇERİĞİNİ HİZALA (MANŞET İLE AYNI) */
    /* Görsel tam ekran, yazı 20px içeriden */
     .manset-content-wrapper, .manset-style-card .manset-content-wrapper, .latest-content {
         padding-left: 20px !important;
         padding-right: 20px !important;
    }
    /* 6. SON ELEMANIN ALT ÇİZGİSİNİ KALDIR */
     .showcase-container .col-lg-4:last-child, .trend-container .col-lg-4:last-child {
         border-bottom: none !important;
         margin-bottom: 0 !important;
    }
    /* 7. GÖRSELLER TAM EKRAN */
     .manset-img-area, .latest-img-link {
         width: 100% !important;
         border-radius: 0 !important;
    }
}
/* ========================================= FİNAL RÖTUŞLAR: MOBİL BOŞLUK & MASAÜSTÜ ÇERÇEVE ========================================= */
/* 1. MOBİLDEKİ SAĞ BOŞLUK (PIXEL PERFECT FIX) */
 @media (max-width: 991px) {
    /* Satırın sağındaki negatif boşlukları zorla sıfırla */
     .manset-container .row, .showcase-container .row, .trend-container .row {
         margin-right: 0 !important;
         margin-left: 0 !important;
         width: 100% !important;
         padding-right: 0 !important;
    }
    /* Sütunların (Kartların) sağa taşmasını veya boşluk kalmasını engelle */
     .col-lg-4, .col-12, .col-md-6 {
         padding-right: 0 !important;
         margin-right: 0 !important;
         max-width: 100% !important;
    }
    /* Body ve HTML taşmalarını engelle (Scroll bar çıkmasını önler) */
     html, body {
         overflow-x: hidden;
         width: 100%;
         position: relative;
    }
}
/* ========================================= FİNAL TAMİR PAKETİ (HOVER + BORDER + MOBİL FIX) ========================================= */
/* 1. MASAÜSTÜ: ÇERÇEVELER VE HOVER EFEKTLERİ */
 @media (min-width: 992px) {
    /* A) ÇERÇEVELERİ GERİ GETİR (Grid ve Row Üzerine) */
     .click-mag-grid {
         border-left: 1px solid var(--border-color) !important;
         border-right: 1px solid var(--border-color) !important;
    }
     .showcase-container .row, .trend-container .row {
         border-left: 1px solid var(--border-color) !important;
         border-right: 1px solid var(--border-color) !important;
        /* Bootstrap marginlerini sıfırla ki çerçeve tam otursun */
         margin-left: 0 !important;
         margin-right: 0 !important;
         width: 100% !important;
    }
    /* B) HOVER EFEKTLERİ (Karta gelince resim büyüsün) */
    /* Manşet Sol */
     .manset-main-block .manset-img-area img {
         transition: transform 0.5s ease;
    }
     .manset-main-block:hover .manset-img-area img {
         transform: scale(1.05);
    }
    /* Showcase (Vitrin) */
     .manset-style-card .manset-img-area img {
         transition: transform 0.5s ease;
    }
     .manset-style-card:hover .manset-img-area img {
         transform: scale(1.05);
    }
    /* Trend */
     .trend-item .trend-img {
         transition: transform 0.5s ease;
    }
     .trend-item:hover .trend-img {
         transform: scale(1.05);
    }
    /* Başlık Renk Değişimi */
     .manset-main-block:hover .manset-main-title a, .manset-style-card:hover .manset-main-title a, .trend-item:hover .trend-title a {
         color: var(--primary-color) !important;
    }
}
/* 2. MOBİL: SAĞ BOŞLUK FIX (Edge-to-Edge) */
 @media (max-width: 991px) {
     html, body {
         overflow-x: hidden !important;
         position: relative;
         width: 100%;
    }
    /* Satırları ekrana zorla yay (100vw) */
     .showcase-container .row, .trend-container .row, .manset-container .row {
         width: 100vw !important;
         margin-left: 0 !important;
         margin-right: 0 !important;
    }
     .col-lg-4, .col-12 {
         padding-right: 0 !important;
         max-width: 100vw !important;
    }
    /* Mobilde Borderları Kaldır (Temiz görünüm için) */
     .click-mag-grid, .showcase-container .row, .trend-container .row {
         border-left: none !important;
         border-right: none !important;
		 margin: 2rem 0;
    }
}
/* ========================================= SON EKLENENLER ÖZEL KUTU TASARIMI ========================================= */
 @media (min-width: 992px) {
    /* 1. SIDEBAR'IN SOL ÇİZGİSİNİ KALDIR */
    /* Bu çizgi Bootstrap'ten geliyor, onu siliyoruz ki çakışma olmasın */
     .col-lg-3.border-start {
         border-left: none !important;
    }
    /* 2. İÇERİK KUTUSUNU ÇERÇEVELE (BAŞLIK DIŞARIDA) */
    /* Doğrudan haberlerin listelendiği ID'yi hedefliyoruz */
     #latest-posts-container {
        /* Sol, Üst ve Sağ Çizgiler */
         border-left: 1px solid var(--border-color);
         border-top: 1px solid var(--border-color);
         border-right: 1px solid var(--border-color);
        /* Sidebar yerine burası */
        /* Alt çizgi (Kutuyu kapatmak istersen) */
         border-bottom: 1px solid var(--border-color);
        /* İçerik çizgiden biraz ayrılsın */
         padding-top: 0;
        /* Altındaki 'Daha Fazla Göster' butonu ile mesafe */
         margin-bottom: 2rem;
    }
    /* 3. İLK HABERİN ÜST ÇİZGİSİNİ GİZLE */
    /* Kutunun kendi üst çizgisi var, haberin çizgisiyle duble olmasın */
     #latest-posts-container .latest-card:first-child {
         border-top: none !important;
    }
    /* 4. KENAR BOŞLUKLARI DÜZELTMESİ */
    /* Kutunun çizgileri, sütunun padding'inden dolayı içeride kalmasın */
    /* Bu ayar çizgiyi sütunun en kenarına iter */
     .col-lg-9 {
         padding-right: 0 !important;
        /* Sağdaki sidebar boşluğunu al */
    }
     #latest-posts-container {
         margin-right: 1.5rem;
        /* Sidebar ile araya manuel boşluk koy */
    }
}
/* ========================================= FİNAL EKLENTİLER (V80 ÜZERİNE YAMA) Sadece En Alta Ekleyin - Mevcut Düzeni Bozmaz ========================================= */
/* 1. "SON EKLENENLER" KUTU GÖRÜNÜMÜ & BOŞLUK DOLDURMA (MASAÜSTÜ) */
 @media (min-width: 992px) {
    /* A) Kutuyu Çevrele (Başlık Hariç) */
     #latest-posts-container {
         border: 1px solid var(--border-color);
        /* 4 Tarafı Kapat */
         margin-right: 20px;
        /* Sidebar ile mesafe */
         margin-bottom: 30px;
    }
    /* B) İlk Haberin Üst Çizgisini Kaldır (Çift Çizgi Olmasın) */
     #latest-posts-container .latest-card:first-child {
         border-top: none !important;
    }
    /* C) Yazı Alanını Genişlet (Sağdaki Boşluğu Yok Et) */
     .latest-card {
         display: flex !important;
         align-items: stretch !important;
    }
     .latest-content {
         flex: 1 !important;
        /* Kalan tüm alanı doldur */
         width: auto !important;
        /* Sabit genişliği iptal et */
         max-width: none !important;
         padding-right: 2rem !important;
        /* Çizgiye yapışmasın */
    }
     .latest-img-link {
         flex-shrink: 0 !important;
        /* Resim sıkışmasın */
    }
    /* D) Sidebar Sol Çizgisini Kaldır (Çakışma Olmasın) */
     .col-lg-3.border-start {
         border-left: none !important;
    }
    /* Manşet ve Showcase'e de Yan Çizgiler */
     .click-mag-grid, .showcase-container .row, .trend-container .row {
         border-left: 1px solid var(--border-color);
         border-right: 1px solid var(--border-color);
		 margin: 2rem 0;
    }
}
/* 2. HOVER EFEKTLERİ (Karta gelince resim büyüsün) */
 @media (min-width: 992px) {
     .latest-img, .manset-img-area img, .trend-img {
         transition: transform 0.5s ease;
    }
    /* Son Eklenenler Hover */
     .latest-card:hover .latest-img {
         transform: scale(1.05);
    }
     .latest-card:hover .latest-title a {
         color: var(--primary-color) !important;
    }
    /* Manşet Hover */
     .manset-main-block:hover .manset-img-area img {
         transform: scale(1.05);
    }
     .manset-main-block:hover .manset-main-title a {
         color: var(--primary-color) !important;
    }
    /* Trend/Vitrin Hover */
     .manset-style-card:hover .manset-img-area img {
         transform: scale(1.05);
    }
     .manset-style-card:hover .manset-main-title a {
         color: var(--primary-color) !important;
    }
}
/* 3. MOBİL BOŞLUK DÜZELTMESİ */
 @media (max-width: 991px) {
    /* Footer altındaki beyaz boşluğu sil */
     .site-footer {
         margin-bottom: 0 !important;
         padding-bottom: 20px !important;
    }
    /* Sadece yazı detayında sticky bar için yer aç */
     body.single .site-footer {
         padding-bottom: 80px !important;
    }
}
/* ========================================= SON EKLENENLER: KUTU VE HİZALAMA DÜZELTMESİ (FİNAL) ========================================= */
 @media (min-width: 992px) {
    /* 1. MEVCUT UZUN ÇİZGİYİ YOK ET */
    /* Sağdaki sidebar sütununun sol çizgisini kaldırıyoruz. Böylece çizgi başlığın yanına çıkamaz. */
     .col-lg-3.border-start {
         border-left: none !important;
         padding-left: 0 !important;
    }
    /* 2. İÇERİK KUTUSUNA ÇERÇEVE VER */
    /* Başlık dışarıda kalır, sadece haberler çerçevelenir */
     #latest-posts-container {
        /* 4 Tarafı Kapat (Üst, Alt, Sağ, Sol) */
         border: 1px solid var(--border-color) !important;
        /* Sidebar ile kutu arasına mesafe koy */
         margin-right: 2rem !important;
        /* İSTEĞİN: "Daha Fazla Göster" butonu ile araya 2rem boşluk */
         margin-bottom: 2rem !important;
    }
    /* 3. İÇERİK YAYILIMI (Turuncu Alanı Doldur) */
    /* Kart esnek olsun, yazı alanı kalan boşluğu doldursun */
     #latest-posts-container .latest-card {
         display: flex !important;
         width: 100% !important;
    }
     #latest-posts-container .latest-content {
         flex: 1 !important;
        /* Kalan tüm boşluğu kapla */
         width: auto !important;
         max-width: none !important;
         padding-right: 2rem !important;
        /* Sağdaki yeni çizgiye yapışmasın */
    }
     #latest-posts-container .latest-img-link {
         flex-shrink: 0 !important;
        /* Resim sıkışmasın */
    }
    /* 4. ÇİFT ÇİZGİ TEMİZLİĞİ */
    /* Kutunun zaten alt çizgisi var, son kartın alt çizgisini siliyoruz */
     #latest-posts-container .latest-card:last-child {
         border-bottom: none !important;
         padding-bottom: 0 !important;
        /* Alt boşluğu sıfırla */
    }
}
/* ========================================= ACİL DÜZELTME: SON EKLENENLER KUTUSU VE BOŞLUK (Sadece Masaüstü - Diğer yerleri bozmaz) ========================================= */
 @media (min-width: 992px) {
    /* 1. KUTUYU OLUŞTUR (Başlık Dışarıda) */
     #latest-posts-container {
        /* 4 tarafı kapat */
         border: 1px solid var(--border-color) !important;
        /* Sağdaki Sidebar ile arayı aç (Yapışmasın) */
         margin-right: 30px !important;
        /* Alttaki "Daha Fazla Göster" butonu ile arayı aç */
         margin-bottom: 2rem !important;
    }
    /* 2. BOŞLUK SORUNU (TURUNCU ALAN ÇÖZÜMÜ) */
    /* Kartı esnek yap */
     #latest-posts-container .latest-card {
         display: flex !important;
         width: 100% !important;
    }
    /* Yazı alanına "Kalan tüm boşluğu doldur" emri veriyoruz */
     #latest-posts-container .latest-content {
         flex: 1 !important;
        /* Sihirli kod bu: Boşluğu doldurur */
         width: auto !important;
        /* Sabit genişliği iptal et */
         max-width: none !important;
    }
    /* 3. SİDEBAR ÇİZGİSİNİ KALDIR */
    /* Sağdaki sidebar'ın sol çizgisini siliyoruz, çünkü artık bizim kutumuzun çizgisi var */
     .col-lg-3.border-start {
         border-left: none !important;
         padding-left: 0 !important;
    }
    /* 4. TEMİZLİK */
    /* Kutunun içindeki ilk haberin üst çizgisini sil (Çift çizgi olmasın) */
     #latest-posts-container .latest-card:first-child {
         border-top: none !important;
    }
    /* Manşet ve Vitrin'e de aynı çerçeveyi ver (Bütünlük için) */
     .click-mag-grid, .showcase-container .row, .trend-container .row {
         border-left: 1px solid var(--border-color) !important;
         border-right: 1px solid var(--border-color) !important;
    }
}
/* ========================================= ACİL ÇÖZÜM: SON EKLENENLER (BOŞLUK & KUTU) ========================================= */
 @media (min-width: 992px) {
    /* 1. YAZIYI ZORLA YAY (TURUNCU ALANI KAPAT) */
    /* Flex yapısını zorluyoruz */
     #latest-posts-container .latest-card {
         display: flex !important;
         width: 100% !important;
         flex-direction: row !important;
        /* Yan yana olmaya zorla */
    }
    /* Yazı alanına "Kalan her yeri kapla" diyoruz */
     #latest-posts-container .latest-content {
         flex-grow: 1 !important;
        /* BÜYÜ VE KAPLA */
         flex-basis: 0 !important;
        /* Genişliği esnek bırak */
         width: auto !important;
        /* Sabit genişliği iptal et */
         max-width: 100% !important;
    }
    /* Resim sabit kalsın, ezilmesin */
     #latest-posts-container .latest-img-link {
         flex-shrink: 0 !important;
         width: 430px !important;
    }
    /* 2. KUTU ÇERÇEVESİ (BAŞLIK HARİÇ) */
     #latest-posts-container {
         border: 1px solid #eaeaea !important;
        /* Çerçeve */
         margin-right: 30px !important;
        /* Sidebar ile mesafe */
         margin-bottom: 2rem !important;
        /* Butonla mesafe */
         padding: 0 !important;
        /* İç boşluk sıfır */
    }
    /* 3. SIDEBAR ÇİZGİSİNİ SİL (ÇAKIŞMA OLMASIN) */
     .col-lg-3 {
        /* Sidebar içeriğini 2rem sağa itiyoruz */
         padding-left: 2rem !important;
        /* Aradaki çizgiyi siliyoruz */
         border-left: none !important;
    }
    /* 4. İLK HABERİN ÜST ÇİZGİSİNİ SİL (ÇİFT ÇİZGİ OLMASIN) */
     #latest-posts-container .latest-card:first-child {
         border-top: none !important;
    }
}
/* ======================================================= ACİL DÜZELTME YAMASI (PATCH V1) Bu kodları dosyanın EN ALTINA ekleyin. ======================================================= */
/* 1. SON EKLENENLER (BOŞLUK DOLDURMA & KUTU) */
 @media (min-width: 992px) {
    /* Kutuyu Çevrele */
     #latest-posts-container {
         border: 1px solid #eaeaea !important;
         margin-right: 0 !important;
        /* Sidebar padding ile itilecek */
         margin-bottom: 2rem !important;
    }
    /* İçerik Düzeni (FLEX FIX) */
     #latest-posts-container .latest-card {
         display: flex !important;
         width: 100% !important;
         align-items: stretch !important;
         border-bottom: 1px solid #eaeaea !important;
    }
     #latest-posts-container .latest-card:first-child {
         border-top: none !important;
    }
    /* YAZIYI SAĞA YAY (TURUNCU ALANI KAPAT) */
     #latest-posts-container .latest-content {
         flex: 1 !important;
        /* Kalan alanı doldur */
         width: auto !important;
        /* Sabit genişliği iptal et */
         max-width: none !important;
         padding-right: 2rem !important;
    }
    /* Resim Sabit */
     #latest-posts-container .latest-img-link {
         flex-shrink: 0 !important;
         width: 430px !important;
    }
    /* SIDEBAR ÇİZGİSİNİ KALDIR VE İT */
     .col-lg-3.border-start, .col-lg-3.ps-4 {
         border-left: none !important;
         padding-left: 2rem !important;
        /* 2rem boşluk */
		 border-right:none;
		 border-top:none;
    }
}
/* 2. ARŞİV SAYFASI (SHOWCASE STİLİNE DÖNÜŞTÜRME) */
 .archive-img-area {
     width: 100% !important;
     aspect-ratio: 16/9 !important;
    /* Vitrin oranı */
     height: auto !important;
     margin-bottom: 1rem !important;
     border-radius: 0 !important;
}
 .archive-title a {
     font-size: 1.4rem !important;
    /* Vitrin başlık boyutu */
     font-weight: 800 !important;
     line-height: 1.2 !important;
}
 .archive-excerpt {
     font-size: 1rem !important;
     color: #666 !important;
     line-height: 1.5 !important;
}
/* Arşiv Grid Çizgileri (Masaüstü) */
 @media (min-width: 992px) {
     .archive-container .row {
         border-left: 1px solid #eaeaea;
         border-right: 1px solid #eaeaea;
    }
     .archive-card {
         margin-bottom: 2rem;
    }
}
/* 3. SINGLE POST (DETAY) DÜZELTMELERİ */
 .hype-breadcrumbs {
     display: none !important;
}
/* Kesin Gizle */
/* Sticky Share Fix */
 .sticky-share-wrapper {
     position: -webkit-sticky !important;
     position: sticky !important;
     top: 100px !important;
     z-index: 99 !important;
}
/* Okuma Barı Görünürlük */
 #progress-container {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 5px;
     z-index: 999999 !important;
     background: transparent;
}
 #progress-bar {
     background: var(--primary-color);
     height: 100%;
     width: 0%;
}
/* 4. STİL RÖTUŞLARI */
/* Haberi Oku Çizgisi Kısa Olsun */
 .read-more-simple, .read-more-link {
     display: inline-block !important;
    /* Sadece yazı kadar */
     width: auto !important;
     margin-top: 10px;
}
/* Başlık Boyutlarını Dizginle */
 .manset-main-title a {
     font-size: 2.2rem !important;
}
/* Çok büyüktü */
 .trend-title a, .latest-title a {
     font-size: 1.4rem !important;
}
/* Kategori Yazıları Eşitleme (Manşet Sol Referansı) */
 .click-cat-text, .archive-cat-text, .single-cat-text, .trend-cat-text {
     font-size: 0.9rem !important;
     font-weight: 800 !important;
     text-transform: uppercase !important;
     letter-spacing: 1px !important;
     color: var(--primary-color) !important;
     display: inline-block;
     margin-bottom: 5px;
}
/* Manşet Sağ Özet (Sol ile aynı stil) */
 .manset-list-excerpt {
     font-family: var(--font-main);
     font-size: 0.95rem !important;
    /* Biraz küçülttük */
     color: #666 !important;
     line-height: 1.5 !important;
     font-weight: 400 !important;
     margin-top: 5px;
}
/* ========================================= SINGLE POST (HABER DETAY) KUTU TASARIMI ========================================= */
/* 1. ANA KUTU ÇERÇEVESİ */
 .single-post-box {
     border: 1px solid var(--border-color);
    /* Sağ, Sol, Alt, Üst */
     background-color: #fff;
    /* Zemin Beyaz */
     margin-bottom: 2rem;
     overflow: hidden;
    /* Taşmaları engelle */
}
/* 2. FOTOĞRAF (SIFIR BOŞLUK) */
 .entry-image-full {
     width: 100%;
     margin: 0;
     padding: 0;
     border-bottom: 1px solid var(--border-color);
    /* Fotoğrafın altına ince çizgi */
}
 .entry-image-full img {
     display: block;
     width: 100%;
}
/* 3. İÇERİK ALANI (PADDING) */
 .single-content-body {
     padding: 2rem;
    /* Her yönden 2rem boşluk */
}
/* 4. MOBİL UYUM */
 @media (max-width: 991px) {
    /* Mobilde padding biraz azalsın */
     .single-content-body {
         padding: 1.5rem;
    }
     .entry-image-full {
         border-bottom: 1px solid #eee;
    }
}
/* Ufak Paylaşım Butonları */
 .small-share {
     width: 35px !important;
     height: 35px !important;
     font-size: 1rem !important;
}
/* ========================================= SINGLE POST - TEMİZ KUTU YAPISI (NO NEGATIVE MARGIN) ========================================= */
/* 1. ANA KUTU (Sadece Çerçeve, İç Boşluk YOK) */
 .single-post-box {
     border: 1px solid var(--border-color);
     background-color: #fff;
     margin-bottom: 2rem;
     overflow: hidden;
}
/* 2. PADDING ALANI (Başlık ve İçerik için ayrı ayrı) */
/* Fotoğraf ve çizgi bu sınıfa sahip olmadığı için tam genişlik kalır */
 .post-padding-area {
     padding: 2rem;
}
/* 3. FOTOĞRAF (Sıfır Kenar) */
 .entry-image-full {
     width: 100%;
     margin: 0;
     padding: 0;
     border-bottom: 1px solid var(--border-color);
}
/* 5. MOBİL UYUM */
 @media (max-width: 991px) {
     .post-padding-area {
         padding: 1.5rem;
    }
}
/* ========================================= SINGLE POST - FİNAL TEMİZ YAPISI ========================================= */
/* 1. ANA KUTU (Çerçeveli, Padding YOK) */
 .single-post-box {
     border: 1px solid var(--border-color);
     background-color: #fff;
     margin-bottom: 2rem;
     overflow: hidden;
}
/* 2. PADDING ALANLARI (Metinler İçin) */
 .post-padding-area {
     padding-left: 2rem;
     padding-right: 2rem;
}
/* Özel Boşluk Ayarları (2rem Kuralı) */
 .post-padding-area.pt-4 {
     padding-top: 2rem !important;
}
 .post-padding-area.pb-4 {
     padding-bottom: 2rem !important;
}
/* 3. TAM GENİŞLİK ÇİZGİ (Padding Yok) */
 .full-divider {
     width: 100%;
     height: 1px;
     background-color: var(--border-color);
     margin: 0;
    /* Boşlukları padding alanları halledecek */
}
/* 4. FOTOĞRAF (Sıfır Kenar) */
 .entry-image-full {
     width: 100%;
     margin: 0;
     padding: 0;
     border-bottom: 1px solid var(--border-color);
    /* Üst border yok */
     border-top: none !important;
}
/* 5. SIDEBAR BOŞLUK AYARI */
 @media (min-width: 992px) {
     .sidebar-column {
         padding-left: 2rem !important;
        /* Sidebar ile içerik arası */
         border-left: none !important;
        /* Çizgi yok */
    }
}
/* 6. ÖZET STİLİ */
 .entry-lead {
     font-size: 1.25rem;
     line-height: 1.6;
     color: #555;
     font-weight: 400;
}
/* 7. MOBİL */
 @media (max-width: 991px) {
     .post-padding-area {
         padding-left: 1.5rem;
         padding-right: 1.5rem;
    }
     .sidebar-column {
         padding-left: 15px !important;
    }
}
/* ========================================= MOBİL İÇİN FİNAL UYARLAMA (SINGLE PAGE) ========================================= */
 @media (max-width: 991px) {
    /* 1. SIDEBAR'I GİZLE */
     .sidebar-column, .col-lg-3 {
         display: none !important;
    }
    /* 2. KUTU BORDER'LARINI KALDIR & TAM EKRAN YAP */
     .single-post-box {
         border: none !important;
         background: transparent !important;
         margin-bottom: 0 !important;
    }
    /* Container kenar boşluklarını sıfırla ki resim tam yapışsın */
     .container-hype {
         padding-left: 0 !important;
         padding-right: 0 !important;
         width: 100% !important;
         max-width: 100% !important;
    }
     .row {
         margin: 0 !important;
    }
     .col-lg-9 {
         padding: 0 !important;
    }
    /* 3. ÖNE ÇIKAN GÖRSEL (HEADER İLE BİTİŞİK) */
     .entry-image-full {
         border-bottom: none !important;
        /* Alt çizgiyi de kaldırdım, daha akışkan olsun */
         margin-top: 0 !important;
    }
     .entry-image-full img {
         height: auto !important;
        /* Mobilde 500px çok yüksek kalabilir, oto yaptım */
         min-height: 300px;
         object-fit: cover;
    }
    /* 4. METİN ALANI BOŞLUKLARI (YAZILAR İÇERİDE) */
     .post-padding-area {
         padding-left: 1.5rem !important;
        /* Telefondan okuma payı */
         padding-right: 1.5rem !important;
    }
    /* 5. YAZI İÇİNDEKİ FOTOĞRAF & VİDEOLARI EKRANA YAY (BREAKOUT) */
    /* Yazının padding'ini delip ekranın kenarlarına taşır */
     .entry-content img, .entry-content video, .entry-content iframe, .entry-content figure, .wp-block-image, .wp-block-embed {
         width: calc(100% + 3rem) !important;
        /* %100 + (Sol 1.5rem + Sağ 1.5rem) */
         max-width: none !important;
         margin-left: -1.5rem !important;
        /* Sola çek */
         margin-right: -1.5rem !important;
        /* Sağa çek */
         border-radius: 0 !important;
         display: block;
         height: auto;
    }
    /* Video/Iframe yüksekliği için (Youtube vb.) */
     .entry-content iframe {
         min-height: 250px;
    }
    /* 7. DİĞER RÖTUŞLAR */
     .entry-title {
         font-size: 2rem !important;
         line-height: 1.2 !important;
    }
     .full-divider {
         width: calc(100% + 3rem) !important;
         margin-left: -1.5rem !important;
    }
    /* Çizgiler de tam boy */
}
 body .site-footer {
     background-color: #0b0b15 !important;
     color: #fff !important;
}
/* Link renklerini de düzeltelim */
 body .site-footer a, body .site-footer p, body .site-footer h5 {
     color: rgba(255,255,255,0.8) !important;
}
 body .copyright-bar {
     border-top: 1px solid rgba(255,255,255,0.1) !important;
}
/* ========================================= MOBİL İÇİN KESİN ÇÖZÜM: RELATED POSTS (Viewport Width Tekniği - %100 Çalışır) ========================================= */
 @media (max-width: 991px) {
    /* 1. KART YAPISINI HAZIRLA */
     .related-simple-card {
         margin-bottom: 30px !important;
         border: none !important;
         overflow: visible !important;
        /* Fotoğrafın taşmasına izin ver */
    }
    /* 2. FOTOĞRAFI ZORLA TAM EKRAN YAP (SİHİRLİ KOD) */
    /* Container ne kadar dar olursa olsun, bu kod resmi ekran genişliğine yayar */
     .related-simple-img-wrap {
         width: 100vw !important;
        /* Ekran genişliği */
         position: relative;
         left: 50%;
         right: 50%;
         margin-left: -50vw !important;
        /* Ortala ve yay */
         margin-right: -50vw !important;
         border-radius: 0 !important;
         display: block;
    }
     .related-simple-img-wrap img {
         width: 100% !important;
         height: 250px !important;
        /* Yükseklik standardı */
         object-fit: cover !important;
         display: block;
    }
    /* 3. YAZI ALANINI HİZALA */
    /* Resim taştı ama yazı taşmasın, güvenli alanda kalsın */
     .related-content {
         padding-left: 0 !important;
        /* Zaten container padding'i var, eklemeye gerek yok */
         padding-right: 0 !important;
         padding-top: 15px !important;
    }
}
/* ========================================= İÇERİK MEDYA (VIDEO & FOTOĞRAF) DÜZELTMESİ ========================================= */
/* 1. VİDEOLAR (YOUTUBE, VIMEO VB.) */
 .entry-content iframe, .entry-content video, .entry-content embed, .entry-content object {
     width: 100% !important;
    /* Genişliği kutuya yay */
     max-width: 100% !important;
     aspect-ratio: 16/9 !important;
    /* Sinematik oran (Otomatik yükseklik) */
     height: auto !important;
    /* Yükseklik orana göre artsın */
     display: block;
     margin: 2rem 0;
    /* Alt/Üst boşluk */
     border-radius: 0;
    /* Keskin köşe (İstersen 8px yapabilirsin) */
}
/* 2. FOTOĞRAFLAR */
 .entry-content img, .wp-block-image img {
     width: 100% !important;
    /* Kutuyu tam doldur */
     height: auto !important;
    /* Orantılı uzasın */
     max-width: 100% !important;
     display: block;
     margin: 2rem 0;
     object-fit: cover;
    /* Görüntü bozulmasın */
}
/* 3. CAPTION (RESİM ALTI YAZISI) */
 .wp-caption {
     width: 100% !important;
     max-width: 100% !important;
}
/* ========================================= SEÇİM RENGİ (SELECTION COLOR) ========================================= */
 ::selection {
     background-color: var(--primary-color);
     color: #fff;
}
 ::-moz-selection {
     background-color: var(--primary-color);
     color: #fff;
}
/* ========================================= HEADER İLE ÇAKIŞAN ÜST ÇİZGİ İPTALİ ========================================= */
/* Ana içerik kutusunun üst çizgisini kaldır */
 .single-post-box {
     border-top: none !important;
    /* Eğer kutu yukarı kaydıysa, header border'ı ile birleşsin diye margin'i sıfırla */
     margin-top: 0 !important;
}
/* Fotoğrafın da üst çizgisini garantiye alalım */
 .entry-image-full {
     border-top: none !important;
}
/* ========================================= GÖRSEL KAYNAK ETİKETİ (IMAGE CREDIT) ========================================= */
 .entry-image-full {
     position: relative;
    /* İçindeki etiketi konumlandırmak için şart */
}
 .image-source-badge {
     position: absolute;
     bottom: 10px;
     right: 10px;
     background-color: rgba(0, 0, 0, 0.6);
     color: #fff;
     font-size: 0.75rem;
     font-weight: 600;
     text-transform: capitalize;
     letter-spacing: 0.5px;
     padding: 4px 10px;
     border-radius: 4px;
     z-index: 5;
     pointer-events: none;
}
/* Mobilde yazı çok büyükse biraz küçültelim */
 @media (max-width: 991px) {
     .image-source-badge {
         font-size: 0.65rem;
         padding: 3px 8px;
    }
}
/* ========================================= İÇERİK İÇİ GÖRSEL KAYNAK (CAPTION) STİLİ ========================================= */
/* 1. Görsel ve Altyazı Kapsayıcısı (Figure) */
 .entry-content figure {
     margin: 2rem 0;
    /* Üstten ve alttan boşluk */
     width: 100% !important;
}
/* 2. Görsel Ayarı */
 .entry-content figure img {
     margin-bottom: 5px !important;
    /* Resim ile yazı arası minik boşluk */
     width: 100%;
     height: auto;
     display: block;
}
/* 3. Altyazı (Kaynak) Tasarımı */
 .entry-content figcaption {
     font-size: 0.75rem;
    /* Küçük punto */
     color: #999;
    /* Silik gri renk */
     text-align: right;
    /* Sağa yaslı (İmza gibi) */
     font-weight: 700;
    /* Kalın */
     text-transform: uppercase;
    /* Büyük harf */
     letter-spacing: 0.5px;
     display: block;
     font-family: var(--font-main);
    /* İkon Hizalaması */
     display: flex;
     align-items: center;
     justify-content: flex-end;
    /* Sağa yasla */
     gap: 5px;
}
/* 4. Otomatik Kamera İkonu */
/* Sen sadece "Netflix" yazsan bile başına ikon gelir */
 .entry-content figcaption::before {
     content: '\f030';
    /* FontAwesome Kamera İkonu */
     font-family: "Font Awesome 6 Free";
     font-weight: 900;
     color: var(--primary-color);
    /* Temanın mor rengi */
}
/* ========================================= MOBİL İÇİN KESİN ÇÖZÜM: TAM EKRAN MEDYA (Viewport Width Tekniği - %100 Çalışır) ========================================= */
 @media (max-width: 991px) {
    /* 1. KUTU TAŞMASINA İZİN VER */
     .single-post-box, .post-padding-area, .entry-content, .container-hype, body {
         overflow: visible !important;
        /* Taşmaya izin ver */
    }
    /* Yan kaydırmayı sadece BODY ve HTML seviyesinde engelle */
     html, body {
         overflow-x: hidden !important;
         width: 100%;
    }
    /* 2. ANA FOTOĞRAF (HEADER ALTI) */
     .entry-image-full {
         width: 100vw !important;
        /* Ekran genişliği */
         position: relative;
         left: 50%;
         right: 50%;
         margin-left: -50vw !important;
        /* Ortala ve yay */
         margin-right: -50vw !important;
         margin-top: 0 !important;
         border: none !important;
    }
     .entry-image-full img {
         width: 100% !important;
         height: auto !important;
         min-height: 250px;
         object-fit: cover !important;
    }
    /* 3. İÇERİK İÇİNDEKİ RESİM & VİDEOLAR */
     .entry-content img, .entry-content video, .entry-content iframe, .wp-block-image, .wp-block-embed {
         width: 100vw !important;
        /* Ekran genişliği */
         max-width: 100vw !important;
         position: relative;
         left: 50%;
         right: 50%;
         margin-left: -50vw !important;
        /* Sola çek */
         margin-right: -50vw !important;
        /* Sağa çek */
         margin-top: 2rem !important;
         margin-bottom: 2rem !important;
         border-radius: 0 !important;
         display: block;
    }
}
/* ========================================= MASAÜSTÜ KART TASARIMI (GRİ ARKA PLAN) ========================================= */
 @media (min-width: 992px) {
    /* 1. SİTE ARKA PLANINI GRİ YAP */
     body {
         background-color: #f5f5f5 !important;
    }
    /* 2. İÇERİK KUTULARINI BEYAZ YAP (KART EFEKTİ) */
    /* Tekil Yazı Kutusu */
     .single-post-box, 
    /* Son Eklenenler Kutusu */
     #latest-posts-container, 
    /* Sidebar Bileşenleri (Widget) */
     .sidebar-widget, 
    /* Manşet ve Vitrin Kartları */
     .manset-main-block, .manset-sub-item, .manset-style-card, 
    /* Arşiv Kartları */
     .archive-card {
         background-color: #ffffff !important;
        /* İsteğe bağlı: Kartların daha iyi ayrışması için hafif gölge eklenebilir */
        /* box-shadow: 0 2px 10px rgba(0,0,0,0.03);
         */
    }
    /* 3. SIDEBAR BİLEŞENLERİNE KUTU ŞEKLİ VER */
    /* Sidebar artık gri zeminde duracağı için her widget'ın kutu olması lazım */
     .sidebar-widget {
         padding: 20px;
         border: 1px solid var(--border-color);
         margin-bottom: 30px;
        /* Kartlar arası boşluk */
    }
    /* 4. MANŞET ALANI DÜZELTMESİ */
    /* Manşetin arka planını gri yapıp, içindeki kartları beyaz tutuyoruz */
     .manset-container {
         background-color: transparent !important;
    }
}
/* ========================================= MOBİL (BEYAZ ARKA PLAN KORUMASI) ========================================= */
 @media (max-width: 991px) {
    /* Mobilde arka plan bembeyaz kalsın */
     body {
         background-color: #ffffff !important;
    }
    /* Sidebar mobilde zaten gizli ama yine de stilini sıfırlayalım */
     .sidebar-widget {
         background-color: transparent !important;
         border: none !important;
         padding: 0 !important;
    }
    /* Diğer kartların arka planı mobilde önemli değil (Zaten beyaz zemin) */
}
/* ========================================= FİNAL RÖTUŞLAR: SIDEBAR & MANŞET (BORDER FIX) ========================================= */
 @media (min-width: 992px) {
    /* 1. SIDEBAR: KUTU GÖRÜNÜMÜNÜ İPTAL ET */
     .sidebar-widget {
         background-color: transparent !important;
        /* Beyazı kaldır */
         border: none !important;
        /* Çerçeveyi kaldır */
         padding: 0 !important;
        /* İç boşluğu sıfırla */
         box-shadow: none !important;
        /* Varsa gölgeyi al */
         margin-bottom: 40px !important;
        /* Widgetlar arası boşluk */
    }
}
/* ========================================= FOOTER TASARIMI (DARK MODE) ========================================= */
 .site-footer {
     background-color: #0b0b15 !important;
     color: #fff !important;
     padding-top: 5rem;
     padding-bottom: 3rem;
     margin-top: 0 !important;
    /* Üstteki boşluğu sıfırla */
}
/* Başlıklar */
 .footer-title {
     color: #fff;
     font-weight: 800;
     font-size: 1rem;
     letter-spacing: 1px;
     margin-bottom: 1.5rem;
     position: relative;
     padding-bottom: 10px;
}
/* Başlık Altı Mor Çizgi */
 .footer-title::after {
     content: '';
     position: absolute;
     left: 0;
     bottom: 0;
     width: 30px;
     height: 3px;
     background-color: var(--primary-color);
}
/* Linkler */
 .footer-links li {
     margin-bottom: 10px;
}
 .footer-links a {
     color: rgba(255, 255, 255, 0.6) !important;
     text-decoration: none !important;
     font-size: 0.95rem;
     transition: all 0.2s ease;
}
 .footer-links a:hover {
     color: #fff !important;
     padding-left: 5px;
    /* Hoverda sağa kayma efekti */
}
/* Sosyal İkonlar */
 .footer-social a {
     width: 40px;
     height: 40px;
     background-color: rgba(255,255,255,0.1);
     color: #fff !important;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     transition: 0.3s;
}
 .footer-social a:hover {
     background-color: var(--primary-color);
     transform: translateY(-3px);
}
/* Telif Alanı */
 .copyright-bar {
     border-top: 1px solid rgba(255,255,255,0.1);
}
/* Mobilde Footer Ayarı */
 @media (max-width: 991px) {
     .site-footer {
         padding-top: 3rem;
        /* Single sayfasında sticky bar varsa boşluk bırak */
         padding-bottom: 20px;
    }
     body.single .site-footer {
         padding-bottom: 90px !important;
    }
}
/* ========================================= FOOTER GÜNCELLEMESİ (OVAL FORM & IKONLAR) ========================================= */
/* 1. SOSYAL İKONLAR (Header ile Aynı Stil) */
 .footer-social .social-circle {
    /* Header'daki yapıyı kopyaladık */
     width: 35px;
     height: 35px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50% !important;
    /* Tam Yuvarlak */
     font-size: 0.9rem;
     transition: all 0.3s ease;
     text-decoration: none !important;
}
/* Footer için özel renk ayarı (Koyu zemin olduğu için) */
 .footer-social .social-circle.border-white-50 {
     border: 1px solid rgba(255,255,255,0.2) !important;
     color: rgba(255,255,255,0.7) !important;
     background: transparent;
}
 .footer-social .social-circle:hover {
     background-color: var(--primary-color) !important;
     border-color: var(--primary-color) !important;
     color: #fff !important;
     transform: translateY(-3px);
}
/* 2. OVAL E-BÜLTEN KUTUSU (Header Arama Stili) */
 .footer-newsletter-wrapper {
     display: flex;
     align-items: center;
     background-color: #fff;
    /* Beyaz Zemin (Koyu footerda parlar) */
     width: 100%;
     max-width: 300px;
    /* Çok uzamasın */
     border-radius: 50px !important;
    /* OVAL YAPI */
     padding: 3px 5px 3px 20px;
     border: 1px solid transparent;
     transition: all 0.3s ease;
}
 .footer-newsletter-wrapper:focus-within {
     box-shadow: 0 0 0 3px rgba(111, 0, 255, 0.3);
    /* Mor Parlama */
}
/* Input Alanı */
 .footer-newsletter-input {
     border: none;
     background: transparent;
     padding: 10px 0;
     font-size: 14px;
     width: 100%;
     color: #333;
     outline: none;
     font-weight: 500;
}
/* Gönder Butonu */
 .footer-newsletter-btn {
     border: none;
     background: var(--primary-color);
    /* Mor Buton */
     color: #fff;
     width: 40px;
     height: 40px;
     border-radius: 50%;
    /* Yuvarlak Buton */
     cursor: pointer;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: 0.3s;
     margin-left: 5px;
}
 .footer-newsletter-btn:hover {
     background-color: #000;
    /* Siyah hover */
}
/* ========================================= FOOTER DÜZELTMELERİ (İKON BOYUTU & YUVARLAK BUTON) ========================================= */
/* 1. SOSYAL MEDYA İKONLARINI BÜYÜT */
 .footer-social .social-circle {
     width: 45px !important;
    /* 35px'ten 45px'e çıktı */
     height: 45px !important;
     font-size: 1.1rem !important;
    /* İkonu da büyüt */
     border-radius: 50% !important;
    /* Tam yuvarlak olduğundan emin ol */
}
/* 2. E-BÜLTEN BUTONUNU YUVARLAK YAP (Kare Sorunu Çözümü) */
 .footer-newsletter-btn {
     width: 40px !important;
     height: 40px !important;
    /* Kare olmasını engellemek için kesin yuvarlaklık */
     border-radius: 50% !important;
    /* Şeklinin bozulmasını engelle */
     flex-shrink: 0 !important;
     padding: 0 !important;
}
/* ========================================= İLETİŞİM SAYFASI BUTON DÜZELTMESİ ========================================= */
 .contact-email-btn {
     width: auto !important;
     min-width: 280px;
    /* Çok dar olmasın */
     height: 55px !important;
    /* Yükseklik sabitle */
     border-radius: 50px !important;
     background-color: var(--primary-color) !important;
     color: #fff !important;
     font-weight: 800 !important;
     letter-spacing: 0.5px !important;
     font-size: 1.1rem !important;
    /* Hizalama */
     display: inline-flex !important;
     align-items: center !important;
     justify-content: center !important;
     line-height: 1 !important;
     padding: 0 30px !important;
    /* Taşmaları önle */
     white-space: nowrap;
     overflow: hidden;
}
 .contact-email-btn:hover {
     background-color: #000 !important;
    /* Hover rengi siyah */
     color: #fff !important;
     transform: translateY(-2px);
     box-shadow: 0 5px 15px rgba(111, 0, 255, 0.3) !important;
}
 .contact-email-btn i {
     font-size: 1.2rem;
     margin-right: 10px;
}
/* ========================================= İLETİŞİM SAYFASI KESİN DÜZELTME ========================================= */
/* 1. E-POSTA BUTONU (ÖZEL AYAR) */
 .contact-page-btn {
    /* Kutu Yapısı */
     display: inline-flex !important;
     align-items: center !important;
     justify-content: center !important;
    /* Boyutlar */
     height: 60px !important;
    /* Yüksekliği sabitledik */
     padding: 0 40px !important;
    /* Yanlardan boşluk */
     width: auto !important;
     min-width: 280px !important;
    /* Renk ve Stil */
     background-color: var(--primary-color);
     color: #ffffff !important;
     border-radius: 50px !important;
     text-decoration: none !important;
    /* Tipografi */
     font-size: 1.1rem !important;
     font-weight: 800 !important;
     line-height: 1 !important;
    /* Satır yüksekliğini sıfırladık ki kaymasın */
    /* Efekt */
     transition: all 0.3s ease !important;
     box-shadow: 0 4px 15px rgba(111, 0, 255, 0.3) !important;
}
 .contact-page-btn:hover {
     background-color: #000000 !important;
     color: #ffffff !important;
     transform: translateY(-3px);
}
 .contact-page-btn i {
     margin-right: 10px !important;
     font-size: 1.2rem !important;
}
/* Header Sosyal Butonlar - Revize Tasarım */
 .social-circle {
     display: flex !important;
     justify-content: center !important;
     align-items: center !important;
    /* 1. Boyutları Küçülttük (40px'den 32px'e) */
     width: 35px !important;
     height: 35px !important;
    /* 2. Şekil ve Çerçeve */
     border-radius: 50% !important;
     border: 1px solid #eaeaea !important;
    /* Beyaz ince çerçeve */
     background-color: transparent !important;
    /* Arka plan şeffaf */
    /* 3. İkon Rengi */
     color: #0b0b15 !important;
    /* Düzenlemeler */
     text-decoration: none !important;
     transition: all 0.3s ease !important;
    /* Renk değişimi yumuşak olsun */
     margin: 0 !important;
     padding: 0 !important;
}
/* İkonun Boyutu */
 .social-circle i {
     font-size: 14px !important;
    /* Buton küçüldüğü için ikonu da oranladık */
     line-height: 0 !important;
}
/* 4. Hover (Üzerine Gelince) Efekti */
 .social-circle:hover {
     background-color: var(--primary-color) !important;
    /* İstediğin mor renk */
     border-color: var(--primary-color) !important;
    /* Çerçeve de aynı renk olsun */
     color: #ffffff !important;
    /* İkon beyaz kalmaya devam etsin */
}
/* Menü Renk Zorlama Kodu */
 li.mor-link, li.mor-link a, li.mor-link a span, .mor-link, .mor-link > a {
     color: var(--primary-color) !important;
     font-weight:500 !important;
     text-transform: lowercase !important;
}
/* Hover (Üzerine gelince) Rengi */
 li.mor-link:hover a, li.mor-link a:hover, .mor-link:hover > a {
     color: var(--text-color);
     opacity: 1 !important;
}
/* Sadece Anasayfadaki büyük boşlukları azaltır */
 body.home .mt-5 {
     margin-top: 0 !important;
    /* 3rem yerine 1rem yapar (daha az boşluk) */
}
 #cookie-notice .cn-button:not(.cn-button-custom){
    color: #fff !important
}
/* ========================================= MANŞET SAĞ TARAF HOVER DÜZELTMESİ (Bunu dosyanın en altına ekle) ========================================= */
 .manset-sub-item:hover .click-sub-title a {
     color: var(--primary-color) !important;
     transition: color 0.2s ease;
}
/* ========================================= LOGO HÜCRESİ: FINAL CLEAN & ELECTRIC (Önceki tüm boşluk hatalarını sıfırlar) ========================================= */
/* 1. TÜM HÜCREYİ VE İÇ KATMANLARI SIFIRLA (RESET) */
/* Bu kısım boşluğun artmasını engeller */
 .header-cell.logo-cell, .logo-cell .logo-wrapper {
     padding: 0 !important;
    /* Dış boşluk SIFIR */
     margin: 0 !important;
     border: none !important;
    /* Önce border'ı sil, aşağıda temiz vereceğiz */
     background: transparent;
    /* Arka planı temizle */
}
/* 2. ANA HÜCRE KUTUSU */
 .header-cell.logo-cell {
    /* Sağ çizgiyi tekrar ekle */
     border-right: 1px solid var(--border-color) !important;
    /* Animasyon geçiş hızı (Çok seri) */
     transition: background-color 0.2s ease-out;
}
/* 3. LİNK (TIKLANABİLİR ALAN) */
/* 2rem boşluğu SADECE buraya veriyoruz */
 .logo-cell .logo-wrapper a {
     display: flex !important;
     align-items: center !important;
     justify-content: center !important;
     height: 100% !important;
     width: 100% !important;
    /* TEK GEÇERLİ BOŞLUK BURASI: */
     padding-left: 2rem !important;
     padding-right: 2rem !important;
     text-decoration: none !important;
}
/* 4. LOGO GÖRSELİ */
 .header-cell.logo-cell img {
     display: block !important;
     margin: 0 !important;
    /* Resmin kendi boşluğunu sil */
     max-height: 40px !important;
     width: auto !important;
}
/* ========================================= ANİMASYON (FRESH & ELECTRIC) ========================================= */
/* A) KUTU RENGİ (ANINDA DEĞİŞİM) */
 .header-cell.logo-cell:hover {
     background-color: var(--primary-color) !important;
     cursor: pointer;
}
/* B) LOGO REAKSİYONU */
 .header-cell.logo-cell:hover img {
    /* Beyaz yap */
     filter: brightness(0) invert(1) !important;
}
 /* Menü alt çizgi ayarı */
.main-navigation li:hover > a:after, 
.menu li:hover > a:after {
    bottom: -10px !important;
}

/* --- MENÜ FİNAL AYARLARI --- */

.hypetema-menu li.more-btn > a::after {
    display: none !important;
    content: none !important;
    border: none !important;
}

/* --- MANŞET ÜST BOŞLUĞUNU YOK ETME (GAP FIX) --- */
.manset-container {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Manşet ızgarasının (grid) üstündeki margin'i sıfırlar */
.click-mag-grid {
    margin-top: 0 !important; 
    border-top: none !important;
}

/* Eğer mobilde de boşluk varsa onu da alır */
@media (max-width: 991px) {
    .manset-container, .click-mag-grid {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}